/********************************************************* GENERAL **********************************************************/ * { margin:0; padding:0; border:none; font-family: Arial, Helvetica, sans-serif; font-size:98%; color:#002d00;} /* -------------- LIENS -------------------- */ a, a:visited, a:active { text-decoration:none; color:#d32376; } a:hover { text-decoration:none; } .detail { display:block; margin-top:.7em; clear:left; } .detail a { font-size:1.2em; background:url('images/picto-details.png') center left no-repeat; padding-left:24px; } /********************************************************* STRUCTURE **********************************************************/ /* border:1px dotted #ff0000; ----- */ /* background:url('images/image.jpg') top left repeat-y; ----- */ html { } body {background:#004600; line-height:1.2em;} #deco { margin:0 auto; background:#b5c143 url('images/body.jpg') top left repeat-x;} /* pour arrière plan décoratif ----- */ #box { width:100%; margin:0 auto; background:url('images/deco.jpg') top center no-repeat;} #cadre_main { min-height:600px; -height:600px; width:950px; margin:0 auto; } #header { width:970px; margin:0 auto; height:270px; } .logo-header { float:left; width:230px; margin-top:30px; } .breadcrumb { color:#fff; font-size:1em; font-weight:normal; } /* ------------ MENU TOP ------------------ */ #side-top { float:left; width:740px; height:180px; position:relative;} #side-top ul { margin:0; padding:0;} #side-top h2 { display:block; position:absolute; bottom:0; left:20px; font-size:3em; padding-bottom:0px; margin-bottom:6px; color:#dce477; } #side-top h3 { font-size:2em; margin-bottom:10px; clear:both; color:#FFF; } #side-top li { margin:0; padding:0 5px; display:block; float:left;} #side-top li a { color:#fff; text-shadow: 1px 1px 0px #000; } #side-top li a:hover { color:#fff;} #side-top ul.menu-left { display:block; float:left;} #side-top ul.menu-left li { padding:10px 20px 0 0;} #side-top ul.menu-right { display:block; float:right; height:95px; margin-right:20px; -margin-right:0px;} #side-top ul.menu-right li { display:block; width:140px; height:95px; text-align:center; margin:0 1px;} #side-top ul.menu-right li a { color:#FFF; line-height:1em; } #side-top ul.menu-right li.carte { width:150px; padding:5px 0px 0 0px;} #side-top ul.menu-right li.carte a { margin: 0px 0px 0 0px;} #side-top ul.menu-right li.newsletter {padding:10px 0px 0 0px;} #side-top ul.menu-right li.promo { text-align:left; padding:10px 0px 0 0px;} #menu { float:left; width:970px; position:relative; padding-top:10px;} #menu h3 { font-size:2em; margin-bottom:10px; clear:both; color:#FFF; } #menu a { color:#f5ffca; text-shadow: 1px 1px 0px #000; margin:0px 10px 3px 0; font-size:21px; -font-size:17px; padding:7px 7px 0 7px; display:block; float:left;} #menu a:hover { color:#fff;} /********************************************************* POLICES CUFON **********************************************************/ .police1 { color:#FFF; } .police2 { color:#004600; font-size:0.9em; margin:0; } /* #f1ff8a*/ /* ------------ MAIN 750 ( 750 px site 2 colonnes ) -------------------- */ #main-padding { margin:0 0 0 0; width:960px; } /*3c = 550px - 2c = 750px - 1c = 950px */ #main-padding #main { margin:25px 0px; } /* main=740px */ #main-padding #main ul {list-style-position: inside; margin:10px 15px;} #main-padding #main li {} #main-padding .content { padding:15px 10px} /********************************************************* HOME **********************************************************/ /* ------------ BLOC HOME 1 ------------------ */ .bloc-home-1 {} .bloc-home-1 .pic {float:left; width:150px; margin-right:5px;} .bloc-home-1 .pic img {} /* changer marge suivant largeur vignette */ .bloc-home-1 .detail {} .bloc-home-1 .prix {} /* ------------ BLOC HOME 2 ------------------ */ .bloc-home-2 { width:340px; float:left; } /*3c = 460px - 2c = 360px - 1c = 270px */ .bloc-home-2 .content { background:url('images/bg-home.jpg') top center no-repeat; } .bloc-home-2 h2 { padding:0 10px 10px 10px;} #main-padding #main .bloc-home-2 ul { line-height:1.1em; margin:10px 30px;} .bloc-home-2 h3 { color:#030; padding:0 10px} .bloc-home-2 .pic { text-align: center;} .bloc-home-2 .pic img { border:4px solid #dce97b;} /* changer marge suivant largeur vignette */ .bloc-home-2 .detail { padding: 0 0 15px 15px;} .bloc-home-2 p { padding:20px;} /* ------------ BLOC HOME 3 ------------------ */ .bloc-home-cat { float:right; width:610px;} .bloc-home-cat .bloc-1, .bloc-home-cat .bloc-5, .bloc-home-cat .bloc-2, .bloc-home-cat .bloc-3, .bloc-home-cat .bloc-4 { float:left; width:290px; height:170px; margin:0px 5px 0 0;} .bloc-home-cat .bloc-1 li, .bloc-home-cat .bloc-2 li, .bloc-home-cat .bloc-3 li, .bloc-home-cat .bloc-4 li, .bloc-home-cat .bloc-5 li { color:#FFF; margin-left:.5em; width:160px; line-height:1.1em; list-style-position:outside; margin-bottom:1em; } .bloc-home-cat .bloc-1 li { margin-bottom:1.2em; } .bloc-home-cat .bloc-1 h3, .bloc-home-cat .bloc-2 h3, .bloc-home-cat .bloc-3 h3, .bloc-home-cat .bloc-4 h3, .bloc-home-cat .bloc-5 h3 { padding:0px 5px; font-size:1.8em; } .bloc-home-cat h3 img{ vertical-align:text-top; margin-right:5px; } #main-padding #main .bloc-home-cat ul { margin-top:20px; -margin-top:10px; } .bloc-home-cat .bloc-1 { background:#6d7c19 url('images/bloc-home-1.jpg') top right no-repeat; border:4px solid #95af00; } .bloc-home-cat .bloc-2 { background:#6f3822 url('images/bloc-home-2.jpg') top center no-repeat; border:4px solid #88452a; } .bloc-home-cat .bloc-3 { background:#e8891f url('images/bloc-home-3.jpg') top center no-repeat;border:4px solid #e469cd; } .bloc-home-cat .bloc-4 { background:#e8891f url('images/bloc-home-4.jpg') top center no-repeat; border:4px solid #f59a33; } .bloc-home-cat .bloc-5 { background:#4b97a1 url('images/bloc-home-5.jpg') top center no-repeat; border:4px solid #5eaec3; } .bloc-home-cat .bloc-1 li a , .bloc-home-cat .bloc-2 li a , .bloc-home-cat .bloc-3 li a , .bloc-home-cat .bloc-4 li a , .bloc-home-cat .bloc-5 li a { color:#FFF; text-shadow: 1px 1px 0px #555; font-size:1.2em;} /********************************************************* ENTETE Rubrique -> au dessus des produits **********************************************************/ /* ------------ ENTETE Rubrique ------------------ */ .entete-rubrique {} .entete-rubrique p {font-size:1.6em; padding:20px; } .entete-rubrique h2 { margin:.5em 0;} .entete-rubrique h2 a { text-decoration:none; color:#FFF;} .entete-rubrique .pic {float:left; margin-right:10px; } .entete-rubrique .pic img { border:4px solid #dce97b;} /********************************************************* PRODUIT 1er AFFICHAGE **********************************************************/ .nouveaute {float:right; margin-right:20px;} /* ------------ BLOC PRODUIT 1 ------------------ */ .bloc-produit-1 { width:800px; margin:10px auto; display:inline-block;} .bloc-produit-1 .pic {float:right; width:300px;} .bloc-produit-1 h3 { background:url('images/filet-titre.jpg') bottom left no-repeat; } /* ROLLOVER 1ER AFFICHAGE */ .bloc-produit-1 .thumb {} .bloc-produit-1 .thumb img { width:90px; margin-right:3px;} /* FIN ROLLOVER 1ER AFFICHAGE */ .bloc-produit-1 .detail {} .bloc-produit-1 .prix {} .bloc-produit-1 p strong { font-size:1.1em;} /* ------------ BLOC PRODUIT 2 ------------------ */ .bloc-produit-2 {width:460px; float:left; margin:15px 15px 0 0px; line-height:1.1em; min-height:310px;} .bloc-produit-2 h3 { font-size:2em; padding-bottom:7px; background:url('images/filet-titre.jpg') bottom left no-repeat; margin:.5em 0;} .bloc-produit-2 h3 a { color:#FFF;} .bloc-produit-2 .pic {float:left; margin:0 10px 15px 0; border:4px solid #dce97b; line-height:0; font-size:0; } .bloc-produit-2 .pic img {} .bloc-produit-2 .detail {} .bloc-produit-2 .prix {} .bloc-produit-2 p strong { font-size:1.1em;} /* ------------ BLOC DETAIL ------------------ */ .bloc-detail {} .bloc-detail #diaporama { } .bloc-detail #diaporama .thumb { float:left; width:470px; margin:1em 0 3.5em 0;} .bloc-detail #diaporama .thumb img {width:150px;} .bloc-detail #diaporama .big img {} .bloc-detail .content{ margin:0 80px 0 0;} #img_legende { font-size:1.8em; padding:.5em 0; display:list-item; } /* ------------ PARTENAIRES ------------- */ .partenaire{ margin:5px 45px; float:right } .liens { margin:0 0 0 10px; } .thumbpic_liens { float:right; margin:0 50px 5px 10px; border:1px solid #fff; } /* décalage vignette logo*/ /* ------------ PLAN --------------------- */ .plan, .horaires { margin: 20px auto; width:610px; } .plan legend, .horaires legend {font-size:2em; padding:5px 10px; color:#FFF;} .plan dl dt, .horaires dl dt{font-weight:bold; } .plan dl dd, .horaires dl dd{width:300px; padding-left:5px; margin-top:5px;} .horaires ul li{width:200px; padding-left:5px; } .plan a, .horaires a {} .plan a:hover, .horaires a:hover, .plan a:visited, .horaires a:visited { text-decoration:underline;} /* ------------ DL DT DD ------------------ */ dl { } dl h3{ text-transform:uppercase; } dt, dd { padding:5px 10px; } dt { width: 170px; float: left; font-size:1.3em; } /* hack de commentaire avec un antislash pour ie5 mac \*/ dt { clear:both; } /* end hack */ dd { float: left; width:240px; line-height:1.4em; } /* ------------ NAV PAGINATION ------------------ */ div.pagination {text-align:right; padding:10px 6px 4px 0; color:#313031;} div.pagination a { color:#dce97b; text-decoration:none; padding:5px 6px 4px 5px; margin:0 3px 0 3px; border:1px solid #dce97b;} div.pagination a:hover, div.pagination a:active {color:#fff; border:1px solid #fff; background-color:trnsparent; } div.pagination span.current {padding:5px 6px 4px 5px; margin:0 3px 0 3px; border:1px solid #002d00; font-weight:bold; color:#002d00; background-color:transparent; } div.pagination span.disabled {display:none;} /* ------------ COMMUNS (dans la charte du site) --------------------- */ h1, h2, h3, h4 { font-weight:normal;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;} h2 {font-size:3em; color:#FFF; line-height:1em; } h3 {font-size:2em; margin:5px 0;text-shadow: 1px 1px 0px #65801f; color:#FFF; } h4 {font-size:1.4em; border-bottom:1px solid #002d00;} .prix {} .prix-barre {text-decoration:line-through;} .annotation {font-style:italic; font-size:0.9em; color:#647f24;} /* ------------ ICONS --------------------- */ .pdf { background: url('images/picto-pdf.jpg') no-repeat left center; padding:0 0 0 40px; margin:7px 10px 0 0; height:40px; float:left;} .pdf a{ padding:15px 0 0 0; display:block; font-size:1.1em; color:#FFF; text-decoration:underline;} .link { background: url('images/icons/link.png') no-repeat left center; padding:0 0 0 22px; margin:7px 0;} /* ------------ ICONS --------------------- */ .hidden, .menu-ref, .produit-ref { visibility:hidden; overflow: auto; display:none;} .retour { display:block; float:right; width:120px; height:100px; margin:5px; border:0px solid #000; background:url('images/retour.png') center right no-repeat; position:relative; } .retour a { display:block; position:absolute; top:37%; left:25%; color:#FFF; font-size:1.8em; font-weight:bold; } div.hr { border-bottom:1px solid #CCC; } /* background:url('images/separation.gif') bottom left repeat-y; */ div.hr hr { display: none; } .vide { font-style:italic; margin:5px 0; text-align:center; color:#FFF;} .alerte { background: #dce265; text-align: center ; padding: 5px 0px; font-weight:bold; } .newsletter {width:700px; margin:0 auto; padding:40px} /* ------------ RECHERCHE --------------------- */ #recherche-menu {width:200px; height:110px; margin:10px 0 10px 5px; } #recherche-menu .top { height:20px; width:180px; } #recherche-menu form { margin:0 auto; width:180px; } #recherche-menu select { font-size:0.9em; border:1px solid #d7d7d7; vertical-align:middle; width:146px; vertical-align:middle;background:#fff; color:#000000; } /* Skinner couleur */ #recherche-menu .input-rech { padding:4px; font-size:0.9em; border:1px solid #d7d7d7; vertical-align:middle; width:145px; background:#fff; color:#000000;} /* Skinner couleur */ #recherche-menu option { vertical-align:middle; padding:2px; width:200px; color:#000000; } /* Skinner couleur */ #recherche-menu label { float:left; width:150px; text-indent:10px; margin:0; } #recherche-menu img { height:auto; size:auto; } /********************************************************* FORMULAIRE **********************************************************/ .formulaire { width:700px; margin:0 auto; padding:40px} .formulaire .left{width:45%; float:left;} .formulaire input, .formulaire textarea{ width:200px; padding:3px; } /* charter bg couleur */ .formulaire radio, .formulaire label, .formulaire input, .formulaire textarea, .formulaire select { display: block; float: left; margin-bottom:10px; vertical-align:middle;} .formulaire label { width: 170px; margin-right: 10px; font-size:1.4em; } .formulaire input, .formulaire textarea, .formulaire select {border:1px solid #B4B2B2; background:#fff;} .formulaire .bouton { width:120px; cursor:pointer; font-weight:bold; padding:2px; border:1px solid #000; color:#fff; background:#d32376; } .formulaire .input-radio { background:transparent; border:0px solid #fff; width:auto; } .formulaire br {clear:both;} .formulaire img { width:auto; height:auto; } /* ------------ TABLE ------------------ */ table { border-collapse:collapse; } th, td { border-bottom: 1px solid #d7d7d7; padding:4px 0; text-align: left; vertical-align:text-top; } th { color:#000000; width:100px; text-indent:5px; font-weight:bold;} td { } tr:hover { cursor:default; } /********************************************************* EQUIPE **********************************************************/ .bloc-equipe { width:720px; margin:10px 0 0 0px; background:url('images/separation.gif') bottom left repeat-x;} .bloc-equipe .pic {float:left; margin-top:20px; width:170px; } .bloc-equipe .pic img {margin-left:10px; border:1px solid #DFDFDF; } /* changer marge suivant largeur vignette */* /* ROLLOVER 1ER AFFICHAGE */ .bloc-equipe .pic img { } /* changer marge suivant largeur vignette */ .bloc-equipe .descriptif { float:left;margin-top:20px; width:500px; }/* changer le float pour placement*/ .bloc-equipe p { margin:5px 10px; } /********************************************************* MENTIONS LEGALES **********************************************************/ #mentions-legales{} #mentions-legales h4{margin:8px 0;} #mentions-legales h5{margin:5px 0;} #mentions-legales p{line-height:1.4em;} /* ------------ DEBUT SITEMAP ------------------ */ #sitemap {width:900px; margin:0 auto;} #sitemap h2 a {text-decoration:none;font-size:1.2em; height:20px; text-transform:uppercase;} #sitemap p {list-style-type:none; background: url('images/icons/link.png') no-repeat left center; list-style-position:inside; } #sitemap p a { text-decoration:none; margin-left:18px; } /* ------------ FIN SITEMAP ------------------ */ /********************************************************* PIED DE PAGE **********************************************************/ /* ------------ FOOTER ------------------ */ #footer {width:100%; background: url('images/bg-footer.jpg') repeat-x center bottom; clear:both; height:295px; } #footer .footer-content {width:950px; margin:0px auto; clear:both; color:#FFF; } #footer .logo { float:left; width:350px; margin:40px 0 0 0 ; text-align:center; } #footer .logo strong {} #footer .rcs { font-size:0.8em; font-style:italic;color:#FFF; } #footer .adresse-dynamique { text-align:center; display:inline-block; line-height:1em; } #footer .adresse-dynamique span { float:left; margin-top:2px; text-align:left; color:#FFF; } #footer .adresse-dynamique span.tel { font-weight:bold; display:block;} #footer .adresse-contact { clear:both; margin:0 0px; text-align:right; } #footer .adresse-contact a { } #footer .police2 { color:#c2d15d; } #copyright { width:100%; text-align:center; color:#fff; font-size:0.9em; } #copyright a { color:#b2d4b2; } #copyright a:hover { color:#fff; text-decoration:underline; } /* ------------ FOOTER - CATEGORIES ------------------ */ #categories-r {text-align:center; width:90%; margin:0 auto; clear:both;} #categories-r, #categories-r a { text-align:center; text-decoration:none; font-size:.9em; font-weight:100; color:#80a280; line-height:1em;} #categories-r a:hover { color:#fff; } #categories-r p { margin:5px;} .bloc-categories { padding-top:40px;} /* hack clear float */ .clr { clear: both; }