/* ----------------------------------------------- © MEDICAMAT 2007 http://www.medicamat.com ----------------------------------------------- */ /* Correction des styles HTML par defaut */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code,dfn,em,strong,th,var { font-style: normal; font-weight: normal; } ol,ul { list-style: none; } caption,th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } q:before,q:after { content:''; } abbr,acronym { border: 0; } /* Styles communs a l'ensemble du site */ body { background: #FFF; text-align: center; } body * { font-size: 11px; font-family: Arial, Helvetica, sans-serif; color: #346767; } #container { width: 980px; margin: 0 auto; text-align: left; } /* Bloc principal et secondaire */ #principal { /*background: #EEFCEF;*/ } /* voir surcharges */ #secondaire { /*background: #D3EDEE;*/ } /* voir surcharges */ /* Contenu central */ #contenu { overflow: hidden; background-color: #FFF; } /* Blocs doite/gauche */ .leftcol { float: left; display: inline; text-align: center; } .rightcol { float: right; display: inline; } /* Logos du site */ #top { background: #FFF; height: 85px; overflow: hidden; background: #FFF url(../img/filet-magique.gif) no-repeat right 7px; } #top .medicamat { float: left; } #top .medicaderm { float: right; } /* Autres titres */ h1,h2,h3,h4,.plus { font-family: VectoralLH, Helvetica, Lucida grande, sans-serif; text-transform: uppercase; } .bicolore { color: #CB025D; } .plus { /*text-transform: uppercase;*/ } /* Styles communs pour les produits */ .illustration { margin: 0 auto; } .leftcol .prix { font-size: 14px; font-weight: bold; color: #D94588; } .ajout { width: 167px; background: #EEF6F8 url(../img/form-ajout-bg.jpg) no-repeat; padding: 4px 0; } form * { vertical-align: middle; } form.ajout label { margin-left: 5px; background: url(../img/puce-label.gif) no-repeat left center; padding-left: 10px; } form.ajout select { border: 1px solid #346767; } /* Styles communs pour le contenu central */ .ariane { margin-bottom: 28px; background: url(../img/hr.gif) repeat-x bottom; padding: 0 0 4px 10px; } .ariane, .ariane * { font-size: 14px; } #contenu h1 { margin-bottom: 25px; text-transform: uppercase; } #contenu h1, #contenu h1 * { font-size: 26px; } #contenu h3 { color: #7FCCCA; font-weight: bold; } #contenu .rightcol p, #contenu .rightcol li { margin: 0 0 14px 0; } #contenu .rightcol li { list-style: url(../img/puce.jpg) inside; } #contenu .leftcol { } #contenu .leftcol h3 { display: none; } #contenu .leftcol .illustration { max-width: 170px; } #contenu .leftcol div { padding: 4px 0 0 0; margin-top: 4px; text-align: left; } #contenu .leftcol div * { vertical-align: middle; } #contenu .info { background: url(../img/hr.gif) repeat-x top; padding: 15px 0; margin: 20px 0; } /* Menu Medicamat */ #menuamat { width: 199px; background: #EEFCEF; overflow: hidden; } #menuamat div { padding: 0 0 0 10px; } #menuamat div div { padding: 0; } #menuamat div#catalogue { margin-bottom: 33px; } #menuamat div#catalogue h2 { display: none; } #menuamat div#catalogue ul {} #menuamat div#catalogue ul li { padding: 4px 0 5px 0; border-bottom: 1px solid #CCC; position: relative; } #menuamat div#catalogue ul li.current { background: url(../img/menuamat-current-bg.jpg) repeat-x bottom; } #menuamat div#catalogue ul li li { margin: 0 0 0 18px; padding: 0; border: 0; background: url(../img/menuamat-li-li.gif) no-repeat left bottom; } #menuamat div#catalogue ul li a { background: url(../img/menuamat-puce-off.gif) no-repeat left center; padding-left: 18px; } #menuamat div#catalogue ul li a:hover { background-image: url(../img/menuamat-puce-on.gif); color: #DB0264; } #menuamat div#catalogue ul li.on a { color: #DB0264; background: url(../img/menuamat-puce-on.gif) no-repeat; } #menuamat div#catalogue ul li li a, #menuamat div#catalogue ul li li a:hover, #menuamat div#catalogue ul li li.on a { background: none; } #menuamat div#news { width: 190px; _width: 200px; overflow: hidden; } #menuamat div#news h2 { background: transparent url(../img/news-top.gif) no-repeat; height: 32px; text-indent: -999px; } #menuamat div#news div { margin-bottom: 10px; background: #FFF url(../img/news-bottom.gif) no-repeat bottom; padding: 0 10px 10px 20px; } #menuamat div#news div h3 { text-transform: uppercase; font-size: 16px; } #menuamat div#news div img { max-width: 150px; height: auto; } #menuamat div#news div p { margin-top: 10px; } /* Barre de nav pour Medicaderm */ #navaderm { text-align: center; padding: 0 9px 0 11px;} #navaderm, #navaderm a { color: #02AAC3; font-size:10px; } #navaderm a { display: block; padding: 6px 0 9px 0; background-repeat: no-repeat; text-transform: uppercase; font-family: VectoralLH, Helvetica, Lucida grande, sans-serif; } #navaderm a.produits { width: 145px; float: left; background-image: url(../img/navaderm-onglet-1.gif); } #navaderm a.panier { width: 134px; float: right; background-image: url(../img/navaderm-onglet-2.gif); } /* Menu Medicaderm */ #menuaderm { width: 300px; float: right; } #menuaderm h2 { display: none; } #menuaderm ul {} #menuaderm li { clear: both; margin: 0 9px 10px 11px; /*padding: 8px 0 0 0;*/ background: url(../img/menuaderm-li.gif) no-repeat; width: 280px; height: 130px; overflow: hidden; } #menuaderm li .rightcol { width: 167px; margin-right: 8px; margin-top: 8px; } #menuaderm li .rightcol h3 { margin-left: 4px; padding-bottom: 8px; font-size:10px; font-weight:bold;} #menuaderm li .rightcol h3 .bicolore { font-size: 13px; display: block; font-size:10px; font-weight:bold;} #menuaderm li .rightcol strong { margin-left: 4px; font-weight: bold; color: #27A9AB; } #menuaderm li .rightcol p { margin-left: 4px; background: url(../img/hr.gif) repeat-x bottom; padding-bottom: 10px; } #menuaderm li .leftcol { width: 90px; margin: 7px 0 0 8px; } #menuaderm li .leftcol * { vertical-align: middle; } #menuaderm li .leftcol .nouveau { margin-bottom: 4px; } #menuaderm li .leftcol .illustration { max-width: 90px; max-height: 100px; } #menuaderm li .leftcol p { text-align: left; padding-top: 2px; } /* Pied de page */ #footer { clear: both; background-color: #FFF; background-repeat: no-repeat; padding-top: 10px; } /* voir surcharges */ #footer ul { margin-left: 220px; } #footer ul li { float: left; /*display: inline;*/ background: transparent url(../img/footer-onglet-g.gif) no-repeat left bottom; margin: 0 2px 0 0; padding: 0; overflow: hidden; } #footer ul li a { display: block; background: transparent url(../img/footer-onglet-d.gif) no-repeat right bottom; padding: 5px 8px 5px 0; margin-left: 10px; } #footer address { clear: both; margin-top: 20px; background: #D4EEEF url(../img/footer-address-bg.jpg) no-repeat; padding: 5px 0 5px 48px; } /* Couleur des liens */ a { text-decoration: none; color: #366; } /* a:hover, a:focus { color: #DB0264; } couleur bidon pour voir */ /* Espaceur de blocs */ .nettoyeur { clear: both; margin: 0; padding: 0; height: 0; line-height: 1%; font-size: 1px; } /* ClearFix /* http://www.positioniseverything.net/easyclearing.html) */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-table; } /* Hides from IE-mac \*/ .clearfix { height: 1%; } .clearfix { display: block; } /* End hide from IE-mac */