/* 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 DE LA PAGE CONTACT */

#contactTxt{
	width:45%;
	float:left;
}
#contactPlan{
	width:45%;
	float:right;
}
#formContact input,textarea{
	width:100%;
	border:1px solid #000;
	font-size:12px;
}
#formContact input:focus,textarea:focus{
	border-color:#FF0000;
}
#formContact .champRequis{
	color:#FF0000;
}

#contenuTexte p.aerer, .aerer{
	padding:40px 20px 10px 20px;
	font-size:13px;
	line-height:20px;
}

#contenuTexte .installation{
	background:url(../images/charte/install.gif);
	float:left;
	margin-right:30px;
	margin-bottom:30px;
	width:300px;
	height:229px;
}
#contenuTexte .reparation{
	background:url(../images/charte/reparation.gif);
	float:left;
	width:300px;
	height:229px;
}
#contenuTexte .entretien{
	background:url(../images/charte/entretien.gif);
	float:left;
	margin-right:30px;
	margin-bottom:30px;
	width:300px;
	height:229px;
}
#contenuTexte .sav{
	background:url(../images/charte/sav.gif);
	float:left;
	width:300px;
	height:229px;
}

#contenuTexte .installation ul, #contenuTexte .entretien ul{
list-style-type:square;
font-size:13px;
}

#contenuTexte .installation li, #contenuTexte .entretien li{
margin-left:50px;
margin-bottom:8px;
}


 #pagination {
	font: normal 14px Arial, Helvetica, sans-serif;
	clear:both;
	padding-top:10px;
	padding-bottom:10px;
	text-align:center;
	padding-right:30px;
	text-decoration:none;
}

#pagination a:link{
width:10px;
text-decoration:none;
}

#pagination a:hover{
text-decoration:none;
}
#pagination a:visited{
text-decoration:none;
}	


#gauche{
float:left;
margin:0pt;
width:50%;
}
#droite{
float:right;
padding-left:2%;
padding-right:2%;
width:45%;
}

#contenuTexte #gauche p, #droite p{
line-height:1.3em;
}

/********************************************************* FICHE PRODUIT ****************************************************/

#fiche-produit{
	width:730px;
	float:left;
	margin:0px 0 0 0px;
}

/* IMAGE FICHE */
#blocimage-fiche {
	width:312px;
	height:360px;
	float:left;
	margin:10px 10px 0 0;
	}

#contenuTexte a:link#img-fiche, #contenuTexte a:visited#img-fiche {
	background:#4b4b4b;
	width:295px;
	height:284px;
	float:left;
	margin:0 0 0 4px;
	border:2px solid #161616;
	text-align:center;
	}

#contenuTexte a:hover#img-fiche, #contenuTexte a:active#img-fiche {border:2px solid #161616;}	


#blocvignetteH-fiche {
	width:287px;
	height:66px;
	float:right;
	margin:6px 0 0 0;
	}	

#blocvignetteH-fiche a:link, #blocvignetteH-fiche a:visited {
	margin-right:6px;
	width:55px;
	height:62px;
	background:#1C1C1C;
	float:left;
	background-position:center center;
	background-repeat:no-repeat;
	border:2px solid #161616;
	}

#blocvignetteH-fiche a:hover, #blocvignetteH-fiche a:active {border:2px solid #161616;}


/* CONTENU FICHE */

#contenu-fiche {
	width:400px;
	float:left;
	margin:10px 0 0 0;
	}

span.petit {
	color:#666666;
	font:11px "Trebuchet MS" Arial, Helvetica, sans-serif;
	text-align:right;
	padding:0;
	margin:0 0 0 0;
	}
span.petit2 {
	color:#fff;
	font:12px "Trebuchet MS" Arial, Helvetica, sans-serif;
	text-align:right;
	padding:0;
	margin:0 0 0 0;
	}
	span.barre {
	text-decoration:line-through;
	}	
span.vert {
	color:#00AA00;
	font:11px "Trebuchet MS" Arial, Helvetica, sans-serif;
	text-align:right;
	padding:0;
	margin:0 0 0 0;
	}	

#blocprix-fiche {
	background:#4b4b4b;
	text-align:right;
	margin-bottom:10px ;
	padding:5px 15px;
	}
#blocprix-fiche .picto{
	border-bottom:1px solid #f7cc0c;
	text-transform:uppercase;
	}
#contenuTexte #blocprix-fiche p {
	font:bold 19px  "Trebuchet MS" Arial, Helvetica, sans-serif;
	color:#f7cc0c;
	text-align:right;
	margin:0;
	padding:0 0 5px 0;
	}

/* DESCRIPTION PRODUIT */
#description {
	background:#4b4b4b;
    margin:0px 0 10px 0px;
    height:auto;
    padding:15px 15px 15px 15px;
    }

#contenuTexte #description p {
	font:normal 11px "Trebuchet MS" Arial, Helvetica, sans-serif;
	color:#fff;
	text-align:left;
    padding:0;
	margin:0px;

	}

#contenuTexte a.dl:link, #contenuTexte a.dl:visited{
background:url(../images/charte/dl.gif) no-repeat;
display:block;
width:170px;
height:26px;
}

#contenuTexte a.dl:hover, #contenuTexte a.dl:active{
background:url(../images/charte/dl-over.gif) no-repeat;
display:block;
width:170px;
height:26px;

}



#blocachat-fiche {
	background:#4b4b4b;
	height:70px;
	margin-bottom:10px ;
	padding:15px 15px;
	}

#contenuTexte #taille-quantite {
	width:320px;
	padding-top:7px;
	height:30px;
	float:left;	
	}
#contenuTexte span.label-fiche {
	font:bold 13px  "Trebuchet MS" Arial, Helvetica, sans-serif;
	color:#fff;
	float:left;
	width:60px;
	margin:0 5px 10px 15px;
	}
select.liste-fiche{
	width:80px;
	border:1px solid #fff;
	background:#4b4b4b ;
	color:#CCC;
	padding:0 0 0 3px;
	float:left;
	float:left;
	font-size:11px;
}
#contenuTexte #ajout-panier {
	width:320px;
	height:28px;
	float:left;	
	}	
#contenuTexte a:link#panier-fiche, #contenuTexte a:visited#panier-fiche {
	width:320px;
	background:url(../images/charte/panier.gif)right top no-repeat;
	height:28px;
	float:left;	
	}

#contenuTexte a:hover#panier-fiche, #contenuTexte a:active#panier-fiche {
	background:url(../images/charte/panier-over.gif) right top no-repeat;}


#bloc-ami-contact {
	background:#4b4b4b;
	height:26px;
	margin:0pt 0pt 0pt 0px;
	padding:10px;
}


#contenuTexte a.amis:link, #contenuTexte a.amis:visited{
border:0px none;
float:left;
background:url(../images/charte/ami.gif) no-repeat;
display:block;
width:155px;
height:26px;
}
#contenuTexte a.amis:hover, #contenuTexte a.amis:active{
background:url(../images/charte/ami-over.gif) no-repeat;
border:0px none;
float:left;
display:block;
width:155px;
height:26px;

}


#contenuTexte a.contactez:link, #contenuTexte a.contactez:visited{
background:url(../images/charte/contact.gif) no-repeat;
border:0px none;
float:left;
display:block;
width:155px;
height:26px;

}
#contenuTexte a.contactez:hover, #contenuTexte a.contactez:active{
background:url(../images/charte/contact-over.gif) no-repeat;
border:0px none;
float:left;
display:block;
width:155px;
height:26px;

}
/* RUBRIQUE - ENVOYER A UN AMI */

#bloc-ami {
	font-size:12px;
	font-family: "Trebuchet MS" Arial, Helvetica, sans-serif;
	width:350px;
	float:left;
	background:#4a4a4a;
	margin:25px 0 0 10px;
	padding-left:10px;
	color:#D6C8C3;
}
#bloc-ami label{
	font-size:12px;
	font-family: "Trebuchet MS" Arial, Helvetica, sans-serif;
	color:#D6C8C3;
}
#bloc-ami #f_envoyerAmi input, #bloc-ami #f_envoyerAmi textarea, #bloc-ami #f_envoyerAmi .bouton-ami {
	color:#D6C8C3;
	font-size:12px;
	font-family: "Trebuchet MS" Arial, Helvetica, sans-serif;
	}

#bloc-ami #f_envoyerAmi input{
	width:200px;
	height:15px;
	padding-left:2px;
	background:#4b4b4b;
	border:1px solid #D6C8C3;
}

#bloc-ami #f_envoyerAmi textarea{
	width:200px;
	font-size:12px;
	font-family: "Trebuchet MS" Arial, Helvetica, sans-serif;
	height:80px;
	padding-left:2px;
	background:#4a4a4a;
	border:1px solid #D6C8C3;
}

#bloc-ami #f_envoyerAmi .bouton-ami{
	width:80px;
	height:20px;
	color:#D6C8C3;
	background:#4a4a4a;
	border:1px solid #D6C8C3;
	cursor:pointer;
	text-align:center;
	}

#bloc-ami #f_envoyerAmi .bouton-ami:hover{
	width:80px;
	height:20px;
	color:#D6C8C3;
	background:#2a2a2a;
	border:1px solid #D6C8C3;
	}






#contenuTexte .texte-gh {
float:left;
font-weight:bold;
margin:0pt 10px 0pt 0pt;
text-align:right;
width:280px;
}
#contenuTexte .texte-gh p {
line-height:17px;
}
#contenuTexte .texte-dt {
border-left:1px solid #999999;
float:left;
font-weight:bold;
padding-left:10px;
text-align:justify;
margin-bottom:30px;
width:400px;
}


#contenuTexte .texte-gh2 {
float:left;
font-weight:bold;
text-align:right;
padding-right:10px;
border-right:1px solid #999999;
width:400px;
}

#contenuTexte .texte-gh2 p {
line-height:17px;
}
#contenuTexte .texte-dt2 {
float:left;
text-align:justify;
margin-bottom:30px;
margin:0pt 0px 0pt 10pt;
width:280px;
}
#contenuTexte .texte-dt2 p {
text-align:center;
line-height:17px;
}
/***************** STYLE DE LA PAGE CONTACT *****************/

#contenuTexte .contact-gauche{
	float:left;
	width:240px;
	margin-top:10px;
}
#contenuTexte .contact-gauche p, #contenuTexte .contact p{
	font:11px/1.4em  "Trebuchet MS",Arial, Helvetica, sans-serif;
	color:#D6C8C3;
	margin-bottom:1.0em;
	margin-top:1.0em;
}
#contenuTexte .contact{
	width:400px;
	margin-top:10px;
}
#contenuTexte .contact #formcontact{
	padding:0px;
}

#contenuTexte #type input{
	width:20px;
}

#contenuTexte .contact #formcontact label{
	width:100px;
	float:left;
	text-align:right;
	margin-right:10px;
}
#contenuTexte .contact #formcontact input{
	background:#2a2a2a;
	border:1px solid #D6C8C3;
	width:200px;
	font-family: "Trebuchet MS",Arial, Helvetica, sans-serif;
	color: #D6C8C3;
	font-size:11px;
}
#contenuTexte .contact #formcontact select{
	background:#2a2a2a;
	border:1px solid #D6C8C3;
	width:200px;
	font-family: "Trebuchet MS",Arial, Helvetica, sans-serif;
	color: #D6C8C3;
	font-size:11px;
}
#contenuTexte .contact #formcontact .boutons .bouton{
	width:100px;
	background:#4a4a4a;
	font:small-caps bold 12px "Trebuchet MS",Arial, Helvetica, sans-serif;
	margin-right:10px;
	cursor:pointer;
}
#contenuTexte .contact #formcontact .boutons .bouton:hover{
	background:#2a2a2a;
}
#contenuTexte .contact #formcontact textarea{
	background:#2a2a2a;
	border:1px solid #D6C8C3;
	width:200px;
	font-family: "Trebuchet MS",Arial, Helvetica, sans-serif;
	color: #D6C8C3;
	font-size:11px;
}
#contenuTexte .contact #formcontact .champRequis{
color:#B30F28;
}
#contenuTexte .contact #formcontact p.capa {
	margin-left:110px;
	text-align:justify;
	width:220px;
}

#contenuTexte .contact #formcontact .boutons{
	margin-left:110px;
}