
#bannerTop {
    color: #fff; 
    padding: 5px 20px; 
    width: 100%; 
    font-weight: bold;
}
 #bannerTop a {
  text-decoration:  none;
  color: #fff;
 }

#bannerTop .wrapper { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; width: 90%; max-width: unset; }
#bannerTop ul { display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: center; list-style-type: none; margin: 0; padding: 0; }
#bannerTop ul > li { display: flex; flex-flow: row nowrap; align-items: center; margin: 0; }

#bannerTop .search input[type="text"] {
    height:  44px;
    outline:  0;
    background: none;
    border: none;
    font-size: 1.6rem;
    color: #fff;
    font-family: sans-serif;
    font-weight: 500;
    position: relative;
    z-index: 0;
    border-bottom: 2px solid #fff;
    border-radius: 0;
    -webkit-border-radius: 0;
    margin: 0;
    padding: 1.6rem 0;
    /*width: 200px;*/
}


#bannerSub { display: block; width: 100%; height: 90vh; position: relative; color: #fff; z-index: 1; background-repeat: no-repeat; background-size: cover; background-position: center center; }
#bannerSub h1, #bannerSub h2, #bannerSub h3 { color: #fff; }
#bannerSub h1 { margin: 0; padding: 0; font-size: 9.0rem; }
#bannerSub h2 { margin: 2rem 0 3rem 0; padding: 0; font-size: 2.5rem; font-weight: 700; }
#bannerSub .mainWrapper { position: relative; z-index: 1; color: #fff; width: 100%; height: 100%; max-width: 100%; margin: 0; padding: 0; }
#bannerSub .backgroundImages { display: block; position: absolute; z-index: 0; width: 100%; top: 0; left: 0; margin: 0; padding: 0; box-sizing: border-box; height: 100%; }
#bannerSub .mainImg { display: block; position: absolute; z-index: 1; top: 0; width: 95%; height: 100%; background-size: cover; background-repeat: no-repeat; object-fit: cover; background-position: center; }
/*#bannerSub .mainImg.none { left: 0; right: 0; width: 100%; }*/
#bannerSub .caption { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; width: 80%; height: calc(90vh - 100px); margin: 0 auto; padding: 0; text-align: center; }
#bannerSub .caption.center {}
.mainImgOverlay { display: block; content: ''; position: absolute; z-index: 2; width: 100%; height: 100%; margin: 0; padding: 0; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0, 0.1); }
.textShadow { text-shadow: 0 3px 5px rgba(0,0,0, 0.4); }

#bannerSub .chevronDown { 
    display: flex; 
    flex-flow: row nowrap; 
    justify-content: center; 
    align-items: center; 
    text-align: center; 
    position: absolute; 
    bottom: 3rem; 
    margin: 0 auto; 
    padding: 0; 
    width: 100%; 
    z-index: 10; 
    color: #fff; 
    font-size: 6rem; 
}
@media screen and (min-width:1025px) and (max-width:1249px) {
    #bannerSub h1 { font-size: 7rem; }
    #bannerSub .caption { width: 80%; }
}  
@media screen and (min-width:750px) and (max-width:1024px) {
    #bannerSub h1,
    #shortHeroHeader h1,
    #webFormHeader h1 { font-size: 6rem; }
}
@media screen and (min-width:667px) and (max-width:959px) {
  #bannerSub .caption { padding-top: 3rem; }
}
@media screen and (max-width: 749px) {
  #logo { width: 240px; top: 2em; left: 2em; }

  #bannerSub .caption.center { width: 100%; }
  #bannerSub h1,
  #shortHeroHeader h1,
  #webFormHeader h1 { font-size: 3.5rem; margin-top: 3em; }
  #bannerSub h1.sm, #bannerSub h2.sm { font-size: 2.5rem; margin-top: 4em; }
  #bannerSub h1.lg, #bannerSub h2.lg { font-size: 4em; }
  #bannerSub .caption { width: 90%; }
  
  #bannerSub .caption.left .captionBlurb, #bannerSub .caption.right .captionBlurb { width: 100%; }
  
  #bannerSub .caption { width: 90%; }
  #bannerSub .mainImg { width: 100%; }
  #bannerSub .offsetBGImage { display: none; }
  #bannerSub .chevronDown, #webFormHeader .chevronDown { bottom: 1rem; font-size: 4rem; }
  #logo { width: 240px; top: 7em; left: 2em; }
  
  #bannerTop nav { width: 55%; }
  #bannerTop nav ul { list-style-type: disc; }
  #bannerTop nav ul > li:before { display: flex; align-items: flex-start; justify-content: flex-start; margin-right: 2px; content: '•'; }
  /*#bannerTop .search { width: 59%; }*/
  #bannerTop ul > li:after { display: none; }
  #bannerTop { font-size: 1.2rem; }
}

@media screen and (max-height: 375px) {
    #bannerSub { height: 100vh; }
    #bannerSub h1 { font-size: 3.5rem; padding-top: 9rem; }
    #bannerSub h2 { font-size: 2rem; }
}

.footerMenu a { color: #fff; font-size: 2.3rem; font-weight: 500; transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); -webkit-transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); }
.footerMenu a:hover { color: rgba(255,255,255,0.7); }
.footerMenu ul { list-style-type: none; margin: 0; padding: 0; }
.footerMenu ul > li { display: block; margin: 0.5em 0; }
.footerMenu ul > li:first-child { margin-top: 0; }
.footerMenu ul > li:last-child { margin-bottom: 0; }
.footerMenu ul > li > ul { display: none; }

.menuToggle { display: none; position: absolute; z-index: 101; top: 6em; right: 10%; color: #fff; }
.menuToggle a { display: flex; flex-flow: row nowrap; width: 240px; justify-content: flex-end; align-items: center; position: absolute; z-index: 4; top: 0; right: 0; transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); -webkit-transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); }
.menuToggle a:hover { color: rgba(255,255,255,0.7); }
.menuToggle a h2 { display: inline-block; margin: 0; padding: 0; color: #fff; transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); -webkit-transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); }
.menuToggle a:hover h2 { color: rgba(255,255,255,0.7); }
.menuToggle .hamburger { display: inline-block; margin-left: 1.8em; transition: all 0.2s cubic-bezier(.36,.53,.33,1.01); }
.menuToggle a:hover .hamburger { opacity: 0.7; }

.menuToggle .hamburger span {
  margin: 0 auto;
  position: relative;
  top: 0;
}
.menuToggle .hamburger span:before, .menuToggle .hamburger span:after {
  position: absolute;
  content: '';
}
.menuToggle .hamburger span, 
.menuToggle .hamburger span:before, 
.menuToggle .hamburger span:after {
  width: 30px;
  height: 4px;
  background-color: #fff;
  display: block;
}
.menuToggle .hamburger span:before {
  margin-top: -12px;
}
.menuToggle .hamburger span:after {
  margin-top: 12px;
}
.menuToggle .hamburger span {
  -webkit-transition-duration: 0s; transition-duration: 0s;
  -webkit-transition-delay: 0.2s; transition-delay: 0.2s;
}
.menuToggle .hamburger.active span {
  background-color: rgba(0,0,0,0.0);
  -webkit-transition-delay: 0.2s; transition-delay: 0.2s;
}
.menuToggle .hamburger span:before {
  -webkit-transition-property: margin, -webkit-transform; transition-property: margin, transform;
  -webkit-transition-duration: 0.2s; transition-duration: 0.2s;
  -webkit-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s;
}
.menuToggle .hamburger.active span:before {
  margin-top: 0;
  -webkit-transform: rotate(45deg); transform: rotate(45deg);
  -webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s;
}
.menuToggle .hamburger span:after {
  -webkit-transition-property: margin, -webkit-transform; transition-property: margin, transform;
  -webkit-transition-duration: 0.2s; transition-duration: 0.2s;
  -webkit-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s;
}
.menuToggle .hamburger.active span:after {
  margin-top: 0;
  -webkit-transform: rotate(-45deg); transform: rotate(-45deg);
  -webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s;
}

#mainNav.navSlide { display: none; flex-direction: column; justify-content: flex-start; align-items: flex-end; text-align: right; position: absolute; 
  z-index: 100; top: 0; right: 0; margin: 0; padding: 0; width: 40%; /*height: 100%;*/ color: #fff; background: #143154; transform: translateX(100%); transition: transform 0.8s cubic-bezier(.36,.53,.33,1.01); }
#mainNav.navSlide.active { transform: translate(0); transition: transform 0.8s cubic-bezier(.36,.53,.33,1.01); }
#mainNav.navSlide a { color: #fff; font-weight: 600; background-size: 0% 100%; transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); -webkit-transition: all 0.3s cubic-bezier(.36,.53,.33,1.01); }
#mainNav.navSlide a:hover { color: rgba(255,255,255,0.7); }

#mainNav.navSlide .mainNav { display: block; position: relative; margin-top: 12em; right: 25%; width: calc(100% - 30%); }
#mainNav.navSlide .mainNav ul { margin: 0; padding: 0; list-style-type: none; position: relative; display: block; }
#mainNav.navSlide .mainNav ul > li { display: block; text-align: right; margin: 1em 0; }
#mainNav.navSlide .mainNav ul > li:first-child { margin-top: 0; }
#mainNav.navSlide .mainNav ul > li > a { font-size: 3.5rem; display: flex; flex-flow: row nowrap; justify-content: flex-end; align-items: center; }
#mainNav.navSlide .mainNav .dropdown { font-size: .7em; color: var(--yellow); margin-left: 10px; }
#mainNav.navSlide .mainNav ul > li > ul { display: none; margin: 1.5em 7px 1.5em 0; padding-right: 15px; border-right: 4px solid var(--yellow); font-family: lavigne-display, sans-serif; font-size: .8em; }

@media screen and (min-width:750px) and (max-width:1024px) {
    #mainNav.navSlide .mainNav ul > li > a, #mainNav.navSlide .mainSocialNav ul > li > a { font-size: 2rem; }
    #mainNav.navSlide .mainNav,
    #mainNav.navSlide .mainSocialNav { right: 10%; }
}

@media screen and (min-width:750px) and (max-width:959px) {
  #mainNav.navSlide { width: 100%; }
}

@media screen and (max-width: 749px) {
  #mainNav.navSlide .mainNav,
  #mainNav.navSlide .mainSocialNav { right: 10%; }
  #mainNav.navSlide .mainNav ul > li > a, #mainNav.navSlide .mainSocialNav ul > li > a { font-size: 2rem; }
  #mainNav.navSlide { width: 100%; }

  .menuToggle { top: 12rem; }
  .menuToggle a h2 { display: none; }
}