/* Modèle v1.24 24/02/2009 */ /********** A GARDER EN L'ÉTAT ************/ *{margin:0; padding:0;} ul {margin-bottom:10px;} li{margin-left: 25px;} a img{border:0} html {font-size: 100%;} .clear{clear:both;} .centre{text-align:center;} .img_gauche {float:left; display:inline; margin:0 5px 5px 0;} .img_droite {float:right; display:inline; margin:0 0 5px 5px;} /*********** A PERSONNALISER **************/ body {font: normal 11px Tahoma; color:#695d3c; background-color:white;} #body{background:#550401;} table{font-size: 11px;} a{color: #695d3c; text-decoration:none;} a:hover {text-decoration:underline;} h1{font: bold 14px Tahoma; margin-bottom:10px;} h2{background: url(images/fond/bgH2.jpg) no-repeat top left; font: bold 12px Tahoma; margin-bottom:7px; width:576px; line-height:29px; padding-left:20px;} h2.formulaire{background: url(images/fond/bgH2_form.jpg) no-repeat top left; font: bold 12px Tahoma; margin-bottom:7px; width:360px; line-height:29px; padding-left:20px;} h2.formulaire2{background: url(images/fond/bgH2_form2.jpg) no-repeat top left; font: bold 12px Tahoma; margin-bottom:7px; width:760px; line-height:29px; padding-left:20px;} h3{font: bold 11px Tahoma; margin-bottom:11px; color:#c6160e;} h4{background: url(images/fond/bgH4.jpg) no-repeat top left; font:bold 12px Tahoma; color:#695d3b; margin-bottom:2px; height:21px; text-transform:uppercase; text-align:center; padding-top:8px;} p {margin-bottom:10px; text-align: justify;} strong{font-weight: bold;} em{font-style: italic;} .color {color:#f10000;} .hr{font-size:1px; height:10px; border-bottom:1px solid #f10000; margin:0 0 10px;} .asterisque{font-style:italic; font-size:9px;} .pageSuivante{text-align:center;} /*class communes aux bloc produit et promo*/ .noMarge{margin:0px;} .photoProduit{float:left; display:inline; margin-right:12px;} .boutons_achat {bottom:13px; left:158px; margin-top:14px; position:absolute;} .acheter a{color:white;} .voir{color:#fff; background: url(images/voir.jpg) no-repeat top left; width:39px; height:21px; padding-top:2px; font: bold 11px Tahoma; margin-right:3px; float:left; display:inline; text-align:center;} .acheter{color:#fff; background: url(images/acheter.jpg) no-repeat top left; width:65px; height:19px; padding-top:2px; font: bold 11px Tahoma; float:left; display:inline; text-align:center;} .ref{text-transform:uppercase; font-weight:bold;} .prix{font: bold 14px Verdana; margin-bottom:7px; text-align:right;} /*class promo*/ .description{color:#918870; font-weight:bold;} /* Formulaires */ .bouton2{ display:block; color:#fff; background: url(images/commander.jpg); font:bold 11px 'Trebuchet MS'; line-height:20px; width:130px; height:21px; border-width:0; padding-bottom:3px; text-align:center; cursor:pointer; } .bouton{ display:block; color:#fff; background: url(images/continuer.jpg); font:bold 11px 'Trebuchet MS'; line-height:20px; width:130px; height:21px; border-width:0; padding-bottom:3px; text-align:center; cursor:pointer; } input{margin-bottom:0px !important; margin-bottom:-2px !important!; margin-bottom:-2px;} input, select, textarea{font: normal 10px 'Trebuchet MS'; color:#000; border:1px solid #d3c6a5;} input[type="checkbox"], input[type="radio"]{border-width: 0;} .row{clear:both; margin-bottom:5px;} .row label{display:inline; float: left; margin-right: 5px; width: 80px; text-align: right;} .row label span{color:#f00;} .row textarea, .row input {width: 80px;} .row select {width: 152px;} .row_chk{padding:0; clear:both; margin-bottom:5px;} .row_chk input{border:0} .row_chk label{float:none; display:inline; margin:0; padding:0; cursor:pointer;} .row_are{clear:both; margin-bottom:5px;} .row_are label{display:block;} .row_are textarea{width:300px;} .row_rad {clear:both; margin-bottom:5px;} .row_rad .label{float:left; width:145px; text-align:right;} .row_rad .rad {margin-left:150px; margin-bottom:1px;} .row_rad .rad input{vertical-align:middle; border:0} .row_rad .rad label{float:none; display:inline; margin:0; padding:0; cursor:pointer;} .row_bt {clear:both; margin-bottom:5px auto;} #contain{margin:0 auto; width:858px; background: url(images/fond/bgContain.gif) repeat-y top left;} #conteneur{width:822px; margin:0 auto; background-color:#fcf2d8;} /******************************************/ /****************** ENTETE **************/ /******************************************/ #haut{background: url(images/fond/bgHaut.jpg) repeat-x top left; height:69px;} #haut img#distribution{margin-right:136px; float:left; display:inline;} #haut ul#menuTop{list-style-type:none; color:#695d3c; margin-bottom:0px; font:normal 10px verdana; text-transform:uppercase; padding-top:9px; padding-bottom:20px;} #haut ul#menuTop li{float:left; display:inline; padding-right:9px; padding-left:9px;border-right:solid 1px #695d3c; margin-left:0px;} #haut ul#menuTop li a{float:left; display:inline;} #haut ul#menuTop li a.active{text-decoration:underline;} #haut img#imgPanier{margin-left:75px; margin-right:9px; float:left; display:inline;} #haut p#panier{margin-top:10px;} #bandeau{padding:22px 20px 17px 15px; background-color:#ffffff; height:168px;} #bandeau #logo {width:287px; float:left;} #bandeau #photoBandeauChiens {width:481px; height:45px; float:left; background: url(images/bandeau/bandeauChien.jpg) no-repeat top left; padding-top:123px; padding-left:19px; } #bandeau #photoBandeauChats {width:481px; height:45px; float:left; background: url(images/bandeau/bandeauChat.jpg) no-repeat top left; padding-top:123px; padding-left:19px; } /***** menu****/ ul#menu a{text-decoration:none;} ul#menu{padding-left:6px; height:48px; background: url(images/fond/bgMenu.jpg) repeat-x top left; margin-bottom:0px;} ul#menu li{margin-left:1px; margin-right:1px; float:left; display:inline; background: url(images/fond/bgBtnMenu.jpg) no-repeat top left; } ul#menu li a#chiens{float:left; display:inline; background: url(images/menu/chiens_or.gif) no-repeat top left; width:132px; height:40px;} ul#menu li a#chiens:hover , ul#menu li a#chiens.active{float:left; display:inline; background: url(images/menu/chiens_or.gif) no-repeat bottom left; width:132px; height:40px;} ul#menu li a#chats{float:left; display:inline; background: url(images/menu/chats_vert.gif) no-repeat top left; width:132px; height:40px;} ul#menu li a#chats:hover , ul#menu li a#chats.active{float:left; display:inline; background: url(images/menu/chats_vert.gif) no-repeat bottom left; width:132px; height:40px;} ul#menu li a#promotions{float:left; display:inline; background: url(images/menu/promotions_or.gif) no-repeat top left; width:132px; height:40px;} ul#menu li a#promotions:hover , ul#menu li a#promotions.active{float:left; display:inline; background: url(images/menu/promotions_or.gif) no-repeat bottom left; width:132px; height:40px;} ul#menu li a#professionnels{float:left; display:inline; background: url(images/menu/pro_or.gif) no-repeat top left; width:132px; height:40px;} ul#menu li a#professionnels:hover , ul#menu li a#professionnels.active{float:left; display:inline; background: url(images/menu/pro_or.gif) no-repeat bottom left; width:132px; height:40px;} ul#menu li a#qsn{float:left; display:inline; background: url(images/menu/qsn_or.gif) no-repeat top left; width:132px; height:40px;} ul#menu li a#qsn:hover , ul#menu li a#qsn.active{float:left; display:inline; background: url(images/menu/qsn_or.gif) no-repeat bottom left; width:132px; height:40px;} ul#menu li a#revendeurs{float:left; display:inline; background: url(images/menu/revendeurs.gif) no-repeat top left; width:132px; height:40px;} ul#menu li a#revendeurs:hover , ul#menu li a#revendeurs.active{float:left; display:inline; background: url(images/menu/revendeurs.gif) no-repeat bottom left; width:132px; height:40px;} #categ li .active{font-weight:bold} /* Contenus */ /*bloc produit*/ #conteneur2 #contenu .blocProduit{background: url(images/fond/bgBlocProduit.gif) no-repeat top left; float:left; display:inline; width:269px; height:161px; overflow:hidden; margin-right:10px; margin-bottom:15px; padding:10px 10px 3px 14px; position:relative} #conteneur2 #contenu .blocProduitPromo{background: url(images/fond/bgBlocProduitPromo.gif) no-repeat top left; float:left; display:inline; width:269px; height:161px; overflow:hidden; margin-right:10px; margin-bottom:15px; padding:10px 10px 3px 14px; position:relative} #conteneur2 #contenu .blocProduit .prix{margin-bottom:2px;} #conteneur2 #contenu .blocProduit .ref{margin-bottom:3px;} .dernier{margin-bottom:15px;} .quantite{ width:45px; font: normal 10px Tahoma; text-align:left; float:left; display:inline; margin-bottom:0px;} .prixBarre{width:45px; color:#800000; font: normal 10px Verdana; float:left; text-decoration:line-through;} .prixBarreVide{width:45px; float:left; } .prixDroite{width:30px; font: normal 10px Verdana; text-align:right; float:left; margin-bottom:6px;} .rubanPromo{position:absolute; top:0px; right:0px; z-index:1;} .afficher_prix {width:269px; height:32px; text-align:center; padding-top:20px; width:100px; float:right} .afficher_prix a {font-weight:bold; color:#729905;; font-size:10px} .afficher_prix_promo {width:269px; height:32px; text-align:center; padding-top:11px; width:100px; float:right} .afficher_prix_promo a {font-weight:bold; color:#729905;; font-size:10px} /*bloc promo*/ #conteneur2 #contenu .blocPromo{z-index:0; background: url(images/fond/bgBlocProduit.gif) no-repeat top left; float:left; display:inline; width:269px; height:161px; overflow:hidden; margin-right:10px; margin-bottom:15px; position:relative; padding:10px 10px 3px 14px; } #conteneur2 #contenu .blocPromo .ref{margin-bottom:3px;} #conteneur2 #contenu .blocPromo .description{margin-bottom:22px;} #conteneur2 #contenu .blocPromo p.vrac{margin-bottom:15px;} /*fiche*/ #conteneur2 #contenu .blocFiche{background: url(images/fond/bgFiche.gif) repeat-y top left; width:596px; margin-bottom:15px; margin-top:20px; position:relative} #conteneur2 #contenu .blocFiche .photoFiche{background:white url(images/photo/chicken.jpg) no-repeat top center; float:left; display:inline; margin-right:16px; margin-bottom:25px; margin-left:13px;} #conteneur2 #contenu #blocTexte .blocFiche .ref{margin-bottom:3px;} #conteneur2 #contenu #blocTexte{width:332px; float:left; display:inline;} #conteneur2 #contenu #blocTexte #blocPrix{width:123px;} #conteneur2 #contenu #blocTexte .acheter{float:right; display:inline;clear:both;} .MoteurNavigation {text-align:center; margin:0 0 15px 0} .MoteurNavigationPageActuelle {font-weight:bold} #erreur {text-align:center; font-weight:bold; margin-top:130px;} /*#conteneur2 #contenu .blocFiche p.descriptionLongue{width:332px; float:left; display:inline;}*/ /******************************************/ /************** HOMEPAGE ****************/ /******************************************/ #conteneur2{background: url(images/fond/bgConteneur2.jpg) repeat-x top left; padding-left:19px; padding-top:25px;} #colG{width:177px; float:left; display:inline; margin-right:14px;} #colG .boite_gauche{ margin-bottom:15px; background: url(images/fond/bgCateg.gif) repeat-y top left; width:177px;} #colG ul#listeCateg{list-style-image:url(images/puceCateg.jpg); font-size:12px; margin:8px 0} #colG ul#listeCateg li{margin-bottom:6px;} #contenu{float:left; display:inline; width:612px} #espace_client p {text-align:left; padding-left:10px} #espace_client ul{list-style-image:url(images/puceCateg.jpg); font-size:12px; margin:8px 0} #espace_client ul li{margin-bottom:6px;} #espace_client ul li a {font-size:11px; font-weight:bold} .deco {float:right; padding-right:5px; font-size:10px} /******************************************/ /* LOGIN */ /******************************************/ #form_nouveau {width:380px; margin:15px 0; float:left; margin-right:20px} #form_nouveau .row_rad {} #form_nouveau .row {} #form_nouveau .row label {width:140px} #form_nouveau .row input {width:140px} #form_nouveau .asterisque {text-align:center; margin:10px 0} #form_nouveau .row_bt {margin-left:110px} #form_acces {width:380px; margin:15px 0; float:right} #form_acces .row_rad {} #form_acces .row {} #form_acces .row label {width:140px} #form_acces .row input {width:140px} #form_acces .asterisque {text-align:center; margin:10px 0} #form_acces .row_bt {margin-left:110px} #form_oubli {width:380px; margin:15px 0; float:right} #form_oubli p {text-align:center} #form_oubli .row_rad {} #form_oubli .row {} #form_oubli .row label {width:140px} #form_oubli .row input {width:140px} #form_oubli .asterisque {text-align:center; margin:10px 0} #form_oubli .row_bt {margin-left:110px} .login {background:url(images/bgPanierBas.gif); width:380px} #NF_FORM {width:800px} #NF_FORM .row label {width:140px} #NF_FORM .row input {width:150px} #NF_FORM .row textarea {width:150px} #NF_FORM .row_chk {margin:10px 0 0 55px} #adresse1 .boite_moitie {background:url(images/bgPanierBas.gif); width:380px} #adresse1 .boite_moitie label {width:140px} #adresse1 .boite_moitie input {width:150px} #adresse1 .boite_moitie .row_chk {text-align:center} #adresse1 .boite_moitie .row_chk input {width:20px} #adresse2 .boite_moitie {background:url(images/bgPanierBas.gif); width:380px} #adresse2 .boite_moitie label {width:140px} #adresse2 .boite_moitie input {width:150px} #boite_total {background:url(images/bgPanierBas.gif); width:380px; margin-bottom:20px; } #boutons_commande .row_chk {text-align:center} #profil_gauche {width:380px; float:left; margin-right:20px} #profil_droite {width:380px; float:right; margin-right:20px} #profil_bouton {width:380px; float:right; margin-right:20px; text-align:center} #profil_bouton .asterisque{text-align:center; margin-top:20px} #profil_bouton .bouton {display:inline} /******************************************/ /* PANIER */ /******************************************/ #panier_haut {float:left; width:800px; margin-bottom:30px} #panier_haut .Moteur {width:100%} #panier_bas_gauche {float:left; width:380px; margin-right:20px} #panier_bas_droite {float:left; width:380px; margin-right:20px} #panier_bas_gauche label {width:140px} #panier_bas_droite label {width:140px} .retour_achat {background:url(images/continuer.jpg) no-repeat top left; color:#fff; width:130px; height:21px; border:none; padding-top:2px; font: normal 10px Tahoma; margin-right:3px; text-align:center; cursor:pointer; display:block; float:left} .commander {background:url(images/commander.jpg) no-repeat top left; color:#fff; width:130px; height:21px; border:none; padding-top:2px; font: normal 10px Tahoma; margin-right:3px; text-align:center; cursor:pointer; display:block; float:left} #boutons_panier {text-align:center; margin:30px 260px} #panier_haut #panier_articles {background:url(images/bgArticles.gif); width:780px;} #panier_haut #panier_articles table {width:760px; margin:0 10px} #panier_haut #panier_articles table thead th {height:25px; padding-bottom:10px} #panier_haut #panier_articles table tbody tr td {height:35px; border-top:1px solid #d4c7a6} #panier_haut #panier_articles select {width:110px} #panier_haut #panier_articles th.article {text-align:center; padding-right:10px} #panier_haut #panier_articles td.article {text-align:left; padding-right:10px} #panier_haut #panier_articles td.article img {margin-right:10px} #panier_haut #panier_articles th.package {text-align:center; padding-right:10px} #panier_haut #panier_articles td.package {text-align:center; padding-right:10px} #panier_haut #panier_articles th.prixttc {text-align:right; padding-right:10px} #panier_haut #panier_articles td.prixttc {text-align:right; padding-right:10px} #panier_haut #panier_articles td.prixttc .reduction {color:#8ab408; font-weight:bold} #panier_haut #panier_articles th.qte {text-align:center; padding-right:10px} #panier_haut #panier_articles td.qte {text-align:center; padding-right:10px} #panier_haut #panier_articles th.total {text-align:right; padding-right:10px} #panier_haut #panier_articles td.total {text-align:right; padding-right:10px} #panier_haut #panier_articles th.suppr {text-align:center} #panier_haut #panier_articles td.suppr {text-align:center} .panier_bas {background:url(images/bgPanierBas.gif); width:380px;} .Moteur {width:360px; margin:0 10px} .MoteurLigne th{height:20px; text-align:right;} .MoteurLigneDernier th{border-top:1px solid #d4c7a6; height:21px; text-align:right; } .MoteurLigneDernier td{border-top:1px solid #d4c7a6; height:21px; text-align:right; width:110px; font-weight:bold} /******************************************/ /* COMMANDE */ /******************************************/ #adresse1 {float:left; width:380px; margin-right:20px} #adresse2 {float:left; width:380px; margin-right:20px} /*NF_FORM_COMMANDE .boite_moitie {background:url(images/bgPanierBas.gif); width:380px}*/ #boite_articles {background:url(images/bgArticles.gif); width:780px;} #boite_articles table {width:760px; margin:0 10px} #boite_articles table thead th {height:25px; padding-bottom:10px} #boite_articles table tbody tr td {height:35px; border-top:1px solid #d4c7a6} #boite_articles select {width:110px} #boite_articles th.article {text-align:center; padding-right:10px} #boite_articles td.article {text-align:left; padding-right:10px} #boite_articles td.article img {margin-right:10px} #boite_articles th.package {text-align:center; padding-right:10px} #boite_articles td.package {text-align:center; padding-right:10px} #boite_articles th.prixttc {text-align:right; padding-right:10px} #boite_articles td.prixttc {text-align:right; padding-right:10px} #boite_articles td.prixttc .reduction {color:#8ab408; font-weight:bold} #boite_articles th.qte {text-align:center; padding-right:10px} #boite_articles td.qte {text-align:center; padding-right:10px} #boite_articles th.total {text-align:right; padding-right:10px} #boite_articles td.total {text-align:right; padding-right:10px} #boite_articles th.suppr {text-align:center} #boite_articles td.suppr {text-align:center} #total {float:left; width:380px; margin-right:20px} #boutons_commande {float:left; width:380px; margin:30px 20px 0 0;} #boutons_commande .bouton {height:18px; float:left; margin:20px 25px} #boutons_commande .bouton {height:18px; float:left; margin:20px 25px} #boutons_commande .bouton2 {height:18px; float:left; margin:20px 25px} #boutons_commande .bouton2 {height:18px; float:left; margin:20px 25px} #boite_total .Moteur {width:360px} #total_panier td {text-align:right; padding-right:40px; width:80px} /******************************************/ /* SUIVI DE COMMANDE */ /******************************************/ .MoteurContour {width:780px; background:#ff0000} .MoteurContour {background:url(images/bgArticles.gif); width:780px;} .MoteurContour table {width:760px; margin:0 10px} .MoteurContour table thead th {height:25px; padding-bottom:10px} .MoteurContour table tbody tr td {height:35px; border-top:1px solid #d4c7a6} #boite_articles select {width:110px} .MoteurContour th.article {text-align:center; padding-right:10px} .MoteurContour td.article {text-align:left; padding-right:10px} .MoteurContour td.article img {margin-right:10px} .MoteurContour th.package {text-align:center; padding-right:10px} .MoteurContour td.package {text-align:center; padding-right:10px} .MoteurContour th.prixttc {text-align:right; padding-right:10px} .MoteurContour td.prixttc {text-align:right; padding-right:10px} .MoteurContour td.prixttc .reduction {color:#8ab408; font-weight:bold} .MoteurContour th.qte {text-align:center; padding-right:10px} .MoteurContour td.qte {text-align:center; padding-right:10px} .MoteurContour th.total {text-align:right; padding-right:10px} .MoteurContour td.total {text-align:right; padding-right:10px} .MoteurContour th.suppr {text-align:center} .MoteurContour td.suppr {text-align:center} #total {float:left; width:380px; margin-right:20px} #boutons_commande {float:left; width:380px; margin:30px 20px 0 0;} #boutons_commande .bouton {height:18px; float:left; margin:20px 25px} #boutons_commande .bouton {height:18px; float:left; margin:20px 25px} #boutons_commande .bouton2 {height:18px; float:left; margin:20px 25px} #boutons_commande .bouton2 {height:18px; float:left; margin:20px 25px} p.suiviLibelle{padding-top:5px;} /******************************************/ /************** CGV *****************/ /******************************************/ h2.cgv {background:url(images/fond/bgH2CGV.jpg); font: bold 12px Tahoma; margin-bottom:7px; width:510px; line-height:29px; padding-left:20px;} #cgv {width:530px; background-color:#fcf2d8; margin:0px auto; min-height:480px; padding:10px} #spaw_cgv {background:url(images/bgCGV.gif); padding:10px; width:510px; min-height:360px} /******************************************/ /************** cb ******************/ /******************************************/ #div_cb{} #div_cb .row{width:300px;} #div_cb .row label{float:left;display:inline;width:150px;} #div_cb .row span{float:left;display:inline;} #div_cb p{float:left;display:inline; display:block; height:100px} .type_paiement {background: url(images/fond/bgBlocProduit.gif) no-repeat top left; width:253px;height:191px; margin:20px; padding:20px; float:left} /******************************************/ /**************** PIEDPAGE **************/ /******************************************/ #piedpage{height:39px; padding-top:11px; background: url(images/fond/bgPiedPage.jpg) repeat-x top left; padding-left:24px;} #piedpage ul#menuBas{list-style-type:none; margin-bottom:0px; float:left; display:inline; margin-right:370px;} #piedpage ul#menuBas li{float:left; display:inline; padding-right:9px; padding-left:9px;border-right:solid 1px #695d3c; margin-left:0px;} #piedpage ul#menuBas li a{float:left; display:inline;} /******************************************/ /* REVENDEURS / CONTACTS */ /******************************************/ #revendeur {background:url(images/fond/bgFiche.gif) repeat-y top left; padding-left:6px; margin-bottom:0px; height:400px;} #revendeur form {padding-left:80px} #revendeur form #boutons_panier{margin-left:90px; margin-right:0} #revendeur .row label{ width: 150px; } #revendeur .row textarea,#revendeur .row input {width: 200px;} #contacts {text-align:center; background:url(images/fond/bgFiche.gif) repeat-y top left; padding:0 10px 1px; margin-bottom:0px; font-size:14px; line-height:25px} /******************************************/ /* PAGES STATIQUES */ /******************************************/ #qui{float:left; display:inline; width:596px} /******************************************/ /* MAILS */ /******************************************/ #mail p label {width:250px; text-align:right; float:left; margin:10px 0} #mail p span {width:250px; float:left; margin:10px 0; display:block} .liste_prix {width:200px} .liste_prix .quantite {text-align:left; width:50px} .liste_prix .prixBarre {text-align:right; width:75px} .liste_prix .prixDroite {text-align:right; width:75px}