/*
- Name: megamenu.js - style.css
- Version: 1.0
- Latest update: 29.01.2016.
- Author: Mario Loncarek
- Author web site: http://marioloncarek.com
*/

.megamenu-mobile {
  display: none;
  padding: 20px;
}

.megamenu-mobile {
  text-align: right;
}

.megamenu-mobile::after {
  content: "\f0c9";
  font-family: "Font Awesome 5 Pro", sans-serif;
  font-size: 2rem;
  font-weight: 600;
  padding: 0;
  margin-left: .5rem;
  float: right;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-25%);
  -ms-transform: translateY(-25%);
  transform: translateY(-25%);
}

.megamenu > ul {
  margin: 0 auto;
  width: 100%;
  list-style: none;
  padding: 0;
  position: relative;
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  margin-bottom: 30px;
  box-sizing: border-box;
}

/* Intramu */
.megamenu.intramu > ul {
  border: none;
}

.megamenu.intramu > ul > li {
  text-align: center;
}

.megamenu.intramu > ul > li > ul > li {
  text-align: left;
  padding-right: .95rem;
}

.megamenu.intramu > ul > li > ul > li:last-of-type {
  padding-right: 0;
}

.megamenu > ul:before,
.megamenu > ul:after {
  content: "";
  display: table;
}

.megamenu > ul:after {
  clear: both;
}

.megamenu > ul > li {
  float: left;
  background: inherit;
  padding: 0;
  margin: 0;
}

.megamenu > ul > li > a {
  display: block;
  padding: 1.25rem .75rem;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-align: center;
  font-size: .75rem;
  text-decoration: none;
  font-weight: bold;
  color: #00558a;
}

.megamenu ul > li > span {
  display: inline-block;
  border-bottom: 1px solid #00558a;
  color: #00558a;
  letter-spacing: .02rem;
  font-size: .8rem;
}

.megamenu ul > li > span:first-child {
  text-transform: uppercase;
}

/* Intranet */
.url-pattern--intramu .megamenu ul > li > span {
  border-bottom: 1px solid #5398a9;
  padding: .2rem;
}

.block[role="navigation"] .megamenu > ul > li > a:hover {
  color: #575757;
}

.url-pattern--intramu .megamenu > ul > li > a {
  position: relative;
}

.megamenu > ul > li > ul {
  display: none;
  width: 100%;
  background-color: rgba(246, 246, 246, 1);
  padding: 20px;
  position: absolute;
  z-index: 99;
  left: 0;
  margin: 0;
  list-style: none;
  box-sizing: border-box;
  box-shadow: 3px 5px 10px #c0c0c0;
}

.megamenu > ul > li > ul:before,
.megamenu > ul > li > ul:after {
  content: "";
  display: table;
}

.megamenu > ul > li > ul:after {
  clear: both;
}

.megamenu > ul > li > ul > li {
  margin: 0;
  padding-bottom: 0;
  list-style: none;
  background: none;
  float: left;
  min-height: 320px;
}

.megamenu > ul > li > ul > li a {
  color: #575757;
  padding: .25rem 0;
  display: block;
  font-size: .9rem;
}

.block[role="navigation"] .megamenu > ul > li > ul > li a:hover {
  color: #00558a;
}

.megamenu > ul > li > ul > li > ul {
  display: block;
  padding: 0;
  margin: 10px 0 0;
  list-style: disc;
  box-sizing: border-box;
  margin-left: 1.2rem;
}

.megamenu > ul > li > ul > li > ul:before,
.megamenu > ul > li > ul > li > ul:after {
  content: "";
  display: table;
}

.megamenu > ul > li > ul > li > ul:after {
  clear: both;
}

/* level 2 */
.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li {
  float: left;
  width: 100%;
  margin: 0;
  font-size: .8em;
  display: list-item;
  list-style: none
}

.megamenu > ul > li > ul > li > ul > li a {
  border: 0;
  line-height: 1.1rem;
  font-size: .9rem;
}

.block[role="navigation"] .megamenu > ul > li > ul > li > ul {
  margin-left: 0;
}

.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li a {
  display: inline-block;
}

.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li a::before {
  content: "\2022";
  color: #575757;
  margin-right: .3rem;
  display: inline-block;
  font-family: Verdana, sans-serif;
}

/* level 3 */
.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li > ul {
  margin-left: .6rem;
}

.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li > ul > li {
  display: list-item;
  list-style: none
}

.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li > ul > li a {
  display: inline-block;
}

.block[role="navigation"] .megamenu > ul > li > ul > li > ul > li > ul > li a::before {
  content: "-";
  margin-right: .1rem;
  color: #0a0a0a;
  display: inline-block;
}

.megamenu > ul > li > ul.normal-sub {
  width: 300px;
  left: auto;
  padding: 10px 20px;
}

.megamenu > ul > li > ul.normal-sub > li {
  width: 100%;
}

.megamenu > ul > li > ul.normal-sub > li a {
  border: 0;
  padding: 1em 0;
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Mobile style's
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media only screen and (max-width: 1000px) {
  .block[role="navigation"] a:hover,
  .block[role="navigation"] a:focus {
    color: #14679e;
  }

  .url-pattern--intramu .block[role="navigation"] a:hover,
  .url-pattern--intramu .block[role="navigation"] a:focus {
    color: #5398a9;
  }

  .block[role="navigation"] .megamenu > ul > li > a:hover {
    color: #14679e;
  }

  .links li a {
    color: #555;
  }

  .links li a.is-active {
    color: #14679e;
    font-weight: bold;
    border-bottom: 2px solid #14679e;
  }

  /* Intranet */
  .url-pattern--intramu .links li a.is-active {
    color: #5398a9;
    border-bottom: 2px solid #5398a9;
  }

  .hamburger::after {
    margin-left: .5rem;
    content: "\f00d";
    font-family: "Font Awesome 5 Pro", sans-serif;
    font-size: 2rem;
    font-weight: 600;
  }

  a.megamenu-mobile.hamburger {
    background-color: #f0f0f0;
  }

  .megamenu-mobile.hamburger {
    text-align: right;
  }

  .mobile-mega-menu {
    background: transparent;
    position: absolute;
    top: 0;
    z-index: 100;
    left: 0;
    right: 0;
  }

  .megamenu-container {
    width: 100%;
  }

  .megamenu > ul > li > a {
    text-align: left;
    font-size: 1rem;
  }

  .megamenu > ul {
    border-top: 0;
    margin-bottom: 0;
    background-color: #f0f0f0;
    box-shadow: 0px 8px 10px #c0c0c0;
  }

  .megamenu > ul > li > a::after {
    content: "\f078";
    float: right;
    cursor: pointer;
    font-family: "Font Awesome 5 Pro", sans-serif;
    font-weight: 600;
    color: #00558a;
  }

  /* Intranet */
  .url-pattern--intramu .megamenu > ul > li > a::after {
    color: #5398a9;
  }

  .megamenu > ul > li > a.is-active::after {
    float: right;
    content: "\f077";
    font-family: "Font Awesome 5 Pro", sans-serif;
    font-weight: 600;
    cursor: pointer;
  }

  .megamenu > ul > li > ul {
    box-shadow: initial;
  }

  .megamenu > ul > li > ul > li {
    min-height: initial;
  }

  .megamenu > ul > li > a.is-active {
    background-color: #fff;
  }

  .megamenu > ul > li > a:last-child::after {
    content: "";
  }

  .megamenu > ul > li {
    width: 100%;
    float: none;
    display: block;
    border-bottom: 1px solid #ccc;
  }

  .megamenu > ul > li a {
    padding: 1.5em;
    width: 100%;
    display: block;
  }

  .megamenu > ul > li > ul {
    position: relative;
    padding: 2px 0 0 25px;
  }

  .megamenu > ul > li > ul span {
    font-size: 1rem;
  }

  .megamenu > ul > li > ul.normal-sub {
    width: 100%;
  }

  .megamenu > ul > li > ul > li {
    float: none;
    width: 100%;
    margin: 0 0 1rem;
  }

  .megamenu > ul > li > ul > li:last-child {
    margin: 0;
  }

  .megamenu > ul > li > ul > li > ul {
    position: relative;
  }

  .megamenu > ul > li > ul > li > ul > li {
    float: none;
  }

  .block[role="navigation"] li {
    border-left: 0;
  }

  .show-on-mobile > li {
    width: 100% !important;
  }

  .show-on-mobile > li > ul > li {
    width: 100% !important;
  }

  .megamenu-mobile {
    display: block;
  }

  .megamenu-dropdown-icon:before {
    display: block;
    color: #00558a;
  }

  .megamenu > ul {
    display: none;
  }

  .megamenu .show-on-mobile {
    display: block;
  }

  /* Block réseaux sociaux */
  .block-reseauxsociaux__content {
    margin: 1rem 0;
  }

  .navigation__wrapper {
    background-color: #f0f0f0;
  }

  .navigation__wrapper a:hover {
    color: #14679e;
  }

  .url-pattern--intramu .navigation__wrapper a:hover {
    color: #5398a9;
  }

  /* Intranet */
  .url-pattern--intramu .navigation__wrapper a {
    color: #5398a9;
  }

  /* Block top menu */
  .block-topmenu,
  .block-intramutopmenu {
    display: initial;
  }

  .block-topmenu .menu {
    display: block;
    border-bottom: 1px solid #ccc;
  }

  .block-topmenu .menu > li {
    display: block;
    border-top: 1px solid #ccc;
    padding: 1rem 0;
  }

  .block-topmenu .menu > li > a {
    font-size: 1rem;
    font-weight: bold;
    text-transform: uppercase;
    padding-left: 1.5rem;
    color: #00558a;
  }

  .block-topmenu > a {
    color: #fff !important;
  }

  /* Intranet */
  .megamenu ul > li > span.utilisateur__display-name {
    border-bottom: 0;
  }

  /* Block langues */
  .block-selecteurdelangue__content .menu > li > a:hover {
    color: #1468a0;
  }

  .block-selecteurdelangue__content .menu > li.is-active > a {
    color: #1779ba;
    font-weight: bold;
  }

  .block-selecteurdelangue__content .links {
    display: block;
    margin: 2rem auto;
    text-align: center;
  }

  .block-selecteurdelangue__content .links > li > a {
    margin: 0 1rem;
  }

  /* Menu intramu */
  .megamenu.intramu li a {
    line-height: 1.5;
  }

  .megamenu.intramu ul > li > span {
    margin-top: -.5rem;
    font-size: 1rem;
    line-height: 1.5;
  }

  .megamenu.intramu .show-on-mobile li {
    text-align: left;
  }

  .url-pattern--intramu .navigation__wrapper {
    background-color: #f0f0f0;
  }

  .navigation__wrapper .large-12 > div {
    width: 100%;
  }

  .megamenu.intramu .block-utilisateurdeconnexion {
    float: none;
    color: #14679e;
  }

  .megamenu.intramu .block-utilisateurdeconnexion ul {
    padding: 1.5rem 1.5rem 1.5rem 0;
    border-bottom: 1px solid #ccc;
  }

  /* Intranet */
  .url-pattern--intramu .megamenu.intramu .block-utilisateurdeconnexion {
    color: #5398a9;
  }

  .megamenu.intramu .block-utilisateurdeconnexion .utilisateur li:last-child a {
    background-color: initial;
  }

  .megamenu.intramu .rs {
    padding-top: 1.5rem;
    margin-left: 0;
  }

  .megamenu.intramu .rs a {
    color: #5398a9;
  }

  #block-intramutopmenu .menu {
    display: initial;
  }

  #block-intramutopmenu .menu > li {
    display: block;
    border-bottom: 1px solid #ccc;
  }

  .block-intramutopmenu .menu > li > a {
    display: inline-block;
    padding: 1.5rem;
    width: 100%;
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: bold;
  }

  .block-intramutopmenu .menu > li > a {
    padding-left: 1.5rem;
    letter-spacing: .1rem;
  }

  .block-intramutopmenu {
    display: block;
    text-align: left;
    clear: both;
  }

  .block-intramutopmenu .menu li:first-child a {
    margin-left: .75rem;
    width: initial;
    background-position: 0 50%;
  }

  .block-intramutopmenu .menu li:first-child {
    background-color: #5398a9;
  }

  .megamenu.intramu .navigation__wrapper {
    padding-top: 0;
  }
}
