/*Couleur vert pâle background entete : #edf3ea vert foncé bordure entete : #436d33 liens : #90394e rose bg liens : #ebd3d9 rose bg Pvente : #f6eef0 */ /* GÉNÉRAL --------------------------------------------------------------------------------------- */ html, body, span, dl, dt, dd, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, a, a img, table {border:0; margin:0; padding:0;} html {font-size: .75em; font-family: verdana, arial, sans-serif; color: #000;} body {background-color: #fff;} p { margin: 10px 0px 10px 15px; line-height: 1.3em; text-align: left;} blockquote {background-color: #f9f9f9; padding: 0 15px; margin: 5px 5px;border: 1px solid #436d33;line-height: 1.5em; } ul { margin: 0px 0px 10px 10px;} ol { line-height: 1.5em; text-align: left; margin: 0 0 15px 40px;} ol li {list-style-type: decimal; } ul.legende{list-style-type: none; } img, img a {display: block; border: none;} img.surligne {display: inline;} a:link {color: #90394e; text-decoration: none; } a:visited {color: #90394e; font-size: 1em; text-decoration: none; } a:hover {color: #90394e; text-decoration: none; background: #ebd3d9;} a:active {color: #90394e; text-decoration: none; } h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; font-weight: bold;} h1 {font-size: 125%; text-align: left; color: #436d33; padding: 5px 0px 5px 15px; line-height: 1.2em; background: #edf3ea; border-bottom: 3px solid #436d33; /*height:auto;*/} h1.deux {font-size: 125%; text-align: left; width: 390px; color: #436d33; padding: 5px 0px 5px 15px; line-height: 1.2em; background: #edf3ea; border-bottom: 3px solid #436d33; height:auto;} h2 {font-size: 125%; text-align: left; color: #90394e; padding: 5px 0 0 15px;}/*Titre dana page de produit*/ h3 {font-size: 150%; text-align: left; color: #90394e; padding: 0 0 5px 5px;}/*entete menu gauche*/ h4 {font-size: 110%; text-align: left; color: #606060; padding: 15px 0 0 15px;} h5 {font-size: 150%; text-align: left; color:#436d33 ; padding: 0px 0 0 0px; line-height: 1.3em;}/*index*/ h6 {font-size: 115%; text-align: left; color: #436d33; padding: 0 0 0 13px; line-height: 1.2em; } #carte img { margin: 0 0 0 15px; } /* ENTETE ET MENUS --------------------------------------------------------------------------------------- */ #cadre {position: relative; width: 995px; margin-left: auto; margin-right:auto; padding-left: 2px; } #bodyblock { position: relative; border: 1px solid #fff;} #entete {position: relative; width: 100%; top: 0px; height: 80px; background: #edf3ea url(images/entete_biochala-index.jpg) no-repeat ; border-bottom: 24px solid #436d33;} #entete-mel {position: relative; width: 100%; top: 0px; height: 80px; background: #edf3ea url(images/logo-melvita.png) no-repeat ; border-bottom: 24px solid #436d33;} #entete-lpm {position: relative; width: 100%; top: 0px; height: 80px; background: #edf3ea url(images/logo-lpm.png) no-repeat ; border-bottom: 24px solid #436d33;} #entete-pk {position: relative; width: 100%; top: 0px; height: 80px; background: #edf3ea url(images/logo-pk.png) no-repeat ; border-bottom: 24px solid #436d33;} #entete-autres {position: relative; width: 100%; top: 0px; height: 80px; background: #edf3ea ; border-bottom: 24px solid #436d33;} #enteteD {position: relative; float: right; width: 425px; top: 0px; height: 80px; /* background: #edf3ea url(images/entete_biochala.jpg)*/ } #menu_cie { position: absolute; width: 100%; top: 83px; } #menu_cie ul li { float: left; display: inline;} #menu_cie li { float: right; display: inline; padding: 0 5px; } #menu_cie a:link { color: white; } #menuTop {position: relative; width: 845px; float: right; top: 0px; height: 16px; margin-top: 5px; /*/margin-top: 15px ;*/ } #menuTop ul li { float: right; display: inline; margin: 0px 0px 0px 0px;} #menuTop li { float: right; display: inline; padding: 0 5px; } #menuTop a:link {color: #90394e; text-decoration: none; } #menuTop a:visited {color: #90394e; font-size: 1em; text-decoration: none; } #menuTop a:hover {color: 90394e; text-decoration: none; background: url(images/bg_menuTop.gif) repeat-x;} #menuTop a:active {color: #90394e; text-decoration: none; } #menu { position: absolute; width: 140px; height: 100%; padding-left: 2px; border-right: 3px solid #436d33; font-size: 80%; background: #edf3ea; } #menu :hover > a { display:block; background:#ebd3d9;} #menu ul { margin-top: 0px; } #menu ul.mel { font-size: 150%; margin-top: 0px; } #menu ul li { margin: 0px 0px 0px -5px; padding-bottom: 5px; list-style-type:none; width:150px; width: 135px; border-bottom: 1px solid #436d33;} #menu ul li.lien { margin: 0px 0px 0px -5px; padding-bottom: 5px; list-style-type:none; width:150px; width: 135px; } #menu li {padding-top: 5px; } #menu h2 {font-size: 90%; text-align: left; color: #90394e; padding: 5px 0 10px 2px;} .courant { display:block; background-color: #f1e4e7; font-weight: bold;} #menu-dl {position: absolute; width: 140px; height: 100%; padding-left: 2px; border-right: 3px solid #436d33; font-size: 80%; background: #edf3ea; } #menu-dl :hover > a { display:block; background:#ebd3d9;} #menu-dl dt {padding: 8px 5px 0 3px; font-weight: bold; line-height: 1.1em; font-size: 1.1em; color: #436d33;} #menu-dl dd {padding: 2px 5px 0 5px; line-height: 1.5em; font-size: 1.1em; border-bottom: 1px solid #436d33;} #menu-dl dd a:hover { background-color: #ebd3d9; text-decoration: none; } /* INDEX --------------------------------------------------------------------------------------- */ #content-index { position: relative; width: 995px; top: 0px; min-height: 400px; margin-top: 30px;border-bottom: 10px solid #436d33;/* background: url(images/mel-index-fleurs.jpg) no-repeat ;*/ } #content-index p { margin: 0px 0px 10px 0px; line-height: 1.em; text-align: left;} #index-presentation ul { margin: 5px 0 5px 0;} #index-presentation li {list-style: none; float: left; display: inline; height: 225px; /* margin: 0 0 5px 0;*/} #index-presentation img { border: 2px solid #006351; padding: 1px; margin: 4px; } #index-presentation a:hover img { border: 2px solid #bcc0a7;} /* CONTENT --------------------------------------------------------------------------------------- */ #content { position: relative; width: 850px; left: 145px;/* min-height: 500px;*/ margin-top: 25px;} #content dl {} #content dt {padding: 0 2px 0 15px; font-weight: bold; line-height: 1.5em; font-size: 1.1em; color: #436d33;} #content dd {padding: 0 2px 0 15px; line-height: 1.5em; font-size: 1.1em; } #content dd a:hover { background-color: #ebd3d9; text-decoration: none; } #contentPV { position: relative; width: 850px; left: 145px; background-color: #f6eef0; padding-bottom: 10px; margin-top: 25px;} #contentPV ul li { list-style-type: none; line-height: 15px; font-size: .9em; margin-left: 5px;} #bouton { padding: 15px 0 15px 14px; width: 112px; } #bouton img { border: 2px solid #006351;} #bouton a:hover img { border: 2px solid #bcc0a7; background:#edf3ea;} ul.produit-neuf {margin-left: 5px; margin-top: 15px;} li.produit-neuf {padding-left: 10px;} .produit-neuf li {list-style: none; width: 93px; height: 230px; float: left; display: inline; font-size: 90%; line-height: 1.1em; text-align: center; margin: 0, 20px;}/*8 produits de large*/ .produit-neuf img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-huit {margin-left: 10px; margin-top: 15px;} li.produit-huit {padding-left: 10px;} .produit-huit li {list-style: none; width: 105px; height: 230px; float: left; display: inline; font-size: 90%; line-height: 1.1em; text-align: center; margin: 0, 20px;}/*8 produits de large*/ .produit-huit img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-sept {margin-left: 10px; margin-top: 15px;} li.produit-sept {padding-left: 5px;} .produit-sept li {list-style: none; width: 119px; height: 230px; float: left; display: inline; font-size: 90%; line-height: 1.1em; text-align: center; margin: 0, 20px;}/*7 produits de large*/ .produit-sept img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-six {margin-left: 10px; margin-top: 15px;} li.produit-six {padding-left: 10px;} .produit-six li {list-style: none; width: 140px; height: 220px; float: left; display: inline; font-size: 90%; line-height: 1.1em; text-align: center; margin: 0, 20px;}/*6 produits de large*/ .produit-six img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-six-court {margin-left: 10px; margin-top: 15px;} li.produit-six-court {padding-left: 10px;} .produit-six-court li {list-style: none; width: 140px; height: 165px; float: left; display: inline; font-size: 90%; line-height: 1.1em; text-align: center; margin: 0, 20px;}/*6 produits de large*/ .produit-six-court img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-cinq {margin-left: 10px; margin-top: 15px;} li.produit-cinq {padding-left: 10px;} .produit-cinq li {list-style: none; width: 168px; height: 230px; float: left; display: inline; font-size: 90%; line-height: 1.1em; text-align: center; margin: 0, 20px;}/*5 produits de large*/ .produit-cinq img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-quatre {margin-left: 10px; margin-top: 15px;} li.produit-quatre {padding-left: 10px;} .produit-quatre li {list-style: none; width: 210px; height: 250px; float: left; display: inline; text-align: center; margin: 0, 20px;}/*4 produits de large*/ .produit-quatre img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } ul.produit-deux {margin-left: 5px; margin-top: 0px;} li.produit-deux {padding-left: 15px;} .produit-deux li {list-style: none; width: 420px; height: 225px; float: left; display: inline; text-align: center; }/*2 produits de large*/ .produit-deux img { margin-bottom: 0px; margin-left: auto; margin-right:auto; } ul.produit-deux-intro-lpm {margin-left: 5px; margin-top: 0px;} li.produit-deux-intro-lpm {padding-left: 15px;} .produit-deux-intro-lpm li {list-style: none; width: 420px; height: 242px; float: left; display: inline; text-align: center; }/*2 produits de large*/ .produit-deux-intro-lpm img { margin-bottom: 0px; margin-left: auto; margin-right:auto; } ul.produit-deux-intro-arg {margin-left: 5px; margin-top: 0px;} li.produit-deux-intro-arg {padding-left: 15px;} .produit-deux-intro-arg li {list-style: none; width: 420px; height: 560px; float: left; display: inline; text-align: center; }/*2 produits de large*/ .produit-deux-intro-arg img { margin-bottom: 5px; margin-left: auto; margin-right:auto; } ul.produit-deux-joindre {margin-left: 5px; margin-top: 0px;} li.produit-deux-joindre {padding-left: 15px;/* min-height: 815px;*/} .produit-deux-joindre li {list-style: none; width: 420px; float: left; display: inline; text-align: center; }/*2 produits de large*/ .produit-deux-joindre img { margin-bottom: 0px; margin-left: auto; margin-right:auto; } #content-melvita-algascience { position: relative; width: 850px; left: 145px;margin-top: 25px; background: url(images/mel-algascience-fond.jpg) no-repeat 100% 0%} #content-melvita-apicosma { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-apicosma-fond2.jpg) no-repeat 100% 0%} #content-melvita-bio-excellence { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-bio-excellence-fond.jpg) no-repeat 100% 0%} #content-melvita-eaux-florales { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-eau-florale-fond.jpg) no-repeat 100% 0%} #content-melvita-eaux-toilette { position: relative; width: 850px; left: 145px; margin-top: 25px;background: url(images/mel-eaux-toilette-fond.jpg) no-repeat 100% 0%; /*background: url(images/mel-eaux-toilette-gamme.jpg) no-repeat 100% 85%;*/} #content-melvita-ess-corps { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-EssCorps-fond.jpg) no-repeat 100% 0%} #content-melvita-ess-hygiene { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-EssHigiene-fond.jpg) no-repeat 100% 0%} #content-melvita-ess-visage { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-EssVisage-fond.jpg) no-repeat 100% 0%} #content-melvita-homme { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-homme-fond.jpg) no-repeat 100% 0%} #content-melvita-huiles { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-huile-fond.jpg) no-repeat 100% 0%} #content-melvita-karite { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-karite-fond.jpg) no-repeat 100% 0%} #content-melvita-savons { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-savons-fond.jpg) repeat-y 100% 0%} #content-melvita-bebe { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-bebe-fond.jpg) no-repeat 100% 0%} #content-melvita-maman { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-maman-fond.jpg) no-repeat 100% 0%} #content-melvita-peau-jeune { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/mel-peau-jeune.jpg) no-repeat 100% 0%} #content-lpm-a-shamp { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-a-shamp-fond.jpg) no-repeat 100% 0%} #content-lpm-bain-moussant { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-bain-moussant-fond.jpg) no-repeat 100% 0%} #content-lpm-doucheA { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-doucheA-fond.jpg) no-repeat 100% 0%} #content-lpm-douche-bain { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-douche-bain-fond.jpg) no-repeat 100% 0%} #content-lpm-douche-med { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-douche-med-fond.jpg) no-repeat 100% 0%} #content-lpm-douche-fruitee { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-douche-fruitee-fond.jpg) no-repeat 100% 0%} #content-lpm-enfants { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-enfants-fond.jpg) no-repeat 100% 0%} #content-lpm-savon { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-savon-fond.jpg) no-repeat 100% 0%} #content-lpm-savonLiq { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-savonLiq-fond.jpg) no-repeat 100% 0%} #content-lpm-shamp-adulte { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-shamp-adulte-fond.jpg) no-repeat 100% 0%} #content-lpm-soin-corps { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-soin-corps-fond.jpg) no-repeat 100% 0%} #content-lpm-intro { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/lpm-intro-douche-fruitee5.jpg) no-repeat 100% 0%} #content-autre-yogourmet { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/autres-yogourmet-fond.jpg) no-repeat 100% 0%} #content-naka { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/naka-fond.jpg) no-repeat 100% 25%} #content-arg-laboratoire { position: relative; width: 850px; height: 1300px; left: 145px; margin-top: 25px; background: url(images/arg-laboratoire-fond.jpg) no-repeat 100% 60%} #content-arg-horse { position: relative; width: 850px; height: 1300px; left: 145px; margin-top: 25px; background: url(images/arg-horse-fond.jpg) no-repeat 100% 60%} #content-pk-bain { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/pk-bain-fond.jpg) no-repeat 100% 0%} #content-pk-parfum { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/pk-parfums-fond.jpg) no-repeat 100% 0%} #content-pk-dent { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/pk-dent-fond.jpg) no-repeat 100% 0%} #content-soin-corps { position: relative; width: 850px; left: 145px; margin-top: 25px; background: url(images/pk-soin-corps-fond.jpg) no-repeat 100% 0%} #blabla-1 { position: absolute; top: 250px; left: 570px; width: 260px; text-align: justify;} #blabla-2 { position: absolute; top: 320px; left: 570px; width: 260px; text-align: justify;} #blabla-3 { position: absolute; top: 40px; left: 570px; width: 260px; text-align: justify;} #blabla-4 { position: absolute; top: 300px; left: 20px; width: 260px; text-align: justify;} #blabla-5 { position: absolute; top: 30px; left: 300px; width: 260px; text-align: justify;} #blabla-6 { position: absolute; top: 300px; left: 500px; width: 290px; text-align: justify;} #blabla-7 { position: absolute; top: 300px; left: 350px; width: 150px; text-align: justify;} ul.produit-melvita {margin-left: 10px; margin-top: 15px;;} li.produit-melvita {padding-left: 10px;} .produit-melvita li {list-style: none; width: 168px; height: 220px; float: left; display: inline; text-align: center; margin: 0, 20px;}/*4 produits de large*/ .produit-melvita img { margin-bottom: 10px; margin-left: auto; margin-right:auto; } #listing { position: relative; float: left; top: 0px; width: 850px; left: 15px;} ul.listing {margin-left: 25px; margin-top: 10px; list-style-image: url("images/m.gif"); list-style-position: outside; padding: 0px 10px 0px 10px;} .listing li {width: 800px; margin: 0 0 5px 5px; } #listing-n { position: relative; float: left; top: 0px; width: 850px; left: 15px;} ul.listing-n {margin-left: 25px; margin-top: 10px; list-style-image: url("images/n.gif"); list-style-position: outside; padding: 0px 10px 0px 15px;} .listing-n li {width: 800px; margin: 0 0 5px 5px; } #listing-a { position: absolute; float: left; top: 40px; width: 500px; left: 15px;} ul.listing-a {margin-left: 25px; margin-top: 10px; list-style-image: url("images/a.gif"); list-style-position: outside; padding: 0px 10px 0px 10px;} .listing-a li {width: 500px; margin: 0 0 5px 5px;} ul li span { color: #277917; } .autres-intro td {vertical-align: top; } .autres-intro p { margin: 10px 0px 10px 5px; } li.nouveau { text-decoration: underline; line-height: 1.2em; } li.droite { margin-left: 20px;} #demo { font-size: 90%; } #demo dl dd span { font-size: 85%; } #demo dl dt span { color: #000; } dt.demo { padding: 7px 0 0 0; line-height: 1.4em; color: #606060;} dd.demom { line-height: 1.4em; font-weight: bold;} dd.demo { line-height: 1.4em; } dl dd.demo { border-bottom: 1px solid #436d33; } table.demo {margin-left: 5px; } table.demo td.beaute {margin-left: 15px; vertical-align: top; width: 410px;} table.demo td.soins {margin-left: 15px; vertical-align: top; width: 410px; border-left: 3px solid #436d33;} #logo { margin: 15px 0 0 15px; } .clear {clear: both; display: block; height: 1px; overflow: hidden; margin: 0; padding: 0;}/*Permet de faire dessendre la couleur de fond jusqu'en bas*/ /* PIED DE PAGE --------------------------------------------------------------------------------------- */ #pied { position: relative; width: 850px; clear: both;/*float: right; left: 145px; width: 100%; padding: 5px 0 7px 145px;*/ margin-top: 10px; /*margin-left: auto; margin-right:auto;*/ border-top: 1px solid #a7a7a3; } #pied a:link {color: #a7a7a3; text-decoration: none; font-size: 100%; line-height: 1.1em;} #pied a:visited {color: #a7a7a3; text-decoration: none;} #pied a:hover {color: #000; background-color: #e8e8e8;} #pied a:active {color: #a7a7a3;text-decoration: none;} #pied p { font-size: 80%; line-height: 1.1em; margin: 5px 0 5px 0px; text-align: left; color: #a7a7a3;} #pied p a { font-size: 90%; line-height: 1.1em;} .copyright {float: right; clear: right; top: 0px; left: 5px; height: 5px; width: 100%; padding: 50px 0 5px 0; } /* PIED DE PAGE Index --------------------------------------------------------------------------------------- */ #pied-index { position: relative; width: 995px; clear: both;/*float: right; left: 145px; width: 100%; padding: 5px 0 7px 145px;*/ margin-top: 10px; /*margin-left: auto; margin-right:auto;*/ border-top: 1px solid #a7a7a3; } #pied-index a:link {color: #a7a7a3; text-decoration: none; font-size: 100%; line-height: 1.1em;} #pied-index a:visited {color: #a7a7a3; text-decoration: none;} #pied-index a:hover {color: #000; background-color: #e8e8e8;} #pied-index a:active {color: #a7a7a3;text-decoration: none;} #pied-index p { font-size: 80%; line-height: 1.1em; margin: 5px 0 5px 0px; text-align: left; color: #a7a7a3;} #pied-index p a { font-size: 90%; line-height: 1.1em;}