body {
font-family:Arial, Helvetica, sans-serif;
font-size:.8em; 
color:#000000; 
margin:20px 0 0 0;
padding:0 0 0 0;
background:#ffffcd;

}

.hidden {
   display: none;
}

.visible {
   display: inline;
}

p {
margin-bottom:8px;
line-height:1.1em;
}

strong {
font-weight:bold;
}
hr { width:100%; border: 1px solid #09BE00; padding:1px;background:#4D84BD;}
em {font-style:italic;}

a {
font-family:Arial, Helvetica, sans-serif;
font-size:12px; 
color:#993300;
text-decoration:none;
font-weight:bold;
}
a:hover {
color:#000;
text-decoration:none;
font-weight:bold;
}
.titrepage {
font-family:Arial, Helvetica, sans-serif;
font-size:18px; 
width:520px;
height:20px;
line-height:20px;
text-align:center;
background-color: #993300;
border-top:1px solid #757575;
border-bottom:1px solid #757575;
color:#FFF; 
margin-bottom: 5px;
margin-top: 10px;
}

.titredroite {
font-family:Arial, Helvetica, sans-serif;
font-size:15px; 
font-weight:bold;
width:190px;
height:20px;
line-height:20px;
text-align:center;
background-color: #993300;
border-top:2px solid #757575;
border-bottom:2px solid #757575;
color:#FFF; 
margin-bottom: 0px;
margin-top: 5px;
}
.titregauche {
font-family:Arial, Helvetica, sans-serif;
font-size:15px; 
font-weight:bold;
width:150px;
height:20px;
line-height:20px;
text-align:center;
background-color: #993300;
border-top:2px solid #757575;
border-bottom:2px solid #757575;
color:#FFF; 
margin-bottom: 0px;
margin-top: 5px;
}
.titre {
font-family:Arial, Helvetica, sans-serif;
font-size:1em; 
color:#000000; 
margin:0;
padding:0 ;
}

.titrebleu {
font-family:Arial, Helvetica, sans-serif;
font-size:14pt; 
color:#4D84BD; 
}
.titrenoir {
font-family:Arial, Verdana, Helvetica, sans-serif;
font-size:14pt; 
color:#000; 
font-weight: bold;
}
.titreblanc {
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#FFF;
	font-weight: bold;
}
.ref {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11pt;
	color:#B5613A;
	font-weight: bold;
}
.nom {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#005173;
	text-transform: uppercase;
	text-decoration:none;
	font-weight: bold;
	}
.prix {
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#CC0000;
	font-weight: bold;
	}
.promo {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	padding:5px;
	font-weight: bold;
	background-color: #FFCC33;
	border:1px solid #CC0000;
	color:#CC0000; 
	}

.grasjaune {
font-family:Arial, Helvetica, sans-serif;
font-size:1em; 
color:#FFCC33; 
}
.imageD {float:right; margin-left:10px; margin-bottom:5px;border: 1px solid #ffcc99;}
.imageG {float:left; margin-right:10px;margin-bottom:5px; border: 1px solid #ffcc99;}
.grasrouge {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #CC0000;
	font-weight: bold;
	}
.alerte {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #CC0000;
	font-weight: bold;
	}
.message {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height:16px;
	color: #993300;
	font-weight: bold;
	}

.grasbleu{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #4D84BD;
	font-weight: bold;
	}
.grasnoir {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000;
	font-weight: bold;
	}
.grasmarron {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	font-weight: bold;
	}

.entetepage {
font-family:Arial, Helvetica, sans-serif;
font-size:20px; 
width:700px;
height:30px;
line-height:30px;
text-align:center;
background-color: #3366CC;
border-top:1px solid #757575;
border-bottom:1px solid #757575;
color:#FFF; 
}

.clear { clear: both;}

/* ###########################    DEBUT DU GABARIT ################################# */
#container {
margin:0 auto;
padding:0;
width:930px;
border:0px solid #555;
background:url(images/container.jpg);
background-position:0 0;
background-repeat:repeat-y;
}

/* << ----------------// Header //---------------->> */
#header {
 margin:0;
 padding:0;
 width:930px;
 height:175px;
 background-image:url(images/bandeau.jpg);
 background-position:0 0;
 background-repeat:no-repeat;
}

#titreheader
{
position:relative;
float: left;
margin-top:15px;
margin-left:170px;
width : 400px;
height: 70px;
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height:18px;
	color: #993300;
	font-weight: bold;
/*border: 1px solid #000;*/
}
*html #titreheader { margin-left:82px;}
/* ----------------- Menu horizontal ----------------------- */
#navBar {
float:left;
margin-top: 35px;
margin-left:163px;
padding:0;
width:558px;
height:30px;
line-height:30px;
background:url(images/fondhaut.png);
background-position:0 0;
background-repeat:repeat-x;
}
*html #navBar { margin-left:82px;}

#navBar ul{
list-style-type:none;
margin-left:20px;
}

#navBar li{
margin:0;
padding:0;
list-style-type:none;
display:inline;
background-image:none;
}

#navBar li a{
margin:0 0 0 -5px;
padding:9px 20px 9px 20px;
color:#ffffff;
text-decoration:none;
font-size:1.1em;
border-left:1px solid #757575;
}
#navBar ul li a:hover{
color:#ffffff;
text-decoration:none;
background-color:#AC4B41;
background-image:url(images/fondhaut-hover.png);
background-position:0px 2px;
background-repeat:repeat-x;
}

#navBar li.end {
margin:0;
padding:0;
list-style-type:none;
display:inline;
background-image:none;
}

#navBar li.end a{
margin:0 0 0 -5px;
padding:9px 20px 9px 20px;
color:#ffffff;
text-decoration:none;
font-size:1.1em;
border-left:1px solid #757575;
border-right:1px solid #757575;
}

#navBar li.end a:hover{
color:#ffffff;
text-decoration:none;
background-color:#AC4B41;
}

/* << ----------------// zone référencement //---------------->> */
#referencement
{
clear: left;
margin-top:5px;
margin-left:170px;
width : 500px;
height: 30px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height:16px;
	color: #ffffcd;
	font-weight: bold;
/*border: 1px solid #000;*/
}

/* << ----------------// gauche //---------------->> */
#gauche {
 float:left;
 color: #333;
 background:#7FE57F;
 margin: 0px;
 margin-top:20px;
 margin-left:7px;
 padding: 0px;
 width: 151px;
}

*html #gauche { margin-left:4px;}

#gauche ul li{
 margin: 0px;
 padding: 0;
}
#gauche table tr td{
padding:3px;
}

/* << ----------------// centre //---------------->> */
#centre {
float:left;
margin-left:10px;
margin-right:5px;
padding:10px;
padding-top:0;
width:520px;
font-family:Arial, Helvetica, sans-serif;
font-size:13px; 
line-height:15px;
/*border: 1px solid #000;*/
}
#centre table tr td{
padding:3px;
border: 1px;
}

#centre ul li{
	padding:3px;
	margin:0;
	}

/* << ----------------// droite //---------------->> */
#droite {
float:right;
margin:0;
margin-top:-50px;
padding:5px;
width:193px;
color: #333;
}



/* << ----------------// Footer //---------------->> */
#footer {
margin:0;
padding:0;
width:930px;
clear: both;
height:68px;
background: #FFF;
background-image:url(images/bas.jpg);
background-position:bottom center;
background-repeat:no-repeat;
border-top: 0px solid #FFCC99;
}

#footer p {
margin:0;
padding: 10px;
line-height:10px;
font-family:Arial, Helvetica, sans-serif;
font-size:.8em;
color:#000;
text-align:center;

}
/* ###########################    FIN DU GABARIT ################################# */
/* << ----------------// Fix so that the outer DIV will wrap around all floated DIVs within //---------------->> */
.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#detail {
float:left;
margin-top:0px;
margin-bottom:5px;
padding:5px;
font-family:Arial, Helvetica, sans-serif;
width:475px;
font-size:1em;
color:#000000;
border: 1px solid #FFCC99;
}
input[type=button], input[type=reset], input[type=submit] {
margin-top:0;
border:1px outset #B5613A;
font-weight:bold;
cursor:pointer;
background-color:#FFCC99;
color:#B5613A;
}

#boite 
{
float:left;
clear:both;
margin-top:5px;
margin-bottom:5px;
padding:5px;
width:470px;
background-color:#FFFFFF;
border:1px dashed #3366CC;
}

#boite table tr td
{
vertical-align:middle;
padding:2px;
border:1px solid #FFCC99;
}


/* pagination n° de page */
#pagination {
margin:5px;
padding:3px;
font-size:1em; 
width:480px;
font-size:1.1em;
text-align: center;
}
#cadre180{
margin:0;
padding:5px;
width:180px;
background-color:#FFF;
border-top:1px solid #3366CC;
border-bottom:1px solid #3366CC;
}
#cadre180 p 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height:12px;
	color: #0C5F9C;
	font-weight: bold;
}
#pagination a, #pagination a:link, #pagination a:visited, #pagination a:hover, #pagination a:active  
{
padding-left:5px;
padding-top:5px;
padding-bottom:5px;
background-color:#FFCC99;
color: #000;
text-decoration:none;
text-align: center;
}
#pagination a:hover, #pagination a:active
{
background-color:#B5613A;
color: #FFF;
text-align: center;
}
#technique {
	clear:left;
	width:182px;
	margin-top:50px;
	padding:2px; 
	border:0;
	padding-top: 5px;
	text-align:center;
	background:#fa4;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	font-weight:bold;
	color:#000;
	border-bottom: solid 2px #B5613A;
}

#panier {
margin:0;

padding:2px;
width:148px;
height: 65px;
background: #FFFFCC;
}



#panier H1{
		padding:2px; margin:0; border:0;
		padding-top: 5px;
		text-align:center;
		background:#fa4;
		font-family:Arial, Helvetica, sans-serif;
		font-size:15px; 
		font-weight:bold;
		color:#000000;
		border-bottom: solid 2px #B5613A;
	}