body
{
   width: 760px;
   margin-left: 0px; /* Pour centrer notre page */
   margin-top: 0px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 0px;    /* Idem pour le bas du navigateur */
   FONT-FAMILY: Comic Sans MS, Verdana, Arial, Helvetica, sans-serif; 
   FONT-SIZE: 10pt; 
   color: #011F2D; /* colore le texte de la page en bleu foncé */
   background-image: url("images/fond.png"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */
/* pour colorer le haut et le bas de la page */
   BORDER-BOTTOM: #063D56 ridge 6px;
   BORDER-TOP: #063D56 ridge 6px;
/* pour colorer la barre de défilement */
   scrollbar-face-color: #A50F00; 
   scrollbar-shadow-color: #000000;
   scrollbar-highlight-color: #FFFFFF;
   scrollbar-3dlight-color: #000000; 
   scrollbar-darkshadow-color: #000000; 
   scrollbar-track-color: #021924; 
   scrollbar-arrow-color: #F8BD21;
}


/* Le menu */

#menu
{
   float: left; /* Le menu flottera à gauche */
   width: 152px; /* Très important : donner une taille au menu */
   position: relative;
   left: 2px;
   top: 0px;
}

.element_menu
{
   background-color: #8B0403; /* colore le fond du menu en rouge vin */
   background-image: url("images/fond01.png");
   border: 1px dashed;
   color: #011F2D; /* colore la bordure du menu */
   margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
}


/* Quelques effets sur les menus */

.element_menu h3 /* Tous les titres de menus */
{    
   color: #C4F2F6; /* colore le titre du menu en bleu pâle */
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}

.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("images/puce.gif"); /* On change l'apparence des puces */
   padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 18px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 18 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 */
}

.element_menu a /* Tous les liens se trouvant dans un menu */
{
   color: #011F2D; /* bleu foncé */
}



a:link {
	COLOR:#011F2D; /* bleu foncé */
	text-decoration: none;
	FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; 
        FONT-SIZE: 10pt; 
        FONT-STYLE: normal; 
        LINE-HEIGHT: normal;
}
.element_menu a:hover {
	border-top-style: dashed;
	border-bottom-style: dashed;
	border-top-width: 1px;
	border-bottom-width: 1px; 
	text-decoration: none; 
	color: #000000; 
	background-color: #C4F2F6; /* colore le fond des liens du menu en bleu pâle */
	FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; 
        FONT-SIZE: 10pt; 
        FONT-STYLE: normal; 
        LINE-HEIGHT: normal;
	
}
a:visited {
        color: #C4F2F6; /* bleu pâle */
	text-decoration: none;
        FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; 
        FONT-SIZE: 10pt; 
        FONT-STYLE: normal; 
        LINE-HEIGHT: normal;
}



/* Le corps de la page */

a:link 
{
   COLOR: #FFFD40; /* colore le texte des liens dans le menu en jaune */
   text-decoration: none;
}

a:hover 
{ 
   COLOR: #011F2D; /* bleu foncé */
   text-decoration: none; 
   border-bottom-style:dashed; 
   border-bottom-width: 1px;
   border-top-style:dashed; 
   border-top-width: 1px;
   background: #C4F2F6; /* bleu pâle */
}


#corps
{
   margin-left: 0px;
   margin-bottom: 0px;
   padding: 0px;
   padding-left: 0px;
   padding-right: 0px;
   color: #011F2D; /* colore le texte de la page en bleu foncé */
   background-color: #E9F7F9; /* bleu du centre de la page */
   background-image: url("images/centre.png");
   position: relative;
   width: 700px
}


#corps h1 /* Tous les titres h1 du corps */
{
   height: 30px;
   background-image: url("images/titre.png"); /* Une petite image de fond sur les titres h2 */
   background-repeat: no-repeat; /* L'image ne se répètera pas, elle sera à gauche du titre */
   position: relative;
   left: 0px; /* Place l'image à 0px au bord de la page */
   top: 0px; /* Place l'image à 0px du haut de la page */
   text-align: left;
   FONT-FAMILY: Comic Sans MS, Verdana, Arial, Helvetica, sans-serif; 
   font-size: 25px; /* Titres de 25 pixels */
   font-style: italic; /* Les titres h2 seront en italique */
   padding-left: 0px; /* Place le titre à 0px du bord de la page */
   color: #011F2D; /* colore les titres en bleu foncé */
}


#corps h2 /* Tous les titres h2 du corps */
{
   height: 30px;
   text-align: left;
   FONT-FAMILY: Comic Sans MS, Verdana, Arial, Helvetica, sans-serif; 
   font-size: 20px; /* Titres de 20 pixels */
   font-style: italic; /* Les titres h2 seront en italique */
   text-indent: 20px; /* Pour décaler les titres h2 de 20px */
   padding-left: 0px; /* Place le titre à 0px du bord de la page */
   color: #9DA0AB; /* colore les titres en gris */
}

#corps h3 /* Tous les titres h3 du corps */
{
   height: 30px;
   text-align: left;
   FONT-FAMILY: Comic Sans MS, Verdana, Arial, Helvetica, sans-serif; 
   font-size: 16px; /* Titres de 16 pixels */
   font-style: italic; /* Les titres h3 seront en italique */
   text-indent: 16px; /* Pour décaler les titres h3 de 16px */
   padding-left: 0px; /* Place le titre à 0px du bord de la page */
   color: #9DA0AB; /* colore les titres en gris */
}






