/*
+-----------------------------------=
|	Redfinition des balises HTML de base
+-----------------------------------=
*/img{border:none;}
		a:hover {border:0px } /* hack pour IE - ne sert sinon  rien */
		img.tab{width:60px;}
		a:hover img.tab{width:90px;}
a span { /* dfinition de la balise <span></span> inclue dans <a></a> */
		display: none;
		}
		/* a:hover span { /* dfinition de la balise <span></span> au survol 
		position:absolute;
		/* positions et dimensions du calque, que vous pouvez changer  loisir *//*
		margin-top:-125px;
		margin-left:5px;
		display:block;
		width: 100px;
		height:100px;
		background-color:#663300;
		font-size:12px;
		text-align: center;
		color:white;
		border-width:thin;
		border-style:groove;
		border-color:#3F1F00;
		}*/
		
html, body {
	margin:0;	padding:0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	background: #fff url('background.gif');
	color:#000;
	text-align:center;
}
form{	margin:0; padding:0; width:98%;	}
a{	color:#00c; text-decoration:none;	}
a:hover{	color:#CCC;
	}
label{	cursor:pointer;	}
label:hover{ color:#666; }
a img{	border:0;	}


/*
+-----------------------------------=
|	Classes personnalises diverses
+-----------------------------------=
*/
.centre{	margin: auto auto; text-align: center;	}
.spacer{	clear:both; visibility:hidden;	}
.hl{	font-style:italic; background-color:#ccffcc;	}
.dans_panier{	font-style:italic; background-color:#E9D6B5;	}
.disabled{	color:#666; font-style:italic;	}
.boutons_commande{	text-align:right;	}
li.pdf{ list-style:url("pdf.png"); }
li.dir{ list-style:url("dir.gif"); }

/*
+-----------------------------------=
|	#erreur : boite de messages d'erreur
+-----------------------------------=
*/

#erreur{
	border:1px solid #c00;
	margin:0 0 20px 0; padding:0;
	background:#ecbbbb url("fond-strie-gris.gif");
}
#erreur span{
	display:block;
	padding:5px;
	background:#c00 url("erreur-span.gif");
	border-bottom:1px solid #c00;
	
	color:#fff;
	font-weight:bold;
}
#erreur p{
	margin:0;	padding:10px;
}

/*
+-----------------------------------=
|	Formulaires
+-----------------------------------=
*/

input,
select,
textarea{
	margin:1px;
	border:1px solid #000;
	cursor:pointer;
}
input:focus,
textarea:focus{
	background-color:#E9D6B5;
}
input.invisible,
button.invisible{
	border:none;
	background-color:transparent;
	margin:0;
}

/*
+-----------------------------------=
|	Formulaires 2
+-----------------------------------=
*/
fieldset label{
	width:130px;
	display:block;
	float:left;
	text-align:right;
	padding:5px;
}
fieldset div{
	clear:both;
}
fieldset input,
fieldset select,
fieldset textarea{
	width:70%;
}
fieldset,
legend{
	border:1px solid #000;
	padding:4px;
}
fieldset{
	margin:10px 0 15px 0;
}
legend{
	background:#fff url("fond-strie-gris.gif");
	font-weight:bold;
	color:#b94603;
}
/*-- Options --*/
.options{ clear:both; }
.options label{ position:absolute; width:130px;}
.options-liste{ width:auto; margin:0 0 0 27%; padding:5px 0 0; }
.options-liste input{ width:auto; border:none; }
.options-liste label{ position:relative; width:auto; display:inline; float:none; }
/*
+-----------------------------------=
|	Formulaires 3 : boutons, icones etc
+-----------------------------------=
*/
.fauxbouton{ padding:2px 10px 2px 50px; }
.mini{ width:auto; }
.tel{ width:5%; }

.generique,
.valider,
.actualiser,
.vider{	background-color:#E9D6B5; border:1px #000 outset; margin:1px; color:#000; width:180px;	}
.generique:hover,
.valider:hover,
.actualiser:hover,
.vider:hover{	background-color:#fff;	}

.valider{	background:#E9D6B5 url("bouton-valider.gif") no-repeat 10px 50%;	}
.actualiser{	background:#E9D6B5 url("bouton-actualiser.gif") no-repeat 10px 50%;	}
.vider{	background:#E9D6B5 url("bouton-supprimer.gif") no-repeat 10px 50%;	}

.supprimer,
.ajouter{	border:0px solid transparent;	}
.supprimer{	background:#fff url("bouton-supprimer.gif") no-repeat 50% 50%; width:13px; height:13px;	}
.ajouter{	background:#fff url("bouton-ajouter.gif") no-repeat 50% 50%; width:18px; height:15px;	}

.bouton-medium{	width:220px;	}
.bouton-large{ width:280px;	}

/*
+-----------------------------------=
|	#conteneur : boite qui contient l'ensemble du site
+-----------------------------------=
*/
#conteneur {	width:750px; margin:20px auto; padding:0; border:1px solid #000; text-align:justify; position:relative;  background:#E9D6B5 url("background-conteneur.gif") repeat-y;	}

/*
+-----------------------------------=
|	#entete & #logo : bandeau "haut" du site
+-----------------------------------=
*/
#entete{	width:100%; height:92px; position:relative; background-color: #E9D6B5;	}
#bandeau,
#logo{	padding:0; margin:0; height:92px; float:left; }
#logo{	width:162px;  }
#bandeau{ background:url("bandeau.gif") no-repeat; width:588px; border-bottom:1px solid #000;}
#bandeau p{	padding:65px 0 0 0; margin:0; text-align:center; font-weight:bold;	}

/*
+-----------------------------------=
|	#contenu : mise en page du contenu interne de la page
+-----------------------------------=
*/
#centre {	padding:10px; margin:0 0 0 162px; width:568px; height: 800px;}
html>body #centre {  height:auto; min-height:800px;	}
#contenu td{	text-align:center;	}
#contenu tfoot{	background:transparent url("fond-strie-gris.gif"); text-align:right;	}
#contenu .add_caddie{	cursor:pointer;	}
#contenu h6{	margin:0; font-size:16px;	}
#contenu table{	width:100%;	}
#contenu h2{	font-size:16px; color:#c00; margin:0; text-align:left;	}
#contenu h3{	font-size:14px; color:#c01; margin-left:10px; text-align:left;	}
/*~~~~*/
#contenu .promotion{ width:46%; float:left; margin:0 0 25px 10px; position:relative; padding:10px 1px 18px 0; height:185px;  }
#contenu .promotion .desc{ text-align:left; font-size:80%; }
#contenu .promotion h2{ margin-bottom:10px; padding:2px; background:#c00; color:#fff; text-align:center; }
#contenu .promotion .prix{ position:absolute;bottom:1px; left:0px; clear:both; width:100%; }
#contenu .promotion .accroche{ float:left; width:auto; text-align:center; margin:0 4px 0 0; }
#contenu .promotion .sous-titre{ padding:1px; text-align:center; }
#contenu .promotion .autoscroll{ height: 130px; overflow:auto; }
#contenu .promotion .prix p{ display:inline; background:#fff; color:#000; padding:2px; margin:1px; }
#contenu .promotion .prix p.promo{ background:#ff0; color:#f00; font-weight:bold; font-size:130%; }
#contenu .promotion .prix p.invisible{ border:none; background:transparent; padding:0;}
/*
+-----------------------------------=
|	#menu : menu de gauche dans le site (en colonne)
+-----------------------------------=
*/

#menu {	width:162px; padding:5px 0; margin:0; background:#E9D6B5 url("bandeau-menu.gif") no-repeat; position:absolute; top:92px; left:0;  text-align:left; }
#menu hr{	visibility:hidden; margin:5px 0; padding:0;	}
#menu p{	padding:0 2px; margin:0; color:#fff;	}
#menu span{
	display:block;
	margin:0; padding:3px 3px 3px 5px;
	border-bottom:1px solid #000;
	border-right:1px solid #000;
	border-top:1px solid #000;
	background:#fff url("fond-strie-gris.gif");
	font-weight:bold;
}
#menu label{ text-align:left; }
#menu input{ width:96%; }
#menu ul{	list-style:square; margin:0; padding:0 0 0 20px;	}
#menu li:hover{	color:#fff;	}
#menu a,
#entete a{	color:#900; font-weight:bold;	}
#menu a:hover,
#entete a:hover{	color:#FFCC00; text-transform:capitalize;	}


/*
+-----------------------------------=
|	Styles relatifs  l'affichage des blocs de produits
+-----------------------------------=
*/

#contenu .bloc_entete{
	width:100%;
	border:0px none transparent;
	margin:0;
	clear:both;
}
#contenu .bloc_liste{
	width:100%;
	margin:0 0 20px 0;
	border:1px solid #666;
	border-right:2px solid #666;
}
#contenu .bloc_liste td,
#contenu .bloc_liste th{
	border-bottom:1px solid #666;
}
#contenu .bloc_liste .page{ text-align:left; color:#c00; }
#contenu .bloc_liste th{ background:#ccc; text-align:center; }
#contenu .description{
	border:1px solid #000;
	padding:10px;
	margin:2px 0;
	color:#000;
	background-color:#E9D6B5;
}
#contenu p{	text-align:justify;	margin:0 0 10px 0;	}
#arbo_liste{	list-style-type:none;	}
#arbo_liste li{	margin:5px 0;	}
#arbo_liste li a{font-weight:bold; 	}

/*
+-----------------------------------=
|	Affichage des lgendes (notamment dans le catalogue)
+-----------------------------------=
*/

#legende{
	width:95%;
	margin:10px auto;	padding:0 0 3px 0;
	background:transparent url("fond-strie-gris.gif");
}
#legende span{
	border-bottom:2px solid #666;
	display:block;
	padding:2px 0;
	font-size:15px;
	font-weight:bold;
	background-color:#fff;
}
#legende ul{
	list-style-type:none;
	margin:0;	padding:0 20px;
}
#legende li{
	margin:15px 0;
}

/*
+-----------------------------------=
|	#pied : bas de page, limite inutile mais existant
+-----------------------------------=
*/

#pied {	border-top:1px solid #000; text-align:right; font-weight:bold; margin:0; padding:3px 10px 3px 0; clear:both; background: #E9D6B5;	}

/*
+-----------------------------------=
|	#nav : arborescence de navigation dynamique
+-----------------------------------=
*/
#nav {	width:90%; padding:10px; margin: 10px auto; text-align:left; background-color: #E9D6B5; border: 1px solid #666;	}
#nav h1, #nav h2,#nav h3 {	display:block; margin: 0 1px; font-size:13px;	}
#nav h4, #nav h5{	display:inline; font-size:13px;	}
#nav h2{	margin-left:10px;	}
#nav h3{	margin-left:25px;	}
#nav h4{	margin-left:45px;	}