/* Feuille de style pour le contenu des pages 
 * C'est cette feuille de style qui doit être liée aux pages du site
 * La feuille de style de la charte est appelée depuis cette feuille.
 */
 
/* Import des style pour la charte */
@import "charte.css";
@import "typographie.css";

/* styles globaux
******************/
*{
  margin: 0;
  padding: 0;
  }
a img{
  border: none;
  }
a:active,
a:focus{
  outline: none;
  }
.clearer{
  clear: both;
  }

/* listing prod
******************/

#contenuTexte h1 a{
  color: #FFF;
  }
#contenuTexte h1 a:hover{
  text-decoration: none;
  }
#contenuTexte h1 span{
  float: right;
  text-transform: none;
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #f701fc;
  letter-spacing:0;
  }
#contenuTexte h1 span a{
  color: #ed00ee;
  }
#contenuTexte h1 span a:hover{
  text-decoration: underline;
  }
#contenuTexte #defilgauche{
  float: left;
  margin: 0 7px 0 0;
  cursor: pointer;
  z-index: 9;
  }
#contenuTexte #defildroite{
  float: right;
  margin: 0 0 0 7px;
  cursor: pointer;
  z-index: 10;
  }
#contenuTexte #flowcut{
  height: 286px;
  width: 585px;
  overflow: hidden;
  white-space:nowrap;
  padding: 6px 0;
  position:relative;
  }
#contenuTexte #flow{
  	height: 285px;
  }
  
#contenuTexte .vign{
  margin: 0 10px;
  width: 160px;
  float: left;
  padding: 2px 0 0;
  }
  
.picto-vignette { position:relative;}
#pic-promo {
	background:url(../images/charte/picto-promo.png) top left repeat;
	_background:url();
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/charte/picto-promo.png', sizingMethod='image');
	width:52px;
	height:22px;
	position:absolute;
	top:3px;
	right:5px;
	}
	
#pic-new {
	background:url(../images/charte/picto-new.png) top left repeat;
	_background:url();
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/charte/picto-new.png', sizingMethod='image');
	width:37px;
	height:20px;
	position:absolute;
	top:5px;
	left:10px;
	}
		
/* ci-dessous, un hack pour safari */
/*\*/
html*#contenuTexte .vign{
margin: 0 8px;
float: none;
display: inline-block;
}/**/
#contenuTexte .vign a{
  width: 154px;
  padding: 2px;
  text-decoration: none;
  text-align: center;
  border: 1px solid #ed00ee;
  display:block;
  }
#contenuTexte .vign a p{
  font: bold 11px Arial, Helvetica, sans-serif;
  text-align: center;
  color: #FFF;
  background: #ed00ee;
  text-transform: uppercase;
  }
#contenuTexte .vign a:hover{
  background: #920093;
  }
#contenuTexte .vign a:hover p{
  background: #920093;
  color: #FFF;
  }
 
.prixbarre {
font-size:10px;
text-decoration:line-through;
}

/* fiche prod
******************/
#contenuTexte #imgprod{
  width: 375px;
  height: 280px;
  float: left;
  margin: 0 0 10px 0;
  }
#contenuTexte #imgprod img{
  float: left;
  margin: 0 10px 10px 0;
  border: 1px solid #FFF;
  }
#contenuTexte #ficheprod{
  width: 40%;
  float: left;
  }
#contenuTexte #ficheprod p{
  margin: 0 0 10px;
  padding: 0 0 10px;
  font: 10px Arial, Helvetica, sans-serif;
  border-bottom: 1px solid #717171;
  }
#contenuTexte #ficheprod .bold{
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #FFF;
  display: block;
  }
#contenuTexte #ficheprod .prixbarre{
  font: bold 11px Arial, Helvetica, sans-serif;
  margin: 0 5px;
  text-decoration: line-through;
  color:#ed00ee;
  }
#contenuTexte #ficheprod .prix{
  font: bold 14px Arial, Helvetica, sans-serif;
  color:#ed00ee;
  }
#contenuTexte #ficheprod .gris{
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #999;
  }
#contenuTexte #ficheprod a{
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #e306f3;
  }
#contenuTexte #ficheprod img{
  vertical-align: text-top;
  }
#contenuTexte #ficheprod input{
  border: 1px solid #717171;
  font: 10px Arial, Helvetica, sans-serif;
  width: 50px;
  padding: 1px 0 1px 3px;
  }
#contenuTexte #ficheprod select{
  margin: 0 10px 0 0;
  border: 1px solid #717171;
  font: 10px Arial, Helvetica, sans-serif;
  }
#plusimgprod{
  padding: 20px;
  }
#plusimgprod img{
  float: left;
  margin: 0 10px 10px 0;
  border: 1px solid #FFF;
  }
  
#plusimgprod img#big{
  float: right;
  margin: 0 10px 10px 0;
  border: 1px solid #FFF;
  }

#bloc-big {
	width:500px; 
	height:500px; 
	float:left;
	border-right:1px solid #FFF;
	padding-right:5px;
	margin-right:5px;
	 }
#big img {float:right;}

/* PLAN DU SITE
******************/

#contenu ul.plan {
	width:330px;
	float:left;
	}

#contenu ul.plan li.liste1 {
	width:300px;
	float:left;
	list-style-type:none;
	background:url(../images/plan_site/puce1.gif) no-repeat;
	font-weight:bold;
	font-size:14px;
	padding-left:25px;
	margin:2px 0 2px 0;
	}

#contenu ul.plan2 {
	width:240px;
	float:left;
	margin:0 0 0 30px;
	}
	
#contenu ul.plan ul.plan2 li {
	width:220px;
	float:left;
	list-style-type:none;
	font-weight:bold;
	font-size:13px;
	margin:0;
	padding-left:20px;
	background:url(../images/plan_site/puce2.gif) no-repeat;
	}

#contenu ul.plan ul.plan2 li a {
	color:#FFFFFF;
	}

/* tailles
******************/
#popup{
  background: #929292 url(../images/charte/bg_popup.jpg) no-repeat;
  }
#size{
  width: 450px;
  margin: 75px 25px 25px 29px;
  background: url(../images/charte/fiche_prod_bck_bottom.png) bottom left no-repeat;
  }
#size tr.rose th{
  font: bold 13px Arial, Helvetica, sans-serif;
  color: #e306f3;
  }
#size th{
  font: bold 11px Arial, Helvetica, sans-serif;
  text-align: center;
  color: #FFF;
  height: 25px;
  border-bottom: 1px solid #717171;
  }
#size td{
  font: 11px Arial, Helvetica, sans-serif;
  text-align: center;
  color: #FFF;
  border-bottom: 1px solid #717171;
  }

/* faq, cgv
******************/
#contenuTexte #puretext{
  padding: 5px 25px;
  }
#contenuTexte #puretext p{
  margin: 2px 0;
  }
#contenuTexte #puretext h2{
  margin: 5px 0;
  color: #e306f3;
  display: list-item;
  list-style-type: disc;
  }
#contenuTexte h3{
  margin: 5px 0 5px 10px;
  font: bold 11px Arial, Helvetica, sans-serif;
  }

/* blog
********************/
#contenuTexte.full{
  width: 820px;
  margin: 10px 0 0 85px;
  float: none;
  }
#contenuTexte.full #puretext{
  padding: 5px 0;
  }

/* marques
********************/
#contenuTexte .center{
  text-align: center;
  }
#contenuTexte .center img{
  vertical-align: middle;
  }
#contenuTexte .fichemarques{
  width: 260px;
  float: left;
  margin: 0 0 30px;
  }
#contenuTexte .imgmarques{
  width: 375px;
  height: 290px;
  float: left;
  margin: 0 0 30px 10px;
  }
#contenuTexte .imgmarques img{
  float: right;
  margin: 0 0 10px 10px;
  border: 1px solid #FFF;
  }

#contenuTexte .fichemarques p{
  margin: 0 0 10px;
  padding: 0 0 10px;
  font: 10px Arial, Helvetica, sans-serif;
  border-bottom: 1px solid #717171;
  }
#contenuTexte .fichemarques .bold{
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #FFF;
  display: block;
  }
#contenuTexte .fichemarques .gris{
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #999;
  }
#contenuTexte .fichemarques a{
  font: bold 11px Arial, Helvetica, sans-serif;
  color: #e306f3;
  }

/* galerie
******************/
#contenuTexte #purepics{
  padding: 5px 25px;
  text-align: center;
  }
#contenuTexte #purepics img{
  margin: 5px 10px;
  vertical-align: middle;
  }

/* contact
*******************/
.floatrightcontact{
  float: right;
  }
#formContact{
  width: 612px;
  padding: 0;
  margin: 0 auto;
  }
#formContact .row{
  text-align: right;
  position: relative;
  }
#formContact .col{
  float: left;
  width: 306px;
  }
#formContact .row label{
  position: absolute;
  top: 7px;
  text-align: right;
  font: 10px Arial, Helvetica, sans-serif;
  color: #FFF;
  width: 142px;
  }
#formContact .row input{
  width: 141px;
  height: 15px;
  border: none;
  background: url(../images/contact/form_input.png) no-repeat;
  padding: 7px 7px 7px 148px;
  font-size: 9px;
  }
#formContact .row input:focus{
  background-position: 0 -29px;
  }
#formContact #rowadresse label,
#formContact #rowcommentaire label{
  margin: 0 5px 0 0;
  width: 287px;
  }
#formContact .row textarea{
  width: 282px;
  border: none;
  padding: 22px 7px 7px;
  font-size: 11px;
  font-family: Arial, Helvetica, sans-serif;
  }
/* ci-dessous, un hack pour safari */
/*\*/
html*#formContact .row label{
top: 4px;
}
html*#formContact .row textarea{
margin: 15px 0 0;
}/**/
#formContact .row textarea#adresse{
  height: 30px;
  background: url(../images/contact/form_textarea1.png) no-repeat;
  }
#formContact .row textarea#commentaire{
  height: 74px;
  background: url(../images/contact/form_textarea2.png) no-repeat;
  }
#formContact .row textarea#adresse:focus{
  background-position: 0 -59px;
  }
#formContact .row textarea#commentaire:focus{
  background-position: 0 -103px;
  }
#formContact #rowsubmit{
  clear: both;
  }
#formContact #rowsubmit input{
  width: 148px;
  height: 40px;
  background: none;
  padding: 0;
  margin: 0 0 0 -3px;
  }
#formContact #rowsubmit input:active, #formContact #rowsubmit input:focus{
  outline: none;
  }
.champRequis{
  color: #FF0000;
  }
#contenu #contactinfo p{
  float: left;
  width: 265px;
  margin: 0 0 0 40px;
  }
/* -------------------------------- DEVELOPPER ----------------------------- */
#list-nouveautes{
float:left;
width:670px;
overflow:hidden;}