.header {
  position: fixed;
  top: 0;
  color: var(--white);
  background-color: var(--blue);
  align-items: center;
  z-index: 999;
  padding: 0;
  height: auto;
}

.header__desktop {
  position: absolute;
  left: -100%;
  top: 0;
  background-color: var(--blue);
  width: 100%;
  max-width: 394px;
  height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  transition: left 0.3s ease;
}

.header__desktop.show {
  left: 0;
  display: flex !important;
}

.header a:hover {
  filter: unset;
}

.header__first,
.header__first__second__ul,
.header__first__third__ul {
  max-width: var(--page-content-max-w);
  margin: 0 auto;
  height: 100%;
}

.header__first {
  position: relative;
  z-index: 0;
  height: auto;
  padding: 20px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.header__logo {
  display: none;
  min-width: fit-content;
  color: var(--white);
}


.header__logo.mobile {
  width: 90px;
  height: 51px;
  display: block;
}

.header__logo.mobile img {
  width: 100%;
  height: 100%;
}

.header__logo__formation,
.header__logo__programme__affiliation {
  display: none;
}

.header__logo__formation::before,
.header__logo__programme__affiliation::before {
  display: block;
  content: " ";
  height: 51px;
  width: 1px;
  border-left: 1px dashed #FFFFFF33;
  margin: 0 15px;
}

.path-formations .header__logo__formation.mobile,
.page-node-type-page-carrefour .header__logo__formation.mobile,
.page-node-type-page-a .header__logo__programme__affiliation.mobile,
.page-node-type-page-partenaire .header__logo__programme__affiliation.mobile,
.page-node-type-partenaire .header__logo__programme__affiliation.mobile {
  display: flex;
}

.btn__dropdown.btn__main span {
  color: var(--blue);
}

.btn__contactus,
.btn__dropdown,
.persona__dropdow__menu {
  color: var(--blue);
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.07);
}

.page-node-type-laboratories-projects-page .btn__main.btn__contactus,
.btn__main.btn__contactus {
  background-color: var(--green);
}

.path-formations .btn__main.btn__contactus,
.page-node-type-page-carrefour .btn__main.btn__contactus {
  background-color: var(--green-bg);
  color: var(--white);
}

.page-node-type-page-a .btn__main.btn__contactus,
.page-node-type-page-partenaire .btn__main.btn__contactus,
.page-node-type-partenaire .btn__main.btn__contactus,
.page-node-type-partner-laboratory-page .btn__main.btn__contactus,
.page-node-type-research-project-page .btn__main.btn__contactus {
  background-color: var(--orange);
  color: var(--white);
}

.btn__dropdown__container {
  position: relative;
}

.btn__dropdown__container:has(> .persona__dropdow__menu.hidden) {
  overflow: hidden;
}

.btn__main.btn__dropdown {
  width: 200px;
  background-color: var(--white);
}

.persona__dropdow__menu {
  position: absolute;
  top: 55px;
  left: 0;
  width: 200px;
  opacity: 1;
  background-color: var(--white);
  border-radius: 10px;
  padding: 0 20px;
  transition: opacity 0.3s ease-out;
}

.persona__dropdow__menu.hidden {
  opacity: 0;
}

.persona__dropdow__menu__item {
  height: 50px;
  min-height: 50px;
  color: var(--blue);
  text-align: left;
}

.persona__dropdow__menu__item.disabled {
  color: var(--blue40);
  cursor: default;
}

.persona__dropdow__menu__item:not(:last-child) {
  border-bottom: 1px dashed rgba(38, 52, 114, 0.2);
}

.header__second {
  color: var(--blue);
  background-color: var(--white);
  padding: 20px;
  display: flex;
  flex-direction: column-reverse;
  row-gap: 20px;
  height: auto;
  position: relative;
  z-index: 1;
}

.header__first__second {
  flex-direction: column;
  align-items: flex-start;
  row-gap: 13px;
  height: auto
}

.header__first__second__ul li,
.header__first__third__ul li {
  margin-bottom: 0;
  height: 100%;
  width: 100%;
  display: flex;
  flex: 1 0 0;
  align-items: center;
  justify-content: flex-start;
  border-left: 0;
}

.header__first__second__ul li a {
  letter-spacing: 0.24px;
  text-align: center;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 700;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 13px 0;
  border-bottom: 1px dashed var(--blue15);
}

.header__first__second__ul li:nth-last-child(1) a {
  border-bottom: 0;
}

.header__first__second__ul li.is-active a,
.header__first__second__ul li a:hover {
  color: var(--blue-sky);
  background-color: unset;
}

.header__first__third__ul li.is-active a,
.header__first__third__ul li a:hover {
  color: var(--white);
  background-color: var(--orange);
}

.path-formations .header__first__third__ul li.is-active a,
.path-formations .header__first__third__ul li a:hover
.page-node-type-page-carrefour .header__first__third__ul li.is-active a,
.page-node-type-page-carrefour .header__first__third__ul li a:hover {
  background-color: var(--garnet);
}

.header__first__third {
  height: auto;
  background-color: var(--white);
}

.header__first__second__ul > div:nth-child(1),
.header__first__second__ul > div:nth-child(1) > nav,
.header__first__second__ul > div:nth-child(1) > nav > ul,
.header__first__third__ul > div:nth-child(1),
.header__first__third__ul > div:nth-child(1) > nav,
.header__first__third__ul > div:nth-child(1) > nav > ul {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

.header__first__second__ul > div:nth-child(1) > nav > ul,
.header__first__third__ul > div:nth-child(1) > nav > ul {
  flex-direction: column;
  align-items: flex-start;
}

.header__first__third__ul li {
  height: 100%;
  width: 100%;
  padding: 7px 0;
  border-bottom: 1px dashed var(--blue15);
}

.header__first__third__ul li:hover {
  background-color: var(--orange);
}

.header__first__third__ul li a {
  color: var(--blue);
  font-size: 14px;
  font-weight: bold;
  line-height: 22px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 0;
  width: 100%;
  height: 100%;
}

.header__first__third__ul li a::before {
  content: " ";
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.header__first__third__ul li:nth-child(1) a::before,
.header__first__third__ul li:nth-child(5) a::before {
  width: 35px;
  min-width: 35px;
  height: 35px;
}

.header__first__third__ul li:nth-child(1) a::before {
  background-image: url("../images/calendar.svg");
}

.path-formations .header__first__third__ul li:nth-child(1) a::before,
.page-node-type-page-carrefour .header__first__third__ul li:nth-child(1) a::before {
  background-image: url("../images/calendar_formation.svg");
}

.header__first__third__ul li:nth-child(2) a::before,
.header__first__third__ul li:nth-child(4) a::before,
.header__first__third__ul li:nth-child(6) a::before {
  width: 40px;
  min-width: 40px;
  height: 40px;
}

.header__first__third__ul li:nth-child(2) a::before {
  background-image: url("../images/actus.svg");
}

.path-formations .header__first__third__ul li:nth-child(2) a::before,
.page-node-type-page-carrefour .header__first__third__ul li:nth-child(2) a::before {
  background-image: url("../images/actus_formation.svg");
}

.header__first__third__ul li:nth-child(3) a::before {
  width: 42px;
  min-width: 42px;
  height: 42px;
  background-image: url("../images/bulb.svg");
}

.path-formations .header__first__third__ul li:nth-child(3) a::before,
.page-node-type-page-carrefour .header__first__third__ul li:nth-child(3) a::before {
  background-image: url("../images/bulb_formation.svg");
}

.header__first__third__ul li:nth-child(4) a::before {
  background-image: url("../images/megaphone.svg");
}

.path-formations .header__first__third__ul li:nth-child(4) a::before,
.page-node-type-page-carrefour .header__first__third__ul li:nth-child(4) a::before {
  background-image: url("../images/megaphone_formation.svg");
}

.header__first__third__ul li:nth-child(5) a::before {
  background-image: url("../images/job.svg");
}

.path-formations .header__first__third__ul li:nth-child(5) a::before,
.page-node-type-page-carrefour .header__first__third__ul li:nth-child(5) a::before {
  background-image: url("../images/job_formation.svg");
}

.header__first__third__ul li:nth-child(6) a::before {
  background-image: url("../images/bourse.svg");
}

.path-formations  .header__first__third__ul li:nth-child(6) a::before,
.page-node-type-page-carrefour  .header__first__third__ul li:nth-child(6) a::before {
  background-image: url("../images/bourse_formation.svg");
}

.header__first__third__ul li:nth-child(1):hover a::before,
.header__first__third__ul li:nth-child(1).is-active a::before {
  background-image: url("../images/calendar-active.svg");
}

.header__first__third__ul li:nth-child(2):hover a::before,
.header__first__third__ul li:nth-child(2).is-active a::before {
  background-image: url("../images/actus-active.svg");
}

.header__first__third__ul li:nth-child(3):hover a::before,
.header__first__third__ul li:nth-child(3).is-active a::before {
  background-image: url("../images/bulb-active.svg");
}

.header__first__third__ul li:nth-child(4):hover a::before,
.header__first__third__ul li:nth-child(4).is-active a::before {
  background-image: url("../images/megaphone-active.svg");
}

.header__first__third__ul li:nth-child(5):hover a::before,
.header__first__third__ul li:nth-child(5).is-active a::before {
  background-image: url("../images/job-active.svg");
}

.header__first__third__ul li:nth-child(6):hover a::before,
.header__first__third__ul li:nth-child(6).is-active a::before {
  background-image: url("../images/bourse-active.svg");
}

.language__switcher__container {
  position: relative;
  z-index: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  grid-column: 1/4;
  grid-row: 1/3;
}

.language__switcher__container > div {
  padding: 0;
  margin: 0;
  display: flex !important;
  align-items: center;
}

.language__switcher__container section.language-switcher-language-url,
.language__switcher__container nav#block-useraccountmenu {
  position: absolute;
}

.language__switcher__container section.language-switcher-language-url {
  top: 0;
  right: 0;
}

.language__switcher__container nav#block-useraccountmenu {
  left: 0;
  bottom: 0;
}

.language__switcher__container section.language-switcher-language-url > ul {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  text-transform: uppercase;
  font-weight: bold;
}

.language__switcher__container section.language-switcher-language-url > ul li {
  margin: 0;
  width: 30px;
  aspect-ratio: 1;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 22px;
}

.language__switcher__container section.language-switcher-language-url > ul li a:hover {
  color: var(--white);
  filter: brightness(0.95);
}

.page-node-type-laboratories-projects-page .language__switcher__container section.language-switcher-language-url > ul li.is-active,
.language__switcher__container section.language-switcher-language-url > ul li.is-active {
  background-color: var(--pink);
}

.path-formations .language__switcher__container section.language-switcher-language-url > ul li.is-active,
.page-node-type-page-carrefour .language__switcher__container section.language-switcher-language-url > ul li.is-active {
  background-color: var(--green-bg);
}

.page-node-type-page-a .language__switcher__container section.language-switcher-language-url > ul li.is-active,
.page-node-type-page-partenaire .language__switcher__container section.language-switcher-language-url > ul li.is-active,
.page-node-type-partenaire .language__switcher__container section.language-switcher-language-url > ul li.is-active,
.page-node-type-partner-laboratory-page .language__switcher__container section.language-switcher-language-url > ul li.is-active,

.page-node-type-research-project-page .language__switcher__container section.language-switcher-language-url > ul li.is-active {
  background-color: var(--orange);
}

.language__switcher__container div.region {
  display: flex;
  align-items: center;
  gap: 30px;
}

.language__switcher__container nav ul {
  margin: 0;
}

.language__switcher__container nav ul li {
  margin: 0;
  display: flex;
  align-items: center;
}

.language__switcher__container nav ul li::before {
  position: relative;
  content: " ";
  display: none;
  width: 2px;
  height: 30px;
  margin-right: 30px;
  background-image: url("../images/header_separator.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.language__switcher__container nav ul li a {
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  color: var(--white);
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 10px;
}

.language__switcher__container nav ul li a:hover {
  background-color: var(--pink);
}

.language__switcher__container nav ul li a::before {
  position: relative;
  content: " ";
  display: flex;
  width: 24px;
  min-width: 24px;
  height: 24px;
  margin-right: 10px;
  background-image: url("../images/user_login_icon.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.language__switcher__container ~ svg {
  display: none;
}

.header__mobile {
  width: 100%;
  padding: 15px 20px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.header__mobile .btn__open__menu__mobile {
  margin-left: auto;
}

.close__menu__mobile__container {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.menu__container {
  height: calc(100vh - 81px);
  overflow-y: auto;
}

.menu__mobile__title,
.autre__menu__mobile {
  font-family: var(--font-phenomena);
  font-size: 32px;
  font-weight: 700;
  line-height: normal;
}

.btn__close__menu__mobile {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: var(--white);
  border-radius: 50%;
}

.header__first__right {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: auto;
  row-gap: 20px;
}

.header__first__right__socials,
.header__first__right__contactus {
  z-index: 1;
}

.header__first__right__socials {
  grid-column: 1;
  grid-row: 1;
}

.header__first__right__contactus {
  grid-column: 3;
  grid-row: 2;
}

.header__first__right > svg {
  display: none;
}

@media screen and (min-width: 394px) {
  .header__desktop {
    left: -394px;
  }
}

@media screen and (min-width: 1024px) {
  .header {
    padding-top: 20px;
    height: 244px;
  }

  .header__mobile,
  .autre__menu__mobile,
  .close__menu__mobile__container {
    display: none;
  }

  .menu__container {
    height: auto;
    overflow-y: unset;
  }

  .header__desktop {
    position: relative;
    left: unset;
    top: unset;
    height: 100%;
    max-width: 100%;
  }

  .header__first {
    padding: 0 20px 20px;
    flex-direction: row;
    align-items: center;
  }

  .header__logo {
    display: flex;
  }

  .header__logo__formation::before,
  .header__logo__programme__affiliation::before {
    height: 80px;
    margin: 0 30px;
  }

  .path-formations .header__logo__formation,
  .page-node-type-page-carrefour .header__logo__formation,
  .page-node-type-page-a .header__logo__programme__affiliation,
  .page-node-type-page-partenaire .header__logo__programme__affiliation,
  .page-node-type-partenaire .header__logo__programme__affiliation {
    display: flex;
  }

  .header__first__right {
    display: flex;
    align-items: center;
  }

  .header__first__right > svg {
    display: block;
  }

  .language__switcher__container {
    width: fit-content;
  }

  .language__switcher__container nav ul li::before {
    display: block;
  }

  .language__switcher__container section.language-switcher-language-url,
  .language__switcher__container nav#block-useraccountmenu {
    position: relative;
  }

  .language__switcher__container section.language-switcher-language-url {
    top: unset;
    right: unset;
  }

  .language__switcher__container nav#block-useraccountmenu {
    left: unset;
    bottom: unset;
  }

  .language__switcher__container nav ul li a {
    padding: 0 20px;
  }

  .header__second {
    padding: 0;
    color: var(--white);
    background-color: var(--blue);
    flex-direction: column;
    row-gap: 0;
  }

  .header__first__second {
    height: 55px;
    border-top: 1px solid var(--white10);
  }

  .header__first__second__ul > div:nth-child(1) > nav > ul,
  .header__first__third__ul > div:nth-child(1) > nav > ul {
    flex-direction: row;
    align-items: center;
  }

  .header__first__second__ul li,
  .header__first__third__ul li {
    justify-content: center;
    padding: 0;
    border: 0;
  }

  .header__first__third__ul li {
    border-left: 1px dashed var(--blue15);
  }

  .header__first__third__ul li:hover {
    background-color: unset;
  }

  .header__first__second__ul li a {
    justify-content: center;
    border: 0;
    padding: 0;
  }

  .header__first__third {
    height: 70px;
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.15);
  }

  .header__first__third__ul li a {
    padding: 0 12px;
    justify-content: center;
    text-align: center;
  }

  .header__first__third__ul li:last-child {
    border-right: 1px dashed var(--blue15);
  }
}

@media screen and (min-width: 1240px) {
  .header__first {
    padding: 0 0 20px;
  }
}
