body
 {
  width: 63%;
  margin: auto; /*pour centrer la page*/
  margin-top: 1%;/*marge du haut */
  margin-bottom: 1%;/*marge du bas*/
  background-color: rgb(202, 236, 255);
  }
  
   #menu
   {
  float: right; 
  width: 22%;/*ceci est la taille du cadre menu(largeur)*/
  margin-top:0%;
   border:0.1em solid blue;
 border:0.1em solid black;
  }
  
 .element_menu
{
background-color: green;
   background-image: url("images/motif.png");
 color:yellow;   
   border: 0.1em solid yellow;
   margin-bottom: 0%;
   margin-left:1%;
}

.element_menu h4 /* Tous les titres de menus */
{   
   color: white;
   font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
      margin-top: 3%;
   margin-bottom:3%;
}

.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("images/puce.png"); /* change l'apparence des puces */
   padding: 0%; 
   padding-left: 15%;
   margin: 0%; 
   margin-bottom: 1,3%; 
}

.element_menu a /*  les liens se trouvant dans un menu */
{
   color: white;
   font-weight:bold;
}

a:visited /* Quand le visiteur a déjà vu la page concernée */
{
   text-decoration: none;
   color: white;
}

a:focus /* Quand le visiteur sélectionne le lien */
{
   background-color: rgb(98, 255, 2);
}

a:hover /* Quand le visiteur pointe sur le lien */
{
   text-decoration:underline;
   color: rgb(98, 255, 2);
   }
    a /* Lien normal */
{
   text-decoration: none;
   color: red;
   font-style: italic;
   }
   
 img
 {
 margin-right:5%;
}
 
strong
{
text-decoration:blink;
}

#corps/*le corps de la page*/
{  
width:48.5%;
height:340%;
background-color: yellow;
position:absolute;
top:1%;
left:18.5%;
text-align:center;
border:0.1em  solid black;
font-size:1.3em;
font-family:"Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;

 }
.tableau
 {
 margin-top: 6%;
 }
 
 h2
 {
 text-decoration: blink;
 }
 caption /*titre du tableau*/
 { 
  width:auto;   /*largeur de la cellule */
  height: auto;  /* hauteur de la cellule*/
 margin:auto;/*centre le titre du tableau*/
 font-family: "Comic Sans MS",serif;
 font-weight: bold;
 font-size: 0,8em;
 color: #009900;
 margin-bottom: 5%; /* Pour éviter que le titre ne soit trop collé au tableau en-dessous */
  }
  
  
  table /* Le tableau en lui-même */
{
   width:98%;   /*largeur de la cellule */
   height: auto;  /* hauteur du tableau*/
   margin: auto; /* Centre le tableau */
   border: 0.1em outset green; /* Bordure du tableau avec effet 3D (outset) */
   border-collapse: collapse; /* Colle les bordures entre elles */
}

th /* Les cellules d'en-tête */
{
   width:20%;   /*largeur de la cellule */
   height: auto;  /* hauteur de la cellule*/
   border: 0.1em solid black;
   background-color: yellow;
   color: green;
   font-size: 0.6em;
   vertical-align: center;/* Alignement vertical, le contenu des cellules sera placé en bas */
   font-family: "Comic Sans MS",serif;
}
td /* Les cellules normales */
{
   width:16%;
   height:auto;
   border: 0.1em solid black;
   font-size: 0.6em;
   color: green;
   font-family: "Comic Sans MS",  serif;
   text-align: center; /* Tous les textes des cellules seront centrés*/
   padding: 1%; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}
.libre
{
color:white;
background-color: green;
text-decoration:blink;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;

}
.reserve
{
color:white;
background-color: red;
font-weight: bold;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
}
.etxe
{
text-decoration: underline;
font-family: "Comic sans Ms", Arial, "Arial Black", "Times New Roman", Times, serif;
color:rgb(255, 119, 65);
font-style: italic;
}

.option
{
color:black;
background-color:rgb(43, 232, 194) ;
font-weight: bold;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
}


h4
{
text-align:center;
color: yellow;

font-family: "Comic Sans MS",  serif;
}
#pied_de_page
 {

 width:63%;
 height:37%;
 position:absolute;
 top:343%;
left:18.5%;
right:18.5%;
 background-color: yellow;
 border:0.1em solid black;
text-align: center;
color :black;
font-size: 1.2em;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
 }
 .contact
{
text-align: left;
color :black;
margin-top: 10%;
margin-left:5%;
margin-right:65%;
font-size: 0.8em;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
background-color: blue;
}
img
{
position:absolute;
top:2%;
padding-bottom:3%;
margin-right: 15%;
}
  .xiti
 {
 position:absolute;
 top:85%;
 }
 
 
 .liens
 {
 
 top:70%;
 margin:auto;
 }
 .refsolution
 {
 position:absolute;
 top:75%;
 margin-left:7%;
 }
 .annu
 {
 position:absolute;
 top:75%;
 margin-left:20%;
 }
 .kroos
 {
  position:absolute;
 top:75%;
 margin-left:33%;
 }
.pr
{
  position:absolute;
 top:65%;
  margin-right:20%;
 }
.tex
{
margin-top:1%;
text-align: justify;
font-family:"Comic sans Ms", Arial, "Arial Black", "Times New Roman", Times, serif;
font-size:0.7em;
color:green;
margin-left:4%;
margin-right:4%; /* Qu'il y ait une marge de 5px à droite pour que ça colle pas trop au reste du texte */

}
.info
 {
 
 text-align: center;
 color:green;
 font-weight: bold;
 font-size: 0.7em;
 font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
 }
 
h3
{
text-decoration: blink;
text-align: center;
color: green;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
}
h4
{
color: red;
text-decoration: ;
text-align: center;
 font-size: 0.7em;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
}