/* CSS Document */

#ecranUser {
  min-width: 320px;
}
#ecranUser header.principal {
  min-width: 320px;
  width: 100%;
  height: 220px;
}
#content div.centre {
  width: auto;
}

article ul {
  padding: 0px;
}

.article p, #content article.cm p {
text-align: justify;
margin: 0px !important;
}

/* ASIDE */

#content section.content,
#content aside {
  width: auto;
  float: none;
  clear: both;
  margin-left: 0px;
}
div.blocSaviezVous,
div.blocAssocie {
  width: auto;
  border-radius: 30px 0px 30px 0px;
  margin: 15px;
}
div.blocAssocie {
  padding: 15px;
}
div.blocSaviezVous span.doubleFeuille {
  display: block;
  width: 33px;
  height: 30px;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 20px;
  left: -6px;
}
/******/
#filAriane { display: none; }

/* Header */
#logoNutergia {
  left: 20px;
  display: block;
  width: 170px;
  height: 50px;
  background-image: url(/lae/public1.0/img/site/logo-nutergia.jpg);
  background-repeat: no-repeat;
  background-size: contain;
}
#btnFacebook {
  right:85px;
  top:65px;
  left:auto;
}
#btnChangeLangue {
  display: block;
  position: absolute;
  left: auto;
  top: 18px;
  right: 15px;
  background-color: white;
  
  margin: 0px;
  padding: 0px 2px;
  padding-bottom: 7px;
  width: 22px;
  height: 15px;
  background-repeat: no-repeat;
  background-position: 50% 100%;
  cursor: pointer;
  z-index: 2100;
}
#btnChangeLangue:hover { height: 105px; }
#btnChangeLangue li { margin-bottom: 7px; }
#separation {
  width: 320px;
  z-index: 2500;
}
#separation span {
display: block;
width: 95px;
height: 195px;
background-image: url(/lae/public1.0/img/site/separation-mobile.png);
background-color: transparent;
background-repeat: no-repeat;
position: absolute;
top: -100px;
right: 78px;
}
#topBar {
  height: 100px;
}
#topBar div.centree {
  width: auto;
}
#espacePro {
display: block;
height: 18px;
padding-left: 30px;
width: 0px;
overflow: hidden;
position: absolute;
left: auto;
top: 15px;
right: 42px;
}

#gMoteurRecherche {
display: block;
width: 55px;
height: 35px;
position: absolute;
left: auto;
top: 50px;
right: 15px;
background-image: none;
overflow: hidden;
z-index: 2000;
border: 1px solid #d5d5d5;
border-radius: 3px;
}
#gMoteurRecherche input[type="search"], #gMoteurRecherche input[type="text"] { display: none; }

#gMoteurRecherche input[type="submit"] {
border: none;
padding: 0px;
float: none;
height: 100%;
width: 100%;
background-image: url(/lae/public1.0/img/site/picto-grosse-loupe.png);
}

#ecranUser header.principal nav {
  height: 120px;
  min-width: 320px;
  background-color: #dee2d5;
  background-image: url(/lae/public1.0/img/site/fond-nav-mobile.jpg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#ecranUser header.principal nav div.centree {
  display: block;
  width: 320px;
}
#ecranUser header.principal nav div.left {
width: 50%;
}
#ecranUser header.principal nav div.right {
width: 50%;
margin-left: 0px;
}
#menuGauche, #menuDroit { display: none; }

#ecranUser header.principal nav div.left h2 {
  margin-right: 25px;
  z-index: 3000 !important;
}
#ecranUser header.principal nav div.right h2 {
  position: relative;
  z-index: 3000;
}

#ecranUser header.principal nav div.right h2 a {
  display: block;
  margin-top: 23px;
  margin-left: 40px;
  padding-left: 0px;
  padding-bottom: 0px;
  background-image: none;
  width: 115px;
  z-index: 3000;
}
#ecranUser header.principal nav div.right h2 a strong {
position: relative;
left: 0px;
}

#menuGauche li div.masque span.ombre, #menuDroit span.ombre { display: none; }

#ecranUser header.principal nav div.right h2 a span {
display: none;
}

#ecranUser header.principal nav h2, #ecranUser header.principal nav h2 a {
  font-family: 'Open Sans', arial;
  font-size: 21px;
  line-height: 24px;
  font-weight: 300;
  color: white;
  margin: 0px;
  padding: 0px;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.5);
  text-decoration: none;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  z-index: 5000;
}
#ecranUser header.principal nav div.left h2 strong {
display: block;
margin-top: 20px;
margin-right: 0px;
font-weight: 600;
}

/************************
 * MENU
 ************************/
 nav div.masque {
display: block;
}
#ecranUser header.principal nav div.centree {
  width: 100%;
}
#ecranUser header.principal nav div.left,
#ecranUser header.principal nav div.right {
  position: initial;
}
#ecranUser header.principal nav div.rappel {
  background-image: url(/lae/public1.0/img/site/fleche-rappel-menu-480.png) !important;
  background-repeat: no-repeat;
}
#ecranUser header.principal nav div.left {
  background-position: 86% 95%;
}
#ecranUser header.principal nav div.right {
  background-position: 23% 95%;
}
#menuGauche, #menuDroit {
  display: block;
  width: 100%;
  position: absolute;
  bottom: auto;
  top: 120px;
  left: 0px;
  background-color: #60781b;
  padding-bottom: 0px;
  height: 0px;
  overflow: hidden;
  z-index: 3000;
}
#menuDroit {
  background-color: #1891b1 !important;
}
#menuGauche.visible, #menuDroit.visible {
  padding-bottom: 15px !important;
  background-image: none;
  height: auto;
}
#menuGauche li.menu-niveau2, #menuGauche li.menu-niveau2-actif,
#menuDroit li.menu-niveau1, #menuDroit li.menu-niveau1-actif {
  display: block;
  float: none;
  width: auto !important;
  height: 0px;
  margin: 0px;
  line-height: normal !important;
  padding: 0px;
  -webkit-transition: all 0.3s ease-out;  
     -moz-transition: all 0.3s ease-out; 
       -o-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;
}
#menuGauche.visible li.menu-niveau2, #menuGauche.visible li.menu-niveau2-actif,
#menuDroit.visible li.menu-niveau1, #menuDroit.visible li.menu-niveau1-actif {
  height: auto !important;
  padding: 0px;
}


#menuGauche a.lien-niveau2, #menuGauche a.lien-niveau2-actif,
#menuDroit a.lien-niveau1, #menuDroit a.lien-niveau1-actif {
  width: auto;
  padding-left: 35px;
  text-align: left;
}
#menuGauche a.lien-niveau2:before, #menuGauche a.lien-niveau2-actif:before,
#menuDroit a.lien-niveau1:before, #menuDroit a.lien-niveau1-actif:before {
  content: '> ';
}

#menuGauche li div.masque,
#menuDroit li div.masque {
  height: auto;
  padding: 0px !important;
}
#menuGauche li div.rectangle, #menuDroit div.rectangle {
  height: auto !important;
  max-width: 100%;
  padding: 0px !important;
  background-color: none;
}

#menuGauche li div.rectangle ul li.menu-niveau3, #menuGauche li div.rectangle ul li.menu-niveau3-actif, 
#menuDroit div.rectangle ul li.menu-niveau1, #menuDroit div.rectangle ul li.menu-niveau1-actif {
  display: block;
  float: none;
  height: 0px;
  width: auto;
  padding-left: 0px;
  padding-right: 0px;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
  overflow: hidden;
}
#menuDroit div.rectangle ul li.menu-niveau1, #menuDroit div.rectangle ul li.menu-niveau1-actif {  height: auto;
  width: auto;
}
#menuGauche.visible li div.rectangle ul.visible li.menu-niveau3, #menuGauche.visible li div.rectangle ul.visible li.menu-niveau3-actif, #menuDroit.visible div.rectangle ul.visible li.menu-niveau1, #menuDroit.visible div.rectangle ul.visible li.menu-niveau1-actif {
  height: auto;
}

#menuGauche li div.rectangle ul, 
#menuDroit div.rectangle ul {
  width: auto;
}
#menuGauche li div.rectangle ul li figure.visuel, 
#menuDroit div.rectangle ul li figure.visuel {
  display: none;
  visibility: hidden;
}
#menuGauche li div.rectangle ul li.menu-niveau3-actif a.lien-niveau3-actif, #menuGauche li div.rectangle ul li.menu-niveau3 a.lien-niveau3, 
#menuDroit a.lien-niveau1-actif, #menuDroit a.lien-niveau1 {

  width: auto;
  text-align: left;
  font-family: 'Open Sans', arial;
  font-size: 13px;
  line-height: 15px;
  color: white;
  text-decoration: none;
  padding-top: 8px;
  margin: 0px;
  padding-bottom: 8px;
  padding-left: 65px;
  text-shadow: none;
}
#menuDroit a.lien-niveau1-actif, #menuDroit a.lien-niveau1 {

  padding-left: 35px;
font-size: 14px;
line-height: 16px;
color: white;
}
#menuGauche li div.rectangle ul li.menu-niveau3 a.lien-niveau3 {
  color: #cce28d;
}

#menuGauche li div.rectangle ul li.menu-niveau3-actif a.lien-niveau3-actif, #menuGauche li div.rectangle ul li.menu-niveau3 a.lien-niveau3:hover {
  background-color: #86a82e;
  color: white;
}
#menuDroit li.sousMenu ul li a:hover {
  background-color: #12728C;
}

#menuGauche li div.rectangle ul li.sousMenu ul, #menuDroit li.sousMenu ul {
  margin: 0px;
  padding: 0px;
  width: auto !important;
  margin-top: 0px;
}

#menuGauche li div.rectangle ul li.sousMenu ul li a, #menuDroit li.sousMenu ul li a {
  display: block;
  padding: 3px 0px;
  padding-left: 90px;
  font-family: 'Open Sans', arial;
  font-size: 13px;
  line-height: 13px;
  color: white;
  background: none;
}
#menuDroit li.sousMenu ul li a {
  padding-left: 65px;
}

/***********************
 * fiche détail 
 **********************/

section.detailsProduit header {
  float: none;
  width: 100%;
}
section.detailsProduit article {
  display: block;
  float: none;
  width: auto;
  clear: both;
  margin: 15px; padding: 0px 15px;
}
section.detailsProduit header h2 {
  margin: 15px 15px;
}

section.detailsProduit div.zoom {
  float: left;
  width: 185px;
  height: 230px;
}

section.detailsProduit div.colGauche {
display: block;
float: right;
width: 100px;
min-height: 180px;
margin-right: 10px;
}
section.detailsProduit div.colGauche p.qteRef {
  width: 65px;
  min-height: 34px;
  padding-top: 45px;
  padding-left: 0px;
}
section.detailsProduit div.colGauche p.blocVertDemiArrondi {
  font-size: 10px;
  line-height: 13px;
  font-weight: 600;
  padding: 10px 20px;
}
section.detailsProduit div.colGauche p.blocVertDemiArrondi span {
  font-size: 26px;
  line-height: 26px;
  font-weight: 400;
}

/* FOOTER */
#scrollHautPage {
  right: 5px;
}
section.detailsProduit p.attention { 
  padding-top: 0px;
  padding-left: 35px;
  background-repeat: no-repeat;
  background-position: 0% 0%;
  text-align: left;
  margin-top: 50px;
}

#ecranUser footer.principal {
  height: auto;
background-image: url(/lae/public1.0/img/site/fond-footer-480.jpg);
  background-repeat: no-repeat;
  background-position: 50% 100%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#ecranUser footer.principal div.centree {
  min-width: 320px;
  width: 100%;
  padding-left: 0px; padding-top: 0px;
  background-position: 20px 110px;
}
#ecranUser footer.principal div.centree p#pharmacie {
  display: block;
  width: auto;
  position: relative;
  top: 0px;
  right: 0px;
  background: url(/lae/public1.0/img/site/croix-pharmacie-480.png) no-repeat 90% 50%,
  url(/lae/public1.0/img/site/ombre-pied-480.png) repeat-x 100% 100%,
  url(/lae/public1.0/img/site/shadow-footer.png) repeat-x;
  padding-left: 40px;
  padding-right: 130px;
  margin-top: 0px;
}
#ecranUser footer.principal div.centree p#afaq {
  top: 110px;
  left: 100px;
}
#ecranUser footer.principal div.centree p.bleu {
  color: #0095cc;
  font-weight: 700;
  margin-bottom: 7px;
  margin-top: 100px;
  margin-left: 20px; margin-right: 20px;
}
#ecranUser footer.principal div.centree p.adresse, 
#ecranUser footer.principal ul.liens,
#ecranUser footer.principal div.centree p#mangerBouger,
#ecranUser footer.principal div.centree p#suivreFacebook {
  margin: 15px 20px;
  left: 0px;
}
#ecranUser footer.principal div.centree p#suivreFacebook {
	position:relative;
	right:auto;
	top:auto;
}
#ecranUser footer.principal ul.liens li {
  float: none;
  padding: 0px; border: none;
  margin: 10px 0px;}
  
/***********
 * CONTENU
 ************/
#content article.cm {
  width: auto;
  padding: 15px;
  margin: 15px;
}
.article img, #content article.cm img {
 max-width: 100% !important;
 height: auto !important;
 width: auto !important;
}

.article table, #content article.cm table {
width: 120%;
margin: 15px 0px;
position: relative;
left: -10%;
}

/****** INTRO ****/
section#introduction {
  height: auto;
  width: 100%;
  background-color: transparent;
}
#introduction figure {
max-width: 50%;
height: auto;
overflow: hidden;
position: relative;
top: 0px;
right: 0px;
float: right;
display: none;
}
#introduction figure img {
min-height: 0px;
height: auto;
width: 100%;
float: right;
}
#introduction div.centree {
position: relative;
width: auto;
height: auto;
}
#introduction div.centree article {
height: auto;
width: auto;
background-image: none;
padding-top: 20px;
}
#introduction div.centree article p {
font-size: 13px;
line-height: 18px;
color: #4B4B4B;
margin: 0px 30px;
width: auto;
}
#introduction div.centree article h1 {
color: #c8e382;
margin: 10px 30px;
}

.article img.imageDroite, #content article.cm img.imageDroite,
.article img.imageGauche, #content article.cm img.imageGauche {
  float: none;
  margin: 10px auto;
  display: block;
}
#content article.saviezVous img.imageGauche {
float: left;
margin-right: 20px;
}
#content article.saviezVous img.imageDroite {
float: right;
margin-left: 20px;
}

#menuGauche li.menu-niveau2-actif {
background-color: transparent;
}

/******* Liste produits **********/

article.produitListe {
  display: block;
  width: auto;
  min-height: 0px;
  float: none;
  margin: 5px 20px;
}
article.produitListe figure {
  display: block;
  height: auto;
  width: auto;
  text-align: center;
  margin-top: 10px;
}


/* ALPHABET */
ul.alphabet {
  margin: 0px;
  padding: 5px;
  width: auto;
  height: auto;
}
ul.alphabet li {
  border-bottom: 1px solid white;
}
#listeAlphabet {
  width: auto;
  clear: both;
}
#listeAlphabet p.lettre {
  display: block;
  float: none;
  margin-left: 5px;
}
#listeAlphabet div.produits {
  margin: 0px;
  padding: 0px;
  margin-left: 5px;
  margin-top: -13px;
  float: none;
  width: auto;
  border-left: 1px dotted #b5b7ae;
}
section.detailsProduit article.introListe {
  padding: 5px 10px;
  width: auto;
}

#listeAlphabet div.produits article.produitListe {
  float: none;
  width: auto;
}

/********/

#produitsComplementaires div.centree {
  width: auto;
  padding: 10px 30px;
  margin: 0px auto;
}

/** ACCUEIL **/

#content section.accueil {
  width: auto;
  margin: 0px auto;
}
#diapoAccueil { display: none; }
#largeurDroiteMenu { display: none; }

#ecranUser header.principal nav {
  bottom: 0px;
  left: 0px;
}
div.separateurAccueil {
  display: none;
}

section.accueil article {
  float: none;
  position: relative;
  width: auto;
  min-height: 0px;
  margin: 15px;
  padding: 15px;
}

section.accueil article span.typeArticle {
  top: 5px;
  right: 3px;
}

/*******/


.article table tr:first-child td:first-child,
#content article.cm table tr:first-child td:first-child {
  border-radius: 0px;
}
.article table tr:first-child td:last-child,
#content article.cm table tr:first-child td:last-child {
  border-radius: 0px;
}
.article table tr:last-child td:first-child,
#content article.cm table tr:last-child td:first-child {
  border-radius: 0px;
}
.article table tr:last-child td:last-child,
#content article.cm table tr:last-child td:last-child {
  border-radius: 0px;
}

/* Dans le monde */
.article div.adresse, #content article div.adresse {
  margin: 0px;
  width: auto;
  padding-left: 28px;
  margin-bottom: 10px;
}


#introduction div.centree article div.intro {
  width: auto;
  height: auto;
  overflow: auto;
  min-height: 0px;
}

/******************/

/***********/

#btnProduitMois {
  overflow: hidden !important;
}
#btnProduitMois a {  position: relative; top: 0px;  left: 50px;
}
#introduction div.centree article, 
section#introduction { min-height: 0px; margin-bottom: 0px; }
#introduction div.centree article { padding-top: 0px; }
#content article.cm { padding: 0px 15px; }
.article ul li, #content article.cm ul li { margin-left: 15px; }