body
{
width: 850px;
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 */
background-color:white;
background-image:url(../image/fde_02.jpg);/*image de fond*/
background-attachment:fixed;/*fixed:image fixe derrière,scroll l'image défile avec le texte*/
background-repeat:repeat;/*no-repeat : le fond ne sera pas répété. L'image sera donc unique sur la page.  repeat-x : le fond sera répété uniquement sur la première ligne, horizontalement.   repeat-y : le fond sera répété uniquement sur la première colonne, verticalement.   repeat : le fond sera répété (par défaut).*/
background:url(../image/fde01.jpg) fixed repeat;
}


.puces
{
text-align:center;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-size:1em;
list-style-position:outside;/*  inside : la liste n'est pas mise en retrait.   outside : la liste est mise en retrait (par défaut).*/
list-style-type:none;    /* disc : un disque noir (par défaut).      circle : un cercle.  square : un carré.      none : aucune puce ne sera utilisée.      * decimal : des nombres 1, 2, 3, 4, 5... (par défaut)
    * decimal-leading-zero : des nombres commençant par zéro (01, 02, 03, 04, 05...). Ne fonctionne pas sur Internet Explorer
    * upper-roman : numérotation romaine, en majuscules (I, II, III, IV, V...)
    * lower-roman : numérotation romaine, en minuscules (i, ii, iii, iv, v...)
    * upper-alpha : numérotation alphabétique, en majuscules (A, B, C, D, E...)
    * lower-alpha : numérotation alphabétique, en minuscules (a, b, c, d, e...)
    * lower-greek : numérotation grecque. Ne fonctionne pas sur Internet Explorer
*/
list-style-image: url();
border:  black thin /* thin : bordure fine      medium : bordure moyenne   thick : bordure épaisse*/  
 solid /* none : pas de bordure (par défaut)  solid : un trait simple.        dotted : pointillés.         dashed : tirets        double : bordure double.
 groove : en relief. ridge : effet 3D. inset : autre effet 3D (on a l'impression que le block forme un creux). outset : encore un autre effet 3D (on a l'impression que le block est surélevé).*/
;
width:120px;/*la taille qu'occupe le texte soit en % soit en px*/
    /* min-width : largeur minimale
    * min-height : hauteur minimale
    * max-width : largeur maximale
    * max-height : hauteur maximale*/
height:277px;
overflow:visible;/*à utiliser si px*/ /* visible (par défaut) : si le texte dépasse les limites de taille, le block est agrandi de manière à ce que tout soit visible. C'est ce que nous venons de constater.
    * hidden : si le texte dépasse les limites, il sera tout simplement coupé. On ne pourra pas voir tout le texte.
    * scroll : là encore, le texte sera coupé s'il dépasse les limites. Sauf que cette fois, le navigateur mettra en place des barres de défilement pour qu'on puisse voir tout le texte. C'est un peu comme un cadre à l'intérieur de la page.
    * auto : mode "pilote automatique" :p. En gros, c'est le navigateur qui décide ou pas de mettre des barres de défilement (il en mettra si c'est nécessaire).*/
    
margin:0px; /* margin : indique la taille de la marge extérieure. Là encore, on utilise le plus souvent des pixels.*/
padding-left:0px;/* padding : indique la taille de la marge intérieure. A exprimer en général en pixels (px).*/
position:;
/* left : position par rapport à la gauche de la page.
# right : position par rapport à la droite de la page.
# top : position par rapport au haut de la page.
# bottom : position par rapport au bas de la page.*/

 margin-bottom: 0px; /* Pour éviter que les éléments du menu ne soient trop collés */
}

.sitem
{
text-align:center;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-size:1em;
list-style-position:outside;/*  inside : la liste n'est pas mise en retrait.   outside : la liste est mise en retrait (par défaut).*/
list-style-type:disc;    /* disc : un disque noir (par défaut).      circle : un cercle.  square : un carré.      none : aucune puce ne sera utilisée.      * decimal : des nombres 1, 2, 3, 4, 5... (par défaut)
    * decimal-leading-zero : des nombres commençant par zéro (01, 02, 03, 04, 05...). Ne fonctionne pas sur Internet Explorer
    * upper-roman : numérotation romaine, en majuscules (I, II, III, IV, V...)
    * lower-roman : numérotation romaine, en minuscules (i, ii, iii, iv, v...)
    * upper-alpha : numérotation alphabétique, en majuscules (A, B, C, D, E...)
    * lower-alpha : numérotation alphabétique, en minuscules (a, b, c, d, e...)
    * lower-greek : numérotation grecque. Ne fonctionne pas sur Internet Explorer
*/

}


.sitemap
{
text-align:left;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
list-style-position:outside;/*  inside : la liste n'est pas mise en retrait.   outside : la liste est mise en retrait (par défaut).*/
list-style-type:none;    /* disc : un disque noir (par défaut).      circle : un cercle.  square : un carré.      none : aucune puce ne sera utilisée.      * decimal : des nombres 1, 2, 3, 4, 5... (par défaut)
    * decimal-leading-zero : des nombres commençant par zéro (01, 02, 03, 04, 05...). Ne fonctionne pas sur Internet Explorer
    * upper-roman : numérotation romaine, en majuscules (I, II, III, IV, V...)
    * lower-roman : numérotation romaine, en minuscules (i, ii, iii, iv, v...)
    * upper-alpha : numérotation alphabétique, en majuscules (A, B, C, D, E...)
    * lower-alpha : numérotation alphabétique, en minuscules (a, b, c, d, e...)
    * lower-greek : numérotation grecque. Ne fonctionne pas sur Internet Explorer
*/
overflow:visible;/*à utiliser si px*/ /* visible (par défaut) : si le texte dépasse les limites de taille, le block est agrandi de manière à ce que tout soit visible. C'est ce que nous venons de constater.
    * hidden : si le texte dépasse les limites, il sera tout simplement coupé. On ne pourra pas voir tout le texte.
    * scroll : là encore, le texte sera coupé s'il dépasse les limites. Sauf que cette fois, le navigateur mettra en place des barres de défilement pour qu'on puisse voir tout le texte. C'est un peu comme un cadre à l'intérieur de la page.
    * auto : mode "pilote automatique" :p. En gros, c'est le navigateur qui décide ou pas de mettre des barres de défilement (il en mettra si c'est nécessaire).*/ 
margin:30px; /* margin : indique la taille de la marge extérieure. Là encore, on utilise le plus souvent des pixels.*/
padding-left:0px;/* padding : indique la taille de la marge intérieure. A exprimer en général en pixels (px).*/
 margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
}

.sitema
{
text-align:left;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
list-style-position:outside;/*  inside : la liste n'est pas mise en retrait.   outside : la liste est mise en retrait (par défaut).*/
list-style-type:none;    /* disc : un disque noir (par défaut).      circle : un cercle.  square : un carré.      none : aucune puce ne sera utilisée.      * decimal : des nombres 1, 2, 3, 4, 5... (par défaut)
    * decimal-leading-zero : des nombres commençant par zéro (01, 02, 03, 04, 05...). Ne fonctionne pas sur Internet Explorer
    * upper-roman : numérotation romaine, en majuscules (I, II, III, IV, V...)
    * lower-roman : numérotation romaine, en minuscules (i, ii, iii, iv, v...)
    * upper-alpha : numérotation alphabétique, en majuscules (A, B, C, D, E...)
    * lower-alpha : numérotation alphabétique, en minuscules (a, b, c, d, e...)
    * lower-greek : numérotation grecque. Ne fonctionne pas sur Internet Explorer
*/
overflow:visible;/*à utiliser si px*/ /* visible (par défaut) : si le texte dépasse les limites de taille, le block est agrandi de manière à ce que tout soit visible. C'est ce que nous venons de constater.
    * hidden : si le texte dépasse les limites, il sera tout simplement coupé. On ne pourra pas voir tout le texte.
    * scroll : là encore, le texte sera coupé s'il dépasse les limites. Sauf que cette fois, le navigateur mettra en place des barres de défilement pour qu'on puisse voir tout le texte. C'est un peu comme un cadre à l'intérieur de la page.
    * auto : mode "pilote automatique" :p. En gros, c'est le navigateur qui décide ou pas de mettre des barres de défilement (il en mettra si c'est nécessaire).*/ 
}
#en_tete
{
   width: 850px;
   height: 318px;
   background-image:url("../image/titre01.jpg");
   background-repeat: no-repeat;
   margin-bottom: 10px;
   margin:auto;
   
   
}
#menu
{
   float: left; /* Le menu flottera à gauche */
   width: 120px; /* Très important : donner une taille au menu */
height:277px;
background:url() fixed repeat;
background-color:white;
}



#corps
{
   margin-left:140px; /* 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: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   
   color: #B3B3B3;
   background-color:; /* Une couleur de fond pour le corps */
   background-image:;
   background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
   background:url() fixed repeat;
   background-color:white;
   border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#pied_de_page
{

background:url() fixed repeat;
   padding: 0px;
   text-align: center;
   color: ;
 background-color:white;
   background-image:;
   background-repeat: repeat-x;
   font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
   border:black thin;
}


.puces a /* Tous les liens se trouvant dans un menu */
{
   color: black;
}

.puces a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #B3B3B3;
   color: black;
 
}

.page3
{
text-align:left;/*permet de modifier l'emplacement du texte*/
color: black;/*permet de modifier la couleur du texte: white, silver, gray, black, red, maroon, lime vert fluo , green, yellow, olive, blue, navy bleu foncé , fuchsia, purple, aqua turquoise, teal bleu canard*/
font-size: médium;/*permet de modifier la taille de la police*/
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;/*permet de choisir la police*/
font-style:none;/*permet de mettre en italic*/
font-weight:bold;/*permet de mettre en gras*/
text-indent: 20px;/*permet de décaler les paragraphes*/
font-variant:normal;/*permet de mettre en majuscules mais avec small-caps */
text-transform:none;/*none:permet de laisser comme c'est.   capitalize:permet de mettre la première lettre de chaque mot en majuscule.     lowercase:tout le texte en minuscule.    uppercase :tout le texte en majuscules*/
text-decoration:none;/*none= normal.  blink=clignotant.  overline=ligne au-dessus.  line-through=barré.  underline=souligné.*/
}
.page3:hover
{
text-decoration:none;

}
.page3:focus,.page2:active,.page2:visited
{
color:rgb(70,70,70);
}


.page2
{
text-align:left;/*permet de modifier l'emplacement du texte*/
color: black;/*permet de modifier la couleur du texte: white, silver, gray, black, red, maroon, lime vert fluo , green, yellow, olive, blue, navy bleu foncé , fuchsia, purple, aqua turquoise, teal bleu canard*/
font-size: médium;/*permet de modifier la taille de la police*/
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;/*permet de choisir la police*/
font-style:none;/*permet de mettre en italic*/
font-weight:bold;/*permet de mettre en gras*/
text-indent: 20px;/*permet de décaler les paragraphes*/
font-variant:normal;/*permet de mettre en majuscules mais avec small-caps */
text-transform:none;/*none:permet de laisser comme c'est.   capitalize:permet de mettre la première lettre de chaque mot en majuscule.     lowercase:tout le texte en minuscule.    uppercase :tout le texte en majuscules*/
text-decoration:none;/*none= normal.  blink=clignotant.  overline=ligne au-dessus.  line-through=barré.  underline=souligné.*/
}

.page5
{
text-align:left;/*permet de modifier l'emplacement du texte*/
color: black;/*permet de modifier la couleur du texte: white, silver, gray, black, red, maroon, lime vert fluo , green, yellow, olive, blue, navy bleu foncé , fuchsia, purple, aqua turquoise, teal bleu canard*/
font-size: médium;/*permet de modifier la taille de la police*/
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;/*permet de choisir la police*/
font-style:none;/*permet de mettre en italic*/
font-weight:bold;/*permet de mettre en gras*/
text-indent: 20px;/*permet de décaler les paragraphes*/
font-variant:normal;/*permet de mettre en majuscules mais avec small-caps */
text-transform:none;/*none:permet de laisser comme c'est.   capitalize:permet de mettre la première lettre de chaque mot en majuscule.     lowercase:tout le texte en minuscule.    uppercase :tout le texte en majuscules*/
text-decoration:none;/*  blink=clignotant.  overline=ligne au-dessus.  line-through=barré.  underline=souligné.*/
}

.page5:hover/*quand on pointe sur un paragraphe, un lien*/
{
text-decoration:underline;
}

.page5:focus,.page5:active,.page5:visited
{
color:rgb(70,70,70);
}

.asa
{
text-align:left;/*permet de modifier l'emplacement du texte*/
color: black;/*permet de modifier la couleur du texte: white, silver, gray, black, red, maroon, lime vert fluo , green, yellow, olive, blue, navy bleu foncé , fuchsia, purple, aqua turquoise, teal bleu canard*/
font-size: médium;/*permet de modifier la taille de la police*/
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;/*permet de choisir la police*/
font-style:italic;/*permet de mettre en italic*/
font-weight:bold;/*permet de mettre en gras*/
text-indent: 20px;/*permet de décaler les paragraphes*/
font-variant:normal;/*permet de mettre en majuscules mais avec small-caps */
text-transform:none;/*none:permet de laisser comme c'est.   capitalize:permet de mettre la première lettre de chaque mot en majuscule.     lowercase:tout le texte en minuscule.    uppercase :tout le texte en majuscules*/
text-decoration:none;/*none= normal.  blink=clignotant.  overline=ligne au-dessus.  line-through=barré.  underline=souligné.*/
}
.asa:hover/*quand on pointe sur un paragraphe, un lien*/
{
text-decoration:underline;
}
.page2:hover/*quand on pointe sur un paragraphe, un lien*/
{
text-decoration:underline;
}
.asa:focus,.asa:active,.asa:visited /* Quand le visiteur sélectionne le lien */ /* Quand le visiteur clique sur le lien *//* Quand le visiteur a déjà vu la page concernée */
{
color:rgb(70,70,70);
}
.page2:focus,.page2:active,.page2:visited
{
color:rgb(70,70,70);
}

.page4
{
text-align:left;/*permet de modifier l'emplacement du texte*/
color: black;/*permet de modifier la couleur du texte: white, silver, gray, black, red, maroon, lime vert fluo , green, yellow, olive, blue, navy bleu foncé , fuchsia, purple, aqua turquoise, teal bleu canard*/
font-size:small;/*permet de modifier la taille de la police*/
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;/*permet de choisir la police*/
font-style:none;/*permet de mettre en italic*/
font-weight:bold;/*permet de mettre en gras*/
text-indent: 20px;/*permet de décaler les paragraphes*/
font-variant:normal;/*permet de mettre en majuscules mais avec small-caps */
text-transform:none;/*none:permet de laisser comme c'est.   capitalize:permet de mettre la première lettre de chaque mot en majuscule.     lowercase:tout le texte en minuscule.    uppercase :tout le texte en majuscules*/
text-decoration:none;/*none= normal.  blink=clignotant.  overline=ligne au-dessus.  line-through=barré.  underline=souligné.*/
}
.page3:hover
{
text-decoration:none;

}
.page3:focus,.page2:active,.page2:visited
{
color:rgb(70,70,70);
}


p
{
text-align:left;
color: black;
font-size: médium;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-style:normal;
font-weight:normal;
text-indent: 20px;
font-variant:normal;
text-transform:none;
text-decoration:none;
width:max-height;/*la taille qu'occupe le texte soit en % soit en px*/
    /* min-width : largeur minimale
    * min-height : hauteur minimale
    * max-width : largeur maximale
    * max-height : hauteur maximale*/
height:100%;
overflow:auto;/*à utiliser si px*/ /* visible (par défaut) : si le texte dépasse les limites de taille, le block est agrandi de manière à ce que tout soit visible. 
    * hidden : si le texte dépasse les limites, il sera tout simplement coupé. On ne pourra pas voir tout le texte.
    * scroll : là encore, le texte sera coupé s'il dépasse les limites. Sauf que cette fois, le navigateur mettra en place des barres de défilement pour qu'on puisse voir tout le texte. C'est un peu comme un cadre à l'intérieur de la page.
    * auto : mode "pilote automatique" :p. En gros, c'est le navigateur qui décide ou pas de mettre des barres de défilement (il en mettra si c'est nécessaire).*/
margin-left:0px; /* margin : indique la taille de la marge extérieure. Là encore, on utilise le plus souvent des pixels.*/
	/* margin-top : marge extérieure en haut.
    * margin-bottom : marge extérieure en bas.
    * margin-left : marge extérieure à gauche.
    * margin-right : marge extérieure à droite*/

padding:0px;/* padding : indique la taille de la marge intérieure. A exprimer en général en pixels (px).*/ 
   /* padding-top : marge intérieure en haut.
    * padding-bottom : marge intérieure en bas.
    * padding-left : marge intérieure à gauche.
    * padding-right : marge intérieure à droite.*/
   

}


h1
{
text-align:center;
color: black;
font-size: médium;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-style:normal;
font-weight:normal;

font-variant:normal;
text-transform:none;
text-decoration:none;
width:max-height;
height:100%;
overflow:auto;


}

h2
{
text-align:center;
color: black;
font-size: médium;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-style:normal;
font-weight:normal;

font-variant:normal;
text-transform:none;
text-decoration:none;
width:max-height;
height:100%;
overflow:auto;


}



p:first-letter/* La première lettre de chaque paragraphe */
{
font-size:1.2em;

}
/*p:first-line /* La première ligne de chaque paragraphe *//*
{
   font-variant: small-caps; /* En petites capitales 
}*/
.bienvenue
{
font-weight:bold;
}
.premiere
{
/*margin: auto;*/
}
a img
{
border:none;

}
.image1
{
display:inline;
/*display:block;/* block : la balise concernée deviendra de type block.
    * inline : la balise concernée deviendra de type inline.*/
	float:right;/*left : l'élément flottera à gauche.
 right : l'élément flottera. à droite */
border:none;
}
.image2
{
display:inline;/* block : la balise concernée deviendra de type block.
    * inline : la balise concernée deviendra de type inline.*/
	float:left;/*left : l'élément flottera à gauche.
 right : l'élément flottera. à droite */
 margin-right:10px; /* margin : indique la taille de la marge extérieure. Là encore, on utilise le plus souvent des pixels.*/
padding:0px;
border:none;

}
.image6
{
display:block;/* block : la balise concernée deviendra de type block.
    * inline : la balise concernée deviendra de type inline.*/
	float:center;/*left : l'élément flottera à gauche.
 right : l'élément flottera. à droite */
 margin-right:275px; /* margin : indique la taille de la marge extérieure. Là encore, on utilise le plus souvent des pixels.*/
margin-left:275px;
 padding:0px;
border:none;

}
.forum
{
font-size:1.50em;

}
.image4
{
display:inline;/* block : la balise concernée deviendra de type block.
    * inline : la balise concernée deviendra de type inline.*/
	
 margin-left:68px; /* margin : indique la taille de la marge extérieure. Là encore, on utilise le plus souvent des pixels.*/
padding:0px;
border:none;
}

.actu002
{
clear:both;

/*left : le texte se poursuit en-dessous après un float:left;
right : le texte se poursuit en-dessous après un float:right;
both : le texte se poursuit en-dessous, que ce soit après un float:left; ou après un float:right;*/
}
.title
{
color: black;
font-size: x-large;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-style:normal;
font-weight:normal;
font-variant:normal;
text-transform:none;
text-decoration:none;
width:max-height;

}

legend
{
color: black;
font-size: médium;
font-family:"Comic Sans MS",Verdana,"Times New Roman",serif;
font-style:normal;
font-weight:normal;
font-variant:normal;
text-transform:none;
text-decoration:none;
width:max-height;

}

fieldset
{
background-color:;

}


caption
{
   margin: auto;
   font-family:"Comic Sans Ms",Arial, Times, "Times New Roman", serif;
   font-weight: bold;
   font-size: 1.2em;
   color: black;
   margin-bottom: 20px;
}

table /* Le tableau en lui-même */
{
   margin: auto; /* Centre le tableau */
   border:  black medium ; 
   border-collapse: collapse; /* Colle les bordures entre elles */
     color: black;
}

th /* Les cellules d'en-tête */
{
   color: black;
   
   font-size: 1.1em;
   font-family:"Comic Sans Ms",Arial, Times, "Times New Roman", serif;
}

td /* Les cellules normales */
{
  color: black;
   border: 1px solid black;
   font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;
   text-align: center;
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}