/***** Base *****/
* {
  font-family: Arial, Verdana, sans-serif;
  font-size: 11px;
}
body {
  text-align: center;
  background-color: #ffffff;
}
body, a, a:visited, a:active, a:hover, input.text, input.textlong, select, textarea {
  color: #6d6d6d;
}
a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
body, hr, form, p {
  margin: 0;
  padding: 0;
}
img {
  border: 0;
}
hr {
  display: none;
}
h1, h2 {
  font-size: 12px;
  font-weight: normal;
  font-style: normal;
}
table, td, th {
  border-collapse: collapse;
}


/***** Champs de saisie des formulaires *****/
input.text, input.textlong {
  height: 15px;
  border: 1px solid #6d6d6d;
  padding: 0 2px;
}
select {
  border: 1px solid #6d6d6d;
}

/***** Structure *****/
/* Propriétés communes */
div#container, div#container2 {
  position: relative;
  margin: auto;
  width: 900px;



}
div#header, a#logo, div#bandeau, div#form_recherche, div#navleft img, div#navtop {
  position: absolute;
}
div#header, div#contenu {
  background-color: white;
}
div#gauche, div#centreXL {
  float: left;
}

/* Container */
div#container {
  margin-top: 10px;
    width: 900px;
  padding: 180px 20px 0 20px; /* 180px = height header / 20px = dégradé bleu */
background: url(../images/container_fd_test.gif) no-repeat;
background-position: 0px 55px;
  text-align: left;

}
/* Header */
div#header {
  top: 0;
  left: 20px; /* 20px = dégradé bleu */
  width: 900x;
  height: 180px;

}
a#logo {
  top: 10px;
  left: 35px; /* 35px = 20 (pad left container) + 15 (marg left gauche) */
  width: 155px; /* largeur logo */
  height: 114px; /* hauteur logo */
  display: block;
  background: url(../images/logo_pileje.gif);
}
div#bandeau {
  top: 10px; /* 10px = mar top container */
  left: 205px; /* 205px = 20 (pad left container) + 15 (marg left gauche) + 13 (marg right gauche) + 157 (width gauche) */

}
div#form_recherche {
  top: 135px;
  left: 35px; /* 35px = 20 (pad left container) + 15 (marg left gauche) */
  padding-top: 15px;
  background: url(../images/search_fd.gif) no-repeat;
}
div#form_recherche input.text {
  width: 120px;
  border: 1px solid #63cdf6;
}
div#navtop {
  top: 140px; /* 140px = top de form_recherche - 5px (différence hauteur entre form_recherche et navtop */
  left: 205px; /* 205px = left de bandeau */
  width: 700px;
  position: absolute;
  z-index: 3;
}
ul#nav, ul#nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1.0;
}
ul#nav a {
  display: block;
  text-decoration: none;
  color: white
}
ul#nav li#li0, ul#nav li#li1, ul#nav li#li1 li, ul#nav li#li2, ul#nav li#li2 li, ul#nav li#li3, ul#nav li#li3 li {
  width: 175px;
}
ul#nav li {
  float: left;
  padding: 0;
}
/* Gauche */
div#gauche {
/*  padding: 0 13px 0 15px; */
 padding: 0 28px 0 0px;
  width: 157px;
  text-align: left;
    float: left;
}
/* Images menu */
div#images_menu {
text-align: center;
}

div#ecart{
  height: 5px;
  width: 140px;
   background-color: #ffffff;
     float: left;
}

div#navleft {
   float: left;
   text-align: left;
margin-top: 0px;
/*  margin-left: 170 px; */
/* padding: 5px; */
  background-color: #ffffff;
}
div#navleft div.cata_head {
/* text-transform: uppercase; */
text-align: left;
  color: white;
}
div#navleft div.cata_head, div#navleft div.cata_cont * {
  font-weight: bold;
}
div#navleft{
  margin: 5px 0 0px 0; 
/* padding: 3px 5px 5px 18px; */
  text-align: left;
  background-color: #ffffff;
     float: left;
     width: 157px;
}
div.cata_cont {
/* margin: 3px 0 5px 0; */
padding: 0px 0px 0px 0px;
  width: 157px;
/*  height: 30px; */
 text-align: left;
 background-color: #edf6fb;
   float: left;

}
div.ce {
   float: left;
   text-align: justify;
}

div#navleft img {
/*  padding-top: 5px; */
}
/* Centre */
div#centreXL {
  height: 430px;
  width: 700px;
}
html>body div#centreXL {
  min-height: 430px;
  height: auto;
}
/* Footer */
div#container2 {
  width: 900px;
   padding: 0px 20px 0 20px; /* 180px = height header / 20px = dégradé bleu */
background: url(../images/container_fd_test.gif) no-repeat;
background-position: 0px 8px;

/* background: url(../images/fd/container_fd_test.gif) center left no-repeat; 
 background: url(../images/container_fd_test.gif) no-repeat;
background-position: 0px 55px;
  padding: 0 60px;*/

}
div#footer {
  background: url(../images/fd/footer_fd_test.gif) top left repeat-x; 
  text-align: center;
}


div#footer ul, div#footer ul li.logo {
  margin: 0;
  padding: 0;

     
}
div#footer ul li {
  display: inline;
  list-style-type: none;


}
div#footer ul li.logo {
   background: url(../images/footer_fd_test.gif) top left repeat-x; 
   text-align: center;
   
}
div#footer ul li.logo a, div#footer ul li.logo img {
  margin: 0 1px!important;
  margin: 0 1px;
  vertical-align: -4px !important;


}
div#footer, div#footer * {
  color: white;
text-align: center;
   background: url(../images/footer_fd_test.gif) top left repeat-x; 
   
}

/***** Boxs home *****/
div#box1, div#box2 {
  height: 388px;
  float: left;
}

/***** Titres *****/
h1 {
  margin: 0 0 15px 0;
}
h1 span {
  color: #e9504d;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0 98px 0 0;
  background: url(../images/h1_fd.gif) no-repeat bottom right;
}
h1 span#rubrique, h1 span#produit, h1 span#nouveau, h1 span#soustitre {
  background: none;
  padding: 0;
}
h1 span#nouveau, h1 span#soustitre {
  font-weight: normal;
}
h1 span#nouveau {
  color: #00aeef;
}
h1 span#soustitre {
  text-transform: none;
}

/***** Blocs divers *****/
div.clear {
  clear: both;
  height: 1px;
  font-size: 1px;
}
div#chemindefer {
  padding: 10px 0 14px 0;
  color: #00aeef;
}
span.alerte {
  color: red;
}
div.edito, div.mention {
  text-align: justify;
}
div.edito {
  padding: 0 10px;
}
div.mention {
  margin: 15px 5px 5px 5px;
}
div.message {
  margin: 20px 0 30px 5px;
}
div.imgmessage {
  text-align: center;
}
div.infosup {
  color: #e9504d;
  text-align: right;
  margin: -27px 30px 15px 0;
}
div.navpages {
  margin: 0 10px;
  margin-top: 15px;
  padding: 4px 0;
  text-align: right;
}
div.navpages, div.navpages a, div.navpages a:hover, div.navpages a:visited {
  text-decoration: none;
  font-weight: bold;
  color: #00aeef;
}
div#textindex {
  color: #DB007A;
}
/***** Module FAQ : liste d'articles *****/
div.listearticles, div.recherche, div.rechercheerreur {
  margin: 0 10px;
  padding: 4px 0;
}
div.listearticles {
  border-bottom: 1px dashed #f2a396;
}
div#listearticlesfirst {
  border-top: 1px dashed #f2a396;
}
div.listearticles table {
  width: 100%;
}
div.listearticles td.titre {
  height: 20px;
}
div.listearticles td.titre, div.listearticles td.titre a, div.listearticles td.titre a:hover {
  color: #00aeef;
  font-weight: bold;
}
div.listearticles td.titre, div.listearticles td.descriptif {
  padding-right: 15px;
}
div.listearticles td.descriptif {
  padding-left: 10px;
}
div.listearticles td.descriptif, div.listearticles td.vignette {
  vertical-align: top;
}
div.listearticles td.vignette {
  text-align: right;
  border-left: 1px dashed #f2a396;
}
div.listearticles td.vignette, div.listearticles td.vignette img {
  height: 55px;
  width: 70px;
}
html>body div.listearticles td.vignette img {
  max-width: 70px;
  max-height: 55px;
  height: auto;
  width: auto;
}
div.recherche {
  margin-bottom: 15px;
}
div.recherche td {
  padding-right: 5px;
  font-weight: bold;
}
div.rechercheerreur {
  margin-top: 15px;
  color: red;
  font-weight: bold;
}

/***** Liste des produits d'une rubrique *****/
div.rubrique, div.produit, div#produitfirst {
  margin: 0 10px;
  padding: 4px 0;
}
div.rubrique {
  margin-bottom: 15px;
  text-align: justify;
}
div.produit {
  border-bottom: 1px dashed #e9504d;
}
div#produitfirst {
  border-top: 1px dashed #e9504d;
}
div.produit table {
  width: 100%;
}
div.produit table td.prix, div.produit table td.boutons, div.produit table td.plsref {
  width: 85px;
}
div.produit table td.vignette, div.produit table td.vignette img {
  width: 70px;
}
html>body div.produit table td.vignette img {
  max-width: 70px;
  width: auto;
}
div.produit table td.titre {
  height: 20px;
}
div.produit table td.titre, div.produit table td.descriptif {
  padding-right: 15px;
  padding-left: 10px;
}
div.produit table td.vignette {
  text-align: left;
}
div.produit table td.prix, div.produit table td.boutons, div.produit table td.plsref {
  text-align: center;
}
div.produit table td.vignette, div.produit table td.descriptif {
  vertical-align: top;
}
div.produit table td.titre *, div.produit table td.prix, div.produit td.savoirplus * {
  font-weight: bold;
}
div.produit table td.titre span.nouveau {
  font-weight: normal;
}
div.produit table td.titre, div.produit table td.plsref, div#navpagesproduit, div#navpagesproduit a, div#navpagesproduit a:hover, div#navpagesproduit a:visited {
  color: #e9504d;
}
div.produit td.savoirplus {
  text-align: right;
  font-style: italic;
  padding-right: 10px;
}

/***** Détail d'un produit *****/
div.produitdetail {
  margin: 0 10px;
}
div.produitdetail table {
  width: 100%;
}
div.produitdetail td {
  padding: 5px;
  vertical-align: top;
}
div.produitdetail td.argumentaire {
  width: 330px;
}
div.produitdetail td.prix, div.produitdetail td.prix2 {
  font-size: 13px;
}
div.produitdetail td.prix {
  width: 100px;
}
div.produitdetail td.prix2 {
  width: 150px;
}
div.produitdetail td.titreconseils, div.produitdetail td.titreingredients, div.produitdetail td.titrevaleurnrj {
  width: 33%;
}
div.produitdetail td.disponibilite {
  width: 45px;
}
html>body div.produitdetail td.image img {
  max-width: 180px;
  width: auto;
}
div.produitdetail td.argumentaire div, div.produitdetail td.conseils div, div.produitdetail td.ingredients div, div.produitdetail td.valeurnrj div, div.produitdetail td.contenu div {
  overflow: auto;
  text-align: justify;
  padding-right: 2px;
}
div.produitdetail td.argumentaire div {
  height: 200px;
}
div.produitdetail td.conseils div, div.produitdetail td.ingredients div, div.produitdetail td.valeurnrj div, div.produitdetail td.contenu div {
  height: 90px;
}
div.produitdetail td.accroche, div.produitdetail td.reference, div.produitdetail td.prix, div.produitdetail td.titreconseils, div.produitdetail td.titreingredients, div.produitdetail td.titrevaleurnrj, div.produitdetail td.ingredients span, div.produitdetail td.titrecontenu, div.produitdetail td.prix2 {
  font-weight: bold;
}
div.produitdetail td.image, div.produitdetail td.prix, div.produitdetail td.titreconseils, div.produitdetail td.titreingredients, div.produitdetail td.titrevaleurnrj, div.produitdetail td.panier, div.produitdetail td.prix2 {
  text-align: center;
}
div.produitdetail td.reference {
  text-align: right;
  padding-right: 20px;
}
div.produitdetail td.panier, div.produitdetail td.disponibilite {
  padding: 0;
}
div.produitdetail td.accroche, div.produitdetail td.argumentaire, div.produitdetail td.reference, div.produitdetail td.conditionnement, div.produitdetail td.panier {
  padding-bottom: 10px;
}
div.produitdetail td.image {
  padding-top: 20px;
  width: 180px;
}
div.produitdetail td.titreconseils, div.produitdetail td.titreingredients, div.produitdetail td.titrevaleurnrj, div.produitdetail td.titrecontenu {
  color: white;
}
div.produitdetail td.titreconseils, div.produitdetail td.titreingredients, div.produitdetail td.titrevaleurnrj {
  padding: 2px;
}
div.produitdetail td.accroche, div.produitdetail td.prix, div.produitdetail td.ingredients span *, div.produitdetail td.prix2 {
  color: #e9504d;
}
div.produitdetail td.titreconseils, div.produitdetail td.titreingredients, div.produitdetail td.titrevaleurnrj, div.produitdetail td.titrecontenu {
  background-color: #e9504d;
}
div.produitdetail table.produit1 {
  border-top: 1px solid #e9504d;
}
div.produitdetail table.produit3 {
  border-bottom: 1px solid #e9504d;
}
div.produitdetail table.produit1, div.produitdetail table.produit2, div.produitdetail table.produit3 {
  border-right: 1px solid #e9504d;
  border-left: 1px solid #e9504d;
}
div.produitdetail td.ingredients {
  border-right: 1px dashed #e9504d;
  border-left: 1px dashed #e9504d;
}


/***** Tableaux formulaires *****/
/* table */
table.contact {
  margin-bottom: 15px;
  text-align: left;
  width: 80%;
}
table.contact table.contact1 {
  width: 100%;
}
/* td */
table.contact td {
  padding: 3px 2px;
}
/* td.entete */
table.contact td.entete, table.contact td.entete * {
  font-weight: bold;
  color: #00aeef;
}
/* td.bouton */
table.contact td.bouton {
  text-align: center;
  padding-top: 20px;
}
/* td.vatop */
table.contact td.vatop {
  vertical-align: top;
}
/* textarea */
table.contact textarea {
  width: 388px;
  height: 100px;
  overflow: auto;
  border: 1px solid #6d6d6d;
}
/* input.text */
table.contact input.text {
  width: 150px;
}