/* polices et autres largeurs et hauteur, padding et margin, ect. sont définis en em */
/* --- Définition des balises HTML générales --- */
body {
padding: 0em;
margin: 0em;
background: #FFFFFF url(images/base/bg.jpg) top repeat-x;
font-family: "Verdana", Geneva, Arial, Helvetica, sans-serif;
text-align: left;
background-color: #ffffff;
font-size: 13px;
color: #333333;
}
img {
border: 0em;
}
hr {
height: 1px;
color: #f8d9e9;
background-color: #f8d9e9;
border: 0;
}
/* --- Définition des styles de textes et liens --- */
h1, h2, h3, h4, h5, h6 {
font-family: Verdana, Arial, "Times New Roman", Times, serif;
font-weight: normal;
text-align : left;
}
h1 {
font-size: 1.4em;
font-family: Arial, "Times New Roman", Times, serif;
font-weight: bold;
font-style: italic;
margin: 0;
padding: 0;
text-align: center;
color: #895418;
}
.h1Bleu {
color: #77abd4;
}
h2{
font-size: 1.8em;
margin: 0em;
padding: 0em 0em 0.2em 0em;
color: #aedb28;
background: #ffffff url(images/base/hrLiensDroite.gif) no-repeat bottom;
}
h3 {
font-size: 1.2em;
margin: 0;
padding: 0;
color: #77abd4;
font-family: Georgia, "Times New Roman", Arial, Verdana, Times, serif;
font-weight: bold;
font-variant: small-caps;
}
.chaleur{
height: 1.9em;
padding: 0em 1em 0em 1em;
background: #ffffff url(images/illustrations/chaleur.jpg) no-repeat 0px 0;
}
.fraicheur{
height: 1.9em;
padding: 0em 1em 0em 1em;
background: #ffffff url(images/illustrations/fraicheur.jpg) no-repeat 0px 0;
}
h4 {
font-size: 0.9em;
margin: 0;
padding: 0;
font-weight: bold;
color: #77abd4;
padding: 0em 0em 0.2em 0em;
border-bottom: #f2f2f2 solid 1px;
}
p {
font-size: 0.9em;
margin: 3px 0;
padding: 0;
color: #666666;
}
a {
color: #f8ac1b;
text-decoration: none;
outline: none; /*suppression des pointillés autour des liens sous Firefox ;-) */
}
a:hover {
text-decoration: none;
color: #941d15;
}
/* --- Définition des identifiants et classes de la page principale --- */
#general {
position: relative;
top:1.152em;/*15px*/
width: 78em;
text-align: left;
margin: 0em auto 0em auto;
padding: 0;
display: table;
background-color: #FFFFFF;
/*border: solid #d0c79c 1px;*/
}
/* --- En tete --- */
#header{
width: 78em;
height: 12.2em;
background: #ffffff url(images/base/header.jpg) no-repeat;
padding: 0em;
margin: 0em;
}
#header h1 a{ 
display: block; 
width: 200em;  
height: 110em; 
font-size: 1px; 
text-indent: -9000px; 
position: relative; 
top:0px; 
left: 25px; 

}
/* --- Le panier ---*/
#monPanier {
width: 100%;
margin: 0em;
}
.blocPanier{
float: left;
}
.contourImagePanier {
height: 2em;
border: 1px solid #8cc8e4;
padding: 0.307em;/*4px*/
float: left;
}
.colonne100 { 
color: #959595;
background-color: #f8d9e9;
height: 20px;
border-bottom: solid #adadad 1px;
text-align: left;
padding: 10px 0 10px 10px;
font-size: 14px;
font-weight: bold;
float: left;
width:100px;
display: block;
}
.colonne240 { 
color: #959595;
background-color: #f8d9e9;
height: 20px;
border-bottom: solid #adadad 1px;
text-align: left;
padding: 10px 0 10px 10px;
font-size: 14px;
font-weight: bold;
float: left; 
width:210px; 
}
.sousColonne100 { 
color: #959595;
background-color: #ffffff;
border-bottom: solid #adadad 1px;
height: 60px;
text-align: left;
padding: 15px 0 0 10px;
font-size: 13px;
float: left;
width:100px;
display: block;
}
.sousColonne240 { 
color: #959595;
background-color: #ffffff;
border-bottom: solid #adadad 1px;
height: 60px;
text-align: left;
padding: 15px 0 0 10px;
font-size: 13px;
float: left; 
width:210px; 
}
/* --- chemin --- */ 
#chemin {
width: 100%;
height: 1.92em;/*25px*/
background: #ffffff url(images/base/hrLiensDroite.gif) no-repeat bottom;
margin: 0.3em 0em 1em 0em;
}
#chemin p{
margin: 0em;
padding: 0.38em 0 0 0.38em;/*5px 0 0 5px*/
}
#container {
width: 100%;
float: left;
background: #ffffff url(images/base/fond.gif) repeat-y;
}
#contenuGauche {
float: left;
width: 16em;/*230px*/
padding: 0em 0.768em 0em 0.768em;/*0 10px 0 10px*/
}
#contenuDroit {
float: left;
width: 56em;/*720px*/
padding: 0em 0.768em 0em 1.768em;/*0 10px 0 10px*/
}
#contenu {
float: left;
width: 38em;
padding: 0em 1.15em 1.15em 1.15em;/*15px 15px 15px 15px*/
}
.texteGauche {
float: left;
}
.texteDroit {
float: left;
width: 480px;
}
.flash{
float: left;
}
.sousContenu{
float: left;
}
.sousContenuListe{
padding: 0 0 0 30px;
margin: 0 0 0 30px;
}
#colonne03 {
float: left;
width: 13.5em;/*720px*/
border-left: solid #d0c79c 1px;
margin: 1.6em 0em 0em 0.5em;/*0 10px 0 10px*/
padding: 0.7em 0.768em 0.7em 0.768em;/*0 10px 0 10px*/
}
#colonne03 h2{
font-size: 1.4em;
font-variant: small-caps;
font-family: Georgia, "Times New Roman", Arial, Verdana, Times, serif;
color: #ff4400;
font-weight: bold;
background: none;
}
.contenuFormulaire {
width: 42em;
margin: 0 auto 0 auto;
padding: 1.15em 1.15em 1.15em 1.15em;/*15px 15px 15px 15px*/
}
.colonne250 { 
color: #959595;
height: 2em;

text-align: left;
padding: 0.1em 0 0.1em 0.6em;
font-size: 1.0em;
float: left; 
width: 20em; 
}
.colonne260 { 
color: #959595;
height: 2em;
text-align: left;
padding: 0.1em 0 0.1em 0.2em;
font-size: 1.0em;
float: left; 
width: 17em; 
}
.zoneDeSaisie{
padding: 0em;
margin: 0em;
}
/* --- Footer --- */
.footer {
float: left;
width: 100%;
height: 5em;
margin: 0em;
padding: 0em;
background: #ffffff url(images/base/footer.gif) no-repeat;
}
.cadreFooter {
float: left;
text-align: center;
font-size: 0.8em;
position: relative;
top: 2.2em;
color: #aedb28;
margin: 0em;
padding: 0em 0em 0em 1.5em;
font-family: Verdana, Arial, "Times New Roman", Times, serif;
}
a.lienFooter:link {
color: #999999;
text-decoration: none;
}
a.lienFooter:visited {
color: #999999;
text-decoration: none;
}
a.lienFooter:hover {
color: #f8f8f8;
}
/* --- Menu Principal --- */
#menuPrincipal {
float: left;
padding: 0em;
margin: 0em;
}
dl, dt, dd {
margin: 0;
padding: 0;
list-style-type: none;
}
#menuPrincipal ul {
list-style-type: none;
/*padding: 0.2em 0 0.384em 4.152em;*/
}
#menu {
position: relative;
padding: 0em;
margin: 0em;
}
#menu dl,dt a {
width: 13.0em;
font-size: 1.2em;
font-variant: small-caps;
font-family: Georgia, "Times New Roman", Arial, Verdana, Times, serif;
color: #5f534d;
text-align: left;
font-weight: bold;
text-decoration: none;
display: block;
background: url(images/base/borderLiens.jpg) no-repeat top;
/*border-top: solid #8cc8e4 1px;*/
padding: 0.3em 0 0.3em 0.3em;
}
dl#menu dt a:hover, dl#menu dt .selected {
color: #941d15;
}
dl#menu li a {
font-family: Verdana, Arial, Times, serif;
width: 12em;
height: 1em;
font-size: 1.0em;
color: #6e6e6e;
text-decoration: none;
display: block;
margin: 0em;
padding: 0em 0 0.8em 0em;
}
dl#menu li a:hover{ 
color: #333333;
}
dl#menu li .selected {
color: #941d15;
}
/* --- Produit petit --- */
.lignePetitsProduits {
width: 36em;
float: left;
padding: 0;
position: relative;
left: 35px;
}
.petitProduit {
float: left;
width: 9em;
height: 23em;
margin: 1.536em 2.0em 0em 0em;
padding: 0em;
border-right: solid #EBE8D8 1px;
border-bottom: solid #EBE8D8 1px;
}
.imagePetitProduit{
height: 14em;
}
.contourImage {
border: 1px solid #aedb28;
padding: 0.307em;
float: left;
}
.contourImageFixesDroite {
border: 1px solid #8cc8e4;
padding: 0.307em;
margin: 0em 3em 0em 1em;
float: right;
}
.contourImageFixesGauche {
border: 1px solid #8cc8e4;
padding: 0.307em;
margin: 0em 1.5em 0em 1em;
float: left;
}
.blocInfosPetitProduit{
height: 6em;
padding: 0em 0em 0em 0.4em;
}
.titreProduit {
text-align: left;
margin: 0.384em 0em 0em 0em;
width: 100%;
font-variant: small-caps;
}
.chapoProduit {
color: #77abd4;
text-align: left;
font-size: 1.0em;
width: 100%;
}
.descriptionProduit {
color: #666666;
text-align: left;
margin-top: 0.384em;
margin-bottom: 0.768em;
}
.prixProduit {
color: #060606;
text-align: left;
font-weight: bold;
margin: 0em 0em 2.0em 0em;
}
.lienPetitProduit{
font-size: 0.8em;

height: 2.0em;
padding: 0.4em;
}
.ficheProduit {

float:left;
width: 36.096em;
margin-left: 0.768em;
}
a.lienCommander:link {
color: #666666;
text-align: center;
text-decoration: none;
background-color: #f9f6e4;
padding: 0.4em 1em 0.4em 1em;
border-left: #b1cb80 solid 2px;
border-right: #b1cb80 solid 2px;
}
a.lienCommander:visited {
color: #666666;
text-decoration: none;
background-color: #f9f6e4;
padding: 0.4em 1em 0.4em 1em;
border-left: #b1cb80 solid 2px;
border-right: #b1cb80 solid 2px;
}
a.lienCommander:hover {
color: #060606;
background-color: #faf5c7;
padding: 0.4em 1em 0.4em 1em;
border-left: #fcc595 solid 2px;
border-right: #fcc595 solid 2px;
}
/* --- Grand Produits ---*/ 
.blocGrandProduit{
width: 36em;
display: table;
margin: 0em auto 0em auto;
background-color: #f8f8f8;
margin: 2.0em 0em 0em 0em;
padding: 1.0em 1.0em 1.0em 1.0em;
}
.contourImageProduit {
border: 1px solid #8cc8e4;
padding: 0.307em;/*4px*/
float: left;
}
.blocInfosGrandProduit{
float: left;
height: 5.0em;
padding: 0em 0em 0em 0.4em;
}
.titreGrandProduit {
text-align: left;
font-size: 2em;
font-weight: bold;
margin: 0em 0em 0em 0em;
width: 100%;
font-variant: small-caps;
}
.chapoGrandProduit {
color: #77abd4;
text-align: left;
font-size: 1.0em;
width: 100%;
}
.formDeclinaisonGrandProduit {
color: #666666;
text-align: left;
margin-top: 1.5em;
margin-bottom: 0.768em;
}
.descriptionGrandProduit {
color: #666666;
text-align: left;
margin-top: 0.384em;
margin-bottom: 0.768em;
}
.descriptionGrandProduit p{
margin-top: 2em;
}
.prixGrandProduit {
color: #060606;
font-size: 2em;
text-align: left;
font-family:tt
font-weight: bold;
margin: 0em 0em 2.0em 0em;
}
.lienGrandProduit{
font-size: 0.8em;
height: 2.0em;
padding: 0.4em;
}
.ficheGrandProduit {
float:left;
width: 16em;
background-color: #f2f2f2;
margin: 0em 0em 0em 1.0em;
padding: 1.0em 1.0em 1.0em 1.0em;
}
a.lienCommanderGrand:link {
color: #666666;
text-decoration: none;
background-color: #f9f6e4;
padding: 0.4em 1em 0.4em 1em;
border-left: #b1cb80 solid 2px;
border-right: #b1cb80 solid 2px;
}
a.lienCommanderGrand:visited {
color: #666666;
text-decoration: none;
background-color: #f9f6e4;
padding: 0.4em 1em 0.4em 1em;
border-left: #b1cb80 solid 2px;
border-right: #b1cb80 solid 2px;
}
a.lienCommanderGrand:hover {
color: #060606;
background-color: #faf5c7;
padding: 0.4em 1em 0.4em 1em;
border-left: #fcc595 solid 2px;
border-right: #fcc595 solid 2px;
}
/* --- Nombre de pages --- */
#pages {
float: left;
width: 700px;
text-align: left;
font-size: 1.0em;
margin: 0;
padding: 30px 0 10px 0;
font-family: Georgia, "Times New Roman", Times, serif;
}
a.lienPages:link {
color: #77abd4;
text-decoration: none;
font-weight: bold;
}
a.lienPages:visited {
color: #77abd4;
text-decoration: none;
font-weight: bold;
}
a.lienPages:hover {
color: #f5c9de;
text-decoration: underline;
font-weight: bold;
}
/* --- Boutons valide, Continuer...etc. --- */ 
a.lienBouton:link {
color: #666666;
float: right;
text-decoration: none;
background-color: #f9f6e4;
padding: 0.4em 1em 0.4em 1em;
border-left: #b1cb80 solid 2px;
border-right: #b1cb80 solid 2px;
}
a.lienBouton:visited {
color: #666666;
float: right;
text-decoration: none;
background-color: #f9f6e4;
padding: 0.4em 1em 0.4em 1em;
border-left: #b1cb80 solid 2px;
border-right: #b1cb80 solid 2px;
}
a.lienBouton:hover {
color: #060606;
float: right;
background-color: #faf5c7;
padding: 0.4em 1em 0.4em 1em;
border-left: #fcc595 solid 2px;
border-right: #fcc595 solid 2px;
}
/* --- Fontaine --- */
#fontaine{
float: left;
display: block;
width: 200px;
position: relative;
top:30px;
}
.imgFontaine{
position: relative;
left: 75px;
}
#fontaine h3{
text-align: center;
color: #ff8700;
}
#fontaine p{
text-align: left;
padding: 0 0 7px 20px;
color: #000000;
background: url(images/illustrations/puceFontaine.jpg) no-repeat 0px 0px;
}
.imgRub01 {
display: block;
width: 188px;
height: 326px;
float: left;
}
.imgRub01 a{
display: block;
background: url(images/illustrations/rubrique.jpg) no-repeat 0px -326px;
width: 188px;
height: 326px;
text-indent: -9000px;
}
.imgRub01 a:hover{
background: url(images/illustrations/rubrique.jpg) no-repeat 0px 0px;
}
.imgRub02 {
display: block;
width: 116px;
height: 326px;
float: left;
}
.imgRub02 a{
display: block;
background: url(images/illustrations/rubrique.jpg) no-repeat -188px -326px;
width: 116px;
height: 326px;
text-indent: -9000px;
}
.imgRub02 a:hover{
background: url(images/illustrations/rubrique.jpg) no-repeat -188px 0px;
}
.imgRub03 {
display: block;
width: 187px;
height: 326px;
float: left;
}
.imgRub03 a{
display: block;
background: url(images/illustrations/rubrique.jpg) no-repeat -305px -326px;
width: 187px;
height: 326px;
text-indent: -9000px;
}
.imgRub03 a:hover{
background: url(images/illustrations/rubrique.jpg) no-repeat -305px 0px;
}
.produitsGauche{
float: left;
height: 275px;
}