/* CSS Document */


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

/* BALISES HTML */
html, body {
	background: #a5a5a5 url(images/bg_body.jpg) repeat-x top;
		
	font-family: Arial, Helvetica, sans-serif;
	margin: 0; padding: 0;
	text-align: center; /* pour corriger le bug de centrage IE */
	height: 100%;
	width: 100%;
	font-size: 100%;
		
}
a {

}
a:hover {
	text-decoration: none;
}

a img {
	border: none;
}


/* ACCESSIBILITE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#liensevitement { /* Block contenant les liens d'evitement */
	width: 970px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
		
	text-align: right;
	color: #fff;
	
	font-size: 0.6em;
}

#liensevitement a { /* Les liens d'evitement */
	color: #fff;
}
#liensevitement a:hover, #liensevitement a:focus, #liensevitement a:active {  /* Rollover des liens d evitement */
	color: #a5a5a5;
}
h2.access {  /* Balise H2 masquee */
	position: absolute;
	color: #FFFFFF;
	z-index: 100;
	top:-10000px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* STRUCTURE DE LA PAGE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* CONTENEUR GLOBAL */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#tableau{
	height: 100%;
	width: 970px;      /* ici la largeur fixe de l'element a center */
	margin-left: auto;
	margin-right: auto;
	text-align: left; /* on rétablit l'alignement normal du texte */

}
#tableau-td {
	vertical-align: middle;
}

	#conteneur {	
		position: relative;
		margin-left: auto;
		margin-right: auto;
		width: 970px;
		height: 570px;
		
		z-index: 1;
	
		text-align: left;
		border: 1px solid #bfc1b4;
		background: url(images/home_bg_contenu.gif) repeat-y;
	}
		html>body #conteneur {	/* Donne une hauteur mini au conteneur */
			height: auto;
			min-height: 570px;
		}
	


/* BANDEAU AVEC LOGO ET FLASH */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#flash {
	width: 970px;
	height: 230px;	/* 	!!!!!!!!	Laisser une hauteur mini au cas ou le flash ne se charge pas.			!!!!!!!!!!!!!    */
	background: url(images/home_bg_bandeau.jpg) no-repeat;
}

	h1 {		/* Logo */
		position: absolute;
		top: 4px;
		left: 40px;
		z-index: 99;
	}

	#slideshow {
		width: 970px;
		position: absolute;
		top: 0;
		left: 0;
	}

#masque {
	position: relative;
	z-index: 50;
}
/* MENU PRINCIPAL */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
ul#nav_principale {
	position: relative;
	z-index: 98;
	list-style: none;
}

	ul#nav_principale li {
		display: inline;
		position: absolute;
	}


	ul#nav_principale li#rub_1 {
		left: 216px;
		top: 176px;
	}
	ul#nav_principale li#rub_5 {
		left: 312px;
		top: 165px;
	}
	ul#nav_principale li#rub_23 {
		left: 435px;
		top: 160px;
	}
	ul#nav_principale li#rub_33 {
		left: 567px;
		top: 157px;
	}
	ul#nav_principale li#rub_38 {
		left: 783px;
		top: 154px;
	}
	ul#nav_principale li#rub_39 {
		left: 879px;
		top: 146px;
	}


/* CARTE LOCALISATION DE SALLELES */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#carto {
		position: absolute;
		top: 148px;
		left: 46px;
		z-index: 99;
}



/* BLOCK CONTENU : EDITO, ACTUALITES, AGENDA, SOUS MENU */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#block_contenu_haut {
	background: url(images/home_bg_contenu_haut.jpg) no-repeat top;
}

#block_contenu_bas {
	width: 970px;
	height: 340px;
	background: url(images/home_bg_contenu_bas.gif) no-repeat bottom;
}
	html>body #block_contenu_bas {
		height: auto;
		min-height: 340px;
	}

	
	/* EDITO */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	#colonne_edito {
		float: left;
		display: inline;
		width: 293px;
	}
	h2.edito {		/* titre edito */
		background: url(images/picto_edito.gif) no-repeat 0em 0.3em;
		padding: 0 0 10px 45px;
		margin: 71px 0 0 39px;
		width: 90px;
		float: left;
		display: inline;
	}

	p#photo_edito {		/* photo edito */
		float: left;
		display: inline;
		width: 74px;
		margin: 32px 0 0 10px;
	}
		p#photo_edito img {		/* photo edito */
			float: left;
		}
		p#photo_edito img.photo {		/* photo edito */
			margin: -83px 0 0 5px;
		}

	p#texte_edito {		/* texte edito */
		clear: both;
		width: 220px;
		margin: 7px 0 0 40px;
		
		color: #313131;
		font-size: 0.7em;
	}
	p#texte_edito img {		/* texte edito */
		padding: 0 2px 0 2px;
	}
	#colonne_edito .suite {		/* lien lire la suite */
		text-align: right;
		margin: 5px 0 110px 40px;
		width: 220px;
	}
	#colonne_edito .suite a {		/* lien lire la suite */
		color: #411e02;
		font-size: 0.71em;
		padding: 0 0 0 15px;
		background: url(images/picto_suite.gif) no-repeat 0em 0.3em;
	}


	/* ACTUALITES */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	#colonne_actus {
		float: left;
		display: inline;
		width: 270px;
		padding: 0 0 0 4px;
		margin: 0 0 35px 0;
	}
	h2.actus {
		margin: 0 0 30px 51px;
	}
	div.last_actus { /* Block actualites */
		margin:  0;
		clear: both;
	}
	
	/* GESTION DES VIGNETTES */
	.block_photo_actu {  /* Image evenement */
		float: left;
		margin: 0;
		width: 127px;
		display: inline;
	}
	.block_photo_actu img { 
		float: left;
		margin-left: px;
	}
	.photo_actu {  /* Image evenement */
		margin: -76px 0 0 6px; /* Pour firefox */
	}
	.date_actu { /* Date actu */
		color: #797965;	
		margin: 7px 0 0 0;
		font-size: 0.7em;		
	}
	.last_actus h3 { /* Titre actu lien */
		font-size: 0.9em;
		color: #a22301;
		font-weight: bold;
		background: url(images/home_picto_h3.gif) no-repeat 0em 0.3em;
		padding: 0 0 0 15px;
		margin: 0 0 2px 0;
	}
	
	div.texte_actu { /* Block de texte à coté de la photo. Pour eviter un retour sous la photo : fixer un width et passer en flottant left */
		width: 134px;
		padding: 0 0 0 8px;
		display: inline;
		float: left;
	}
	p.texte_actu { /* Texte actu */
		color: #313131;
		font-size: 0.7em;		
	}
	#colonne_actus .suite {		/* lien lire la suite */
		margin: 10px 0 0 0;
	}
	#colonne_actus .suite a {		/* lien lire la suite */
		color: #a22301;
		font-size: 0.8em;
		padding: 0 0 0 15px;
		background: url(images/picto_suite2.gif) no-repeat 0em 0.3em;
	}
		
	.separation {		/* Filet de separation entre les actualites */
		margin: 10px 0 9px 0;
	}	


	/* EVENEMENTS */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	#colonne_evenements {
		float: left;
		display: inline;
		width: 175px;
		padding: 0 0 0 28px;
	}
	h2.evmnt {
		margin: -2px 0 32px 6px;
	}
	div.last_evmnt { /* Block 1 evenement */
		margin: 0 0 0 0;
		clear: both;
		width: 160px;
	}
	.date_evmnt { /* Date evenement */
		color: #8d929d;
		font-size: 0.7em;		
		margin: 0 0 0 0;
		padding: 0 0 0 15px;
		background: url(images/picto_evenement.gif) no-repeat 0em 0.4em;
	}
	.last_evmnt h3 { /* Titre evenement lien */
		font-size: 0.7em;		

	}
	.last_evmnt h3 a { /* Titre evenement lien */
		color: #313131;
		font-weight: normal;
		text-decoration: none;
	}
	.last_evmnt h3 a:hover { /* Titre evenement lien */	
		text-decoration: underline;
		color: #007264;
	}
	.separation_agenda {		/* Filet de separation entre les actualites */
		margin: 10px 0 9px 0;
	}	


	/* COLONNE MENU */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	#colonne_menu {
		float: right;
		position: relative;
		display: inline;
		width: 200px;
		z-index: 99;
		margin: -30px 0 0 0;
		overflow-x: inherit!important;
		overflow-x: hidden;
	}
		
	/*  MENU */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	#menu {
		width: 187px;
		padding: 0 0 0 13px;
		background: url(images/home_bg_menu.gif) no-repeat top;
		height: 265px;
	}
		html>body #menu {
			height: auto;
			min-height: 265px;
		}
		/* FORMULAIRE DE RECHERCHE */	
		.titre_recherche {
			margin: 0 18px 3px 0;
			text-align: right;
		}
		#recherche {  /* Formulaire */
			padding: 3px 0 18px 19px;
		}
		#recherche p { 
			background: #411e02;
			width: 151px;
			height: 16px;
			text-align: left;
		}
		#recherche label { /* Label */
			display: none;
		}
		#recherche p input { /* Champ de saisie */
			color: #fff;
			font-size: 0.7em;
			width: 100px;
			/width: 109px;
			margin: 0 5px 0 5px;
			vertical-align: middle;
			border: medium none; 	/* NE PAS EFFACER CETTE LIGNE */
			text-align: center;
			display: inline;
			background: transparent;
		}
		#recherche input.boutonok  {
			width: 22px;
			height: 14px;
			color: #FFFFFF;
			vertical-align: middle;
			font-size: 0.9em;
		}
		html>body #recherche input.boutonok  {
			height: auto;
			min-height: 14px;
		}


		/*  LOGO STATION VERTE */
		/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
		#station_verte {
			margin: 0 0 0 134px;
		}

/* FOOTER */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#footer { /* Block pied de page */
	position: absolute;
	right: 0;
	bottom: 0;
	width: 590px;
	height: 27px;
	background: url(images/home_bg_footer.gif) no-repeat top;
	margin: -30px 0 0 0;
}
	html>body #footer { /* Block pied de page */
		height: auto;
		min-height: 27px;
	}

#footer ul { /* Liste */
	list-style-type: none;
	margin: 4px 0 0 42px;
	width: 510px;
	float: left;
	display: inline;
}
#footer ul li { /* Liste */
	display: inline;
}

	#footer ul li a {
		color: #fff;
		font-size: 0.75em;
		text-decoration: none;
		background: url(images/picto_menu_divers.gif) no-repeat 0em 0.3em;
		padding: 0 0 0 12px;
		margin: 0 30px 0 0;
	}
	#footer ul li a:hover {
		color: #210900;
		text-decoration: underline;
	}

	#footer li span { 		/* On masque les | de séparation */
		display: none;
	}

	/* PAGE ANGLAISE */
	/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	#english {
		float: right;
		padding: 8px 9px 0 0;
		display: inline;
	}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* 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: 1px;
	font-size: 0px;

}

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

/* Flottant à gauche */
.float_left {
	float: left;
}
/* Flottant à droite */
.float_droite {
	float: right;
}