body{
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-top: 0px ;
	padding-right: 0px ;
	padding-bottom: 0px ;
	padding-left: 0px ;
	text-align: center ;
	font-size: 12px;
	font-family: "Comic Sans MS", "Trebuchet MS", helvetica, sans-serif ;
	background: rgb(95,156,201) ;
	color: #000000;

/* marges haute et basse à 10px et marges droite et gauche à 0 */
/* padding à 0 pour Opera  */
/* text-align: center ; pour Internet Explorer */
/* police de caractère et couleur de fond */
}

a:link 	  { color : #cc922d; text-decoration : none; } /* lien */
a:visited { color : #cc922d; text-decoration : none; } /* lien visité DD8833*/
a:hover   { color : #aa6633; text-decoration : none;  } /* lien souris dessus*/
a:active  { text-decoration : none; }  /* lien cliqué */
a:focus   { text-decoration : none;}
img {  border: none; }


div#conteneur
 /* division qui contient l'ensemble de la page */
{
	width: 980px ;
	margin: 0 auto ;
	text-align: left ;
/*	border: 2px solid #363636 ;*/
	background: #F5F5F5 ;

/* width: largeur */
/* margin: 0 auto ; centrer les éléments de type block (comme les divisions) */
/* alignement à gauche pour le block */
}



div#header{
	width: 980px ;
	height: 308px ;
	background: url("menu_DSCF4328.jpg") no-repeat center 10px;

/* height : hauteur du header */
/* background : image du header */
}
h1#header a{

	font-size: 28px ;
	color: #ba6c32 ;

	width: 330px ;

	display: block ;
	background: url(title.gif) no-repeat ;
	position: relative ;
	left: 190px ;
	top: 25px ;
	}
/*pour mettre une image en lien a la place de lu texte*/



div#cadre_menu{
	font-size: 14px;
	margin-left: 10px;
	margin-bottom: 0px;
	float: left;
	width: 960px ;
	height: 30px;
	background: #FFFFFF ;
	text-align: center;
}
/* pour le menu 

ul#menu
{
	height: 35px ;
	margin: 0px ;
	padding: 0px ;
	background: url(bg_menu.gif) repeat-x 0 -25px ;
	list-style-type: none ;
}
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; 


  On rend les li (listes) en flottant pour pouvoir les
 afficher horizontalement, on cache les puces, et on centre le texte */


ul#menu{
	height: 30px ;
	margin: 0 ;
	padding-left: 0px ;
	background: url(top_menu_fond.gif) repeat ;
	list-style-type: none ;
}
ul#menu li{
	float: left ;
	text-align: center ;
}
ul#menu li a{
	display: block ;
	width: 117px ;
	line-height: 25px ;

	font-weight: bold ;
	text-decoration: none ;
	background: url(top_onglet.gif) no-repeat 0 0 ;
}
ul#menu li a:hover{
	background: url(top_onglet.gif) no-repeat 0 -30px ;
}

ul#log_in{
	height: 30px ;
	margin: 0 ;
	padding-right: 20px ;
	background: url(top_menu_fond.gif) repeat ;
	list-style-type: none ;
}
ul#log_in li{
	float: right ;
	text-align: center ;
}
ul#log_in li a{
	display: block ;
	width: 98px ;
	line-height: 25px ;

	font-weight: bold ;
	letter-spacing: 2px ;
	text-decoration: none ;
	background: url(top_onglet.gif) no-repeat 0 0 ;
}
ul#log_in li a:hover{
	background: url(top_onglet.gif) no-repeat 0 -30px ;
}



div#titre_menu_gauche{
	float: left;
width: 120px;
	padding-left: 20px ;
	background: url(menu_article.gif) repeat ;
	text-align: left;
	font-size: 16px;
	color: #ffffff;
	font-weight: bold ;
}
div#titre_droite{
	float: left;
width: 220px;
	padding-left: 20px ;
	background: url(menu_article.gif) repeat ;
	text-align: left;
	font-size: 16px;
	color: #ffffff;
	font-weight: bold ;
}




div#menu_gauche{
width: 240px;
	float: left;
	margin-top: 30px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 20px;
/*	border: 2px solid #36ff00 ;*/
	text-align: center;
}


div#menu_droite_ancien{
width: 240px;
	float: right;
	margin-top: 30px;
	margin-right: 20px;
	margin-bottom: 20px;
	margin-left: 10px;
/*	border: 2px solid #36ff00 ;*/
	text-align: center;
}
div#menu_gauche_ancien{
	float: left;
width: 140px;
	margin-top: 30px;
	margin-right: 10px;
	margin-bottom: 20px;
	margin-left: 10px;
/*	border: 2px solid #36ff00 ;*/
	text-align: center;
}

div#menu_cote{
	float: left;
	width: 100%;	
	margin-bottom: 30px;
	padding-bottom: 20px;
/*	background: url(img/bg_archive.gif);*/
	background: #FFFFFF ;
/*	border: 2px solid #363636 ;*/
	text-align: center;
}
div#titre_menu_cote{
	float: left;
	width: 100%-20px;
	margin-bottom: 10px;
	padding-left: 20px ;
	background: url(menu_article.gif) repeat ;
	text-align: left;
	font-size: 16px;
	color: #ffffff;
	font-weight: bold ;
}

div#amc{
	float: left;
	width: 100%-20px;	
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	padding-top: 0px ;
	padding-right: 0px ;
	padding-bottom: 0px ;
	padding-left: 0px ;
/*	background: url(img/bg_archive.gif);*/
	background: #FFFFFF ;
/*	border: 2px solid #c47d12 ;
*/	text-align: center;
}
div#titre_amc{
	float: left;
	width: 100%;	
/*	background: url(img/bg_archive.gif);*/
/*	background: #FFFFFF ;*/
/*	border-bottom: 2px solid #c47d12 ;*/
	text-align: center;
}
div#contenu_amc{
	float: left;
	width: 100%;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
/*	background: url(img/bg_archive.gif);*/
/*	background: #FFFFFF ;*/
/*	border: 2px solid #363636 ;*/
	text-align: center;
}


div#cadre_contenu_menu{
	float: left;
	width: 710px;
}
div#titre_contenu_menu{
	float: right;
	width: 530px;
	margin-top: 30px;
	background: url(menu_article.gif) repeat ;
	padding-left: 20px ;
	text-align: left;
	font-size: 16px;
	color: #ffffff;
	font-weight: bold ;
}
div#contenu_menu{
	float: right ;
	width: 530px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	padding-top: 10px ;
	padding-right: 10px ;
	padding-bottom: 10px ;
	padding-left: 10px ;
	text-align: center ;
/*	background: url(img/bg_page.gif) no-repeat 15px 100px ;*/
/*déco sur le côté de la page, espace à gauche et à droite du contenu */
/*	border: 2px solid #363636 ;
*/	background: #FFFFFF ;
}



div#titre_contenu{
	float: left;
width: 640px;
	margin-top: 30px;
	margin-left: 20px;
	background: url(menu_article.gif) repeat ;
	padding-left: 40px ;
	text-align: left;
	font-size: 16px;
	color: #ffffff;
	font-weight: bold ;
}
div#contenu{
	float: left;
	width: 640px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 20px;
	padding-top: 30px ;
	padding-right: 20px ;
	padding-bottom: 10px ;
	padding-left: 20px ;
	text-align: left ;
/*	background: url(img/bg_page.gif) no-repeat 15px 100px ;*/
/*déco sur le côté de la page, espace à gauche et à droite du contenu */
/*	border: 2px solid #363636 ;
	*/background: #FFFFFF ;
}



div#titre_contenu_menu_null{
	float: left;
	width: 880px;
	margin-top: 30px;
	margin-left: 20px;
	background: url(menu_article.gif) repeat ;
	padding-left: 40px ;
	text-align: left;
	font-size: 16px;
	color: #ffffff;
	font-weight: bold ;
}
div#contenu_menu_null{
	float: left;
	width: 880px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 20px;
	padding-top: 30px ;
	padding-right: 20px ;
	padding-bottom: 10px ;
	padding-left: 20px ;
	text-align: left ;
/*	background: url(img/bg_page.gif) no-repeat 15px 100px ;*/
/*déco sur le côté de la page, espace à gauche et à droite du contenu */
/*	border: 2px solid #363636 ;
	*/background: #FFFFFF ;
}
div#photo{
	float: center;
	border: 10px solid #ffffff ;
}
div#contenu h2{

	text-align: center ;

/* De même que pour le titre h2, à ceci près qu'on
 ne donne pas d'image décorative cette fois ci */
 }
div#contenu p{
	text-indent: 2em ;
	font-size: 1.0em ;
	line-height: 1.7em ;
/* On rend les paragraphes plus propre, alignement justifié,
 alinéa et hauteur de ligne supérieure à l'état normal pour aérer le tout */
}
/*div#contenu a
{
	color: #8a0 ;
}

div#contenu a:hover
{

	color: #9b2;
}

 On met en forme les liens contenu dans la page */

 
 
 
 
div#actu{
	float: right;

	width: 100%;	
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 50px;
	margin-left: 0px;
	padding-top: 0px ;
	padding-right: 00px ;
	padding-bottom: 0px ;
	padding-left: 0px ;

/*	background: url(img/bg_archive.gif);*/
	background: #FFFFFF ;
/*	border: 2px solid #363636 ;
	*/text-align: center;
}
div#produit_phare{
	float: right;

	width: 100%;	
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-top: 0px ;
	padding-right: 0px ;
	padding-bottom: 0px ;
	padding-left: 0px ;

/*	background: url(img/bg_archive.gif);*/
	background: #FFFFFF ;
	/*border: 2px solid #363636 ;
	*/text-align: center;
}	



div#demande_contact{
	float: center;
	width: 100%-20px ;
	height: 30px;
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 20px;
	padding-top: 0px ;
	padding-right: 5px ;
	padding-bottom: 0px ;
	padding-left: 5px ;
	clear : both;
	background: #FFFFFF ;
	text-align: center;
}
div#footer{/* Mise en forme de la partie pied de page */
	font-size: 14px;
	float: center;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px ;
	padding-right: 25px ;
	padding-bottom: 0px ;
	padding-left: 25px ;
	clear : both;
	line-height: 30px ;
	text-align: right ;
	background: #131313 ;
	border: 2px solid #dadada ;
	background: url(img/bg_footer.gif);
}



pre{
	overflow: auto ;
	background: #dea ;
	border: 2px solid #9b2 ;
	padding: 5px 0 0 5px ;
	font-size: 1.2em ;
}





/* En passant on définit l'overflow de la balise pre à auto pour
 permettre d'afficher des barres de défilement si le texte contenu
  dans cette balise est trop grand */

/* On doit donner une largeur au <pre> à cause d'Internet Explorer, 
on ne va donc l'appliquer qu'à Internet Explorer en utilisant le 
 commentaire conditionnel suivant, à placer dans la partie HTML, 
 et plus précisément dans l'élément <head> : */
/*

<!--[if IE]>
 <style type="text/css">
 html pre
{
	width: 636px ;
}
</style>
<![endif]-->

*/		



/*une couleur de fond, une bordure, la taille de police
 et un léger espace entre le texte et les bords du pre */

pre span
{
	color: #560 ;
}
/* Couleur de texte des éléments compris dans des span
 eux mêmes compris dans un pre */

pre span.comment
{
	color: #b30000 ;
}
/* Couleur différente pour les span.comment, les span
 utilisés pour les commentaires */