#document {
	width:100%;
	margin : 0;
	padding : 0;
	text-align: left;
	position:absolute;
}

a { /*-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;*/
	font-weight: 400; }
			
a:link          { color: #FFF; text-decoration: none }
a:visited         { color:#FFF; text-decoration: none }
a:hover       { color: #FFF; text-decoration: underline }

strong { font-weight:700;}

#article img { border: 0; vertical-align: middle }

input, select, textarea { color: #333333; font-size: 18px; font-weight: 300; font-family: 'Alegreya Sans SC', sans-serif; background-color: #FAFAFA; margin: 1% 0; padding: 1%; border: solid 1px #CECECE; border-radius:0px;

} 

body {
	font-family: 'Alegreya Sans', sans-serif;
	font-size: 12px;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #FFF;
	background:#1d0c31;
}

hr { background:#83bb9f; height:5px; }

#haut { height: 70px; border-bottom:1px solid #3da7bf; background: #fff; z-index:1010; }
#logo { width:220px; }

table, tr, td { }
td { padding: 10px }

.move { transition:all 1s; opacity:0;}
.moving { opacity:1; }

#menu { text-align:center; }
#menu_article { position:relative; float:left; width:100%; }
#zone_langue { position:relative; top:-30px; left:10%; }
#zone_langue ul { padding:0; margin:0; list-style-type:none;}
#zone_langue ul li { display:inline-block; }
#zone_langue ul li a, #zone_langue ul li a:link, #zone_langue ul li a:visited{ font-family: 'Alegreya Sans SC', sans-serif; margin: 0; display:inline-block; text-decoration:none; /* premier rang */ 	/*AJOUTER LA POLICE WEB FONT DU TEXTE MENU a */
									color: #83bb9f; text-align:left; font-size: 17px; padding:0 6px;						/*AJOUTER LA COULEUR DU TEXTE MENU a */
									height:35px;line-height:35px;overflow:hidden; font-weight:300;  }

#zone_langue ul li a:hover, #zone_langue ul li a.on { background: #83bb9f; color: #091a3c;}

#zone_langue_article { position:absolute; right:0; top:20px; }
#zone_langue_article ul { padding:0; margin:0; list-style-type:none;}
#zone_langue_article ul li { display:inline-block; }
#zone_langue_article ul li a, #zone_langue_article ul li a:link, #zone_langue_article ul li a:visited{ font-family: 'Alegreya Sans SC', sans-serif; margin: 0; display:inline-block; text-decoration:none; /* premier rang */ 	/*AJOUTER LA POLICE WEB FONT DU TEXTE MENU a */
									color: #FFF; text-align:left; font-size: 17px; padding:0 6px;						/*AJOUTER LA COULEUR DU TEXTE MENU a */
									height:35px;line-height:35px;overflow:hidden; font-weight:300;  }
#zone_langue_article ul li a:hover, #zone_langue_article ul li a.on { color: #091a3c;}

.centre { float:left; width:100%; background :#091a3c;}
.contenu { display:table; width:1024px; margin:0 auto;  }

/* TABLE SYSTEM*/ 

#main .contenu, .encart .contenu, #bas .contenu { width:100%; display:table; }
.encart .contenu { height:600px; }
#main .zone_gauche { position:relative; width:66%; vertical-align:middle; display:table-cell; }
#main .zone_droite { position:relative; width:33%; text-align:left; vertical-align:middle; display:table-cell; }

.zone_realisation { width:66%; vertical-align:middle; display:table-cell; }
.zone_gauche { position:relative; width:66%; vertical-align:middle; display:table-cell; }
.zone_droite { position:relative; width:33%; text-align:left; vertical-align:middle; display:table-cell; }

.lien_categorie { font-size:25px; width:33%; vertical-align:middle; display:table-cell; }
.lien_categorie a:hover, .lien_categorie a:link, .lien_categorie a:visited { text-decoration:none;}

/* CONTENU */
#slider { float:left; position:relative; width:100%; height:300px; margin-top:0px; background:#ef7f01;}
#cache { height: 235px; width: 100%; background-color: #ef7f01; z-index: 10; }
#cache:before{position:absolute; top:0%; left:0%; width:100%; height:100%; content:' '; z-index:1001;}
#slider:after { position:absolute; top:50%; left:50%; width:450px; height:260px; margin:-170px 0 0 -225px;content:' ';transform:scale(0.8,0.8);z-index:1002;}
#slider #caption { position:absolute; top:50%; width:100%; margin-top:80px; font-size:30px; font-weight:200; text-align:center; color:#FFF; font-family: 'Alegreya Sans SC', sans-serif; z-index:1003;}

#article { padding-bottom:50px; }

.arrow_down {
	position:absolute;
	bottom:0;
	left:calc(50% - 20px);
    width: 40px;
    line-height: 40px;
	margin:20px 0;
	font-size:20px;
	text-align:center;
	color:#83bb9f;
	border : 1px solid #83bb9f;
    border-radius: 50%;
	z-index: 1003;
}

.contenu table, tr, td { font-size: 100%; border-spacing : 0; border-collapse : collapse; }
.contenu table { width: 100%; cellpadding: 10px; background: rgba(0,0,0,0.0) }
.contenu td { 
	font-family: 'Roboto', sans-serif;
	vertical-align: top;
}

.contenu h1 {
	font-family: 'Alegreya Sans SC', sans-serif; 
	color: #83bb9f; font-size: 300%;
	font-weight: 200; margin: 10px 0; 
	position:relative;
}

.contenu h2 {
	font-family: 'Alegreya Sans SC', sans-serif; color: #c5a454; font-size: 220%;
	font-weight: 300; margin: 10px 0; 
	position:relative;
}

.contenu h3 {
	font-family: 'Alegreya Sans SC', sans-serif; color: #ac2b57; font-size: 170%;
	font-weight: 300; margin: 10px 0; 
}

.contenu h4 {
	font-family: 'Alegreya Sans SC', sans-serif; color: #FFF; font-size: 140%;
	font-weight: 400; margin: 5px 0 5px 0; 
}

.contenu h5 {
	font-family: 'Alegreya Sans SC', sans-serif; color: #FFF; font-size: 125%;
	font-weight: 300; margin: 5px 0 5px 0; 
}

.contenu p {
	font-size: 140%;
	font-weight: 300;
	line-height: 24px;
	padding: 0;
	text-align: left;
	color:#FFF;
	font-family:"Alegreya Sans", sans-serif ;
}

.contenu li {
	font-size: 125%;
	font-weight: 300;
	line-height: 24px;
}

.contenu p a:link        { color: #3ea7bf; text-decoration: none; }
.contenu p a:visited     { color: #3ea7bf; text-decoration: underline; }
.contenu p a:hover       { text-decoration: underline; color: #ef7f01; }


.contenu a.lien_cta:link, .contenu a.lien_cta:visited { font-family: 'Alegreya Sans SC', sans-serif; font-size: 110%; padding: 5px 10px; border: 1px solid #FFF;  color: #FFF; transition:all 1s; display:inline; }
.contenu a.lien_cta:hover { text-decoration: none; background-color: #FFF; color: #091a3c }

.contenu a.lien_cta2:link, .contenu a.lien_cta2:visited  { text-decoration: none; font-size: 110%; color: #FFF; font-weight: 500; font-family: 'Alegreya Sans SC', sans-serif; padding: 5px 10px; background-color: #83bb9f; transition:all 1s; display:inline;}
.contenu a.lien_cta2:hover { text-decoration: none; font-size: 110%; color: #83bb9f; font-weight: 500; font-family: 'Alegreya Sans SC', sans-serif; padding: 5px 10px; background-color: #FFF }

#bas { float: left; background: #240d3e; color:#5ec2c1; z-index:1003;}
#bas .contenu { height:600px; }
#bas a { font-weight: 300; color: #5ec2c1; text-decoration: none; }
#bas a:visited { font-weight: 300; color: #5ec2c1; text-decoration: underline; }
#bas a:hover { font-weight: 400; color: #5ec2c1;text-decoration: underline; }
#bas p { font-family: 'Alegreya Sans SC', sans-serif; font-size: 115%; font-weight: 300; color: #5ec2c1 }


#plan {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	transition:all 1s;
}
#plan:hover {
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
}

#plan:before {
    content: ' ';
    width: 30%;
    background: #d9882a;
    height: 6px;
    position: absolute;
    left: 50%;
    margin-left: -15%;
}

/* REALISATION */

/* PAGE ACCUEIL */
.encart .realisation { float:left; width:15%; margin:2.5%; transition:all 1s ease-in-out }

.encart .realisation .image {
    width: 100%;
    padding-top: 100%;
    border-radius: 50%;
    border: 2px solid transparent;
	transition:all 0.3s ease-in-out;
	box-sizing: border-box;
}
.encart .realisation:hover .image {
	transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1); /* IE 9 */
	
	border: 2px solid #FFF;;
}
.encart .realisation .titre {
	padding:30px 0 20px 0;
	height:50px;
	line-height:20px;
    text-align: center;
    font-size: 150%;
}
 /* SUR PAGE REALISATION */
#realisations { background:#83bb9f; }
#realisations .realisation { float:left; width:15%; margin:2.5%; transition:all 1s ease-in-out; }
#realisations .realisation:hover {
	transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1); /* IE 9 */
}
#realisations .realisation .image {
    width: 100%;
    padding-top: 100%;
    border-radius: 50%;
    border: 2px solid transparent;
	transition:all 0.3s ease-in-out;
	box-sizing: border-box;
}
#realisations .realisation:hover .image {
	border: 2px solid #FFF;;
}
#realisations .realisation .titre {
	padding:40px 0 20px 0;
	height:50px;
	line-height:25px;
	text-align: center;
    font-size: 160%;
	border-bottom:2px solid #FFF;
}
#realisations .realisation .sstitre {
	padding:20px 0;
	height:70px;
	line-height:25px;
	font-size: 17px;
    text-align: center;
	color:#135b66;
	border-bottom:2px solid #FFF;
}
#realisations .realisation .image_lieu {
    margin:20px 0; 
	width: 100%;
    padding-top: 100%;
	display:none;
}

/* REALISATION UNIT */

#retour {
	color:#dad13d; 
	text-align:right;
	font-size:15px;
	border-bottom:1px solid #dad13d;
	font-family: 'Alegreya Sans', sans-serif;
	float: left;
    width: 35%;
    margin: 20px 2.5%;
}
#retour a:link, #retour a:visited {
	color:#dad13d; 
}
#retour a:hover {
	color:#dad13d; text-decoration:none;
}

#colonneGauche { 
	float:left;
	clear:both;
	width:35%;
	padding:50px 2.5%;
}
#colonneGauche .titre {
	color:#FFF; 
	text-align:right;
	font-size:30px;
}
#colonneGauche .sstitre {
	color:#dad13d; 
	text-align:right;
	font-size:25px;
	border-bottom:1px solid #dad13d;
}
#colonneGauche .lieu {
	color:#6e81a7; 
	text-align:right;
	font-size:13px;
	border-top:1px solid #dad13d;
	border-bottom:1px solid #dad13d;
	font-family: 'Alegreya Sans', sans-serif;
	margin: 30px 0;
    padding: 30px 0;
}
#colonneGauche .vignette {
	text-align:right;
}
#colonneGauche .vignette img {
	width:50%;
	height:auto;
}

#photos { 
	float:left;
	width:55%;
	padding:50px 2.5%;
}
#photos .photo_principale img{
	outline : 5px solid #FFF;
}
#photos .photo_secondaire{
	float:left;
	width:100%;
	margin:10px 0;
}
#photos .photo_realisation {
	float:left;
	outline : 5px solid #FFF;
	margin:2%;
}
#photos .photo_realisation.pano {
	width:calc( 47% - 10px );
	padding-top:27.6%;
}
#photos .photo_realisation.portrait {
	width:calc( 47% - 10px );
	padding-top:90%;
}