:root {
  
  --cty-pnav-link: var(--cms-black); /* var(--cty-pnav-link) nav color */
  --cty-pnav-hover:  var(--cms-navy); /* var(--cty-pnav-hover) nav hover color */ 
  --cty-pnav-dropdown: white; /* var(--cty-pnav-dropdown) dropdown background color */
  --cty-pnav-linework: #ccc;
}

/* mobile nav */

.header-wrap { padding:20px 0; }
.nav-relative { display:block; }
.nav-hold { width:100%; height:50px; }

.nav-logo { float:left; width:220px; height:44px; }
.nav-logo a { display:block; width:220px; height:44px;  }
.nav-toggle a { float:right; font-size:24px; line-height:44px; color:var(--cty-pnav-link); }
.nav-toggle a:hover { color:var(--cty-pnav-hover);  }

#nav-drawer { display:none }

#primary-nav { padding-top:16px; }
#primary-nav ul { margin:0; padding:0; }  
#primary-nav ul li { list-style: none; margin:0; padding:0; width:100%; }
#primary-nav ul li.leaf-search { display:none; }
#primary-nav ul li div.menu-set { display:table; border-top:2px solid var(--cty-pnav-linework); width:100%; }
#primary-nav ul li div.menu-set a {
  display:table-cell;
  width:90%;
  text-align:left;
  vertical-align:top;
  padding:12px 0px;
  color:var(--cty-pnav-link);
  font-size:18px;
  line-height:36px;
  font-weight:700;
  text-transform:uppercase;
  text-decoration:none;
}

#primary-nav ul li div.menu-set a.subnav-toggle { width:10%; text-align:right; }
#primary-nav ul li div.menu-set a:hover { color:var(--cty-pnav-hover); }

#primary-nav ul ul { 
  display:none; 
  margin:0; 
  padding:8px 0px 24px 0px; 
  text-align:left; 
}

#primary-nav ul li ul li a { /*dropdowns*/
  display: block;
  padding:10px 4px 10px 20px;
  font-size:18px;
  line-height:1.1rem;
  font-weight:400;
  text-transform:none;
  color:var(--cty-pnav-link);
  text-decoration:none;
}

#primary-nav ul li ul li a:hover { color:var(cc-pnav-hover); }

#secondary-nav { display:table; width:100%; margin:2rem 0 0 0; padding-bottom:10px; }
.nav-weather { display:table-cell; width:96px; height:50px; vertical-align:middle; }
.nav-search { display:table-cell; width:auto; height:50px; vertical-align:middle; }

.nav-weather-pill { background-color:#206b97; color:white; border-radius:32px; width:80px; font-size:14px; line-height:50px; font-weight:700; text-align:center; }


#site-search {
  display:table;
  width:100%;	
  padding:0px 20px;
  margin:0;
  border:2px solid #206b97;
  text-align:left;
  background-color:transparent;
  border-radius:60px;
}

#site-search input[type="text"]{
  display:table-cell;	
  font-size:18px;
  line-height:50px;
  color:#206b97;
  background:transparent;
  border:none;
  padding:0;
  margin:0;
  width:90%;
  text-align:left;  
  vertical-align:middle;
  outline:0;
}

#site-search button {
  display:table-cell;
  font-size:18px;
  line-height:50px;
  color:#206b97;
  background:transparent;
  border:none;
  margin:0;
  padding:0;
  width:10%;
  text-align:right;
  vertical-align:middle;
}

#site-search ::-webkit-input-placeholder { color:#206b97; opacity: 1; }
#site-search :-moz-placeholder { color:#206b97; opacity: 1; }
#site-search ::-moz-placeholder { color:#206b97; opacity: 1; }
#site-search :-ms-input-placeholder { color:#206b97; opacity: 1; }


/* desktop nav */
@media all and (min-width: 992px) {
  
  .header-wrap { padding:0; }
  .nav-relative { position:relative; width:100%; height:230px; }
  .nav-hold { display:block; position:absolute; top:40px; left:50%; width:500px; height:110px; }
  .nav-logo { margin-left:-250px; width:500px; height:110px; }
  .nav-logo a { display:block; width:500px; height:110px; }
  .nav-toggle { display:none; }


   #nav-drawer { display:block!important; } /* slidetoggle fix */
  
  /* primary-nav */
   
  #primary-nav { position:absolute; top:173px; right:0px; width:100%; padding:0; border-top:1px solid var(--cms-blue-lt);  }
  #primary-nav ul { display:block; text-align:center; margin:0; padding:0; }
  #primary-nav ul li { display:inline-block; width:auto; font-size:0; line-height:1; vertical-align: top; }
  #primary-nav ul li div.menu-set { display:table; border:none; width:auto; }
  #primary-nav ul li div.menu-set a {
    width: auto;
    padding: 10px 22px 10px 22px;
    font-size:18px;
    line-height:36px;
  }
  
  #primary-nav ul li div.menu-set a.subnav-toggle { display:none; }
  #primary-nav ul li div.menu-set:hover a { color:var(--cty-pnav-hover); }

  #primary-nav ul li:hover a { background-color:var(--cty-pnav-dropdown); }
  #primary-nav ul li a:hover { color:var(--cty-pnav-hover); }

  /* drop down lists */

  #primary-nav ul li ul { 
    position: absolute;
    width: 220px;
    height:auto;
    padding:10px 0px 20px 0px;
    background-color:var(--cty-pnav-dropdown);
    display:none;
    border:1px solid var(--cms-blue-lt);
    border-top:1px solid white;
  }

  #primary-nav ul li:hover > ul { display:block !important; left: auto; z-index:9999; } 
  @media all and (min-width: 992px) { #primary-nav li:last-child:hover > ul { right:0px; } }
  
  #primary-nav ul li ul li { width:200px; }
  #primary-nav ul li ul li a { 
    width:100%;
    padding:6px 24px;
    background-color:var(--cty-pnav-dropdown);
  }


  /* secondary nav */


  
   #secondary-nav { position:none; top:0px; right:0px; display:block; width:100px; margin:0; padding:0; }
  .nav-weather { position:absolute; display:block; top:40px; left:30px; width:96px; height:30px;  }
  .nav-search { position:absolute; display:block; top:40px; right:30px; width:200px; }

  .nav-weather-pill { background-color:#206b97; color:white; border-radius:32px; width:80px; font-size:12px; line-height:30px; font-weight:700; text-align:center; }


#site-search {
  display:table;
  width:100%;	
  padding:0px 20px;
  margin:0;
  border:2px solid #206b97;
  text-align:left;
  background-color:transparent;
  border-radius:60px;
}

#site-search input[type="text"]{
  display:table-cell;	
  font-size:14px;
  line-height:30px;
  color:#206b97;
  background:transparent;
  border:none;
  padding:0;
  margin:0;
  width:calc(100% - 30px);
  text-align:left;  
  vertical-align:middle;
  outline:0;
}

#site-search button {
  display:table-cell;
  font-size:14px;
  line-height:30px;
  color:#206b97;
  background:transparent;
  border:none;
  margin:0;
  padding:0;
  width:10%;
  min-width:30px;
  text-align:right;
  vertical-align:middle;
}

#site-search ::-webkit-input-placeholder { color:#206b97; opacity: 1; }
#site-search :-moz-placeholder { color:#206b97; opacity: 1; }
#site-search ::-moz-placeholder { color:#206b97; opacity: 1; }
#site-search :-ms-input-placeholder { color:#206b97; opacity: 1; }

}
