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:7%;
   border:0.1% 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);
   }
#corps/*le corps de la page*/
{ 
  
 width:48.5%;
height:230%;
background-color:black;
position:absolute;
top:1%;
left:18.5%;
 text-align:center;
 color:rgb(202, 236, 255);
border:0.1em   solid yellow;
 font-size:1.3em;
 font-family:"Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;

 }
 
 a /* Lien normal */
{
   text-decoration: none;
   color: red;
   font-style: italic;
   }

  h2
  {
  
  font-size:2em;
  }
 .loc
{
padding-top:3%;
text-align: center;
font-size: 0.8em;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
}
strong
{
text-decoration:blink;
color: yellow;
}



 img
 {
padding-top: 4%;
 margin-left:4%;
}
.ac
{
position:absolute;
top:12%;
left:1%;
right:47%; 
bottom:0%;

}
.foto1
{
margin-top: 26%;
margin-left:60%;
font-size:x-large;
font-family: "Comic Sans MS" ,Arial, "Arial Black", "Times New Roman", Times, serif;

}
.acces
{
margin-top:7%;
margin-left: 60%;
  text-align:left;

 font-size:medium;
font-family: "Comic Sans MS",Arial, "Arial Black", "Times New Roman", Times, serif;

}
.acti
{
position:absolute;
top:35%;
left:4%; 
margin-left:5%;
font-size:x-large;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;

}
.activite
{
position:absolute;
top:40%;
left:2%; 

margin-top: 4%;
margin-left: 4%;
  text-align:left;
 font-size:medium;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;
}
.po
{
position: absolute;
top:60%;
left: 30%;
right:5%;
bottom:
}
.contact
{
 position:absolute;
 top:85%;
 left:0%;
 right:0%;
 color:rgb(202, 236, 255);
font-size:large;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;

}
.top
{
 position:absolute;
 top:50%;
left:32%;
padding-bottom:%;
font-size:large;
color:yellow;
font-family: "Comic Sans MS", Arial, "Arial Black", "Times New Roman", Times, serif;

}

#pied_de_page
 {

 width:129%;
 height:20%;
 position:absolute;
 top:101%;
left:0%;
right:0%;
 background-color: black;
 border:0.1em solid yellow;

 }
 .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;
}

  .xiti
 {
 float:right;
 padding-bottom:1%;
 }