/* CSS Document 
 * 
 * Codes couleur utilisés sur le site 
 * - bleu titre h2 : #008b8f
 * - brun chapo : #d37600
 * - bleu intertitre : #008b8f
 * - hierarchie : #757e00
 * - hierarchie hover : #aebb01
 * 
 * Liens
 * - lien interne : #006362
 * - lien interne hover : #d3590e
 * - lien externe : #941500
 * - lien externe hover : #cf513c
 * - lien "lire la suite" : #006362
 * - lien "lire la suite" hover : #d95c05
 * 
 * Menu
 * - bleu h2 colonne gauche : #006362
 * - vert item1 menu : #99a500
 * - bleu item1 menu hover : #006362
 * - bleu item2 : #14afad
 * - ocre item3 : #797979
 * 
 * Contenu
 * - titre actus orange : #d95c05
 * - titre document vert : #84a500 
 * 
 */


/* BALISES HTML GLOBALE */
* {
	margin: 0;
	padding: 0;
}
ul, li {margin: 0; padding: 0; list-style-type: none;}

/* BALISES HTML */
html, body {

	font-family: Arial, Helvetica, sans-serif;	
	margin: 0; padding: 0;
	text-align: center; /* pour corriger le bug de centrage IE */
	height: 100%;
	font-size: 100%;
}

body { background: #65AEBB url(images/bg_degrade.png) repeat-x; }

a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
#colonne_contenu a {text-decoration: underline;}
a img {
	border: none;
}


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

#liensevitement { /* Block contenant les liens d'evitement */
	width: 980px;
	position: relative;
	margin: 0 auto;
	text-align: right;
	color: #FFF;
	font-size: 0.7em;
}

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



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

/*---------------------------------------------------------------
	Disposition des blocs principaux 
----------------------------------------------------------------*/

#conteneur { /* Bloc principal */
	position:relative; 
	clear:left;
	width:980px; 
	margin:0 auto 0 auto;
	background: url(images/bg_int_conteneur_repeat.jpg) repeat-y center;
	border:0px;
}
/* Bande d'arrière plan à la largeur de la page qui se répète verticalement */
#conteneur_bg {width: 100%; height: 100%;	background: url(images/bg_int_conteneur_top.jpg) no-repeat top center;	}

#bandeau { 
	z-index: 1;
	position: relative;
	margin-left: auto;
	margin-right: auto;
}


/* ENTETE PAGE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

h1 {
	width: 980px;
	height: 199px;
}
/* logo */
h1 img {
	position: absolute; 
	left:95px;
	top:12px;
	z-index: 99;
}


#image_rub {position: absolute; top: 0; right : 8px; width:711px; height:242px;}
#image_rub img { float: left; z-index: 20;}
#masque_bandeau_rub {width: 100%; height: 100%; position: absolute; top: 0px; right: 0; background: url(images/masque_bandeau_int.png) no-repeat; z-index: 50;}

/* CONTENU EXTENSIBLE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#block_contenu { /* Block contenu */
	width: 980px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	z-index:90; 
	text-align: left;
	
	
}


/* COLONNE GAUCHE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#colonne_gauche { /* Colonne gauche */
	float: left;
	display: inline; /* Correction du bug ie sur les flottants */
	word-wrap: break-word; /* Si le texte sort du cadre il y a un rtour à la ligne automatique */
	width: 240px; 
}




/* COLONNE CONTENU */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#colonne_contenu {	
	z-index: 50;	
	float: left;
	display: inline; /* Correction du bug ie sur les flottants */
	word-wrap: break-word; /* Si le texte sort du cadre il y a un rtour à la ligne automatique */
	padding:0 0px 20px 30px;
	width:492px;
	font-size: 0.80em;
	


}

/* COLONNE DROITE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#colonne_droite {
	float: left;
	display: inline; /* Correction du bug ie sur les flottants */
	word-wrap: break-word; /* Si le texte sort du cadre il y a un rtour à la ligne automatique */
	width: 205px; 
	padding: 0;
	margin-top: 8px;
	margin-right: 12px;
	
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* MENU PRINCIPAL HORIZONTAL SUPERIEUR                                          */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

ul#nav_principale {
	clear: both;
	list-style: none;
	text-align: center;
	color: #fff;
	float: right;
	width: 648px;
	position: relative;
	margin: -42px 0 0 0;	
}

ul#nav_principale li {
	float:left;
	margin:0 0 0 -1px;
	padding:0;
	position: relative;
	z-index:50;
}
ul#nav_principale li.actif, ul#nav_principale li a:hover {
	z-index:99;
}
ul#nav_principale li a {
	color: #fff;
	font-weight: bold;
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* MENU INFOS PRATIQUES */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#infos_pratiques {/* width: 205px;*/ } /* bloc entier du menu infos pratiques */

#infos_pratiques h2 {text-align: center; width: 175px; padding: 24px 0 0 30px; background: url(images/bg_infos_prat_home_top.png) no-repeat left top; height: 42px;}
#menu_infos-pratiques {width: 177px;font-size: 0.77em;padding-left: 28px;background: url(images/bg_infos_prat_home_bot.png) no-repeat left bottom; padding-bottom: 30px;}
#menu_infos-pratiques  li { padding-left: 17px; margin-bottom: 3px;}
#menu_infos-pratiques li a {padding-left: 15px; background: url(images/pictos_menu_pratique.png) no-repeat left 5px; color: #874A01; font-weight: bold; display: block;}
#menu_infos-pratiques li a:hover, #menu_infos-pratiques li a.on {background: url(images/pictos_menu_pratique-hover.png) no-repeat left 5px; color: #FFF;}


/* Dans la colonne droite, liste des deux liens */
ul#autres_liens { 
	margin:16px 0 0 37px;
	padding-left:0;
}
ul#autres_liens li {background: url(images/trait-sepa-hori-home.png) no-repeat center bottom; }
ul#autres_liens li a { font-size:0.88em; line-height:1em;font-weight:bold;  text-decoration: none; display: block; padding: 3px 0 5px 29px}
ul#autres_liens li a:hover { text-decoration: underline;}

ul#autres_liens li a.lien1 { color: #D97827; background: url(images/pictos_autresliens_home_1.gif) no-repeat left 0.1em;}
ul#autres_liens li a.lien2 { color: #E1B32A; background: url(images/pictos_autresliens_home_2.gif) no-repeat left 0.1em;}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* FORMULAIRE DE RECHERCHE */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#recherche {  /* Formulaire */
	background:url("images/bg_recherche_int.png") no-repeat scroll left top transparent;
	height:45px;
	margin:26px 0 0 15px;
	padding: 23px 0 0 19px;
	width : 171px;
}

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

#recherche img, #recherche input { 
	vertical-align: middle;
}

#recherche input { /* Champ de saisie */
	color: #62819e;
	border: 1px solid #dfdfdf;
	font-size: 0.8em;
	width: 130px;
	text-align: left;
	height: 15px;
}
#recherche input.boutonok, input.boutonok  {
	width: 25px;
	
	border: medium none; 	/* NE PAS EFFACER CETTE LIGNE */
	color: #006362;
	font-weight: bold;
	text-align: center;
	font-size: 0.8em;	
	background: transparent;
	font-style: italic;
	cursor: pointer;
}

#recherche input.boutonok:hover, input.boutonok:hover {
	color: #ed7b00;
}




/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* PIED DE PAGE                                                                 */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#footer { /* Block pied de page */

	width: 980px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	clear: both;
	color: #FFF;
	background: url(images/bg_int_footer.png) no-repeat top center;
	height: 1.5em;
	padding-top: 9px;

}

ul#menu_divers { /* Liste */
	list-style-type: none; margin: 0; padding: 0;
	margin: 0px 0 0 35px; line-height: 0.8em;
}
ul#menu_divers li { /* Liste */
	display: inline; 
}
ul#menu_divers a {
	color: #FFF;
	font-size: 0.7em;
	text-decoration: none;
	padding-left: 15px;
	margin-right: 15px;
	float: left; display: block;

}
ul#menu_divers a:hover, ul#menu_divers a.actif {
	text-decoration: underline ;
	color: #00606D;
}

ul#menu_divers a.artbug { background: url(images/picto_artbug.gif) no-repeat left center;}
ul#menu_divers a.artmentions { background: url(images/picto_artmentions.gif) no-repeat left center;}
ul#menu_divers a.artplan { padding-left: 20px; background: url(images/picto_artplan.gif) no-repeat left center;}
ul#menu_divers a.artaccess { background: url(images/picto_artaccess.gif) no-repeat left center;}
ul#menu_divers a.artaide { background: url(images/picto_artaide.gif) no-repeat left center;}



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

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

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

.imprimer { /* paragraphe bouton Imprimer */
	float: right;
	display: inline;
	margin:28px 0 0;
}
.siimprimer { /* masquage image bandeau imprimer */
	display: none;
}

/* coordonnées de la mairie dans le pied de page uniquement visible lors de l'impression de la page */
#coordonnees {display: none;}