body { position: relative; margin:0; font-family: Arial; font-size: 11px; background-color: black;} h1, h2, h3, h4, h5, ul, li, p { margin:0; padding:0; } li { list-style: none;} img { border:0; } a { text-decoration: underline; outline: none; color:#333333; } a:hover { text-decoration: none; outline: none; color:#333333; } .error { color:#E2001B; } .clear { clear: both;} #container { position: relative; width:990px; margin: 0 auto; padding:20px 0; height: 650px; background-color: black; display: block;} #left { float: right; width:30px; height:650px; background: url(../images/img-back-left.png) no-repeat; margin-right: 15px; } #middle { position: relative; float: right; width:250px; height:650px; background: url(../images/img-back-middle.png) no-repeat; margin-right: 15px; } #middle h2.logo a { position: absolute; top:20px; width:220px; left:15px; height:50px; display: block; text-indent: -9999em; } #middle h5 { position: absolute; bottom:20px; width: 250px; text-align: center; font-size: 14px; color: #333333; } #middle ul#rubrique { position: relative; width: 230px; overflow: hidden; margin:100px auto 0 auto; } #middle ul#rubrique li { margin: 15px 0; color: white; } #middle ul#rubrique li a { display: block; } #middle ul#rubrique li h2.open{ height:20px; } /* Francais */ #middle ul#rubrique li.creations_1 { background:url(../images/img-menu-creations.png) no-repeat; display: block; width:230px; } #middle ul#rubrique li.atelier_1 { background:url(../images/img-menu-atelier.png) no-repeat; display: block; width:230px; } #middle ul#rubrique li.galerie_1 a { background:url(../images/img-menu-galerie.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li.pdv_1 a { background:url(../images/img-menu-pdv.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li.presse_1 a { background:url(../images/img-menu-presse.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li.contact_1 a { background:url(../images/img-menu-contact.png) no-repeat; display: block; width:230px; height: 20px; } /* English */ #middle ul#rubrique li.creations_2 { background:url(../images/img-menu-creations_en.png) no-repeat; display: block; width:230px; } #middle ul#rubrique li.atelier_2 { background:url(../images/img-menu-atelier_en.png) no-repeat; display: block; width:230px; } #middle ul#rubrique li.galerie_2 a { background:url(../images/img-menu-galerie_en.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li.pdv_2 a { background:url(../images/img-menu-pdv_en.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li.presse_2 a { background:url(../images/img-menu-presse_en.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li.contact_2 a { background:url(../images/img-menu-contact_en.png) no-repeat; display: block; width:230px; height: 20px; } #middle ul#rubrique li .niveau2 { margin:0; color: white; background: none; } #middle ul#rubrique li.creations_1 .niveau2 a { margin:10px 0 10px 0; color: #333333; background:none; text-align: right; text-decoration: none; font-size: 12px; padding-right:10px; width:220px; height:12px; } #middle ul#rubrique li.creations_1 .niveau2 a.on { margin-top:10px; color: #333333; background: url(../images/img-fleche-droite.png) no-repeat 223px 3px; text-align: right; text-decoration: none; font-size: 12px;padding-right:10px; width:220px; } #middle ul#rubrique li.creations_1 .niveau2 a:hover { text-decoration: underline; } #middle ul#rubrique li.atelier_1 .niveau2 a { margin:10px 0; color: #333333; background:none; text-align: right; text-decoration: none; font-size: 12px; padding-right:10px; width:220px; height:12px; } #middle ul#rubrique li.atelier_1 .niveau2 a.on { margin-top:10px; color: #333333; background: url(../images/img-fleche-droite.png) no-repeat 223px 3px; text-align: right; text-decoration: none; font-size: 12px;padding-right:10px; width:220px; } #middle ul#rubrique li.atelier_1 .niveau2 a:hover { text-decoration: underline; } #middle ul#rubrique li.creations_2 .niveau2 a { margin:10px 0 10px 0; color: #333333; background:none; text-align: right; text-decoration: none; font-size: 12px; padding-right:10px; width:220px; height:12px; } #middle ul#rubrique li.creations_2 .niveau2 a.on { margin-top:10px; color: #333333; background: url(../images/img-fleche-droite.png) no-repeat 223px 3px; text-align: right; text-decoration: none; font-size: 12px;padding-right:10px; width:220px; } #middle ul#rubrique li.creations_2 .niveau2 a:hover { text-decoration: underline; } #middle ul#rubrique li.atelier_2 .niveau2 a { margin:10px 0; color: #333333; background:none; text-align: right; text-decoration: none; font-size: 12px; padding-right:10px; width:220px; height:12px; } #middle ul#rubrique li.atelier_2 .niveau2 a.on { margin-top:10px; color: #333333; background: url(../images/img-fleche-droite.png) no-repeat 223px 3px; text-align: right; text-decoration: none; font-size: 12px;padding-right:10px; width:220px; } #middle ul#rubrique li.atelier_2 .niveau2 a:hover { text-decoration: underline; } #right { position: relative; float: right; width:620px; height:620px; background: url(../images/img-back-right.png) no-repeat; overflow: hidden; text-align: left; padding: 15px; } #right-masque { position: absolute; top:0; left: 0; background: url(../images/img-masque-top.png) no-repeat; width: 650px; height: 14px; z-index: 10000; } #right #accueil { position: relative; width: 620px; height: 220px; margin:0 auto 0 auto; padding: 0 0 30px 0; } #right #accueil a { position: absolute; bottom:15px; right: 10px; } #right #accueil #masque { position: absolute; top:0px; left:0px; overflow: hidden; width: 620px; height: 210px; background: url(../images/img-masque-image.png) no-repeat; z-index: 1000; } #right #accueil #content { position: absolute; top:0; left:0; overflow: hidden; width: 620px; height: 210px; } #right #accueil-atelier { position: relative; width: 620px; height: 210px; margin:0 auto 0 auto; padding: 0 0 30px 0; } #right #accueil-atelier #masque { position: absolute; top:0px; left:0px; overflow: hidden; width: 620px; height: 200px; background: url(../images/img-masque-image2.png) no-repeat; z-index: 1000; } #right #accueil-atelier #content { position: absolute; top:0; left:0; overflow: hidden; width: 620px; height: 200px; } /* Francais */ #right #colonne-left_1{ float: left; width:310px; } #right #colonne-left_1 h2 { background: url(../images/img-titre-actu_1.png) no-repeat; width: 300px; height: 23px; display: block; } #right #colonne-left_1 span.date { font-weight: bold; display: block; color: #333333;} #right #colonne-left_1 p { font-size: 11px; color: #333333; width: 280px; padding:10px 10px 5px 10px; } #right #colonne-left_1 h5 { margin:0 0 10px 10px; } /* Anglais*/ #right #colonne-left_2 { float: left; width:310px; } #right #colonne-left_2 h2 { background: url(../images/img-titre-actu_2.png) no-repeat; width: 300px; height: 23px; display: block; } #right #colonne-left_2 span.date { font-weight: bold; display: block; color: #333333;} #right #colonne-left_2 p { font-size: 11px; color: #333333; width: 280px; padding:10px 10px 5px 10px; } #right #colonne-left_2 h5 { margin:0 0 10px 10px; } /* Francais*/ #right #colonne-right_1 { float: right; width:310px; } #right #colonne-right_1 h2 { background: url(../images/img-titre-patrick_1.png) no-repeat; width: 300px; height: 23px; display: block; } #right #colonne-right_1 .index p { line-height: 18px; margin: 5px 0 0 0; } #right #colonne-right_1 .index img { float: left; margin:6px 10px 10px 0; } #right #colonne-right_1 .index p span.big { font-size: 18px; display: block; margin:12px 0 10px 0; clear: both; } /* Anglais*/ #right #colonne-right_2 { float: right; width:310px; } #right #colonne-right_2 h2 { background: url(../images/img-titre-patrick_2.png) no-repeat; width: 300px; height: 23px; display: block; } #right #colonne-right_2 .index p { line-height: 18px; margin: 5px 0 0 0; } #right #colonne-right_2 .index img { float: left; margin:6px 10px 10px 0; } #right #colonne-right_2 .index p span.big { font-size: 18px; display: block; margin:12px 0 10px 0; clear: both; } #right #colonne { position: relative; width: 620px; } #right #colonne h2 { text-indent: -9999em; } #right #colonne h2.actu_1 { width: 620px; height: 23px; background: url(../images/img-titre-actu_1.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.actu_2 { width: 620px; height: 23px; background: url(../images/img-titre-actu_2.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.atelier_1 { width: 620px; height: 23px; background: url(../images/img-title-atelier_1.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.atelier_2 { width: 620px; height: 23px; background: url(../images/img-title-atelier_2.png) no-repeat; margin: 0 0 10px 0; } #right h2.catalogue_1 { text-indent: -9999em; width: 620px; height: 23px; background: url(../images/img-title-catalogue_1.png) no-repeat; margin: 0 0 10px 0; } #right h2.catalogue_2 { text-indent: -9999em; width: 620px; height: 23px; background: url(../images/img-title-catalogue_2.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.presse_1 { width: 620px; height: 23px; background: url(../images/img-title-presse_1.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.presse_2 { width: 620px; height: 23px; background: url(../images/img-title-presse_2.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.contact_1 { width: 620px; height: 23px; background: url(../images/img-title-contact_1.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.contact_2 { width: 620px; height: 23px; background: url(../images/img-title-contact_2.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.pdv_1 { width: 620px; height: 23px; background: url(../images/img-title-pdv_1.png) no-repeat; margin: 0 0 10px 0; } #right #colonne h2.pdv_2{ width: 620px; height: 23px; background: url(../images/img-title-pdv_2.png) no-repeat; margin: 0 0 10px 0; } #right #colonne p { line-height: 18px;} #right #colonne h2.galerie { width: 620px; height: 23px; background: url(../images/img-title-galerie.png) no-repeat; margin:30px 0 10px 0; } #right #colonne a.presse { font-size: 14px; color: #333333; } #right #colonne fieldset { position: relative; border: 0; } #right #colonne fieldset p { margin: 5px 0; clear: both; } #right #colonne fieldset p label { width: 120px; padding-right: 5px; line-height: 18px; float: left; } #right #colonne fieldset input[type=text] { border:1px solid #AF4D04; width:246px; background-color: white; color:#333333; font-size: 11px; height: 17px; padding:2px 2px 0 2px; } #right #colonne fieldset textarea { border:1px solid #AF4D04; width:250px; height:60px; background-color: white; color:#333333;} #right #colonne fieldset input[type=image] { border: 0; width:92px; height:28px; margin-left:90px;} #right #colonne fieldset #coordonnees { position: absolute; top:10px; right:20px;} /* CATALOGUE */ ul#catalogue { overflow: hidden;} /*ul#catalogue li { position: relative; float: left; margin:5px 18px; text-align: center; width:115px; height:140px; overflow: hidden; }*/ ul#catalogue li { float:left; height:190px; margin:6px 2px; overflow:hidden; position:relative; text-align:center; width:150px; } ul#catalogue li h2 { font-size: 11px; margin-bottom: 5px; height: 25px;} /*ul#catalogue li h5 { position: absolute; bottom: 5px; left:15px;}*/ ul#catalogue li h5 { bottom:30px; left:34px; position:absolute; } #navigation { position: absolute; bottom:4px; width: 620px; margin:15px auto 0 auto; text-align: center;} #navigation a { background-color: #ffffff; border: #ffffff; padding:2px 4px; margin: 2px; color: #666666; text-decoration: none; } #navigation a:hover { background-color: #e4e4e4; border: #cccccc; padding:2px 4px; margin: 2px; color: #666666; text-decoration: none; } #navigation a.on { background-color: #e4e4e4; border: #cccccc; padding:2px 4px; margin: 2px; color: #666666; text-decoration: none; } /* PRODUIT */ .ligne { border-bottom: 3px solid #EBEBEB; } #produit h1 { position: absolute; top:580px; left:15px; font-size: 14px; color: #333333; margin-bottom: 5px; } #produit h1 span.collection { font-size: 12px; } #produit h2 { position: absolute; top:545px; left:15px; background-color: #333333; color: white; padding:5px 10px; font-size: 12px; z-index: 10000; } #produit h3 { position: absolute; top:600px; left:15px; font-size: 12px; color: #333333;} #produit h4 a { position: absolute; top:615px; left:15px; width:120px; font-size: 12px; color: #333333;} #produit h4 a:hover { text-decoration: none; } #nav { position: absolute; width:620px; right:15px; bottom:25px; } #nav ul { overflow: hidden; } #nav ul li { float: right; margin-left: 10px; } #nav ul li span { display: none; } ul#navigation-produit { position: absolute; bottom:5px; left:15px; width: 620px; text-align: center; margin: 0 auto; } ul#navigation-produit li { display: inline; margin: 0 10px; } ul#navigation-produit li a { color: #666666; text-decoration: none; } ul#navigation-produit li a:hover{ color: #666666; text-decoration: underline; } ul#navigation-produit li.left { background: url(../images/img-navigation-gauche.png) no-repeat left 2px; padding-left: 14px;} ul#navigation-produit li.right { background: url(../images/img-navigation-droite.png) no-repeat right 2px; padding-right: 14px;} ul#images_list { margin: 1px 0 0 0;} .jcarousel-container { position: relative; margin:0 0 0 0; } .jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; } .jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; } .jcarousel-list li, .jcarousel-item { position: relative; float: left; list-style: none; width: 650px; text-align: center; } .jcarousel-list li h5 { position: absolute; bottom:0px; right:15px; color: #333333; font-size: 10px; z-index: 10000; } .jcarousel-next {z-index: 3; display: none; } .jcarousel-prev { z-index: 3; display: none; } .jcarousel-skin-images .jcarousel-container-horizontal { width:650px; } .jcarousel-skin-images .jcarousel-clip-horizontal { width:650px; } .jcarousel-skin-images .jcarousel-item { width:650px; height:570px } #scroll { width: 620px; height: 350px; overflow-x: hidden; overflow-y: auto; padding-right: 10px; } .panorama-viewport { position: relative; width: 620px; overflow: hidden; margin: 0; padding: 0; text-align: left; } .panorama-container { position: relative; width: 100000px; margin: 0; padding: 0; } /* PDV */ #point-de-vente { position: relative; } #point-de-vente p { margin: 2px 0; clear: both; } #point-de-vente p label { float: left; width:250px; text-align: right; padding-right: 5px; } #point-de-vente .infos { width:430px; height: 380px; } #point-de-vente .infos #reponse { margin:20px 0 0 0; } /* PLAN SITE */ ul#plan-site { overflow: hidden; } ul#plan-site li { float: left; width: 120px; margin: 5px; background: url(../images/img-navigation-droite.png) no-repeat left 2px; padding-left: 14px; } #footer { margin:5px 0 0 90px; color: white; font-size: 10px; } #footer a { color: white; text-decoration: none; } #footer a:hover { color: white; text-decoration: underline; }