/* Menus */

nav.fixed-top.scrolled {
  background-color: #fff !important;
  transition: background-color 200ms linear;
}
nav a {
  padding: 0.5rem 0;
  text-decoration: none;
  font-size: 16px;
  font-family: "Optima";
}
header nav a {
  text-transform: uppercase;
}

.menu-open .header {
  height: 100vh;
}

nav ul {
  list-style-type: none;
}
nav #logo {
  height: 60px;
}
ul {
  padding-left: 0;
}
i {
  font-size: 20px;
}
.picto {
  height: 23px;

  color: #fff;
}
.picto:hover {
  color: #fff;
}

.nav-pictos {
  line-height: 120px;
}

.separateur {
  border-right: 1px solid #fff;
}

.sub-menu {
  margin-bottom: 10px;
}
.nav-logo {
  text-align: center;
}
header nav {
  position: fixed;
  z-index: 1030;
  top: 0;
  left: 0;
  max-height: 100%;
  width: 100%;
  background-color: #fff;
}
header nav {
  overflow-y: scroll;
}

.menu-open #menu-head {
  background: #fff;
  position: fixed;
  top: 0;
  z-index: 1031;
  width: 100%;
}

.scrolled #menu-head {
  background: #fff;
}

.menu-open header nav {
  padding-top: 120px;
}

nav a,
nav h2 {
  color: #213047;
}

#main-head-container {
  z-index: 1010;
}

nav > #menu-head {
  height: 120px;
}

.word-menu {
  display: none;
}

@media (min-width: 992px) {
  .word-menu {
    display: inline;
  }
  header nav {
    overflow-y: hidden;
  }
  .sub-menu {
    display: none;
  }

  .menu-closed .sub-menu {
    display: none;
  }

  #menu-head {
    position: static;
  }
  header nav {
    position: fixed;
    top: 0;
  }

  nav a {
    font-size: 13px;
  }

  nav .menu-group > a {
    font-size: 18px;
  }

  .bg-green-lg {
    background-color: #8b9996;
  }

  .menu-open .nav-logo {
    text-align: left;
  }
}

@media (min-width: 1200px) {
  nav a {
    font-size: 16px;
  }

  nav .menu-group > a,
  nav .menu-group.second-menu a {
    font-size: 22px;
  }
}

@media (max-width: 991px) {
  nav .menu-group > a,
  nav .menu-group.second-menu a {
    font-size: 24px;
  }
}

#navbarNavDropdown {
  /*min-height: 300px;*/
  background-color: #fff;
  overflow: hidden;
}

#navbar-toggler {
  padding: 5px 15px 15px 0;
}
.header__back-link,
.menu-open .header__back-link,
.home .header__back {
  display: none;
}

.social-networks {
  height: 20px;
}

.social-networks .social-link {
  padding: 0;
}

.social-networks .social-link:not(:last-child) {
  padding-right: 10px;
}

.social-networks .social-link:last-child {
  padding-right: 20px;
}

.social-networks img {
  height: 20px;
}

/* Newsletter modal */
.newsletter-modal .modal-content {
  border-radius: 0;
  border: 0;
  font-family: "Optima";
}

.newsletter-modal .modal-body {
  text-align: center;
}

.newsletter-modal .modal-header button.close span,
.newsletter-modal .modal-header button.close:hover span {
  color: #213047;
}

@media (max-width: 1199px) {
  .social-networks,
  .join-newsletter-link {
    display: none !important;
  }
}

@media (min-width: 576px) {
  body:not(.home) .header__back-link {
    display: inline-block;
  }

  .header__back-link {
    font-size: 13px;
    padding: 10px 13px;
    border: 1px solid #fff;
    color: #fff;
  }

  .header__back-link:hover {
    background: #fff;
    color: #213047;
  }

  .scrolled .header__back-link,
  .menu-open .header__back-link,
  .single-post .header__back-link,
  .search .header__back-link,
  .single-offre_emploi .header__back-link {
    border: 1px solid #213047;
    color: #213047;
  }
  .scrolled .header__back-link:hover,
  .menu-open .header__back-link:hover,
  .single-post .header__back-link:hover,
  .search .header__back-link:hover,
  .single-offre_emploi .header__back-link:hover {
    color: #fff;
    background: #213047;
  }
}

@media (min-width: 768px) {
  .header__back-link {
    font-size: 14px;
    padding: 9px 14px;
  }
}

@media (min-width: 1200px) {
  .header__back-link {
    padding: 10px 17px;
  }
}

.nav-pictos span {
  cursor: pointer;
}
.nav-spaces {
  padding: 5px 0.75rem;
}
#search-form-container {
  top: 74px;
}
#search-form-width {
  width: 100%;
}

::-webkit-input-placeholder {
  font-style: italic;
  text-indent: 15px;
}
:-moz-placeholder {
  text-indent: 20px;
  font-style: italic;
}
::-moz-placeholder {
  text-indent: 20px;
  font-style: italic;
}
:-ms-input-placeholder {
  text-indent: 20px;
  font-style: italic;
}

@media (min-width: 576px) {
  .word-menu {
    display: inline-block;
  }
}

.logo-couleur,
.join-newsletter-link,
.social-networks,
.contact-couleur,
.recherche-couleur {
  display: none;
}

.separateur {
  border-right: 1px solid #fff;
}
.picto,
.fas,
.word-menu {
  color: #fff;
}

.scrolled .logo-couleur,
.menu-open .logo-couleur,
.menu-open .social-networks,
.menu-open .join-newsletter-link,
.scrolled .contact-couleur,
.scrolled .recherche-couleur {
  display: inline;
}

.scrolled .logo-blanc,
.menu-open .logo-blanc,
.scrolled .contact-blanc,
.scrolled .recherche-blanc {
  display: none;
}

.scrolled .picto,
.scrolled .fas,
.scrolled .word-menu {
  color: #213047;
}

.scrolled .separateur {
  border-color: #213047;
}

.menu-open .contact-blanc,
.menu-open .recherche-blanc {
  display: inline;
}

.menu-open .contact-couleur,
.menu-open .recherche-couleur,
.menu-open .word-menu {
  display: none;
}

.menu-open .separateur {
  border-color: #fff;
}

.menu-open .picto {
  color: #fff;
}

/* Single post / Search / offre emploi  */

.single-post #menu-head,
.search #menu-head,
.single-offre_emploi #menu-head {
  background: #fff;
}

.single-post .picto,
.single-post .fas,
.single-post .word-menu,
.search .picto,
.search .fas,
.search .word-menu,
.single-offre_emploi .picto,
.single-offre_emploi .fas,
.single-offre_emploi .word-menu {
  color: #213047;
}

.menu-open .single-post .picto,
.menu-open .single-post .word-menu,
.menu-open .search .picto,
.menu-open .search .word-menu,
.menu-open .single-offre_emploi .picto,
.menu-open .single-offre_emploi .word-menu {
  color: #fff;
}

.single-post .separateur,
.search .separateur,
.single-offre_emploi .separateur {
  border-color: #213047;
}

.menu-open .single-post .separateur,
.menu-open .search .separateur,
.menu-open .single-offre_emploi .separateur {
  border-color: #fff;
}

.single-post .logo-blanc,
.single-post .contact-blanc,
.single-post .recherche-blanc,
.search .logo-blanc,
.search .contact-blanc,
.search .recherche-blanc,
.single-offre_emploi .logo-blanc,
.single-offre_emploi .contact-blanc,
.single-offre_emploi .recherche-blanc {
  display: none;
}

.single-post .logo-couleur,
.single-post .contact-couleur,
.single-post .recherche-couleur,
.search .logo-couleur,
.search .contact-couleur,
.search .recherche-couleur,
.single-offre_emploi .logo-couleur,
.single-offre_emploi .contact-couleur,
.single-offre_emploi .recherche-couleur {
  display: inline;
}

.menu-open .single-post .contact-blanc,
.menu-open .single-post .recherche-blanc,
.menu-open .search .contact-blanc,
.menu-open .search .recherche-blanc,
.menu-open .single-offre_emploi .contact-blanc,
.menu-open .single-offre_emploi .recherche-blanc {
  display: inline;
}

.menu-open .single-post .contact-couleur,
.menu-open .single-post .recherche-couleur,
.menu-open .search .contact-couleur,
.menu-open .search .recherche-couleur,
.menu-open .single-offre_emploi .contact-couleur,
.menu-open .single-offre_emploi .recherche-couleur {
  display: none;
}

/* Reset Select */
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: 0;
  box-shadow: none;
  border: 0 !important;
  background: #fff;
  background-image: none;
}
/* Remove IE arrow */
select::-ms-expand {
  display: none;
}
/* Custom Select */
.select {
  position: relative;
  display: flex;
  width: 20em;
  height: 3em;
  line-height: 3;
  background: #fff;
  overflow: hidden;
}
select {
  flex: 1;
  padding: 0 0.5em;
  color: #213047;
  cursor: pointer;
}
/* Arrow */
.select::after {
  content: "\003E";
  position: absolute;
  top: 0;
  right: 5px;
  padding: 0 1em;
  background: #8b9996;
  cursor: pointer;
  pointer-events: none;
  -webkit-transition: 0.25s all ease;
  -o-transition: 0.25s all ease;
  transition: 0.25s all ease;
  -webkit-transform: translate(-33%, 0) rotate(90deg) scaleY(1.75);
  transform: translate(-33%, 0) rotate(90deg) scaleY(1.75);
}

/******************************/
