body
{
color:black;
background-color:white;
width:900px;
margin:auto; /* centrer la page */
margin-top:20px; /* espace avec le haut de la fenêtre du navigateur */
padding:0px;
}

#header
{
width:900px;  /* largeur du header */
height:130px;  /* hauteur du header */
margin:0px;
padding:0px;
background: url("kit/header.png") no-repeat; /* exemple d'image pour la bannière, à remplacer par ce que vous voulez */
margin-bottom:20px; /* espace entre le bas du header et le haut du bloc corps */
background-color:white;
}

#header p
{
width:500px;
text-align:left;
color:black;
font-family:"Trebuchet ms", serif;
font-size:2.0em; /* taille des caractères des titres "menu" */
margin:0px;
padding-top:40px;
padding-left:250px;
}

#footer
{
width:900px;
height:130px;
margin:auto;
padding:0px;
background:url("kit/footer.png") no-repeat; /* exemple d'image pour le footer, à remplacer par ce que vous voulez */
margin-top:20px;
background-color:white;
}

#menu_gauche
{
width:167px;
float:left;
margin:0px;
padding:0px;
text-align:center;
}

#menu_droite
{
width:167px;
float:right;
margin:0px;
padding:0px;
text-align:center;
}

.rubrique
{
width:167px;
margin:0px;
padding-top:5px;
}

#menu_gauche .rubrique .bouton_menu1 h4 , #menu_gauche .rubrique .bouton_menu3 h4 , #menu_droite .rubrique .bouton_menua h4 , #menu_droite .rubrique .bouton_menuc h4  /* pour le titre de la rubrique  */
{

padding-top:42px; /* valeur à ajuster pour centrer le texte dans l'image du bouton */
padding-left:18px;
width:149px;
height:21px;
margin:0px;
color:black;
font-family:"Trebuchet ms", serif;
font-size:1.0em; /* taille des caractères des titres "menu" */
text-align:left;}

#menu_gauche .rubrique .bouton_menu2 h4 , #menu_droite .rubrique .bouton_menub h4  /* pour le titre de la rubrique */
{
position:relative;
padding-top:42px; /* valeur à ajuster pour centrer le texte dans l'image du bouton */
padding-right:18px;
width:149px;
height:21px;
margin:0px;
color:black;
font-family:"Trebuchet ms", serif;
font-size:1.0em; /* taille des caractères des titres "menu" */
text-align:right;
}

.bouton_menu1
{
width:167px;
height:100px;
margin:auto;
padding:0px;
background-image: url("kit/bouton_menu1-2.png");
background-repeat:no-repeat;
}

.bouton_menu2
{
width:167px;
height:100px;
margin:auto;
padding:0px;
background-image: url("kit/bouton_menu2-2.png");
background-repeat:no-repeat;
}

.bouton_menu3
{
width:167px;
height:100px;
margin:auto;
padding:0px;
background-image: url("kit/bouton_menu3-2.png");
background-repeat:no-repeat;
}

.bouton_menua
{
width:167px;
height:100px;
margin:auto;
padding:0px;
background-image: url("kit/bouton_menua-2.png");
background-repeat:no-repeat;
}

.bouton_menub
{
width:167px;
height:100px;
margin:auto;
padding:0px;
background-image: url("kit/bouton_menub-2.png");
background-repeat:no-repeat;
}

.rubrique img
{
display:block;
margin:0px;
padding:0px;
}

#menu_gauche .rubrique a
{
display:block;
width:144px;
height:20px;
margin:0px;margin:auto;
padding-left:5px;
color:black;
font-family:"Trebuchet ms", serif;
font-size:0.9em;
text-decoration:none;
background: url("kit/rollover.png") no-repeat 0 0 ;
}
		
#menu_gauche .rubrique a:visited
{
font-family:"Trebuchet ms", serif;
font-size:0.9em;
text-decoration:none;
}
		
#menu_gauche .rubrique a:hover
{
font-family:"Trebuchet ms", serif;
font-size:0.9em;
text-decoration:none;
color:white;
background: url("kit/rollover.png") no-repeat 0 -20px ;
}
		
#menu_gauche .rubrique a:active
{
font-family:"Trebuchet ms", serif;
font-size:0.9em;
text-decoration:none;
}

#signature
{
float:left;
width:200px;
margin:0px;
padding-top:50px;
color:black;
font-family:"Trebuchet ms", serif;
font-size:0.7em;
text-align:center;
}

#signature p
{
margin:0px;
padding-top:14px;
padding-left:15px;
}

#signature a {color:green;text-decoration: none;}
#signature a:visited {color:gray;text-decoration:none;}
#signature a:hover {color:blue;}

.css_valid1 a img , .css_valid2 a img , #firefox a img , #logos_partenaires a img
{
border:none;
}

.css_valid1
{
float:left;
margin:0px;
padding-top:55px;
padding-left:130px;
border:0px;
}

.css_valid2
{
float:left;
margin:0px;
padding-top:55px;
padding-left:25px;
border:0px;
}


#firefox , #logos_partenaires
{
margin-top:15px;
margin-left:0px;
border:0px;
}

#menu_droite .rubrique p
{

width:146px;
text-align:left; /* alignement du texte dans le bloc news : ici, à gauche */
margin:0px;
padding-left:12px;
color:black;
font-family:"Trebuchet ms", serif; /* police de caractères dans le bloc "news" */
font-size:0.7em; /* taille des caractères dans le bloc "news" */
}

#menu_droite  hr
{
width:75%; /* largeur des petites lignes de séparation dans le bloc news */
}

#haut-corps
{
background-image:url("kit/haut-corps.png");
background-repeat:no-repeat;
width:900px;
height:31px;
margin:auto;
}

#bas-corps
{
background-image:url("kit/bas-corps.png");
background-repeat:no-repeat;
width:900px;
height:31px;
margin:auto;
}

.corps
{
width:530px;
margin:auto;
text-align:justify;
font-family:"comic sans ms", verdana, serif;
color:black;  /* couleur du texte dans le corps de la page */
background-color:transparent;
font-size:0.8em;  /* taille du texte dans le corps de la page */
padding-left:0px;
padding-right:0px;
text-align:center;
}

.corps a {color:green;text-decoration:underline; font-weight:bold;}
.corps a:visited {color:blue;text-decoration:none;}
.corps a:hover {color:red;}
.corps a:active {color:gray;}
	
.corps h3  /* balise titre dans le corps de la page */
{
margin-top:7px;
margin-bottom:10px;
margin-left:0px; /* 5 px avec le kunai.png */
padding-left:115px;
padding-top:20px;
font-family: "Trebuchet ms", verdana, serif;
color:#fc7c00;
font-size:1.5em;
height:40px;
background : url("kit/kunai2.png") left no-repeat;
text-align:left;
}
	
.corps h1
{
margin-top:0px;
margin-bottom:7px;
font-family: "Trebuchet ms", verdana, serif;
font-size: 2.4em;
text-align:center;
color:black;
}

.corps p
{
margin-top:5px;
margin-bottom:15px;
margin-left:15px;
margin-right:15px;
text-align:left;
}
	
.corps .droite
{
margin-bottom:10px;
margin-right:10px;
text-align:right;
font-size:1.1em;
font-style:italic;
}

.decoll /* artifice qui permet de ne pas coller le corps de la page en bas de la fenêtre du navigateur, normalement c'est margin-bottom:20px dans le body mais IE veut pas ... */
{
clear:both;
width:900px;
height:20px;
margin:auto;
}

.feint /* artifice qui permet aux 2 colonnes de menu de ne pas deborder du conteneur quand elle est plus grande que le corps de la page */
{
clear:both;
width:900px;
height:1px;
margin:auto;
}

#conteneur
{
width:900px;
padding:0px;
margin:0px;
background-color:white;
background-image:url("kit/fond-conteneur.png");
background-repeat:repeat;
}

#global /* conteneur de la page*/
{
width: 900px;
margin-left:auto;
margin-right:auto;
padding:0px;
}

dl, dt
{
margin: 0;
padding: 0;
list-style-type: none;
}

#menu
{
padding-top:10px;
padding-bottom:10px;
padding-left:0px;
}

#menu dl
{
float: left;
width: 128px; /* largeur des cases de la barre de menu */
margin:0 2px /* espace entre les cases de la barre de menu */
} 

#menu dt
{
cursor: pointer;
text-align: center;
font-weight: bold;
background: #fc7c00; /* couleur de fond des cases */
border: 1px solid gray;
}

#menu dt a
{
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}

#menu dt a:hover
{
background: #eee; /* couleur de fond des cases lorsque le curseur est sur la case */
}

a
{
text-decoration: none;
color: black;
color: #222;
}

hr
{
width:70%;
}