body
{
   text-align: justify;
   text-indent: 30px;
   font-style: normal;
   font-weight: normal;
   font-family: "Trebuchet MS", Georgia, serif; 
   width: 800px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */
}


/* L'en-tête */

#en_tete
{
   width: 800px;
   height: 188px;
   background-image: url("images/ban.png");
   background-repeat: no-repeat;
   margin-bottom: 10px;
}

#menu
{
   float: left; /* Le menu flottera à gauche */
   width: 400px; /* Très important : donner une taille au menu */
}

.element_menu
{
   border: 1px solid black;
   margin-top: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-bottom: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-left: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   background-color: rgb(250,250,250);
   border: 1px solid grey;
   margin-right: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   padding-right: 20px;
}

.element_menu a
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   color: black; /* Les liens seront en rouge au lieu de bleu */
   font-style: normal; /* Les liens seront en italique (pourquoi pas ?) */
}
.element_menu a:hover /* Quand le visiteur pointe sur le lien */
{
   text-decoration: none; /* Le lien deviendra pas souligné quand on pointera dessus */
   color: red; /* Le lien sera écrit en vert quand on pointera dessus */
    font-weight: normal; /* Les liens seront en italique (pourquoi pas ?) */
}
#menu h4
{   
   color: black;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}

/* Le corps de la page */

#corps
{
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   
   background-image: url("images/degrad.png");
   background-repeat: repeat-y; /* Une petite image de fond qui se répètera horizontalement en haut */
   
   border: 0px; /* Pas de bordures */
}

#pied_de_page
{
   padding: 5px;
   text-align: right;
   font-size:small;
   color: grey;
   background-color: rgb(255,255,255);
   
}

#pied_de_page a
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   color: grey; /* Les liens seront en rouge au lieu de bleu */
   font-style: normal; /* Les liens seront en italique (pourquoi pas ?) */
}

#pied_de_page a:hover
{
   text-decoration: none; /* Le lien deviendra pas souligné quand on pointera dessus */
   color: black; /* Le lien sera écrit en vert quand on pointera dessus */
    font-weight: normal; /* Les liens seront en italique (pourquoi pas ?) */
}

h1, h2, h3, h4, h5, h6
{
   text-align: center;
}

dt
{
   font-weight: bold;
}

dd
{
   font-style: italic;
   font-size:small;
}
.puce
{
   list-style-type: circle;
 }
.img
{
   text-align: center;
}

div
{
   text-align: justify;
   font-style: normal;
   font-weight: normal;
   text-indent: 0px;
   font-family: "Trebuchet MS", Georgia, serif; 
   font-size:small;
}
a
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   color: blue; /* Les liens seront en rouge au lieu de bleu */
}
a:hover /* Quand le visiteur pointe sur le lien */
{
   text-decoration: none; /* Le lien deviendra pas souligné quand on pointera dessus */
   color: red; /* Le lien sera écrit en vert quand on pointera dessus */
}

p:first-letter /* La première lettre de chaque paragraphe */
{
   font-weight: bold; /* En gras */
   font-size: 1.2em; /* Ecrit légèrement plus gros que la normale */
   color: blue; /* En bleu */
}
p
{
   text-indent: 20px;
}
em
{
}


strong
{
   color: black;
   font-weight: bold;
}

.important
 {
 font-weight: bold; /* En gras */
   font-size: 1.2em; /* Ecrit légèrement plus gros que la normale */
   color: blue; /* En bleu */
}

.insert1
{
   width: 70%;
   height: 180px;
   overflow: center;
   background-color: rgb(230,230,230); /* Le fond de la page sera noir */
   text-align: justify;
   color: black;
   font-size: small;
   margin: auto; /* Pour centrer notre page */
   margin-top: 50px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-bottom: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-left: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-right: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
   padding-right: 20px;
   
}

.insert2
{
   width: 700px;
   height: 500px;
   overflow: auto;
   background-color: rgb(230,230,230); /* Le fond de la page sera noir */
   text-align: justify;
   color: black;
   font-size: small;
   margin: auto; /* Pour centrer notre page */
}


.insert4
{
   width: 700px;
   height: 220px;
   overflow: auto;
   background-color: rgb(230,230,230); /* Le fond de la page sera noir */
   text-align: justify;
   color: black;
   font-size: small;
   margin: auto; /* Pour centrer notre page */
}

.insert5
{
   width: 700px;
   height: 800px;
   overflow: auto;
   background-color: rgb(230,230,230); /* Le fond de la page sera noir */
   text-align: justify;
   color: black;
   font-size: small;
   margin: auto; /* Pour centrer notre page */
}


.legend
{  
   font-size:small;
   text-align: center;
}

.legendred
{  
   color: red; /* En bleu */
   font-size:small;
   text-align: center;
}

.police
{  
   color: rgb(100,100,100); /* En bleu */
   font-family:Arial;
   font-size: 0.9em;
}
.police:first-letter
{  
   color: blue; /* En bleu */
}
.legend:first-letter
{  
   color: black; /* En bleu */
   font-size:small;
   text-align: center;
}
.encart
{
      font-family:Arial;
	  font-size: 0.85em; /* Ecrit légèrement plus gros que la normale */
	  color:  rgb(100,100,100); /* En bleu */
}


table
{
   border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
   margin-top: 5px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-bottom: 5px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-left: 5px; /* Pour éviter que les éléments du menu ne soient trop collés */
   background-color: rgb(250,250,250);
   margin-right: 5px; 
}
td, th
{
   border: 1px solid black;
}