/* CSS Document */
html{height:100%;}
body {
  font-family:verdana, sans-serif;
  text-align:center;
  margin-top:0px; 
  background-color:#FFF;
  height:100%;
  background-repeat:repeat-x;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:9px; 
  position:relative;
}

body#orange{background-image:none;}
body#bleu{background-image:none;color:#10C6F3;}
body#vert{background-image:none;color:#86C400;}
body#violet{background-image:none;color:#C84CEC;}
body#rose{background-image:none;color:#F3007A;}
body#marron{background-image:none;color:#CC6633;}
body#bleu_sombre{background-image:none;color:#3765ce;}

body#orange h1,h2{color:#4D4D4D;}
body#orange h1{font-size:16px; font-weight:bold;}
body#orange h2{font-size:14px;}

div.bleu a{color:#10C6F3;}
div.vert a{color:#86C400;}
div.violet a{color:#C84CEC;}
div.rose a{color:#F3007A;}
div.marron a{color:#CC6633;}
div.bleu_sombre a{color:#3765ce;}



a {text-decoration:none;}
img {border:none;}

/*conteneur de la page*/
#page{
  margin: 0 auto;
  text-align: left;
  width:996px;
  top:0px;
}
	
/*pour les éléments faisant toute la largeur de l'?cran
pour le moment le bandeau et le conteneur du menu d'onglet
*/
.largeur_totale{
  position:relative;
  width:996px; 
  left:0px;
  top:0px; 
}

/*le bandeau haut*/
#bandeau{
  height:106px;
  width:100%;
  display:block;
background-color:white;
}

/*le conteneur des onglets*/
#onglet_conteneur{
  height:21px;
  width:100%; 
  color:#FFFFFF;
z-index:35;
}

#onglet_conteneur div{
	height:21px; 
	vertical-align:top; 
	float:left;
	background-repeat:no-repeat;
	display:block;
	
	
}

#onglet_conteneur ul#nav{position:relative; left:145px;z-index:35;}

#recherche_conteneur{
  position:relative;
  display:none;
}



#form_recherche{position:absolute;float:left; left:340px;}
#form_news{float:right}

.ok{vertical-align:middle;}


/*pour les zones de la page : gauche, corps, droite*/

div#conteneur_corps{
  position: relative;
  top:6px;
  width:996px; 
}	
	

.zone_cote{
  position:relative;
  background-color:#F6F6F6;
  top:10px;
}

/*la zone gauche*/
#zone_gauche{
  float:left; 
  width:180px;
  display:none;
}

/*le corps de la page qui contient les ?l?ments comme les images des produits*/
#zone_corps {
  width:600px;
  background-color:#FFF;
  top:25px;
  /*margin:0 0 0 185px !important;*/
  margin:0;
float:left;
}


/*la zone droite*/

#zone_droite{
  margin-left:790px;
  width:169px;
  display:none;

}


#footer{
	height:50px;
	width:100%;
	background-color:white;
	text-align:center;
	color:#666;
	clear:both;
	position:relative;
	top:20px;
	
}

	#footer p{width:600px; margin:5px auto; padding:0; height:15px;font-size:11px; }
	#footer a{color:white; text-decoration:underline;font-weight:bold;}
	#footer a:hover{color:#FF6600;}
	#footer span{ font-size:9px; color:#666666}
		#footer span a{color:#666666;}
		#footer span a:hover{color:#666666;}
	#lewebinteractif{ float:left; margin-left:23px;}
	#oblady{ float:right; margin-right:23px;}

/*le sous menu au dessus des images*/
#sous_menu{
  left:0px;
  top:9px;
  width:600px;

}

/*le conteneur de couleur*/
#sous_menu div{
	background-repeat:no-repeat;
	width:600px;
	font-size:11px;
	top:0px;
	margin:0px; padding:0px;
	
}

body#bleu #zone_corps a{color:#10C6F3;}
body#vert #zone_corps a{color:#86C400;}
body#violet #zone_corps a{color:#C84CEC;}
body#rose #zone_corps a{color:#F3007A;}
body#marron #zone_corps a{color:#CC6633;}
body#bleu_sombre #zone_corps a{color:#3765ce;}


.encaps_ssmenu{
	height:13px;padding:0px;margin:0px;
}



/*on fait une class par couleur, cela d?terminera l'image de fond*/


body#orange div#bassmenu{background:none;}
body#orange div#hautssmenu{background:none;}

body#bleu div#hautssmenu{background:url(Images/ssmenu/haut_bleu.gif) no-repeat;}
body#bleu div#bassmenu{background:url(Images/ssmenu/bas_bleu.gif) no-repeat;}

body#vert div#hautssmenu{background:url(Images/ssmenu/haut_vert.gif) no-repeat;}
body#vert div#bassmenu{background:url(Images/ssmenu/bas_vert.gif) no-repeat;}
body#violet div#hautssmenu{background:url(Images/ssmenu/haut_violet.gif) no-repeat;}
body#violet div#bassmenu{background:url(Images/ssmenu/bas_violet.gif) no-repeat;}
body#rose div#hautssmenu{background:url(Images/ssmenu/haut_rose.gif) no-repeat;}
body#rose div#bassmenu{background:url(Images/ssmenu/bas_rose.gif) no-repeat;}
body#marron div#hautssmenu{background:url(Images/ssmenu/haut_marron.gif) no-repeat;}
body#marron div#bassmenu{background:url(Images/ssmenu/bas_marron.gif) no-repeat;}
body#bleu_sombre div#hautssmenu{background:url(Images/ssmenu/haut_bleu_sombre.gif) no-repeat;}
body#bleu_sombre div#bassmenu{background:url(Images/ssmenu/bas_bleu_sombre.gif) no-repeat;}



div#list_ssmenu{
	height:auto; position:relative;
}
	div#list_ssmenu a{color:#FFFFFF;}

body#orange div#list_ssmenu{background:none;}
body#bleu div#list_ssmenu{background-color:#10C6F3;}
body#vert div#list_ssmenu{background-color:#86C400;}
body#violet div#list_ssmenu{background-color:#C84CEC;}
body#rose div#list_ssmenu{background-color:#F3007A;}
body#marron div#list_ssmenu{background-color:#CC6633;}
body#bleu_sombre div#list_ssmenu{background-color:#3765ce;}

div#list_ssmenu ul{ margin:0px 20px; padding:0px;list-style:none;}
	div#list_ssmenu ul#produits{width:300px;}
	div#list_ssmenu ul#accessoires{width:250px;position:absolute; top:0;right:0px;}
	div#list_ssmenu ul li{ width:250px;}
div#list_ssmenu li.titre_liste{ font-size:16px; font-weight:bold; margin:0px 0px 5px 0px; color:#FFFFFF}
div#list_ssmenu ul#produits li a{ text-decoration:none;color:#FFFFFF;}
div#list_ssmenu ul#produits li a:hover{ text-decoration:underline; color:#FFFFFF;}
div#list_ssmenu ul#accessoires li a{  color:#FFFFFF;}
div#list_ssmenu ul#accessoires li a:hover{ text-decoration:underline;}

#sous_menu p{ font-weight:bold; font-size:14px;}

/*les cases conteneurs des renseignements sur les produits : le prix ou si l'article est un coups de coeur, une promo ou une nouveaut?*/
.case_info{
	position:absolute;
	float:right;
	display:block;
	width:66px;
	color:#FF0042;
	right:10px;
}

/*si c'est une promo, nouveau ou coups de coeur*/
.type{bottom:25%;height:38px;}/*le positionnement*/

.img_prod{ left:10px; top:15px; position:relative;}
.promo{
background:url(Images/promo_tr.gif) no-repeat;
}

.nouveau{
background:url(Images/nouveau_tr.gif) no-repeat;
}

.coeur{
background:url(Images/coeur_tr.gif) no-repeat;
}

.vide{
	background-color:#FFFFFF;
}

.special{
	background:url(Images/special.gif) no-repeat;
}

/*pour les prix*/
.prix{/*positionement et mise en forme de la police*/
top:160px; position:absolute;
	font-weight:bolder; 
	font-size:12px; 
	font-weight:bolder;
	height:14px;
	width: auto;
	text-align:center
}
.jaune{background-color:#FFFF00;}/*si le prix est jaune*/

.texte_presentation{left:15px; top:10px;position:relative; width:90%}/*le texte de pr?sentation en haut de la case*/
.lien_ajouter, .lien_voir{top:178px; position:absolute; left:15px; width:90%}/*le bouton pour ajouter au caddie*/
.lien_ajouter span, .lien_voir span{position:relative;}
a.ajouter{display:block; width:72px; height:16px;}

.texte_presentation a:hover, .lien_ajouter a:hover{text-decoration:underline;}

body#bleu  .lien_ajouter a{color:#10C6F3;}
body#vert .lien_ajouter a{color:#86C400;}
body#violet .lien_ajouter a{color:#C84CEC;}
body#rose .lien_ajouter a{color:#F3007A;}
body#marron .lien_ajouter a{color:#CC6633;}
body#bleu_sombre .lien_ajouter a{color:#3765ce;}


body#bleu  a.ajouter{background:url(Images/ajouter_bleu.gif) no-repeat}
body#vert a.ajouter{background:url(Images/ajouter_vert.gif) no-repeat}
body#violet a.ajouter{background:url(Images/ajouter_violet.gif) no-repeat}
body#rose a.ajouter{background:url(Images/ajouter_rose.gif) no-repeat}
body#marron a.ajouter{background:url(Images/ajouter_marron.gif) no-repeat}
body#bleu_sombre a.ajouter{background:url(Images/ajouter_bleu_sombre.gif) no-repeat}

body#orange .cont_ajout {float:right;}
body#orange .cont_ajout a{ display:block; width:72px; height:16px;}
body#orange .marron .cont_ajout a{background:url(Images/ajouter_marron.gif) no-repeat;}
body#orange .bleu .cont_ajout a{background:url(Images/ajouter_bleu.gif) no-repeat;}
body#orange .vert .cont_ajout a{background:url(Images/ajouter_vert.gif) no-repeat;}
body#orange .rose .cont_ajout a{background:url(Images/ajouter_rose.gif) no-repeat;}
body#orange .violet .cont_ajout a{background:url(Images/ajouter_violet.gif) no-repeat;}
body#orange .bleu_sombre .cont_ajout a{background:url(Images/ajouter_bleu_sombre.gif) no-repeat;}

a span{display:none;}	
/*les classes des diff?rents type d'images promotionnelles
il y a une case unique, double ou triple horizontale et verticale
donne les dimensions
*/

.case_base{
  position:absolute; 
  display:block;
  float:left;
  background:url(Images/case.gif) no-repeat;
  left:0px;
  top:200px;
  margin-top:10px;
}
.case_simple{
  width:200px;
  height:200px;
}

.case_double_horizon{
  width:409px;
  height:200px;
}

.case_triple_horizon{
  width:618px;
  height:200px;
}

.case_double_verticale{
  width:200px;
  height:409px;
}

.case_triple_verticale{
  width:200px;
  height:618px;
}


/*pour le positionnement on a 6 positions possibles*/
/****************************************************************************/
/*1er m?thode sans conteneur on calcul la position des lignes et des colonnes
plus simple si on se limite ? 3 lignes
*/
.colonne1{left:0px;}
.colonne2{left:200px;}
.colonne3{left:400px;}


/*il faut prendre en compte le sous menu donc ajouter 209px de base
.ligne1{top:0px;}
.ligne2{top:0px;}
.ligne3{top:0px;} *//*
.colonne1{left:9px; position:float; }
.colonne2{left:218px;}
.colonne3{left:427px;}
*/
/*il faut prendre en compte le sous menu donc ajouter 209px de base*/
.ligne0{top:0px;}
.ligne1{top:209px;}
.ligne2{top:418px;} 
/*****************************************************************************/


.popup{
	position:absolute; 
	z-index:3; 
	top:5px;
	left:5px; 
	height:235px; 
	width:430px; 
	display:block;
	text-align:left;
	/*background-color:#FFFFFF;*/
}
.popup p{background:#fff; margin:0px; padding:0px; font-weight:bold; }
.popup img{margin:0px; padding:0px;}
a.boutons_actions{display:block; height:48px; width:206px;margin:0; padding:0;}
a#continue{ background:url(Images/popups/continuer_out.gif) no-repeat;  float:left; margin-left:5px}
a#continue:hover{ background:url(Images/popups/continuer_on.gif) no-repeat;}
.popup a span{display:none;}
a#terminer{background:url(Images/popups/terminer_out.gif) no-repeat; float:right; margin-right:3px}
a#terminer:hover{background:url(Images/popups/terminer_on.gif) no-repeat;}

.corps_popup p#titre{float:left; width:370px; height:30px; display:inline; font-size:17px; text-indent:15px; padding-top:2px; }
.corps_popup #annuler{float:right; width:60px; height:30px; display:block; background:url(Images/popups/cross.gif) #fff no-repeat 95% 30%; font-size:10px; text-decoration:underline; color:#CCC; cursor:pointer; padding-top:5px;}
.corps_popup img#produit_ajoute{float:left;display:inline;}
.corps_popup ul{float:right; margin:0px; padding:0px; width:300px; height:130px; background-color:#FFFFFF ;}
.corps_popup ul li{margin:55px 0px 0px 15px; font-size:12px; font-weight:bold;}

div.corps_popup{background:#FFFFFF; width:100%; display:block; position:relative; float:left;}
div.bouton_popup_ajouter{background:#FFFFFF; width:100%; display:block; height:48px; float:left; position:relative; padding-top:15px;}

.popup #img_hte{margin-bottom:-5px;}
.popup #img_basse{position:relative;}

.popup form{margin:0px; padding:0px;}
.popup form p{text-indent:15px; width:243px;}

.popup .elements_formulaire{margin-bottom:10px; margin-left:15px;border:none; background-repeat:no-repeat;background-position:left bottom;}
.popup input.texte{ background:url(Images/popups/text-fields.gif) left top no-repeat ; height:24px; width:234px; float:left; text-indent:5px; }
.popup textarea{ background:url(Images/popups/textarea.gif)  left top no-repeat; height:101px; overflow:hidden; padding-left:5px; width:364px;}
.popup input#envoyer  {float:right; margin-right:40px}

.popup p.description{font-weight:normal; font-size:10px; width:400px; margin-left:15px }

/************** pages fixes *****************************/
body#gris{background-image:url(Images/bkgd_gris.gif);color:#333333;}
body#gris h1{font-size:18px; font-weight:bold}
body#gris h2{font-size:13px;}
body#gris #zone_corps p{font-size:12px;}
body#gris #recherche_conteneur{background-image:url(Images/rechercher_gris.gif);}
body#gris #zone_corps{margin-bottom:15px; height:100%; padding-bottom:10px;}
body#gris #zone_corps a{color:#FF6600; text-decoration:underline;}
body#gris tr{height:30px;}
body#gris th{color:#FF6600; font-weight:bold;}
body#gris td{border:none;border-bottom:1px solid #C7C7C7; font-size:10px;}
body#gris td.impt{ font-weight:bold; color:#FF6600;}
body#gris #zone_corps ul {list-style:disc;}

body#gris li{font-size:12px;}
body#gris .aucentre{text-align:center;}
body#gris a#parrainer{display:block; margin:23px auto; width:159px;height:46px;background:url(Images/parrainer_gris.gif) no-repeat;}

/*******************************/
span .Nom{ text-transform:uppercase}
p.titre_liv_actuel{position:relative;}
p.titre_liv_actuel a{color:#FF6600; font-size:9px;position:absolute;top:5px; right:10px; text-decoration:underline; font-weight:normal;}

#affichages_commandes{color:#666; font-size:12px;}

#liste_filleul{background:white;border:1px solid #EDEDED;border-top:1px solid #A1A1A1; display:block; height:350px; width:625px; margin-bottom:5px;}
#liste_filleul #partie_affichage_filleul{float:left; position:relative;left:10px;width:245px;}
#liste_filleul #bons_achats{left:10px !important;left:0px;float:left; position:relative;width:350px !important;width:330px;top:5px !important; top:15px;}
#liste_filleul #bons_achats p b{font-size:11px; color:#333;}
#liste_filleul #partie_affichage_filleul td.complementaire b {font-size:11px; color:#333;}

#filleul td{color:#CC3499; text-align:left;}
#vos_filleuls{margin:5px 0px;color:#666666; font-size:14px; font-weight:bold;}
/*
#nbpoints{display:block;background:url(Images/bonsachat.gif) no-repeat; height:40px; width:1100px;color:white;border:1px solid blue;}
#nbpoints span.totalbons{height:20px; width:94px; background:none; border:1px solid red;}
*/

/****Faq****/
body#gris #zone_corps div.tx-irfaq-pi1{color:#666;}
body#gris #zone_corps div.tx-irfaq-pi1 ul.tx-irfaq-questions-list {margin:0px; margin-bottom:10px; padding:0px;}
body#gris #zone_corps div.tx-irfaq-pi1 ul.tx-irfaq-questions-list li {margin-left:30px;}
body#gris #zone_corps div.tx-irfaq-pi1 ul.tx-irfaq-questions-list li a{color:#666666;font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; text-decoration:underline;}
body#gris #zone_corps div.tx-irfaq-pi1 ul.tx-irfaq-questions-list li a:hover{color:#FF6600;}

.tx-irfaq-answer h4{font-size:11px; color:#333;font-weight:bold;}
body#gris #zone_corps div.tx-irfaq-answer p strong{color:#FF6600; text-align:center;}

body#gris #zone_corps h3.titre_ss_cat_faq{color:#FF6600; font-size:16px; margin:5px 0px;}
body#gris #zone_corps a.sommaire_faq{display:block; width:77px; height:12px; color:white; text-decoration:none; background:url(Images/sommaire.gif) no-repeat;float:right;text-indent:10px;}
body#gris #zone_corps ul.tx-irfaq-questions-list li.ss_cat_faq{color:#FF6600; font-size:12px; font-weight:bold; list-style:none; margin:10px 0px;}
div.additional-info{width:100%;margin:10px 0px;border:1px solid #F6F6F6;}

body#gris #zone_corps table.contenttable{border:none}

/**** r?sultat de recherche ****/
ul.liste_resultat{ width:350px; padding-left:10px; margin-left:10px;list-style:none;}
ul.liste_resultat li {list-style-position:outside;list-style-image: url(Images/triangle_orange.gif);}
ul.liste_resultat li a{text-decoration:underline; color:#FF6600; font-size:12px;}


div.arecherche{color:#4D4D4D;font-size:12px;}
div.arecherche form{height:40px;width:450px; position:relative; margin-top:20px;}
div.arecherche div#form_recherche{width:450px; position:absolute; left:0; top:0; }

p.pasabouti{font-size:12px; color:#666;}
label.livraison_disabled{color:#CCC;}
label.retrait_disabled{color:#CCC;}

#avant_liste_produits{position:relative; height:630px }

div.csc-textpic-clear{margin:0;padding:0;padding-bottom:10px;height:10px;clear:none;padding-top:50px !important;padding-top:0;}