/* CSS Document */

/* BALISES HTML GLOBALE */
* {
	margin: 0;
	padding: 0;
}

body {
	background-color: #35524e;
	height: 100%;
	padding: 0px 0px 20px 0px;

}

a img {
	border: none;
}

/* STRUCTURE DE LA PAGE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#conteneur {  /* Conteneur global */
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 1003px;
	
	z-index: 1;
	
	background-color: #FFFFFF;
	
}

/* Bandeau (comprend le logo, menu, recherche, lien version anglaise */
#bandeau { /* Div bandeau */
	background-image: url(images/page_bg_bandeau.jpg);
	background-repeat:no-repeat;

	height: 246px;
	
	position: relative;
	z-index: 10;
}

#bandeau h1 {
	height: 96px;
	width: 116px;
	position: absolute;

	top: 14px;
	left: 29px;
	
	z-index: 100;
}

#versionanglaise {
	position: absolute;

	top: 9px;
	left: 197px;
}
/* MENU DISPOSITION */
h2.disposition {
	position: absolute;
	top: -1000px;
}
ul#disposition  {
	position: absolute;
	top: 5px;
	left: 512px;

	height: 20px;
	
	list-style-type: none;
}
ul#disposition li  {
	display: inline;
}


#block_contenu { /* Block global de contenu */
	background-image: url(images/page_bg_contenu.jpg);
	background-repeat: repeat-y;
	
	position: relative;
	width: 1003px;
	z-index: 100;
}

h2.access { /* Balise H2 masquee */
	position: absolute;
	color: #FFFFFF;
	z-index: 100;
	font-size: 100%;
	font-weight: normal;
	top:-100px;
	text-decoration: none;
	padding:0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	background-image: none;
}

/* MENU PRINCIPAL */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

ul#nav_principale {
	position: absolute;
	top: 110px;
	left: 0px;
	
	width: 1003px;
	height: 136px;
	
	z-index: 80;
	
	list-style-type: none;
}
#rub_1 {
	position: absolute;
	top: 74px;
	left: 15px;

}

#rub_11 {
	position: absolute;
	top: 47px;
	left: 104px;

}

#rub_12 {
	position: absolute;
	top: 20px;
	left: 191px;

}

#rub_13 {
	position: absolute;
	top: -1px;
	left: 309px;

}

#rub_25 {
	position: absolute;
	top: -15px;
	left: 410px;

}

#rub_29 {
	position: absolute;
	top: -21px;
	left: 505px;

}

#rub_30 {
	position: absolute;
	top: -26px;
	left: 610px;

}
#rub_32 {
	position: absolute;
	top: -25px;
	left: 728px;

}
#rub_36 {
	position: absolute;
	top: -17px;
	left: 824px;

}

/* COLONNE GAUCHE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#colonne_gauche { /* Block colonne gauche */
	float: left;
	width: 239px;
	height: 325px;
	
	background-image: url(images/page_bg_colgauche.jpg);
	background-repeat: no-repeat;
	background-position: top;
	overflow-x: visible!important;
	overflow-x: hidden; /* Pour autoriser depassement du menu gauche */
	
}
html>body #colonne_gauche {
	height: auto;
	min-height: 325px;
}

#colonne_gauche h2 { /* Titre colonne gauche */
	color: #69a936;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-size: 130%;
	text-align: center;
	
	background-image: url(images/page_bg_h2_colgauche.gif);
	background-repeat: no-repeat;
	background-position: bottom center;
	padding: 0px 0px 30px 0px;
	margin: 22px 60px 0px 30px;
	
	height: auto;
}


#bouton_flash1 {
	margin: 50px 0 0 37px;
}
#bouton_flash2 {
	margin: 10px 0 0 37px;
}
/* ZONE CONTENU */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#colcentre { /* Block contenu */
	float: left;
	width: 480px;
	position: relative;
	z-index: 100;
	
	padding:  0px 48px 40px 30px;
	margin: -50px 0px 10px 0px;
	
	background-image: url(images/page_bg_colcentre.gif);
	background-repeat: no-repeat;
	background-position: bottom center;
	overflow: visible!important;
	overflow: hidden; /* Pour autoriser depassement du menu gauche */

	
}


/* COLONNE DROITE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#coldroite {
	float: left;
	width: 200px;
	position: relative;
	
	padding:  0px 6px 60px 0px;
	margin: -76px 0px 0px 0px;
	
	overflow: hidden; /* Pour autoriser depassement du menu gauche */
	
	background-image: url(images/page_bg_coldroite.gif);
	background-position: left bottom;
	background-repeat: no-repeat
}

/* Block actu et evenements */
.block {
	background-image: url(images/page_bg_block.jpg);
	background-repeat: no-repeat;
	background-position: top;
	
	height: 205px;
	width: 149px;
	
	padding:  45px 6px 0px 45px;
	
	overflow-x: hidden;
}
html>body .block {
	height: auto;
	min-height: 205px;
}
/* Mise en forme titres evenement */
/* Mise en forme des blocks actu et evenements */
.evenements {
	margin: 15px 0px 0px 0px;
}
.evenements p.date_evenements {
	color: #85aca7;
	font-size: 90%;
}
.evenements h3 {
	font-size: 95%;
	
	background-image: url(images/bg_texte_evenement.gif);
	background-position: bottom;
	background-repeat: repeat-x;
	
	padding: 0px 0px 6px 0px;
	margin: 0px 0px 6px 0px;
	
	color: #898081;
	font-weight: bold;
}

.suite {
	background-image: url(images/bg_suite.gif);
	background-repeat: no-repeat;
	background-position: 0% 50%;
	
	padding: 0px 0px 0px 15px;
	
	font-size: 95%;

}
.suite a {
	text-decoration: none;
	color: #f8ac82;
}
.suite a:hover {
	text-decoration: underline;
}

.tous {
	width: 60px;
	
	background-image: url(images/page_bg_tous.gif);
	background-repeat: no-repeat;
	background-position: 0em 0.3em;
	
	padding: 0px 0px 0px 15px;
	margin: 13px 0px 0px 0px;
	
	font-size: 95%;
}
.tous a {
	text-decoration: none;
	color: #33a1ee;
}

.tous a:hover {
	text-decoration: underline;
}


/* FOOTER */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#footer {
	background-image: url(images/page_bg_footer.gif);
	background-repeat: no-repeat;
	background-position: top;
	
	height: 17px;
	
	padding:  15px 0px 0px 4px;
	background-color: #35524e;
}
html>body #footer {
	height: auto;
	min-height: 17px;
}
/* Liens bas de page */
#footer li {
	display: inline;	
}

#footer li a {
	text-decoration: none;
	color: #99b8bb;
	font-size: 11px;
}
#footer li a:hover {
	color: #6e8f9d;
}
#footer li a img, #footer li a {
	vertical-align: middle;
}
/* FORMULAIRE DE RECHERCHE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#recherche {  /* Formulaire */
	position: absolute;
	top: 37px;
	left: 797px;
	
	z-index: 100;
	width: auto;
}

#recherche label { /* Label */
	display:none;
}

#recherche input {
	vertical-align: middle;
}

#recherche input { /* Champ de saisie */
	color: #000;
	border: 1px solid #adbfbc;
	width: 130px;
}

#recherche input.boutonok, #newsletter input.boutonok, #formliste input.boutonok { /* Boutons submit formulaire recherche et newsletter  */
	border:none;
	background-color:#5A7895;
	font-family: Helvetica,Geneva, Arial, sans-serif;
	font-size:95%;
	color:#FFFFFF;
	height : 14px;
	_height : 16px;	
	width : 18px;
	_width : 20px;
	line-height:14px;
	overflow: visible;
	cursor:pointer;
	text-align:center;
	vertical-align: middle;
}

#recherche input.boutonok:hover, #newsletter input.boutonok:hover, #formliste input.boutonok:hover {/* Boutons submit formulaire recherche et newsletter  */
	background-color:#8097AD;
}

/* FORMULAIRE ABONNEMENT NEWSLETTER */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#newsletter { /* Block Newsletter */
	position: relative;
	z-index: 100;
	float: left;
	width: 163px;
	padding: 0px 0px 8px 0px;
	margin: -69px 0px 0px 15px!important;
	margin: -69px 0px 0px 8px;
	background-image: url(images/bg_newsletter_bas.gif);
	background-repeat: no-repeat;
	background-position: bottom;
	width: 175px;
}

#newsletter h2 { /* Titre */
	background-image: url(images/bg_newsletter_centre.gif);
	background-repeat:repeat-y;
	width: 175px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 3px 0px!important;
	color:#64809B;
	font-family: "Times New Roman",Times,serif;
	font-size: 110%;
	font-style: italic;
	font-weight: bold;
	text-transform:none;
	letter-spacing: 0.03em;
	text-align: center;
}

#newsletter label.masque { /* Label */
	display:none;
}

#newsletter .liste { /* Liste des lettres */
	width: 169px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #62819e;
	/*background-image: url(images/home_bg_newsletter_centre.gif);*/
}

#newsletter .interligne { /* Interligne apres liste des listes */ 
	/*background-image: url(images/home_bg_newsletter_centre.gif);*/
	width: 169px;
	line-height:1px;
	font-size: 1px;
}

#newsletter ul { /* Liste */
	margin: 0px 0px 0px 0px;
	background-image: url(images/bg_newsletter_centre.gif);
	background-repeat: repeat-y;
	text-align: center;
	padding-bottom:3px!important;
	padding-bottom:0px;
	width: 175px;
}

#newsletter ul li { /* Liste elements */
	display: inline;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #5a7895;
	padding-left:3px!important;
	padding-left:0px;
}

#newsletter p { /* Newsletter paragraphe */ 
	background-image: url(images/bg_newsletter_centre.gif);
	background-repeat: repeat-y;
	text-align: center;
	width: 175px;
}

#newsletter input.texte_news { /* Champ de saisie email */
	width: 123px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	border: 1px solid #8ea3b8;
	color: #62819e;
}

#newsletter input { /* Tous les champs */
	vertical-align: middle;
	width: auto;
}

.newslettermsg { /* Message de retour du formulaire d'abonnement */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#FF0000;
	background-image: url(images/bg_newsletter_centre.gif);
	font-size: 90%;
	padding: 5px 10px 5px 10px;
}

#newsletter input.boutonok { /* Boutons submit = voir bouton ok recherche */ }

#newsletter input.boutonok:hover {/* Boutons submit = voir bouton ok recherche */ }

/* ACCESSIBILITE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#liensevitement {
	font-size: 70%;
	margin: 0px 0px 0px; 
	text-align: right;
}
#liensevitement a {
	color: #35524E;
}
#liensevitement a:hover, #liensevitement a:focus {
	color: #fff;
}

/* DIVERS */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* pour "pousser" si presence de float */
/* penser à placer un   pour eviter le bug sous netscape (page à rallonge) */ 
.clear {
	clear: both;
	height: 0px; /* correction page a rallonge sous netscape*/
	line-height: 0px;
	font-size: 1px;
}

.clearh3 {
	clear: both;
}

/* Pour affichage correct PNG */
.format_png { behavior: url(win_png.htc); }


.imprimer { /* paragraphe bouton Imprimer */
	float: right;
}
.siimprimer { /* masquage image bandeau imprimer */
	display: none;
}