/* ================================================================
Global Elements for HNTB.com --- Header/Navigation/Footer
================================================================ */




/* HEADER & NAVIGATION
============================================================================== */

.site-header {
    padding: 0;
  }

  #headSection {
    /*border-bottom: solid 1px #fff;*/
    position: relative;
    z-index: 50;
  }

  #navLogo {
    width: 114px;
    display: block;
    position: absolute;
    left: 15px;
  }

  .main-navigation {
    clear: none;
    margin: 0 0 0 0px;
    padding: 0;
    width: 100%;
    float:right;
    max-width: 566px;
    line-height: 1;
    margin-bottom: -2px;
  }

  .main-navigation li {
    line-height: 32px;
    font-size: 15px;
    font-family: "Interstate Light", Arial, sans-serif;
    font-weight: 300;
    /* padding: 0 15px 24px;*/
    margin-left: 0px;
    margin-right: 0px;
    position: relative;
  }

  .main-navigation li:hover a {
    background-color: transparent;
  }

  .main-navigation a {
    padding: 0 10px 24px;
    /* margin-left: 10px;
    margin-right: 10px; */
    transition: none;
    width: 100%;
    height: 100%;
    display: block;
    color:#1b242a;
  }

  .main-navigation .current_page_item a,
  .main-navigation .current-menu-item a,
  .main-navigation .current-menu-parent > a,
  .main-navigation ul.nav-menu a:hover,
  .main-navigation ul.nav-menu a:focus {
    background-color: transparent;
    /* border-bottom: solid 7px #f9461c; */
    /* padding-bottom: 15px; */
  }

  .main-navigation ul.nav-menu li a {
    position: relative;
  }

  .main-navigation ul.nav-menu > li > a {
    font-family: "Interstate Light", Arial, sans-serif;
    text-transform: none;
    font-weight: 300;
    color:#1b242a;
  }

  .main-navigation ul.nav-menu li:hover a::after {
    border-bottom: solid 3px #D2A71F;
    content: '';
    position: absolute;
    width: inherit;
    height: 7px;
    display: block;
    bottom: 2px;
    left: 0;
    z-index: 400;
  }

  .main-navigation ul.nav-menu li.current_page_item a::after,
  .main-navigation ul.nav-menu li.current_page_parent a::after {
    border-bottom: solid 3px #D2A71F;
    content: '';
    position: absolute;
    width: inherit;
    height: 7px;
    display: block;
    bottom: 2px;
    left: 0;
    z-index: 400;
  }

  .nav-wrap {
    background-color: #fff; /* set nav background */
    /* height: 80px; */
    padding: 24px 0 0;
  }



  /* Sub-nav (Drop-down)
  ================================================================================= */

  /* Sets the underline for the Parent Nav element when hovering over the drop-nav */
  /* Careers */
  /* .main-navigation ul li:first-child ul:hover::before {
    content: "";
    display: block;
    border-bottom: solid 7px #f9461c;
    position: relative;
    top: -8px;
    width: 113px;
    margin-bottom: -7px;
  } */

  /* Expertise */
  /* .main-navigation ul li:nth-child(2) ul:hover::before {
    content: "";
    display: block;
    border-bottom: solid 7px #f9461c;
    position: relative;
    top: -8px;
    width: 131px;
    margin-bottom: -7px;
  } */

  /* About */
  /* .main-navigation ul li:nth-child(3) ul:hover::before {
    content: "";
    display: block;
    border-bottom: solid 7px #f9461c;
    position: relative;
    top: -8px;
    width: 96px;
    margin-bottom: -7px;
  } */

  .main-navigation ul ul {
    top: 54px;
    margin-left: 0px;
    border-top: solid 1px #fff;
    background-color: rgba(255,255,255,80%);
  }




  .main-navigation ul ul a {
    border-left: none;
    margin: 5px 25px;
    /*padding: 5px 25px;*/
    line-height: 20px;
    width: 230px;
    transition: none;
    font-family: "Interstate Light", Arial, sans-serif;
    font-weight: 300;
  }

  .main-navigation .current_page_item ul.sub-menu a {
    border-bottom: none;
    padding: 5px 0px;
  }

  .main-navigation ul.sub-menu li.current-menu-item a,
  .main-navigation ul.sub-menu li.current_page_item a {
    border-bottom: none;
    color:#1b242a;
    font-weight:400;
    font-family: "Interstate", Arial, sans-serif !important;
    /*padding: 5px 25px;*/
  }

  .main-navigation ul ul li {
    font-size: 1.5rem;
  }

  .main-navigation ul ul li:first-child {
    margin-top: 20px;
  }

  .main-navigation ul ul li:last-child {
    margin-bottom: 20px;
  }

  .main-navigation ul.nav-menu ul li a:hover {
    border: none;
    color:#1b242a;
    /*padding: 5px 25px;*/
    font-family: "Interstate Light", Arial, sans-serif;
    text-decoration-line: underline;
    text-decoration-thickness: 3px;
    text-decoration-color:#D2A71F;
    text-underline-offset:5px;
  }

  .main-navigation ul ul :hover > a {
    padding-left: 15px;
  }

  .main-navigation ul.nav-menu li:hover ul.sub-menu a::after {
    display: none;
  }


  /* Secondary Nav
  ===================================================================== */

  #secondary-nav {
    position: absolute;
    top: -6px;
    right: 43px;
    z-index: 100;
    width: 405px;
    display: block;
    padding: 0;
    margin: 0;
    height: 60px;
  }

  #secondary-nav h3 {
    display: none;
  }

  ul#menu-secondary-nav {
    display: block;
    height: 44px;
  }

  ul#menu-secondary-nav li {
    float: left;
    margin-left: 15px;
    color: #fff;
    border-bottom: 0;
    font-size: 15px;
  }

  ul#menu-secondary-nav li:first-child {
    margin-left: 0;
  }

  ul#menu-secondary-nav li a {
    color:#1b242a;
    text-transform: uppercase;
    transition: none;
    padding-left: 10px;
    padding-right: 10px;
    font-family: "Interstate Light", Arial, sans-serif;
    font-weight: 300;
    padding-bottom: 30px;
    position: relative;
  }

  ul#menu-secondary-nav li:hover a::after,
  ul#menu-secondary-nav li.current_page_item a::after {
    content: '';
    border-bottom: solid 7px #fff;
    position: absolute;
    width: 100%;
    height: 7px;
    bottom: 0;
    left: 0;
  }

  #mobileLogo {
    display: none;
  }

  /* Hide the secondary nav items in the primary nav on desktop because of the different styling, then show on mobile. Show the secondary nav on desktop and then hide on mobile. */
  /* Hide main-navigation secondary items on desktop. */
  .main-navigation li.secondary-nav-item {
    display: none;
  }

  /* Header and Nav Breakpoints
  ========================================================================== */

  @media screen and (max-width: 1040px) {
    #secondary-nav {
      position: absolute;
      top: 56px;
      width: 100%;
      height: 44px;
      right: 0;
    }

    ul#menu-secondary-nav {
      margin: -25px 0 0 0;
      padding: 0;
      display: block;
      right: 0;
      float: right;
    }

    .secondary-band {
      display: block;
      width: 100%;
      background: #1b242a;
      content: "";
      height: 41px;
    }

    ul#menu-secondary-nav li a {
      padding-bottom: 11px;
    }
  }

  @media screen and (max-width: 700px) {
    /* Hide secondary stand-alone menu */
    #secondary-nav {
      display: none;
    }

    /* Make slicknav fixed on mobile devices */
    .slicknav_menu {
      display: block;
      position: fixed;
      width: 100%;
      top: 0;
      z-index: 40;
      padding: 5px 0 0 0;
      background-color: #fff;
    }

    .slicknav_menu .slicknav_btn {
      margin-right: 20px;
      background-color: transparent;
    }

    .slicknav_menu ul.slicknav_nav {
      background: #c9cac8;
    }

    .nav-wrap.sticky-nav {
      top: 23px;
      z-index: 40;
    }

    .slicknav_nav:before {
      content: '';
      width: 93%;
      height: 1px;
      /*border-top: solid 1px #FFF;*/
      display: block;
      margin: 0 auto;
    }

    .slicknav_nav {
      position: relative;
      top: 5px;
    }

    .slicknav_nav li {
      width: 93%;
      margin: 0 auto;
      padding: 0;
      border-bottom: solid 1px #FFF;
    }

    .slicknav_nav li:last-child {
      border-bottom: none;
    }

    .slicknav_menu a,
    .slicknav_menu a:visited,
    .slicknav_menu a:hover,
    .slicknav_menu a:focus,
    .slicknav_menu li.current-menu-item a,
    .slicknav_menu li a:hover,
    .slicknav_menu .slicknav_row:hover {
      color: #1b242a;
    }

    .slicknav_menu .slicknav_nav a {
      font-size: 20px;
    }

    .slicknav_nav > .menu-item > a{
      padding: 5px 0;
      margin:2px 0;
    }

    .slicknav_menu li.current-menu-item a,
    .slicknav_menu li a:hover,
    .slicknav_menu .slicknav_row:hover {
      background-color: transparent;
      color: #1b242a;
    }

    .slicknav_nav .secondary-nav-item a,
    .slicknav_nav .secondary-nav-item a:hover,
    .slicknav_nav .secondary-nav-item a:visited,
    .slicknav_nav .secondary-nav-item a:focus {
      color: #5482ab;
    }

    .slicknav_nav .slicknav_row,
    .slicknav_nav .secondary-nav-item a {
      margin: 0;
      padding: 9px 0;
      font-size: 17px;
    }

    /* Set current page style */
    .slicknav_menu li.current-menu-item a {
      background-color: transparent;
    }

    /* Arrows */
    .slicknav_menu a .slicknav_arrow {
      float: right;
      color: #898989;
      position: relative;
      top: 6px;
    }

    .slicknav_menu a .slicknav_arrow i.fa {
      font-size: 18px;
    }

    /* Drop-down sub menu */
    .slicknav_nav ul.sub-menu {
      margin: 0 0 12px 0;
    }

    .slicknav_nav ul.sub-menu li {
      border-bottom: none;
      width: 100%;
    }

    .slicknav_nav ul.sub-menu li a {
      font-size: 17px;
    }

    .slicknav_menu .slicknav_icon-bar {
      background-color: #272727;
    }
    .slicknav_menu .slicknav_btn, .slicknav_menu .slicknav_btn:hover .slicknav_icon-bar{
      background-color: #fff;
    }

    .slicknav_menu .slicknav_icon-bar{
      -webkit-box-shadow: unset;
      -moz-box-shadow: unset;
      box-shadow: unset;
    }



    .nav-wrap {
      top: 23px;
      /* height: 69px; */
      padding: 24px 0 0;
      position: fixed;
      z-index: 40;
      width: 100%;
      display: block;
    }

    #headSection {
      height: 0;
    }

    #navLogo {
      top: -38px;
      width: 75px;
      display: none;
    }

    #mobileNav {
      position: relative;
    }

    #mobileLogo {
      width: 75px;
      position: fixed;
      top: 13px;
      left: 30px;
      display: block;
      z-index: 100;
    }

    .secondary-band {
      /* top: 45px;
      left: 0;
      position: fixed;
      width: 100%; */
      display: none;
    }

    #secondary-nav {
      top: 0;
      left: 0;
    }
  }

    /* ul#menu-secondary-nav {
      float: left;
      line-height: 27px;
      padding-left: 10px;
    }

    ul#menu-secondary-nav li {
      margin-left: 5px;
      font-size: 14px;
    }

    ul#menu-secondary-nav li a {
      padding-bottom: 15px;
    }

    ul#menu-secondary-nav li:first-child {
      margin-left: -6%;
    }
  }

  @media screen and (max-width: 370px) {
    ul#menu-secondary-nav li a {
      font-size: 12px;
      padding-left: 6px;
      padding-right: 6px;
    }
  } */


@media screen and ( max-width: 700px ) {
  /* Adjust mobile nav when logged in as admin */
  .nav-wrap.adminSpacing {
    top: 69px;
  }

  .nav-wrap.adminSpacing #mobileLogo {
    top: 60px;
  }

  .nav-wrap.adminSpacing #mobileHeader .slicknav_menu {
    top: 46px;
  }

  .nav-wrap.adminSpacing #searchBttn {
    top: 61px;
  }

  .nav-wrap.adminSpacing.sticky-nav {
    top: 69px;
  }

  /* .nav-wrap.adminSpacing.sticky-nav #mobileLogo {
    top: 14px;
  }

  .nav-wrap.adminSpacing.sticky-nav #mobileHeader .slicknav_menu {
    top: 0px;
  }

  .nav-wrap.adminSpacing.sticky-nav #searchBttn {
    top: 16px;
  } */
}


  /* Search Button & Search Bar
  =========================================================================== */

  /*#searchBttn{*/
  /*  display: inline-block;*/
  /*  float: left;*/
  /*  position: relative;*/
  /*  top: 6px;*/
  /*  left: 15px;*/
  /*  font-weight: bold;*/
  /*  color:#1b242a;*/
  /*  !* transition: all 0.3s; *!*/
  /*}*/

  #searchBttn{
    display: inline-block;
    float: right;
    position: absolute;
    top: 6px;
    left: unset;
    right:0;
    font-weight: bold;
    color:#1b242a;
    /* transition: all 0.3s; */
  }



  #searchBttn:hover,
  #searchBttn_mobile:hover{
    cursor: pointer;
    color: #cdcdcd;
  }

  #searchBttn_mobile{
    display:none;
  }

  /*@media screen and (min-width: 927px) {*/
  /*  #searchBttn_mobile{*/
  /*    display:none;*/
  /*  }*/
  /*}*/
  @media screen and (max-width: 700px) {
    #searchBttn_mobile{
      display:block;
      left:unset;
    }
  }

.admin-bar #searchBttn_mobile{
  top:60px;
}

  #search {
    display: none;
    margin: 0 auto;
    background: #1b242a;
    padding: 30px;
    z-index: 999;
  }
  #search.showSearch {
    display: block;
  }

  .widget_search input {
    /* Search Input */
    display: inline-block;
    width: 92%;
  }

  input[type="search"] {
    border-radius: 0 !important;
    border: none;
  }

  .widget_search .search-submit {
    /* Submit Bttn */
    display: inline-block;
    width: 40px;
    padding: 8px 4px;
    margin-left: 0px;
    background: transparent;
    border: solid 1px #fff;
    transition: all 0.3s;
  }

  #search.widget_search input[type="submit"].search-submit:hover {
    border: solid 1px #cdcdcd;
    color: #cdcdcd;
    background-color: transparent;
  }

  @media screen and (max-width: 926px) {
    #search.widget_search input.search-field {
      width: 89%;
    }
  }

  @media screen and (max-width: 754px) {
    #search.widget_search input.search-field {
      width: 84%;
    }
  }

  @media screen and (max-width: 700px) {
    #searchBttn,
    #searchBttn_mobile{
      top: 16px;
      right: 70px;
      z-index: 110 !important;
      position: fixed;
      display: block;
    }

    #search.widget_search {
      width: 100%;
      margin: 0 auto;
      padding: 10px 30px;
      top: 0px;
      text-align: center;
    }

    #search.widget_search input.search-field {
      width: 75%;
    }
  }

  /* FOOTER
  ============================================================================== */

  footer {
    position: relative;
  }
  .footer-bottom {
    background: #c9cac8;
    padding-bottom: 30px;
  }

  .footer-bottom #footerLogo {
    width: 110px;
    display: block;
    float: left;
    margin: 70px 15px 0 0;
  }

  .site-footer .widget-title {
    display: none;
  }

  ul#menu-footer-nav {
    display: inline-block;
    text-align: left;
    width: auto;
    position: relative;
    top: 57px;
  }

  ul#menu-footer-nav li {
    margin-left: -4px;
  }

  ul#menu-footer-nav li a,
  .footer-bottom ul.menu li.current_page_item a {
    color: #1b242a;
    text-transform: uppercase;
    background: transparent;
  }

  ul#menu-footer-nav li a:hover {
    background: transparent;
    color: #1b242a;
    opacity:.5;
  }

  ul#menu-footer-nav li:after {
    content: "|";
    display: inline-block;
    margin-left: 5px;
  }

  ul#menu-footer-nav li:last-child::after {
    content: "";
  }

  .site-footer .widget_nav_menu li a {
    background: none;
  }

  .widget ul li {
    border: none;
  }

  .footer-bottom {
    border-top: 0;
  }

  .footer-bottom ul.menu li a {
    font-size: 13px;
  }

  .footer-bottom .copyrightTxt p {
    color: #1b242a;
    font-size: 12px;
    margin-top: 20px;
  }

  .footer-bottom .copyrightTxt a {
    color: #1b242a;
  }

  .footer-bottom .copyrightTxt a:hover {
    color: #1b242a;
    opacity:.5;
  }

  .footer-bottom .bottomBrdr {
    border-bottom: solid 1px #fff;
    padding-bottom: 70px;
  }

  .footer-bottom .apps {
    position: absolute;
    top: 38px;
    right: 0;
    border: solid 0px #fff;
    padding: 14px;
  }

  .footer-bottom .apps ul {
    margin: 0 0 -5px 0;
    padding: 0;
  }

  .footer-bottom .apps ul li {
    display: inline-block;
    margin-bottom: 0;
  }

  .footer-bottom .apps ul li:first-child {
    border-right: solid 0px #fff;
    padding-right: 16px;
    height: 60px;
  }

  .footer-bottom .apps ul li i.fab {
    font-size: 40px;
    top: -17px;
    left: 10px;
    position: relative;
  }

  .footer-bottom .apps ul li:last-child {
    position: relative;
    left: 10px;
    padding-right: 20px;
    top: 1px;
  }

  .footer-bottom .apps ul li a {
    color: #1b242a;
  }

  .footer-bottom .newsletter {
    display: block;
    position: absolute;
    right: 0;
    top: 57px;
  }

  .footer-bottom .newsletter a {
    border: solid 1px transparent;
    padding: 6px 12px;
    color: #1b242a;
    text-transform: uppercase;
    transition: 0.3s;
    font-size: 14px;
    display: block;
    background-color: #5482ab;
    max-width: 300px;
  }

  .footer-bottom .newsletter a:hover {
    background-color: transparent;
    border: solid 1px #FFF;
  }

  .footer-bottom .newsletter p {
    padding: 0;
    margin: 0;
    color: #1b242a;
    font-weight: 500;
    font-size: 13px;
  }

  .footer-bottom .newsletter input.getEmail {
    display: inline-block;
    width: 220px;
    height: 52px;
    border-radius: 0;
    color: #333;
    font-size: 13px;
    border: solid 1px #fff;
  }

  .footer-bottom .newsletter input.getEmail::placeholder {
    color: #1b242a;
  }

  .footer-bottom .newsletter input.getEmailBttn {
    display: inline-block;
    height: 52px;
    background-color: transparent;
    border: solid 1px #fff;
    width: 45px;
    position: relative;
    top: 1px;
  }

  .footer-bottom .socialMedia {
    position: absolute;
    top: 14px;
    right: 0;
  }

  .footer-bottom .socialMedia ul li {
    display: inline-block;
    margin-left: 20px;
  }

  .footer-bottom .socialMedia ul li a {
    color: #1b242a;
    font-size: 22px;
  }

  .footer-bottom .socialMedia ul li a:hover {
    color: #1b242a;
    opacity:.5;
  }

  @media screen and (max-width: 1200px) {
    .footer-bottom {
      height: 360px;
    }

    .footer-bottom .newsletter {
      position: relative;
      float: right;
    }
  }

  @media screen and ( max-width: 900px ) {
    .footer-bottom .apps {
      position: relative;
      left: 0;
      right: unset;
      display: inline-block;
    }
  }

  @media screen and (max-width: 767px) {
    .footer-bottom {
      height: 500px;
    }

    .footer-bottom .apps {
      left: 50%;
      margin-left: -117px;
    }

    ul#menu-footer-nav {
      top: 71px;
    }

    .footer-bottom .socialMedia {
      position: relative;
      width: 264px;
      margin: 0 auto;
    }

    .footer-bottom .socialMedia ul {
      margin-left: 0;
    }
  }

  @media screen and (max-width: 642px) {
    .footer-bottom {
      height: 550px;
      padding-bottom: 60px;
    }

    .footer-bottom::after {
      content: "";
      display: block;
      clear: both;
    }

    .footer-bottom #footerLogo {
      margin: 30px 0 0 -55px;
      position: relative;
      width: 110px;
      display: block;
      left: 50%;
    }

    .footer-bottom .apps {
      position: relative;
      width: 207px;
      left: 50%;
      margin-left: -103px;
    }

    .footer-bottom .newsletter {
      position: relative;
      clear: both;
      float: none;
      margin-top: 20px;
      display: block;
      width: 271px;
      left: 50%;
      margin-left: -135px;
    }

    .footer-bottom .copyright {
      margin-bottom: 30px;
      display: block;
    }
  }

  @media screen and (max-width: 566px) {
    ul#menu-footer-nav {
      position: relative;
      top: 20px;
      width: 100%;
      text-align: center;
    }

    .footer-bottom .apps,
    .footer-bottom .newsletter {
      top: -12px;
    }

    .footer-bottom .bottomBrdr {
      padding-bottom: 30px;
    }
  }



/* Share Button
============================================================== */
#dpsp-floating-sidebar {
  top: 25% !important;
  z-index: 20;
}

#dpsp-floating-sidebar .shareBttn {
  display: block;
  background: #5482ab;
  color: #FFF;
  z-index: 40;
  text-transform: uppercase;
  font-size: 10px;
  text-align: center;
  width: 40px;
  height: 40px;
  line-height: 40px;
  cursor: pointer;
}

#dpsp-floating-sidebar .dpsp-networks-btns-sidebar {
  display: none;
}

/* Color over-rides */
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-facebook,
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-twitter,
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-linkedin,
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-email {
  background: #5482ab !important;
  border-color: #5482ab !important;
}

.dpsp-network-btn:hover .dpsp-network-icon:before, .dpsp-network-btn:hover .dpsp-network-icon:after {
  color: #c9cac8;
}

@media screen and ( max-width: 700px ) {
  #dpsp-floating-sidebar {
    top: 35% !important;
  }
}
