body
{
   width: 900px; /* pour ceux qui ont un ptit écran */
   margin: auto;
   margin-top: 20px;
   margin-bottom: 20px; 
   background-image: url("../imagessite/robot-chef-fond.jpg");
   background-attachment: fixed; /* Le fond restera fixe */
}
/* L'en-tête */
#en_tete
{
   width: 760px;
   height: 100px;
   background-repeat: no-repeat; /* Le logo sera unique */
   margin-bottom: 10px;
}
/* Le menu */
#menu
{
   float: left; /* Le menu flottera à gauche */
   width: 175px; /* Très important : donner une taille au menu */
   color: #208000; /* orange pour autres rubriques en construction */
 }
.element_menu
{
   border: 4px ridge #20a060;  /* une bordure moyenne pr entourer chq élt du menu  */
   margin-bottom: 9px; /* Pour éviter que les éléments du menu ne soient trop collés */
   padding-right: 7px; /* Pour éviter que les éléments du menu ne soient trop collés */
   font-size: 17px;
   background-image: url("../germs/images-germs/treillis.jpg");
}
/* Le corps de la page */
#corps
{
   margin-left: 180px; /* Une marge à gauche sup à la largeur du menu, pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 10px; /* 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 */
   border: 3px ridge #20a060; /* Une bordure fine pour bien marquer les limites du corps */
   background-image: url("../imagessite/robot-fond-carreau.jpg");
}
p
{
   color: black;
   font-size: 16px;
   font-family: "Comic Sans MS", Verdana, Georgia, serif; 
   text-align: justify; /* Le paragraphe sera justifié */
   text-indent: 0px; /* Les paragraphes ne seront pas indentés */
   padding: 9px; /* Marge intérieure de 12px */
}
.pasindent
{
text-indent: 0px; /* Les paragraphes ne seront pas indentés */
}
.indent
{
   text-indent: 30px; /* Le texte commence 30 pixels sur la droite */
   text-align: justify; /* Le paragraphe sera justifié */
   padding: 12px; /* Marge intérieure de 12px */
}
h1
{
   color: #008000;
   font-size: 35px;
}
h2
{
   color: #20a040;
   font-size: 35px;
}
h3
{
   color: #00882f;
   font-size: 24px;
}
h4
{
   color: #005d00;
   font-size: 20px;
   text-decoration: underline;
}
h5
{
   color: #20a010;
   font-size: 18px;
   text-align: center;
   font-style: italic; /* en italique ! */
}
h6
{
   color: #00982f;
   font-size: 16px;
}
li
{
   color: black;
   font-size: 16px;
   font-family: "Comic Sans MS", Verdana, Georgia, serif; 
}
.reduit
{
   font-size: 16px;
   color: #40c040;
   text-align: center;
}
.gras  /* du réduit qui est gras */
{
   font-size: 16px;
   color: #40c040;
   font-weight: bold;
}
.tresreduit  /* from, tofu pain du menu */
{
   font-size: 13px;
}
em
{
   font-size: 18px;
   font-style: italic; /*  em seront en italique ! */
   font-family: Georgia, "Trebuchet MS", "Arial Black", Arial, serif;
}
h1, h2, h3, h4, h5, h6
{
   font-family: Georgia, "Trebuchet MS", "Arial Black", Arial, serif;
   padding: 10px; /* Marge intérieure de 12px */
}
h1, h2, h3
{
   text-align: center; /* Pour centrer les titres h1, h2, h3*/
}
.navig
{
   text-align: center; /* Pour centrer les flèches de navigation en bas */
}
h3 a
{
   font-size: 20px;
   text-transform: capitalize; /* Les premières lettres des mots du lien dans titre h3 contenus dans un lien seront en majuscules */
}
a
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   font-size: 17px;
   font-family: Georgia, Garamond, "Comic Sans MS", serif;
   color: #078f07;
}
a:hover /* Quand le visiteur pointe sur le lien */
{
   text-decoration: underline; /* Le lien deviendra souligné quand on pointera dessus */
   color: #006026; /* Le lien prendra la couleur  quand on pointera dessus */
}
h3 a:hover /* Quand on pointe sur un titre h3 */
{
   text-decoration: underline; /* Le lien titre h3 "Le levain" deviendra souligné quand on pointera dessus */
   color: #20a040; /* Le lien h3 "Le levain" sera écrit en bleu foncé quand on pointera dessus */
   text-transform: capitalize; /* Les premières lettres des mots du titre seront en majuscules */
}
li a:hover /* Quand on pointe sur un li */
{
   color: #20a040; /* Le li sera écrit en foncé quand on pointera dessus */
}
a:visited /* Quand le visiteur a déjà vu la page concernée */
{
  color: #265d26; /* Le lien sera écrit en moyen quand on aura déjà vu le lien */
} 

a img /* Toutes les balises img contenues dans un lien a  */
{
   border: none; /* Pas de bordure aux images-liens */
}
h2 /* Tous les titres h2 auront une ligne de séparation épaisse dessous  */
{
   border-bottom: 4px ridge #20a060;
}
.imageflottanteleft
{
   float: left;
   margin-right: 20px; /* Qu'il y ait une marge de 20px à droite pour que ça colle pas trop au texte */
   margin-bottom: 15px; /* Qu'il y ait une marge de 15px dessous pour que ça colle pas trop au texte */
}
.imageflottanteright
{
   float: right;
   margin-left: 20px; /* Qu'il y ait une marge de 20px à gauche pour que ça colle pas trop au texte */
   margin-bottom: 15px; /* Qu'il y ait une marge de 15px dessous pour que ça colle pas trop au texte */
} 
.dessous /* Je veux que le texte revienne dessous l'image flottante */
{
   clear: both;
}
h2:first-letter /* Je veux que la première lettre de mes titres h2, titres en haut du corps soient lettrines... */
{
   font-size: 1.1em; /* Fasse une hauteur de 1,25 ligne */
   font-weight: bold; /* Soit écrite en gras */
   color: #208040;
   font-family: Georgia, Garamond, "Comic Sans MS", serif;
}
h1:first-letter /* Je veux que la première lettre de mes titres h1... */
{
   font-size: 1.35em; /* Fasse une hauteur de 1,4 ligne */
   font-weight: bold; /* Soit écrite en gras */
   color: #008040;
   font-family: Georgia, Garamond, "Comic Sans MS", serif;
}
.signature
{
  text-align: right; /* Pour aligner à droite ma signature */
}
#corps
{
   margin-left: 180px; /* 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: 10px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   border: 3px ridge #a0a0ff; /* Une bordure fine pour bien marquer les limites du corps */
}
.centre
{
   text-align: center; /* Pour centrer */
}
.fine
{
   font-size: 15px;
   font-family: Verdana, "Comic Sans MS", Georgia, serif; 
}
ul /* Ma liste aura des puces en forme de puces clignotantes*/
{
   font-size: 16px;
   list-style-image: url("../imagessite/listv.gif");
   font-family: "Comic Sans MS", Garamond, Georgia, serif;
}
.strong
{ 
  font-weight: bold;
}
