body 
	{
    color:#000;
	font-size: 0.7em;
	background-color: #1b1b19;
	background-image: url(images/bg.jpg);
	background-repeat:repeat;
	text-align: left;
	margin: 0 auto;
    padding: 0;
    text-align:center;
    font-family:Arial, Helvetica, Sans-serif;
	}
    
h1, h2, h3, h4, h5, h6 {font-family:Arial, Helvetica, Sans-serif; font-weight:normal;}
img {border:none;}

a {
	text-decoration:none;
	color:#7d7d7d;
}

a:hover{
	color:orange;
}

a img {border:none; text-decoration:none}

h1.acceuil {position:absolute; top:-5000px; left:-5000px}

h1 img {height:20px; margin-top:-6px}

h2.caps {color:#454130;text-transform: uppercase;font-size:1.2em;}
.caps h2{color:#454130;}

.vert{
	color:#c9ca40;
}

#tete {
	float:left; 
	width:958px; 
	background:#2c2c29 url(images/tete.jpg) no-repeat left top; 
	height:125px;
}

#tete-en {float:left; width:100%; background:#000 url(images/fd_tete-en.gif) no-repeat 175px top; height:69px; }
#logo {float:left}
#logo img{
	margin-top:14px;	
}

#slogan{
	float:left;
}
#slogan img{
	margin-top:14px;
	margin-left:150px;
}

/*#assistance {float:right; width: 125px; background:#000 url(images/fd-ass.gif) no-repeat left 16px}
#assistance p {margin:16px 2px 0 2px; font-size:0.9em; text-align:center; color:#eaeaea; line-height:18px}
#assistance span {background:#c1161a; padding:0 6px; color:#fff; }*/
#assistance img{
	float:right;
	margin-top:14px;
}

a.infobulle {
position:relative;
}

a.infoBulle span{
display:none;
}

a.infoBulle:hover{
background:none;
z-index:500;
}

a.infoBulle:hover span{
display:inline;
position:absolute;
z-index:500;
top:1.5em;
right:5em;
text-align:center;
background-color:#1b1b19;
text-decoration:none;
color:#fff;
padding:0.2em;
width:150px;
height:30px;
}

#page {width:960px; margin:0 auto;margin-top:15px; text-align:left;}
#centreGenerique {clear:both; width:100%; position:relative; /*background:#fff url(images/fd_menunav.jpg) repeat-y left top;*/}


/* WLUP Partie dynamique de l'accueil: effet de boutons positionnés en relative et images cachées en absolue*/
#centre {
	float:left;
	background-color:#232320;
}
#centre1 {
	float:left;
	background-image:url(images/centre1.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	width:224px;
	height:360px;
}
a#koko{
	position:relative;
	left:120px;
	text-decoration:none;
}
a#koko span{
display:none;
}
a#koko,#kova,#conik,#oeno,#ona,#senso:hover{
	background:none;/*Contournement d'un bogue d'IE */ 
	z-index:500;
}
a#koko:hover span{
display:inline;
position:absolute;
z-index:500;
top:11px;
left:9px;
}
*+html a#koko:hover span{/*Hack pour IE 7 */
top:83px;
}

a#kova{
	position:relative;
	left:-76px;
	top:190px;
	text-decoration:none;
}
a#kova span{
	display:none;
}
a#kova:hover span{
	display:inline;
	position:absolute;
	z-index:500;
	top:-262px;
	left:196px;
}
*+html a#kova:hover span{
	top:-190px;
}

a#ona{
	position:relative;
	top:187px;
	left:124px;
	text-decoration:none;
}
a#ona span{
	display:none;
}
a#ona:hover span{
	display:inline;
	position:absolute;
	z-index:500;
	top:-261px;
	left:5px;
}
*+html a#ona:hover span{
	top:-190px;
}
#centre2 {
	float:left;
	background-image:url(images/centre2.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	width:208px;
	height:360px;
}
#centre3 {
	float:left;
	background-image:url(images/centre3.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	width:183px;
	height:360px;
}
#oeno{
	position:relative;
	text-decoration:none;
}
#oeno span{
	display:none;
}
#oeno:hover span{
	display:inline;
	position:absolute;
	z-index:500;
	left:-208px;
	top:-71px;
}
*+html #oeno:hover span{
	top:0;
}

#senso{
	position:relative;
	left:130px;
	top:-2px;
	text-decoration:none;
}
#senso span{
	display:none;
}
#senso:hover span{
	display:inline;
	position:absolute;
	z-index:500;
	top:-196px;
	left:-338px;
}
*+html #senso:hover span{
	top:-83px;
}

#conik{
	position:relative;
	top:60px;
	text-decoration:none;
}
#conik span{
	display:none;
}
#conik:hover span{
	display:inline;
	position:absolute;
	z-index:500;
	top:-322px;
	left:-208px;
}
*+html #conik:hover span{
	top:-272px;
}

/* WLUP - FIN - Partie dynamique de l'accueil: effet de boutons positionnés en relative et images cachées en absolue*/


#annonce2{
	background-color:#232320;
	float:left;
	font-size:1.1em;
	width:147px;
	height:359px;
	text-align:center;
}
#annonce2 img{
	margin:5px auto;
}

#annonce2 a{
	color:#dedede;
	text-decoration:none;
	text-align:center;
}

#annonce2 a:hover{
	color:#c9ca40;
}
#annonce2 .institu {
	list-style-type:none;
	margin:0;
	padding:0;
	margin-bottom:5px;
	margin-left:17px;
	text-align:left;
}

#annonce{
	background-color:#232320;
	float:left;
	font-size:1.1em;
	width:123px;
	height:359px;
	text-align:center;
}
#annonce img{
	margin:5px auto;
}

#annonce a{
	color:#a6a6a1;
	text-decoration:none;
	text-align:center;
}

#annonce a:hover{
	color:#3ea62c;
}

#annonce .institu {
	list-style-type:none;
	margin:0;
	padding:0;
	margin-bottom:5px;
	margin-left:10px;
	text-align:left;
}



#navigation {
	width:196px; 
	/*height:375px;*/
	float:left;
	background-color:#121211;
}

#home{
	text-align:center;
}

.produits{
	list-style-type:none;
	margin:0;
	padding:0;
	font-size:1.1em;
	text-align:center;
}
.produits li{
	background-image:url(images/sepMenu.jpg);
	background-position:left top;
	background-repeat:no-repeat;
}

.produits a{
	text-decoration:none;
	color:#a6a6a1;
	display:block;
	margin:0;
	line-height:1.76em;
}

.produits a:hover{
	color:#c9ca40;
}


#contenuAccueil{width:630px; float:left;}

#contenu {width:615px; float:left; padding:0; background-color:#a58c7c;}
.menuImages {margin-left:75px;}

#contenu h1{color:#808285;}

#pied{
	height:40px;
	width:958px;
	background-color:#2c2c29;
	background-image:url(images/pied.jpg);
	background-position:left bottom;
	background-repeat:no-repeat;
	clear:both;
	display:block;
	text-align:center;
	margin:0 auto;
}

#pied p{
	margin-top:10px;
	list-style-type:none;
	margin-left:70px;
	padding:0;
}

#navPied li{
	display:inline;
	
}
#navPied a{
	font-size:1.1em;
	text-decoration:none;
	color:#f0f0f0;
}
#navPied a:hover{
color:#c9ca40;
}

.effetMade{
a:hover span.effetMade {display:block; position:absolute; top:127px; left:440px; width:264px; height:379px; background:#fff url(images/menu/madeinFrance.jpg) no-repeat;}
.effetMade{color:#2c2c29;}
}

#sousPied {
	clear:both; 
	text-align:center;
	margin:0 auto;
}
#sousPied p{
	margin:0;
}

#sousPied a {
	color:#2c2c29;
	text-decoration:none;
	font-size: 0.9em;
}
#sousPied a:hover, #pied a:focus{
	color:#faa61a;
	text-decoration:none;
}

/* Menu Selection du fond 
#selectFond {position:absolute;display:block;left:176px;top:20px!important;top:0px;width:658px;border:1px solid #000;border-top-width:0;border-left-width:0;border-right-width:0;height:23px;padding-bottom:20px;}

#selectFond a {margin:0 5px 0 0;}*/

/* Navigation langue 

#navigation ul.lang {width:100%; background:#fff;border-bottom:1px solid #888;border-top:0px solid #888;}
#navigation .lang li {display:inline; text-align:center;}
#navigation .lang a {padding:0; display:block; font-size:0.9em; margin:4px 0}
#navigation .lang a:hover, #navigation .lang li:hover a {font-weight:normal; color:#232320}
#navigation .lang li.fr {width:75px;}
#navigation .lang li.en {width:75px;}
#navigation .lang li.en a {border-left:1px solid #888; border-right:0px solid #888}
#navigation .lang li a.actif {}
#navigation .lang li a.actif:hover {background:#000; color:#ccc; font-weight:normal}


#navigation {text-align:left;}
#navigation .bordure {float:left}
#navigation ul, #navigation li {margin:0; padding:0; list-style:none; }
#navigation ul.produits {margin:0}

#navigation li {float:left; width:100%; background:#000; border-top:0px solid #888}
#navigation a {text-decoration:none; color:#fff; display:block; padding:0 6px 0 12px}
#navigation li a {font-size:1em ; padding:3px 6px 2px 12px; color:#fff; }
#navigation li a:hover, #navigation li:hover a {background:#000 ; color:#fff; font-weight:bold}
#navigation h2 {border-bottom:1px solid #888}
#navigation h2.premier {clear:both}
#navigation h2, #navigation h2 a {font-weight:normal; color:#fff; font-size:1em; margin:0; background:#000;}
#navigation h2 a {padding-top:2px; padding-bottom:3px}
#navigation h2 a:hover {background:#fff ; color:#000}*/

h2.gamme {display:none}
h2.filet {clear:left; border-top:0px solid #fff}

li a span {position:absolute; top:-1000px; width:125px; height:125px; text-align:left; }

/*#navigation li a.actif:hover {background:#eaeaea; font-weight:bold; color:#666}

.couleurA {background:#1b1b19;}
.couleurB {background:#9BCD66;}
.couleurC {background:#94002D;}
.couleurD {background:#1DBBB0;}
.couleurE {background:#E98034;}
.couleurF {background:#942D58;}
.couleurG {background:#FAA61A;}
.couleurH {background:#F48F9F;}
.couleurI {background:#FFFFD4;}*/

li.actif a{
	background-image:url(images/menu_pucegrise.gif);
	width:196px;
	background-repeat:no-repeat;
	background-position:right center; 
	color:#fff; }
/*#navigation h2.actif a {background:#e1e1e1; url(images/menu_pucegrise.gif) no-repeat center right; color:#1b1b19; }*/

/**********************************************************************************************
                               Page contenu
**********************************************************************************************/
/*lien pour naviguer entre chaques pages */.pages {float:left; width:100%; }
.pages ul, .pages li {margin:0; padding:0; list-style:none}
.pages ul {float:right;}
.pages li {float:left; margin:0 1px}
.pages li a {display:block; padding:0px 4px; background:#ededed; color:#000; text-decoration:none}
.pages li a:hover {background:#000; color:#fff}
.pages li a.actif {background:#000; color:#fff}

.bordure {}
/*#contenu .generiqueBordure {margin-top:12px;border:1px solid white;}*/

#contenu .generiqueBordure p {margin:6px;}
#contenu .generiqueBordure h1, #contenu .generiqueBordure h2, #contenu .generiqueBordure h3 {margin:0 0 6px 0}
#contenu .generiqueBordure h2 {margin-top:12px; border-bottom:0px solid #932C59; clear:both; color: #932C59; font-weight: bold}
#contenu .generiqueBordure ul {margin:0 auto;}

.cgv { margin:0; padding:2px 0 6px 0; clear:both;color:#a1a19a;}
#contenu .cgv {font-size:1em;}

.infos {float:left; width:100% }
.infos p{
	color:#ededed;
}
.infos img{
	text-align:center;
	margin:0 auto;
}
.doubleCol {float:left; width:100%; }
#contenu p.big, #contenu h2.big {font-size:1.6em; color:#72726d; font-weight:bold; border:none}

#contenu .generiqueBordure address {text-align:center}

.signature {padding-top:12px}
.fright {float: right; margin: 0 24px 0 12px}
.fleft {float: left; margin: 0 12px 0 24px}


.pictoBaisse {float:right; margin-top:-20px; margin-bottom:6px}
.imgDroite {float: right; margin: 0 0 0 12px}
.imgGauche{float: left; margin: 0 12px 0 0}

#contenu .col1 {float:left; width:300px; text-align:left; padding:22px 0; }
#contenu .col2 {float:right; width:300px; text-align:left; padding:22px 0;  }

#contenu .infos .col1 {float:left; width:300px; text-align:left; padding:12px 0 12px 0; }
#contenu .infos .col2 {float:right; width:300px; text-align:left; padding:12px 0 12px 0;  }

#contenu p {margin:6px 0; font-size:1em; text-align:justify;}
#contenu .double {float:right; width:630px; padding:12px 0 12px 0; }
#contenu .double p {text-align:center;}
#contenu p.center {text-align:center; margin:0; padding:0}

#contenu h1 {font-size:1.6em;letter-spacing:0.3em; margin:0; padding:0px 8px; text-align:left; font-weight:bold}
#contenu h2 {font-size:1.1em; margin:0; padding:0px 8px; text-align:left}
#contenu h3 {font-size:1.1em; margin:0; padding:0px 8px; color:#666; text-align:left; font-weight:bold}

#contenu ul {margin:6px 12px 6px 32px; font-size:1em; text-align:left;}
#contenu p.dim {text-align:left; margin-top:12px; color:#666; font-style:italic; font-size:0.9em }
#contenu span.dim {text-align:left; margin-top:12px; color:#666; font-style:italic; font-size:0.9em }

#contenu .blocTableau {padding:0 }
#contenu table {margin:0; width:95%; font-family:tahoma; border-top:1px solid #000;}

html>body #contenu .blocTableau {margin:0; padding:0;}
html>body #contenu table {margin:0; width:100%; font-family:tahoma; border-top:1px solid #000;}

#contenu .double table {margin:0 auto; width:45%;}
#contenu th {font-weight:normal; background:#fff;  color:#000; padding:0; font-size:11px; white-space:nowrap}
#contenu td {padding:0; font-size:11px; text-align:left; }
#contenu tr {background:#ededed;}
#contenu tr.impaire {background:none}

#contenu td a {color:#000}
#contenu td a:hover {color:red}

#contenu .legende {font-size:0.9em; font-style:italic;}
#contenu p.titreImage {text-align:center; margin-top:24px; margin-bottom:24px}

/**********************************************************************************************
                               ELEMENTS SPECIAUX
**********************************************************************************************/

/**********************************************************************************************
                               Page contact
**********************************************************************************************/
#formulaireContact {width:400px; margin:0 auto;}

.formulaireContact {color:#ededed;}
.formulaireContact div { padding:6px 0; margin:0 7px;height:400px;margin-bottom:30px; }
html>body .formulaireContact div {margin:0}
.formulaireContact legend { padding:6px 12px 6px 0px; }

#contenu .contact .mentions {text-align:right}
.contact { font-family: Arial, Helvetica, sans-serif; }
.contact fieldset {margin:12px 0 0 0; border:1px solid #72726D; padding:0}
#contenu .contact p {margin:12px;}
.contact label {float:left;width:100px;text-align:right;padding-right:12px;line-height: 1.5em;}
.contact input {width:150px;font-size: 1em;border:1px solid #72726D}

.contact textarea {width: 235px;border:1px solid #72726D; height:72px}
.contact .bouton {width: 100px;background:#dadada url(images/puce_noir-ea.gif) no-repeat left center; border:1px solid #72726D; cursor: pointer; margin-left:12px}

.contact select {width:150px; font-size:0.9em; border:1px solid #72726D}

#centreGenerique p.vignetteFormulaire {text-align:center; margin-top:48px}
/**********************************************************************************************
                               Page catalogue
**********************************************************************************************/
/*#formulaireCatalogue {width:250px; margin:0 auto;}
.formulaireCatalogue {}
.formulaireCatalogue div {background-color:#eaeaea; padding:6px 0; margin:0 7px 0 0}
html>body .formulaireCatalogue div {margin:0}
.formulaireCatalogue legend {background-color:#eaeaea; padding:6px 12px 6px 15px; }

#contenu .renseignements .mentions {text-align:right}
.renseignements {font-family: Arial, Helvetica, sans-serif; }
.renseignements fieldset {margin:12px 0 0 0; border:1px solid #fff; padding:0}
#contenu .renseignements p {margin:12px;}
.renseignements label {float:left;width:100px;text-align:right;padding-right:12px;line-height: 1.5em;}
.renseignements input {width:235px;font-size: 1em;border:1px solid #ccc;margin-left:100px;}
.renseignements label.ville {width:40px}

.renseignements textarea {width: 235px;border:1px solid #ccc; height:40px}
.renseignements .bouton {width: 100px;background-color:#eaeaea; border:1px solid #ccc; cursor: pointer; margin-left:12px}
.renseignements select {width:150px; font-size:0.9em;}
.renseignements label, .inscription input, .inscription textarea {}

#genre {width:200px; padding-left:30px;}
html>body #genre {width:auto; }
#mme, #melle, #mr {width:30px; border:none; }
#formulaireCatalogue p#genre { padding-top:6px;}
#genre label {width:auto; padding-right:6px; padding-left:12px; padding-bottom:6px}
.mme {margin-left:112px}
.renseignements input {width:235px;font-size: 1em;border:1px solid #ccc}*/
.formulaireCatalogue {width:390px;padding-top:70px;}
.formulaireCatalogue p{line-height:1.2em;padding-right:0;}
.imgFondCata {margin-top:0;background-image:url(images/demandcatalog2010-3.jpg);background-repeat:no-repeat;background-position:top left;width:610px;height:550px;color:#ededed;}
.imgFondCataEn {background-image:url(images/fdCatalogueEn.jpg);background-repeat:no-repeat;width:610px;}
.renseignements{margin-left:265px;margin-top:0;font-family:arial;}
.renseignements label{line-height: 1.5em;}
input{border: 1px solid #72726D;font-size:1em;}
select{border: 1px solid #72726D;}
textarea{width:235px;border:1px solid #72726D; height:40px;}
#genre input{border:0;}

/**********************************************************************************************
                               Page identification
**********************************************************************************************/
#formulaireIdentification {background-color:#000;border:1px solid white;width:400px; margin:20px auto 0 auto; padding:6px 0}
#formulaireIdentification p.boutonEnvoyer {margin-left:50px;}
#nouveauClient, #nouveauClientSite {background-color:#000;border:1px solid white;width:400px; margin:12px auto; padding:6px 0;}

#formulaireIdentification #email, #pass, #codeclient {width:150px; font-size: 1em;border:1px solid #ccc}
#formulaireIdentification label {width:140px; float:left; text-align:right; margin-right:6px}
#nouveauClient a, #nouveauClientSite a {background:#000;border:1px solid white; url(images/fond_creecompte1.gif) no-repeat left center; padding:2px 12px 2px 16px;text-decoration: none; color: #808080;}
#nouveauClient a:hover{color:#faa61a;}
#nouveauClientSite a:hover{color:#faa61a;}


p.imp { text-align:left; padding:2px 30px}
p.info {padding-top:12px; font-style: italic;}

/**********************************************************************************************
                               Page inscription / verification
**********************************************************************************************/
#formulaireInscription {width:400px; margin:0 auto; background: #fff}

#contenu .inscription .quoifaire {text-align:center; font-size:0.75em} 
#contenu .inscription .attention {text-align:center; font-size:1em} 
#contenu .inscription .mentions {text-align:right}
.inscription {font-family: Arial, Helvetica, sans-serif; }
.inscription legend {padding:0 12px}
.inscription fieldset {margin:12px 0 0 0; border:1px solid #fff; padding:0}
#contenu .inscription p {margin:12px;}
.inscription label {float:left;width:100px;text-align:right;padding-right:12px;line-height: 1.5em;}
.inscription input {width:235px;font-size: 1em;border:1px solid #ccc}

.inscription textarea {width: 235px;border:1px solid #ccc}
.inscription .bouton {width: 100px;background:#eaeaea; border:1px solid #ccc; cursor: pointer}
.inscription select {width:150px; font-size:0.9em;}
.inscription label , .inscription input, .inscription textarea {}

.inscription label.ville {width:40px}
#telephone, #telephoneL, #telecopie, #telecopieL {width:150px}
#cp, #cpL {width:50px;} 
#ville, #villeL {width:130px; float:left; margin-bottom:12px}

.facturation {background: #fff}
.facturation div {background:#eaeaea; padding:6px 0; margin:0 7px}
html>body .facturation div {margin:0}
.facturation legend {background:#eaeaea url(images/fond-legend1.gif) no-repeat top left; padding:6px 12px 6px 15px; }



.livraison {background: #fff}
.livraison div {background:#ccc; padding:6px 0; margin:0 7px}
html>body .livraison div {margin:0}
.livraison legend {background:#ccc url(images/fond-legend2.gif) no-repeat top left; padding:6px 12px 6px 15px; }



/**********************************************************************************************
                               Formulaires style option
**********************************************************************************************/

/*** Mise en avant des champs en cours d'utilisation ***/
.contact .focus, .inscription .focus {
background: #eaeaea;
color: black;
}
/*** Retour à l'état normal après l'utilisation ***/
.contact .normal, .inscription .normal {
background: white;
color: black;
}
.contact a.aide, .inscription a.aide {
text-decoration: none;
background-color: #eaeaea;
border: 1px solid #ccc;
padding: 0 3px;
font-weight: bold;
}
.error {border:1px solid #ccc;background-color:#FF0000;padding:12px 0}
p.infoErreur {color:#FF0000;font-weight:bolder;margin:0 12px; float:left; width:350px}

/**********************************************************************************************
                               Page commande (caddie)
**********************************************************************************************/
#formulaireCaddie, #ajoutProduit {width:600px; margin:32px auto; background: #fff; }
#contenu .caddie p{text-align:center}
.caddie label {width:100px; padding-right:12px; line-height: 1.5em;}
.caddie input {width:150px; font-size: 1em; border:1px solid #ccc}
.caddie input#ajouter {width:100px}

#formulaireCaddie table th, #formulaireCaddie table td{font-size:1em;}
#formulaireCaddie table th {padding:3px 6px; font-weight:bold}
#formulaireCaddie table td {padding:0 12px; background:#eaeaea}
#formulaireCaddie td.ref {width:60px}
#formulaireCaddie td.designation {}
#formulaireCaddie td.action {text-align:center}
#formulaireCaddie td.puht {width:50px}
#formulaireCaddie td.ptht {width:70px}
#formulaireCaddie td.quantite {text-align:center; width:50px; }
#formulaireCaddie td input#caddieQuantite {width:40px; text-align:center}

table#recapitulatifPanier {width:250px; float:right}

#boutonsPanier {clear:both; background:#eaeaea; text-align:right; }
#boutonsPanier input {width:auto; font-size: 1em; border:none; background:#666; color:#fff; font-weight:bold; padding:4px 10px; margin-left:3px}

#paysLivraison {float:left; width:330px; padding-top:32px; text-align:center}
#paysLivraison p {text-align:center; margin-top:6px}
#paysLivraison select {width:100px; font-size:0.9em; }

/**********************************************************************************************
                               COMPLEMENTS
**********************************************************************************************/
.alerte {border:1px solid #ccc; background:#eaeaea; margin:24px}
#stats {text-align:center;margin-top:0 !important; margin-top:12px;}
.clear {clear:both}

/**********************************************************************************************
                               Edito
**********************************************************************************************/

.edito{
	display:block;
	width:450px;
	margin:0 auto;
}

/**********************************************************************************************
                               Article de Presse
**********************************************************************************************/

#presse a{
	color:#ededed;
}
#presse a:hover{
	color:#c9ca40;
}