/* =============================== PARAMETRES GENERAUX =============================== */
html, body {
	width:100%; /* Pour aider au centrage de la page, elle doit se baser sur un flux occupant 100% de la taille de l'?cran */
	height:100%;
	margin:0; /* Annuler toute marge permet d'initialiser le point de r?f?rence depuis lequel on travaillera pour centrer la page */
	padding:0;
	font-family:Arial, Verdana, Helvetica;
}

h2, h3, h4, h5, #menu_1, #menu_1 *, #menu_2, #menu_2 * { /* Annulation des marges cr??es par ces balises par d?faut */
	margin:0;
	padding:0;
}
img {
	border:none;
}

a {
	color:#333;
	text-decoration:none;
}

a:hover {
	color:#ec880e;
	text-decoration:none;
}

.gras {
	font-weight:bold;
}

.normal {
	font-weight:normal;
}

.texte_blanc {
	color:#fff;
}

/* =============================== CONTENEUR DE PAGE (POUR CENTRAGE) =============================== */
#centrage {
	width:1000px;
	height:auto;
	margin:0 auto; /* Alignement horizontal de la page */
	padding:0;
	background:url(images/fond_contenu.jpg) repeat-y;
}

/* La suppression des param?tres suivants n'ayant entra?n? aucun changement, je les ai mis en commentaires */
/* #entete {
	width:1000px;
	height:140px;
}

#sous-entete {
	width:1000px;
	height:182px;
} */

/* =============================== ENTETE =============================== */
#entete div.blocLateral {
	/* width:200px; Aucun probl?me d'affichage sans ce param?tre */
	width:200px;
	height:140px;
	background:url(images/fond_droit_entete.jpg) repeat-x;
	float:left;
}

#entete div.blocCentral {
	width:580px; /* Largeur calcul?e en fonction du padding */
	height:40px; /* Hauteur calcul?e en fonction du padding */
	padding:50px 10px; /* Aligne le texte */
	background:#ec880e;
	float:left;
	text-align:right;
	color:#fff;
}

/* =============================== SOUS-ENTETE =============================== */
#sous-entete div.blocLateral {
	width:180px; /* Largeur calcul?e en fonction du padding */
	height:162px; /* Hauteur calcul?e en fonction du padding */
	padding:10px;
	background:url(images/fond_sous-entete.jpg) repeat-x;
	float:left;
}

#sous-entete div.blocCentral {
	width:600px;
	height:182px;
	background: url(/images/cite-st-denis.jpg);
	float:left;
	color: transparent;
}

#sous-entete div.blocLateral img { /* Fixer une taille ? cette petite image permet d'?viter la d?formation de l'image engendr?e par le filtre Microsoft pour la transparence sous IE6 */
	width:18px;
	height:14px;
}

.texte_sous-entete {
	font:normal 12px Arial, Verdana, Helvetica;
}

/* =============================== MENU PRINCIPAL ============================== */
#menu_1 * { /* Ces param?tres sont appliqu?s ? toutes les balises contenues dans la liste #menu_1 */
	float:left;
	font:bold 11px Arial, Verdana, Helvetica;
	text-align:center;
	color:#fff;
}

#menu_1 a {
	height:16px; /* 14 - (2 x 7), mes 2 x 7 ?tant le padding inf?rieur et sup?rieur de mes <a> */
	padding:6px 0; /* Centre verticalement les liens */
	/* Le fond de mes liens en temps normal sera la partie haute de l'image ici charg?e, donc la partie grise */
	/* De plus, l'image utilis?e ne faisant qu'1px de largeur, je lui demande de se r?p?ter sur l'axe des x pour qu'elle remplisse toute la largeur de mon menu */
	background:url(images/menu_general.jpg) repeat-x top;
	/* A noter qu'utiliser cette technique consistant ? charger une seule image contenant les ?tats normaux et survol?s des liens permet une meilleure fluidit? du survol pour les connexions bas-d?bit */
	/* Il vaut mieux charger une grosse image d?s le d?but, qui sera pr?te pour de bon par la suite, plut?t que charger une premi?re image en ?tat normal, puis une seconde qui ne se chargera qu'en ?tat survol? */
	/* induisant alors un temps de chargement pour les faibles d?bits durant lequel il n'y aurai aucune image de fond */
}

#menu_1 a:hover {
	/* Le fond de mes liens en rollover sera la partie basse de l'image ici charg?e, donc la partie orange */
	/* De plus, l'image utilis?e ne faisant qu'1px de largeur, je lui demande de se r?p?ter sur l'axe des x pour qu'elle remplisse toute la largeur de mon menu */
	background:url(images/menu_general.jpg) repeat-x bottom;
}

.extremite_menu { /* Zones quadrill?es */
	width:200px;
	width:200px !important;
	height:28px;
	float: left;
	margin: 0px;
	list-style-type:none;
	background-image:url(images/quadrillage.jpg);
}
.separateur { /* Cr?ation des s?parateurs blancs du menu principal */
	width:1px;
	height:28px;
	background:#fff;
}

/* Les ?tats normaux et survol?s de mes boutons ?tant d?j? g?r?s pr?c?demment, je n'ai plus qu'? leur appliquer une largeur fixe qui agira comme une r?f?rence pour : */
/* - le centrage horizontal du texte des liens */
/* -  la r?p?tition du fond normal ou survol? des liens (la r?p?tition s'effectura automatiquement sur l'axe des x tant qu'une largeur en px sera exprim?e) */
#qui, #qui:hover {
	width:140px;
}

#publi, #publi:hover {
	width:125px;
}

.statuts, .statuts:hover {
	width:90px;
}

#exig, #exig:hover {
	width:107px;
}

#contact, #contact:hover {
	width:134px;
}

/* =============================== PARAMETRES COMMUNS AUX 2 MENUS =============================== */
#menu_1 li, #menu_2 li {
	float:left; /* Alignement horizontal des liens des menus */
	list-style-type:none; /* Annulation des puces cr??es par d?faut par les balises de liste */
}

/* =============================== MENU SECONDAIRE =============================== */
#menu_2 * {
	font:bold 11px Arial, Verdana, Helvetica;
	color:#000;
	background:url(images/points.jpg) repeat-x top;
}

#menu_2 h5 {
	width:200px;
	height:15px;
}

#menu_2 a {
	height:12px;
	padding:5px 0 5px 15px; /* Centrage vertical du texte des liens + d?calage vers la droite */
	display:block;
}

#menu_2 a:hover {
	height:12px;
	padding:5px 0 5px 25px; /* Centrage vertical du texte des liens + augmentation du d?calage vers la droite, cela cr?e un petit effet sympa au survol */
	display:block;
	background:url(images/points.jpg) repeat-x bottom;
}

/* =============================== SOUS-MENU DU MENU SECONDAIRE =============================== */
.sous-menu img {
	width:11px;
	height:10px;
}

ul ul {
	display:none; /* Toute balise <ul> comprise dans une autre balise <ul> sera invisible par d?faut */
	position:absolute;
	left:0;
	top:22px; /* Positionne le sous-menu juste en-dessous du bouton auquel il est rattach? */
	list-style-type:none;
}

li {
	height:22px;
	position:relative;
}

li:hover ul.sous-menu, li.sfhover ul.sous-menu {
	width:200px;
	display:block;
}

#fil_Arianne h5 {
	width:80px;
	height:22px;
	margin:0;
}

#page_actuelle {
	width:520px;
	height:12px;
	margin:0;
	padding:5px 0;
}

#fil_Arianne a {
	height:12px;
	padding:5px 0 5px 12px; /* Centrage vertical du texte des liens + d?calage vers la droite */
}

#fil_Arianne a:hover {
	height:12px;
	padding:5px 0 5px 12px; /* Centrage vertical du texte des liens + augmentation du d?calage vers la droite, cela cr?e un petit effet sympa au survol */
	color:#ec880e;
}

/* =============================== CONTENU GENERAL =============================== */
#contenu {
	height:auto;
	font:normal 12px Arial, Verdana, Helvetica;
}

#contenu .blocCentral {
	width:600px;
	height:auto;
	margin:0 200px;
	padding:0;
}

/* =============================== CONTENU INDEX =============================== */
.colonne {
	width:190px;
	height:auto;
	padding:5px;
	float:left;
}

/* =============================== CONTENU EDITORIAL =============================== */
#edito {
	width:560px;
	height:auto;
	padding:20px;
	font:normal 12px Arial, Verdana, Helvetica;
	color:#333;
}

#edito img {
	width:74px;
	height:100px;
	padding:0 10px 0 0;
	float:left;
}
#edito h4{
	font-size: 12px;
	padding: 0px;
	margin: 0px;
	display: block;
	width: 100%;
}
/* =============================== CONTENU RESPONSABLES =============================== */
#respo {
	width:560px;
	height:auto;
	padding:20px;
	font:normal 12px Arial, Verdana, Helvetica;
	color:#333;
}

div#respo img {
	width:11px;
	height:10px;
	padding:0 10px 0 0;
	float:left;
}

#respo .colonne {
	width:176px;
	height:auto;
	padding:5px;
	float:left;
}

#respo .colonne_2 {
	width:204px;
	height:auto;
	margin:0 5px;
	float:left;
}

#respo .separateur {
	width:1px;
	height:30px;
	margin:0 60px 30px 60px;
	background:#ec880e;
	float:left;
}

/* =============================== CONTENU STATUTS =============================== */
#contenu .statuts {
	width:560px;
	height:auto;
	padding:20px;
	font:normal 12px Arial, Verdana, Helvetica;
	color:#333;
}

.statuts li {
	padding:5px;
	list-style-type:none;
}

.statuts img {
	width:11px;
	height:10px;
	margin:0 10px 0 0;
	float:left;
}

/* =============================== CONTENU EXIGENCES =============================== */
#exigences {
	padding:0 10px;
	list-style-type:none;
}

#exigences li {
	padding:10px;
	list-style-type:none;
}

#exigences img {
	width:11px;
	height:10px;
	margin:0 10px 0 0;
	float:left;
}

.realign { /* R?alignement des ?l?ments suivants sous les ?l?ments flottants */
	clear:both;
	height: 0px;
}

#pied_page {
	margin-top: 15px;
	width:1000px;
	height:22px;
	background:url(images/pied_page.jpg) repeat-y;
}
.formulaire_ad,.blocCentral p {
	width: 550px;
	margin:  21px 0px 0px 26px;
}
.formulaire_ad label{
	display: block;
	width: 129px;
	float: left;
	padding-top:  2px;	
}
.formulaire_ad input{
	display: block;
	margin-bottom: 15px;
	float: left;
	margin-right: 200px;
	width: 161px;
	height: 14px
}
.formulaire_ad textarea{
	float: left;
	width: 253px;
	height: 113px
}
#btn_submit{
	display: block;
	width: 64px;
	height: 13px;
	background: url(images/envoyer.gif);
	border: none;
	float: right;
	margin-top: 15px;
}
.rubrique{
	float: left;
	width: 169px;
	height: 180px;
	padding: 0px 15px;
	border-right: dotted 1px black
}
.rubrique b{
	margin-top: 15px;
	display: block;
}
.cache *,.cache{
	display: none;
}
.blocCentral table {
	border: none;
}
.blocCentral table tbody tr td{
	padding: 16px;
	width: 33%;
	border-right: 1px dotted black;
}
#titre_revendication{
	display: block;
	margin-bottom: 5px;
}
p#contenu_revendication{
	display: block;
	float: none;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 5px 0px;
}
div#edito div p{
	padding: 15px 0px 0px 0px;
	margin: 0px;
}