/* ceci est le css pour la page des INFO2 */

/* couleurs :
949191 -> gris très foncé
c0c0c0 -> gris foncé
e5e5e5 -> gris
fefef7 -> gris clair
935725 -> marron foncé
f18d2d -> orange
ffd229 -> jaune
*/

body
{
   width: 800px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */
   font-family: "Trebuchet MS", Arial; /* serif; ,"Arial Black", Arial, Verdana, serif;*/
   background-color: #172534; /* couleur de fond*/
   background-image:url(fond.jpg);
   background-repeat: repeat-x;
}

/* L'en-tête */

#en_tete
{
   width: 800px;
   height: 200px;
   background-color: white; /* couleur de fond*/
   margin-bottom: 0px;
}

#en_tete div
{
   padding: 22px;
   color: #0c2c20;
   background-color: #e5e5e5;
   border: 0px solid #c0c0c0;
}

#en_tete h1 /* Tous les titres h1 du corps */
{
   color: #f18d2d;
   text-align: center;
   text-transform: uppercase;
   font-size: 28px;
}

#en_tete table /* Le tableau en lui-même */
{
   margin: auto; /* Centre le tableau */
}

#en_tete td /* Toutes les cellules des tableaux... */
{
   border: 0px solid black; /* ... auront une bordure de 1px */
}

/* Le menu */

#en_tete img
{
   padding-right: 0px;
   padding-left: 0px;
   border: 0px;
}


#menu
{
   float: center; /* Le menu flottera à droite */
   /*width: 800px; */ /* Très important : donner une taille au menu */
   width:100%;

   margin-top: 30px;
   margin-bottom: 0px; 
   background-color: #ffd229;
   border: 3px solid #ffd229; 
   border-right: 0px;
   border-left: 0px;
}

.element_menu
{
   text-align : center;
   width: 100px;
   border: 3px solid #ffd229; 
   border-left: 2px dotted #f18d2d; 
   background-color: #ffd229;
   padding-left: 10px;
   /*-moz-border-radius: 10px;   cadre arrondi */
}

/* Quelques effets sur les menus */

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

.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #f18d2d;
   color: #935725;
}


/* Le corps de la page */

#corps
{
   margin-right: 0px;
   margin-bottom: 0px;
   padding: 10px; /* mages interieures */
   min-height: 350px;
   background-color: #e5e5e5;
   border: 0px solid black;
   font-size: 14px;
}

#corps a /* Tous les liens se trouvant dans le corps */
{
   color: #935725;
}

#corps a:hover /* Quand on pointe sur un lien dans le corps */
{
   background-color: #ffd229;
   color: #935725;
}

#corps div
{
   margin-right: 0px;
   margin-bottom: 10px;
   padding: 10px; /* mages interieures */
   padding-top: 0px;
   color: #0c2c20;
   background-color: #fefef7;
   border: 2px solid #c0c0c0;
   text-color:black;
   text-align:justify; /*texte justifié (prend toute la largeur de la page)*/
   border-radius: 10px; /* cadre arrondi */
}


#corps h1 /* Tous les titres h1 du corps */
{
   color: #f18d2d;
   text-align: center;
   /*font-family: serif, Arial, "Arial Black", "Times New Roman", Times, serif;*/
text-transform: uppercase;
}

#corps h2 /* Tous les titres h2 du corps */
{
   height: 30px;
   padding-left: 0px;
   padding-top: 0px;
   color: #f18d2d;
   text-align: left;
   text-transform: uppercase;
}

#corps h3 /* Tous les titres h2 du corps */
{
   height: 15px;
   padding-left: 0px;
   padding-top: 0px;
   color: #f18d2d;
   text-align: left;
   text-transform: uppercase;
}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
   padding: 5px;
   clear: both;

   text-align: center;

   color: #0c2c20;
   background-color: #e5e5e5;
   border: 2px solid #9ca7a3;
}

#pied_de_page img
{
   padding-right: 20px;
   border: 0px solid #9ca7a3;
}

