/* 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";

/* STYLE CYC  (ne pas supprimer) */
.cyc {
	position: absolute;
	top: -10000px;
}

/* STYLE TITRES */
#contenuTexte h1{
	margin:20px 0 0 10px;
	font-size:1.8em;
	color:#E91375;
	font-family:"Trebuchet MS";
	font-weight:bold;
	background:url(../images/charte/puce.png) top left no-repeat;
	_background:url();
	_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/charte/puce.png', sizingMethod='crop');
	padding:5px 0 0 45px;
	height:40px;
}

#contenuTexte h2{
	margin:5px 0;
	font-size:1.5em;
	color:#333;
	font-weight:bold;
	font-variant:small-caps;
}

#contenuTexte h3{
	margin:10px 0;
	font:bold 1.4em Arial, Helvetica, sans-serif;
	color:#FFA82E;
	letter-spacing:0.1em;
}




/* STYLE LIEN */
#contenuTexte a:link, #contenuTexte a:visited{
	color:#FF0066;
	text-decoration:none;
	font-size:12px;
}
#contenuTexte a:hover, #contenuTexte a:active{
	color:#660033;
	text-decoration:underline;
}


#contenuTexte a:link img, #contenuTexte a:visited img  {
filter: alpha(opacity=100);
-moz-opacity: 1.00; opacity:1.00;
border:none;
}

#contenuTexte a:hover img, #contenuTexte a:active img{
filter: alpha(opacity=70);
-moz-opacity: 0.70; opacity:0.70;
border:none;
}

/* STYLE TEXTE */
#contenuTexte p{
	padding-bottom:15px;
	font-size:1.1em;
	line-height:1.8em;
	text-align:justify;
	color:#333;
}

#contenuTexte .rosef, #contenuTexte p.rosef {color:#E91375;}
#contenuTexte .grisc, #contenuTexte p.grisc {color:#CCC}
#contenuTexte p.bold, #contenuTexte .bold {font-weight:bold;}
#contenuTexte p.bigc, #contenuTexte .bigc {font-weight:normal; text-align:center; font-size:14px;}
#contenuTexte p.big, #contenuTexte .big {font-weight:normal; text-align:left; font-size:14px;}


/* STYLE CONTENU */
#contenuTexte ul.liste {
	list-style:none;
	margin:0 0 10px 10px;
	color:#333;
	font:normal 1.1em Arial, Helvetica, sans-serif;	
	}
	
#contenuTexte ul.liste li {
	background:url(../images/charte/puce.gif) center left no-repeat;
	padding-left:10px;
	padding-bottom:5px;
	}

#contenuTexte .separe {
	width:520px; 
	height:2px; 
	border-top:1px dotted #e6e6e6; 
	margin:20px 0;
	clear: both;
	}
/* Upline */
#upline p {
	font-family:"Times New Roman", Times, serif; 
	font-size:9px; 
	text-align:center;
	font-weight:bold; 
	color:#40C2F3;
	font-style:italic;
	
}


/* ACCUEIL */
#catalogue-accueil {
	width:350px;
	margin:50px 0 0 20px;
	float:left;
	}
	
#vignette-accueil{
	float:left;
	width:150px;
	margin:0 25px 30px 0;
	text-align:center;
	padding-top:1px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	position:relative;	
}

#bloc-accueil {
	width:190px;
	float:left;
	margin:60px 0 0 0;
	height:370px;
	padding:0 10px 10px 0;

}

.bloc-accueil-separe {
	width:200px;
	float:left;
	height:10px;
	margin:0 0 10px 0;
	background:#333;
	}
#bloc-accueil p {
	font-family:"Times New Roman", Times, serif; 
	font-size:16px; 
	text-align:center;
	font-weight:bold; 
	color:#40C2F3;
	font-style:italic;
	}



/* FIL ARIANE */
#chemin-catalogue{
	margin:20px 0 0 20px;
	text-align:left;
	font:1.2em Arial, Helvetica, sans-serif;
	color:#666;	
	width:800px;
	font-weight:normal;
	font-variant:small-caps;
	}
	
#contenuTexte #chemin-catalogue a:link, #contenuTexte #chemin-catalogue a:visited{
	font:Arial, Helvetica, sans-serif;
	text-decoration:none;
	color:#E91375;
	font:1.1em Arial, Helvetica, sans-serif;
	font-variant:small-caps;
	}
	
#contenuTexte #chemin-catalogue a:hover {text-decoration:none; color:#40C2F3;}



/* PAGINATION */
.pagination {
	width:540px;
	margin:20px 0 20px 0;
	font-size:11px;
	color:#666;
	text-align:center;
	font-weight:bold;
	border-top:1px dotted #e6e6e6;
	}
.fleche-gauche {
	float:left;
	border:none;
	}
.fleche-droite {	
	float:right;
	border:none;
	}



/* LE CATALOGUE */
#catalogue {
	width:550px;
	margin:20px 0 0 20px;
	}
		
#vignette{
	float:left;
	width:150px;
	margin:0 45px 30px 0;
	text-align:center;
	padding-top:1px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	position:relative;	
}

#contenu a.img-listing {
	display:block;
	height:150px;
	width:150px;
	text-align:center;
	/*border:1px solid #e6e6e6;*/
}
#contenuTexte a:link.img-listing img, #contenuTexte a:visited.img-listing img {border:1px solid #e6e6e6;}

#contenu .contenu-listing {
	display:block;
	width:150px;
	padding:1px 0;
	text-align:center;
	/*background-color:#e6e6e6;*/
	border-top:1px solid #CCC;
	/*background-color:#FFF;*/
	/*border:1px solid #CCC;*/
	margin-top:5px;
}


span.designation-listing{
	display:block;
	padding:0 2px 0 2px;
	width:148px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:0;
	font-weight:bold;
	line-height:16px;
	text-align:left;
	color:#333;
}

span.marque-listing{
	display:block;
	padding:0 2px 0 2px;
	font-size:10px;
	width:136px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#666;
	font-variant:small-caps;
	text-align:left;
}

#contenuTexte a:link.prix-listing, #contenuTexte a:visited.prix-listing{
	padding:0;
	width:126px;
	font-size:12px;
	font-weight:bold;
	text-align:right;
	line-height:14px;
	/*background-color:#e6e6e6;*/
	font-weight:bold;
	color:#E91375;
	background:url(../images/charte/btn-panier.gif) top right no-repeat;
	padding:1px 25px 0 0;
	display:block;
}
#contenuTexte a:active.prix-listing, #contenuTexte a:hover.prix-listing {text-decoration:none;}

span.prix-barre-listing{
	color:#666;
	font-size:10px;
	font-weight:bold;
	margin-right:5px;
	text-decoration:line-through;
}

#filtre {
	height:20px;
	float:right;
	margin-right:20px;
	}
	
#filtre span.libelle-liste {
	float:left;
	color:#333;
	font-size:12px;
	margin-right:5px;
	padding-top:1px;
	}
	
select.liste-listing {
	width:150px;
	background-color:#FFF;
	color:#333;
	font-size:11px;
	text-align:left;
	border:1px solid #CCC;
	float:left;
	margin-right:15px;
}
#filtre input.filtre-input{
	border : 1px solid #e6e6e6;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	width : 95px;
	margin-bottom:5px;
	margin-right:5px;
	float:left;
	height:15px;
}

#filtre .bouton {
	width:20px;
	border:1px solid #CCC;
	background-color:#FFF;
	cursor:pointer;
	color:#333;
	text-align:center;
	font-size:10px;
}

/* LES PICTOS LISTING */
#picto-selection {background-color:#CCC;}
#picto-nouveaute {background-color:#CCC;}
#picto-promotion {background-color:#E91375;}

#picto-promotion, #picto-selection, #picto-nouveaute{
	top:145px;
	left:0px;
	width:152px;
	height:13px;
	z-index:100;
	position:absolute;
	text-align:center;
	color:#FFF;
	text-transform:uppercase;
	font-weight:bold;
	font-size:11px;
	line-height:12px;
	}



/* FIL ARIANE */
#chemin{
	margin:20px 0 25px 20px;
	text-align:left;
	font:1.2em Arial, Helvetica, sans-serif;
	color:#666;	
	width:570px;
	font-weight:normal;
	font-variant:small-caps;
	}
	
#contenuTexte #chemin a:link, #contenuTexte #chemin a:visited{
	font:Arial, Helvetica, sans-serif;
	text-decoration:none;
	color:#E91375;
	font:1.1em Arial, Helvetica, sans-serif;
	font-variant:small-caps;
	}
	
#contenuTexte #chemin a:hover {text-decoration:none; color:#40C2F3;}



/* FICHE PRODUIT */
#fiche-produit{
	width:530px;
	float:left;
	margin-left:40px;
}

#fiche-produit #img-prod{
	float:left;
	width:250px;
	height:250px;
	margin-right:20px;
	text-align:center;
	position:relative;
}

#fiche-produit #vignette-prod{
	float:left;
	width:50px;
	height:250px;
	margin-right:20px;
}

#fiche-produit #img-prod a:link, #fiche-produit #img-prod a:visited {color:#666; font-size:10px;}
#fiche-produit #img-prod a:hover, #fiche-produit #img-prod a:active {border:none; margin-bottom:0px; text-decoration:none;}


#fiche-produit .infos-prod-ref{
	float:left;
	width:180px;
	height:auto;
	padding:0  0 0 20px;
	border-left:1px solid #e6e6e6;
	font:1.2em Arial, Helvetica, sans-serif;
}

#contenuTexte #fiche-produit p.txt-designation{
	font-size:13px;
	line-height:16px;
	font-weight:bold;
	margin-top:5px;
	text-align:left;
	padding-bottom:5px;
	color:#333;
	background:url(../images/charte/fleche-produit.gif) top left no-repeat;
	padding-left:15px;
}

#fiche-produit .txt-marque{
	font-size:12px;
	line-height:10px;
	margin-bottom:10px;
	font-variant:small-caps;
	padding-bottom:0;
	color:#666;
}

#contenuTexte #fiche-produit p.txt-prixTTC{
	color:#E91375;
	font-weight:bold;
	font-size:18px;
	display:block;
	margin:0 0 0 0;
	padding:0 0 5px 0;
}


#fiche-produit .txt-prix-barre{
	color:#666;
	font-size:11px;
	text-decoration:line-through;
	font-style:normal;
	font-weight:normal;
	margin:0 0 0 3px;
}

.txt-nota{
	font-size:10px;
	font-style:italic;
}

#fiche-produit .txt-titre{font-weight:bold;}

#fiche-produit .lbl-input{
	width:80px;  
	float:left;
	font-weight:bold;
	margin-bottom:5px;
	font-size:11px;
	color:#333;
}

#fiche-produit .input{
	border : 1px solid #e6e6e6;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	width : 250px;
	margin-bottom:5px;
	float:left;
}

#contenu a:link.panier, #contenu a:visited.panier {
	background:url(../images/charte/btn-panier2.gif) top left no-repeat;
	width:157px;
	height:18px;
	margin:30px 0 0 0;
	line-height:16px;
	float:left;
}
#contenu a:hover.panier, #contenu a:active.panier {background:url(../images/charte/btn-panier2-hover.gif) top left no-repeat;}

#contenu a:link.amis, #contenu a:link.contact, #contenu a:visited.amis, #contenu a:visited.contact {
	width:105px;
	height:15px;
	margin:10px 5px 0 0;
	padding:2px 0 0 25px;
	text-decoration:none;
	font-size:11px;
	color:#333;
	line-height:15px;
	border-top:1px dotted #CCC;
	float:left;	
	font-weight:normal;
}

#contenu a:link.amis, #contenu a:visited.amis {background:url(../images/charte/btn-amis.gif) top left no-repeat;}
#contenu a:link.contact, #contenu a:visited.contact {background:url(../images/charte/btn-contact.gif) top left no-repeat; padding-left:25px;}
#contenu a:hover.panier, #contenu a:hover.amis, #contenu a:hover.liste, #contenu a:hover.contact {color:#CCC; text-decoration:none;}

#fiche-produit .descriptif-prod{
	line-height:16px;
	margin:40px 0 5px 10px;
	color:#333;
	font-size:11px;
	width:460px;
	border-top:1px dotted #e6e6e6;
	padding-left:5px;
}



/* RUBRIQUE - ENVOYER A UN AMI */
#bloc-ami {
	width:350px;
	float:left;
	margin:10px 0 0 10px;
	padding-left:10px;
	border-left:1px solid #e6e6e6;
	font-size:11px;
	color:#666666;
}

#bloc-ami #f_envoyerAmi input, #bloc-ami #f_envoyerAmi textarea, #bloc-ami #f_envoyerAmi .bouton-ami {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#FFF;
	}

#bloc-ami #f_envoyerAmi input{
	width:200px;
	height:15px;
	padding-left:2px;
	background:#E91375;;
}

#bloc-ami #f_envoyerAmi textarea{
	width:200px;
	height:80px;
	padding-left:2px;
	background:#E91375;;
}

#bloc-ami #f_envoyerAmi .bouton-ami{
	width:80px;
	height:20px;
	color:#FFF;
	background-color:#E91375;
	cursor:pointer;
	text-align:center;
	}

h1{
	margin:20px 0 0 10px;
	font-size:22px;
	color:#E91375;
	font-family:"Trebuchet MS";
	font-weight:bold;
	background:url(../images/charte/puce.png) top left no-repeat;
	padding:5px 0 0 45px;
	height:40px;
}


/** RUBRIQUE CONTACT **/
#bloc-adresse-contact {
	width:150px;
	float:left;
	margin:0 20px 20px 50px;
	padding: 0 5px;
}

#bloc-adresse-contact p {font:normal 11px Arial, Helvetica, sans-serif; color:#333;}

#bloc-adresse-contact p.nota {
	font:italic 10px Arial, Helvetica, sans-serif;
	color:#333;
	text-align:justify;
	display:block;
	margin:20px 0 0 0 ;
	}

.cnil {
	font:italic 9px Arial, Helvetica, sans-serif;
	color:#666;
	text-align:right;
	margin:0 5px 0 0 ;
	width:300px;
	float:right;
	}

.nota {
	font:italic 9px Arial, Helvetica, sans-serif;
	color:#666;
	text-align:center;
	}

#contenu .couleur4 {color:#666; font-size:16px;}
#contenu .couleur7 {color:#C11324; font-size:16px;}


/** **/

#bloc-contact {
	width: 320px;
	float:left;
	margin:0 0 20px 0;
}

#bloc-contact, #formContact input, #formContact textarea, #formContact select.liste, #formContact .bouton {
	font:normal 11px Arial, Helvetica, sans-serif;
	color:#333;
}

#formContact input, #formContact textarea, #formContact select.liste{
	width:200px;
	border:1px solid #CCC;
	background:none;
}

#bloc-contact label {
	text-align:right;
	display:block;
	padding-right:10px;
	color:#333;
}

#bloc-contact span.libelle {
	text-align:right;
	display:block;
	font-weight:bold;
	color:#333;
}

#formContact .radio, #formContact .check{
	width:10%;
	border:none;
	margin-bottom:3px;
}

#formContact .bouton{
	width:80px;
	border:1px solid #CCC;
	background-color:#FFF;
	cursor:pointer;
	color:#333;
}

#bloc-merci {
	font:normal 11px Arial, Helvetica, sans-serif;
	width:500px;
	margin:30px 50px 20px 0;
	color:#333;
}

.champRequis{color:#333; font-size:9px;}



/* RUBRIQUE CGV */
#bloc-cgv {
	width:470px;
	border-left:1px solid #e6e6e6;
	padding-left:5px;
	margin:20px 0 20px 50px;
	float:left;
	}