/* --- */
.header-wrapper {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0);
  transition: background-color 0.6s ease-in-out;
  width: 100%;
  z-index: 100;
}

.header-wrapper .header__icon .icon {
  color: white !important;
}

.header-wrapper--border-bottom {
  border-bottom: none;
  box-shadow: none;
}

.header__submenu .header__menu-item:hover::after,
.header__submenu .list-menu__item--active::after, 
.header__active-menu-item::after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  background-color: white;
  margin-top: 20px;
  position: absolute;
  left: 0;
}

.header__active-menu-item::after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  background-color: white;
  margin-top: 2px;
  position: absolute;
  left: 0;
}

.header__active-menu-item {
  position: relative;
}

.header__menu-item:hover::after {
  position: absolute;
}

.header__menu-item:hover span::after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  background-color: white;
  margin-top: 2px;
  /* left: 0; */
} 

.header__submenu .list-menu__item:hover::after,
.header__submenu .list-menu__item--active::after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  background-color: white;
  margin-top: 20px;
  position: absolute;
  left: 0;
}

.header__menu-item span,
.header__menu-item .icon-caret,
.header__icons .icon {
  color: white;
} 

.header__menu-item svg path {
  fill: white;
}

.header__submenu {
  background: rgba(0, 0, 0, 0.75);
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.25);
  padding: 19px 12px 18px 17px !important;
}

.header__submenu a,
.header__submenu a:hover {
  color: white;
}

/* tablet/mobile version */
.menu-drawer__navigation {
  backdrop-filter: blur(10px); 
  background-color: rgba(255, 255, 255, 0.5);
}
/* remove after ab test */
.index-page .header.not-transparent-at-index,
.header-wrapper__hidden {
  background-color: white;
  border-bottom: none;
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15);
  opacity: 1;
  transition: background-color 0.6s ease-in-out, opacity 0.6s ease-in-out;
  color: black;

  .header__menu-item span {
    color: black;
  }

  #Logo path:not(.no-fill) {
    fill: #205a4e;
  }

  .header .header__heading-link svg path.no-fill {
    stroke: #205a4e;
  }
  
  .header .header__heading-link svg path.stroke-fill {
    stroke: #205a4e;
    fill: #205a4e;
  }

  .header__menu-item svg path {
    fill: black;
  }

  .header__submenu {
    background-color: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    opacity: 0.9;
  }

  .header__submenu a,
  .header__submenu a:hover {
    color: black;
  }

  .header-wrapper--border-bottom {
  border-bottom: none;
  box-shadow: none;
  }

  .header__submenu .header__menu-item:hover::after,
  .list-menu__item--active::after {
    content: "";
    display: block;
    width: 30px;
    height: 1px;
    background-color: black;
    margin-top: 20px;
    position: absolute;
    left: 0;
  }

  .header__menu-item:hover span::after {
    content: "";
    display: block;
    width: 30px;
    height: 1px;
    background-color: black;
    margin-top: 2px;
    position: absolute;
  } 

  .header__active-menu-item::after {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  background-color: black;
  margin-top: 2px;
  position: absolute;
  left: 0;
}

  .header__submenu a,
  .header__submenu a:hover {
    color: black;
  } 

  .header__menu-item .icon-caret,
  .header__icon .icon {
    color: #205a4e !important; 
  }

  .header__icon .icon {
    color: white;
  }
}
.index-page .header.not-transparent-at-index {
  box-shadow: none;
}

.header .header__heading-link svg path:not(.no-fill) {
  fill: white;
}

.header .header__heading-link svg path.no-fill {
  stroke: white;
}

.header .header__heading-link svg path.stroke-fill {
  stroke: white;
  fill: white;
}

@media screen and (max-width: 990px) {
  .header-wrapper__hidden, 
  .header-wrapper {
    transition: none;
  }
}