body
{
  
   margin: auto;   
   background-color: #002233;
   padding: 0px;
   width: 800px;
   margin-top: 10px;
  
}

a { font-family : Verdana,Arial; font-size : 1em; color :  #ffffff; text-decoration: none; }
a:link { font-family : Verdana,Arial; font-size : 1em; color :  #ffffff; text-decoration: none; }
a:hover{ font-family : Verdana,Arial; font-size : 1em; color :  #002233;text-decoration: none;}
a:visited {}
a img {text-decoration: none; border:0px;}


   
#logo
{position: relative;
      top: -100px;
      right :180px;}


#menuhaut table /* Le tableau en lui-même */
{  margin: auto; /* Centre le tableau */
   height : 100px;
   width: 456px;
  background-image:url(photos/menu2.jpg);
   position: relative;
   left: 50px;
   top: -51px;
}
#menuhaut td
{height:28px;}
.menuduhaut td
{ margin : auto;
  font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
  border : 2px solid white;
  color : #ffffff;
  Text-align: center;
  font-size : 12px;
}
/*-------------------------début du menu gauche--------------------------------*/
ul#menu 
{
	margin: 0 ;
	padding: 0 ;
	float: left;
	list-style-type: none ;

/* Suppression du margin, du padding et des puces du <ul> */
}
ul#menu img
{margin:0px; padding:0px;	position: relative;	top:-5px;}

ul#menu li
{	margin: 0 0 0 0 ;	padding: 0 ;	border: 0px;}

.menug2 a
{	display: block ;	width: 180px ;	line-height: 31px ;	color: #dddddd ;	text-indent: 90px ; /* On décale le texte de 40px du bord gauche */
	text-decoration: bold ;	background: url(photos/menug22.jpg) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
	position: relative;	top:-10px;}

.menug2 a:hover
{	background: url(photos/menug22.jpg) no-repeat 0 -31px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	border: 0px solid;		position: relative;	top:-10px; color :  #ffffff;
}
.menug3 {position: relative;	top:-5px;}
.menug4 a
{
	display: block ;	width: 180px ;	line-height: 32px ;	color: #dddddd ;	text-indent: 5px ; /* On décale le texte de 40px du bord gauche */
	text-decoration: bold ;	background: url(photos/menug44.jpg) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
	position: relative;	top:-15px;}

.menug4 a:hover
{	background: url(photos/menug44.jpg) no-repeat 0 -32px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	border: 0px solid;		position: relative;	top:-15px; color :  #ffffff;
}
.menug5 {position: relative;	top:-10px;}
.menug6 a
{
	display: block ;	width: 180px ;	line-height: 33px ;	color: #dddddd ;	text-indent: 5px ; /* On décale le texte de 40px du bord gauche */
	text-decoration: bold ;	background: url(photos/menug66.jpg) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
	position: relative;	top:-20px;}

.menug6 a:hover
{	background: url(photos/menug66.jpg) no-repeat 0 -33px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	border: 0px solid;		position: relative;	top:-20px; color :  #ffffff;
}
.menug7 {position: relative;	top:-15px;}
.menug8 a
{
	display: block ;	width: 180px ;	line-height: 28px ;	color: #dddddd ;	text-indent: 85px ; /* On décale le texte de 40px du bord gauche */
	text-decoration: bold ;	background: url(photos/menug88.jpg) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
	position: relative;	top:-25px;}

.menug8 a:hover
{	background: url(photos/menug88.jpg) no-repeat 0 -28px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	border: 0px solid;		position: relative;	top:-25px; color :  #ffffff;
}
.menug9 a
{
	display: block ;	width: 180px ;	line-height: 36px ;	color: #dddddd ;	text-indent: 40px ; /* On décale le texte de 40px du bord gauche */
	text-decoration: bold ;	background: url(photos/menug99.jpg) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
	position: relative;	top:-25px;}

.menug9 a:hover
{	background: url(photos/menug99.jpg) no-repeat 0 -36px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	border: 0px solid;		position: relative;	top:-25px; color :  #ffffff;
}
.menug10 {position: relative;	top:-20px;}
.menug11 a
{
	display: block ;	width: 180px ;	line-height: 63px ;	color: #dddddd ;	text-indent: 65px ; /* On décale le texte de 40px du bord gauche */
	text-decoration: bold ;	background: url(photos/menug1111.jpg) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
	position: relative;	top:-30px;}

.menug11 a:hover
{	background: url(photos/menug1111.jpg) no-repeat 0 -63px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	border: 0px solid;		position: relative;	top:-30px; color :  #ffffff;
}
.menug12 {position: relative;	top:-25px;}
/*-------------------------------fin menu gauche------------------------------------------*/
#corps
{  
   padding : auto;
   margin : auto; 
   font-size: 1.em;
   height: 630px;
   margin-left: 180px;
   background-color: #ffffff;
   position: relative;
   top: -4px;
}

#corps p  {position:relative; top:-145px; text-indent: 65px ;text-align:justify;  margin-left: 10px; 
   width : 550px;}
#corps h1  {position:relative; top:-145px; text-indent: 95px ;text-align:justify;  margin-left: 10px; 
   }
#corps1
{  padding : 0px;
   margin : auto;
   width: 300px;
   position:relative; top:-145px; margin-left: 10px; 
   float: left;   
    }
#corps1 p
{  padding :0px;
   text-align:center; 
   width : 280px;
   margin-left: 10px; 
   position:relative; top:0px; text-indent: 0px ;
    }
#corps2
{  padding : 0px;
   margin : auto;
   width : 300px;   
   margin-left: 301px;  
   position:relative; top:-145px;
}
#corps2 p
{  text-align:center;
   width:280px;
    margin-left: 10px; 
   position:relative; top:0px; text-indent: 0px ;
   }

/*-------------------------------Diaporama------------------------------------------*/
#galerie
{
	
	background: none ;
	padding: 10px ;
	margin: 10px 20px ;
	text-align: center ;
	font: 0.9em Georgia, serif ;
	position:relative; top:-145px; margin-left: 10px;

	
}

ul#galerie_mini
{display: block;
	margin: 0 ;
	padding: 0 ;
	list-style-type: none ;
	width: 620px ;

}

ul#galerie_mini li
{
	float: left ;
}

ul#galerie_mini li a img
{
	margin: 2px 1px ;
		width: 70px ;
}

dl#photo
{

	margin: 0 auto ;
	
}

dl#photo dt
{
	font: italic 1.5em/1.5em Georgia, serif ;
	color: #dcb ; 
}

dl#photo dd
{
	margin: 0 ;
}

dl#photo img
{
	border: 1px solid #dcb ;	width: 350px ;
}
/*-------------------------------fin diaporama------------------------------------------*/

/*-------------------------------Page en 9 cases------------------------------------------*/
#corps9
{  
   padding : auto;
   margin : auto; 
   font-size: 1.em;
   height: 630px;
}
#corps9 p {position:relative; top:-0px; margin-left: 10px; width : 175px; text-indent: 0px; text-align :left;}
#corps9 a { font-family : Verdana,Arial; font-size : 1em; color :  #000000;; text-decoration: none; }
#corps9 a:link { font-family : Verdana,Arial; font-size : 1em; color :  #000000; text-decoration: none; }
#corps9 a:hover{ font-family : Verdana,Arial; font-size : 1em; color :  #777777;text-decoration: none;}
#corps9 a:visited {}

#bloc1 {
margin: auto;
padding-top : 50Px;
Height : 130px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc2 {
margin: auto;
padding: 0Px;
Height : 180px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc2 img {width : 175px;
     margin-top: 20px;
}
#bloc3 {
margin: auto;
padding-top: 85Px;
Height : 100px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}



#bloc4 {
margin: auto;
padding-top : 50Px;
Height : 130px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc5 {
margin: auto;
padding: 2Px;
Height : 180px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc6 {
margin: auto;
padding: 2Px;
Height : 180px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc6 img {width : 175px;
     margin-top: 20px;
}

#bloc7 {
margin: auto;
padding: 2Px;
Height : 180px;
width : 180px;
float : left; position:relative; top:-175px; margin-left: 10px;
}
#bloc7 img {width : 175px;
     margin-top: 0px;
}
#bloc8 {
margin: auto;
padding-top: 50Px;
padding-left:40px
Height : 130px;
width : 160px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc9 {
margin: auto;
padding: 2Px;
Height : 180px;
width : 180px;
float : left; position:relative; top:-145px; margin-left: 10px;
}
#bloc9 img {width : 155px;
     margin-top: 20px;
}
/*---------------------------fin des pages en 9 cases--------------------------------------------*/
/*---------------------------image en pleine page------------------------------------------------*/
#actualite img
{width: 600px; position:relative; top:-105px; left:10px;}

/*--------------------------fin-------------------------------------------------------------------*/
/*--------------------------les membres--------------------------------------------------------------*/
#membre h1  {position:relative; top:-160px; text-indent: 95px ;text-align:justify;  margin-left: 10px; font-size: 18px;
   }
#membre ul  {position:relative; top:-170px; text-align:justify;  margin-left: 10px; 
   }

/*--------------------------fin-------------------------------------------------------------------*/


#pied_de_page
{  width: 800px;
   height : 60px;
   padding : 0px;
   margin: 0px;background-color: #626262;
 clear: both;
 position:relative; top:-35px}
  
#pied_de_page p
{

font-size: 0.95em;     
    color: #A8A8A8;
    position:relative;
    right:-190px;}