:root {
  --button_shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.26);
  --button_shadow_hover: 0 4px 12px 0 rgba(0, 0, 0, 0.26);
  /*--navbar_background-color: #019a6b;*/
  --navbar_background-color: var(--rouge_mrbricolage);
  --navbar_background_color_hover: #007954;
  --button-border-radius: 2px;
  --button_padding: 7px;
  --navbar_text_color: #fff;
  --navbar_divider_color: #fff;
  --navbar_box_shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
}

.container-fluid .navbar-brand img {
    background-color: white;
}

#langage_submenu {
  right: 0;
  left: auto;
}

#langage_submenu li {
  width: 100%;
  text-align: center;
}

.show {
  display: block;
}
/* ul {
  box-shadow: var(--button_shadow_hover);
} */

ul[role="menubar"] {
  padding: 10px;
  font-size: 110%;
  list-style: none;
  background-color: var(--navbar_background-color);
  margin: 0;
}

ul[role="menubar"] [role="menuitem"],
ul[role="menubar"] [role="separator"] {
  padding: 0.25em;
  background-color: var(--navbar_background-color);
  border: 2px solid var(--navbar_background-color);
}

ul[role="menubar"] [role="separator"] {
  padding-top: 0.15em;
  padding: 0px;
  height: 1px;
  background-color: var(--navbar_divider_color);
  background-position: center;
  background-repeat: repeat-x;
}

ul[role="menubar"] [role="menuitem"]:focus,
ul[role="menubar"] [role="menuitem"]:hover,
ul[role="menubar"] [role="separator"]:focus,
ul[role="menubar"] [role="separator"]:hover {
  background-color: var(--navbar_background_color_hover);
  color: white;
}

ul[role="menubar"] a[role="menuitem"] {
  text-decoration: none;
  color: var(--navbar_text_color);
}

ul[role="menubar"] li {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul[role="menubar"] > li {
  display: inline;
  position: relative;
}

ul[role="menubar"] > li > a::after {
  padding-left: 0.25em;
}

ul[role="menubar"] ul[role="menu"] {
  display: none;
  position: absolute;
  top: 0px;
  left: 0;
  margin: 0;
  padding: 0;
}

ul[role="menubar"] ul[role="menu"] li a {
  display: block!important;
  width: 10em;
}

ul[role="menubar"] ul[role="menu"] a[aria-haspopup="true"]::after {
  padding-right: 2em;
}

.block-mobile {
  display: none;
}

/* .navbar-expand .navbar-toggler {
  display: block;
} */

.nav-item {
    margin: 0 10px;
}

@media only screen and (max-width: 992px) {
  #menubar1 {
      display: none;
  }
}

@media only screen and (max-width: 700px) {
  .hide-mobile {
    display: none;
  }

  .block-mobile {
    display: block;
  }

  .max-wdt {
    max-width: 25%!important;
  }
}

@media only screen and (max-width: 600px) {
  .container-fluid .navbar-brand img {
    position: absolute;
    bottom: -15px;
    width: 140px;
    left: 0;
  }
}

/* https://mdbootstrap.com/docs/standard/extended/dropdown-multilevel/ */
.dropdown-menu li {
    position: relative;
}

.dropdown-menu .dropdown-submenu {
    display: none;
    position: absolute;
    left: 100%;
    top: -7px;
}

.dropdown-menu .dropdown-submenu-left {
    right: 100%;
    left: auto;
}

.dropdown-menu>li:hover>.dropdown-submenu {
    display: block;
}