body
{
   width: 760px;
   margin: auto; /* Pour centrer la page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. */
   margin-bottom: 20px;    /* Pour éviter de coller avec le bas du navigateur */
   background-color: #5E6378; /* Ou pour une image de fond : background-color: url("images/fond.png"); */
}

/* L'en-tête */

#en_tete
{
   width: 760px;
   height: 20px;
   margin-bottom: 20px;
   background-color: #0099CC;
   color: #FFFFFF;
   font-family: Tahoma, Arial;
   font-size: 15px;
   text-align: center;
}

.element_en_tete a /* Tous les liens se trouvant dans le menu */
{
   color: #FFFFFF;
   font-weight: bold;
   text-decoration: none;
}

.element_en_tete a:hover /* Lien pointé du menu */
{
   color: #FF3333;
   font-weight: bold;
}

/* Le menu */

#menu
{
   float: left; /* Pour que le menu flotte à gauche */
   width: 160px; /* Donne sa taille au menu */
}

.element_menu
{
   background-color: #0099CC;
   border: 1px dashed #009900; /* 1 pixel d'épaisseur, en tirets */
   margin-bottom: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
}

.element_menu h3 /* Tous les titres de rubriques de menus */
{    
   font-family: Tempo Grunge, Arial;
   font-size: 13px;
   text-align: left;
   padding-left: 2px;
   padding-top: 2px;
   padding-bottom: 5px;
   margin: 0px;
}

.element_menu h4 /* Tous les titres d'articles se trouvant dans un menu */
{
   padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 10px; /*Mais la marge intérieure de gauche doit faire 10 pixels */
   margin: 0px; /* Tous les côtés ont une marge extérieure de 0 pixels */
   font-family: Tempo Grunge, Arial;
   font-size: 12px;
   text-align: left;
}

.element_menu a /* Tous les liens se trouvant dans le menu */
{
   color: #333399;
   text-decoration: none;
}

.element_menu a:hover /* Lien pointé du menu */
{
   color: #FF3333;
}

/* Le corps de la page */

#corps
{
   margin-left: 180px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 20px; /* 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 */
   color: #FFFFFF;
   font-family: Trebuchet ms, Arial;
   font-size: 13px;
   text-align: justify;
   border: 1px dashed #009900; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

.element_corps a /* Tous les liens se trouvant dans le corps */
{
   color: #FFFF00;
   text-decoration: none;
}

.element_corps a:hover /* Lien pointé du corps */
{
   color: #FF3333;
}

#corps h1 /* Tous les titres h1 du corps */
{
   color: #009900;
   font-family: Trebuchet ms, Arial;
   font-size: 17px;
   font-weight: bold;
   text-align: center;
}

#corps h2 /* Tous les titres h2 du corps */
{
   color: #009900;
   font-family: Trebuchet ms, Arial;
   font-size: 15px;
   text-align: center;
}

#corps h5 /* Tous les textes h5 du corps */
{
   color: #FFFFFF;
   font-family: Trebuchet ms, Arial;
   font-size: 13px;
   text-align: center;
   padding-left: 320px;
}

#corps h6 /* Tous les textes h6 du corps */
{
   color: #FFFFFF;
   font-family: Trebuchet ms, Arial;
   font-size: 13px;
   text-align: justify;
   padding-left: 320px;
}

#date
{
   color: #000000;
   font-family: Arial;
   font-size: 9px;
   text-align: right;
}

/* Le pied de page */

#pied_de_page
{
   clear: both;
   padding: 0px;
   background-color: #0099CC;
   color: #FFFFFF;
   font-family: Tahoma, Arial;
   font-size: 10px;
   text-align: center;
}