body
{
   width: 800px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 10px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 10px;    /* Idem pour le bas du navigateur */
   background-image: url("images/colisee.jpg"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */
   background-repeat: no-repeat;
   behavior: url("csshover.htc");
}

.encadrer {
	border: 1px solid black;
	padding : 5px;
}


/* L'en-tête */

#en_tete
{
   height: 100px;
   background-image: url("images/banniere.jpg");
   background-repeat: x-repeat;
   margin-bottom: 10px; /*marge extérieur*/
   padding-top: 10px; /*marge intérieur*/
   font-size: 12px;
}

 
/* Le menu */

#menu{
   float: left; /* Le menu flottera à gauche */
   width: 180px; /* Très important : donner une taille au menu */
   background-image: url("images/degradeRouge.jpg");
   font-weight : bold; /* on met le texte en gras */
   font-family : Arial, serif; /* on utilise Arial, c'est plus beau ^^ */
   font-size : 12px; /* hauteur du texte : 12 pixels */
   padding-bottom:200px;
}

#menu a:link {
	color: #FFFF80;
	text-decoration: none;
}

#menu a:visited {
	text-decoration: none;
	color: #FFFF80;
}

#menu a:hover {
	text-decoration: underline;
}

#menu a:active {
	text-decoration: none;
}

#menu ul {
  width:180px;
  list-style:none;
  padding:0px;
  margin:0px;
}

#menu ul li {
  padding:10px;
  height:10px;
}

#menu ul li ul {
  display:none;
  background-image: url("images/degradeRouge.jpg");
  padding-bottom:20px;
}

#menu ul li:hover ul {
  display:block;
  position:relative;
  top:-24px;
  left:180px;
  color: #FFFF80;
  text-decoration: none;
}

#menu ul li ul, #menu ul li:hover ul li ul, #menu ul li:hover ul li:hover ul li ul{
  display:none;
}

#menu ul li:hover ul, #menu ul li:hover ul li:hover ul, #menu ul li:hover ul li:hover ul li:hover ul{
  display:block;
  position:relative;
  top:-24px;
  left:170px;
}

#menu li a:hover {
  color:#FFFF80;
  text-decoration: underline;
}

#menu ul li.extend:hover a, #menu ul li.extend:hover ul li:hover a, #menu ul li.extend:hover ul li.extend:hover ul li:hover a, #menu ul li.extend:hover ul li.extend:hover ul li.extend:hover ul li:hover a{
  background-color:#BBB7C7;
}

#menu ul li.extend:hover ul li a, #menu ul li.extend:hover ul li:hover ul li a, #menu ul li.extend:hover ul li.extend:hover ul li:hover ul li a{
  background-color:#FFFFFF;
}

#menu ul li.extend:hover {
  width:180px;
  height:23px;
  overflow:hidden;
}

html > body #menu ul li.extend:hover {
  overflow:visible;
}


/* Le corps de la page ------------------ en cours de traitement*/

#corps{
   margin-left: 190px; /* 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-left: 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   padding-right: 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   padding-bottom: 20px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   color: black;
   border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#corps h1{	
	font-size: 24px;
	font-weight: bold;
	color: #990000;
	text-align: center;
}

#corps a:link {
	color: #990000;
	text-decoration: none;
}

#corps a:visited {
	text-decoration: none;
	color: #990000;
}

#corps a:hover {
	text-decoration: underline;
}

#corps a:active {
	text-decoration: none;
}

#corps_modification{
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding-left: 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   padding-right: 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   padding-bottom: 20px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   color: black;
   border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#corps_modification h1{	
	font-size: 24px;
	font-weight: bold;
	color: #990000;
	text-align: center;
}

#corps_modification a:link {
	color: #990000;
	text-decoration: none;
}

#corps_modification a:visited {
	text-decoration: none;
	color: #990000;
}

#corps_modification a:hover {
	text-decoration: underline;
}

#corps_modification a:active {
	text-decoration: none;
}


/* Pied de page ------------------- en cours de traitement */
#pied {
	width:800px;
	text-align: center;
	padding-top: 10px;
}

#pied a:link {
	color: #990000;
	text-decoration: none;
}

#pied a:visited {
	text-decoration: none;
	color: #990000;
}

#pied a:hover {
	text-decoration: underline;
}

#pied a:active {
	text-decoration: none;
}