/******************
 * MENU GAUCHE ul 
 */

#menuGauche {
  padding: 0px; 
  margin: 0px;
  position: absolute; bottom: 0px; left: -2px;
}
#menuGauche >  li.menu-niveau2,
#menuGauche >  li.menu-niveau2-actif {
  display: block; float: left;
  width: 124px; height: 58px;
  margin: 0px; padding: 0px;
  margin-right: 1px;
  
  
  -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  li.menu-niveau2:first-of-type,
#menuGauche  li.menu-niveau2-actif:first-of-type { margin-left: 0px; width: 123px; }

#menuGauche  li.menu-niveau2-actif {
  background-color: #86a82e;
}
#menuGauche a.lien-niveau2,
#menuGauche a.lien-niveau2-actif {
  display: block;
  width: 100%;
  height: 100%;
  font-family: 'Open Sans', arial;
  font-size: 14px; line-height: 16px;
  line-height: 58px;
  color: white;
  text-decoration: none;
  text-align: center;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.45);
  vertical-align: middle;
  border: none;
  outline: none;
  
  -webkit-transition: background-color 0.3s ease-out;  
     -moz-transition: background-color 0.3s ease-out; 
       -o-transition: background-color 0.3s ease-out;  
          transition: background-color 0.3s ease-out;
}
#menuGauche a.lien-niveau2:hover,
#menuGauche a.lien-niveau2-actif:hover {
  background-color: #86a82e;
}
#menuGauche a.lien-niveau2 span,
#menuGauche a.lien-niveau2-actif span {
  display: block;
  display: inline-block;
  vertical-align: middle;
  
  font-family: 'Open Sans', arial;
  font-size: 14px; line-height: 16px;
  color: white;
}
#menuGauche a.lien-niveau2:active,
#menuGauche a.lien-niveau2-actif:active {
  background-color: transparent;
}

#menuGauche li.visible {
  background-color: #86a82e !important;
}
#menuGauche  li.visible div.masque {
  background-image: url(/lae/public1.0/img/site/fond-noir-transparent.png);
  background-color: transparent;
  background-repeat: repeat;
  z-index : 1000;
}
#menuGauche  li div.masque {
  background-color: transparent;
  height: 0px;
}

#menuDroit {
  background-color: transparent;
  height: 0px;
  position: absolute; top: 174px; left: 0px;
  width: 100%;
}

#menuGauche  li div.masque span.ombre,
#menuDroit span.ombre {
  display: block;
  width: 100%;
  height: 20px;
  background-image: url(/lae/public1.0/img/site/ombre-menu.png);
  background-repeat: no-repeat;
  background-position: 50% 0%;
}
#menuGauche  li div.rectangle,
#menuDroit div.rectangle {
  display: block;
  min-height: 0px;
  height: 0px; overflow: hidden;
  -webkit-transition: height 0.3s ease-out;  
     -moz-transition: height 0.3s ease-out; 
       -o-transition: height 0.3s ease-out;  
          transition: height 0.3s ease-out;
}
#menuGauche  li.visible div.rectangle {
  background-color: #86a82e;
  width: 100%;
  height: 172px;
  padding-bottom: 30px;
}
#menuDroit.visible {
  background-image: url(/lae/public1.0/img/site/fond-noir-transparent.png);
  background-color: transparent;
  background-repeat: repeat;
  z-index : 1000;
}
#menuDroit.visible div.rectangle {
  background-color: #1891b1;
  width: 100%;
  height: 315px;
  padding-bottom: 30px;
}

#menuGauche  li div.rectangle ul,
#menuDroit div.rectangle ul {
  width: 980px;
  margin: 0px auto;
  padding: 0px;
}
#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: left;
  height: 185px;
  width: 138px;
  padding-left: 25px;
  padding-right: 25px;
  position: relative;
  overflow: hidden;
  
  -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6);
  -ms-transform: scale(0.6);
  -o-transform: scale(0.6);
  transform: scale(0.6);
  -webkit-transition: -webkit-transform 0.3s 0.3s ease-out;  
     -moz-transition: -moz-transform 0.3s 0.3s ease-out; 
       -o-transition: -o-transform 0.3s 0.3s ease-out;  
          transition: transform 0.3s 0.3s ease-out;
}
#menuDroit div.rectangle ul li.menu-niveau1,
#menuDroit div.rectangle ul li.menu-niveau1-actif {
  height: 300px;
   width: 160px;
}
#menuGauche  li div.rectangle ul li figure.visuel,
#menuDroit div.rectangle ul li figure.visuel {
  display: block;
  /*width: 136px;*/
  height: 105px;
  border: 2px solid #bcde65;
  margin-top: 25px;
  -webkit-border-radius: 0px 20px 0px 20px;
  -moz-border-radius: 0px 20px 0px 20px;
  border-radius: 0px 20px 0px 20px;
  background-image: url(/lae/public1.0/img/site/visuel-menu-defaut.jpg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  cursor: pointer;
}
#menuDroit div.rectangle ul li figure.visuel {
  border: 2px solid #89c7e4;
  background-color: #89c7e4;
  background-repeat:no-repeat;  
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#menuGauche  li div.rectangle ul li figure.visuel:hover,
#menuDroit div.rectangle ul li figure.visuel:hover {
  box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}
#menuGauche  li.visible div.rectangle ul li.menu-niveau3,
#menuGauche  li.visible div.rectangle ul li.menu-niveau3-actif,
#menuDroit.visible div.rectangle ul li.menu-niveau1,
#menuDroit.visible div.rectangle ul li.menu-niveau1-actif {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#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 {
  display: block;
  width: 100%;
  margin: 0px; padding: 0px;
  text-align: center;  
  font-family: 'Open Sans', arial;
  font-size: 13px; line-height: 15px;
  color: white;
  text-decoration: none;
  margin-top: 3px;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.4);
}
  /* SOUS MENU */
  #menuGauche  li div.rectangle ul li.sousMenu,
  #menuDroit li.sousMenu {
    display: block; float: left;
    height: 300px;
    position: relative;
  }
  #menuGauche  li div.rectangle ul li.sousMenu ul,
  #menuDroit li.sousMenu ul {
    margin: 0px;
    padding: 0px;
    width: 100% !important;
    margin-top: 5px;
  }
  #menuGauche  li div.rectangle ul li.sousMenu ul li,
  #menuDroit li.sousMenu ul li {
    margin: 0px;
    padding: 0px;
    list-style: none;
    line-height: normal !important;
  }
  #menuGauche  li div.rectangle ul li.sousMenu ul li a,
  #menuDroit li.sousMenu ul li a {
    display: block;
    padding: 3px 0px;
    padding-left: 20px;
    font-family: 'Open Sans', arial;
    font-size: 13px; line-height: 13px;
    color: white;
    text-decoration: none;
    background-image: url(/lae/public1.0/img/site/puce.png);
    background-repeat: no-repeat;
    background-position: 0% 20%;
  }
  #menuGauche li div.rectangle ul li.sousMenu ul li a:hover,
  #menuDroit li.sousMenu ul li a:hover {
    text-shadow: 1px 1px 3px rgba(0,0,0,0.4);
    background-position: 2% 20%;
  }
  
/******************
 * IMAGES DES MENUS
 */

/* VOS BESOINS */
#menuGauche  li div.rectangle ul li figure.digestif {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/equilibre-digestif_A.jpg);
}
#menuGauche  li div.rectangle ul li figure.detente {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/detente-relaxation-sommeil_A.jpg);}
#menuGauche  li div.rectangle ul li figure.vitalite {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/vitalite-performances-intellectuelles_A.jpg);}
#menuGauche  li div.rectangle ul li figure.defenses {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/defenses-naturelles_A.jpg);}
#menuGauche  li div.rectangle ul li figure.lipidique {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/equilibre-lipidique_A.jpg);}
#menuGauche  li div.rectangle ul li figure.confort {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/confort-veineux_A.jpg);}
#menuGauche  li div.rectangle ul li figure.osteo {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/osteo-articulaire_A.jpg);}
#menuGauche  li div.rectangle ul li figure.proteine {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/preparations-hyperproteinees_A.jpg);}
#menuGauche  li div.rectangle ul li figure.detox {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/elimination-detox_A.jpg);}
#menuGauche  li div.rectangle ul li figure.femme {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/specifiques-femme_A.jpg);}
#menuGauche  li div.rectangle ul li figure.enfant {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/specifiques-enfants_A.jpg);}
#menuGauche  li div.rectangle ul li figure.sport {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/specifiques-sport_A.jpg);}
#menuGauche  li div.rectangle ul li figure.conseil {
  background-image:url(/complement-alimentaire/uploads/famille/vignettes/produits-conseil_A.jpg);}

/* Nos dossiers */
#menuGauche  li div.rectangle ul li figure.acide-gras {
  background-image:url(/lae/public1.0/img/menu/acide-gras.jpg);}
#menuGauche  li div.rectangle ul li figure.phytomineraux {
  background-image:url(/lae/public1.0/img/menu/phytomineraux.jpg);}
#menuGauche  li div.rectangle ul li figure.minceur-detox {
  background-image:url(/lae/public1.0/img/menu/minceur-detox.jpg);}
#menuGauche  li div.rectangle ul li figure.fibres {
  background-image:url(/lae/public1.0/img/menu/fibres.jpg);}
#menuGauche  li div.rectangle ul li figure.detox-sante {
  background-image:url(/lae/public1.0/img/menu/detox-sante.jpg);}
#menuGauche  li div.rectangle ul li figure.jambes {
  background-image:url(/lae/public1.0/img/menu/jambes.jpg);}
#menuGauche  li div.rectangle ul li figure.antioxydants {
  background-image:url(/lae/public1.0/img/menu/antioxydants.jpg);}
#menuGauche  li div.rectangle ul li figure.oligoelements {
  background-image:url(/lae/public1.0/img/menu/oligoelements.jpg);}
#menuGauche  li div.rectangle ul li figure.probiotiques {
  background-image:url(/lae/public1.0/img/menu/probiotiques.jpg);}
#menuGauche  li div.rectangle ul li figure.conseils-specifiques {
  background-image:url(/lae/public1.0/img/menu/conseils-specifiques.jpg);}
#menuGauche  li div.rectangle ul li figure.conseils-pour-tous {
  background-image:url(/lae/public1.0/img/menu/conseils-pour-tous.jpg);}
#menuGauche  li div.rectangle ul li figure.nca {
  background-image:url(/lae/public1.0/img/menu/nca.jpg);}
#menuGauche  li div.rectangle ul li figure.iomet {
  background-image:url(/lae/public1.0/img/menu/iomet.jpg);}
  
  
#menuGauche  li div.rectangle ul li figure.edito {
  background-image:url(/lae/public1.0/img/menu/edito.jpg);}
#menuGauche  li div.rectangle ul li figure.quatre-saisons {
  background-image:url(/lae/public1.0/img/menu/4-saisons.jpg);}
  #menuGauche  li div.rectangle ul li figure.actualites {
  background-image:url(/lae/public1.0/img/menu/actualites-produit-2014.jpg);}

/* laboratoire Nutergia */
#menuDroit div.rectangle ul li figure.entreprise {
  background-image:url(/lae/public1.0/img/menu/notre-entreprise.jpg);}
#menuDroit div.rectangle ul li figure.engagement-qualite {
  background-image:url(/lae/public1.0/img/menu/engagement-qualite.jpg);}
#menuDroit div.rectangle ul li figure.monde {
  background-image:url(/lae/public1.0/img/menu/dans-le-monde.jpg);}
#menuDroit div.rectangle ul li figure.rh {
  background-image:url(/lae/public1.0/img/menu/rh.jpg);
}


#menuGauche li div.rectangle ul li figure.produits-alpha {
  background-image: url(/lae/public1.0/img/menu/alpha.jpg);
}
#menuGauche li div.rectangle ul li figure.sport-protect {
  background-image: url(/lae/public1.0/img/menu/label-sp.jpg);
}
#menuGauche li div.rectangle ul li figure.fond-kousmine {
  background-image: url(/lae/public1.0/img/menu/kousmine.jpg);
}

/***********/

#btnProduitMois {
  width: 192px; height: 165px;
  overflow: visible !important;
}
#btnProduitMois a {
  display: block;
  width: 192px; height: 165px;
  float: left;
  background-image: url(/lae/public1.0/img/menu/btn-produit-du-mois.png);
  background-repeat: no-repeat;
  position: relative; top: 20px; 
}