/*** fonts **/
/*** https://fonts.google.com/ 
 * télécharger la version complète variable 
 * **/
@font-face {
	font-family: "Rubik";
	src: url(/style/font/Rubik-VariableFont_wght.ttf);
	font-display: swap;
}

/*** default styles */
* {box-sizing : border-box;  padding: 0;margin: 0;}
select * {padding: 0 0.5em;}
ul, ol {list-style: none;}
a img, :link img, :visited img, object, fieldset {border: none;}
/*a:focus, a:hover {text-decoration: underline;}*/
a:active {outline: none;}
a {outline: none;}
address {font-style: normal;}
iframe {line-height : 1em; display: block;}
:link, :visited {text-decoration: none;}
legend {position: relative;left: -6px;/* ie */}
/*** font size : http://www.knacss.com/ */
html {font-size: 62.5%;}
body {background-color: #fff;color: #000;font-family: arial, sans-serif;font-size: 1.4em; /* equiv 14px */line-height: 1.5em; /* adapt to your design */}
input, select, textarea {font-size: 100%;}
/*** Float containers (http://www.csscreator.com/attributes/containedfloat.php) */
.clearfix:after {content: ".";display: block;height: 0;font-size:0;clear: both;visibility: hidden;}
.clearfix{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */
/*** Image Replacement */
.mir {letter-spacing : -1000em;}
/*\*/
* html .mir {text-indent: -999em;overflow: hidden;}
html>body .mir {letter-spacing: normal;text-indent: -999em;overflow: hidden;}/**/
/*** generic style */
.clear {clear: both;}
div.clear {height: 0;}
.no-wrap {white-space:nowrap;}
/*** error */
.errorOutput {font-weight: bold;padding: 0.5em 20px;border-top: 2px solid #eee;	border-bottom: 2px solid #eee;background: transparent url(/style/alert.gif) no-repeat left center;}
a:link, a:visited {color : #008cd9;}

body{ 
	overflow-x: hidden;   
	font-optical-sizing: auto;
	font-family: "Rubik", sans-serif; 
	font-weight: 400;
	margin : 0 50px;
	font-size: 1.5em;
}
body.grey {
	background-color : grey;
	overflow-y: hidden;
} 

:root {
	--padding : 30px;
	--gris : #a5a9a8;
	--jaune : #e8b446;
	--rouge :#d1564e ;
	--bleu : #6c91bd;
	--vert : #4c9260;
	--violet : #825a98;
	--orange : #da8763;
}

.page, .page_min {
	width : 100%;
	max-width : 1300px;
	margin : 0 auto;
}

.page_min {max-width : 800px;}
.page_demi {max-width : 650px; 
	width : 100%;}
.page_deuxtiers {max-width : 866.66px; 	width : 100%;}
.page_tiers {max-width : 433.33px; 	width : 100%;}
.page_quart {max-width : 325px; width : 100%;}

.col1-2,
.col1-3,
.col2-3,
.col3-4,
.col1-5,
.col1-6,
.col1-4 {float : left;}

.col{width: 100%; }
.col3-4{width: 75%;}
.col1-2{width: 50%;}
.col1-3{width: 33.33%;}
.col2-3{width: 66.66%;}
.col1-4{width: 25%;}
.col1-5{width: 20%;}
.col1-6{width: 16.66%;}

.flexParent {
    display: flex;
    flex-wrap: wrap;
}

.flex,
.flex1-1,
.flex1-2,
.flex1-3,
.flex2-3,
.flex3-4,
.flex1-4 { 
    display: flex;
}

.flex1-1{width: 100%;}
.flex3-4{width: 75%;}
.flex1-2{width: 50%;}
.flex1-3{width: 33.33%;}
.flex2-3{width: 66.66%;}
.flex1-4{width: 25%;}


.flexColumn {
	flex-direction: column;
	display: flex;
}

.flex_between {
    justify-content: space-between;
}

.flex_start_center {
    justify-content: flex-start;
    align-items: center;
}

.flex_center_center {
    justify-content: center;
    align-items: center;
}

.flex_between_center {
    justify-content: space-between;
    align-items: center;
}

.flex_end_center {
    justify-content: flex-end;
    align-items: center;
}

.flex_around_center {
    justify-content: space-around;
    align-items: center;
}
.flex_around {
    justify-content: space-evenly;
}

.column2 {
	column-gap: var(--padding);
	-moz-column-gap: var(--padding);
	-moz-columns: 2 auto;
	-webkit-column-gap:var(--padding);
	-webkit-columns: 2 auto;
	columns: 2;
}

.column3 {
	column-gap: var(--padding);
	-moz-column-gap: var(--padding);
	-moz-columns: 3 auto;
	-webkit-column-gap: var(--padding);
	-webkit-columns: 3 auto;
	columns: 3;
}

.padding{ padding: var(--padding); }
.paddingX2{ padding: 50px; }
.paddingLR{ 
	padding-left: var(--padding);
	padding-right: var(--padding);
}
.paddingTB{ 
	padding-top: var(--padding);
	padding-bottom: var(--padding);
}

.position_relative { position: relative; }

.oHidden { overflow: hidden; }
.block {display: block;}
/*gestion des couleurs et des fonds  */
 
.bg_gris_fonce {background-color : var(--gris-fonce); color : #fff;}
.bg_gris_clair {background-color : var(--gris-clair); color : #000;}
.bg_blanc {background-color : #fff; color : #000;}

	.bg_gris { background-color : var(--gris); }
	.bg_jaune { background-color : var(--jaune); }
	.bg_rouge { background-color : var(--rouge); }
	.bg_bleu { background-color : var(--bleu); }
	.bg_vert { background-color : var(--vert); }
	.bg_violet { background-color : var(--violet); }	
	.bg_orange { background-color : var(--orange); }	

	.color_gris { color : var(--gris); }
	.color_jaune { color : var(--jaune); }
	.color_rouge { color : var(--rouge); }
	.color_bleu { color : var(--bleu); }
	.color_vert { color : var(--vert); }
	.color_violet { color : var(--violet); }
	.color_orange { color : var(--orange); }

.bg_gris_clair a:link, .bg_gris_clair a:visited, 
.bg_blanc a:link, .bg_blanc a:visited {color : #000;} 
.bg_gris_fonce a:link, .bg_gris_fonce a:visited {color : #fff;} 


.section {padding : 60px 0; position: relative;}
.section.paddingNoBottom {padding-bottom : 0; }

.margin_auto{margin: 0 auto;}

.relative{position : relative;}

.float_right {float : right;}
.float_left {float : left;}

.align_center {text-align : center;}
.align_right {text-align : right;}

.maj { text-transform: uppercase; }
.italic { font-style: italic; }
.noItalic { font-style: normal; }

.thin { font-weight: 100; }
.extralight { font-weight: 200; }
.light { font-weight: 300; }
.normal { font-weight: 400; }
.medium { font-weight: 500; }
.semibold { font-weight: 600; }
.bold { font-weight: 700; }
.extrabold { font-weight: 800; }
.black { font-weight: 900; }

.big { font-size: 120%; }
.extrabig { font-size: 140%; }
.small { font-size: 80%; }
.extrasmall { font-size: 60%; }

.block { display: block; }

/*** animations ***********************************/

.zoom_container {
	display: block;
	overflow: hidden;
	line-height: 0;
}

.zoomup { transition: 0.4s; }
.zoomup:hover {transform: scale(1.2);}

.zoomdown { transition: 0.4s; }
.zoomdown:hover {transform: scale(0.8);}

.zoomtourne { transition: 0.4s;}
.zoomtourne:hover {transform: rotate(15deg) scale(0.9);}

.zoominfini:hover {
	animation-duration: 0.8s;
	animation-name: zoominfini;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in-out;
}

@keyframes zoominfini {
  from { transform: scale(1); }
  to   { transform: scale(1.2); }
}

.fade {
	opacity: 0;
	transition: 1s;
}

.fondu_top {
	opacity: 0;
	position: relative;
	margin-top: 200px;
	transition: all 1s, width 0s;
}

.fondu_left {
	opacity: 0;
	position: relative;
	left: -1000px;
	transition: all 1s, width 0s;
}

.fondu_right {
	opacity: 0;
	position: relative;
	left: 1000px;
	transition: all 1s, width 0s;
}

.fondu_revele {
	opacity: 1;
	top: 0;
	left: 0;
	z-index: 100;
	margin-top: 0;
}

.fondu_intro {
	opacity : 0;
	overflow : hidden; 
	-webkit-animation: anim-opa-grid 3s ease-in-out forwards; /* Safari 4+ */
	-moz-animation:    anim-opa-grid 3s ease-in-out forwards; /* Fx 5+ */
	-o-animation:      anim-opa-grid 3s ease-in-out forwards; /* Opera 12+ */
	animation:         anim-opa-grid 3s ease-in-out forwards; /* IE 10+, Fx 29+ */
}

@-webkit-keyframes anim-opa-grid {
  from { opacity: 0; }
    to { opacity: 1; }
  
}
@-moz-keyframes anim-opa-grid {
   from { opacity: 0; }
    to { opacity: 1; }
}
@-o-keyframes anim-opa-grid {
   from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes anim-opa-grid {
  from { opacity: 0; }
    to { opacity: 1; }
}

.duree_transition1 { transition: 0.5s; }
.duree_transition2 { transition: 1s; }
.duree_transition3 { transition: 1.5s; }
.duree_transition4 { transition: 2s; }
.duree_transition5 { transition: 2.5s; }


/*** header  *****************************************/
	header {
		position: fixed; 
		width : 100%; 
		z-index : 100; 
		top : 0; 
		left : 0;
		padding : 20px 50px;
	}

	a#logo .img_100{
		display : block;
	}
	
	#slider {padding-top : 190px; }	
/*	.lightslider, .lSSlideOuter , .lSSlideWrapper, .lslide {max-height : 68vh}*/
/*** menu *****************************************/
	nav li {display : inline-block;
			position: relative; }

		nav li a, nav li span{
			display : block; 
			padding : 0 10px; 
			cursor : pointer;
			font-weight: 500;
			text-transform: uppercase;
			border-left : 1px solid; 
		}

		nav li a::after, nav li span::after  {
			display: block;
			position: absolute;
			bottom : -5px; 
			left : 50%;
			transform: translateX(-50%);
			content  :  "";
			
			height: 1px;
			background: #000;
			width: 0;
			transition : all 0.5s;

		}

		nav li li a::after { bottom : 5px; }
		nav li:first-child a {border-left : none;}
		
		nav li span:focus::after, nav li span:hover::after,
		nav li a:focus::after, nav li a:hover::after,
		#accueil nav li#nav-accueil a::after,
		#peintures nav li#nav-peintures a::after,
		#enduits nav li#nav-enduits a::after,
		#chaux nav li#nav-chaux a::after,
		#nuancier nav li#nav-nuancier a::after,
		#stucs nav li#nav-stucs a::after,
		#agricole nav li#nav-agricole a::after,
		#produits_complementaires nav li#nav-produits_complementaires a::after,
		#systeme_enduit_ite_iti nav li#nav-systeme_enduit_ite_iti a::after,
		#charges_minerales nav li#nav-charges_minerales a::after,
		#conseils nav li#nav-conseils a::after,
		#realisations nav li#nav-realisations a::after,
		#contact nav li#nav-contact a::after {
			
			width : calc(100% - 20px); 
		}
			
		#lien_distributeurs {
			font-weight: 800;
			font-size : 140%;
		}


		nav li:focus > div, nav li:hover  > div {
			display : block;
		}

		@media all and (min-width: 620px) {

			nav .subNav {
				background : #fff;
				position : absolute;
				top: 35px;
				z-index: 1000;
				text-align: left;
				transition : height 5s;
				overflow: hidden;
				max-height: 0;
				width : auto;
				min-width: 250px;
				transition: max-height 0.45s ease-out;
				box-shadow : 0px 6px 5px 0px rgba(0,0,0,0.2);
				border-top: none;
				border-bottom: none;
				padding: 0; 
			}


			nav li:focus .subNav, nav li:hover .subNav {
			   max-height: 1000px; 
			   transition: max-height 0.55s ease-in;
			}

			nav .subNav li {
				display: block;
				border-top : none; 
				padding : 10px;

			}

			nav .subNav li a {
				padding : 2px 0;
				color : #000!important;
				display: block;
			
				border-left : none;
			}
			/*nav .subNav li a:hover, nav .subNav li a:focus,
			#enduits nav .subNav li#nav-enduits a,
			#peintures nav .subNav li#nav-peintures a,
			#chaux nav .subNav li#nav-chaux a {
			
			
			}*/

		}
		#nav-distributeurs {display: none}

/*** liste + paragrahe  *****************************************/
	ul.list{
		list-style-type : disc;
		margin-left : 15px;
	}

	ul.inline li{
		display : inline-block;
		padding : 0 10px;
	}
	
	.section  p, .popin p {margin-bottom : 20px; text-align: justify;}
	.intro {font-size: 120%; font-weight : 600;}
	.section  p.noMargin {margin-bottom : 0px;}

	.img_100 {
		max-width : 100%;
		display : block; 
		line-height : 1; 
		width : auto;
		height : auto;
	}

	.img_cover {
		display: block;
		width: 100%;
		height: 100%;
		object-position: center;
		object-fit: cover;
	}

	#bg_accueil_01 {
		position: relative;

	}

	#bg_accueil_01::after {
		position: absolute;
		top : 0;
		bottom : 0;
		right: 0;
		transform : translateX(100%);
		display: block;
		width : 100%; 
		content : ''; 
		background :transparent url(/style/accueil/mise-en-pot-produits-a-la-chaux.jpg) no-repeat left top;
	}

	.picto_accueil {
		font-weight: 900;
		font-size : 180%;
		text-transform: uppercase;
		background: transparent url(/style/accueil/picto-accueil-1.png) no-repeat left center;
		height : 63px;
		padding : 25px 0 0 80px;
		display: block;
		transition: all 0.5s;
		text-align: left;
	}


	.picto_accueil2 {background-image: url(/style/accueil/picto-accueil-2.png);}
	.picto_accueil3 {background-image: url(/style/accueil/picto-accueil-3.png);}


	.picto_accueil:hover, .picto_accueil:focus {
		transform: scale(1.1);
	}

	  .cls-1 {
        stroke-width: 0px;
   }

   .picto-svg {
   	width: 50px;
   }

   .fill_jaune svg{
        fill: var(--jaune);
   }
   .fill_gris svg{
        fill: var(--gris);
   }
   .fill_bleu svg{
        fill: var(--bleu);
   }
   .fill_vert svg{
        fill: var(--vert);
   }
   .fill_rouge svg{
        fill: var(--rouge);
   }
   .fill_violet svg{
        fill: var(--violet);
   }
   .fill_noir svg{
        fill: #000;
   }

   #nuancier_accueil svg {transition: all 0.4s; padding-bottom: 5px;}
   #nuancier_accueil:hover svg {
   		transform: rotate(-50deg);
   }


   #nuancier_accueil svg #path837, 
   #nuancier_accueil svg #path839, 
   #nuancier_accueil svg #path841, 
   #nuancier_accueil svg #path843, 
   #nuancier_accueil svg #path845, 
   #nuancier_accueil svg #path847, 
   #nuancier_accueil svg #path849  {transition: all 0.4s; opacity: 0}
   
   #nuancier_accueil:hover svg #path837, 
   #nuancier_accueil:hover svg #path839, 
   #nuancier_accueil:hover svg #path841,
   #nuancier_accueil:hover svg #path843,
   #nuancier_accueil:hover svg #path845,
   #nuancier_accueil:hover svg #path847,
   #nuancier_accueil:hover svg #path849 { opacity: 1}
/*** distrubiteurs   *****************************************/ 
.nav-distrubiteurs li {margin : 0 0 10px 0} 
.nav-distrubiteurs a, 
.bloc_distributeur a {
	border-bottom : 2px solid transparent;
	transition : all 0.5s;
}
.nav-distrubiteurs a:hover,
.nav-distrubiteurs a:focus,
.bloc_distributeur a:hover,
.bloc_distributeur a:focus {
	border-bottom : 2px solid #000;
}
/*** bandeau  *****************************************/ 

.bandeau {
	background: transparent none no-repeat center center;
	height : 500px;
	background-size : cover; 
	position: relative;
	margin-top : 190px;
}

#bandeau_chaux {
	background-image : url(/style/slider/slide3-pozzonuovo.jpg);
}

	#chaux #bandeau_chaux {
		background-image : url(/style/produits/fond/CHAUX-EN-PATE-pozzo-nuovo.jpg);
	}

	#enduits #bandeau_chaux {
		background-image : url(/style/produits/fond/ENDUITS-pozzo-nuovo.jpg);
	}

	#peintures #bandeau_chaux {
		background-image : url(/style/produits/fond/PEINTURE-chaux-pozzo-nuovo.jpg);
	}

	#stucs #bandeau_chaux {
		background-image : url(/style/produits/fond/STUCS-pozzo-nuovo.jpg);
	}

	#agricole #bandeau_chaux {
		background-image : url(/style/produits/fond/AGRICOLE-pozzo-nuovo.jpg);
	}

	#systeme_enduit_ite_iti #bandeau_chaux {
		background-image : url(/style/produits/fond/isolation-facade-chaux.jpg);
	}

	#produits_complementaires #bandeau_chaux {
		background-image : url(/style/produits/fond/PRODUITS-COMPL-pozzo-nuovo.jpg);
	}

	#charges_minerales #bandeau_chaux {
		background-image : url(/style/produits/fond/CHARGE-MINERALE-pozzo-nuovo.jpg);
	}
	
	#nuancier #bandeau_chaux {
		background-image : url(/style/produits/fond/NUANCIER-pozzo-nuovo.jpg);
	}

	#contact #bandeau_chaux {
		background-image : url(/style/fond/CONSEIL-pozzo-nuovo.jpg);
	}

	#realisations #bandeau_chaux {
		background-image : url(/style/fond/REALISATION-pozzo-nuovo.jpg);
	}

	#conseils #bandeau_chaux {
		background-image : url(/style/fond/CONSEIL-pozzo-nuovo.jpg);
	}
	#distributeurs #bandeau_chaux {
		background-image : url(/style/fond/DISTRIBUTEURS-pozzo-nuovo.jpg);
	}


.bandeau .like_h2.titre_bandeau {
	display: block;
	position: absolute;
	bottom : -82px; 
	left : 0;
	padding : var(--padding);
	width: calc(50% - 216px);
	background: #fff;
	text-align: right;
	margin : 0;
	z-index : 20;
}

.bandeau + section.section {
	padding-top : 140px;
}

.border_bottom {
	border-bottom : 15px solid;
}

.teinte {padding : 15px; position: relative;}
.code-teinte {
	display: block; 
	position : absolute;
	top : 50%; 
	transform: translateY(-50%);
	right: 15px;
	border : 1px solid #fff;
	color : #fff; 
	border-right : none;
	padding : 0px 10px;
}

.noire { border : 1px solid #000}
.noire .code-teinte { color : #000; border-color: #000}
/*** faq ***/

	.articleFaq {
		border-bottom : 1px solid #cecece;
	}
	.suite_faq {display: block; width: 100%;}
	.articleFaq > div { display : none; }

	.articleFaq h3.like_h3 {
		text-transform: none;
		margin-bottom: 0;
	}

	.suite_faq {position: relative; padding-right : 30px;}
	.suite_faq i{position: absolute; top : 0; right: 0}

	.reponse_faq p:first-child {margin-top : 20px}

	.tableau_faq {
		width: 100%;
		border-collapse: collapse;
	}

	.tableau_faq td{
		border : 1px solid #eee; 
		padding : 10px;
	}

	.nav-ancre li{
		border-left : 1px solid #000;
	}
	.nav-ancre li:first-child{ border: none; }

/*** footer  *****************************************/

footer ul li a {
	padding-bottom: 5px;
	display: block;
}

	.nav-mentions li, .nav_rs li{
		display : inline-block;
	}

		.nav-mentions li a, .nav_rs li a{padding : 0 5px;}

		.nav-mentions li a {font-size : 75%; border-left : 1px solid; }

			.nav-mentions li:first-child a{
				border-left : none; 
			}
			
	.titre_footer {
		display :  block; 
		font-size : 120%;
		font-weight : 900;
	}

	.border_footer {
		position: relative;
	}

	.border_footer::before, .border_footer::after {
		position : absolute;
		right : 0;
		display: block;
		background: #000;
		height : 10px; 
		width : calc(50% - 30px);
		content : "";
	}

	.border_footer::before {
		top :40px;
	}

	.border_footer::after {
		bottom: 40px;
	}
/*** titre *****************************************/

h2, .like_h2 {
	font-size : 230%;
	text-transform: uppercase;
	font-weight: 800;
	display: block;
	line-height: 1.2em;
	margin-bottom : var(--padding); 
}
	#slider .like_h2, .bandeau .like_h2 {
		font-size: 380%;
	}
h3, .like_h3 {
	font-size : 120%;
	text-transform: uppercase;
	font-weight: 600;
	display: block;
	line-height: 1.2em;
	margin-bottom : 10px;
}

	.titre_2_slide {
		font-size: 220%;	
		font-size : 180%;
		text-transform: uppercase;
		font-weight: 300;
		display: block;
		line-height: 1.3em;
	}
h4, .like_h4 {
	font-size : 120%;
}

/** accueil **/

.bloc_produits {position: relative;}
.bloc_produits a, .bloc_produits > div  {
	position : relative;
	display: block;
}

.bloc_produits > div  {
	padding-bottom: 30px;
}


.bloc_produits a::after, .bloc_produits > div::after {
	position : absolute;
	bottom : 0;
	display: block;
	left : 0; 
	right : 0; 
	width : calc(100% - 60px);
	margin : auto; 
	height : 80px;
	z-index : 0;
	content : "";
	transition: all 0.5s;
}

 .bloc_produits > div::after {

	height : 100px;
 }

.bloc_produits.bloc_entier > div::after {
	width : 100%;
}

.bloc_produits.bloc_entier > div {margin-bottom: 30px;}


.bloc_produits .rouge::after {background: var(--rouge);}
.bloc_produits .gris::after {background: var(--gris);}
.bloc_produits .jaune::after {background: var(--jaune);}
.bloc_produits .bleu::after {background: var(--bleu);}
.bloc_produits .vert::after {background: var(--vert);}
.bloc_produits .violet::after {background: var(--violet);}
.bloc_produits .orange::after {background: var(--orange);}

.bloc_produits a:hover:after {height : 90%;}

.bloc_produits img, .bloc_produits svg {
	z-index : 10;
	position: relative;
	transform: scale(0.95);
	transition: all 0.2s;
}

.border_gris::after {background-color: transparent; border: 5px solid var(--gris); }


.bloc_produits a:hover img, .bloc_produits a:hover svg {transform: scale(1) rotate(8deg);}

.bloc_produits h3,.bloc_produits span {
	text-transform: uppercase;
	font-weight : 900;
	text-align: center;
	font-size : 130%;
	margin-top : 10px;
	display: block;
}
	#accueil .bloc_produits h3 {height : 55px; }
	.conditionements_produits {
		bottom : 0; 
		left : 50%; 
	/*	min-width : 220px;*/
		z-index: 30;
		position : absolute;
		width: 100%;
  text-align: center;
		transform : translateX(-50%);
	}
	.bloc_produits .conditionement_produit { 
		border-left : 1px solid #fff;
		border-right : 1px solid #fff;
		border-top: 1px solid #fff;
		font-weight: 600;
 		color: #fff;
 		display : inline-block;
 		font-size : 90%; 
 		padding : 1px 8px 15px 8px; 
 		margin : 0 5px;
	}

 .bg_texture {
 		background: #fff url(/style/accueil/fond-enduit-a-la-chaux-accueil.jpg) no-repeat center 380px;
 }

	#bg_conseils_app {
		background: transparent url(/style/accueil/enduit-a-la-chaux.jpg) no-repeat right top;
		padding-top : 200px;
	}
	

.popin {
  position: fixed;
  top: 0;
  left: -9999px;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000000;
  opacity: 0;
  -webkit-transition: opacity 0.4s, left 0s 0.4s;
  -moz-transition: opacity 0.4s, left 0s 0.4s;
  transition: opacity 0.4s, left 0s 0.4s;
}

.popin.ouvert {
  left: 0;
  opacity: 1;
  -webkit-transition: opacity 0.4s, left 0s;
  -moz-transition: opacity 0.4s, left 0s;
  transition: opacity 0.4s, left 0s;
}

.popin .chargement {
  z-index: 10;
  background-color: transparent;
}

.popin-wrap {
  float: right;
  position: relative;
  width: 85%;
  max-width: 1040px;
  height: 100%;
  background-color: #f5f5f5;
  box-shadow: -5px 0 5px 0 rgba(0, 0, 0, 0.1);
  transform: translate3d(100%, 0, 0);
 transition: transform 0.4s cubic-bezier(0.47, 0.01, 0.37, 0.98), left 0s 0.4s;
 }

.ouvert .popin-wrap {
  transform: translate3d(0, 0, 0);
   transition: transform 0.4s cubic-bezier(0.47, 0.01, 0.37, 0.98) 0.2s, left 0s 0.2s;
}

@media screen and (max-width: 64em) {
  .popin-wrap {
    width: 90%;
    max-width: 100%;
  }
}

@media screen and (max-width: 48em) {
  .popin-wrap {
    width: 100%;
    max-width: 100%;
  }
}

 .popin-close {
  position: absolute;
  top: 20px;
  left: -30px;
  z-index: 2;
}

@media screen and (max-width: 48em) {
 .popin-close {
    left: 10px;
    top: 10px;
  }
}

.popin-scroll {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: auto;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 0;
}

@media screen and (max-width: 64em) {
  .popin-scroll {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }
}

.popin-content {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  padding: 80px 60px;
}

@media screen and (max-width: 64em) {
  .popin-content {
    padding: 60px 40px;
  }
}

@media screen and (max-width: 48em) {
  .popin-content {
    padding: 60px 20px;
  }
}
main {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #f5f5f5;
  overflow: auto;
  overflow-x: hidden;
  overflow-y: auto;
  transition: transform 0.4s 0.1s;
}

main.dezoome {
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
  overflow: hidden;
  overflow-y: hidden;
  transform: scale(0.9);
  transition: transform 0.4s cubic-bezier(0.06, 0.29, 0.25, 1);
 }


.popin-close {
  width: 60px;
  height: 60px;
  line-height: 60px;
  font-size: 20px;
  text-align: center;
  background: #10359b;
  color : #fff;
  border-radius: 100%;
  box-shadow: 1px 3px 27px 0 rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

.popin-close:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  background: rgba(0, 0, 0, 0.1);
  opacity: 0;
  z-index: -1;
  transform: scale(0.1);
  transition: transform 0s 0.2s, opacity 0.2s;
}
.popin-close:hover::before{
  opacity: 1;
  transform: scale(1);
  transition: transform 0.3s, opacity 0s;
}

.popin-article {
	background-color: #fff;
	color: #333f48 !important;
	z-index: 2;
	padding : var(--padding);
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	margin-bottom : 60px;
}

.table_couleur {
	width: 100%;
	margin-top : 10px;
	border-collapse: collapse;
}

.table_couleur td, .table_couleur th {
	padding : 5px; border : 1px solid rgba(0,0,0,.3);
	text-align: center;
}

	#carte_accueil { width : calc(50vw + 265px); }

	.imgRea {
	  display: block;
	  height: 250px;
	  overflow: hidden;
	  position: relative;
	  margin-bottom: 10px;
	}

	.border_plus_after {
		position: relative;
	}

	.border_plus_after::after {
		position: absolute;
		content : ""; 
		height : 3px; width : 80px; 
		background: #000;
		display: block;
		bottom : 10px;
		left : 30px;
	}

	#nuancier_accueil {
		position: absolute;
		right: 0;
		bottom: 0;
		display: block;
		max-width: 400px;
		width: 98px;
		text-align: center;
		text-transform: uppercase;
		font-weight: 300;
		font-size: 90%;
		line-height : 1.1em;
		padding: 20px;
		background: #fff;
		/* border-bottom-left-radius: 30px; */

	}
/*** lien *****************************************/

.btn_suite {
	display : inline-block; 
	text-transform : uppercase;	
	padding : 2px 5px;
	background : #fff;
	border-left : 3px solid #000;
	border-right : 3px solid #000;
	line-height: 1em;
	color : #000;
	font-family: "Rubik";
	font-weight: 900;
	appearance:none;
	-moz-appearance:none; /* Firefox */
	-webkit-appearance:none; /* Safari and Chrome */
	transition: all 0.5s;
	cursor : pointer;
	position : relative;
}

	.btn_suite::before, .btn_suite::after  {
	    content: "";
	    position: absolute;
	    width: 0%; 
	    height: 3px;
	    background: #000;
	    transition: all 0.4s ease-in-out;
	}
	
	.btn_suite::before {
		top: 0;
		left: 0;
	}	
	
	.btn_suite::after {
		bottom: 0;
		right: 0;
	}
	
	.btn_suite:hover::before, .btn_suite:hover::after {
		width: 100%;
		transition: all 0.4s ease-in-out;
	}


	.btn_suite:hover, .btn_suite:focus {
		background: #000;
		color : #fff!important; 
	}
	

/*** actualites  *****************************************/

	.imgActu {
		display : block;
		height : 150px;
		overflow : hidden;
		position : relative;
	}	

		.imgActu img {
			max-height : 100%;
			margin : 0 auto;	
			position : absolute; 
			top : 50%; 
			left : 50%; 
			transform : translate(-50%,-50%);
		}
		
		
			.imgActu span{
				position : absolute; 
				top : 50%; 
				left : 50%; 
				transform : translate(-50%,-50%);
				text-transform : uppercase; 
				color : rgba(146,143,143,0.5);
				font-weight : 300;
				text-align : center;
				font-size : 95%;
			}
			
			.imgActu span::before{
				content : '\f030';
				font-family : "Font Awesome 6 Free"; 
				font-weight: bold;
				display : block;
				font-size : 200%;
				color : rgba(146,143,143,0.5);
			}

		.video-responsive {
			overflow:hidden;
			padding-bottom:56.25%;
			position:relative;
			height:0;
		}

		.video-responsive iframe {
			left:0;
			top:0;
			height:100%;
			width:100%;
			position:absolute;
		}

		a.ico-pdf:link, a.ico-pdf:visited {
			border-bottom : 1px solid transparent;
			transition : all 0.5s;
		}

		a.ico-pdf:hover, a.ico-pdf:focus {
			border-bottom : 1px solid #000;
		}

/*! lightslider - v1.1.3 - 2015-04-14
* https://github.com/sachinchoolur/lightslider
* Copyright (c) 2015 Sachin N; Licensed MIT */
.lSSlideWrapper,.lSSlideWrapper .lSFade{position:relative}.lSSlideWrapper .lSSlide,.lSSlideWrapper.usingCss .lSFade>*{-webkit-transition-timing-function:inherit!important;transition-timing-function:inherit!important;-webkit-transition-duration:inherit!important;transition-duration:inherit!important}.lSSlideOuter,.lSSlideOuter .lSPager.lSGallery{-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}.lSSlideOuter .lSPager.lSGallery:after,.lSSlideWrapper>.lightSlider:after{clear:both}.lSSlideOuter{overflow:hidden;user-select:none}.lightSlider:after,.lightSlider:before{content:" ";display:table}.lightSlider{overflow:hidden;margin:0}.lSSlideWrapper{max-width:100%;overflow:hidden}.lSSlideWrapper .lSSlide{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0);-webkit-transition:all 1s;transition:all 1s;-webkit-transition-property:-webkit-transform,height;-moz-transition-property:-moz-transform,height;transition-property:transform,height}.lSSlideWrapper .lSFade>*{position:absolute!important;top:0;left:0;z-index:9;margin-right:0;width:100%}.lSSlideWrapper.usingCss .lSFade>*{opacity:0;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-property:opacity;transition-property:opacity}.lSSlideWrapper .lSFade>.active{z-index:10}.lSSlideWrapper.usingCss .lSFade>.active{opacity:1}.lSSlideOuter .lSPager.lSpg{margin:10px 0 0;padding:0;text-align:center}.lSSlideOuter .lSPager.lSpg>li{cursor:pointer;display:inline-block;padding:5px 8px}.lSSlideOuter .lSPager.lSpg>li a{background-color:#222;border-radius:30px;display:inline-block;height:12px;overflow:hidden;text-indent:-999em;width:12px;position:relative;z-index:99;-webkit-transition:all .5s linear 0s;transition:all .5s linear 0s}.lSSlideOuter .lSPager.lSpg>li.active a,.lSSlideOuter .lSPager.lSpg>li:hover a{background-color:#428bca}.lSSlideOuter .media{opacity:.8}.lSSlideOuter .media.active{opacity:1}.lSSlideOuter .lSPager.lSGallery{list-style:none;padding-left:0;margin:0;overflow:hidden;transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;user-select:none}.lSSlideOuter .lSPager.lSGallery li{overflow:hidden;-webkit-transition:border-radius .12s linear 0s .35s linear 0s;transition:border-radius .12s linear 0s .35s linear 0s}.lSSlideOuter .lSPager.lSGallery li.active,.lSSlideOuter .lSPager.lSGallery li:hover{border-radius:5px}.lSSlideOuter .lSPager.lSGallery img{display:block;height:auto;max-width:100%}.lSSlideOuter .lSPager.lSGallery:after,.lSSlideOuter .lSPager.lSGallery:before{content:" ";display:table}.lSAction>a{width:32px;display:block;top:50%;height:32px;background-image:url(/style/controls.png);cursor:pointer;position:absolute;z-index:99;margin-top:-16px;opacity:.5;-webkit-transition:opacity .35s linear 0s;transition:opacity .35s linear 0s}.lSAction>a:hover{opacity:1}.lSAction>.lSPrev{background-position:0 0;left:0px}.lSAction>.lSNext{background-position:-32px 0;right:0px}.lSAction>a.disabled{pointer-events:none}.cS-hidden{height:1px;opacity:0;filter:alpha(opacity=0);overflow:hidden}.lSSlideOuter.vertical{position:relative}.lSSlideOuter.vertical.noPager{padding-right:0!important}.lSSlideOuter.vertical .lSGallery{position:absolute!important;right:0;top:0}.lSSlideOuter.vertical .lightSlider>*{width:100%!important;max-width:none!important}.lSSlideOuter.vertical .lSAction>a{left:50%;margin-left:-14px;margin-top:0}.lSSlideOuter.vertical .lSAction>.lSNext{background-position:31px -31px;bottom:10px;top:auto}.lSSlideOuter.vertical .lSAction>.lSPrev{background-position:0 -31px;bottom:auto;top:10px}.lSSlideOuter.lSrtl{direction:rtl}.lSSlideOuter .lSPager,.lSSlideOuter .lightSlider{padding-left:0;list-style:none}.lSSlideOuter.lSrtl .lSPager,.lSSlideOuter.lSrtl .lightSlider{padding-right:0}.lSSlideOuter .lSGallery li,.lSSlideOuter .lightSlider>*{float:left}.lSSlideOuter.lSrtl .lSGallery li,.lSSlideOuter.lSrtl .lightSlider>*{float:right!important}@-webkit-keyframes rightEnd{0%,100%{left:0}50%{left:-15px}}@keyframes rightEnd{0%,100%{left:0}50%{left:-15px}}@-webkit-keyframes topEnd{0%,100%{top:0}50%{top:-15px}}@keyframes topEnd{0%,100%{top:0}50%{top:-15px}}@-webkit-keyframes leftEnd{0%,100%{left:0}50%{left:15px}}@keyframes leftEnd{0%,100%{left:0}50%{left:15px}}@-webkit-keyframes bottomEnd{0%,100%{bottom:0}50%{bottom:-15px}}@keyframes bottomEnd{0%,100%{bottom:0}50%{bottom:-15px}}.lSSlideOuter .rightEnd{-webkit-animation:rightEnd .3s;animation:rightEnd .3s;position:relative}.lSSlideOuter .leftEnd{-webkit-animation:leftEnd .3s;animation:leftEnd .3s;position:relative}.lSSlideOuter.vertical .rightEnd{-webkit-animation:topEnd .3s;animation:topEnd .3s;position:relative}.lSSlideOuter.vertical .leftEnd{-webkit-animation:bottomEnd .3s;animation:bottomEnd .3s;position:relative}.lSSlideOuter.lSrtl .rightEnd{-webkit-animation:leftEnd .3s;animation:leftEnd .3s;position:relative}.lSSlideOuter.lSrtl .leftEnd{-webkit-animation:rightEnd .3s;animation:rightEnd .3s;position:relative}.lightSlider.lsGrab>*{cursor:-webkit-grab;cursor:-moz-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab}.lightSlider.lsGrabbing>*{cursor:move;cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:-o-grabbing;cursor:-ms-grabbing;cursor:grabbing}

/*** icone  *****************************************/


	.ico::before{
		font-family : 'Font Awesome 6 Free'; 
		font-size : 120%; 
		padding-right : 5px; 
		font-weight: bold;
	}
	.ico-regular::before{
		font-weight: normal;
	}
	
	 p.ico span{overflow : hidden; display : inline;}
	 p.ico::before{display : inline;}
	
	.ico-eye::before { content : "\f06e";}
	.ico-map::before { content : "\f3c5";}
	.ico-map-marker::before { content : "\f041";}
	.ico-mobile::before { content : "\f3cd";}
	.ico-phone::before { content : "\f095";}
	.ico-web::before { content : "\f0ac";}
	.ico-mail::before { content : "\f0e0";}
	.ico-recherche::before { content : "\f002";}
	.ico-compte::before { content : "\f2bd";}
	.ico-pdf::before {font-weight: normal; content : "\f1c1"; color : rgb(191, 53, 53);}
	.ico-print::before { content : "\f02f";}
	.ico-streetview::before {content : "\f21d";}
	.ico-nav::before {content : "\f0c9";}
	.ico-clock::before {content : "\f017";}
	.ico-star::before {content : "\f005"; }
	.ico-laptop::before {content : "\f109"; }
	.ico-store::before {content : "\f54e"; }
	.ico-exchange::before {content : "\f362"; }
	.ico-desktop::before {content : "\f108"; }


/*** masonry ****************/

.masonry {
	column-gap: 0px;
	column-count: 3;
}

.masonry > .item {
	display: block;
  	break-inside: avoid-column;
	transition : all 0.5s;
	/* margin: 0 0 1em;*/
}

/* Masonry-css on medium-sized screens */
@media only screen and (max-width: 1000px) {
	.masonry {
		column-count: 2;
	}
}

/* Masonry-css on medium-sized screens */
@media only screen and (max-width: 800px) {
	.masonry {
		column-count: 1;
	}
}


/* magnific popup */
.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#0b0b0b;opacity:.8;filter:alpha(opacity=80)}.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;position:fixed;outline:0!important;-webkit-backface-visibility:hidden;backface-visibility:hidden;}.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045}.mfp-ajax-holder .mfp-content,.mfp-inline-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-arrow,.mfp-close,.mfp-counter,.mfp-preloader{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none!important}.mfp-preloader{color:#ccc;position:absolute;top:50%;width:auto;text-align:center;margin-top:-.8em;left:8px;right:8px;z-index:1044}.mfp-preloader a{color:#ccc}.mfp-preloader a:hover{color:#fff}.mfp-s-error .mfp-content,.mfp-s-ready .mfp-preloader{display:none}button.mfp-arrow,button.mfp-close{overflow:visible;cursor:pointer;background:0 0;border:0;-webkit-appearance:none;appearance:none;display:block;outline:0;padding:0;z-index:1046;-webkit-box-shadow:none;box-shadow:none}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:.65;filter:alpha(opacity=65);padding:0 0 18px 10px;color:#fff;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}.mfp-close:focus,.mfp-close:hover{opacity:1;filter:alpha(opacity=100)}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-iframe-holder .mfp-close,.mfp-image-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px}.mfp-arrow{position:absolute;opacity:.65;filter:alpha(opacity=65);margin:-55px 0 0;top:50%;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:focus,.mfp-arrow:hover{opacity:1;filter:alpha(opacity=100)}.mfp-arrow .mfp-a,.mfp-arrow .mfp-b,.mfp-arrow:after,.mfp-arrow:before{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:inset transparent}.mfp-arrow .mfp-a,.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow .mfp-b,.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left .mfp-a,.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left .mfp-b,.mfp-arrow-left:before{margin-left:25px;border-right:27px solid #3f3f3f}.mfp-arrow-right{right:0}.mfp-arrow-right .mfp-a,.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right .mfp-b,.mfp-arrow-right:before{border-left:27px solid #3f3f3f}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,.6);background:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:40px 0;margin:0 auto}.mfp-figure{line-height:0}.mfp-figure:after{content:'';position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,.6);background:#444}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;word-wrap:break-word;padding-right:36px}.mfp-image-holder .mfp-content{max-width:100%}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,.6);position:fixed;text-align:center;padding:0}}@media all and (max-width:900px){.mfp-arrow{-webkit-transform:scale(0.75);transform:scale(0.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}}.mfp-ie7 .mfp-img{padding:0}.mfp-ie7 .mfp-bottom-bar{width:600px;left:50%;margin-left:-300px;margin-top:5px;padding-bottom:5px}.mfp-ie7 .mfp-container{padding:0}.mfp-ie7 .mfp-content{padding-top:44px}.mfp-ie7 .mfp-close{top:0;right:0;padding-top:0}

/*! #######################################################################

	MeanMenu 2.0.7
	--------

	To be used with jquery.meanmenu.js by Chris Wharton (http://www.meanthemes.com/plugins/meanmenu/)

####################################################################### */

/* hide the link until viewport size is reached */
a.meanmenu-reveal {
	display: none;
}

/* when under viewport size, .mean-container is added to body */
.mean-container .mean-bar {
	float: left;
	width: 100%; 
	position: fixed;
	background: transparent;
	/*padding: 4px 0;*/
	/*min-height: 42px;*/
	z-index: 999;
	top : 0;
}

.mean-container a.meanmenu-reveal {
	padding : 6px 10px;
	position: absolute;
	top: 0px;
	right: 0;
	cursor: pointer;
	color: #fff;
	text-decoration: none;
	font-size: 60%;
	text-transform : uppercase;
	display: block;
	font-weight: 300;
	background : #000!important;
	z-index: 800;
	text-align : center;
	width : 100%;
}

a.meanmenu-reveal::before {
	content : "\f0c9"; 
	font-family : "Font Awesome 6 Free"; 
	font-weight : bold;
	text-align : center;
	padding-right : 5px;
	font-size : 250%; 
}

.mean-container a.meanclose::before { display : none;}

.mean-container a.meanmenu-reveal span {
	background : black;
	position : relative;
	top : -5px;
}


.mean-container .mean-nav {
	float: left;
	width: 100%;
	background: #E9E9E9;
	margin-top: 36px;
}

.mean-container .mean-nav ul {
	padding: 0;
	margin: 0;
	width: 100%;
	list-style-type: none;
}

.mean-container .mean-nav ul li {
	position: relative;
	float: left;
	width: 100%;
}

.mean-container .mean-nav ul li a, .mean-container .mean-nav ul li span {
	display: block;
	float: left;
	width: 100%;
	box-sizing : border-box; 
	padding: 1em 5%;
	margin: 0;
	text-align: left;
	color: #000;
	border-top: 1px solid #383838;
	border-top: 1px solid rgba(255,255,255,0.5);
	text-decoration: none;
	text-transform: uppercase;
}

.mean-container .mean-nav ul li li a {
	width: 80%;
	padding: 1em 10%;
	border-top: 1px solid #f1f1f1;
	border-top: 1px solid rgba(255,255,255,0.25);
	opacity: 0.75;
	filter: alpha(opacity=75);
	text-shadow: none !important;
	visibility: visible;
}

.mean-container .mean-nav ul li.mean-last a {
	border-bottom: none;
	margin-bottom: 0;
}

.mean-container .mean-nav ul li li li a {
	width: 70%;
	padding: 1em 15%;
}

.mean-container .mean-nav ul li li li li a {
	width: 60%;
	padding: 1em 20%;
}

.mean-container .mean-nav ul li li li li li a {
	width: 50%;
	padding: 1em 25%;
}

.mean-container .mean-nav ul li a:hover {
	background: #252525;
	background: rgba(255,255,255,0.1);
}

.mean-container .mean-nav ul li a.mean-expand {
	margin-top: 1px;
	width: 100%;
	height: 53px;
	padding: 12px !important;
	text-align: right;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
	font-weight: 700;
	/*background: rgba(255,255,255,0.1);*/
	border: none !important;
	/*border-left: 1px solid rgba(255,255,255,0.4) !important;
	border-bottom: 1px solid rgba(255,255,255,0.2) !important;*/
}

/*.mean-container .mean-nav ul li a.mean-expand:hover {
	background: rgba(255,255,255,0.9);
}*/

.mean-container .mean-push {
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
	clear: both;
}

.mean-nav .wrapper {
	width: 100%;
	padding: 0;
	margin: 0;
}

/* Fix for box sizing on Foundation Framework etc. */
.mean-container .mean-bar, .mean-container .mean-bar * {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}


/*********************** responsive  ***************************************/

@media all and (max-width: 1300px) {
	
	.page_quart {max-width : inherit; width : 25%}

	
	#carte_accueil { width : 75%; }
}
@media all and (max-width: 1280px) {

	.l1-1 { width: 100%; }
	.l1-2 { width: 50%; }
	.l1-3 { width: 33.33%; }
	.l1-4 { width: 25%; }
	.lColumnReverse { flex-direction: column-reverse; }
	.lCache { display: none; }

		#nav-distributeurs {display: block;}
		#lien_distributeurs {
			display : none;
		}
	header {
		padding-top: 50px;
		position: absolute;
	}
	header .flex_between_center {
		flex-direction: column;
	}
	.bandeau{margin-top:0; margin-top : 220px;}
	
	body { margin : 0 0;}

	.bandeau .like_h2.titre_bandeau {
		width: 45%;
	}

	
	.page_deuxtiers,
	.page_tiers, 
	.page_quart {max-width : inherit; width : 100%}
	.bloc_produits h3, .bloc_produits span {
  		font-size: 110%;
  	}
	
	#carte_accueil { width : 100%; }
}

@media all and (max-width: 1090px) {
	
	.m1-1 { width: 100%; }
	.m1-2 { width: 50%; }
	.m1-3 { width: 33.33%; }
	.m1-4 { width: 25%; }
	.mColumnReverse { flex-direction: column-reverse; }
	.mCache { display: none; }
	.column3  {columns: 2;}
	.cn-rgpd a.btnAccept, .cn-rgpd a.btnDeny {
		position : relative;
		top : inherit;
		display : block;
		right : inherit;
		margin : 10px auto 0 auto;
		max-width : 200px;
		transform : translateY(0);
	}

	.contentSlide {
	  padding: 20px!important;
	  text-align: center;
	}


	#lien_distributeurs {
		display : none;
	}

	.teinte {padding : 10px;}

	#slider .like_h2,  .bandeau .like_h2 {
		font-size: 250%;
	}

	#section_produits .col1-3, #section_produits .col2-3{
		width: 100%; 
		float: none;
	}

	#section_produits .img_cover{
		object-position: top;
		max-height : 300px;
		margin-bottom: 20px;
	}

/*
	#chaux #bandeau_chaux { background-image : url(/style/produits/fond/CHAUX-EN-PATE-pozzo-nuovo-1000.jpg); }
	#enduits #bandeau_chaux { background-image : url(/style/produits/fond/ENDUITS-pozzo-nuovo-1000.jpg); }
	#peintures #bandeau_chaux { background-image : url(/style/produits/fond/PEINTURE-chaux-pozzo-nuovo-1000.jpg); }
	#stucs #bandeau_chaux { background-image : url(/style/produits/fond/STUCS-pozzo-nuovo-1000.jpg); }
	#agricole #bandeau_chaux { background-image : url(/style/produits/fond/AGRICOLE-pozzo-nuovo-1000.jpg); }
	#systeme_enduit_ite_iti #bandeau_chaux { background-image : url(/style/produits/fond/isolation-facade-chaux-1000.jpg); }
	#produits_complementaires #bandeau_chaux { background-image : url(/style/produits/fond/PRODUITS-COMPL-pozzo-nuovo-1000.jpg); }
	#charges_minerales #bandeau_chaux { background-image : url(/style/produits/fond/CHARGE-MINERALE-pozzo-nuovo-1000.jpg); }
	#nuancier #bandeau_chaux { background-image : url(/style/produits/fond/NUANCIER-pozzo-nuovo-1000.jpg); }
	#contact #bandeau_chaux { background-image : url(/style/fond/CONSEIL-pozzo-nuovo-1000.jpg); }
	#realisations #bandeau_chaux { background-image : url(/style/fond/REALISATION-pozzo-nuovo-1000.jpg); }
	#conseils #bandeau_chaux { background-image : url(/style/fond/CONSEIL-pozzo-nuovo-1000.jpg); }
	#distributeurs #bandeau_chaux { background-image : url(/style/fond/DISTRIBUTEURS-pozzo-nuovo-1000.jpg); }
*/

	.bandeau .like_h2.titre_bandeau {bottom : -75px;} 

	.s-order-1 {order : 1}
	.s-order-2 {order : 2}
	.s-order-3 {order : 3}
}


@media all and (max-width: 800px) {

		#logo { max-width: 80px;} 
		#accueil #logo { max-width: inherit;} 
		.bandeau {margin-top : 150px; height : 250px;}


	.liste_produits_accueil .col1-4{
		width: 33.33%;
	}

	#section_nuancier .col1-3, #section_nuancier .col2-3{
		width: 100%;
		float: none;
	}

	#logo_footer {
		max-width : 150px;
		display: block;
	}

	/*.bandeau {height: 740px; }*/

	
/*	#chaux #bandeau_chaux { background-image : url(/style/produits/fond/CHAUX-EN-PATE-pozzo-nuovo-500.jpg); }
	#enduits #bandeau_chaux { background-image : url(/style/produits/fond/ENDUITS-pozzo-nuovo-500.jpg); }
	#peintures #bandeau_chaux { background-image : url(/style/produits/fond/PEINTURE-chaux-pozzo-nuovo-500.jpg); }
	#stucs #bandeau_chaux { background-image : url(/style/produits/fond/STUCS-pozzo-nuovo-500.jpg); }
	#agricole #bandeau_chaux { background-image : url(/style/produits/fond/AGRICOLE-pozzo-nuovo-500.jpg); }
	#systeme_enduit_ite_iti #bandeau_chaux { background-image : url(/style/produits/fond/isolation-facade-chaux-500.jpg); }
	#produits_complementaires #bandeau_chaux { background-image : url(/style/produits/fond/PRODUITS-COMPL-pozzo-nuovo-500.jpg); }
	#charges_minerales #bandeau_chaux { background-image : url(/style/produits/fond/CHARGE-MINERALE-pozzo-nuovo-500.jpg); }
	#nuancier #bandeau_chaux { background-image : url(/style/produits/fond/NUANCIER-pozzo-nuovo-500.jpg); }
	#contact #bandeau_chaux { background-image : url(/style/fond/CONSEIL-pozzo-nuovo-500.jpg); }
	#realisations #bandeau_chaux { background-image : url(/style/fond/REALISATION-pozzo-nuovo-500.jpg); }
	#conseils #bandeau_chaux { background-image : url(/style/fond/CONSEIL-pozzo-nuovo-500.jpg); }
	#distributeurs #bandeau_chaux { background-image : url(/style/fond/DISTRIBUTEURS-pozzo-nuovo-500.jpg); }
	*/
}

@media all and (max-width: 620px) {

	.paddingX2 {
	  padding: 30px 30px 0 30px;
	} 
	.section {padding-bottom: 0}

	#section_carte_dist {padding : 0}
	#accueil_realisations {padding-bottom : 0}
	#nav-produits i.fa-solid {display: none;}
	
	.paddingResponsive {
		padding : var(--padding); 
	}
	.picto_accueil3 {
	  padding-top: 5px;
	  line-height: 1.1em;
	}
	.bandeau .like_h2.titre_bandeau {
		width : 100%;
		padding: 10px 30px 0 30px;
		text-align: left;
		font-size : 200%;
	}
	h2, .like_h2 {
	  font-size: 180%;
	}
	.bandeau + section.section {
	  padding-top: 100px;
	}
	.articleFaq.padding {padding : 20px 0}
	#bloc_fiches_tech {padding-top : 0}
	#section_nuancier {
		flex-direction: row-reverse;
	}
	body { margin : 0 0;}

	.sColumnReverse { flex-direction: column-reverse; }
	.sCache { display: none; }

	html, body { overflow-x: hidden; }


	.page_tiers, 
	.page_quart {max-width : inherit}

	.col1-2, .col1-3, .col2-3, .col1-4, .col3-4  {float : none; width : 100%; }
	
	.flex1-2, .flex1-3, .flex2-3, .flex1-4, .flex3-4  {width : 100%;}

	.s1-1 { width: 100%; }
	.s1-2 { width: 50%; }
	.s1-3 { width: 33.33%; float : left}
	.s1-4 { width: 25%; }	
	.column3, .column2  {columns: 1;}
	.column3 li {padding : 5px 0;}

	.s-order-1 {order : 1}
	.s-order-2 {order : 2}
	.s-order-3 {order : 3}
	
	.teinte {padding : 5px;}	
	.code-teinte { font-size : 80%; right : 5px;	}

	.liste_produits_accueil .col1-4{
		width: 50%;
		float: left;
	}
}


@media all and (max-width: 500px) {
	#accueil .bloc_produits h3 {
		font-size: 100%;
	}
}