@charset "utf-8";
/* CSS Document */
body {
	margin: 0;
    padding: 0;
	position:absolute;
	background-color:#E4EFEF;
}
p{
	font-family: 'Archivo Narrow', sans-serif;
	text-align:center;
	font-size:14px;
	color:#FFFFFF;
	margin-top:65px;
	padding:0px;
}
.bold{
	font-weight:bold;
	font-size:13px;
}
h1{
	font-family: 'Pattaya', sans-serif;
	text-align:center;
	font-weight:normal;
	font-size:25px;
	margin:0px;
	padding:0px;
}
#global{
	width:100%;
	text-align:left;
}
#main{
	position:relative;
	padding-top:35px;
	box-shadow:8px -8px 7px 0px rgba(0, 0, 0, 0.3);
}
#header{
	background:url(../img/header.png) 0% 0 no-repeat fixed;
	position:fixed;
	height:104px;
	width: 800px;
	z-index:5;
	padding-left:164px;
}
#header_space{
	height:103px;
}
#menu{
	padding:0px;
	height:16px;
	width:800px;
	color:#2E6368;
	font-family: 'Pattaya', sans-serif;
	font-weight:300;
	margin-top:9px;
	text-align:center;
	overflow:hidden;
}
#menu a:link, #menu a:visited{
	color:#2E6368;
	text-decoration:none;
	font-family: 'Pattaya', sans-serif;
	line-height:13px;
	font-weight:normal;
	transition:all 0.5s;
}
#menu a:hover{
	color:#000000;
}
#titre{
	height:52px;
	width:800px;
	text-align:center;
	overflow:hidden;
	margin-top:-10px;
	font-family: 'Pathway Gothic One', sans-serif;
	font-size:22px;
	color:#E4EFEF;
	padding:0px;
	/*background-color:#0f0;*/
}
#soustitre{
	/*background-color:#f0f;*/
	width:300px;
	height:20px;
	padding:0px;
	margin:0px;
	padding-top:13px;
}
#soustitre p{
	text-align:left;
	margin-top:-19px;
	/*font-family: 'Ubuntu', sans-serif;*/
	font-family: 'Archivo Narrow', sans-serif;
	/*font-weight:bold;*/
	font-size:13px;
	color:#2E6368;
}
#conteneur{
	width: 800px;
	height: 80px;
	margin-left:164px;
	overflow: hidden;
	transition:all 0.5s;
}
#conteneur:hover,#conteneur.on{
	height:120px;
}
#conteneur_video{
	width: 800px;
	height: 450px;
	margin-left:164px;
	margin-top:29px;
	overflow: hidden;
}
#vignette{
	width: 800px;
	height: 120px;
	position:absolute;
}
#legende{
	width: 800px;
	height: 120px;
	position:relative;
	color:rgba( 255, 255, 255, 0);
	text-align:center;
	background:rgba( 0, 0, 0, 0) url(../img/plus.png) 50% 0 no-repeat;
	background-position:50% 80px;
	background-size:20px 20px;
	transition:all 0.5s;
	padding-top:5px;
	box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.4) inset;
}
#legende:hover{
	opacity:1;
	background: rgba( 0, 0, 0, 0.3) url(../img/plus.png) 50% 0 no-repeat;
	background-position:50% 55%;
	color:rgba( 255, 255, 255, 1);
	padding-top:0px;
	box-shadow:2px 2px 2px 0px rgba(0, 0, 0, 0.4) inset;
	background-size:40px 40px;
}
#footer{
	width: 800px;
	height: 150px;
	margin-left:164px;
	position:absolute;
	background-color:#E4EFEF;
	/*background-color:#00FF00;*/
	box-shadow:8px -8px 7px 0px rgba(0, 0, 0, 0.3);
}
#footer p{
	color:#2E6368;
	text-align:left;
	font-size:13px;
	margin-top:20px;
	margin-right:50px;
}
#plus{
	width:38px;
	height:38px;
	position:relative;
	text-align:center;
	margin-left: auto;
	margin-right: auto;
	padding-top:13px;
	padding-bottom:13px;
	background:url(../img/plus.png) 50% 0 no-repeat;
	background-position:center;
	background-size:90%;
	transition:all 0.5s;
	opacity:0.8;
}
#plus:hover{
	-webkit-transform: rotate(90deg);
  	-moz-transform: rotate(90deg);
  	-ms-transform: rotate(90deg);
  	-o-transform: rotate(90deg);
  	transform: rotate(90deg);
	background-size:100%;
	opacity:1;
}
#pastille_reel, #pastille_24 ,#pastille_23 ,#pastille_22 ,#pastille_18 ,#pastille_16 ,#pastille_15, #pastille_14, #pastille_13, #pastille_12, #pastille_11, #pastille_10, #pastille_09, #pastille_08, #pastille_07, #pastille_06, #pastille_05{
	height:170px;
	width:156px;
	position: absolute;
	float:left;
	z-index:10;
	margin-top:0px;
	/*overflow:visible;*/
	/*vertical-align:top;*/
}
#bg{
	width:100%;
	height:100%;
	position:absolute;
	/*float:left;*/
	background:url(../images/BG_test.jpg) 0% 0 repeat;
	z-index:-10px;
}
#bouton_space{
	height:80px;
	text-align:center;
	margin:0px;
	position: relative;
}
#bouton_clic{
	height:100px;
	width:40px;
	margin-left:104px;
}