* {margin:0; padding:0; border:none;}
body{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:85%; background: url(img/bkg.jpg) repeat; }
#page{position:absolute; width:756px;left:50%; margin-left:-378px;  background: url(img/bkg-page.jpg) repeat-y;}
#prelude{ position:absolute;float:right;  width:725px;margin-left:-361px; left:50%;background:url(img/bd-noir.jpg) repeat-x; height:25px; text-align:right; } 
#prelude ul li {display:inline; }
#prelude ul li a{color:#ccc; font-size:0.7em; padding:5px; text-decoration:none;}
#prelude ul li a:hover{color:#fff; text-decoration:underline;}
#top{width:723px; background:url(img/fond-header.png) repeat; height:140px; margin-left:18px; }
#top h1{font-family:"Times New Roman", Times, serif;float:right; text-align:left; margin-top:80px; margin-right:100px; font-size:1.5em; font-weight:bold; letter-spacing:3px;; }
#main{ margin-top:40px; padding-bottom:30px;}
#content {float:left; width:380px; font-size:0.8em;padding-left:30px; line-height:1.3em; padding-top:20px;}
#content ul{ margin-left:20px;}
#content li{margin:5px;}
#content h2{font-weight:bold; font-size:1.1em; margin-bottom:10px;}
#content h2:first-letter{color:#005ba3;}
#content h3{font-size:1em; margin-bottom:5px; margin-top:15px;}
#content h3:first-letter{color:#005ba3;}
#content h4{margin-top:7px; font-size:0.9em;}
#content p{line-height:1.5em;}
#content p img{vertical-align:middle;}

#sidebar{ width:300px; float:right;}

#activites ul{list-style-type:none;}
#activites ul li{margin-bottom:1px;display:block;width:300px;}
#activites ul li a{display: block ;width: 216px ;line-height: 45px ;color:#fff;text-decoration: none ; margin-left:70px; font-size:0.8em; font-weight:bold; text-indent:20px; }
#activites ul li img{float:left;}

#promo{background:url(img/bg-promo.jpg) repeat-x; width:285px; margin-right:14px; font-size:0.8em;}
#promo p{ width:250px; height:75px; margin-top:20px;}
.vert{background: url(img/bg-vert.jpg)  repeat-x 0 0 ;}
.vert:hover{background: url(img/bg-vert.jpg) repeat-x 0 -45px ;}
.orange{background:url(img/bg-orange.jpg) repeat-x 0 0 }
.orange:hover{ background:url(img/bg-orange.jpg) repeat-x 0 -45px;} 
.violet{background: url(img/bg-violet.jpg)  repeat-x 0 0 ;}
.violet:hover{background: url(img/bg-violet.jpg)  repeat-x 0 -45px;}
.bleu{background: url(img/bg-bleu.jpg)  repeat-x 0 0 ;}
.bleu:hover{background: url(img/bg-bleu.jpg)  repeat-x 0 -45px ;}

#categories{ position:absolute; width:740px;left:50%; margin-left:-361px; top:123px;}
#categories ul li{display:inline; list-style:none; }
#categories ul li a {display:block; width:102px; height:20px; float:left; border-right:1px solid #fff;background:#CCC;color:#fff; text-decoration:none; text-align:center; font-weight:bold; font-size: 0.8em; padding-top:5px;}
#categories ul li a:hover{background:#999;}
#categories ul li .actif{background:#666;}

#breadcrumbs{position:absolute; width:725px;margin-left:-361px; left:50%;background:url(img/bd-noir.jpg) repeat-x;height:25px; background:url(img/bd-noir.jpg) repeat-x; top:149px; padding-top:10px; color:#ccc; font-size:0.8em; text-indent:5px;}
#breadcrumbs a{text-decoration:none; color:#ccc;}
#breadcrumbs a:hover{text-decoration:underline;}
#footer{ clear:both; background:url(img/fd-footer.jpg) repeat-x bottom; height:45px; width:727px; margin-left:16px; text-align:center; font-size:0.8em; color:#ccc; padding-top:20px;}
#footer a{color:#ccc; text-decoration:none;}

/*balises*/
a{color:#999;}
acronym{border-bottom:#CCC 1px dashed;}
/*classe*/
.lettrine{color:#005ba3;}
.plus{margin-bottom:20px; margin-top:15px; border-bottom:#CCC 1px dotted; padding-bottom:10px; text-align:right;}
.plus a{margin-top:5px; font-size:0.8em; text-decoration:none;}
.plus a:hover{ text-decoration:underline;}
.intro {margin-bottom:25px;}
.left{ float:left; margin:5px;}

/*** Mise en forme du formulaire ***/

/*formulaires*/
fieldset {border:#f0f0f0 1px solid; background:#fff;  padding:15px; margin-top:40px; margin-top:-10px}
legend{ color:#000; font-weight:bold;}
label {color:#000; border:0;}

#valid{background:#f0f0f0; color:#999; padding:5px; border:none;}
#valid:hover{background:#00a751;color:#fff}
textarea{}

#inscription {
	border: none;
	background:#fff;
	margin-top:30px;
	width: 400px;	/*** Largeur du formulaire ***/
}
#titreForm, #piedForm {	/*** Mise en forme du titre et du pied de formulaire ***/
	font: bold 1.1em;
	padding: .5em;
}
#piedForm {
	text-align: right; /*** Les boutons sont alignés à droite ***/
}
#piedForm input {
	font-weight: bold; /*** Pour améliorer la lisibilité des boutons ***/
}
#corpForm {	/*** Mise en fome du corp du formulaire (bordure, couleur du fond...) ***/
	padding:10px;
}
#corpForm fieldset {	/*** Mise en forme des cadres ***/
	margin: 0;
	padding: 0 1em 1em;
}
#corpForm p {	/*** Mise en forme des lignes du formulaire ***/
	padding: .2em 0;
	margin: 0 0 .2em 0;
}
#corpForm fieldset label {	/*** Mise en forme des intitulés de champs ***/
	float: left;	/*** Très important, ne pas suprimer ! ***/
	width: 30%;	/*** Les intitulés prennent 1/3 de la largeur totale du formulaire... ***/
	text-align: right;	/*** ... et ils sont alignés à droite... ***/
	margin: 0;
	padding: 0 .5em 0 0;
	line-height: 1.8;	/*** ... et centrés verticalement. ***/
}


#corpForm input{ width:200px; border:1px solid #ccc;}
#corpForm textarea{ border:1px solid;}


#corpForm .normal{ background:#fff;}
#corpForm .focus{ background: #FBFBFB; border:1px solid #999; padding-top:2px;}