.header { border-bottom:solid black 1px; padding:15px 0 10px 0; margin:0 var(--margin-mobile); }

.conteneur-cols { display: flex;  justify-content: space-between; flex-direction: row;  flex-wrap: wrap; gap:10px;}
.conteneur-logo {         flex: 1;        overflow: hidden;        white-space: nowrap; }

.conteneur-logo .logo { width:250px; max-width:100%; display:block; }

.conteneur-links {  display:none;  flex-basis: 100%; width:100%;  flex-wrap: wrap; }

@media only screen and (min-width: 400px) {
.conteneur-logo .logo { width:300px;  }
}
	
@media only screen and (min-width: 580px) {
.conteneur-logo .logo { width:350px;  }
}
			
@media only screen and (min-width: 1189px) {	
	.conteneur-logo { flex: 0 0 450px;  padding-right:30px; }	
	.conteneur-logo .logo { width:450px;  }
	.conteneur-links { flex: 1; display:flex; }
	.toplinks {  order:1; }
	.header { padding:15px 0 0 0; margin:0 15px; }
	}

.toplinks { flex: 0 0 100%;  order:10; }
.toplinks { border-bottom:solid black 1px; font-size:14px; padding:0 0 10px 0;  }
.toplinks a { text-decoration:none; display:inline-block; margin:0 5px  0 0; color:black;  }
.toplinks a.selected { text-decoration:underline; }

.toplinks p {  font-size:14px; margin:0; }

.quicklinks {text-align:right; }
.quicklinks > ul > li { display:inline-block; }
.quicklinks a { margin-right:20px; }
.quicklinks a:hover { text-decoration:underline;   }
.quicklinks ul { margin:0; }

span.headericons  { vertical-align:middle;width: 14px;  height: auto;  }
span.accessibility-icon {  content: url(/img/accessibility-icon.svg); }
span.search-icon {  content: url(/img/search-icon.svg);  }
span.vousetes-icon { content: url(/img/vousetes-icon.svg);}


/* BURGER ICON AND SEARCH ICON (menu open)
================================== */

.header .mainbuttons { display:flex;   -webkit-appearance: none;  outline: none; text-align:right; cursor: pointer;    background-size: contain;  flex: 0 0 30px;  align-self: right;  }
.header .mainbuttons .button { vertical-align:middle;width: 35px;  height: 35px; border-radius:50% 50%;  }
.header .mainbuttons.burger .button {  content: url("/img/burger-icon.svg");  }
.header .mainbuttons:hover .button { background-color:var(--primary-color);  }
.header .mainbuttons.search {	display:none;     }
.header .mainbuttons.search .button {     content: url("/img/search-button.svg"); }

.headerwrapper-open .mainbuttons.burger .button  {  content: url(/img/close-icon.svg); }
.headerwrapper-open .mainbuttons.search {	display:flex;  }

@media only screen and (min-width: 400px) {
.header .mainbuttons {  }
}

@media only screen and (min-width: 580px) {
.header .mainbuttons {  }	
}

@media only screen and (min-width: 1189px) {		
.header .mainbuttons {  display:none;}
}


/* NAVPLUS 
============================= */
.dropdown-wrapper.navplus button  {  
  display:none;
  -webkit-appearance: none;
  outline: none; 
  cursor: pointer;
  border: none;    
}

.dropdown-wrapper.navplus button .togglericon {
  display:inline-block;
  vertical-align:middle;
  max-width:24px;
  content: url(/img/plus-icon.svg);
  }
  
.dropdown-wrapper-open.navplus button .togglericon {content: url(/img/close-minus-icon.svg); }
	

/* MAIN NAV 
============================= */
nav.menu { flex: 0 0 100%;  order:1; }

nav  { font-size:18px; line-height:23px; font-family: 'SuisseIntl-Medium';     }
nav a {  text-decoration:none; display:block; padding: 8px; color:black;   }

nav > ul {  display: flex; flex-wrap: wrap; list-style: none;  padding: 0;  margin:0;  }
nav > ul > li {  flex: 0 0 100%;  border-bottom:solid black 1px; position:relative; }
nav > ul > li.navplus { border:none; }


nav > ul > li:hover {   }

nav a:hover {   }
nav a.selected { text-decoration:underline; }

.header ul.dropdown-content { list-style: none;  padding: 0;  margin:0;display:none; background-color:#fff;  }
.header ul.dropdown-content li a { border-top:solid black 1px;  }
.header ul.dropdown-content li:last-child { border:none;  }




.dropdown-submenu li a { padding: 8px 0;  }


/* DROPDOWN MECHANICS 
==================================================== */

.header .dropdown-content { display:none; }
.header .dropdown-wrapper-open .dropdown-content { display:block; }

.header .dropdown-content ul {list-style: none;  padding: 0;  margin:0;  }
.header .dropdown-current-item { text-decoration:underline; }
.header .dropdown-wrapper { position: relative; }

.header .dropdown-content-right { right:0; }
.header .dropdown-content-left { left:0; }

	

/* SPEC LANGSELECTOR
================================================ */
.dropdown-wrapper.langselector .dropdown-content {  background: #fff;  color: #000;  margin-top: 8px;  position: absolute;  top: 100%;  z-index: 1;    text-align:left;}

.dropdown-wrapper.langselector {  display: inline-flex;  }
.dropdown-wrapper.langselector .dropdown-content p  { font-size:14px; font-style:italic; color:#555;margin: 14px 12px 6px; }

.dropdown-wrapper.langselector .dropdown-content a {
  cursor: pointer;
  display: block;

}

.dropdown-wrapper.langselector .dropdown-content a:hover { text-decoration:underline;  }

.langselector button.dropdown-toggler {  cursor: pointer;display: flex;  align-items: center;  }
.langselector button.dropdown-toggler:hover { text-decoration:underline;   }

@media only screen and (max-width: 1188px) {
.langselector button.dropdown-toggler { display:none; }
.dropdown-wrapper.langselector .dropdown-content { display:block; position:relative; }
.langselector ul li { display:inline-block; }
.dropdown-wrapper.langselector .dropdown-content a { padding:0; margin:0 8px 0 0; }
.toplinks .langselector a.dropdown-current-item { text-decoration:underline; }
}






/* ARIANE
================================================ */
.ariane {  border-bottom:solid var(--ariane-color) 1px; padding:4px 0 4px;  margin:0 var(--margin-mobile);  color:var(--ariane-color); }
.ariane a { text-decoration:none; color:var(--ariane-color); }

@media only screen and (min-width: 1189px) {	
.ariane { margin:0 15px;}
}





/* RESPONSIVE MOBILE FIRST
=================================== */

@media only screen and (max-width: 1188px) {
	
.header ul.dropdown-vousetes li a { border-top:none;  }

.header .langselector ul.dropdown-content li a { border-top:none; }

.headerwrapper-open { position:relative; }
.headerwrapper-open .conteneur-links { position:absolute; top:100%; display:flex; background-color:white;z-index: 1000; }

nav.menu { border-bottom:solid black 1px; }

nav > ul > li:last-child > ul.dropdown-content li:last-child a {   }

nav > ul > li > ul.dropdown-content li:first-child a { border-top:none; }
nav > ul > li:first-child a { border-top:solid black 1px; }


nav > ul > li.dropdown-wrapper-open a.dropdown-toggler { background-color:var(--primary-color); border:none; }

nav a.dropdown-toggler:after, .toplinks a.dropdown-toggler:after {  content: "\203A";  display:inline-block;  vertical-align:middle; margin-left:8px;}

nav .dropdown-wrapper-open a.dropdown-toggler:after {  transform:rotate(.25turn);}

.dropdown-submenu li a {  margin-left:50px;  }

.dropdown-submenu li a { }
.dropdown-submenu li:hover {  background-color:var(--primary-color);  }

.dropdown-submenu li:hover a { text-decoration:none; color:black;   }

.dropdown-submenu li  { font-size:18px;}

.header ul.navplus-secondarymenu {   display:block;  }
.headerwrapper-open .navplus {    width:100%;}
.toplinks  { padding:20px 0; }

.toplinks .horaireouverture { margin-bottom:15px; }

.quicklinks { text-align:left; }
.quicklinks ul {  list-style-type:none; margin:0; padding:0;  }
.quicklinks > ul > li { display:block; margin-bottom:15px; }

.vousetes:after { content: "\203A";  display:inline-block;  vertical-align:middle; margin-left:8px; }

.dropdown-vousetes li a { margin-left:30px; padding:7px; }

.langselector button.dropdown-toggler { display:none; }

.dropdown-wrapper.langselector .dropdown-content { display:block; position:relative; }

.langselector ul li { display:inline-block; }
.dropdown-wrapper.langselector .dropdown-content a { padding:0; margin:0 8px 0 0; }

.toplinks .langselector a.dropdown-current-item { text-decoration:underline; }



}
	
	
	
	

		
	

/* DESKTOP 
================================== */

@media only screen and (min-width: 1189px) {

	#buttonsearch { display:none; }
	nav.menu {  order:10; padding-top:10px;  padding-bottom:10px; }	
	nav  { font-size:22px;   }
	
		
	nav a {padding: 0;  display:inline-block;  color:black;  }
	nav a:hover { text-decoration:underline;  color:black;  }
	nav a.selected { text-decoration:underline; }
	
	nav > ul {  display: flex; flex: 0 0 100%; justify-content: space-between;  } 
	nav > ul > li {  flex: auto; border:none; margin:0 0 0; }
	nav > ul > li.dropdown-toggler { position:relative; }

	


/*
	nav > ul > li > ul.dropdown-content {  position:absolute;  top:100%;  margin-top:17px;   }
	nav > ul > li > ul.dropdown-content li { border:none; transition: background-color .15s;   }
	nav > ul > li > ul.dropdown-content li a { 	text-wrap: nowrap; cursor: pointer;	padding: 15px 0 15px 0;	display: block;	 margin:0 16px 0 16px;}
	nav > ul > li > ul.dropdown-content li:last-child a { border-bottom:none; } 	
	nav > ul > li > ul.dropdown-content li:hover a { text-decoration:none; color:black; background-color:none;border-top:none;  }	
	nav > ul > li > ul.dropdown-content li:hover { background-color:var(--primary-color); border-top:solid var(--primary-color) 1px;border-bottom:solid var(--primary-color) 1px;   }	
	nav > ul > li > ul.dropdown-content li:first-child:hover {  border-top:none;   }
	nav > ul > li > ul.dropdown-content li:last-child:hover {  border-bottom:none;   }	
	nav > ul > li > ul.dropdown-content li:hover + li a { border-top:none; }
		
	nav li.dropdown-wrapper-open > ul.dropdown-content { border-top:solid black 1px; }
	nav > ul > li > ul.dropdown-content li:first-child a { border-top:none; }
	
	*/
	
		
	.header ul.dropdown-content {  position:absolute;  top:100%;  margin-top:17px;   }
	.header ul.dropdown-content li { border:none;    }
	.header ul.dropdown-content li a { 	text-wrap: nowrap; cursor: pointer;	padding: 15px 0 15px 0;	 margin:0 16px 0 16px; display: block;	/* width:400px; min-width: 100%;width: -webkit-max-content;	width: max-content; */}
	.header ul.dropdown-content li:last-child a { border-bottom:none; } 	
	.header ul.dropdown-content li:hover a { text-decoration:none; color:black; background-color:none;border-top:none;  }	
	.header ul.dropdown-content li:hover { background-color:var(--primary-color); border-top:solid var(--primary-color) 1px;border-bottom:solid var(--primary-color) 1px;   }	
	.header ul.dropdown-content li:first-child:hover {  border-top:none;   }
	.header ul.dropdown-content li:last-child:hover {  border-bottom:none;   }	
	.header ul.dropdown-content li:hover + li a { border-top:none; }
		
	.header li.dropdown-wrapper-open > ul.dropdown-content { border-top:solid black 1px; }
	.header ul.dropdown-content li:first-child a { border-top:none; }
	
	
	.navplus { flex:0 0 24px; }

	.navplus .dropdown-wrapper .dropdown-content { display:none; }

	.dropdown-wrapper.navplus button  {   margin-top:-2px; display:block; }

	.navplus .navplus-secondarymenu { position:absolute; top:100%; right:0;}
	.navplus-open .navplus-secondarymenu {  display:block;  }
				
	.header .dropdown-wrapper .dropdown-content {  background: #fff;  color: #000;  margin-top:10px;  position: absolute;  top: 100%;  z-index: 1;    text-align:left;}	
	
	
	
	.header .dropdown-wrapper .dropdown-content-small { margin-top:0; }
	.header li.dropdown-wrapper-open > ul.dropdown-content-small { border-top:none; }
	.header ul.dropdown-content-small li a { padding:8px 0 8px 0; margin:0 8px 0 8px; }
	.header ul.dropdown-content-small li:first-child a {border-top:solid black 1px; }
	.header ul.dropdown-content-small li:hover a {border-top:none; }
	.header ul.dropdown-content-small li:first-child:hover { border-top:solid var(--primary-color) 1px;   }
	
	
	
	.langselector button { margin:0 8px 0 8px; }
	.langselector ul.dropdown-content li:first-child { display:none; }
}