html {
overflow-y: scroll;
}

body {
	background-image: url('Images/fond-partition2.jpg');
  	background-attachment:fixed;
  	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white; 
	position: absolute;
	width: 900px; 
	left: 50%;
	margin-left: -450px;
}
 
h1 {
  height: 181px; /* La hauteur de l'image de fond entete.png (grosse barre grise) */
  line-height: 181px; /* Centrer le texte sur toute la hauteur de l'image de fond */
/*border-bottom: 1px solid black; /* L'entête est composé de deux parties : h1 et #menu, il faut donc les séparer */
  margin: 0; /* Par défaut les navigateurs assignent une marge aux titres. Ici on gère notre propre mise en page */
  text-align: center; /* Centrer le texte horizontalement sur toute la largeur de la page */
  background: url('Images/header.png') 50% 50% no-repeat; /* Cette jolie image, unique et centrée, remplace le texte ennuyeux */
  text-indent: -32000px; /* On décale le titre autant que possible sur la gauche de l'écran, pour ne plus le voir */
}
 
#menu {
  background: black url('Images/menu2.png');
  list-style: none; /* On ne veut plus que les lignes de la liste aient de puces */
  margin: 0; /* Aucune marge au dessus et en dessous de la liste (les listes étant normalement utilisées entre des paragraphes) */
 /* padding: 2px; /* Aucune indentation des éléments contenus dans la liste (généralement, les listes ont un padding à gauche) !!! A CHECKER*/
  height: 20px; /* Hauteur de l'image menu.png */ 
  /*font-weight: bold;*/
  border: 1px solid black; 
}
 
#menu li {
  float: left; /* Afin que chaque élément de la liste se positionne juste à droite de l'élément précédent, et non en dessous */
  margin: 0 3px; /* Espacer horizontalement chaque bouton à l'intérieur du menu */
}
 
#menu a {
  display: block; /* Afin de pouvoir assigner une hauteur au lien (la hauteur étant définir dans la règle "#menu span") */
  text-decoration: none; /* Pas de soulignement des liens dans le menu, ils sont déjà identifiables en tant que liens par le visiteur */
  color: #ffffff; /* Le texte est blanc */
  background: url('Images/menu-lien.png'); /* Bande noir, mais devenant orange lorsque décalée vers le haut */
  cursor: pointer; /* Curseur en forme de main, pour résoudre un bug sous IE, causé lors du changement du lien en affichage bloc, quelques lignes plus haut */
}
 
#menu span { /* Ce span permet au menu survolé d'avoir un reflet de lumière sur sa droite */
  display: block; /* Afin de pouvoir assigner une hauteur à cet élément (voir ci-dessous) */
  height: 21px; /* Hauteur de l'image menu-lien.png, divisé par 2 */
  line-height: 21px; /* Centrer le texte verticalement sur la barre noire */
  padding: 0 10px; /* Espacement intérieur du bouton à gauche et à droite, pour plus d'aération */
  background: url('Images/menu-lien-droite.png') 100% 0 no-repeat; /* Une seule occurrence de l'image de fond, et aligné tout à droite */
}
 
#menu a:hover, /* Au survol de la souris */
#menu a:focus, /* Lorsque le lien a le focus, sous Firefox et autres navigateurs */
#menu a:active /* Lorsque le lien a le focus, sous Internet Explorer */
{
  color: black; /* Le fond devient orange, donc le texte doit être noir pour être visible */
  background-color: #FF6600; /* L'image de fond reste inchangée, mais si l'image n'a pas été chargée, s'assurer qu'il y ait un effet visible */
  background-position: 0 -21px; /* =42 (la hauteur de l'image) / 2 : remonte l'image de fond de moitié vers le haut pour révéler sa partie orange */
}
 
#menu a:hover span, /* Au survol de la souris */
#menu a:focus span, /* Lorsque le lien a le focus, sous Firefox et autres navigateurs */
#menu a:active span /* Lorsque le lien a le focus, sous Internet Explorer */
{
  background-position: 100% -21px; /* =42 (la hauteur de l'image) / 2 ; mais toujours aligné à droite */
}
 
#menu .actuel { /* Indique au visiteur que ce lien est en fait la page actuellement affichée */
/*  font-weight: bold; /* Gras... */
  text-decoration: underline; /* ... et souligné */
}
  
  
  #menu .sousmenu
{
	display: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 0;
	position: absolute;
	/*border: 1px solid black; */
}
  
 #menu .sousmenu li
{
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	/*width: 149px;*/
	
	border: 1px solid black; 
	
} 
 #menu .sousmenu li a:link, #menu .sousmenu li a:visited
{
	display: block;
	color: #FFF;
	margin: 0;
	border: 0;
	text-decoration: none;
	background: transparent url("Images/fondSM.png") repeat;
}
#menu .sousmenu li a:hover
{
	background-image: none;
	background-color: #FFF293;
	color: black;
}

#menu li:hover > .sousmenu 
{ 
	display: block;
} 
  
  
  
  
  
#content {
	background: black url('Images/h1.jpg'); 
	border: 1px solid black;
}
 
 #content a
{ color: white; font-weight: bold; text-decoration: underline; }
 
 #content a:hover
{ color: #FF6600; font-weight: bold; text-decoration: underline; }



table
{
  	text-align: center;
	font-size: 12px; 
	
}


h2 { 
	color: white; 
	font-weight: bold;
	text-align: center;
	font-size: 16pt;
}

h3 { 
	color: white; 
	font-weight: bold;
	text-align: left;
	padding-left: 40px;
}

h4 { 
	text-align: center;
	font-size: 14px; 
}

h5 { 
	text-align: center;
	font-size: 12px;
	font-weight: normal; 
	line-height: 0;
}

h6 { 
	text-align: left;
	font-size: 12px; 
	font-weight: normal;
}

p, li {
  text-align: justify;
  font-size: 14px;  
  list-style: none;
  margin: 0px 100px 0px 100px;          
}

img {

/*color: white;*/
}

.frame
{
	color: white;
	border: 1px solid white;
}

.tabcenter{
	margin-left:auto;
   	margin-right:auto;
}

.txtcenter
{
	text-align: center; 
}

.txtright
{
	text-align: right; 
}

.txtleft
{
	text-align: left; 
}

.titleleft
{
	text-align: left;
	font-weight: bold; 
	font-size: 14px;
}


#foot {
	background: url('Images/footer3.png') no-repeat;
	height: 50px;
	font-size: 10px;
	text-align: center; 
	padding-top: 3px;
	/*padding-bottom: 5px;
/*	border: 1px solid black;*/
}
 
#foot a { 
  color: white; font-weight: bold; 
}
  
#foot a:hover{ 
	color: #FF6600; font-weight: bold; 
}




#footer {
	background: url('Images/footer3.png') no-repeat;
	height: 50px;
	font-size: 10px;
	text-align: center; 
	padding-top: 3px;
	/*padding-bottom: 3px;
/*	border: 1px solid black;*/
}


h7 {
  height: 50px; /* La hauteur de l'image de fond entete.png (grosse barre grise) */
  line-height: 50px; /* Centrer le texte sur toute la hauteur de l'image de fond */
  border-bottom: 0; /* L'entête est composé de deux parties : h1 et #menu, il faut donc les séparer */
  margin: 0; /* Par défaut les navigateurs assignent une marge aux titres. Ici on gère notre propre mise en page */
  text-align: center; /* Centrer le texte horizontalement sur toute la largeur de la page */
  background: url('Images/historic.jpg') 50% 50% no-repeat; /* Cette jolie image, unique et centrée, remplace le texte ennuyeux */
  text-indent: -32000px; /* On décale le titre autant que possible sur la gauche de l'écran, pour ne plus le voir */
}





