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

html {font-size: 100%; height:100%; width:100%; -webkit-font-smoothing: antialiased;text-rendering: optimizeLegibility;overscroll-behavior: none;
position: relative}

@font-face {font-family:'kum';font-style: normal;font-weight: 300;
  src: url('../index.html');
  src: local(''),
       url('../index.html#iefix') format('embedded-opentype'),
	   url('../fontes/kum-300.woff2') format('woff2'), 
       url('../fontes/kum-300.woff') format('woff'), 
       url('../fontes/kum-300.ttf') format('truetype'); 
}
@font-face {font-family:'kum';font-style: normal;font-weight: 400;
  src: url('../index.html'); 
  src: local(''),
       url('../index.html#iefix') format('embedded-opentype'),
	   url('../fontes/kum-400.woff2') format('woff2'), 
       url('../fontes/kum-400.woff') format('woff'), 
       url('../fontes/kum-400.ttf') format('truetype'); }

@font-face {font-family:'kum';font-style: normal;font-weight: 500;
  src: url('../index.html');
  src: local(''),
       url('../index.html#iefix') format('embedded-opentype'), 
	   url('../fontes/kum-500.woff2') format('woff2'), 
       url('../fontes/kum-500.woff') format('woff'), 
       url('../fontes/kum-500.ttf') format('truetype'); }

@font-face {font-family:'kum';font-style: normal;font-weight: 600;
  src: url('../index.html');
  src: local(''),
       url('../index.html#iefix') format('embedded-opentype'), 
	   url('../fontes/kum-600.woff2') format('woff2'), 
       url('../fontes/kum-600.woff') format('woff'), 
       url('../fontes/kum-600.ttf') format('truetype'); }

body {/*font-size: 1em;*/ color:#1d1c1b; font-family: 'kum', 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, li {margin:0; padding:0; list-style:none}
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:#00949a}*/
#testeur {position:fixed; z-index:9999; bottom:0; right:0; padding:7px; font-size:0.8em; letter-spacing:0.1em; /*display:inline-block;*/ font-family: sans-serif; color:#FFF; opacity:0.6; background-color: #000000; display:none}

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

.calExt{} .cal {position: absolute; top:0; left:0; width: 100%}
.H .cal {width: auto; height: auto}
.calExt2{} .cal2 {position: absolute; top:0; left:0; width: 100%}
.H .cal2 {width: auto; height: auto}
.calExt3{} .cal3 {position: absolute; top:0; left:0; width: 100%}
.H .cal3 {width: auto; height: auto}


#remonte {width:46px; height:46px; background-color:#fff; position:fixed; bottom:0px; left:0; z-index:150; 
		visibility:hidden; overflow:hidden; cursor:pointer; border-top-right-radius:3px}
		#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}

.curseur{ width: 24px; height: 24px; z-index: 99999; background:#d93732; opacity:0.9; visibility: hidden; transform-origin: 50% 50%;
	border-radius: 50%; position: fixed; top:100%;  left:50%; margin-left: -12px; margin-top:-12px; /*transform: translate(-50%, -50%);*/ pointer-events: none;
	-webkit-mix-blend-mode: multiply; -moz-mix-blend-mode: multiply; -o-mix-blend-mode: multiply; -ms-mix-blend-mode: multiply; mix-blend-mode:multiply;}
/* commun */ 


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

.strongTraitA {color:#d93732; display: inline-block; position: relative; font-weight: 300}
	.strongTraitA i {background-color: #d93732; width: 100%; height:2px; position: absolute; bottom: 0; left: 0; transform-origin: 0 0}

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

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



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

.H .ano0 {visibility: hidden}
.H .anSX1 {transform-origin:0 0 }
.H .anS1 {transform-origin:50% 50% }
.H .anS2 {visibility: hidden; transform-origin:50% 50% }
.H .anyMini {visibility: hidden; transform-origin: 0 0}
.H .any1, .H .any2 {visibility: hidden; transform-origin: 50% 50% }
.H .anyA, .H .anyB, .H .anyC, .H .anyD {visibility: hidden; transform-origin: 50% 50% }
.H .anCL0 {overflow: hidden; position: relative; transform-origin: 0 0}
.H .anCL1 {overflow: hidden; position: relative; transform-origin: 0 0}

body {font-size: 1.3em;}
#video-ext, #projhaut-ext {width:100%; height: 100%; min-height: 750px; position: relative; z-index: 0}
.H #video-ext, .H #projhaut-ext {visibility: hidden}

@media screen and (max-width: 2300px) {  
	body {font-size: 1.2em} 
	#video-ext, #projhaut-ext {min-height:700px}
}
@media screen and (max-width: 2100px) {  
	body {font-size: 1.1em} 
	#video-ext, #projhaut-ext {min-height:650px}
}
@media screen and (max-width: 1950px) {  
	body {font-size: 1em} 
	#video-ext, #projhaut-ext {min-height:600px}
}


#introAcc {width: 100%; height: 100%; overflow: hidden; position: relative; z-index: 50; background-color: #fff}
.H #introAcc { visibility: hidden;position: fixed; top:0; left: 0;}
	#introAccInt {width: 100%; height: 100%; position: relative; overflow: hidden; z-index: 80; background-color: #000000}
	#introAcc-logo {width:7em; top:50%; left:50%; margin-left: -3.5em; margin-top:-3.5em; position: absolute; z-index: 10}
	.introAcc-img {position: relative} 
	.H .introAcc-img {position: absolute; top:0; left:0;}
	.H .introAcc-img, .H #introAcc-logo {visibility: hidden}

#pageAcc {background-color: #fff; width: 100%; height:auto}
.H #pageAcc { visibility: hidden; }
.calExtA{} .calA {position: absolute; top:0; left:0; width: 100%}
.H .calA {width: auto; height: auto}


#logo {width:13.2em; display: block; position: absolute; z-index: 10; top:3.7em; left: 4.7%}
.H #logo {visibility: hidden}

#logo img {width: 100%; display: block}
	#video-int {width:100%; height: 100%; position: relative; z-index: 0; overflow: hidden; background-color: #14171a}
		#video {z-index: 5}
		
	#accrocheAcc {position: absolute; bottom: 0; left: 4.7%; z-index:7}
	#accrocheAccInt {padding-bottom:4em;/*js*/ padding-left: 2.4em; position: relative}
		#accrocheAccInt #traitaccroche {width: 1px; height: 100%; position: absolute; top:1.5em; left: 0; background-color: #FFFFFF; z-index: 7;
			transform-origin:100% 100%}
		#accrocheAcc h2 { font-weight: 300; color: #fff; font-size: 4em; display: block; line-height:0.8em}
			#accrocheAcc h2 b {display: inline-block; position: relative; overflow: hidden;font-weight: 300; line-height: 1.4em; padding: 0.02em 0;}
			#accrocheAcc h2 span {display: inline-block; position: relative; line-height: 1.4em;}
		#accrocheAcc a {font-weight: 400; color:#fff; font-size: 1.4em; color:#fff; position: relative; padding: 1em 0; margin-right:2em; display: inline-block; margin-top:1em; letter-spacing: 0.025em; line-height: 1.5em}
		#accrocheAcc a.sansM {margin-right: 0}
		#accrocheAcc a i { position: absolute; bottom:0.9em; left: 0; width: 100%; height: 1px; background-color: #fff; transform-origin: 0 0}




#btmenu {position: fixed; right: 4.7%; top: 1.9em; cursor: pointer; padding: 1.7em 0; border-radius: 0.7em; font-size:1em; z-index: 1000}
.H #btmenu {visibility: hidden}
	#btmenu #btmT {display:inline-block; float: left; font-size: 1.35em; letter-spacing: 0.03em; line-height: 1.3em; font-weight: 400; color:#fff; 
		padding-right:0.85em; position: relative}
	#btmenu #btmT span { display:inline-block; overflow: hidden; padding: 0.05em 0}
	#BtmTs2 {position: relative; top:0; left: 0}
	#BtmTs2 {position: absolute; top:0.05em; left: 0}
	#btmenu #btmT span b {display: inline-block; position: relative; font-weight: 400}
	#btmenu #btmT #BtmTs2 b {visibility: hidden}
	#btmenu #btmL {display: block; width: 2.3em; margin-top:0.6em; height:0.85em; float:left; position: relative}
	#btmenu #btmL i {background-color: #fff; width: 100%; height: 1px; display: block; position: absolute; left:0; visibility: hidden}
	#btmenu #btmL #btmLi1 {top:0; transform-origin: 100% 100%} #btmenu #btmL #btmLi2 {bottom:0; transform-origin: 0 0}
	#btmenu #btmL b {background-color: #fff; width: 100%; height: 1px; display: block; position: absolute; left:0; top:50%; transform-origin:50% 50%; visibility: hidden}


.navigation {width:100%; height:auto; position:relative; left:0; background-color:#000}
	.H .navigation {width:100%; height: 100%; position: fixed; left:102%; bottom: 0; z-index:900; overflow:hidden; transform-origin:0 100%}
	/*.H .navigation {left:0%}*/
	.navigation .fondnav {display: none}
	.H .navigation .fondnav {display:block; position:absolute; z-index:900; top:50%; left:50%; width: auto; height: auto}

	.navigationInt {width:100%; height:800px; position: relative; z-index:902}
	.H .navigationInt {height:100%}

#navenglobe { }
#liste1 {font-size: 5.95em; margin-left: 15.1%}
#liste1 li {display: inline-block; float: left; margin-top: 0; margin-bottom: 0; margin-right:0.4em; padding: 0; line-height: 0.8em}
#liste1 li.ret {display: block; margin: 0; clear: both}
#liste1 li a {color:#fff; line-height: 1.4em; display: inline-block; position: relative; overflow: hidden; 
	padding:0.02em 0.3em 0.2em 0;}
#liste1 li a strong {color:#fff; font-weight: 300; line-height: 1.4em; display: inline-block; position: relative}
#liste1 li a span {color:#fff; line-height: 1.4em; display: inline; position: absolute; top:0.02em; left: 0}
	#liste1 li a span b  {display: inline-block; position: relative; font-weight: 300; line-height: 1.4em; font-style: normal; visibility: hidden}

#liste2 {font-size: 1.9em; margin-left: 15.1%; float: left; margin-top: 2.1em; letter-spacing: 0.03em; margin-right:4.7em}
#liste2 li {display: block}
#liste2 li.ret {display: block; margin: 0; clear: both}
#liste2 li a {color:#fff; font-weight: 400; line-height: 1.5em; display: inline-block; position: relative}
#liste2 li a i {background-color: #d93732; width: 100%; height:2px; position: absolute; bottom: 0; left: 0; visibility: hidden; transform-origin: 0 0}

#coordonnees {font-size: 1.9em; float: left; margin-top: 2.1em; letter-spacing: 0.03em}
#coordonnees strong {display: block; font-size: 0.9em; padding-top: 0.1em; font-weight: 400; padding-bottom: 0.3em; color:#fff}
#coordonnees p {display: block; margin: 0; padding: 0; line-height: 1.5em; font-size: 0.7em; font-weight: 300; color:#fff}
#coordonnees p a {color:#fff; font-weight: 300; display: block; padding: 0.2em 0; line-height: 1.5em; display:inline-block; position: relative}
#coordonnees p a i {background-color: #fff; width: 100%; height:1px; position: absolute; bottom: 0.2em; left: 0; visibility: hidden; transform-origin: 0 0}
.navtrait {width:1px; height:100%; background-color:#fff; position:absolute; top:0; left:11.9%; transform-origin:100% 100%}

.reseaux {position:absolute; right:4.7%; bottom:6em}
	.reseaux li {margin-right: 1.2em; display:inline-block; float: left}
	.reseaux a {width:2.9em; height: auto; border-radius: 50%; display: block; border: 1px solid #fff; border-color:rgba(255, 255, 255, 0.25);
		transform-origin: 50% 50%}
		.reseaux a img {width: 100%; display: block; transform-origin: 50% 50%;}
	.reseaux .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

#liste3 { position: absolute; bottom:2.5em; right:4.7%; z-index: 903; font-size:1em; letter-spacing: 0.025em; display: block}
	#liste3 li { display: inline-block; float: left; padding-right:1.3em}
	#liste3 li span, #liste3 li a { color:#fff; font-weight: 400; line-height: 1.8em; padding: 0.4em 0 0.4em 0; position: relative; display: inline-block;}	
	#liste3 .ret, #liste3 .retMob {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block}

#navnoir {width:100%;height: 100%; position: absolute; background-color: #14171a;/* background-color: rgba(0, 0, 0, 0.78);*/ top: 0; left: 0; transform-origin:0 0; z-index: 901}


.margH2 {margin-top:2em}
.margH5 {margin-top:5em} .paddH5 {padding-top:5em} .margB5 {margin-bottom:5em} .paddB5 {padding-bottom:5em}
.margH7 {margin-top:7em} .paddH7 {padding-top:7em}
.margH10 {margin-top:10em} .paddH10 {padding-top:10em} .margB10 {margin-bottom:10em} .paddB10 {padding-bottom:10em}
.margH12 {margin-top:12em} .paddH12 {padding-top:12em}
.margH15 {margin-top:15em} .paddH15 {padding-top:15em}

.cont-intro01 { padding-top: 15em; padding-bottom: 3em; margin-left: 4.7%; float: left; width:70% }
	.cont-titre01 { color:#000000; font-size: 1.35em; letter-spacing: 0.025em; line-height: 1.5em; font-weight: 400; padding-bottom:2em}
	.cont-intro {color:#000000; font-size:3.6em; line-height: 1.5em; padding: 0; margin: 0; font-weight: 300}
	/*.cont-intro a {color:#d93732; display: inline-block; position: relative}*/
	/*.cont-intro a i {background-color: #d93732; width: 100%; height:2px; position: absolute; bottom: 0; left: 0; transform-origin: 0 0}*/
.img01 {float: right; width: 22%; display: block; margin-top: 22em}

#visite {width: 78%}
	#visite iframe {width:100%; border:none; border:0}

.lienP {width: 100%; padding-top:7em}
.lienP.margePlus {padding-top: 11em}
.fond01 { background-color: #f7f7f7} .fond02 { background-color: #fff} .fondnoir { background-color: #000}
.lienP-titre01 {width: 100%; text-align: center}
	.lienP-titre01 span {background-color: #d93732; color:#fff; font-size: 0.9em; text-transform:uppercase; letter-spacing: 0.25em; line-height: 1.4em;
	padding: 0.4em 0.6em; margin-bottom:2.5em; display: inline-block}
.lienP a {width: 100%; display: block; position: relative}
	.lienP a .lienP-visu {width: 31%; margin-left: auto; margin-right: auto; display: block; overflow: hidden; position: relative; 
		transform-origin: 50% 50%; z-index: 45}
		.lienP a .lienP-visu img {width: 100%; display: block; transform-origin: 50% 50%; position: relative; 
			/*clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);*/}

.lienP-infos {position: absolute; bottom: 0; left:65.5%; margin-left:2.3%; padding-top:1.2em; z-index: 50}
	.lienP-infos i {background-color: #d93732; width:3.5em; height:2px; position: absolute; top: 0; left: 0; transform-origin: 0 0}
	.lienP-infos01 {color: #000; font-size: 2.5em; font-weight: 400; line-height: 1.2em; display: block; margin-bottom: 0.5em}
	.lienP-infos02 {color:#767777; font-size: 1em; font-weight: 400; line-height: 1.65em; display: block; margin-bottom: 1.5em}

.lienP-infosBT { position: relative; padding:1.1em 4.6em 1.1em 0em; display: inline-block; font-size: 1.1em; overflow: visible}
	.lienP-infosBT span {color:#000; font-weight: 400; line-height: 1.4em;  position: relative; font-size: 1em; letter-spacing: 0.025em}
	.lienP-infosBT b {position: absolute; top: 50%; right:0.1em; width:3em; margin-top: -1.5em; border-radius: 50%; transform-origin: 50% 50%; 
	border: solid 1px #d93732}
	.lienP-infosBT b img {width: 100%; display: block}

.lp-mini01 {width: 10%; display: block; position: absolute; top: 0; left: 12.8%; display: block; z-index: 40}
.lp-mini02 {width: 10%; display: block; position: absolute; top:56%; left:0; display: block; z-index: 41}
.lp-mini03 {width: 10%; display: block; position: absolute; top:20%; right:6.3%; display: block; z-index: 42}
.lp-mini04 {width: 10%; display: block; position: absolute; top: 0; right:0; display: block; z-index: 43}

.lienP a.lp-grande {width: 100%; display: block; position: relative; margin-top:10.5em; overflow: hidden; z-index: 44}
.lp-grande img {width: 100%; display: block; transform-origin: 50% 50%}


.part01 { position: relative; margin-top: 15em; padding-top: 7.5em; width: 100%}
.texteGeant {font-size:11em; font-weight: 300; display: block; color:#c7c9cc; position: absolute; top: 0; right:22%; z-index: 11;
	text-transform: uppercase; line-height: 1em; letter-spacing: 0.5em; overflow: hidden; width:78%; 
	-webkit-mix-blend-mode: multiply; -moz-mix-blend-mode: multiply; -o-mix-blend-mode: multiply; -ms-mix-blend-mode: multiply; mix-blend-mode:multiply; }
	.texteGeant span {display: block; float: right; text-align: right; min-width:1800px; position: relative;}
	.texteGeant b {font-weight: 300; display: inline-block; position: relative}
	.texteGeant i {color:#d93732; font-style: normal}
	.texteGeant strong.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

.part01-img1 {width: 71%; display: block; position: relative; z-index: 10}

.texteG {width: 52%; margin-left: 9%; float: left; padding-top: 13em}
.visuD {width: 39%; float: right}
.part01-img2 {width: 50%; float: right}
.part01-img3 {width: 50%}
.part01-img4 {width: 68%; margin-top:27em}
.part01-img2, .part01-img3, .part01-img4 {overflow: hidden; transform-origin:0 0; position: relative}
.part01-img1 img, .part01-img2 img, .part01-img3 img, .part01-img4 img, .part01-img2 video, .part01-img3 video {width: 100%; display: block}

.titre02-acc {font-size: 2.3em; font-weight: 400; color:#000; line-height: 1.4em; padding-bottom: 1.2em}
.titre02-acc strong {color:#d93732; font-weight: 400}
.p-acc {color:#7e7e7e; font-weight: 400; font-size: 1.5em; line-height: 1.6em; letter-spacing: 0.015em}
.p-acc a {color:#7e7e7e; text-decoration: underline}
.p-acc a:hover {color:#000; text-decoration:none}

.servicesPlusInt {margin-top:1.8em; width: 70%; padding-bottom: 4em}
.servicesPlusInt.full {width: 100%}
.depliA {font-weight:400; color:#000; font-size: 1.5em; padding:0.3em 0 0.3em 1.6em;  position: relative; display:inline-block; line-height: 1.4em; cursor: pointer; z-index: 30; letter-spacing: 0.025em; margin-bottom: 0.1em }
	.depliA span {/*border-bottom:1px solid #d93732;*/ padding: 0.2em 0 0.2em 0; display: inline-block; position: relative}
	.depliA span b {position: absolute; bottom:0em; left: 0; width: 100%; height: 1px; background-color: #d93732; transform-origin: 0 0}
	.depliA .btPlus {width:0.8em;position: absolute; display: block; top:0.8em; left: 0;}
	.depliA .btPlus img {display: block; width: 100%; transform-origin: 50% 50%}

.depliB {padding-top:0.8em; padding-bottom: 3em; position: relative; z-index: 20; width:100%; font-size: 1em; line-height:1.8em; color:#B0B0B0}
.H .depliB {display: none}
	.depliB p {color:#7e7e7e; font-weight: 400; font-size: 1.35em; line-height: 1.6em; letter-spacing: 0.015em; margin: 0; padding: 0}
	.depliB p strong {color:#000; font-weight: 400}

	.depliB p a {color:#7e7e7e; text-decoration: underline}
	.depliB p a:hover {color:#000; text-decoration:none}
	
.visuG {width:23%; float:left; margin-left: 15%; margin-top: 28em; overflow: hidden; transform-origin:0 0; position: relative}
	.visuG img {width: 100%; display: block}
.texteD {width: 52%; margin-left: 10%; float: right; margin-top: 13em}


.visuCarreExt {width:100%; position: relative}
.visuCarre {width:49.52%; margin-left: 38%; position: relative; overflow: hidden; transform-origin: 0 0}
.visuCarreFlotant {position: absolute; left:0; bottom: 0; width:17%;overflow: hidden; transform-origin: 0 0}
.H .visuCarreFlotant {position: absolute; left:0; bottom: 0;}
.visuCarre img, .visuCarreFlotant img {width: 100%; display: block}

.part02 { position: relative; margin-top:10em; padding-bottom:10em; width: 100%}

.visuCarre2Ext {width:100%; position: relative;}
.visuCarre2 {width:39%; margin-left:22%; position: relative; overflow: hidden; transform-origin: 0 0}
	.visuCarre2 img {width: 100%; display: block}
.visuCarre2Flotant {position: absolute; right:0; bottom: 0; width:19%;overflow: hidden; transform-origin: 0 0}
.H .visuCarre2Flotant {position: absolute; right:0; bottom: 0;}
	.visuCarre2Flotant img {width: 100%; display: block; margin-top: 2em}


#categories {position: relative; overflow: hidden; width: 100%; height: auto}
#categories .cal3 { position: absolute; z-index: 5}
.H #categories .cal3 {visibility: hidden}
#categories .cal3PREM {position: relative; z-index: 0; visibility:hidden; width: 100%; height: auto; display: block}

#categories ul { position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 10}
#categories ul li {width: 20%; float: left; height: 100%;}
#categories ul li.ret{clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
#categories ul li a {width: 100%; height: 100%; display: block; position: relative; color:#fff}
#categories ul li a i {width: 1px; background-color: #FFFFFF; height: 100%; position:absolute; top: 0; left: 0; transform-origin: 0 0}
#categories ul li a b {width:100%; background-color: #fff; height:5%; position:absolute; bottom:0; left: 0; transform-origin:100% 100%; visibility: hidden}
#categories ul li a div {position: absolute; top:60%; left:0; width: 85%; margin-left: 10%}
#categories ul li a strong {font-weight: 300; font-size: 2.45em; line-height: 1.6em; display: block}
#categories ul li a p {font-weight:400; font-size:1.1em; line-height: 1.6em; letter-spacing: 0.02em; display: block; margin: 0; padding: 0}


.marques {padding-top: 12em; padding-bottom: 12em; width: 72%; margin-left:auto; margin-right: auto}
.marques li.marque-liste {width: 18%; margin-left: 1%; margin-right: 1%; float:left}
.marques li.ret{clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
.marques li a {position:relative; overflow: hidden; width: 100%; height: auto; display:block}
.marques li a img {width: 100%; display:block; transform-origin: 50% 50%}


#bas {width:100%; display: block}
.basint {width: 71%; margin-left: auto; margin-right:auto; padding-top:9em; padding-bottom:4em}
.basintsansM { padding-top: 0}
#rencontre { font-size:3.8em; margin-bottom: 0.6em}
#rencontre strong {color:#000; display:block; line-height: 1.3em; font-weight: 300; overflow: hidden}
#rencontre span {color:#969696; display:block; line-height: 1.3em; font-weight: 300; overflow: hidden}
#rencontre b {display: inline-block; line-height: 1.3em; position: relative; font-weight: 300}

.basint .lienRond {margin-bottom:5em}
.lienRond { position: relative; padding:1.1em 4.6em 1.1em 0em; display: inline-block; font-size: 1.1em; overflow: visible}
	.lienRond span {color:#000; font-weight: 400; line-height: 1.4em;  position: relative; font-size: 1em; letter-spacing: 0.025em}
	.lienRond b {position: absolute; top: 50%; right:0.1em; width:3em; margin-top: -1.5em; border-radius: 50%; transform-origin: 50% 50%; 
	border: solid 1px #d0d0d0}
	.lienRond b img {width: 100%; display: block}

.colbas {float: left; display: inline-block; font-size: 1.5em; line-height:1.7em; font-weight: 300; margin-bottom: 2em}
.col1 {margin-right: 7%; color:#000}
.col2 {margin-right: 7%; color:#737373}
.col3 {color:#737373}

.col1 a, .col2 a {color:#000; display: inline-block}
#lignebas {width: 100%; height: 1px; background-color: #e0e0e0; position:relative; margin-top:4em; margin-bottom:2em}

.reseauxBas {position:relative; float: left; display: inline-block}
	.reseauxBas li {margin-right: 1.2em; display:inline-block; float: left}
	.reseauxBas a {width:2.9em; height: auto; border-radius: 50%; display: block; border: 1px solid #c4c4c4; border-color:rgba(0, 0, 0, 0.25);
		transform-origin: 50% 50%}
		.reseauxBas a img {width: 100%; display: block; transform-origin: 50% 50%;}
	.reseauxBas .ret {clear:both; display: block; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

#mentionsBas {float: right; display: inline-block; font-size:1.2em; letter-spacing: 0.025em}
	#mentionsBas li { display: inline-block; float: left; padding-right:1.3em}
	#mentionsBas li span, #mentionsBas li a { color:#737373; font-weight: 400; line-height: 1.8em; padding: 0.4em 0 0.4em 0; position: relative; display: inline-block;}	
	#mentionsBas .ret, #mentionsBas .retMob {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block}




#page {width: 100%; height: auto; overflow: hidden}
.H #page { visibility: hidden}

#intro-projets {position: relative; height: auto; margin-left: 4.7%; padding-left: 2.2%; margin-bottom: 6em}
.intro-projets01 { font-size:0.85em; letter-spacing: 0.15em; color:#737373; line-height: 1.6em; padding-bottom:1.5em; font-weight:500; 
	text-transform: uppercase}
.intro-projets02 { font-size:3.6em; color:#000; line-height:0.85em; font-weight: 300; display: inline-block}
.intro-projets02 b {display: inline-block; line-height: 1.45em; position: relative; font-weight: 300}


#intro-projets .trait {width: 1px; height: 100%; background-color: #000; position:absolute; top: 0; left: 0; transform-origin: 100% 100%}
#intro-projets .souligne {color:#d93732; display: inline-block; position: relative; font-weight: 300}
	#intro-projets .souligne i {background-color: #d93732; width: 100%; height:2px; position: absolute; bottom: 0em; left: 0; transform-origin: 0 0}




#pageproj {width: 100%; height: auto; overflow: hidden}
.H #pageproj { visibility: hidden}

#pageproj-int {width:100%; height: 100%; position: relative; z-index: 0; overflow: hidden; background-color: #14171a}
		#projvisu {z-index: 5}
		#degrade1{width:100%; height:280px; position: absolute; top: 0; left: 0; z-index:6;
		background: -moz-linear-gradient(top, rgba(20,23,26,0.47) 35%, rgba(20,23,26,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(20,23,26,0.47) 35%,rgba(20,23,26,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(20,23,26,0.47) 35%,rgba(20,23,26,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#14171a", endColorstr="#14171a",GradientType=0 ); /* IE6-9 */
		}
		#degrade2{width:40%; height:100%; position: absolute; top: 0; left: 0; z-index:6;
		background: -moz-linear-gradient(left, rgba(20,23,26,0.47) 35%, rgba(20,23,26,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, rgba(20,23,26,0.47) 35%,rgba(20,23,26,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, rgba(20,23,26,0.47) 35%,rgba(20,23,26,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#14171a", endColorstr="#14171a",GradientType=0 ); /* IE6-9 */
		}

		#accrocheProj {position: absolute; bottom: 0; left: 4.7%; z-index:7}
		#accrocheProjInt {padding-bottom:4em;/*js*/ padding-left: 2.4em; position: relative}
			#accrocheProjInt #traitaccroche {width: 1px; height: 100%; position: absolute; top:1.5em; left: 0; background-color: #FFFFFF; z-index: 7;
				transform-origin:100% 100%}
			#accrocheProj h2 { font-weight: 300; color: #fff; font-size: 4em; display: block; line-height:0.8em}
				#accrocheProj h2 b {display: inline-block; position: relative; overflow: hidden;font-weight: 300; line-height: 1.4em; padding: 0.02em 0;}
				#accrocheProj h2 span {display: inline-block; position: relative; line-height: 1.4em;}
			#accrocheProj h1 {font-weight: 400; color:#fff; font-size: 1.4em; color:#fff; position: relative; padding: 1em 0; display:block; margin-top:1em; letter-spacing: 0.025em; line-height: 1.5em}
			
.proj-compo01 {width: 78%}
.proj-compo01-img1 {width: 71.5%; float: right; display: block; overflow: hidden}
.proj-compo01-img1 img {width: 100%; display: block}
.proj-compo01-listeimg {width:12.8%; float:left}
.proj-compo01-img2, .proj-compo01-img3, .proj-compo01-img4 {width:100%; display: block; margin-bottom: 1.5em}

.proj-compo01-img5 {width: 100%; display: block; margin-top:10em}
	.proj-compo01-img5 img {width: 100%; display: block}

.proj-compo02 {width: 100%; margin-top:10em}
.proj-compo02-img1 {width: 35.5%; margin-left:42.5%} 
.proj-compo02-int {width:100%; position: relative} 
	.proj-compo02-img2 {width: 35.5%; margin-left:7% }
	.proj-compo02-liste {position:absolute; bottom: 0; right: 0; width: 50%}
		.proj-compo02-liste img {width:19%; float:right; margin-left:3%}
.proj-compo02-img1 img, .proj-compo02-img2 img {width: 100%; display: block}

.proj-compo03 {width: 100%; margin-top:25em; position: relative}
/*.texteProj-img {width: 22%; float: left; margin-top:27em} 
.texteProj { width: 56%; display: block; float:left}*/
.texteProj-img {width: 22%; position: absolute; bottom: 0; left: 0} 
.texteProj { width: 56%; margin:0 auto; display: block}
	.texteProj-img img {width: 100%; display: block}
	.texteProj-int {padding:0 10%}

.projcentre {margin-left: auto; margin-right: auto; width:56%; margin-bottom: 2em; overflow: hidden}
.projcentre img {width: 100%; display: block}

.proj-compo04 { position: relative; margin-top: 15em; padding-top:20em; width: 100%}
.proj-texteGeant {font-size:10.2em; font-weight: 400; display: block; color:#c7c9cc; position: absolute; top: 0; left:0; z-index: 11;
	text-transform: uppercase; line-height:1.2em; letter-spacing: 0.2em; overflow: hidden; width:100%; 
	-webkit-mix-blend-mode: multiply; -moz-mix-blend-mode: multiply; -o-mix-blend-mode: multiply; -ms-mix-blend-mode: multiply; mix-blend-mode:multiply; }
	.proj-texteGeant span {display: block; float:none; text-align:left; min-width:3000px; position: relative; padding-left:0.6em}
	.proj-texteGeant span.coul1 {color:#d93732; padding-left:0.6em}
	.proj-texteGeant b {font-weight: 400; display: inline-block; position: relative}
	/*.proj-texteGeant i {color:#d93732; font-style: normal}*/
	.proj-texteGeant strong.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

.proj-compo04-img1 {width:100%; display: block; position: relative; z-index: 10}

.proj-compo05 { position: relative; margin-top:8em; width: 100%}
.proj-compo05-img1 {width:100%; display: block; position: relative; z-index: 10}


#Pagesuivante {position: relative; overflow: hidden; width: 100%; height: auto; display: block}
#Pagesuivante .cal { position: absolute; z-index: 5}
.H #Pagesuivante .cal {visibility: hidden}
#Pagesuivante .calPREM {position: relative; z-index: 0; visibility:hidden; width: 100%; height: auto; display: block}

.traitSuiv {width: 1px; height:100%; position: absolute; top: 0; left:14.3%; background-color: #FFFFFF; z-index: 6; transform-origin: 0 0}
.H .traitSuiv {visibility: hidden}

.lienS-infos {position: absolute; top:0; margin-top:5%; /*js*/ left:17.5%; padding-top:1.2em; z-index: 50}
	.lienS-infos i {background-color: #d93732; width:3.5em; height:2px; position: absolute; top: 0; left: 0; transform-origin: 0 0}
	.lienS-infos00 {color: #fff; font-size: 1.6em; font-weight: 400; line-height: 1.2em; display: block; margin-bottom:1.3em}
	.lienS-infos01 {color: #fff; font-size: 5.3em; font-weight: 300; line-height: 1.1em; display: block; margin-bottom: 0.5em; letter-spacing: 0.02em}
	.lienS-infos02 {color:#cdcdcd; font-size: 1.2em; font-weight: 400; line-height: 1.65em;letter-spacing: 0.025em; display: block; margin-bottom: 1.5em}

.lienS-infosBT { position:absolute; top:50%; margin-top: -1.5em; left:85.6%; margin-left: -9em; z-index: 6; 
	padding:1.1em 4.6em 1.1em 0em; display: inline-block; font-size: 1.1em; overflow: visible}
	.lienS-infosBT span {color:#fff; font-weight: 400; line-height: 1.4em;  position: relative; font-size: 1em; letter-spacing: 0.025em}
	.lienS-infosBT b {position: absolute; top: 50%; right:0.1em; width:3em; margin-top: -1.5em; border-radius: 50%; transform-origin: 50% 50%; 
	border: solid 1px #d93732}
	.lienS-infosBT b img {width: 100%; display: block}


#aproposBlack {overflow: hidden; position: relative; transform-origin: 0 0}

.IntroApropos {position: relative; height: auto; margin-left:14.3%; padding-top:3em; }
#IA0 {margin-top:6em} #IA1,  #IA2, #IA3 {margin-top:0em} 

.intro-aproTitre { font-size:6.2em; line-height:0.85em; font-weight: 300; display: inline-block}
.intro-aproTitre b {display: inline-block; line-height: 1.15em; position: relative; font-weight: 300}

.intro-aproBlanc .intro-aproTitre {color:#fff}
.intro-aproNoir .intro-aproTitre {color:#000}

.IntroApropos .trait {width:10em; height:4px; background-color: #d93732; position:absolute; top: 0; left: 0; transform-origin:0 0}
/*.IntroApropos .souligne {color:#d93732; display: inline-block; position: relative; font-weight: 300}
	.IntroApropos .souligne i {background-color: #d93732; width: 100%; height:2px; position: absolute; bottom: 0em; left: 0; transform-origin: 0 0}*/

.apropos-cont, .apropos-cont2 {margin-left: 33%; padding-top:5em; font-size: 1.85em; line-height: 1.55em; font-weight: 300; padding-bottom: 5em}
.apropos-cont .p-apro01 {color:#fff; margin: 0; padding: 0} 
	.apropos-cont .p-apro01 a {color:#fff} 
.apropos-cont .p-apro02 {color:#b8b8b8; padding-top: 0.9em; margin: 0}
	.apropos-cont .p-apro02 a {color:#b8b8b8}
	.apropos-cont .p-apro02 a.lienTraitC {color:#fff}
.apropos-cont2 .p-apro01 {color:#000000; margin: 0; padding: 0} 
	.apropos-cont2 .p-apro01 a {color:#000000}
.apropos-cont2 .p-apro02 {color:#747474; padding-top: 0.9em; margin: 0}
	.apropos-cont2 .p-apro02 a {color:#747474}
	.apropos-cont2 .p-apro02 a.lienTraitB {color: #000}
.apropos-cont .apro-partenaire {width:10.5em; margin-top:3.5em; display: block}



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

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


.p-apro02 span.mini {font-size: 0.8em; line-height: 1.6em; padding-top:1em; padding-bottom: 0.4em; display: inline-block}

.apropos-cont2 .lienRond {font-size: 0.7em; margin-top: 2em}

.apropos-visu { position: relative; width: 83.6%; overflow: hidden; z-index: 10; transform-origin: 0 0}
.apropos-visu img {width: 100%; display: block}
.paddpourVisu {padding-bottom: 15em}

#apropos-visite {/*js height*/}
	#apropos-visite iframe {width:100%; border:none; border:0}
	#apropos-visite a {color:#000}

.apropos-contact {margin-left:14.3%; margin-top:5em; font-size: 1em; font-weight: 300; padding-bottom: 5em}
.aproposcolbas {float: left; display: inline-block; font-size: 1.5em; line-height:1.7em; font-weight: 300; margin-bottom: 2em}
.aproposcol1 {margin-right: 7%; color:#fff}
.aproposcol2 {margin-right: 7%; color:#fff}
.aproposcol3 {color:#cbcbcb}
.aproposcol1 a, .aproposcol2 a {color:#fff; display: inline-block}

#carte { position: relative; width: 83.6%; overflow: hidden; z-index: 10; transform-origin: 0 0; display: block}
	#carteint {width: 100%; display: block; position: relative; z-index: 10; transform-origin: 50% 50%}
	#rond {background-color: #d93732; width:1.4em; height:1.4em; position: absolute; top: 50%; margin-top:-0.7em; left:50%; margin-left:-0.7em;
		display: block; border-radius: 50%; border:2px solid #fff; z-index: 11; transform-origin: 50% 50%}
#infoscarte {font-size: 0.85em; color:#fff; position: absolute; top: 50%; margin-top:-5.2em; left:0; width: 100%; text-align: center; display: block; 
	z-index: 12; width: 100%; transform-origin: 0 0; letter-spacing: 0.025em}
#infoscarte div {position: relative; width: 100%; text-align: center}
#infoscarte span {background-color: #d93732; display: inline-block;padding: 1em 1.7em; border-radius: 3em; position: relative; z-index: 12}
#infoscarte img {position: absolute; bottom: -8px; left: 0; width:20px; display: block; z-index: 11; left: 50%; margin-left: -8px; display: block}
#facade {border:2px solid #fff; display: block; width: 22%; position: absolute; top: 1.5em; right:1.5em; z-index: 12}
.paddcarte {padding-bottom: 4em}




.apropos-contpar2  {float: left}
.aproDecale {margin-left:30.42%}

.contpar2G {width:47%; /*margin-top: 5em*/}
.contpar2GmargePlus {margin-top:5em}
.contpar2D {margin-left: 9%; width:44%; margin-top:10em }
.contpar2DmargePlus {margin-top:23em}
.contpar2G a, .contpar2D a { display: block}
.apropos-contpar2 b {display: block; width: 100%; position: relative; z-index: 10; overflow: hidden}
.apropos-contpar2 b.aproDecaleIMG {width:75%}
.apropos-contpar2 b img {display: block; width: 100%; transform-origin: 50% 50%}
.apropos-contpar2 span {position: relative; margin-top: 2em; display:inline-block; font-weight: 300; font-size: 1.6em; line-height: 1.6em; 
	padding-right:5.2em}
	.apropos-contpar2 span i {position: absolute; top: 0.8em; right:0; height:2px; background-color: #d93732; transform-origin: 0 0; 
			display: block; width:4.5em}
.apropos-contpar2 strong {position: relative; margin-top:0.7em; display: block; font-weight: 300; font-size: 2.8em; line-height: 1.2em}
.apropos-contpar2 p {position: relative; margin-top:1.2em; margin-bottom: 0; padding: 0; display: block; font-weight: 300; font-size: 1.35em; line-height: 1.75em;}

.contpar2Blanc span {color:#fff} .contpar2Blanc strong {color:#fff} .contpar2Blanc p {color:#b8b8b8}
.contpar2Noir span {color:#000} .contpar2Noir strong {color:#000} .contpar2Noir p {color:#747474}

.contpar2G p {margin-right: 8%}
.contpar2D p {margin-right:33%}
.paddpourMarqueA {padding-bottom:18em}
.paddpourMarqueB {padding-bottom:15em}
.paddpourMarqueC {padding-bottom:1em}













/*@media screen and (max-height:730px) , screen and (max-width: 1750px) {*/
@media screen and (max-width: 1750px) {
.H #load {width:40px; /*height:10px*/margin-top:-5px; margin-left:-20px;}
body {font-size: 0.8em}

#remonte {width:37px; height:37px}
	#remonte img {width:16px; margin-left:-8px; margin-top:-8px}
#video-ext, #projhaut-ext {min-height:480px}
	
}
	
@media screen and (max-width:1500px) {	
	#video-ext, #projhaut-ext {min-height:450px}
	.texteGeant {font-size:10.5em}
	#categories ul li a strong {font-size: 2.35em}
	#categories ul li a p {font-size:1.05em}
	.colbas {font-size: 1.4em} .col1, .col2 {margin-right: 6%}
	.proj-compo04 {font-size: 0.95em}
	.lienS-infos {font-size: 0.9em}
	
	.aproposcolbas {font-size: 1.4em} .aproposcol1, .aproposcol2 {margin-right: 6%}
	
	.apropos-contpar2 strong {font-size: 2.6em}
	.contpar2G p {margin-right: 0%}
	.contpar2D p {margin-right:25%}
}



@media screen and (max-width:1340px) {
body {font-size: 0.72em}
#video-ext, #projhaut-ext {min-height:430px}
}



@media screen and (max-width:1200px) {
#MOB2 {display: block}	
#navenglobe {font-size: 0.8em}
.cont-intro01 {width:65% }
	.cont-intro {font-size:3em}
.img01 {width: 22%}
	.cont-intro br {display: none}
	.part01 {margin-top: 15em; padding-top: 6em}
	.texteGeant {font-size:8.5em}
	
	.servicesPlusInt {width:85%}
	.servicesPlusInt.full {width: 100%}
	.texteD {margin-top: 10em}
	.visuG {width:25%; margin-left: 13%; margin-top: 32em;}
	.part01-img4 {width: 68%; margin-top:35em}
	
	#categories ul li a strong {font-size: 2em}
	#categories ul li a p {font-size:1em}
	
	.colbas {font-size: 1.3em} .col1, .col2 {margin-right: 6%}
	
	.proj-compo03 {margin-top:19em}
	.proj-compo04 {font-size: 0.85em}
	
.traitSuiv {left:10%}
.lienS-infos {left:13%; font-size: 0.8em}
	
.IntroApropos {font-size: 0.8em; margin-left:12%; padding-top:3em}	
.apropos-cont, .apropos-cont2 {margin-left: 28%; padding-top:4em; font-size: 1.7em; padding-bottom: 4em}	
	
.apropos-contact {margin-left:12%}	
	.aproposcolbas {font-size: 1.3em} .aproposcol1, .aproposcol2 {margin-right: 6%}
	
.aproDecale {margin-left:26%}	
.apropos-contpar2 span {font-size: 1.3em}	
.apropos-contpar2 strong {font-size: 2.2em}
	.contpar2G p {margin-right: 0%}
	.contpar2D p {margin-right:25%}	
	
	
}



@media screen and (max-width:990px) {
/*@media screen and (max-width:980px) {*/
#MOB2 {display:none}
#MOB {display: block}
.retMob {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

#btmenu #btmT #BtmTs2 b {visibility: hidden; color:#d93732}
	
.navigation {width:100%; height:auto; position:relative; left:0;background-color:#11100f}
	.H .navigation {width:100%; height: 100%; position: fixed; left:102%; bottom:auto; top:0; z-index:900; overflow:hidden; transform-origin:0 100%}
	
	.navigation .fondnav {display: none}
	.H .navigation .fondnav {display:none; position:absolute; z-index:900; top:initial; top:unset;bottom:0 ; left:0; width:100%; height: auto}
	
	.navigationInt {width:100%; height:100%; overflow: scroll; overflow-y: scroll; overflow-x: hidden;}
	.H .navigationInt {height:100%}		
	
	#navenglobe { padding-left:9%}
#liste1 {font-size:4.9em; margin-left:0; padding-top: 1em}
#liste1 li {display:block; margin-right:0; float: none}
#liste1 li.ret {display: block; margin: 0; clear: both}
#liste1 li a {line-height: 1.3em; display: inline-block; position: relative; overflow: visible; padding:0 0.3em 0 0;}
#liste1 li a strong {line-height: 1.3em;}
#liste1 li a span {line-height: 1.3em; top:0; left: 0; display: none}
	
#liste2 {font-size: 2.2em; margin-left:0; float: left; margin-top:1.8em; margin-right:2.5em}
#liste2 li {display: block}
#liste2 li.ret {display: block; margin: 0; clear: both}
#liste2 li a {line-height: 1.4em; /*color:#d93732*/ background-color: #d93732; padding: 0.2em 0.4em; margin-bottom: 0.1em}

#coordonnees {font-size: 2.2em; float: left; margin-top:1.8em}
#coordonnees strong {font-size: 0.95em; padding-top: 0.1em; padding-bottom: 0.3em}
#coordonnees p {line-height: 1.5em; font-size: 0.75em}
#coordonnees p a {padding: 0.2em 0; line-height: 1.5em}
	
	
	.reseaux {position:relative; left:0; bottom:0; padding-top:2.4em; margin-left: 9%}
	.reseaux li {margin-right: 1.3em}
	
	#liste3 {position: relative; bottom:0; left:0; letter-spacing: 0.025em; padding-top:3.5em; padding-bottom: 10em; font-size:1.05em; margin-left: 9%}
	#liste3 li {padding-right:1.3em}
	#liste3 li span, #liste3 li a {line-height: 1.8em; padding: 0.4em 0 0.4em 0;}
	#liste3 .ret, #liste3 .retMob {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block}
	
	.navtrait {display: none}
	
	
#video-ext, #projhaut-ext {min-height: 450px}	
#accrocheAcc h2 {font-size:3.2em}	
	#accrocheAcc a {font-size: 1.4em; padding: 1em 0; margin-right:1.5em; margin-top:0.5em}
	#accrocheAcc a.sansM {margin-right: 0}
	
#accrocheProj h2 {font-size:3.2em}	
	#accrocheProj h1 {font-size: 1.4em; padding: 1em 0; margin-top:0.5em}
	
	
.cont-intro01 { padding-top: 6em}	
.cont-intro {font-size:2.6em}	
	
.lienP-titre01 span {font-size: 0.85em}
.lienP a {padding-top: 7em}
	.lienP a .lienP-visu {width: 60%; margin-left: auto; margin-right: auto; z-index: 39 }
.lienP-infos {position:relative; bottom:unset; left:0; left:unset; margin-left:20%; padding-top:1.2em; margin-top: 4em; z-index: 50}
	.lienP-infos02 {font-size: 1.2em}
.lp-mini01 {width: 18%; top:2.4em; left: 12.8%;}
.lp-mini02 {width: 18%; top:35%; left:0;}
.lp-mini03 {width: 18%; top:40%; right:6.3%;}
.lp-mini04 {width: 18%; top:4em; right:0;}
.lienP a.lp-grande {margin-top:2.5em; padding-top: 0; }	
	
.part01 {margin-top: 11em; padding-top:4em}
	.texteGeant {font-size:6em}	
	
.texteG {width: 47%; margin-left: 9%; margin-right: 5%; padding-top: 8em}
	.titre02-acc .brmob, .p-acc .brmob {display: none}
	.servicesPlusInt {width:100%} .servicesPlusInt.full {width: 100%}	
.texteD {width:47%; margin-left:10%; margin-right: 5%}	
	.visuG {width:25%; margin-left: 13%; margin-top: 38em;}
	.part01-img4 {width: 68%; margin-top:44em}
	.visuCarre2 {width:45%; margin-left:16%;}
	
.part02 {margin-top:4em; padding-bottom:4em}	
	
#categories {position: relative; overflow: hidden; width: 100%; height: auto; padding:0; background-color: #000000}
#categories .cal3 { position: relative; z-index: 5; width: 100%; display: block; transform-origin:0 0}
.H #categories .cal3 {visibility:hidden}
#categories .cal3PREM {display:none}

#categories ul { position:relative; top:unset; left:unset; width: 100%; height:auto; z-index: 10}
#categories ul li {width:100%; float:none; height:auto; padding-top:6em}
	#categories ul li.ret{clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}
#categories ul li a {width: 100%; height:auto; display: block; position: relative; color:#fff; padding-top: 3em}
	#categories ul li a i { display: none}
#categories ul li a b {width:5em; background-color: #d93732; height:2px; position:absolute; top:1.5em; left:4.7%; transform-origin: 0 0; z-index: 9; 
	visibility:hidden}
#categories ul li a div {position:relative; top:0; left:0; width:90%; margin-left: 4.7%; max-width:400px; z-index: 10; margin-bottom:2.5em}
#categories ul li a strong {font-weight: 300; font-size: 2.65em; line-height: 1.6em; display: block}
#categories ul li a p {font-weight:400; font-size:1.1em; line-height: 1.6em; letter-spacing: 0.02em; display: block; margin: 0; padding: 0}
	
#categories ul li a span.Extimgcat {width: 100%; height: auto; display: block; overflow: hidden; position: relative; background-color: #000000}
	
.marques {padding-top: 9em; padding-bottom: 9em; width:90%; max-width: 400px}
.marques li.marque-liste {width: 46%; margin-left: 2%; margin-right: 2%}
.marques li.ret{clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none}

	#rencontre { font-size:3em; margin-bottom: 0.6em}
	.colbas {font-size: 1.5em} .col1 {margin-right: 8%}	.col2 {margin-right: 0}
	.col3 {clear: both}
	
#intro-projets {padding-left:4.7%;}	
.intro-projets02 { font-size:2.7em;}

#degrade1{width:100%; height:150px;}
#degrade2{width:100%; height:48%; position: absolute; top:0; top:initial; top:unset; bottom:0; left: 0; z-index:6;
		background: -moz-linear-gradient(bottom, rgba(20,23,26,0.47) 35%, rgba(20,23,26,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(bottom, rgba(20,23,26,0.47) 35%,rgba(20,23,26,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to top, rgba(20,23,26,0.47) 35%,rgba(20,23,26,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#14171a", endColorstr="#14171a",GradientType=0 ); /* IE6-9 */
		}

.proj-compo02 {width: 100%; margin-top:10em}
.proj-compo02-img1 {width: 39%; margin-left:39%}  
	.proj-compo02-img2 {width: 39%; margin-left:0 }	
	
.proj-compo03 {width: 100%; margin-top:18em;}
.texteProj-img {width: 15%} 
.texteProj { width: 70%; }
	.texteProj-int {padding:0 7%}
.projcentre {width:70%; margin-bottom: 2em}
	
.proj-compo04 {font-size:1em}
.proj-compo04 {margin-top:8em; padding-top:10em;}
	.proj-texteGeant {font-size:5.1em}	

	
#Pagesuivante {height:700px}
.traitSuiv {left:6%}
.lienS-infos {left:10%; padding-top:1.2em; font-size: 1em}
	.lienS-infos i {width:4.5em}
	.lienS-infos00 {font-size: 1.4em; margin-bottom:1.3em}
	.lienS-infos01 {font-size: 4.2em; line-height: 1.1em; margin-bottom: 0.5em;}
	.lienS-infos02 {font-size: 1.1em; margin-bottom: 1.5em}
.lienS-infosBT { position:relative;top:0;top:unset;margin-top:0em;left:0;left:unset; margin-left:0em; padding:1.1em 4.6em 1.1em 0em; font-size:1.2em}

.IntroApropos {font-size: 0.7em; margin-left:4.7%; padding-top:3em}
	#IA0 {margin-top:3em} #IA1,  #IA2, #IA3 {margin-top:0em}
.apropos-cont, .apropos-cont2 {margin-left:17%; padding-top:4em; font-size: 1.65em; padding-bottom: 4em}		
	.paddpourVisu {padding-bottom: 10em}

.apropos-contact {margin-left:4.7%}		
	.aproposcolbas {font-size: 1.5em} .aproposcol1 {margin-right: 8%} .aproposcol2 {margin-right: 0%} .aproposcol3 {clear: both}
	
.aproDecale {margin-left:10.2%}	
.apropos-contpar2 span {font-size: 1.3em}	
.apropos-contpar2 strong {font-size: 2.2em}
	.apropos-contpar2 p {font-size: 1.25em}
	.contpar2G p {margin-right: 0%}
	.contpar2D p {margin-right:15%}		

}






@media screen and (max-width:710px) {
#MOB3 {display: block}
.H #load {width:32px; /*height:8px*/margin-top:-4px; margin-left:-16px;}

#liste1 {font-size:4.9em; padding-top:0.5em}	
#liste2 {font-size: 2.5em; margin-top:1.2em; margin-right:2em}
	#liste2 li {display:block}
	#liste2 li.ret {display: block; margin: 0; clear: both}
	
	
#coordonnees {font-size: 2.7em; float: left; margin-top:1.2em}
	
#accrocheAcc h2 {font-size:3.2em}	
	#accrocheAcc a {font-size: 1.3em; padding: 1em 0; margin-right:1.5em; margin-top:0.5em}
	#accrocheAcc a.sansM {margin-right: 0}	
	
#accrocheProj h2 {font-size:3.2em}	
	#accrocheProj h1 {font-size: 1.3em; padding: 1em 0; margin-top:0.5em; margin-right: 5%; max-width: 400px}
	#accrocheProj h1 br {display: none}
	
.cont-intro01 { padding-top: 6em; padding-bottom: 3em; margin-left: 4.7%; float:none; width:90% }
	.cont-titre01 {font-size: 1.1em; padding-bottom:2em}
	.cont-intro {font-size:2.4em; line-height: 1.5em;}
.img01 {float: none; width:60%; display: block; margin-top:0em; margin-left: 4.7%}

#visite {width:100%; margin-left: auto; margin-right: auto; margin-top: 4em}
	#visite iframe {width:100%; border:none; border:0}
	
.part01 {margin-top:9em; padding-top:3.1em}
.texteGeant {font-size:4.3em; right:5%; letter-spacing: 0.35em; width:95%;}
.part01-img1 {width:85%; display: block; position: relative; z-index: 10}	
	
	
.texteG {width: 90.6%; margin-left: 4.7%; float: none; padding-top:6em}
.visuD {width: 90.6%; float:none; margin-left: 4.7%; padding-top:4em;}
.part01-img2 {width:35%; float: right}
.part01-img3 {width:65%}

.titre02-acc {font-size: 2em; }
.p-acc {font-size: 1.4em}
.servicesPlusInt {width: 100%; padding-bottom:0} .servicesPlusInt.full {width: 100%}
.depliA {font-size: 1.4em; }
	
.depliB {padding-top:0.8em; padding-bottom: 3em; font-size: 1em; line-height:1.8em;}
	.depliB p {font-size: 1.25em; }	
	
.visuG {width:30.3%; float:none; margin-left: 4.7%; margin-top:4em; }
.texteD {width: 90.6%; margin-left: 4.7%; float:none; margin-top:6em}

.visuCarreExt {width:100%}
.visuCarre {width:65%; margin-left: 35%; }
.visuCarreFlotant {width:22%;}
		
.part02 {margin-top:4em; padding-top:0em; padding-bottom:4em}
	.part01-img4 {width:40%; margin-left: 60%; margin-top: 0}
	
.visuCarre2 {width:59.06%; margin-left:0%}
.visuCarre2Flotant {width:20%;}
	.visuCarre2Flotant img {margin-top:1.5em}
	
.col3 {font-size: 1.1em}
#lignebas {margin-top:1.5em; margin-bottom:1.5em}		
	
.reseauxBas, #mentionsBas {float:none; display:block}
	#mentionsBas {margin-top:0.5em; font-size: 1.1em}

	

#intro-projets {padding-left:4.7%; margin-bottom:4em}	
.intro-projets02 { font-size:2.3em; margin-right: 4%}
	.intro-projets02 br {display: none}
	
.proj-compo01 {width: 90.6%; margin-left: 4.7%; margin-top: 4em}
.proj-compo01-img1 {width: 100%; float:none}
.proj-compo01-listeimg {width:100%; margin-left:0%; float:none; margin-top: 2em}
.proj-compo01-img2, .proj-compo01-img3, .proj-compo01-img4 {margin-bottom:0; float: left; margin-right:5%; width:30%}
	.proj-compo01-img4 {margin-right: 0}

.proj-compo01-img5 {width: 100%; margin-top:8em}

.proj-compo02 {width: 90.6%; margin-left: 4.7%; margin-top:8em}
.proj-compo02-img1 {width: 50%; margin-left:50%}  
	.proj-compo02-img2 {width: 50%; margin-left:0 }
		.proj-compo02-liste img {width:25%; margin-left:3%}
	

.proj-compo03 {width: 90.6%; margin-left: 4.7%; margin-top:8em}
.texteProj-img {width:50%; position:relative; bottom:unset;} 
.texteProj { width: 100%; margin:8em auto;}
	.texteProj-int {padding:0}
.projcentre {width:90.6%;}	

.proj-compo04 {font-size:1em}
.proj-compo04 {margin-top:8em; padding-top:6em;}
	.proj-texteGeant {font-size:3em}		

	
#Pagesuivante {height:600px}
.traitSuiv {left:4.7%}
.lienS-infos {left:9.4%; }
	.lienS-infos i {width:4.5em}
	.lienS-infos00 {font-size: 1.3em; }
	.lienS-infos01 {font-size: 3em;} 
	.lienS-infos02 {font-size: 1em; max-width: 400px; margin-right: 5%}
	.lienS-infos02 br {display: none}
.lienS-infosBT {font-size:1.2em}	
	
	
.IntroApropos {font-size:1em; padding-right: 5%}
	.intro-aproTitre { font-size:2.6em}
	.IntroApropos .trait {width:6.5em; height:2px}
	.IntroApropos br, .apropos-cont br, .apropos-cont2 br {display: none}
	.IntroApropos br.brsansmob, .apropos-cont br.brsansmob, .apropos-cont2 br.brsansmob {display:inline-block}
	
	#IA0 {margin-top:1em} #IA1,  #IA2, #IA3 {margin-top:0em}
.apropos-cont, .apropos-cont2 {margin-left:12%; padding-top:4em; font-size: 1.45em; padding-bottom: 4em; padding-right: 5%}			
	.apropos-visu { width:90%;}
	
	
	
.apropos-contpar2  {float:none}
.aproDecale {margin-left:0}

.contpar2G {width:90.6%; margin-left:4.7%;/*margin-top: 5em*/ margin-bottom:8em}
.contpar2GmargePlus {margin-top:5em}
.contpar2D {margin-left:4.7%; width:90.6%; margin-top:0; margin-bottom:8em;}
.contpar2DmargePlus {margin-top:0}
.apropos-contpar2 b.aproDecaleIMG {width:100%}
.apropos-contpar2 span {margin-top: 2em; font-size: 1.4em; padding-right:3em}
	.apropos-contpar2 span i {width:2em; height: 1px}
.apropos-contpar2 strong {margin-top:0.7em; font-size: 2em}
	.apropos-contpar2 strong br {display: none}
.apropos-contpar2 p {margin-top:1.2em; font-size: 1.25em;}

.contpar2Blanc span {color:#fff} .contpar2Blanc strong {color:#fff} .contpar2Blanc p {color:#b8b8b8}
.contpar2Noir span {color:#000} .contpar2Noir strong {color:#000} .contpar2Noir p {color:#747474}

.contpar2G p {margin-right:0%}
.contpar2D p {margin-right:0%}
.paddpourMarqueA {padding-bottom:2em}
.paddpourMarqueB {padding-bottom:2em}
.paddpourMarqueC {padding-bottom:1em}

.apropos-contact {padding-bottom:2em}	
#carte {width:95%; }
#infoscarte { display: none}
#facade {border:1px solid #fff; width: 30%; top:5px; right:5px }
	#rond {width:16px; height:16px; margin-top:-8px; margin-left:-8px;}
.paddcarte {padding-bottom: 4em}	
	
}


@media screen and (max-width:340px) {
	
}