

#menu {
}

#menu.homepage {
width:100%;
background:#FFFFFF;
}

.navbar {
	position: relative;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
}

	

.navbar>.container-fluid {
    justify-content: normal;
    align-items:end;
}


.navbar .logo {
	max-width:160px;
	margin-bottom:7px;
	transition:all 0.3s;
}

#sticky-navbar {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    transition:all 0.3s;
}

#sticky-navbar.sticky {
    position: fixed !important;
    top: 0 !important;
    right: 0;
    left: 0;
    z-index: 1030;
    animation-name: sticky-animation;
 	animation-duration: 1s;
}

body.sticky {
	margin-top:100px;
}

@keyframes sticky-animation {
  0%   { opacity:0;}
  100% { opacity:1 }
}





.navbar.sticky .logo {
	max-width:120px;
}

.navbar {
	background:#FFFFFF;
	backdrop-filter:blur(5px) opacity(1);
	transition:background 0.5s;
	z-index: 1030;
	font-size:1.2em;
	
}

.navbar-nav {
	justify-content: space-between;
}



.navbar-light .navbar-toggler {
    color: var(--blanc);
    border: none;
}

.navbar-light .navbar-toggler:focus {
    box-shadow:none;
}


.navbar-expand-lg .navbar-nav .nav-link {
    transition: all 0.3s;
}


.dropdown-menu {
	border-radius:0;
	padding:0;
	display:none;
}


.dropdown-menu li {
position: relative;
margin-bottom:0;
}



.dropdown-menu li a {
padding:0.5rem 1rem; 
}



.dropdown-menu > .nav-item:hover,
.dropdown-item:focus, .dropdown-item:hover {
    color: var(--couleur1);
    background-color: var(--couleur9);
}

.dropdown-toggle::after {
    display: none !important;
 }
 
 
 
.navbar-light .navbar-nav .nav-link {
  color: var(--couleur1);
  text-transform: uppercase;
  transition:color 0.3s;
  text-align:center;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link:active {
  color: var(--couleur2);
}

.navbar-light .navbar-nav .dropdown-menu .nav-link.dropdown-toggle {
  text-transform: none;
}


.dropdown-menu[data-bs-popper] {
    margin-top: 0rem;
    top:auto;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: var(--couleur1);
}

.dropdown-item {
	white-space: nowrap;
	color:var(--couleur2);
  background:var(--blanc);
   transition:color 0.5s, background 0.5s;
}


.menu-picto {
	width:32px;
	height:32px;
	margin:0 auto;
}


.sousmenu-picto {
	width:24px;
	height:24px;
	margin:0 10px 0 0;
	transform:translateY(-2px);
}



@media (min-width: 992px) {
  .animate {
    animation-duration: 0.3s;
    -webkit-animation-duration: 0.3s;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
  }
}

@keyframes slideIn {
  0% {
    transform: translateY(1rem);
    opacity: 0;
  }

  100% {
    transform: translateY(0rem);
    opacity: 1;
  }

  0% {
    transform: translateY(1rem);
    opacity: 0;
  }
}

@-webkit-keyframes slideIn {
  0% {
    -webkit-transform: transform;
    -webkit-opacity: 0;
  }

  100% {
    -webkit-transform: translateY(0);
    -webkit-opacity: 1;
  }

  0% {
    -webkit-transform: translateY(1rem);
    -webkit-opacity: 0;
  }
}

.slideIn {
  -webkit-animation-name: slideIn;
  animation-name: slideIn;
}



/************************
     max-width:991px
 ************************/
 
@media screen AND (max-width:991px) {
.dropdown-menu .dropdown-submenu {
display: block;
padding:0;
}

.dropdown-menu .nav-link {
  padding:0.5rem 1rem;
}
.dropdown-menu .dropdown-submenu {
border:none;
}

.dropdown-submenu li a {
	margin-left:1.5rem;
	width:calc(100% - 1.5rem);
	padding:0.2rem 1rem 0.2rem .5rem;
	font-size:1em;
	border-left:1px solid var(--couleur2);
}

.d-flex.high-res {
	display:none !important;
}

}


/************************
     min-width:992px
 ************************/


@media screen AND (min-width:992px) {
	
	.dropdown-menu .dropdown-submenu {
display: none;
position: absolute;
left: 100%;
top: -1px;
padding:0;
}

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

.d-flex.low-res {
	display:none !important;
}



	.navbar-collapse {
		display:flex !important;	
		align-self: flex-end!important;
	}
	.navbar-expand-lg .navbar-nav .nav-link {
    	padding-right: 1rem;
    	padding-left: 1rem;
}
.dropdown-menu li a {
	padding-right: 0.7rem;
    	padding-left: 0.7rem;
}
.dropdown-menu > li:hover > .dropdown-submenu,
.nav-item.dropdown:hover > .dropdown-menu {
display: block;
}
}


/************************
     min-width:1200px
 ************************/


@media screen AND (min-width:1200px) {
	.navbar-expand-lg .navbar-nav .nav-link {
    	padding-right: 2rem;
    	padding-left: 2rem;
}
.dropdown-menu li a {
	padding-right: 1rem;
    	padding-left: 1rem;
}
}


