body{
	padding:0;
	margin:0;
	background:url(images/main-bg.png) repeat-x #008FCB;
	font:14px/20px Arial, Helvetica, sans-serif;
	color:#3D3C2C;
	font-weight:normal;
	text-align:center;
}

p, h2, img{
	padding:0;
	margin:0;
}

#headerPan{
	margin : 0 auto;
	margin-top: 40px;
	text-align:center;
}

#headerPanleft{
	width:35.714em;
	min-height:35.714em;
	margin-right : 1.429em;
	display:inline-block;
	vertical-align:top;
}

#headerPanright{
	width:35.714em;
	min-height:35.714em;
	display:inline-block;
	vertical-align:top;
}



#ideal,#aclyon,#dane,#headerPanrighti{
	float:left;
	width:35.714em;
	position:relative;
	margin:0.143em auto;
	border-radius:0.5em;
	background:no-repeat 0.313em 0.188em white;
	filter: brightness(1);
	-webkit-filter: brightness(1);
	-moz-filter: brightness(1);
	-o-filter: brightness(1);
	-ms-filter: brightness(1);
	transition-property: filter,height ;
	transition-duration: 1s;
	transition-timing-function: ease-out;transition-delay:0.2s;
}

.choix_survol{
	float:left;
	width:35.714em;
	height:4em;
	position:relative;
	margin:0.143em auto;
	border-radius:0.5em;
	/*background:no-repeat 0.313em 0.188em white;*/
	background:white;
	filter: brightness(1);
	-webkit-filter: brightness(1);
	-moz-filter: brightness(1);
	-o-filter: brightness(1);
	-ms-filter: brightness(1);
	transition-property: filter,height ;
	transition-duration: 1s;
	transition-timing-function: ease-out;transition-delay:0.2s;
}

#mesg{
	float:left;
	width:500px;
	height:80px;
	position:relative;
	margin:2px auto;
	border-radius:0.5em;
	background:no-repeat 5px 3px white;
	filter: brightness(1);
	-webkit-filter: brightness(1);
	-moz-filter: brightness(1);
	-o-filter: brightness(1);
	-ms-filter: brightness(1);
	transition-property: filter,height ;
	transition-duration: 1s;
	transition-timing-function: ease-out;transition-delay:0.2s;
}
/*ici ou plus haut ? */
.site, .liste_der {
	float:left;
	width:500px;
	height:74px;
	position:relative;
	margin:2px auto;
	margin-left:20 px;
	text-align:left;
	border-radius:0.5em;
	background:no-repeat 5px 3px white;
	filter: brightness(1);
	-webkit-filter: brightness(1);
	-moz-filter: brightness(1);
	-o-filter: brightness(1);
	-ms-filter: brightness(1);
	transition-property: filter,height ;
	transition-duration: 1s;
	transition-timing-function: ease-out;transition-delay:0.2s;
}

#ideal,#site,#aclyon,#dane,#mesg,.choix_survol{
	border:1px solid #DCDAC2;
}

.choix_survol{overflow:hidden;}
.choix_survol:hover, .choix_survol:focus{background-image:none;}
.choix_survol:hover nom, .choix_survol:focus nom{display:none;}
#cio:hover, #cio:focus{height:380px;}
#disc:hover, #disc:focus{height:400px;}
#dep:hover, #dep:focus{height:312px;}


#ideal h2,#aclyon h2, #dane h2{
	margin:10px 20px 10px 170px;
	/*color:#CC0000;*/
	color:#E64376;
	/*color:#EE8027;*/
	text-transform:uppercase;
	/*text-align:center;*/
	text-align:right;
	/*font:16px/14px Georgia, "Times New Roman", Times, serif;*/
	/*font:1.3em/1em Georgia, "Times New Roman", Times, serif;*/
	font:1.3em/1em Arial, Liberation, "Times New Roman", Times, serif;
}

#site h2,#mesg h2,.choix_survol h2, .liste_der h2,.site h2 {
	margin:10px 10px 10px 20px;
	/*color:#CC0000;*/
	color:#E64376;
	/*color:#EE8027;*/
	text-transform:uppercase;
	/*text-align:center;*/
	text-align:left;
	/*font:16px/14px Georgia, "Times New Roman", Times, serif;*/
	/*font:1.3em/1em Georgia, "Times New Roman", Times, serif;*/
	font:1.3em/1em Arial, Liberation, "Times New Roman", Times, serif;
}

#mesg h2{
	margin:10px 10px 10px 10px;
	color:#E64376;
	text-transform:uppercase;
	text-align:center;	
	font:1.3em/1em Arial, Liberation, "Times New Roman", Times, serif;
}


#ideal p,#aclyon p,#dane p{
	margin:10px 20px 10px 170px;
	/*text-align:center;*/
	text-align:right;
	/*font:1em/1em "Trebuchet MS",Arial, Helvetica, sans-serif;*/
	font:1em/1em Arial, Liberation, "Times New Roman", Times, sans-serif;
	color:#2E5000;
}


.choix_survol p, .liste_der p,.site p{
	margin:10px 10px 10px 20px;
	/*text-align:center;*/
	text-align:left;
	/*font:1em/1em "Trebuchet MS",Arial, Helvetica, sans-serif;*/
	font:1em/1em Arial, Liberation, "Times New Roman", Times, sans-serif;
	color:#2E5000;
}

#mesg p{
	margin:10px 10px 10px 10px;
	text-align:center;
	font:1em/1em Arial, Liberation, "Times New Roman", Times, sans-serif;
	color:#2E5000;
}


#site select:visited, .liste_der select:visited{
	background-color: #008FCB ;
}

#ideal:hover,#dane:hover,#aclyon:hover,#site select:hover,#mesg:hover, .liste_der:hover,.site:hover{
	background-color: #FFC2F5; /*#FFDCFF;*/
	
	filter: brightness(1.1);
	-webkit-filter: brightness(1.1);
	-moz-filter: brightness(1.1);
	-o-filter: brightness(1.1);
	-ms-filter: brightness(1.1);
}

#site select:focus, .liste_der select:focus {
	background-color: #CCFFFF;
}

#site select:active, .liste_der select:active {
	background-color: white ;
}

#mesg:hover h2,#mesg:hover p, .liste_der:hover h2,.site:hover h2{
	color:#008FCB;
	text-align:left;
	font-weight:bold;
}

#ideal:hover h2,#dane:hover h2,#aclyon:hover h2{
	color:#008FCB;
	text-align:right;
	font-weight:bold;
}

#mesg:hover h2,#mesg:hover p{
	color:#008FCB;
	text-align:center;
	font-weight:bold;
}

#headerPanrighti img { border-radius:0.5em;}

#dane {background-image:url(images/dane_transp.png);}
#aclyon {background-image:url(images/aclyon_transp.png);}
#ideal {background-image:url(images/ideal_transp.png);}



/*couleurs académiques :
bleu : #008FCB
gris : #EDECE5
rose : #E64376
orange : #EE8027
vert : #77B756
jaune : #E9E11F
turquoise : #009E84
violet : #97497F
*/


/* conversions pixels em
14px = 1em
16px = 1.143em
20px = 1.429em
500px = 35.714em
1px = 0.071em
54px = 3.857em
2px = 0.143em
5px = 0.313em
3px = 0.188em

*/