.sub-nav {
  background: #392150;
  height: 5.5rem;
  line-height: 5.5rem;
  position: fixed;
  top: 7rem;
  left: 0;
  width: 100%;
  z-index: 50000;
  transition: background 0.4s;
  text-align: right;
  padding: 0 3.5rem;
  box-sizing: border-box;
  padding-left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.sub-nav[data-name-menu*='living-lab'],
.sub-nav[data-name-menu*='rapport-dactivite'] {
  background: #4DA1B6;
}

.sub-nav.open[data-name-menu*='living-lab'],
.sub-nav[data-name-menu*='rapport-dactivite'] {
  background: #4DA1B6;
}

.sub-nav.open[data-name-menu*='living-lab'] .sub-nav-container > ul,
.sub-nav.open[data-name-menu*='rapport-dactivite'] .sub-nav-container > ul {
  background: #4DA1B6;
}

.sub-nav.open[data-name-menu*='living-lab'] .title-sub-nav,
.sub-nav.open[data-name-menu*='rapport-dactivite'] .title-sub-nav {
    color: #FFFFFF;
}

.sub-nav-container {
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}

.sub-nav-container--switcher {
  margin-left: 2.5rem;
  padding-left: 1.875rem;
  border-left: solid 1px #FFFFFF;
  color: white;
  font-size: 1.6rem;
  line-height: normal;
  position: relative;
}

.sub-nav-container--switcher * {
  background-color: #4DA1B6 !important;
}

.sub-nav-container--switcher select {
  border: none !important;
  background-color: #4DA1B6 !important;
  color: white !important;
  font-size: 1.6rem !important;
  line-height: normal !important;
  text-transform: uppercase !important;
}

.title-sub-nav {
  color: white;
  display: inline-block;
  vertical-align: middle;
  padding: 0.5rem 2.5rem;
  margin: 0;
  margin-left: 2.5rem;
  border-right: 1px solid white;
  height: auto;
  line-height: 1;
  width: 100%;
  min-width: max-content;
  font-size: 1.8rem;
  flex: 1;
}
.title-sub-nav a,
.title-sub-nav span {
  color: inherit;
  font-size: inherit;
  text-decoration: none;
}
.title-sub-nav a:hover {
  text-decoration: underline;
}

.sub-nav-container {
  overflow: auto;
  width: auto;
  height: 100%;
  display: flex;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.sub-nav-container::-webkit-scrollbar {
  display: none;
}

.sub-nav-container > ul ul {
  display: none;
}
.sub-nav-container > ul {
  margin: 0 -1.2rem;
  display: flex;
  align-items: center;
  padding: 0 2.5rem;
}
.sub-nav-container > ul > li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-width: max-content;
}
.sub-nav-container > ul > li.current_page_item {
  /* order: -1; */
  text-decoration: underline;
  color: white;
}
.sub-nav-container > ul > li > span,
.sub-nav-container > ul > li > a {
  color: white;
  font-size: 1.6rem;
  text-decoration: none;
  padding: 0 1.2rem;
}
.sub-nav-container > ul > li > a:hover {
  text-decoration: underline;
}

@media screen and (max-width: 767px) {
  .sub-nav {
    top: 14vw !important;
  }

  .title-sub-nav {
    font-size: 3.5vw;
  }

  .sub-nav-container > ul > li > span, .sub-nav-container > ul > li > a {
    font-size: 3.5vw;
  }
}

/* Espace collaborateurs */
body.logged-in .sub-nav[data-name-menu='espace-collaborateur-visitors'],
body.logged-in .sub-nav[data-name-menu='espace-collaborateur-visitors-en'] {
  display: none !important;
}

body:not(.logged-in) .sub-nav[data-name-menu='espace-collaborateur-logged'],
body:not(.logged-in) .sub-nav[data-name-menu='espace-collaborateur-logged-en'] {
  display: none !important;
}
