.announcement-bar-wrapper{
  background-color: #4EA17C;
}


.announcement-bar{
  background-color: #4EA17C;
}

.announcement-bar p{
  margin:0px;
  font-size: 16px;
  padding: 12px 0px 12px 5px;
  color: #FFF;
  font-weight: 700;
  text-align: left;
}

.announcement-bar p a{
  color: #FFF !important;
}

.panel-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.arrow-img-menu{
     width: 20px;
}


.container-navbar {
    margin-right: auto !important;
    margin-left: auto !important;
    max-width: 1470px !important; /* or 950px */
  }

  @media only screen and (max-width: 600px) {
    .container-navbar {
        padding-left: 10px !important;
        padding-right: 10px !important;
      }
}

.logo {
    width: 177px;
}

.logo-mobile {
    width: 116px;
}

.navbar-background {
    height: 100px;
    background-color: #0F454A; /* Fallback for IE11 */
    background-color: var(--darkgreen);
    z-index: 10 !important;
}

@media only screen and (max-width: 1349px) {
    .navbar-background {
        /*height: 75px;*/
    }
}

.nav-separator {
    margin-left: 10px;
    margin-right: 10px;
}

.header-link {
    color: white !important;
    height: 100px;
    display: table-cell !important;
    vertical-align: middle;
    margin-right: 0px !important;
    padding-right: 32px !important;
    padding-left: 21px !important;
}

.nav-link-last {
  padding-right: 0 !important;
  padding-left: 31px !important;
}

.header-link:hover {
  color: white !important;
}

.nav-right:hover .header-link:not(:hover) {
    opacity: 0.5;
}

.nav-underline {
    border-bottom-style: solid;
    border-bottom-width: 2px;
    border-bottom-color: #4EA17C; /* Fallback for IE11 */
    border-bottom-color: var(--primary1);
    margin-left: 30px !important;
    margin-right: 0px !important;

    position: relative;
    bottom: 35px;
}

.dropdown-content .sub-link {
    font-family: soleil, sans-serif; /* Fallback for IE11 */
    font-family: var(--soleil);
    font-size: 14px;
    line-height: 24px;
    padding-left: 10px;
    color: #0F454A; /* Fallback for IE11 */
    color: var(--darkgreen) !important;
    text-decoration: none;

    border-bottom-style: dashed;
    border-width: 1px;
    border-color: #E3E4E6; /* Fallback for IE11 */
    border-color: var(--lightgray);
}

.dropdown-content .sub-link:last-child {
  border-bottom: none;
}

.sub-link-icon {
  position: absolute;
  right: 23px;
  width:20px;
  opacity: 0.3;
}

.sub-link:hover, .sub-link:focus {
    text-decoration: none;
    color: #228E93; /* Fallback for IE11 */
    color: var(--secondary1) !important;
}





  .dropdown {
    position: relative;
    display: inline-block;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #FFFFFF;
    min-width: 300px;
    box-shadow: 0px 8px 30px 0px rgba(32,38,38,0.1);
    z-index: 1;
    padding-top: 17px;
    padding-bottom: 17px;
    padding-left: 0px;
    border-radius: 0px 0px 3px 3px;
  }

  .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    margin-left: 25px;
    margin-right: 25px;
    padding: 8px 0px 8px 0px;
  }

  .dropdown-content a:hover {background-color: #f1f1f1}

  .dropdown-content a:focus {background-color: #f1f1f1}

  .dropdown:hover .dropdown-content {
    display: block;
  }

  .dropdown:hover a {
      opacity: 1 !important;
  }
/*
  .dropdown:hover .nav-link {
    background-color: var(--secondary1);
  }


  .dropdown-v2 {
    position: relative;
    display: inline-block;
  } */

  .dropdown-v2-content {
    display: none;
    width: 100vw;
    position: absolute;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;

    background-color: #0F454A; /* Fallback for IE11 */
    background-color: var(--darkgreen);
    /* min-width: 160px; */
    z-index: 1;
  }

  .dropdown-v2-content a {
    font-family: soleil, sans-serif; /* Fallback for IE11 */
    font-family: var(--soleil) !important;
    font-weight: 300 !important;
    font-size: 24px !important;
    line-height: 30px;
    color: #FFFFFF !important;

    padding: 12px 6px 12px 16px;
    margin-left: 10px;
    text-decoration: none;
    display: block;
  }

  .dropdown-v2-content a:hover, .dropdown-v2-content a:focus {
    color: #228E93; /* Fallback for IE11 */
    color: var(--secondary1) !important;
  }

  .dropdown-v2:hover .dropdown-v2-content {
    display: block;
  }

  .dropdown-v2:hover a {
    opacity: 1 !important;
}
/*
  .dropdown-v2:hover .nav-link {
    background-color: var(--secondary1);
  } */


  .dropdown-v2-title {
    font-family: KeplerStd;
    font-size: 50px !important;
    line-height: 60px;
    letter-spacing: -0.31px;
    color: white;
  }

  .dropdown-v2-line {
    border-bottom-style: solid;
    border-color: white;
    border-bottom-width: 1px;
    opacity: 0.15;
    padding-top: 6px;
  }

.nav-desktop{
    display: flex;
    height: 100px;
}

.nav-mobile{
    display: flex;
    height: 75px;
}

.nav-desktop-div {
  display: none;
}
.nav-mobile-div {
  display: block;
}

@media only screen and (min-width: 1350px) {
  .nav-desktop-div {
      display: block;
    }
  .nav-mobile-div {
    display: none;
  }
}

.nav-logo{
    display: flex;
    align-items: center;
}

.nav-center {
    display: flex;
    flex: 2;
}

.nav-right{
    display: flex;
    justify-content: flex-end;
    flex: 1;
}

.megamenu-margin-top {
  margin-top: 77px;
}

.megamenu-grid {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    justify-content: space-around;

    padding-left: 0px;

    list-style: none;
}

.megamenu-grid li {
    width: 288px;
    height: 60px;
    margin-bottom: 20px;
    margin-right: 22px;
}

.megamenu-grid li:before {
  content: '\2192';
  position: absolute;
  font-weight: lighter;
  color: var(--accent2);
  padding-top: 15px;

}

.separator{
  border-left: 1px solid white;
  height: 30px;
  opacity: 0.2;
  align-self: center;
}

#mobile-menu
{
  display: block;
  position: relative;
  top: 30px;
  z-index: 10;

  -webkit-user-select: none;
  user-select: none;
}

#ToggleBtn{
  background-color: transparent;
  border:none;
}

#mobile-menu input
{
  display: block;
  width: 42px;
  height: 42px;
  position: absolute;
  top: -7px;
  left: -5px;

  cursor: pointer;

  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */

  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#mobile-menu span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;

  background: #FFFFFF;
  border-radius: 3px;

  z-index: 1;

  transform-origin: 4px 0px;

  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#mobile-menu #ToggleBtn:first-child
{
  transform-origin: 0% 0%;
}

#mobile-menu #ToggleBtn:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/*
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#mobile-menu input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(1px, -1px);
}

/*
 * But let's hide the middle one.
 */
#mobile-menu input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#mobile-menu input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(-1px, -1px);
}

.main-mnu
{
  position: absolute;
  height: 100vh;
  width: 100%;
  z-index: 2;

  background: #0F454A; /* Fallback for IE11 */
  background: var(--darkgreen);
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
}

.menu-list-option {
  font-family: kepler-std-display; /* Fallback for IE11 */
  font-family: var(--kepler);
  font-size: 22px !important;
  line-height: 32px;
  color: #FFFFFF !important;
  text-decoration: none;
}

.menu-list-option:hover, .menu-list-option:active{
  text-decoration: none;
  opacity: 1;
  color: #FFFFFF !important;
}

/* Arrow Up */
.menu-list-option:before {
  float: right !important;
  font-family: FontAwesome;
  content:"\f106";
  padding-right: 5px;
  color: var(--gray1);
  opacity: 0.5;
  font-size: x-large;
}

/* Arrow Down */
.menu-list-option.collapsed:before {
  float: right !important;
  content: "\f107";
  opacity: 1;
  color: var(--primary1);
}

.menu-sublist-option {
  display: flex;
  font-family: soleil, sans-serif; /* Fallback for IE11 */
  font-family: var(--soleil);
  font-weight: 600;
  font-size: 15px !important;
  line-height: 15px;
  color: #FFFFFF !important;
  mix-blend-mode: normal;
  opacity: 0.6;

  padding: 10px 0px 10px 0px;
}

.menu-sublist-option:hover,
.menu-sublist-option:active,
.menu-sublist-option:hover img,
.menu-sublist-option:active img {
  text-decoration: none;
  color: #FFFFFF !important;
  opacity: 1;
}

.menu-sublist-icon {
  width:20px;
  opacity: 0.3;
  filter: invert(1);
  margin-left: auto;
}

.menu-group {
  padding: 15px 0px 20px 0px;
  margin-right: 25px;
  margin-left: 25px;

  border-bottom: 1px solid rgba(255, 255, 255, .2);
  -webkit-background-clip: padding-box; /* for Safari */
  background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */

}

#menuAccordion:hover .menu-list-option:not(:hover) {
  opacity: 0.5;
}

.menu-button {
  display: block;
  margin-right: 25px;
  margin-left: 25px;
  width: auto;
}

.dropdown > .nav-link:after {
  font-family: FontAwesome;
  font-weight: lighter;
  content:"\f107";
  color: white;
  opacity: 0.3;
  vertical-align: middle;
  padding-left: 7px;
}

.dropdown-v2 > .nav-link:after {
  font-family: FontAwesome;
  font-weight: lighter;
  content:"\f107";
  color: white;
  opacity: 0.3;
  vertical-align: middle;
  padding-left: 7px;
}
