/***
  *   NAVIGATION
  ***/


  /***NAV BANNER***/

  #nav-banner {
    border-top: 3px solid #e2383f;
    max-height: 75px;
    position: fixed;
    text-align: right;
    color: #ffffff;
    z-index: 1000;
    width: 100%;
    top: 0;
    transition: background-color .25s, box-shadow .5s, border-bottom .5s, max-height .75s;
    -webkit-transition: background-color .25s, box-shadow .5s, border-bottom .5s, max-height .75s;
    -moz-transition: background-color .25s, box-shadow .5s, border-bottom .5s, max-height .75s;
    -o-transition: background-color .25s, box-shadow .5s,  border-bottom .5s, max-height .75s;
  }
  #nav-banner.opaque{
    background-color: #fff;
    color:#333;
    border-color:#e2383f;
    border-bottom: 1px solid rgba(40,40,40,.15);
    /*box-shadow: 1px 1px 10px rgba(51,51,51,.1);*/
  }


  #nav-banner.opaque.show-scroll{
    max-height:200px;
    background-color:rgba(251,251,251,.95);
  }
  #nav-banner.opaque.show-scroll.expanded{
    max-height:600px;
  }
  #nav-banner-logo {
    display: inline-block;
    text-align:left;
    width: 6%;
    height: 60px;
  }

  #nav-banner-logo img {
      max-height: 55px;
      margin-top: 10px;
      margin-left: 5px;
      transition:max-height .5s;
      -webkit-transition:max-height .5s;
      -moz-transition:max-height .5s;
      -o-transition:max-height .5s;
  }

  #left-nav {
    display: inline-block;
    text-align:left;
    width: 75%;
    height: 100%;
    vertical-align: top;
    color: inherit;
  }

  #right-nav{
    display:inline-block;
    width:18%;
    text-align:right;
    height:100%;
    vertical-align: top;
    color:inherit;
  }

  #left-nav nav {
    position: relative;
    height: 100%;
  }

  nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    height: 100%;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -o-transition: all .25s;
  }


  /***TOP LEVEL NAV***/

  .top-level-nav, .button-nav{
    display: inline-block;
    width: inherit;
    max-height: 75px;
    color: inherit;
    font-size: 1em;
    vertical-align: top;
    padding: 0 15px 0 15px;
    transition:background-color .25s, max-height .5s;
    -webkit-transition:background-color .25s, max-height .5s;
    -moz-transition:background-color .25s, max-height .5s;
    -o-transition:background-color .25s, max-height .5s;
  }
  .top-level-nav:hover {
    background-color: #e2383f;
    color: #ffffff;
    cursor:pointer;
  }

  .top-level-nav>a, .top-level-nav>span{
    display: block;
    font-family: 'Raleway', sans-serif;
    margin-top: 65px;
    font-size: 1.2em;
    font-weight:400;
    text-decoration: none;
    color: inherit;
    line-height: 1.4em;
    transform: translate(0, -100%);
    -webkit-transform: translate(0, -100%);
    -moz-transform: translate(0, -100%);
    -o-transform: translate(0, -100%);
  }

  .top-level-nav>a:hover, .top-level-nav>span:hover {
    color: #0a3055;
  }

  .top-level-nav ul, .button-nav ul {
    position: absolute;
    visibility: hidden;
    width: inherit;
    top: 100%;
    opacity: 0;
    z-index:1000;
    min-width: 18%;
    font-size: 1em;
    transition: opacity .25s;
    -webkit-transition: opacity .25s;
    -moz-transition: opacity .25s;
    -o-transition: opacity .25s;
  }
  .top-level-nav:hover ul, .button-nav:hover ul {
    opacity: 1;
    visibility: visible;
  }
  .top-level-nav span.font-xsmall {
      font-size: .8em;
      line-height: 1em;
  }
  .top-level-nav .rel-wrapper {
      position: relative;
      width: 75px;
      height: 75px;
  }

  .top-level-nav>a, .top-level-nav>span {
      font-size: .9em;
  }
  .top-level-nav ul .second-level-nav:first-child, .button-nav ul .second-level-nav:first-child {
      margin-top: 0;
      border-top: 1px solid rgba(226, 56, 63, .5);
  }
  iframe.goog-te-menu-frame.skiptranslate {
        overflow: scroll !important;
      box-shadow: none !important;
      border: 1px solid rgba(40,40,40,.3) !important;
      top: 77px !important;
      right: 0 !important;
      left: auto !important;
      border-left: 5px solid #e2383f !important;
      border-top: 1px solid rgba(226, 56, 63, .5)!important;
      border-bottom: 1px solid rgba(226, 56, 63, .5)!important;
      border-right: 1px solid rgba(226, 56, 63, .5)!important;
  }
iframe.goog-te-menu-frame.skiptranslate html body .goog-te-menu2 {
    border: none !important;
    overflow: scroll !important;
  }
  iframe .goog-te-menu2-item span.text {
    font-family: 'Raleway', sans-serif !important;
    color: #404040 !important;
    font-weight: 300 !important;
    transition:all .25s !important;
    -webkit-transition:all .25s !important;
    -moz-transition:all .25s !important;
    -o-transition:all .25s !important;
}
iframe .goog-te-menu2-item span.text:hover{
  color:#1a79af !important;
  background-color:#eaeaea !important;
}
  /***RIGHT NAV***/
  .right-nav-button {
    display: inline-block;
    vertical-align: top;
    padding:0 3%;
    text-align: center;
    height:75px;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -o-transition: all .25s;
}
#quick-links, #translate-button{
  width:27%;
}
#search-button{
  width:28%;
}
#translate-button li.button-nav {
    padding: 0;
}
.right-nav-button:hover{
  background-color:#e2383f;
  color:#ffffff;
  cursor:pointer;
}
li.button-nav {
    list-style: none;
    height: 75px;
}
li.button-nav .inner-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
  }
  .button-nav span.font-xsmall {
    text-transform: capitalize;
    font-size: .7em;
}
.button-nav .fa-2x{
  font-size:2.5em;
}
#search-button {
    margin-right: 0;
}
  /***QUICK LINKS***/
  #quick-links{
    text-transform:capitalize;
    display:inline-block;
    vertical-align:top;
  }
  #quick-links>nav {
      position: relative;
  }
  #quick-links li.button-nav {
      transition: color .25s;
      -webkit-transition: color .25s;
      -moz-transition: color .25s;
      -o-transition: color .25s;
  }
  #quick-links .button-nav ul {
      left: 0;
      width:75%;
  }
  #quick-links .button-nav ul .second-level-nav {
      border-right: 1px solid rgba(40,40,40,.15);
      border-left: 3px solid #e2383f;
  }
  #quick-links .button-nav ul .second-level-nav {
    border-right: 1px solid rgba(40,40,40,.15);
    margin-left: 0;
    text-align: left;
    border-left: 3px solid #e2383f;
  }
/***TRANSLATE BUTTON***/
#translate-button{
  display:inline-block;
  vertical-align: top;
}


  /***SEARCH BUTTONS***/
  #mobile-hamburger {
      display: inline-block;
      padding: 0 20px;
      height: 75px;
      transition:background-color .25s;
      -webkit-transition:background-color .25s;
      -moz-transition:background-color .25s;
      -o-transition:background-color .25s;
  }
  #search-button i, #mobile-hamburger i{
    margin-top:40%;
  }
  #search-button:hover, #mobile-hamburger:hover{
    background-color:#e2383f;
    cursor:pointer;
  }

  #nav-banner.opaque #search-button, #nav-banner.opaque #mobile-hamburger{
    background-color:#e2383f;
        border-bottom: rgba(226,56,63,.15);
    color:#fff;
    transition:background-color .25s;
    -webkit-transition:background-color .25s;
    -moz-transition:background-color .25s;
    -o-transition:background-color .25s;
  }
  #nav-banner.opaque #search-button:hover, #nav-banner.opaque #mobile-hamburger:hover{
    background-color:#333;
  }

  /***SECOND LEVEL NAV***/

  .second-level-nav {
    display: block;
    background-color: #fff;
    height: auto;
    margin-top:-1px;
    margin-left: -15px;
    border-left: 3px solid #e2383f;
    border-right:1px solid rgba(40,40,40,.15);
    border-bottom:1px solid rgba(40,40,40,.15);
  }
  #nav-banner.opaque .second-level-nav{
    background-color: #fff;
  }
  #nav-banner.opaque.show-scroll .second-level-nav{
    background-color: rgba(251,251,251,.95);
  }
  .second-level-nav a {
    font-family: 'Open-sans', sans-serif;
    display: block;
    margin: 0;
    padding: 2% 5%;
    color: #333;
    font-size:.9em;
    text-decoration: none;
    transition: all .25s;
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -o-transition: all .25s;
  }

  .second-level-nav a:hover {
    background-color: #eaeaea;
    color: #1A79AF;
  }




  /***SCROLL BUTTONS***/

  #scroll-buttons{
    opacity:0;
    padding:5px;
    transition: opacity .25s;
    -webkit-transition: opacity .25s;
    -moz-transition: opacity .25s;
    -o-transition: opacity .25s;
  }

  #scroll-buttons .inner-wrapper {
      border: 1px solid rgba(40,40,40,.15);
      padding: 5px;
      max-height:43px;
      box-shadow: 1px 1px 10px rgba(40,40,40,.05);
      background-color: #fff;
      text-align:left;
      overflow: hidden;
      transition:max-height .5s;
      -webkit-transition:max-height .5s;
      -moz-transition:max-height .5s;
      -o-transition:max-height .5s;
  }
  #scroll-buttons .inner-wrapper.expanded{
    max-height:500px;
  }
  #scroll-buttons.visible{
    opacity: 1;
    transition: opacity .25s;
    -webkit-transition: opacity .25s;
    -moz-transition: opacity .25s;
    -o-transition: opacity .25s;
  }
  #scroll-buttons p {
      margin: 0;
      display: inline-block;
      text-align: center;
      vertical-align: top;
      font-family: 'Raleway', sans-serif;
      width: 7%;
      line-height:1em;
  }
  #scroll-buttons p i {
      font-size: 1.5em;
  }
  #scroll-buttons .inner-wrapper>div {
      display: inline-block;
      width: 85%;
  }
  #scroll-buttons .inner-wrapper>div nav {
      text-align:center;
  }
  .scroll-link {
      display: inline-block;
      font-family: 'Raleway', sans-serif;
      width: 14%;
      padding:8px;
      height:25px;
      border:1px solid rgba(40,40,40,.15);
      z-index:1;
      margin: 0 5px 5px 0;
      line-height:1.4em;
      vertical-align: top;
      text-transform:capitalize;
      text-align: left;
      font-size: .8em;
      transition:color .25s, background-color .25s;
      -webkit-transition:color .25s, background-color .25s;
      -moz-transition:color .25s, background-color .25s;
      -o-transition:color .25s, background-color .25s;
  }
  .scroll-link span {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      text-align: center;
      transform: translate(-50%,-50%);
      -webkit-transform: translate(-50%,-50%);
      -moz-transform: translate(-50%,-50%);
      -o-transform: translate(-50%,-50%);
    }
  .scroll-link:hover{
    color:#1a79af;
    background-color:#eaeaea;
    cursor:pointer;
  }
  #toggle-scroll-buttons{
    color:inherit;
    opacity:1;
    transition:color .25s, opacity .25s;
    -webkit-transition:color .25, opacity .25s;
    -moz-transition:color .25s, opacity .25s;
    -o-transition:color .25s, opacity .25s;
  }
  #toggle-scroll-buttons.transparent{
    opacity:0;
  }
  #toggle-scroll-buttons:hover {
      color: #1a79af;
      cursor: pointer;
  }
  /***GOOGLE TRANSLATE***/
  #google_translate_element {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity:0;
}
.goog-te-gadget-simple {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.goog-te-menu-value {
    display: none;
}

/***
*   LEFT HAND NAV - NEW
***/
#left-hand-nav {
    position: fixed;
    opacity:0;
    z-index:-1;
    left:5px;
    visibility: hidden;
    top: 50%;
    z-index: 1000;
    font-size:.8em;
    transform:translate(0, -50%);
    -webkit-transform:translate(0, -50%);
    -moz-transform:translate(0, -50%);
    -o-transform:translate(0, -50%);

}
#left-hand-nav.visible{
  visibility:visible;
  z-index:999;
  transition:opacity .25s;
  -webkit-transition:opacity .25s;
  -moz-transition:opacity .25s;
  -o-transition:opacity .25s;
}
#left-hand-nav.visible.opaque{
  opacity:1;
}
/**BUTTONS**/
li.button {
    text-align: center;
    padding: 15px 15px 10px 15px;
    color:#fff;
    transition: background-color .25s;
    -webkit-transition: background-color .25s;
    -moz-transition: background-color .25s;
    -o-transition: background-color .25s;
}
li.button i {
    font-size: 2.5em;
}
li.button a {
    color: inherit;
}
li.button.red, li.button.you-tube {
    background-color: #e2383f;
}

li.button.dark-gray {
    background-color: #404040;
}
li.button.light-gray {
    background-color: #cdcdcd;
}
li.button.facebook{
  background-color: #3b5998;
}
li.button.twitter{
  background-color:#1da1f2;
}
li.button.instagram{
  background-color:#c32aa3;
}
li.button.linkedin{
  background-color:#0077B5;
}
li.button:hover{
  background-color:#1a79af;
  color:#feab00;
}

/**SLIDE OUT INFO**/
ul.nav-info-text {
    position: absolute;
    top: 0;
    margin-left:0px;
    width:0;
    height:100%;
    background-color: #1a79af;
    color:#fff;
    padding: 15px 15px 10px 30px;
    margin-top: -15px;
    z-index:-1;
    transition: all .35s;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    -o-transition: all .35s;
}
ul.nav-info-text li{
  font-size:1.3em;
  text-transform: capitalize;
  opacity:0;
  transform:opacity .25s;
  -webkit-transform:opacity .25s;
  -moz-transform:opacity .25s;
  -o-transform:opacity .25s;
}
li.button:hover ul.nav-info-text {
  margin-left:100%;
  width:auto;
}
li.button:hover ul.nav-info-text li{
  opacity:1;
}
  /***
  *   LEFT HAND NAV - OLD
  ***

  #left-hand-nav li.button {
    list-style: none;
    position: relative;
    width: 100%;
    height: 70px;
  }
  #left-hand-nav .button .inner-wrapper {
      position: absolute;
      top: 50%;
      left: 50%;
      text-align: center;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
  }
  #left-hand-nav p.font-xsmall {
      font-size: .8em;
      font-family:'Raleway', sans-serif;
      text-transform:capitalize;
      line-height: 1em;
      margin: 5% 0;
  }
  #left-hand-nav .inner-wrapper a {
      color: #333;
      transition:color .25s;
      -webkit-transition:color .25s;
      -moz-transition:color .25s;
      -o-transition:color .25s;
  }
  #left-hand-nav .inner-wrapper a:hover{
    color:#1a79af;
  }*/
  /***MOBILE NAV***/
  #mobile-hamburger{
    display:none;
  }
  @media screen and (max-width:1300px){
    #search-button i, #mobile-hamburger i {
      margin-top: 50%;
      font-size:2.5em;
  }
  }
  @media screen and (max-width:1200px){
    #nav-banner{
      font-size:.9em;
    }
    #quick-links, #translate-button, #search-button, .button-nav{
      max-height:65px;
    }
    #quick-links, #translate-button {
      width: 24%;
    }
    #search-button {
    width: 26%;
}
.button-nav .fa-2x {
    font-size: 2em;
        margin-top: 10px;
}
#quick-links .button-nav ul {
    left: 8%
  }
  iframe.goog-te-menu-frame.skiptranslate {

      top: 67px !important;
    }
  }
  @media screen and (max-width:1200px){
    #nav-banner{
      font-size:.8em;
      max-height:65px;
    }
    #left-hand-nav p.font-xsmall {
      font-size: .7em;
    }
    #search-button {
      padding: 0 3%;
    }
    #search-button i {
      margin-top: 60%;
      font-size: 2.5em;
    }
    .top-level-nav {
      max-height:65px;
    }
    .top-level-nav>a, .top-level-nav>span {
      margin-top: 55px;
    }
    #nav-banner-logo img {
      max-height: 45px;
      margin-top: 15px;
    }
    #search-button{
      height:65px;
    }
  }
  @media screen and (max-width:1010px){
    #left-nav{
      width:73%;
    }
    #right-nav{
      width:20%;
    }
    .top-level-nav {
      padding: 0 10px 0 10px;
    }
    .second-level-nav{
      margin-left:-10px;
    }
    #quick-links .second-level-nav{
      margin-right:1px;
    }
    #left-hand-nav{
      width:6%;
    }
    li.button i {
    font-size: 1.8em;
    }
    li.button {
      padding: 10px 5px 5px 5px;
    }
    ul.nav-info-text {
      padding: 10px 10px 5px 15px;
      margin-top: -10px;
    }
    ul.nav-info-text li {
      font-size: 1em;
    }

  }
  @media screen and (max-width:930px){
    .top-level-nav {
      padding: 0 5px 0 5px;
    }
    #nav-banner-logo img {
      max-height: 35px;
      margin-top: 20px;
    }
    .second-level-nav{
      margin-left:-5px;
    }
    #quick-links .second-level-nav{
      margin-right:0px;
    }
  }
  @media screen and (max-width:810px), only screen
  and (min-device-width : 768px)
  and (max-device-width : 1024px), only screen
  and (min-device-width : 375px)
  and (max-device-width : 667px), only screen
  and (min-device-width : 414px)
  and (max-device-width : 736px), only screen
  and (min-device-width : 320px)
  and (max-device-width : 568px), only screen
  and (min-device-width : 320px)
  and (max-device-width : 480px){
    #left-nav {
      display: block;
      position: fixed;
      overflow:scroll;
      right: 0;
      width: 0;
      height:100%;
      top:65px;
      padding-bottom:100px;
      background-color: rgba(251,251,251,.95);
      transition: width .5s;
      -webkit-transition: width .5s;
      -moz-transition: width .5s;
      -o-transition: width .5s;
    }
    #right-nav {
      width: 50%;
    }
    #nav-banner-logo {
      position: absolute;
      left: 10px;
      top: 8px;
    }
    #nav-banner-logo img {
      max-height: 50px;
      margin-top: 0;
    }
    #quick-links {
      display: none;
    }
    #mobile-hamburger{
      display:inline-block;
      height:65px;
      width:65px;
      padding:0;
    }

    #mobile-hamburger i {
      margin:0;
      position:absolute;
      top:50%;
      left:50%;
      transform:translate(-50%,-50%);
      -webkit-transform:translate(-50%,-50%);
      -moz-transform:translate(-50%,-50%);
      -o-transform:translate(-50%,-50%);
      font-size: 2.5em;
    }

    #nav-banner.opaque #search-button{
      background-color:inherit;
          border-bottom: none;
      color:#333;
      transition: color .25s, background-color .25s;
      -webkit-transition:color .25s, background-color .25s;
      -moz-transition:color .25s, background-color .25s;
      -o-transition:color .25s, background-color .25s;

    }
    #nav-banner.opaque #search-button:hover{
      background-color:#1a79af;
      color:#fff;
    }
    #nav-banner.opaque #mobile-hamburger{
      border-top: 1px solid#e2383f;
    }
    #scroll-buttons{
      display:none;
    }
    #social-buttons{
      display:none;
    }
    #left-hand-nav {
      bottom: 0;
      left:0;
      top: auto;
      width: 100%;
      height: 55px;
      background-color: rgba(251,251,251);
      transform: translate(0,0);
      -webkit-transform: translate(0,0);
      -moz-transform: translate(0,0);
      -o-transform: translate(0,0);
      border-top:1px solid rgba(40,40,40,.15);

    }
  li.button.red, li.button.dark-gray, li.button.light-gray{
      background-color:transparent;
    }
    ul.nav-info-text {
    display: none;
  }
  li.button a {
    color: #282828;
}
li.button i {
    font-size: 3em;
}
    #left-hand-nav li.button {
      display: inline-block;
      width: 15%;
      height: 100%;
    }
    #left-hand-nav #action-buttons {
      position: relative;
      width: 100%;
      height: 100%;
      text-align: center;
    }
    #left-hand-nav .button .inner-wrapper {
      transform: translate(-50%, -40%);
      -webkit-transform: translate(-50%, -40%);
      -moz-transform: translate(-50%, -40%);
      -o-transform: translate(-50%, -40%);
    }
    #mobile-hamburger{
      transition:background-color .5s;
      -webkit-transition:background-color .5s;
      -moz-transition:background-color .5s;
      -o-transition:background-color .5s;
    }
    #mobile-hamburger.dark, #nav-banner.opaque.show-scroll #mobile-hamburger.dark, #nav-banner.opaque #mobile-hamburger.dark{
      background-color:#333;
    }
    #mobile-hamburger i.fa.fa-bars.fa-3x {
      transition:transform .5s;
      -webkit-transition:transform .5s;
      -moz-transition:transform .5s;
      -o-transition:transform .5s;
    }
    #mobile-hamburger i.fa.fa-bars.fa-3x.rotate {
      transform: rotate(90deg);
      -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
      -o-transform: rotate(90deg);
    }
    #left-nav.open{
      width:100%;
    }
    #left-nav br {
      display: none;
    }
    #nav-banner .top-level-nav {
      position: relative;
      width: 95%;
      text-align: right;
      margin-top:10px;
      padding: 0 2%;
      font-size: 1.5em;
      line-height: 2em;
    }
    #nav-banner .top-level-nav>a, #nav-banner .top-level-nav>span {
      line-height: 2em;
      display:inline-block;
      border:1px solid #1a79af;
      color:#fff;
      background-color:#1a79af;
      margin-top: 0;
      padding: 2%;
      width:40%;
      transform:translate(0,0);
      -webkit-transform:translate(0,0);
      -moz-transform:translate(0,0);
      -o-transform:translate(0,0);
    }
    #nav-banner .top-level-nav>a:hover, #nav-banner .top-level-nav>span:hover {
      background-color:#1a79af;
      color:#fff;
      border-color:#1a79af;
    }
    #nav-banner .top-level-nav ul{
      display:none;
    }
    #left-nav>nav>ul {
      margin-top: 5%;
    }
    #nav-banner li.top-level-nav:hover {
      background-color: transparent;
    }
  }
  @media only screen
  and (min-device-width : 375px)
  and (max-device-width : 667px)
  and (orientation : landscape), only screen
  and (min-device-width : 414px)
  and (max-device-width : 736px)
  and (orientation : landscape), only screen
  and (min-device-width : 320px)
  and (max-device-width : 568px)
  and (orientation : landscape), only screen
  and (min-device-width : 320px)
  and (max-device-width : 480px)
  and (orientation : landscape){
    #nav-banner li.top-level-nav {
        display: inline-block;
        width: 45%;
  margin-top: 0;
  font-size: 1.3em;
  text-align:center;
    }
    #nav-banner .top-level-nav>a, #nav-banner .top-level-nav>span {
      margin-bottom: 15px;
      width:95%;
      padding:10px 0;
    }
  }

  @media screen and (max-width:600px), only screen
  and (min-device-width : 375px)
  and (max-device-width : 667px)
  and (orientation : portrait), only screen
  and (min-device-width : 414px)
  and (max-device-width : 736px)
  and (orientation : portrait), only screen
  and (min-device-width : 320px)
  and (max-device-width : 568px)
  and (orientation : portrait), only screen
  and (min-device-width : 320px)
  and (max-device-width : 480px){
    #nav-banner .top-level-nav>a, #nav-banner .top-level-nav>span {
      padding: 2%;
      width: 94%;
    }
    #nav-banner .top-level-nav {
      margin-top: 15px;
    }
  }