html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
}

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	background-color: #FFFFEC;
}

#conteneur {
	position: relative;
	width: 100%;
	height: 100%;
}


#haut {
	position: absolute;
	left: 195px;
	width: 805px;
	margin: 0px;
	padding: 0px;
}

#centre {
	margin-left: 195px;
	margin-top: 0px;
	width: 80%;
	padding-top: 60px;
	padding-bottom:40px;
	margin-bottom: 0px;
}

#gauche {
	position: absolute;
	left:0;
	top: 0;
	width: 195px;
	background: url(../images/bouton.jpg) repeat-y top left;
	height: 100%;
}

p {
	margin: 0px;
	padding: 0px;
}


/* ------------ ENTETE ----------------- */
#entete, #entete ul {height: 10px;margin : 0;}

#entete{position:absolute;top:-100px;left:2px;}

#entete a:active, #entete a:focus{
	position: absolute;
	top: 146px;
	left: 0px;
}

#entete ul {width : 195px;margin : 0;padding : 5px;}

#entete li {width : 195px;list-style : none;margin : 0;}

#entete li a {
	display: block;
	padding: 0;
	text-decoration: none;
	color: #000;
	background-color: #FFFFEC;
	font-size: 0.8em;
	width: 195px;
}

#entete li a:hover {text-decoration :underline;}

/*
*************************************** Mise en page des menus : rubriques->sous rubriques->sous sous rubriques->pages
*/

/*
*************************************** Menu des RUBRIQUES
*/

ul.rubrique{
	position: absolute;
	margin: 0px;
	padding: 0px;
	font-size: 0.85em;;
	list-style-type: none;
	width: 100%;

}

ul.rubrique li {
	float: left;
	background-color: #CCCA99;
	text-align: center;
	width: 25%;
	height: 2.5em;
}

ul.rubrique li a{
	text-decoration: none;
	color: #066;
}

ul.rubrique li.selected {
	background-color: #FCC;
}

ul.rubrique li.selected a {
	padding-left: 11px;
	color: #900;
	background: url(../images/bouletteOr8.gif) no-repeat left center;
	font-weight: bold;
}


/*
*************************************** Menu des SOUS RUBRIQUES
*/


ul.srubrique1, ul.srubrique2 {
	background-color: #FED;
	position: absolute;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	top: 2.5em;
	width: 100% !important;
	width: 400%;
	left: 0px;
}

ul.rubrique li.selected ul.srubrique3 {
	visibility: hidden;
	height: 0px;
}

ul.srubrique1 li, ul.srubrique2 li {
	background-color: #FED;
	height: 100%;
	padding: 0px;
	margin: 0px;
}

ul.srubrique1 li.selected, ul.srubrique2 li.selected {
	background-color: #FCC;
}

ul.srubrique1 li {
	width: 14.20%;
}

ul.srubrique2 li {
	width: 11.10%;
}

ul li.selected ul.srubrique1 li a, ul li.selected ul.srubrique2 li a {
	color: #066;
	font-weight: normal;
	background-image: none;
}

ul li ul.srubrique1 li.selected a, ul li ul.srubrique2 li.selected a {
	color: #900;
	background: url(../images/bouletteOr8.gif) no-repeat top left;
	font-weight: bold;
}

/*
*************************************** Gestion des SOUS SOUS RUBRIQUES (dans le menu de gauche)
*/

ul li.selected ul li.selected ul.ssrubrique, ul li.selected ul.srubrique3 li.selected ul.ssrubrique {
	visibility: visible;
	position: absolute;
	top: 70px;
	left: -190px;
	margin: 0px;
	padding: 0px;
	width: 185px;
}

ul li.selected ul li.selected ul.ssrubrique li {
	width: 185px;
	padding: 0px;
	margin-left: 0px;
	text-align: left;
	list-style: none;
}

ul li.selected ul li.selected ul.ssrubrique li.selected {
	/*background-color: none;*/
}

ul li.selected ul li.selected ul.ssrubrique li a {
	background: none;
	display: block;
	margin-left: 13px;
	padding-left: 7px;
}

ul li.selected ul li.selected ul.ssrubrique li.selected a {
	background: url(../images/bouletteOr8.gif) no-repeat top left;
	display: block;
	margin-left: 15px;
	padding-left: 10px;
}

/*
*************************************** Gestion des PAGES (dans le menu de gauche)
*/

ul li.selected ul li.selected ul li.selected ul.page {
	position: relative;
	background: none;
	margin: 0px;
	padding: 0px;
	/*background-color: yellow;*/
	width: 175px;
	left: 11px !important;
	left: 7px;
}

ul li.selected ul li.selected ul li.selected ul.page li {
	width: 169px !important;
	width: 168px;
	margin-left: 5px;
	padding-left: 0px;
	list-style: none;
	background: url(../images/carre.gif) no-repeat center left;
	background-color: #FF9999;
}

ul li.selected ul li.selected ul li.selected ul.page li.selected {

}

ul li.selected ul li.selected ul li.selected ul.page li a {
	background-image: none;
	display: block;
	font-weight: normal;
	color: #066;
	margin-left: 3px;
}


ul li.selected ul li.selected ul li.selected ul.page li.selected a {
	display: block;
	font-weight: bold;
	color: #900;
}

.couleur1, .couleur2, .couleur3, .couleur4, .couleur5, .couleur6, .couleur7, .couleur8, .couleur9, .couleur10, .couleur11, .couleur12, .couleur13, .couleur14, .couleur15, .couleur16, .couleur17, .couleur18 {
	padding: 0px;
	margin-right: 3px;
	width: 15px;
	float: left;
	text-align: center;
}
.couleur1, .couleur13 {background-color: #FF9999;}
.couleur2, .couleur14 {background-color: #FF6666;}
.couleur3, .couleur15 {background-color: #FF9933;}
.couleur4, .couleur16 {background-color: #CCCC99;}
.couleur5, .couleur17 {background-color: #999999;}
.couleur6, .couleur18 {background-color: #FFCCCC;}
.couleur7, .couleur19 {background-color: #FF6699;}
.couleur8, .couleur20 {background-color: #99CCFF;}
.couleur9, .couleur21 {background-color: #999900;}
.couleur10, .couleur22 {background-color: #009933;}
.couleur11, .couleur23 {background-color: #339999;}
.couleur12, .couleur24 {background-color: #CC9999;}


/*
*************************************** Lien de retour vers la page d'accueil
*/

h1.accueil {
	margin: 0 auto;
	margin-top: 1.1em;
	width: 80%;
	font-size: 1.1em;
	font-weight: normal;
	padding: 0.2em 0;
	border-top: 1px solid #900;
	border-bottom: 1px solid #900;
}

h1.accueil a {
	text-decoration: none;
	color: #900;
}

/*
*************************************** Chemin de visite
*/
p.chemin {
	font-size: 0.7em;
	padding-top: 0.7em;
	padding-left: 10px;
	background: url(../images/carre.gif) left center no-repeat;
}

p.chemin a{
	color: #900;
	font-weight: bold;
	text-decoration: none;
}

/*
*************************************** Contenu
*/

h2.rappel_titre_page {
	text-align: center;
	width: 80%;
	margin: 1.5em auto 1em auto;
	padding: 0.3em;
	border-top: 1px solid #900;
	border-bottom: 1px solid #900;
	font-size: 0.7em;
	color: #900;
	font-weight: bold;
}

#contenu {
  /*position: relative;*/
	color: #036;
	/*font-size: 0.85em;*/
	width: 80%;
	margin: 0 auto;
	/*height: 80%;
	bottom: 20px;
	top: 0px;*/
}

#contenu h2 {
	font-size: 1.2em;
}


#modele1 ul li, #modele8 ul li {
	margin: 1em 0;
}

.animation {
	text-align: center;
}

.premier {
	width: 45%;
	float: left;
	margin: 0px;
	padding: 2%;
}

.deuxieme {
	width: 45%;
	padding: 2%;
	margin: 0px 0px 0px -1px;
	float: left;
}

.deuxieme p {
	text-align: center;
}

.texte_trois {
	width: 50%;
	float: left;
}

.image_trois {
	margin-left: 20px;
	float: left;
	text-align: center;
}

.image_trois p {
	padding-bottom: 30px;
}

#pied {
  margin-left: 195px;
	width: 80%;
  font-size: 0.85em;
  margin-bottom: 0px;
  padding: 0px;

}

#real {
	text-align: left;
}