/* Auteur du developpement sur-mesure pour AIR Energie SAS : Herve Augoyat - https://www.ah-book.com, 
Copie ou modification interdite sans accord écrit de l'auteur */


#testeur {position:fixed; z-index:9999; bottom:0; right:0; padding:10px; font-size:0.75em; letter-spacing:0.1em; display:none; font-family: sans-serif; color:#FFF; opacity:0.5; background-color: #000000; }

#load {display: none}
.H #load {display:block; width:50px; height:auto; /*height:12.5px*/ position:fixed; z-index:601; top:50%; margin-top:-6px; left:50%; margin-left:-25px;}

html {font-size: 100%; height:100%; width:100%; -webkit-font-smoothing: antialiased; /*image-rendering: -webkit-optimize-contrast;*/}


@font-face {font-family:'go'; font-style: normal; font-weight:300;
  src: url('../Fontes/Gordita-light.woff2') format('woff2'), 
       url('../Fontes/Gordita-light.woff') format('woff'); 
}
@font-face {font-family:'go'; font-style: normal; font-weight:400;
  src: url('../Fontes/Gordita-regular.woff2') format('woff2'), 
       url('../Fontes/Gordita-regular.woff') format('woff'); 
}
@font-face {font-family:'go'; font-style: normal; font-weight:500;
  src: url('../Fontes/Gordita-medium.woff2') format('woff2'), 
       url('../Fontes/Gordita-medium.woff') format('woff'); 
}
@font-face {font-family:'go'; font-style: normal; font-weight:600;
  src: url('../Fontes/Gordita-bold.woff2') format('woff2'), 
       url('../Fontes/Gordita-bold.woff') format('woff'); 
}


@font-face {font-family:'pt';font-style: normal;font-weight: 400;
  src: url('../Fontes/PT-Sans-400.eot');
  src: local(''),
       url('../Fontes/PT-Sans-400.eot?#iefix') format('embedded-opentype'),
	   url('../Fontes/PT-Sans-400.woff2') format('woff2'), 
       url('../Fontes/PT-Sans-400.woff') format('woff'), 
       url('../Fontes/PT-Sans-400.ttf') format('truetype'), 
       url('../Fontes/PT-Sans-400.svg#PTSans') format('svg'); 
}
@font-face {font-family:'pt';font-style: normal;font-weight: 600;
  src: url('../Fontes/PT-Sans-700.eot');
  src: local(''),
       url('../Fontes/PT-Sans-700.eot?#iefix') format('embedded-opentype'),
	   url('../Fontes/PT-Sans-700.woff2') format('woff2'), 
       url('../Fontes/PT-Sans-700.woff') format('woff'), 
       url('../Fontes/PT-Sans-700.ttf') format('truetype'), 
       url('../Fontes/PT-Sans-700.svg#PTSans') format('svg'); 
}


body {font-size: 1em; color:#141c25; font-family: 'go', sans-serif; margin:0; font-weight:400; height:100%; width:100%; position:relative; 
		background-color:#fff;
-webkit-user-select: none; -moz-user-select: none;  -khtml-user-select: none; -ms-user-select: none; font-variant-ligatures: no-common-ligatures;}

* { outline: none;}
.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
.retMob { display: none}

img {display:block}
a img {border:none}
a {outline:none; border:none; text-decoration:none}
ul {margin:0; padding:0; list-style:none}
ul li {margin:0; padding:0}
h1, h2, h3, h4 {padding:0; margin:0; font-size:1em; font-weight:normal; line-height:1.1em}
sup {font-size: 0.55em; line-height: 1em}
/*::-moz-selection, ::selection { background:#e4856e}*/


#CybotCookiebotDialog, .H #CybotCookiebotDialog, #CookiebotWidget, .H #CookiebotWidget {opacity:0; visibility: hidden}

#MOB2 {display:none} #MOB {display:none}




#remonte {width:46px; height:46px; background-color:#fff; position:fixed; bottom:0px; right:0; z-index:190; 
		visibility:hidden; overflow:hidden; cursor:pointer}
		#remonte img {width:22px; position:absolute; top:50%; left:50%; margin-left:-11px; margin-top:-11px; display:block;transform-origin: 50% 50%;}
.H #remonte {visibility: hidden}

#facebook {width: 50px; height: 50px; border-radius: 50%; position: fixed; bottom: 10px; left:10px; z-index: 600; display: block; background-color: #131c25; overflow:hidden; cursor:pointer}
		#facebook img {width: 100%; display: block; transform-origin: 50% 50%;}
.H #facebook {visibility: hidden}

#instagram {width: 50px; height: 50px; border-radius: 50%; position: fixed; bottom: 10px; left:70px; z-index: 600; display: block; background-color: #131c25; overflow:hidden; cursor:pointer}
		#instagram img {width: 100%; display: block; transform-origin: 50% 50%;}
.H #instagram {visibility: hidden}


#btdevis {border-radius:3em; position: fixed; bottom: 10px; left:130px; z-index: 600; display: block; background-color: #e3826a; overflow:hidden; cursor:pointer; color: #fff; padding: 13px 22px 13px 45px; font-weight: 500; font-size:18px}
		#btdevis img {width:10px; position: absolute; top: 50%; left:22px; margin-top: -5px; display: block; transform-origin: 50% 50%; display:block}
.H #btdevis {visibility: hidden}

#intro {width: 100%; height: 100%; position: relative; background-color: #141c25}
	#logo {width:152px; height: auto; display: block; position: absolute; top: 45px; left:13%; z-index:31}
		#logo img {width: 100%; display: block}
	#menu {margin:0; padding: 0;  position:relative; width: auto; z-index:800; transform-origin:100% 0; 
		background-color: rgba(19,28,37,1)}
	.H #menu {position:absolute; right: 0%; top:63px; background-color: rgba(19,28,37,0); border-bottom-left-radius:10px;margin-right:1.5em; }
	/*#menu {margin:0; padding: 0;  position:fixed; width: auto; right: 0%; top:63px; margin-right:1.5em; z-index:800; transform-origin:100% 0; 
		background-color: rgba(19,28,37,0);  border-bottom-left-radius:10px}*/
		#menu li {display: inline-block; float: left; margin: 0; padding: 0}
		#menu li .am {display:inline-block; padding:1em 1.2em 0.6em 1.2em; font-size: 1.1em; font-weight:500; color:#fff; cursor: pointer; 
			line-height: 1.2em; margin:2px 0}
		#menu span {display: inline-block; position:relative; padding-bottom: 0.4em; line-height: 1.2em}
		#menu .am span i {position: absolute; bottom: 0; width: 100%; left:0; height: 2px; background-color:#fff; transform-origin: 0}
		
		#menu .ret {display:block;width: 0; float: none; margin: 0; padding: 0; clear: both; height: 0; line-height: 0}

		#menu li .cadre {border:2px solid #e3826a; border-radius: 50px; margin-left:0.8em; margin-top: 0; margin-bottom: 0;
  background-color: rgba(227, 130, 106, 0); display: inline-block; transform-origin: 0 0}
		#menu .cadre span {}
		#menu .cadre span i { display: none}

	#menu li .mactif {color:#fff}
	#menu .mactif span i {width:100%; background-color: #fff}

	#menu li .menuactifINT {color:#e3826a}
	#menu .menuactifINT span i {width:100%; background-color: #e3826a}

	

	#btmenu {display: none}

	#titre1 {color:#fff; position: relative; z-index:30; text-align:left; padding-top:150px; margin-left:13%; display: block}
		#titre1 h1 strong { font-size: 3.1em; font-weight:300; line-height: 1.3em; display: block}
			#titre1 h1 span {display: inline-block}
		#titre1 h1 .trait {width:13em; height: 1px; background-color:#e3826a; display: block; transform-origin: 0; margin:3.1em 0 1.5em 0}
		#titre1 h1 .soustitre { font-size: 1.1em; font-weight: 400; line-height:2em; letter-spacing: 0.02em; display: block; font-style: normal}
		#titre1 .lientitre {color:#e3826a; font-size:0.9em; text-transform: uppercase; letter-spacing: 0.15em; padding-left:3.4em; 
padding-top: 1.5em; padding-bottom: 1.5em; position: relative; display: inline-block; margin-top:1em}
			#titre1 .lientitre img {position: absolute; top:50%; margin-top: -1.5em; left: 0; width:3em}
			#titre1 .lientitre strong { display: inline-block; position: relative; padding-bottom: 0.3em; font-weight: 400}
			#titre1 .lientitre strong i {position: absolute; bottom: 0; width: 100%; left:0; height:1px; background-color:#e3826a; transform-origin: 0}

#contactRapide { display: inline-block; background-color: #FFFFFF; padding:1.4em 2em 2em 2em; position: absolute; bottom: 0; right: 0; z-index:30;
-webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}
.cRA {float: left; display: inline-block; margin-right:3em; line-height:1.8em}
	.cRA a {font-size:1.1em; letter-spacing: 0.07em; padding-top: 0.2em}
.cRB {float: right; width: 240px; display: block}
	.cRB a {width: 100%; display: block; margin-top: 1em}
	.cRB a img {width: 100%; display: block}

.titreminiICO {position: relative; padding-left:3.7em; text-transform: uppercase; font-size:0.9em; letter-spacing: 0.11em; display: inline-block; 
	line-height: 1.4em; font-weight:400; padding-top: 0.8em; padding-bottom: 0.8em}
.titreminiICO img {width:3.2em; position: absolute; top:50%; margin-top: -1.6em; left:0}


#degrade1{width:100%; height:400px; position: absolute; top: 0; right: 0; z-index:10;
background: -moz-linear-gradient(top, rgba(20,28,37,0.6) 0%, rgba(20,28,37,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(20,28,37,0.6) 0%,rgba(20,28,37,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(20,28,37,0.6) 0%,rgba(20,28,37,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#141c25', endColorstr='#141c25',GradientType=0 ); /* IE6-9 */
}

#degrade2{width:100%; height:300px; position: absolute; bottom: 0; right: 0; z-index:10;
background: -moz-linear-gradient(top, rgba(20,28,37,0) 0%, rgba(20,28,37,0.2) 100%); 
background: -webkit-linear-gradient(top, rgba(20,28,37,0) 0%,rgba(20,28,37,0.2) 100%); 
background: linear-gradient(to bottom, rgba(20,28,37,0) 0%,rgba(20,28,37,0.2) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#141c25', endColorstr='#141c25',GradientType=0 );
}

#degrade3{width:400px; height:100%; position: absolute; top: 0; left: 0; z-index:10;
background: -moz-linear-gradient(left, rgba(20,28,37,0.6) 0%, rgba(20,28,37,0) 100%);
background: -webkit-linear-gradient(left, rgba(20,28,37,0.6) 0%,rgba(20,28,37,0) 100%);
background: linear-gradient(to right, rgba(20,28,37,0.6) 0%,rgba(20,28,37,0) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#141c25', endColorstr='#141c25',GradientType=1 ); 
}

	
	.H #intro, .H #menu li .am, .H #menu span i, .H #logo, .H #titre1 span, .H #titre1 .trait, 
	.H #titre1 .lientitre, .H #contactRapide{visibility: hidden}
	
	.introFond { position: absolute; width:62%; height:100%; top:0; right:0;  z-index:9; overflow: hidden}
	.introFondINT {position: relative; width: 100%; height: 100%}
	.H .introFond img { position: absolute; top: 50%; left: 50%; width:1700px; height:1368px; margin-top:-684px; margin-left: -850px; z-index:9; visibility: hidden; transform-origin: 50% 50%}
	.H #intro2 .introFond img {width:1700px; height:700px; margin-top:-350px}


#intro2 {width: 100%; height:auto; position: relative}
#intro2 #titre1 {margin-left: 10%; padding-left:3%; padding-right:3%; display: inline-block; background-color: #141c25; width: 27%;
	padding-top: 3em; padding-bottom: 3em; margin-top: 240px; float: left}
#intro2 .introFond {height: 476px}
#intro2 #infoRapide {width: 38%; max-width: 800px; float: left; margin-left:6%; padding-top: 540px; display: block; color:#25313e; font-size: 1.35em; line-height: 1.9em; margin-bottom: 6em}
#infoRapide strong {font-weight: 500}
#infoRapide a {color:#e3826a; text-decoration: underline}
#infoRapide .mini { font-size: 0.8em}

.H #intro2 {visibility: hidden}

#PageComplete {position: relative; z-index:1; width: 100%; height: auto; overflow: hidden}
	.H #PageComplete {visibility:hidden; }


#navigation {width:100%; height:auto; position:relative; left:0; }
.H #navigation {width:100%; height: 100%; position: fixed; left:102%; top: 0; z-index: 200; overflow: hidden}
		#logonav {position: absolute; top: 45px; left:13%; z-index: 201; width:152px;height: auto; display: block}
		.H #logonav {position: fixed}
			#logonav img {width: 100%; display: block}
		
		.retour {width: 72px; height: 72px; background-color: #e3826a; border-radius: 50%; display: block; position: absolute; top: 56px; 
			left:38%; margin-left:-36px; z-index: 600; cursor: pointer; }
			.retour img {width:100%; display: block; transform-origin: 50% 50%}
		#navG {float: left; width:38%; height: 100%; overflow: hidden; position: relative; transform-origin: 0; z-index: 200; background-color:#141c25}
			#navG img {width: 975px; height: 1300px; position: absolute; top:50%; left:0; margin-left:0; margin-top: -650px}

		#navD {float: right; width: 62%; height: 100%; overflow: hidden; position: relative}
#fondnavD {width: 100%; height: 100%; background-color: #141c25; position: absolute; z-index:200; top:0; left:0; transform-origin:0 0 }

#navDA, #navDB, #navDC, #navDD {position:relative; z-index: 201} 
.H #navDA, .H #navDB, .H #navDC, .H #navDD {  display: none} 

.navD1 {float: left; width: 40%; margin-top:13em; padding-left: 9%; position:relative; z-index: 201} 
	.navD1 ul {display: block; padding-top:0.5em}
	.navD1 ul li {display: block}
	.navD1 a {display:inline-block;font-size:1.6em; color:#fff; line-height: 1.6em; padding: 0.3em 0; letter-spacing: 0.05em; font-weight:400; 
			position: relative; overflow: hidden}

.navD2 {float: right; width: 48%; margin-top:13em; padding-left: 3%; position:relative; z-index: 201} 
	.navD2 ul {display: block; padding-top:0.5em}
	.navD2 ul li {display: block}
	.navD2 a {display:inline-block;font-size:1.2em; color:#fff; line-height:1.6em; padding: 0.4em 0 0.2em 0; letter-spacing: 0.02em; font-weight:400;
		position: relative}
	
	.navD2 .traitnav {height: 100%; width: 2px; background-color:#323941; position: absolute; top: 0; left: 0; display: block}

	.navD1 a i, .navD2 a i {width:0; position: absolute; height: 1px; bottom: 0.2em; left:0; background-color:#fff}
	
#navD strong {color:#87898c; position: relative; display: inline-block; font-weight: 400; margin-bottom: 0.5em}

.navD1 .mNAVactif {color:#e3826a} .navD1 .mNAVactif i {width:100%; background-color: #e3826a}
.navD2 .mNAVactif {color:#e3826a} .navD2 .mNAVactif i {width:100%; background-color: #e3826a}


#contactRapideNav { display:block; background-color: #FFFFFF; padding:1.4em 0 2em 0; position:relative; z-index:250;
width: 62%;}
.H #contactRapideNav {position: absolute; bottom: 0; right: 0;}
.CRNA {float: left; width:40%; padding-left: 9%; line-height:1.8em}
	.CRNA a {font-size:1.1em; letter-spacing: 0.07em; padding-top: 0.2em}
.CRNB { width:220px; padding-left: 3%;  float: left; display: block; position: relative}
	.CRNB strong {text-transform: uppercase; font-size:0.9em; letter-spacing: 0.11em; display: inline-block; line-height: 1.4em; font-weight:400; padding-top: 0.8em; padding-bottom: 0.8em}
	.CRNB span {font-size:0.9em; letter-spacing: 0.02em; padding-top: 0.2em; line-height: 1.5em; color:#0f2745}
#contactRapideNav #rgeNav {width:240px; display: block; margin-top: 1em; float: right; margin-right: 2em;}
#contactRapideNav #rgeNav img {width: 100%; display: block}

.traitnav {height: 100%; width: 2px; position: absolute; top: 0; left: 0; display: block}
.navD2 .traitnav {background-color:#323941}
.CRNB .traitnav {background-color:#dfe2e6}


.H #navG, .H #navG img, .H #logonav, .H #fondnavD, .H .retour, .H #contactRapideNav   {visibility: hidden; }

.paddH23 {padding-top:23em}
.paddH18 {padding-top:18em}
.paddH15 {padding-top:15em}
.paddH13 {padding-top:13em}
.paddH12{padding-top:12em}
.paddH11 {padding-top:11em}
.paddH10 {padding-top:10em}
.paddH6 {padding-top:6em}
.paddH4 {padding-top:4em}
.paddH2 {padding-top:2em}

.paddB15 {padding-bottom:15em}
.paddB12 {padding-bottom:12em}
.paddB11 {padding-bottom:11em}
.paddB10 {padding-bottom:10em}
.paddB7 {padding-bottom:7em}

.margH17 {margin-top:17em}
.margH15 {margin-top:15em}
.margH13 {margin-top:13em}
.margH11 {margin-top:11em}
.margH7 {margin-top:7em}
.margH6 {margin-top:6em}
.margH4 {margin-top:4em}
.margH3 {margin-top:3em}


.lienTraitA { position: relative; padding-bottom: 0.1em; display: inline-block; color:#07192f;}
	.lienTraitA i {position:absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color:#e3826a; transform-origin: 0}

.lienTraitB { position: relative; padding-bottom: 0.2em; display: inline-block; color:#07192f;}
	.lienTraitB i {position:absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color:#e3826a; transform-origin: 0}

.lienTraitC { position: relative; padding-bottom: 0.2em; display: inline-block; color:#fff;}
	.lienTraitC i {position:absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color:#e3826a; transform-origin: 0}

.bttrait {color:#e3826a; position: relative; padding-left:3em; font-size: 1.6em; font-weight: 500; margin-top:2em; display: inline-block}
	.bttrait i {position:absolute; top: 0.7em; left:0; width:2.4em; height:2px; background-color:#e3826a; transform-origin: 0}

.fondgris {background-color: #fafafa; overflow: hidden}
.fondgrisProduit {background-color: #fafafa; overflow: hidden}
.fondnoir {background-color: #141c25}
.ext1 {width: 74%; max-width: 1600px; margin-left:auto; margin-right: auto}

.titreHaut {font-weight: 500; font-size: 1.45em;  position: relative; padding-top:3.5em; line-height: 1.8em; padding-bottom:1.8em; z-index: 50}
.titreHaut img {position: absolute; top: 0; left:0; width:70px; z-index: 20}
.titreHaut span {color:#e3826a; font-weight: 500; font-size:1em;  position: relative; padding-top:1em; line-height: 1.8em; padding-bottom:1.8em; z-index: 50; display: inline-block; width:60%}

.liste2 { position: relative; z-index: 20}
.liste2 li {width: 47%; margin-right:6%; float: left}
.liste2 .sansmargeD {margin-right: 0}
.liste2 .ret {margin:0; width: 0; float: none; clear: both}
.liste2 li a {width: 100%; height: 100%; display: block; position: relative; background-color: #141c25; border-radius: 15px; overflow: hidden;
-webkit-mask-image: -webkit-radial-gradient(white, black);}
.liste2 li a small {position: relative; display: block; transform-origin: 50% 50%;opacity:0.7}
.liste2 li a img {width: 100%; display: block; position: relative; z-index: 10; transform-origin: 50% 50%; }
.liste2 li a span {text-align: center; display: block; width: 100%; position: absolute; top: 0; left: 0; color:#fff; z-index:20}
.liste2 li a strong { font-weight: 500; display: block; font-size: 1.9em; line-height: 1.6em}
.liste2 li a i { font-weight: 400; display: block; font-size: 1em; font-style: normal; line-height: 1.8em}





.liste3 { position: relative; z-index: 20}
.liste3 li {width: 32.5%; margin-right:1.2%; float: left}
.liste3 .sansmargeD {margin-right: 0}
.liste3 .ret {margin:0; width: 0; float: none; clear: both}
.liste3 li a {width: 100%; height: 100%; display: block; position: relative; background-color: #141c25; border-radius: 15px; overflow: hidden;
-webkit-mask-image: -webkit-radial-gradient(white, black);}
.liste3 li a small {position: relative; display: block; transform-origin: 50% 50%;opacity:0.7}
.liste3 li a img {width: 100%; display: block; position: relative; z-index: 10; transform-origin: 50% 50%; }
.liste3 li a span {text-align: center; display: block; width: 100%; position: absolute; top: 0; left: 0; color:#fff; z-index:20}
.liste3 li a strong { font-weight: 500; display: block; font-size: 1.9em; line-height: 1.6em}
.liste3 li a i { font-weight: 400; display: block; font-size: 1em; font-style: normal; line-height: 1.8em}

/*.liste3 li.full {width: 100%; margin-right:0; float:none}*/


.liste3produits { position: relative; z-index: 20}
.liste3produits li {width: 32.5%; margin-right:1.2%; float: left; margin-bottom: 5em}
.liste3produits .sansmargeD {margin-right: 0}
.liste3produits .ret {margin:0; width: 0; float: none; clear: both}
.liste3produits li small {position: relative; display: block; width: 100%; transform-origin: 50% 50%;border-radius: 15px; overflow: hidden;
-webkit-mask-image: -webkit-radial-gradient(white, black); margin-bottom: 1.5em}
.liste3produits li small img {width: 100%; display: block; position: relative; z-index: 10; transform-origin: 50% 50%; }
.liste3produits strong {color:#141c25; font-size: 1.2em; font-weight: 500;line-height: 1.6em}
.liste3produits strong span {color:#7c858f; font-size: 0.85em; line-height: 1.6em}
.liste3produits p {color:#717171;font-family: 'pt', sans-serif; font-weight: 400; line-height: 1.6em; margin: 0; padding-top:0.8em; font-size: 0.9em; width:80%}
.liste3produits .boutonplein {color:#fff; margin-top: 1.5em; padding:1em 1.5em; background-color: #e3826a; border-radius: 60px; font-weight: 500; font-size: 0.8em; letter-spacing: 0.03em; display:inline-block}



#projets .liste3produits .projetactif small {cursor: pointer}
#projets .liste3produits .projetactif small i {cursor: pointer; background-color: #141c25; color:#fff; padding:1em; font-size: 0.95em; position: absolute; 
top:1em; right:1em; border-radius: 30px; z-index: 60; font-style: normal; letter-spacing: 0.05em; font-weight: 500}
.H #projets .liste3produits .projetactif strong {display: none; padding-top: 1.5em}
.H #projets .liste3produits .projetactif span {display: none; font-size: 1em; font-weight: 500; color:#9B9B9B; padding-top: 0.5em}
.H #projets .liste3produits .projetactif p {display: none; width: 100%; padding-bottom: 2em}
#projets .liste3produits li small {margin-bottom:0em}

/*#fondinfosprojet {background-color: #141c25; position:fixed; bottom: 0; left: 0; padding:2em; z-index:300; border-top-right-radius: 20px}
#fondinfosprojet strong {font-size: 1.4em; color:#fff; font-weight: 500}
#fondinfosprojet span {font-size: 0.9em; color:#E1E1E4; font-weight: 500}
#fondinfosprojet p {font-size: 1em; color:#fff; max-width: 700px; line-height: 1.8em;}*/

.liste4 { position: relative; z-index: 20}
.liste4 li {width:24%; margin-right:1.2%; float: left}
.liste4 .sansmargeD {margin-right: 0}
.liste4 .ret {margin:0; width: 0; float: none; clear: both}
.liste4 li a, .liste4 li span.nonlien {width: 100%; height: 100%; display: block; position: relative; }
.liste4 li a b, .liste4 li span.nonlien b {border-radius: 15px; overflow: hidden; position: relative; display: block; z-index: 20;
	-webkit-mask-image: -webkit-radial-gradient(white, black);}
.liste4 li a small, .liste4 li span.nonlien small {position: relative; display: block; transform-origin: 50% 50%; z-index: 19}
.liste4 li a img, .liste4 li span.nonlien img {width: 100%; display: block; position: relative; z-index: 10; transform-origin: 50% 50%}
.liste4 li a span, .liste4 li span.nonlien span {text-align: left; display: block; width: 100%; position:relative; margin-top: 0.9em; color:#141c25; z-index:20}
.liste4 li a strong, .liste4 li span.nonlien strong { font-weight: 500; display: block; font-size: 1.2em; line-height: 1.6em}
.liste4 li a i, .liste4 li span.nonlien i { font-weight: 400; display: block; font-size:0.9em; font-style: normal; line-height: 1.8em}

.liste4reas li {margin-bottom:5em}
.liste4reas li a strong, .liste4reas li span.nonlien strong {font-size: 1em}
.degradereas { position: absolute; top: 0; left: 0; margin-top: 0; padding-top: 0; width:100%; height:100%; display: block; z-index: 50; 
background: -moz-radial-gradient(center, ellipse cover, rgba(73,91,111,0) 0%, rgba(73,91,111,0) 34%, rgba(73,91,111,0.32) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, rgba(73,91,111,0) 0%,rgba(73,91,111,0) 34%,rgba(73,91,111,0.32) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, rgba(73,91,111,0) 0%,rgba(73,91,111,0) 34%,rgba(73,91,111,0.32) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00495b6f', endColorstr='#52495b6f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}



.btligne {position: relative; display: inline-block; padding-bottom: 0.2em}
.btligne i {position: absolute; bottom: 0; height: 1px; width: 100%; background-color: #e3826a; transform-origin: 0 0; display: block}

.texteAG {width:55%; float: left; position: relative; z-index: 11}
.texteAG p { margin-left:20%; display: block; font-size:1.2em; line-height: 2em; font-family: 'pt', sans-serif; font-weight: 400; padding-top: 0; 
margin-top: 0}

.rondext {width: 31%; position: relative; float: right; margin-right:6.5%; margin-top:8em; overflow: visible}
	.rond {overflow: hidden; border-radius: 50%; position: relative; z-index: 11}
		.rond img {width: 100%; display: block; position: relative}
	.rondblanc { position: absolute; top:40%; left:10%; background-color:#fff; width: 600px; height: 600px; margin-top:-300px; margin-left: -300px; 
			border-radius: 50%; z-index: 1; transform-origin: 50% 50%}

.textefonce {color:#141c25} .texteblanc {color:#fff}
.texteAD {width:36%; float: right; position: relative; z-index: 11}
.texteAD ul {}
.texteAD ul li {width:100%; display: block; margin-bottom: 1em}
.texteAD ul li a {width:100%; display: block; border-bottom-width: 3px; border-bottom-style: solid; padding-bottom: 10px; position: relative}
.textefonce .texteAD ul li a {border-bottom-color:#e5e6e7}
.texteblanc .texteAD ul li a {border-bottom-color:#53565b}
.texteAD ul li a .marque {width:45%; display: block; transform-origin: 0 100%}
.texteAD ul li a .cerclePlus {width:2.2em; border-radius: 50%; border:2px solid #e3826a; display: block; position: absolute; right: 0; bottom: 10px; 
transform-origin: 50% 50%; }
	.texteAD ul li a .cerclePlus img { position: relative; width: 100%; display: block;}

.texteAD ul li a strong { font-size: 1.5em; line-height: 1.6em; padding-top: 0.5em; display: block; max-width: 80%; color:#fff; font-weight: 500;}
.texteAD ul li a i { font-size: 0.9em; line-height: 1.6em; padding-top: 0.1em;  font-style: normal;display: block; max-width: 80%; color:#fff; font-weight: 400}

.texteAD p {font-size: 1.05em; font-family: 'pt', sans-serif; font-weight: 400; margin-top:2.5em}
.textefonce .texteAD p strong, .textefonce .texteAD p a { text-decoration: underline; font-weight: 400; color:#141c25}
.texteblanc .texteAD p strong, .texteblanc .texteAD p a { text-decoration: underline; font-weight: 400; color:#fff}
.textefonce .texteAD p a:hover, .texteblanc .texteAD p a:hover {color:#e3826a; text-decoration: none}
.certifs {}
.certifs li {width: 22%; margin-right: 4%; float: left; display: block; margin-bottom: 2em}
.certifs .der {margin-right: 0}
.certifs li a {display: block; width: 100%; overflow: hidden}
.certifs li a img {display: block; width: 100%; transform-origin: 50% 50%}
.certifs li.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

.produit-selection { padding-top: 10em; padding-bottom:22em}
.produit-selection h2 {font-size:4.8em; font-weight: 300; line-height: 1.4em; margin-left: 13%; position: relative; z-index: 10; display: inline-block}

.slideproduit {width: 100%; margin-top: 4em; position: relative; overflow: visible}
.slide {width: 56%; margin-left:auto; margin-right: auto; position: relative; /*background-color: antiquewhite;*/ overflow: visible}

.slide .imgP {width: 47%; float: left; margin-left: 22%; position: relative; z-index: 10}
	.imgP img {width: 100%}
	.H .imgP img {width: 100%; position:absolute; top:0; left:0; visibility: hidden}
	.H .imgP .imgprem {position: relative; }

.slide .infosP {width:31%; float: right; position: relative; z-index: 10}
	.H .infosP div {position: absolute; top: 0; left: 0; width: 100%; visibility: hidden}
	.H .infosP .divperm {position: relative;}

.slide .infosP strong {color:#141c25; font-size: 1.2em; font-weight: 500}
.slide .infosP strong span {color:#7c858f; font-size: 0.85em}
.slide .infosP p {color:#717171;font-family: 'pt', sans-serif; font-weight: 400; line-height: 1.6em; margin: 0; padding-top:0.8em; font-size: 0.9em}
.slide .boutonplein {color:#fff; margin-top: 1.5em; padding:1em 1.5em; background-color: #e3826a; border-radius: 60px; font-weight: 500; font-size: 0.8em; letter-spacing: 0.03em; display: inline-block}

.slide  .rondProduit {width:100px; height:100px; background-color:#FFFFFF; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform-origin: 50% 50%; z-index: 1}
.slide  .rp1 {left: -55%}
.slide  .rp3 {left:155%}
	

.slideproduit .fleche {position: absolute; top: 50%; margin-top: -35px; width: 70px; display: block; z-index: 30; border-radius: 50%; 
	background-color: #141c25; cursor: pointer}
.slideproduit .fleche img {display: block; width: 100%}
.slideproduit .fleche2 {left:2%}
.slideproduit .fleche1 {right:2%}


.extgrandfond {width:100%; height: auto; position: relative; overflow: hidden}
.grandfond {width:auto; height:auto; position: absolute; top:50%; left:50%; z-index:1; margin-left:-950px; margin-top:-625px}

#bas {padding-top: 15em; padding-bottom:6em; -webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}
#logobas {width:152px; height: auto; display: block; margin-left:0;  z-index:31}
		#logobas img {width: 100%; display: block}
.nos-agences { margin-left:15%; width: 27%; display: block; float: left; padding-top:3em}
	.nos-agences h4 { font-size: 1.4em; font-weight:500; margin-top:1.1em}
	.nos-agences p {padding-top:2.4em; margin: 0; font-size:1em; line-height:1.5em; font-family: 'pt', sans-serif; font-weight: 400; color:#48494b}
	.nos-agences p strong { padding-top:0.5em; display:inline-block}
	.nos-agences p a {color:#48494b} .nos-agences p a:hover {color:#e3826a}
.coordonnees { margin-left:2%; width: 39%; display: block; float: left; padding-top: 3em}
	.coordonnees h4 { font-size:2em; font-weight:500; margin-top: 0.5em; padding-left:2.8em; position: relative; display: inline-block}
		.coordonnees h4 i {width:2em; background-color: #e3826a; position: absolute; bottom: 0.2em; left:0; height:2px; display: block}
	.coordonnees p {padding-top:2.7em; margin: 0; font-size:1em; line-height:1.6em; font-family: 'pt', sans-serif; font-weight: 400; color:#48494b}
.coordonnees strong {padding-top:1.9em; font-size: 1.1em; font-weight: 500; display:block; color:#141c25}
.coordonnees strong a {color:#141c25}
.coordonnees .lienbas {padding-top:0.9em; font-size: 1em; font-weight: 500}

.nos-agences span {font-size: 0.9em; font-family: 'pt', sans-serif; font-weight: 400; color:#242a32}
.coordonnees span {font-size: 0.9em; font-family: 'pt', sans-serif; font-weight: 400; color:#242a32}
.coordonnees span a {font-family: 'pt', sans-serif; font-weight: 400; color:#242a32}
.coordonnees span a:hover {color:#e3826a}

.coordonnees a.google-review {display: block; padding: 0; margin: 0; padding-bottom: 1.4em; color:#48494b;}
	.coordonnees div.review_container {}
		.coordonnees p.review {margin: 0; padding: 0; }
			.coordonnees span.icon-Google {display: inline-block; line-height: 1em; margin: 0; padding:0}
				.icon-Google svg {width:2em; height: 2.039em /* 27.15 - 27.68*/}
			.coordonnees span.google-stars {display:inline-block; padding:0 0 0 0.5em; margin: 0; line-height: 1em}
				.coordonnees span.star {display: inline-block}
				.coordonnees span.star svg {width: 1.5em; height: 1.5em; margin-bottom: 0.3em; display: inline-block}
			.coordonnees span.google-rating { display: block; padding-top: 0.2em; font-size: 1em; color:#48494b; font-weight:400; font-family: 'go', sans-serif; letter-spacing: 0.04em}
.coordonnees a.google-review:hover span.google-rating {color:#e3826a}

.traitbas {width: 100%; height: 1px; background-color: #b5b5b5; margin-top:7em}


.Carte {position: relative; width: 100%; overflow: visible; border-radius:2em; overflow: hidden; z-index: 0; margin-bottom: 8em}
.Carte img {width: 100%; position: relative; z-index: 0; display: block}

.TitreArticle {position: relative; width: 100%; overflow: visible}
.TitreArticle img {width: 100%; position: relative}
.TitreArticle h3 {position: absolute; bottom: -1em; font-size:2.6em; font-weight: 300; color:#141c25; padding: 0.8em 2.5em 0 0;
line-height: 1.3em; background-color: #FFFFFF; letter-spacing: normal}
.fondgris .TitreArticle h3 { background-color: #fafafa}

.Article {width:58%; margin-left: 14.9%; max-width: 815px; min-width: 600px; margin-top:5.4em}
.ArticlesansM {margin-top:0em}
	.Article p {font-size: 1.2em; font-family: 'pt', sans-serif; font-weight: 400; color:#242a32; line-height:2em}
	.Article p a {color:#e3826a; text-decoration: underline}
	.Article p a:hover {color:#e3826a; text-decoration:none}
		.Article p .lienG {font-size: 1.1em}
	.introArticle {padding-bottom:3em}
	

.depliA {font-weight: 500; font-size: 1.1em; padding:0.9em 2em 0.3em 0; margin-top:1em; border-bottom: 2px solid #e3826a; position: relative; display: block; width:75%; line-height: 1.4em; letter-spacing: 0.025em; cursor: pointer; z-index: 30}
.depliA .cerclePlus2 {width:1.6em;position: absolute; display: block; bottom: 0.5em; right: 0; border:2px solid #edb4a6; border-radius: 50%}
.depliA .cerclePlus2 img {display: block; width: 100%}

.depliB {padding-top:1em; padding-bottom: 3em; position: relative; z-index: 20}
.H .depliB {display: none}

.depliC {font-weight: 500; font-size: 1.1em; padding:0.9em 2em 0.3em 0; margin-top:1em; border-bottom: 2px solid #e3826a; position: relative; display: block; width:75%; line-height: 1.4em; letter-spacing: 0.025em; z-index: 30}
.depliD {padding-top:1em; padding-bottom: 3em; position: relative; z-index: 20}

.H .servicePlus {display:none}

#demande {width:690px; float: left; margin:0; margin-left: 14.9%; color:#444444; position: relative; z-index: 20;
-webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}
#demandeint {background-color: rgba(63,78,94,0.7); border-radius: 15px; position: relative; z-index: 20}
	#demande h3 {font-size:1.1em; letter-spacing:0.025em; line-height:1.4em; padding:2.8em 0 0em 0; display:block; font-weight:500; display: block;
		color:#fff; margin:0 auto ;width:567px;}			
	
	::-webkit-input-placeholder {color:#e6e9ed; }
	:-moz-placeholder {color:#e6e9ed; opacity: 0.8; }
	::-moz-placeholder {color:#e6e9ed;opacity: 0.8;}
	:-ms-input-placeholder {color:#e6e9ed;}
	::-ms-input-placeholder {color:#e6e9ed;}
	::placeholder {color:#e6e9ed;}

	#formulaire {display:block; text-align:left; margin:1em auto 0 auto; padding-bottom:3em; width:567px; font-size:1.1em; 
		font-family: 'pt', sans-serif; font-weight:400; letter-spacing:0.04em}	
		#formulaire .formgauche {width:47%; float:left; margin:0.6em 0 0 0;}
		#formulaire .formdroite {width:47%; float:left; margin:0.6em 0 0 6%}
		#formulaire input {color:#e6e9ed; font-size:1em; border:none; padding:0.4em 0; font-family: 'pt', sans-serif;  font-weight:400; border-bottom:1px solid #99abb8;  background:none; border-radius:0; letter-spacing: 0.07em}
		#formulaire input:hover {color:#fff; background-color: rgba(255, 255, 255, 0.1); }
		#formulaire textarea{margin:1.6em 0 0 0; height:8em; color:#000; border:none; padding:1em 4% 0.8em 4%; 
			background-color: rgba(255, 255, 255, 1); width:92%; border-radius:20px; font-size:1em; 
			font-family: 'pt', sans-serif;font-weight:400; line-height: 1.8em}
		#formulaire textarea:hover {color:#000; background-color: rgba(255, 255, 255, 0.9);}
		
		#formulaire #envoyer {color:#fff; text-transform:uppercase; background-color:#e3826a; border-radius:20px;display:block; border:none; 
					padding:1.3em 3em 1.3em 4em; min-width:80%; font-size:0.8em; background-image:url(../Images/fl2.png); background-repeat:no-repeat; 
					background-position:2em 50%;  background-size:0.65em; line-height:1.2em; letter-spacing:0.2em; margin:2.8em 0 1.3em 0; cursor:pointer; text-align:left; font-weight:500; font-family: 'go', sans-serif;}

#rgpdExt {width: 100%;  text-align:left; font-size: 0.9em}
	#formulaire [type="checkbox"]:not(:checked), #formulaire [type="checkbox"]:checked {position: absolute;left: -9999px;}
	#formulaire [type="checkbox"]:not(:checked) + label, #formulaire [type="checkbox"]:checked + label { position:relative; cursor: pointer;display:inline-block; padding:0 0 0 32px; font-size:0.9em; line-height:1.4em; margin-top:0.5em}
	#formulaire [type="checkbox"]:not(:checked) + label:before, #formulaire [type="checkbox"]:checked + label:before {content: '';position: absolute;left:0; top: 1px; width:16px; height:16px; background:#ffffff; border-radius:3px; border:2px solid #e3826a}
	#formulaire [type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after {content: '✔';position: absolute;top: 0px; left: 3px;font-size: 16px;color:#000; transition: all .2s; font-weight:400}
	#formulaire [type="checkbox"]:not(:checked) + label:after {opacity: 0; transform: scale(0);}
	#formulaire [type="checkbox"]:checked + label:after { opacity: 1; transform: scale(1); }	
	
	#formulaire label {color:#fff; line-height: 1.6em}
	#formulaire label a {color:#fff}
	#formulaire label a:hover {color:#e6e9ed; text-decoration:underline}
	
	

	#formulaire #captcha {padding:1.6em 0 0.4em 0; display:block;font-family: 'pt', sans-serif;}
	#formulaire #captcha strong {display: inline-block; font-size: 1em; letter-spacing: 0.05em; font-weight: bold;font-family: 'pt', sans-serif;}
#formulaire #captchaform {width: 100%}

	#message-requete {font-family: 'pt', sans-serif;margin:0; letter-spacing:0.02em; font-size:1.5em; position:fixed; top:50px; left:50%; margin-left:-300px; width:500px; 
		z-index:9999;  background-color:#fff; padding:50px; border-radius:12px; display:none; position:fixed; color:#0d2243; cursor:pointer; 
				background-image:url(../Images/croix.png); background-size:30px; background-position:96% 20px; background-repeat:no-repeat}
	#message-requete h3 {color:#000; font-weight:500; padding-bottom:10px; font-size:1.1em}
	#message-requete ul {margin:10px 0 10px 0; padding:0; list-style:none}
	#message-requete ul li {list-style:none; padding:0.4em 4px 0.4em 2em; font-size:0.8em; margin:1px 0 0 0; display:block; width:auto}
	#message-requete .message-ok { background-image:url(../Images/valide.png); background-repeat:no-repeat; background-position:5px 50%; background-size:1em; font-size:0.9em; font-weight:600}
	#message-requete .message-erreur { background-image:url(../Images/erreur.png); background-repeat:no-repeat; background-position:5px 50%; background-size:1em}	
	#fondmessage {background-color:#262727; z-index:9998; position:fixed; width:100%; height:100%; top:0; left:0; display:none}	
	
.complement-contact {float: right; width:390px; position: relative; z-index: 20; -webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}
.minittire {position: relative; padding-left: 2.6em; font-size: 1.05em; font-weight: 500; display: block; margin-bottom:1em; margin-top:2.5em}
.minittire i { position: absolute; top: 0.6em; left:0; width: 2.1em; height:3px; background-color: #e3826a; display: block}
.complement-contact p {font-family: 'pt', sans-serif; font-size: 1em; line-height: 1.8em; padding-left: 2.6em; padding-bottom: 0.8em}


.Texteselect {-webkit-user-select:text; -moz-user-select:text;  -khtml-user-select:text; -ms-user-select:text}

.H .ano0 {visibility: hidden}
.H .ans1 {visibility: hidden; transform-origin: 50% 50% }
.H .ans2 {visibility: hidden; transform-origin: 50% 50% }
.H .ans3 {visibility: hidden; transform-origin: 50% 50% }
.H .anys1 {visibility: hidden; transform-origin: 50% 50% }
.H .any1 {visibility: hidden; transform-origin: 50% 50% }

.H .anbas{}
.H .anbas1, .H .anbas2 {visibility:hidden}










@media screen and (max-height:730px) , screen and (max-width: 1785px) {
body {font-size: 0.8em}
	.H #load {width:40px; /*height:10px*/margin-top:-5px; margin-left:-20px;}
#remonte {width:37px; height:37px}
	#remonte img {width:16px; margin-left:-8px; margin-top:-8px}
#facebook {width:40px; height:40px; left:8px}
#instagram {width:40px; height: 40px; left:58px}
#btdevis {left:108px; padding: 11px 19px 11px 36px; font-weight: 500; font-size:15px}
		#btdevis img {width:8px; left:17px; margin-top: -4px; }	
	
	#logo {width:121px; top: 36px; left:13%}
	.H #menu {top:50px; border-bottom-left-radius:8px;}
		#menu li .am {padding:1em 0.7em 0.6em 0.7em; font-size: 1.1em;}
		/*#menu li .am {padding:1em 0.9em 0.6em 0.9em; font-size: 1.1em;}*/
		#menu li .cadre {margin-left:1.1em;padding:1em 1.2em 0.6em 1.2em}
.cRB {width: 192px}

#degrade1{height:320px} #degrade2{height:240px} #degrade3{width:320px}

#intro2 #titre1 {padding-top:2.8em; padding-bottom:2.8em; margin-top: 192px;}
#intro2 .introFond {height: 380px}
#intro2 #infoRapide {padding-top:432px; margin-bottom: 6em}	
	
#logonav {top: 36px; width:121px}
.retour {width:56px; height:56px;top: 45px; margin-left:-28px}
	
.navD1 {margin-top:12em} 
.navD2 {margin-top:12em} 

.CRNB { width:165px}
	.CRNB span {font-size:0.85em}
#contactRapideNav #rgeNav {width: 192px}	
	
.titreHaut img {width:56px}
.liste2 li a strong {font-size: 1.8em}
.liste3 li a strong {font-size: 1.8em}
.liste4 li a strong, .liste4 li span.nonlien strong { font-size: 1.15em}
.liste4reas li a strong, .liste4reas li span.nonlien strong {font-size:1em}
	
.produit-selection h2 {font-size:4.6em}
.slideproduit .fleche {margin-top: -30px; width: 60px}
#logobas {width:121px}
.coordonnees {width:50%; max-width: 435px}

	
#demande {width:56%; max-width:600px; margin-left: 14.9%;}
	#demande h3 {width:90%; max-width: 550px}	
#formulaire {width:90%; max-width: 550px}	
#formulaire [type="checkbox"]:not(:checked) + label, #formulaire [type="checkbox"]:checked + label {padding:0 0 0 28px; }
	#formulaire [type="checkbox"]:not(:checked) + label:before, #formulaire [type="checkbox"]:checked + label:before {top:0; width:13px; height:13px}
	#formulaire [type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after {font-size: 13px;}	
	#message-requete {top:40px; margin-left:-240px; width:400px;padding:40px; background-size:26px; background-position:96% 16px}
	#message-requete h3 {padding-bottom:8px}
	#message-requete ul {margin:8px 0 8px 0}
	
.complement-contact {width:26% }

	
}
	
	





@media screen and (max-height:570px) , screen and (max-width:1320px) {
body {font-size: 0.72em}
	#logo {width:109px; top:32px; left:13%}
	.H #menu {top:45px}
		#menu li .am {padding:1em 0.7em 0.6em 0.7em; font-size: 1.05em;}
		#menu li .cadre {margin-left:1em;padding:1em 1.1em 0.6em 1.1em}
.cRB {width: 172px}

#degrade1{height:290px} #degrade2{height:216px} #degrade3{width:290px}
	
#intro2 #titre1 {margin-top: 172px;}
#intro2 .introFond {height:342px}
#intro2 #infoRapide {padding-top:389px; }	
	
#logonav {top: 32px; width:109px}
.retour {width:50px; height:50px;top:40px; margin-left:-25px}

.navD1 {margin-top:11em} 
.navD2 {margin-top:11em} 
	.navD1 a {font-size:1.45em; line-height: 1.5em; padding: 0.3em 0; letter-spacing: 0.04em;}
	.navD2 a {font-size:1.1em; line-height:1.5em; padding: 0.4em 0 0.2em 0; letter-spacing: 0.02em; }
	
.CRNB { width:130px}
	.CRNB span {letter-spacing: 0.02em; font-size:0.8em}
#contactRapideNav #rgeNav {width:172px}

.titreHaut img {width:50px}
.texteAG p { margin-left:15%}	
#logobas {width:109px}	
.coordonnees {width:50%; max-width: 400px}	
.nos-agences { margin-left:14%; width: 28%}
	
.Article {width:58%; margin-left:11%; max-width: 815px; min-width:500px}
	
#demande {width:56%; margin-left: 11%;}
#demande h3, #formulaire {width:90%}	
	#formulaire [type="checkbox"]:not(:checked) + label, #formulaire [type="checkbox"]:checked + label {padding:0 0 0 25px; }
	#formulaire [type="checkbox"]:not(:checked) + label:before, #formulaire [type="checkbox"]:checked + label:before {width:11px; height:11px}
	#formulaire [type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after {font-size: 11px;}	
.complement-contact {width:30% }
}





@media screen and (max-height:460px) , screen and (max-width:1140px) {
	#MOB2 {display: block}
	#logo {left:10%}
	#menu li .am {padding:1em 0.7em 0.6em 0.7em; font-size: 1em;}
	#menu li .cadre {margin-left:1em;padding:1em 1.1em 0.6em 1.1em}
	#titre1 {margin-left:10%}
		#titre1 h1 strong { font-size: 2.8em}
		#titre1 h1 .trait {width:9em; margin:2.1em 0 1.2em 0}
	.introFond {width:70%}
	
	#intro2 #titre1 {margin-left:7%; padding-left:3%; padding-right:3%; width: 30%; padding-top:2.3em; padding-bottom:2.3em; margin-top: 172px;}
	#intro2 .introFond {height:342px}
	#intro2 #infoRapide {width: 42%; margin-left:5%; padding-top:389px; font-size: 1.25em; margin-bottom:5em}	
	
	
	#logonav {left:10%}
	.retour {left:30%}
	#navG {width:30%}
	#navD {width: 70%}
	
.navD1 {margin-top:10em} 
	.navD1 a {font-size:1.3em}
.navD2 {margin-top:10em} 
	.navD2 a {font-size:1em}

#contactRapide {padding:1em 1.5em 1.5em 1.5em; font-size: 0.9em}
.cRA {line-height:1.7em}
.cRB {width: 150px}
	.cRB a {margin-top: 1em}	
	
#contactRapideNav {padding:1em 0 1.5em 0; width: 70%; font-size: 0.9em}
.CRNA {line-height:1.7em}
.CRNB { width:130px}
#contactRapideNav #rgeNav {width: 150px;margin-top: 1em; margin-right:1.5em}
	
.ext1 {width:80%; max-width: 1600px; margin-left:auto; margin-right: auto}
.liste2 li a strong {font-size: 1.6em}	
.liste3 li a strong {font-size: 1.6em}
.liste4 li a strong, .liste4 li span.nonlien strong { font-size: 1.05em}	
.liste4reas li a strong, .liste4reas li span.nonlien strong {font-size: 1em}
.produit-selection h2 {font-size:4.2em;margin-left: 10%;}

}








@media screen and (max-height:420px) , screen and (max-width:980px) {
#MOB2 {display:none}
#MOB {display: block}
.H #load {width:32px; /*height:8px*/margin-top:-4px; margin-left:-16px}
	
#btmenu {display:block; position: fixed; top:20px; right:7%; width:50px; height:50px; z-index:950; 
	transform-origin:50% 50%; cursor: pointer; background-color: rgba(255,255,255,0.9)}
		#b1, #b2, #b3 {width:22px; height: 2px; background-color: #141c25; position: relative; margin-left:auto; margin-right: auto; display: block; 
			transform-origin: 0 0}
		#b1 {margin-top:17px} #b2 {margin-top:5px} #b3 {margin-top: 5px}
	
	.H #btmenu, .H #btmenu i {visibility: hidden}


	.H #menu {position:relative; right:0; top:0; border-bottom-left-radius:0;margin-right:0; padding-top: 120px; padding-left: 5%}
		#menu li {display:block; float: none; margin: 0; padding: 0}
		#menu li .am {padding:0.4em 0 0.4em 0; font-size:2em; margin:0 0 0.3em 0}
			#menu .am span i {background-color:#e3826a}
		#menu span {padding-bottom: 0.4em}
		#menu .ret {display:block;width: 0; float: none; margin: 0; padding: 0; clear: both; height: 0; line-height: 0}
		#menu li .cadre {margin-left:0; margin-top:0.5em; margin-bottom:5em;padding: 1.2em 1.5em 0.6em 1.5em; font-size:1.1em}
	
	#menu li .mactif {color:#e3826a}
	
#navigation {width:100%; height:auto; position:relative; left:0;background-color:#141c25}
.H #navigation {width:100%; height: 100%; position: fixed; left:0; top: 0; z-index:900; overflow: scroll; display: none}
		.retour, #navG { display:none}
	
		
		#logonav {position: absolute; top:20px; left:5%; width:90px; z-index: 9999}
		.H #logonav {position: absolute; visibility: visible}
		
	#navD {float:none; width:100%; height:auto; overflow:visible; position: relative}
		.H #navD, #fondnavD {display: none}

#navDA, #navDB, #navDC, #navDD {position:relative; z-index: 201} 
.H #navDA, .H #navDB, .H #navDC, .H #navDD {  display:none} 

.navD1 {float:none; width:95%; margin-top:0.5em; margin-bottom: 1.5em; padding-left:5%; position:relative; z-index: 201} 
	.navD1 ul {display: block; padding-top:0.5em}
	.navD1 ul li {display: block}
	.navD1 a {display:inline-block;font-size:1.4em; color:#fff; line-height: 1.6em; padding: 0.2em 0; letter-spacing: 0.03em; font-weight:400; 
			position: relative; overflow: hidden}

.navD2 {float:none; width:95%; margin-top:0.5em; margin-bottom: 1.5em; padding-left:5%; position:relative; z-index: 201} 
	.navD2 ul {display: block; padding-top:0.5em}
	.navD2 ul li {display: block}
	.navD2 a {font-size:1.4em; line-height:1.6em; padding: 0.2em 0; letter-spacing: 0.03em}
	.navD2 .traitnav { display: none}
	
.navD1 strong, .navD2 strong {color:#87898c;position: relative; display: inline-block; font-weight: 400; margin-bottom:0em}

.navD1 .mNAVactif {color:#e3826a} .navD1 .mNAVactif i {width:100%; background-color: #e3826a}
.navD2 .mNAVactif {color:#e3826a} .navD2 .mNAVactif i {width:100%; background-color: #e3826a}

#contactRapideNav, .H #contactRapideNav { display:none}
.traitnav {display: none}


	
#intro {width: 100%; height: auto; position: relative; /*background-color: #141c25;*/background-color: #fff; padding-bottom: 15px}
	#logo {width:90px; height: auto; display: block; position: relative; padding-top:10px; top:0; left:0; margin-left:10%}
	
#titre1 {position: relative; margin-top:200px; padding:1.5em 1em 1.5em 1.8em; margin-left:auto; margin-right: auto;display:block; width: 80%; 
	background-color: rgba(20,28,37,0.7); background-color: #141c25;}
		#titre1 h1 strong { font-size:2.65em}
		#titre1 h1 .trait {width:8em; margin:1.7em 0 1.4em 0}
		#titre1 h1 .soustitre { font-size:1.2em}
		#titre1 .lientitre {font-size:0.8em; margin-top:0em; display: none}
	
#contactRapide { display:block; padding:1em 0em 1.6em 0em; position: relative; bottom: 0; right: 0; margin-top:20px;
	width: 80%; margin-left: auto; margin-right: auto}
.cRA {margin-right:0; padding-left:10px; float: none; display: none}
.cRB {width: 250px; display: block; padding-right:0px; float: none}

#degrade1{ display: none; width:100%; height:400px; position: absolute; top: 0; right: 0; z-index:10;
background: -moz-linear-gradient(top, rgba(20,28,37,0.6) 0%, rgba(20,28,37,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(20,28,37,0.6) 0%,rgba(20,28,37,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(20,28,37,0.6) 0%,rgba(20,28,37,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#141c25', endColorstr='#00141c25',GradientType=0 ); /* IE6-9 */
}

#degrade2{width:100%; height:280px;display: none; }
#degrade3{width:400px; height:100%; display: none;}
.introFond {width:100%; height:280px; margin-top:90px}

#intro2 #titre1 {margin-left:auto; margin-right:auto; display: block; padding:1.5em 1em 1.5em 1.8em; min-width: 80%; width:80%; margin-top:200px; float: none}
	#intro2 .introFond {height:280px}
	#intro2 #infoRapide {width:80%; margin-left:auto; margin-right: auto; padding-top:2.3em; font-size: 1.25em; margin-bottom:3em; float: none}		

.liste2 li a strong {font-size: 1.4em}
.liste2 li a i { font-size:0.9em}
.liste3 li a strong {font-size: 1.4em}
.liste3 li a i { font-size:0.9em}
.liste4 li a strong, .liste4 li span.nonlien strong { font-size: 1.2em}
.liste4reas li {margin-bottom:3em}
.liste4reas li a strong {font-size: 1.2em}	
	
	
.produit-selection h2 {font-size:3.8em;}

.titreHaut {font-size:1.8em}
.titreHaut br {display:none}
	.titreHaut span {width:100%}
.texteAG p { margin-left:0%}
	
.fondgrisProduit {background-color: #fff; overflow: hidden}
.produit-selection { padding-top:5em; padding-bottom:8em}
.slide {width: 75%}
.slide .imgP {width:60%; float:none; margin-left:20%;}
.slide .infosP {width:80%; margin-left: 10%; margin-top: 2em; float:none; text-align: center}
.slide  .rondProduit {display: none}
	
	#bas {padding-top: 7em}
.nos-agences { margin-left:0; width:30%; min-width:190px}
.coordonnees { margin-left:2%; width:50%; }
	
.paddH23 {padding-top:12em}
.paddH13 {padding-top:7em}

.bttrait {font-size: 1.4em}
	
.Article {width:90%; margin-left:0; min-width:300px;}	
.depliA {font-size: 1.1em; width:77%;}	
	
#demande {width:62%; margin-left:0%;}
#demande h3, #formulaire {width:90%}	
	#formulaire [type="checkbox"]:not(:checked) + label, #formulaire [type="checkbox"]:checked + label {padding:0 0 0 25px; }
	#formulaire [type="checkbox"]:not(:checked) + label:before, #formulaire [type="checkbox"]:checked + label:before {width:11px; height:11px}
	#formulaire [type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after {font-size: 11px;}	
.complement-contact {width:35% }	
	
	
	
}







@media screen and (max-height:330px) , screen and (max-width:710px) {

	
.liste2 li {width:100%; margin-right:0; margin-bottom:20px; float:none}
.liste2 .ret {margin:0; width: 0; float: none; clear: both}
.liste2 li a strong { font-size: 1.9em}
.liste2 li a i {font-size: 1.2em}	
	
.liste3 li {width:100%; margin-right:0; margin-bottom:20px; float:none}
.liste3 .ret {margin:0; width: 0; float: none; clear: both}
.liste3 li a strong { font-size: 1.9em}
.liste3 li a i {font-size: 1.2em}

.liste3produits li {width:100%; margin-right:0; float: none; margin-bottom:5em}
.liste3produits .ret {margin:0; width: 0; float: none; clear: both}
.liste3produits strong {font-size: 1.2em}
.liste3produits p {width:100%}
	
.liste4 { position: relative; z-index: 20}
.liste4 li {width:48%; margin-right:2.4%; float: left; margin-bottom: 20px}
.liste4 .sansmargeDmob {margin-right: 0}
.liste4 .sansmargeD {margin-right: 0}
.liste4 .ret {margin:0; width: 0; float: none; clear: both}
.liste4 li a span, .liste4 li span.nonlien span {margin-top: 0.4em;}
.liste4 li a strong, .liste4 li span.nonlien strong {font-size:1.1em; padding-top: 0.3em}
.liste4 li a i, .liste4 li span.nonlien i{ font-size:0.9em; }

.liste4reas li {margin-bottom:3em}
.liste4reas li a strong, .liste4reas li span.nonlien strong {font-size:1.1em}
	
.texteAG {width:100%; float:none}
.texteAG p { margin-left:0; font-size:1.4em; line-height: 2em}

.rondext {width: 70%; position: relative; float:none; margin-right:auto; margin-left: auto; margin-top:6em}
	.rondblanc {top:50%; left:50%}

.textefonce {color:#141c25} .texteblanc {color:#fff}
.texteAD {width:100%; margin-left: 0; margin-top:40px; float: none; position: relative; z-index: 11}

.certifs {}
.certifs li {width:47%; margin-right: 6%; float: left; display: block; margin-bottom:10px}
.certifs .der {margin-right: 0; float: left}
.certifs .sansmargeDmob {margin-right: 0}
.certifs li.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

.slideproduit .fleche {margin-top: -25px; width: 50px;}	
	.produit-selection h2 {font-size:3.2em}
	
#bas {padding-top:8em; padding-bottom:9em; font-size: 1.2em}
	
#logobas {width:100px}
.nos-agences { margin-left:0%; width:100%;float: none}
	/*.nos-agences p br {display: none}
	.nos-agences p strong {display: block}*/
.coordonnees { margin-left:0%; width:100%; float: none; font-size: 1.2em}
	.coordonnees strong  {line-height: 1.6em}
	.coordonnees a.google-review {font-size: 1.1em}
	
.bttrait {font-size: 1.3em}
	
.Article {width:100%; margin-left:0; min-width:250px; margin-top:3em}	
.depliA {font-size: 1.2em; width:90%; padding-right: 3em; letter-spacing:normal;}		
.depliC {font-size: 1.4em; width:90%; padding-right: 3em; letter-spacing:normal;}	
	
.Carte {border-radius:1.5em; margin-bottom: 5em}
	
.TitreArticle h3 {position: relative; bottom:0em; font-size:2.1em; padding: 0.8em 0 0 0}
	.TitreArticle h3 br {display: none}
	.Article p {font-size: 1.2em; font-family: 'pt', sans-serif; font-weight: 400; color:#242a32; line-height:2em}

#demande {width:100%; float: none}
	#demande h3 {font-size:1.1em; width: 85%}			
	#formulaire {padding-bottom:3em; width:85%; font-size:1.1em}	
		#formulaire .formgauche {width:100%; float:none; margin:1em 0 0 0;}
		#formulaire .formdroite {width:100%; float:none; margin:1em 0 0 0}
		#formulaire textarea{height:13em}
	#formulaire [type="checkbox"]:not(:checked) + label, #formulaire [type="checkbox"]:checked + label {padding:0 0 0 35px; font-size:0.9em; line-height:1.4em}
	#formulaire [type="checkbox"]:not(:checked) + label:before, #formulaire [type="checkbox"]:checked + label:before {top: 1px; width:16px; height:16px;}
	#formulaire [type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after {top:2px; left: 3px;font-size: 16px}		
	#formulaire label {color:#fff}
	#formulaire label a {color:#fff; text-decoration:none}
	#formulaire label a:hover {color:#fff; text-decoration:underline}
	#formulaire #captcha {padding:1.2em 0 0.5em 0;display:block}
	#formulaire #captcha strong {display: inline-block; font-size: 1em}
	#formulaire #envoyer {min-width:95%;margin:2.8em 0 1.3em 0; text-align:left}
	#rgpdExt {text-align:left; font-size: 0.9em}
	#message-requete {font-size:1.2em; top:25px; left:5%; margin-left:0; width:78%; padding:20px 6%; background-size:15px; background-position:96% 15px;}
.complement-contact {width:100%; float: none; display: none}			

	
#facebook {width:36px; height:36px; left:5px}
#instagram {width:36px; height:36px; left:46px}
#btdevis {left:87px; padding: 11px 19px 11px 36px; font-weight: 500; font-size:14px}
		#btdevis img {width:8px; left:17px; margin-top: -4px; }		
	
}
@media screen and (max-width:450px) {
/*.infos3 br {display: none}*/
}