@font-face {
font-family: Futura;
src: url("fonts/futura.ttf");
}

html { margin:0px; position:relative; width:100%; min-height:100%; }

body {
	margin:0px;
	font-family:Futura, Century Gothic;
	color:#58585a;
	min-height:100%;
	min-width:885px;
	padding-bottom:120px;
	background-repeat:repeat-y;
	background-color:#FFF;
	font-size:100%;
	line-height:1.3;
	}
	
.logo { z-index:999; margin-top:10px; }

#wrap {
	position:fixed;; 
	z-index:-1; 
	top:0; 
	left:0; 
	background-color:#FFF;
}
#wrap img.bgfade{
	position:absolute;
	top:0;
	display:none;
	min-width:100%;
	min-height:100%;
	z-index:-1;
}

.mille { width:85%; margin:0px auto; padding:0px; }
.titre { display:block; width:90%; font-weight:bold; margin:100px auto 40px auto; font-size:220%; color:#000; text-align:center; }

#header {
	display:block;
	position:relative;
	margin:10px auto;
	padding:0px;
	width:85%;
	height:50px;
	list-style-type:none;
	z-index:999;
	opacity:0.9;
}
#header li { display:inline-block; border-left:3px solid #000; border-top:3px solid #000; border-bottom:3px solid #000; float:left; width:16%; line-height:50px; height:50px; padding:0px; text-align:center; margin:0px; }
#header li:last-child { border-right:3px solid #000; }
#header li:hover { background:#000; transition-property: background; transition-duration: 1s; }
#header li:hover > a { color:#FFF; transition-property: color; transition-duration: 1s; }
#header a { color:#000; text-decoration:none; font-weight:bold; }
.mob { display:none; }
.col1 { float:left; width:63%; }
.col2 { margin:0px 0px 0px 2%; float:left; width:35%; }
.col1 p, .col2 p, .col2 table { text-align:justify; }
.col1 img { max-width:100%; }

#content {
	position:relative;
	width:80%;
	max-width:1350px;
	margin:20px auto;
	padding:0px;
	}
	
#colonne li { float:left; width:23%; margin-right:2%; list-style-type:none; }
#colonne img { width:100%; }

#colonne2 { margin:0px; padding:0px; }
#colonne2 li { display:inline-block; width:39%; vertical-align:top; font-size:95%; margin:0px 5%; padding:0px; list-style-type:none; }
#colonne2 img { width:100%; }

.colonne-qualif { text-align:center; background:#eee; }
.colonne-qualif:hover { background:#aaa; transition:background 1s; }
.desc { font-size:65%; padding-top:5px; border-top:1px solid #eee; }

#colonne-partenaires { padding:0px; margin:0px; list-style-type:none; }
#colonne-partenaires li { position:relative; display:inline-block; width:19%; height:150px; vertical-align:center; text-align:center; padding:0px; margin:10px 0px; }
#colonne-partenaires img { width:80%; margin: auto auto; }

#liste li { list-style-type:circle; width:100%!important; }
	
h1 { color:#aaa; margin-top:10px; }
h2 { position:relative; display:block; font-size:140%; color:#092862; margin:60px 0px 20px 0px; }
h2 span { position:absolute; top:-5px; left:-10px; width:20px; }
h4 a, h4 a:hover, h4 a:visited { color:#3a3a3a; margin:0px; line-height:auto; }
h5 { margin-bottom:0px; }
	
#volet { float:left; width:20%; margin:0px; font-size:90%; }
a.ouvrir, a.fermer { display:none; }

#right { float:left; margin:0px; width:80%; text-align:center; }
.sombre { filter: grayscale(0); -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -o-filter: grayscale(0); -ms-filter: grayscale(0); }
.sombre:hover { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }

#right li { list-style-type:none; display:inline; margin:20px 10px; padding:0px; width:30%; }
#right li img { width:100%; margin:auto; }
#right li h4 { width:90%; margin:10px auto; border-bottom:4px solid #eee; }

#form-ui input[type=radio] { display:none; }
#form-ui input[type=radio]:checked + label { font-weight: bold; color:#034B98; }
 
#footer { position:absolute; text-align:center; letter-spacing:2px; line-height:1.5; bottom:0px; display:block; opacity:0.8; margin:40px auto 0px auto; padding:20px 0px; width:100%; background:#FFF; font-size:80%; overflow:hidden; color:#000; }
#footer li { display:inline-block; vertical-align:top; font-size:90%; text-align:left; margin:10px 15px 10px 0px; list-style-type:none; }
#footer a, #footer a:hover { color:#505050; text-decoration:none; }

a, a:hover, a:visited, a:active, td a, .all a { color:#000; text-decoration:none; }
input.sansfond { outline:none; border:0px; background-color:transparent; font-family:tahoma; color:#58585a; }
input.sansfond:hover { background-color:#FFFF00; }
input[type=text], select, option { padding:4px; font:bold 13px Arial; margin:5px 0px; width:90%; background:#f5f5f5; color:#555; border-radius:2px; width:90%; border:1px solid #ccc;  }
input[type=password], select, option { padding:4px; font:bold 13px Arial; margin:5px 0px; width:90%; background:#f5f5f5; color:#555; border-radius:2px; width:90%; border:1px solid #ccc;  }
input[type=submit] { padding:4px 0px 4px 0; font:bold 13px Arial; margin-left:3px; background:#f5f5f5; color:#555; border-radius:2px; width:100px; border:1px solid #ccc; }
input[type=checkbox] { z-index:200; }
.h2 { font-size:140%; color:#092862!important; font-weight:bold; }
textarea { padding:4px; font:bold 13px Arial; margin:5px 0px; width:90%; background:#f5f5f5; color:#555; border-radius:2px; width:90%; border:1px solid #ccc;  }

#headermenu { display:none; position:relative; margin:0px; padding:0px; width:100%; height:50px; list-style-type:none; z-index:999; opacity:0.9; border:0px; }
#headermenu li { background:#000; float:none; width:100%; border-bottom:1px solid #eee; height:50px; line-height:50px; text-align:left; text-indent:30px; }
#headermenu a { color:#FFF; }

@media all and (max-width: 800px) {
body { padding-bottom:250px; min-width:100px; font-size:130%; }
.logo { background:#FFF; text-align:left; margin:0px; width:100%; opacity:0.8; }
.logo img { padding:5px; }
.titre { font-size:200%; }
.mob { display:block; }
h2 { width:90%; margin:5px 5%; }
#headermenu, #headermenu li { display:block; }
#header { display:none; border:0px; width:100%; margin:0px; }
#header li { background:#000; float:none; width:100%; border-bottom:1px solid #eee; text-align:left; text-indent:30px; }
#header a { color:#eee; }
#header li.mob { display:block; }
#header .recherche { display:none; }
#content { width:95%; padding:0px; margin:10px auto; display:block; }
#content img { max-width:100%; }
#colonne li { float:none; width:100%; margin-right:0px; padding:0px; list-style-type:none; }
#colonne2 { padding:0px; width:100%; }
#colonne2 li { float:none; vertical-align:top; width:100%; margin:0px; list-style-type:none; }
#right { position:relative; display:block; float:none; margin:10px auto; width:90%; }
#right li { text-align:center; display:block; width:100%; margin:10px auto; }

#volet {
	width: 250px;
	padding: 10px;
	background: rgba(0, 0, 0, 0.8); color: #fff;
	position: relative;
	left: -290px;
	-webkit-transition: all .5s ease-in;
	transition: all .5s ease-in;
	font-size:95%;
	z-index:998;	
}
a.ouvrir, a.fermer { color:#555; }
a.ouvrir { display:block; right:10%; }
#volet h3:first-child { margin-top:0px; }
#volet:target {	left: -10px; }
#volet a.fermer { display: none; }
#volet_clos:target #volet { left: -270px; }
#volet:target a.ouvrir { display: none; }
#volet:target a.fermer { display: block; position:absolute; top:5px; right:5px; color:#FFF; }
.col1, .col2 { width:100%; margin:20px auto; display:block; }
#colonne-qualif li { width:45%; }
}