@import url("reset.css");
@import url("menu.css");
@import url("footer.css");
@import url("jquery-ui.css");
@import url("messi.min.css");
@import url("../webfonts/DINMd/stylesheet.css");
@import url("../webfonts/DINLight/stylesheet.css");
@import url("../webfonts/plastique/stylesheet.css");
@import url("../webfonts/dymofontinvers/stylesheet.css");
@import url("../webfonts/embosst1/stylesheet.css");
@import url("../webfonts/dymo/stylesheet.css");
@import url("../webfonts/plastique/stylesheet.css");
@import url("../webfonts/good-foot/stylesheet.css");
@import url("../webfonts/daniel/stylesheet.css");
@import url("../webfonts/courier_prime/stylesheet.css");
@import url("../webfonts/texgyrecursor/stylesheet.css");
body {
	background-repeat:no-repeat;
}
#content
{
	width: 100%;
	height: 100%;
	text-align: center;
	z-index: -99;
/*background: #e3e7ea;*/
/*background: #262425;*/
}
#video_index{
	z-index: 10;
	margin-right: auto;
	margin-left: auto;

	width: 40%;	/*margin-top: 2px;
	display:none;*/

}
#video_team{
	width: 80%;
	z-index: -1;
	margin-left: auto;
	margin-right: auto;
}
#video_job{
	width: 80%;
	z-index: -1;
	margin-left:auto;
	margin-right:auto;
	margin-top: 2px;
}
#video_histoire{
	/*width: 80%;*/
	margin-left:auto;
	margin-right:auto;
	margin-top: 2px;
}
#intro{
	position: absolute;
	left:calc(50% - 300px);
	width: 600px;
	height: 340px;
	background-image:url(../img/page_presentation_site_600x340.jpg);
	z-index: 10;
	top: 148px;
}
#derniere_realisation{
	float:left;
	width: 30vw;
	height:30vw;
	border:solid;
}
#realisation{
	width: auto;
	height: auto;
	margin:0 auto;
	float: right;
	margin-right: 4vw;
}
#realisation li{
	display:inline;
}
#realisation ul{
	width:auto;
	margin:auto;
	list-style: none;
}
#realisation1{
	width: 100%;
	height: 100%;
}
#realisation1 li{
	display:block;
	float: left;
}
#realisation1 ul{
	width: 100%;
	margin: auto;
	float: left;
}
.format{
	width: 10vw;
	height: 10vw;
}
.format1{
	width: 150px;
	height: 150px;
}
.gauche{
	width: 150px;
	float: left;
	margin-left: 10px;
	margin-top: 100px;
}
.droite{
	width: 150px;
	float: right;
	margin-right: 10px;
	margin-top: 100px;
}
.centre{
	margin-left: auto;
	margin-right: auto;
	margin-top: 100px;
	position:fixed;
}
.page_contact{
	width:100%;
	font-family:DINMd;
}
.coord_contact{

	text-align: left;
	position: absolute;
	z-index: 99;
	width: 24vw;
	background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.95);
	height: auto;
	border: 1px solid #000000;
	left: 1vw;
	top: 15%;
	-webkit-box-shadow:		0px 0px 10px #000;
/*-moz-box-shadow:		0px 0px 10px #000;*/
-o-box-shadow:			0px 0px 10px #000;
-ms-box-shadow:			0px 0px 10px #000;
		box-shadow:		0px 0px 10px #000;
}
.photo_contact{
	display: inline-block;
	text-align: left;
	position: absolute;
	z-index: 99;
	width: 60vw;
	background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.95);
	height: 35vw;
	border:none;
	right:2%;
	top: 15%;
}
/*.mathilde{position: absolute;width:150px;height:180px; top:40px; left:40px;}*/
.mathilde{position: absolute;width:10vw;height:12vw; top:2vw; left:2vw;}
.valerie{position: absolute;width:10vw;height:12vw; top:2vw; left:14vw;}
.sandrine{position: absolute;width:10vw;height:12vw; top:2vw; left:26vw;}
.aurelie{position: absolute;width:10vw;height:12vw; top:2vw; left:38vw;}
.jef{position: absolute;width:10vw;height:12vw; top:16vw; left:2vw;}
.jp{position: absolute;width:10vw;height:12vw; top:16vw; left:14vw;}
.katy{position: absolute;width:10vw;height:12vw; top:16vw; left:26vw;}

/*-ms-transform:rotate(-5deg); /* Internet Explorer */
/*-moz-transform:rotate(-5deg); /* Firefox */
/*-webkit-transform:rotate(-5deg); /* Safari et Chrome */ 
/*-o-transform:rotate(-5deg); /* Opera */
.poster_siege{position: absolute;top:0px;left:0px;width:10vw;height:12vw;}
.poster_agence{position: absolute;top:0px;left:0px;width:10vw;height:12vw;}
#anim{
	top: 60px;
	position: absolute;
	left: 60px;
}
.anim_siege{opacity:0;}
.anim_agence{opacity:0;}
.contact_mail {
	display: inline-block;
	font-weight: bold;
	font-size: 1.1vw;
	margin-top: 0.5em;
	vertical-align: top;
	color: rgba(0,0,0,1.00);
}
.contact_mail:hover {
	color:rgba(211,208,208,1.00);
}
.siege{

	width: 15vw;
	margin-left: 30px;
	float: left;
	color: rgba(0,0,0,1.00);
	height: auto;
	font-size:1.1vw;
}
.titre{
	font-size: 1.2vw;
}
.agence{
	width: 15vw;
	margin-left: 30px;
	float: left;
	color: rgba(0,0,0,1.00);
	height: auto;
	font-size: 1.1vw;
}
.mail{
	width: 24vw;
	margin-left: 25px;
	margin-top: 25px;
}

.titre_photos{
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	position: absolute;
	height: auto;
	padding-top: 10px;
	color: #000000;
	font-family: DINMd;
}
.legende_photos{
	text-align:right;
	margin-right: auto;
	margin-left: auto;
	position: absolute;
	height: auto;
	padding-top: 10px;
	color: #000000;
	font-family: DINMd;
	margin-top: 46px;
}
a:link{color:#000000;}
/*-----css journal acceuil_next.php------------*/
.acceuil_journal{
	position:absolute;
	top:100px;
	width: 70%;
	height: 70%;
}
.container {
	width: 90%;
	height:70%;
	background-color: #FFFFFF;
	margin: 0 auto;
}
.haut {
	/*height:90px;*/
}
.edition{
	text-align: right;
	font-size: 0.5rem;
}
.urbain{
	height:70px;
	border-style:solid;
	border-color:#000 transparent #000 transparent;
	border-width:3px 0px 1px 0px;
	text-align: right;
	font-size: 2.5vw;
}
.pict{
	float: left;
	background-color: #E4E4E4;
	width: 4vw;
	height: 4vw;
	max-height:40px;
	max-width:40px;
	margin-left: 1vw;
	margin-top: 5px;
}
.sidebar1, .sidebar2{
	/*height: 300px;*/
	height: 35vh;
	float: left;
	width: 30%;
	background-color:#ffffff;
	border: #000000;
	overflow: hidden;
}
.sidebar1 h1, .sidebar2 h1, .bas1 h1, .bas2 h1{
	padding-top:3px;
	padding-left: 8px;
	font-size: 1.5vw;
	color:#FC0221;
}
.sidebar1 p, .sidebar2 p{
	padding-top: 3px;
	padding-left: 8px;
	width: 45%;
	font-size: 0.5vw;
	line-height: 0.6vw;
	float: left;
	text-align: justify;
	font-family: serif;
}

.milieu {width: 40%;float: left;}
.bas {
	height:25vh;
	border-style:solid;
	border-color:#000 transparent transparent transparent;
	border-width:1px 0px 0px 0px;
	background-color: #ffffff;
	position: relative;/* donne hasLayout à IE6 de façon à permettre un effacement correct */
	clear: both; /* cette propriété d'effacement force le .container à comprendre où se terminent les colonnes et à les contenir */
	overflow:hidden;
}
.bas1{
	float: left;
	width:65%;
}
.bas2{
	float: left;
	width:35%;
}
.bas1 p, .bas2 p{
	font-family: serif;
	padding-top:3px;
	padding-left:8px;
	font-size: 0.5vw;
	line-height:0.6vw;
	text-align: justify;
}
.keyword{color:#FC0221;font-size:0.5vw;}
.kw_vitrine{color:#FC0221;}
/*----------------------------------------------------------*/