body {
		width : 800px;
		margin : auto;
		background-color : #ABC7DB;
		font-size : 1.0em;
		font-family : Arial, "Arial Black", "Times New Roman", Times, serif;
		text-align : left;
	}	
h1 {
		background-color : #ABC7DB;
		color : #282A55;
		text-align:center;
		width :800px;
		height : 96px;
		padding-bottom:15px;
		background-image : url(Images/Bann01.jpg);
		background-repeat : no-repeat;
		background-position : top center;
	}
h1 span {
		display : none;
}

#menu {
	    float: left; /* Le menu flottera à gauche */
	    width: 180px; /* Très important : donner une taille au menu */
		border-width : 2px;
		/*border-left : 5px;*/
		border-color : #DAA520;
		background-color : #eaf1f6 ;
		border-style : solid;
		padding : 0px;
	}
	
#menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("Images/bull2_sky.gif"); /* On change l'apparence des puces */
   list-style-position : inside;
   padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 5px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   padding-right : 5px;
   margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
   margin-left : 10px;
   margin-right : 10px;
   background-color : #ffffff ;
}	

#menu h3 /* Tous les titres de menus */
{   
   padding : 0px;
   background-color : #eaf1f6 ;
   color: #5f93b8;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   font-style : italic;
   font-weight : normal;
   font-size : 1.1em;
   text-align: left;
   text-decoration : none;
   text-transform : capitalize;
   line-height : 1.1em;
   padding-left : 5px;
}
#menu h3 a /* Tous les liens se trouvant dans un menu */
{
   color : #5f93b8;
   text-decoration : none;
}
#menu h3 a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #5f93b8;
   color: #eaf1f6;
}

#menu ul a /* Tous les liens se trouvant dans un menu */
{
   color: #000000;
   text-decoration : none;
}

#menu ul a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #282a55;
   color: #aadddd;
}

#menu ul ul /* Toutes les sous-listes à puces se trouvant dans un menu */
{
   list-style-image: url("Images/bull3_sky.gif"); /* On change l'apparence des puces */
   padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}

#menu ul ul a /* Tous les liens se trouvant dans un menu */
{
   color: #282a55;
   text-decoration : none;
}

#menu ul ul a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #282a55;
   color: #aadddd;
}
#principal {
		background-color:#D7E5EF;
		border-width : 2px;
		/* border-left : 5px;*/
		border-color : #DAA520;
		border-style : solid;
		height : 100%;
		vertical-align : top;
		margin-left: 200px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
		margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
		padding: 0px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
		padding-bottom : 15px;
	}
	
.ligne_titre2 {
		border-top : 2px solid #D7E5EF;
		border-bottom : 2px solid #D7E5EF;
		color : #5c92b7;
		font-variant : small-caps;
	}	

.ligne_total1 {
		font-size : 1.1em;
		text-decoration : underline;
		border-top : 2px solid #D7E5EF;
	}	
.ligne_total2 {
		font-size : 0.9em;
		font-style : italic;
		color : #5c92b7;
		text-decoration : none;
		border-bottom : 2px solid #D7E5EF;
	}

.bloc_droite{
background-color:#F1F6FA;
color:#000099; /*5c92b7*/
margin : 5px;
margin-top:10px;
}

.bloc_droite em {
font-size : 0.8em;
font-style : italic;
color : #5c92b7;
}

.bloc_centre{
background-color:#ABC7DB;
color:#F1F6FA;
text-align : center;
font-style : italic;
font-weight : bold;
margin : 5px;
margin-top:10px;
}

.intro {
		font-style : italic;
		font-size : 1.1em;
	}

	
#principal a{
		color:#6497BA;
		text-decoration:none;
		font-style : italic;
}

#principal  a:hover{
		text-decoration : underline;
		letter-spacing : 1px;
	}

#principal h2 /* Tous les titres h2 du corps */
{
		font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
		background-image : url("Images/fond_menu.gif");
		background-repeat : repeat;
		Color : #DAA520;
		text-align : center;
		font-size : 1.4em;
		font-weight : bold;
		text-transform : uppercase;
		padding-top : 3px;
	}
	
#principal h3 {
		text-align : left;
		text-indent : 25px;
		font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
		font-weight : bold;
		font-variant : small-caps;
		color:#ffffff;
		font-size:1.2em;
		border-bottom:2px solid #5F93B8;
		margin:0;
		padding:0 0 0 30px;
		background:  url("Images/h1_droite.gif") #ABC7DB no-repeat 3px 3px;
		height:22px;
		line-height:22px;
}
	
#principal h3 a {
		Color : #ffffff;
		text-decoration : none;
	}
	
#principal h3 a:hover{
		letter-spacing : 1px;
	}

#principal p {
		text-align : justify;
		padding : 5px;
	}

	
#principal ul {
	list-style-image:url("Images/bull1_sky.gif");
	}

#principal ul ul {
	list-style-image:url("Images/bull2_sky.gif");
	}

#principal ul ul ul {
	list-style-image:url("Images/bull3_sky.gif");
	}

	
#footer {
height:22px;
background:url(images/fond_footer.gif);/*Image de fond du footer qui se répète*/
clear:both;
line-height:20px;
		color : #ffffff;
		text-align:center;
		width:100 %;
		padding-bottom:15px;
		padding: 5px;
		text-align: center;
}