body
{
	margin: 0 ;
	padding: 0 ;
	text-align: center ;
	font: 0.8em "Verdana", helvetica, sans-serif ;
	background: #dad2bb url(../img/bgh.jpg) repeat-x;		
}

div#conteneur
{
	width: 980px ;
	margin: 0 auto ;
	text-align: left ;
	background: url(../img/bg.jpg) repeat-y;
}

h1#header
{
	height: 300px ;
	margin: 0 ;
	background: url(../img/header.jpg) no-repeat left top;
}

h1#header a
{
float: left;
	width: 190px ;
	height: 210px ;
	display: block ;
	background: url(../img/space.gif) no-repeat ;
	position: relative ;
	left: 10px ;
	top: 70px ;
	text-indent: -5000px ;
}

ul#menu
{
/* On donne une hauteur au menu, correspondant a la taille de l'image utilisée en fond, on met ensuite l'image de fond
  avec un décalage de 25 pixels vers le haut pour utiliser la technique de roll over  */
  float: left;
	width:800px;
	height: 53px ;
	margin: 0 ;
	padding: 0 ;
	margin-top: -286px;
	margin-left:35px;	
	list-style-type: none ;
}

ul#menu li
{
/* On rend les li en flottant pour pouvoir les  afficher horizontalement, on cache les puces, et on centre le texte */
	float: left ;
	text-align: center ;
}

ul#menu li a
{
/* C'est sur les liens que le gros du travail est effectué, largeur, hauteur de ligne, taille de police, graisse de police,   
espacement des lettres, couleur, bordure et decoration du texte. Nous pouvons dimensionner les a grâce à la propriété display: block ; */
font-family: Arial;
	width: 149px ;
	line-height: 53px ;
	font-size: 1.4em ;
	font-weight: bold ;
	letter-spacing: 1px ;
	color: #FFFFFF ;
	display: block ;
	text-decoration: none ;
}

ul#menu li a:hover
{
/* Et pour finir on décale l'image de fond au passage de la souris pour laisser aparaître l'état survolé de l'image, 
 voir le tutoriel sur les roll over pour plus de détails */
	background: url(../img/hover.jpg) 0 53px;
	color:#FFFFFF;
}
ul#menu #current a {
	background: url(../img/current.jpg) 0 53px;
	color:#21409a;
	}

div#contenu
{
/* On ajoute un petit élément décoratif sur le côté de la page et on crée un espace à gauche et à droite du contenu */
	padding: 0px 30px 0 30px ;
/*	background: url(../img/backplat.jpg) no-repeat 5% 100%;		
	background: url(../img/bg_page.gif) no-repeat 15px 15px ;*/

}

div#contenu h2
{
/* Mise en forme du titre de page, une petite image,  on décale le texte en fonction de l'image, on donne un couleur au texte et  on met une bordure basse */
	line-height: 28px ;
	font-size: 1.3em ;
	color: #d90c8c ;
	border-bottom: 1px dashed #7f7f7f ;
}

div#contenu h3
{
/* De même que pour le titre h2, à ceci près qu'on  ne donne pas d'image décorative cette fois ci */
	margin-left: 5px ;
	padding-left: 5px ;
	font-size: 1.1em ;
	text-decoration: underline;
	color: #21409a ;
}

div#contenu p
{
/* On rend les paragraphes plus propre, alignement justifié, alinéa et hauteur de ligne supérieure à l'état normal pour aérer le tout */
	text-align: justify ;
	text-indent: 2em ;
	line-height: 1.7em ;
}

div#contenu a
{
	color: #d90c8c ;
	font-weight: bold ;	
	text-decoration:none;
}

div#contenu a:hover
{
/* On met en forme les liens contenu dans la page */
	color: #d90c8c;
	font-weight: bold ;	
	text-decoration:none;	
}

div#intro {
	float:right;
	width:350px;
	height:275px;
	text-align:center;
	background-color:;
	}
div#anim {
	float:right;
	width:746px;
	height:226px;
	margin-top:67px;
	margin-right:15px;
	background-color:;
	}
	
div#bg01 {
	background: url(../img/backplat.jpg) no-repeat 5% 100%;		
}

div#footer
{
	padding: 0px 70px 0 70px ;
	text-align:center;
	height:83px;
	color: #000000 ;
	background: url(../img/footer.jpg) no-repeat bottom center;
}

div#accueil{
	text-align: justify ;
	text-indent: 2em ;
	line-height: 28px ;
	font-size: 1.3em ;
	color: #000000 ;

}
.photo {
	text-align: center;	
	/*width:210px;*/
	height:200px;
	border:none;
}
.photo2 {
	text-align: center;	
	/*width:210px;*/
	height:169px;
	border:none;
}
.presta {
	text-align: center;	
	width:900px;
	border:none;
}

div.clear{
clear: both;
}

.droite{
	text-align:right;
	}
.gauche{
	text-align:left;
	}
.centre{
	text-align:center;
	}

div#email
{
	background: url("../img/mail.jpg") no-repeat 100% 30%;
}

a.triclic {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #f8c105;
	text-decoration: none;
	margin: 0 0 0 0px;
}
a.triclic:hover{
	color:#000000;	
}
