/* CSS Document */

	@font-face {
		font-family: 'Montserrat';
		@import : url('https://fonts.googleapis.com/css?family=Montserrat') ;
		font-weight:100 200 300 400 500 600 700 800 900;
		font-style:normal;
	}
	
	
	
	@font-face	{
		font-family: couture-bld;
		src: url('fonts/couture-bld.otf');
	}
	
/************************************************************************************
 * Light Box 2
 ************************************************************************************/
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: 100%; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 50% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 50% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #ccc; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: normal;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 141px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 100; width: 100%; height: 500px; background-color: #EEE; }


/************************************************************************************
 * Site
 ************************************************************************************/
 
 	a	{
		text-decoration:none;
		color: rgba(0,190,235,1);
		}
	
	a:hover	{
		text-decoration:underline;
	}
	
	a:visited	{
		color: rgba(153,102,153,1);
	}
	
	sup	{
	  position: relative;
	  font-size:0.7em;
	  vertical-align: baseline;
	  top:-0.5em;
	  line-height:1em;
	}
	
/********************
BODY
********************/

	body	{
		font-size:100%;
		width:100%; 
		height:auto;
		-moz-background-size: auto 100%;           /* Gecko 1.9.2 (Firefox 3.6) */
        -o-background-size: auto 100%;           /* Opera 9.5 */
   		-webkit-background-size: auto 100%;           /* Safari 3.0 */
        background-size: auto 100%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs */
	}
	
	@media screen and (max-width: 800px)	{
		body	{ 
			-moz-background-size: cover;           /* Gecko 1.9.2 (Firefox 3.6) */
			-o-background-size: cover;           /* Opera 9.5 */
			-webkit-background-size: cover;           /* Safari 3.0 */
			background-size: cover;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs */
		}
	}
	
	body#accueil	{
		overflow: scroll;
		background:url(images/bg/home-grue2.jpg) no-repeat top center fixed; 
		-moz-background-size: auto 100%;           /* Gecko 1.9.2 (Firefox 3.6) */
        -o-background-size: auto 100%;           /* Opera 9.5 */
   		-webkit-background-size: auto 100%;           /* Safari 3.0 */
        background-size: auto 100%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs */
	}
	
	
	@media screen and (max-width: 800px)	{
		body#accueil	{		
			background:url(images/bg/home-grue2.jpg) no-repeat top center fixed; 
			-moz-background-size: auto 100%;           /* Gecko 1.9.2 (Firefox 3.6) */
			-o-background-size:  auto 100%;           /* Opera 9.5 */
			-webkit-background-size:  auto 100%;           /* Safari 3.0 */
			background-size:  auto 100%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs*/ 
		}
	}
	
	body#real	{
		
		background:url(images/bg/home-wip-1B.jpg) no-repeat top center fixed;
	}
	
	body#contact	{
		background:url(images/bg/bg-contact2.jpg) no-repeat top center fixed;
		-moz-background-size: 100% auto;           /* Gecko 1.9.2 (Firefox 3.6) */
        -o-background-size: 100% auto;           /* Opera 9.5 */
   		-webkit-background-size: 100% auto;           /* Safari 3.0 */
        background-size: 100% auto;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs */
	}
	
	
	@media screen and (max-width: 800px)	{
		body#contact	{
		background:url(images/bg/bg-contact2.jpg) no-repeat top center fixed;
		-moz-background-size: auto 80%;           /* Gecko 1.9.2 (Firefox 3.6) */
        -o-background-size: auto 80%;           /* Opera 9.5 */
   		-webkit-background-size: auto 80%;           /* Safari 3.0 */
        background-size: auto 80%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs */	
		}
	}
	
	body#archi	{
		overflow:auto;
		background:url(images/bg/bg-archi.jpg) no-repeat top center fixed;
	}
	
	body#mission	{
		
		background:url(images/bg/home-wip-3A.jpg) no-repeat top center fixed;
	}
	
	@media screen and (max-width: 800px)	{
		body#mission	{		
			background:url(images/bg/home-wip-3B.jpg) no-repeat top center fixed; 
			-moz-background-size: auto 150%;           /* Gecko 1.9.2 (Firefox 3.6) */
			-o-background-size:  auto 150%;           /* Opera 9.5 */
			-webkit-background-size:  auto 150%;           /* Safari 3.0 */
			background-size:  auto 150%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs*/ 
		}
	}
	
	body#profil	{
		background:url(images/bg/bg-profil10.jpg) no-repeat top center fixed;
		-moz-background-size: auto 82%;           /* Gecko 1.9.2 (Firefox 3.6) */
        -o-background-size: auto 82%;           /* Opera 9.5 */
   		-webkit-background-size: auto 82%;           /* Safari 3.0 */
        background-size: auto 82%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs */
	}
	
	@media screen and (max-width: 800px)	{
		body#profil	{		
			background:url(images/bg/bg-profil10.jpg) no-repeat top center fixed; 
			-moz-background-size: 250% auto;           /* Gecko 1.9.2 (Firefox 3.6) */
			-o-background-size:  250% auto;           /* Opera 9.5 */
			-webkit-background-size:  250% auto;           /* Safari 3.0 */
			background-size:  250% auto;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs*/ 
		}
	}
	
	body#presta	{
		background:url(images/bg/presta3.jpg) no-repeat top center fixed; 
			-moz-background-size: 100%  auto ;           /* Gecko 1.9.2 (Firefox 3.6) */
			-o-background-size:  100%  auto ;           /* Opera 9.5 */
			-webkit-background-size:  100%  auto ;           /* Safari 3.0 */
			background-size:100%  auto ;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs*/ 
	}
	
	
	@media screen and (max-width: 800px)	{
		body#presta	{		
			background:url(images/bg/presta3.jpg) no-repeat top center fixed; 
			-moz-background-size: auto 80%;           /* Gecko 1.9.2 (Firefox 3.6) */
			-o-background-size:  auto 80%;           /* Opera 9.5 */
			-webkit-background-size:  auto 80%;           /* Safari 3.0 */
			background-size:  auto 80%;           /* Gecko 2.0 (Firefox 4.0) et les autres navigateurs*/ 
		}
	}
	
/********************
CONTENANT
********************/
	
	div.contenant	{
		width:100%;
		height: auto;
		position:absolute;
		z-index: 100;
		display:bloc;
		overflow: visible;
	}
	
	
	@media screen and (max-width: 800px)	{
		div.contenant	{
			background-position: top center;
			background-size: 200%;
		}
	}
	
	img.logo-home	{
		display:block;
		width:100%;
		margin-bottom:20px;
	}
	
	p.home-name	{
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		font-weight: 600;
		color:rgba(255,255,255,1);
		font-size:1em;
		text-transform:uppercase;
		letter-spacing:0.5em;
		line-height:1.2em;
		margin-bottom:30px;
	}
	
	p.home-name	span#archi	{
		font-size:0.6em;
		font-weight:400;
		letter-spacing: 0.3em;
	}
	
	p.words	{
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		font-weight: 500;
		color:rgba(255,255,255,1);
		font-size:1.4em;
		text-transform:uppercase;
		letter-spacing:0.2em;
		line-height:1em;
	}
	

/*--------------
TITRE PAGE
---------------*/
	
	div.titre-page	{
		display:bloc;
		position:relative;
		width:100%;
		max-width:1280px;
		height:40vh;
		max-height:500px;
		z-index: 100;
		background-color:transparent;
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		font-weight: 700;
		color:rgba(255,255,255,0.9);
		font-size:1.7vh;
		line-height:4.23em;
		letter-spacing:0.1em;
		text-transform:uppercase;
	}
	
	@media screen and (max-width: 1280px)	{
		div.titre-page	{
			height:60vh;
			font-size:2.5vh;
			line-height:4em;
		}
	}
	
	@media screen and (max-width: 800px)	{
		div.titre-page	{
			height:50vh;
			font-size:2vh;
			line-height:4em;
		}
	}
	
	div.titre-page#accueil	{
		font-size:1.3vh;
		line-height:4.3em;
		font-weight:100;
		letter-spacing:0.5em;
	}
	
	@media screen and (max-width: 800px)	{
		div.titre-page#accueil	{
			font-size:1.3vh;
			line-height:4.3em;
		}
	}
	
	p.H1	{ 
		display:block; 
		position:absolute; 
		bottom:0;
		margin:0 45px;
		width:90%;
		font-size: 6em;
		-webkit-bottom:-1px;
	}
	
	@media screen and (max-width: 800px)	{
		p.H1	{
			max-width:400px;
			margin-left:18px;
		}
	}
	
	p.titre2#accueil	{ 
		bottom:0;
	}
	
	
/*--------------
CONTENU PAGE
---------------*/
	
	div.contenu-page	{
		display:bloc;
		position:relative;
		width:100%;
		max-width:1280px;
		height: auto;
		z-index: 100;
		overflow: visible;
		margin-top: 0;
		background-color: rgba(255,255,255,0.93);
		padding:30px 0 0 0;
		
	}
	
	div.contenu-page#accueil	{
		width:100%;
		max-width:878px;
		height: auto;
		background: none;
		padding:30px 0px;
		border-top: 1px solid rgba(255,255,255,0.6);
		margin-right:400px;
	}
	
	@media screen and (max-width: 800px)	{
		div.contenu-page#accueil	{
			border-left: none;
			border-right: none;
			border-bottom: none;
			border-top: 1px solid rgba(255,255,255,0.6);
		}
	}
	
	p.titre1	{
		display:block;
		width:60%;
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		font-weight: 600;
		color:rgba(51,51,51,1);
		font-size:1em;
		line-height: 1em;
		text-transform:uppercase;
		/*letter-spacing:-0.02em;*/
		margin: 0 0 20px 50px;
	}
	
	@media screen and (max-width: 800px)	{
		p.titre1	{
			width:80%;
			max-width:450px;
			margin: 0 0 20px 20px;
			font-size:1em;
		}
	}
	
	p.titre1#accueil	{
		color:rgba(255,255,255,1);
	}
	
	p.parag-titre1	{
		display:block;
		width:70%;
		margin: 50px 0 20px 50px;
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		text-transform:uppercase;
		font-weight:300;
		font-size:1.5em;
		letter-spacing:0.1em;
		color: rgba(0,0,0,1);
		line-height:1.2em;
	}
	
	@media screen and (max-width: 800px)	{
		p.parag-titre1	{
			margin-left:20px;
		}
	}
	
	p.parag-titre2	{
		display:block;
		width:70%;
		margin: 50px 0 20px 50px;
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		text-transform:uppercase;
		font-weight:400;
		font-size:1em;
		letter-spacing:0.1em;
		color: rgba(0,0,0,1);
		line-height:1.2em;
	}
	
	@media screen and (max-width: 800px)	{
		p.parag-titre2	{
			margin-left:20px;
		}
	}
	
	p.parag-titre	{
		display:block;
		width:80%;
		margin: 0 0 10px 50px;
		font-family: Montserrat, Verdana, Geneva, sans-serif;
		text-transform:uppercase;
		font-weight:200;
		font-size:1.5em;
		line-height:1em;
		letter-spacing:0.05em;
		color: rgba(0,0,0,1);
	}
	
	@media screen and (max-width: 800px)	{
		p.parag-titre	{
			margin-left:20px;
			font-size:1.3em;
			line-height:1em;
		}
	}
	
	span.parag-titre	{
		display:inline-block;
	}
	
	span.parag-titre#accueil	{
		display:inline;
		color:rgba(255,255,255,1);
		margin-top:20px;
		margin-right:10px;
	}
	
	span#couleur	{
		color: rgba(255,153,0,1);
	}
	
	.texte-courant	{
		display:block;
		width:60%;
		margin-left:50px;
		margin-bottom:20px;
		font-family: Montserrat, Verdana, Geneva, sans-serif;
		font-weight:300;
		font-size:1em;
		color:rgba(51,51,51,1);
		line-height:1.2em;
	}
	
	@media screen and (max-width: 800px)	{
		.texte-courant	{
			width:90%;
			max-width:450px;
			margin: 0 0 20px 20px;
		}
	}
	
	.texte-courant	em	{
		font-style:italic;
	}
	
	.texte-courant	strong	{
		font-weight:500;
	}
	
	li.texte-courant	{
		margin-left:60px;
		margin-bottom:10px;
	}
	
	p.texte-courant#mission	{
		margin-bottom:60px;
	}
	
	p.texte-courant#accueil	{
		width:80%;
		color:rgba(255,255,255,0.8);
		font-weight:200;
		margin-bottom:10px;
	}
	
	a.LirePlus	{
		font-weight:400;
		color: rgba(0,204,245,1);
		text-decoration: none;
		font-size:0.8em;
	}
	
	hr.separator	{
		display:block;
		clear:both;
		line-height:1px;
		max-width:1180px;
		margin: 0 50px 0 50px;
	}
	
	@media screen and (max-width: 800px)	{
		hr.separator	{
			margin: 0 20px 0 20px;
		}
	}
	
	span#tel1	{
		display:none;
	}
	
	p#tel2	{
		display:bloc;
	}
	
/*----------------
PAGE RÉALISATIONS
-----------------*/
	
	p.rubrique	{
		display:block;
		width:auto;
		font-family: 'Montserrat', sans-serif;
		font-weight: 600;
		color: rgba(255,130,0,1);
		font-size:1.2em;
		line-height: 1em;
		text-transform:uppercase;
		letter-spacing:0.1em;
		margin: 50px 0 20px 50px;
		/*border: 1px solid #333;*/
	}
	
	@media screen and (max-width: 800px)	{
		p.rubrique	{
			margin: 20px 0 20px 20px;
		}
	}
	
	p.sous-rubrique	{
		display:block;
		width:auto;
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		font-weight: 300;
		color: rgba(0,0,0,1);
		font-size:0.9em;
		line-height: 0.8em;
		text-transform:uppercase;
		letter-spacing:0.1em;
		margin: 20px 0 20px 50px;
		/*border: 1px solid #333;*/
	}
	
	@media screen and (max-width: 800px)	{
		p.sous-rubrique	{
			margin: 20px 0 20px 20px;
			font-size:1.0em;
		}
	}
	
	img.real	{
		display:block;
		margin: 50px 50px 20px 50px;
		width:85%;
		padding: 0 0;
		max-width: 1120px;
		height:auto;
	}
	
	@media screen and (max-width: 800px)	{
		img.real	{
			width:91%;
			margin: 20px 0 20px 20px;
		}
	}
	
	img.real#vertical	{
		width:91%;
		max-width:600px;
		height:auto;
	}
	
	p.legende-real	{
		display:block;
		width:95%;
		max-width:1000px;
		font-family: Montserrat, Arial, Helvetica, sans-serif;
		font-weight: 400;
		color:rgba(51,51,51,1);
		font-size:0.9em;
		line-height: 1.4em;
		margin: 20px 0 80px 50px;
		/*border: 1px solid #333;*/
	}
	
	@media screen and (max-width: 800px)	{
		p.legende-real	{
			width:90%;
			max-width:480px;
			margin: 20px 0 50px 20px;
		}
	}
	
	span.date	{
		display: inline;
		font-size: 1.1em;
		font-weight: 400;
		color: rgba(255,153,0,1);
		letter-spacing:0.05em;
		
	}
	
	span.client	{
		display:inline-block;
		font-size:1.1em;
		font-weight:700;
		color:rgba(255,255,255,1);
		background:rgba(102,102,102,1);
		padding: 3px 7px;
		margin-left:0px;
	}
	
	span.objet	{
		font-weight:800;
		text-transform:uppercase;
		letter-spacing:0.05em;
	}
	
/*****************
FOOTER
*****************/

	div.footer	{
		display:block;
		position:relative;
		width:100%;
		height:auto;
		margin-top:100px;
		padding: 5px 0 30px 0;
		/*background:rgba(240,240,240,0.6);*/
		border-top:1px dashed rgba(0,0,0,0.4);
	}

	div.footer#home	{
		margin-top:150px;
		border-top:1px dashed rgba(255,255,255,0.4);
	}
	
	p.footer	{
		font-family:Montserrat, Arial, Helvetica, sans-serif;
		font-size:0.7em;
		font-weight:300;
		line-height:1.2em;
		color:rgba(0,0,0,1);
		margin:30px 50px 0 50px;
	}
	
	@media screen and (max-width:800px)	{
		p.footer	{
			margin:20px;
		}
	}
	
	p.footer#home	{
		color:rgba(255,255,255,0.6)
	}
	
	a.footer	{
		margin-right:20px;
		margin-top:0;
		color: rgba(0,190,235,1);
	}