@charset "utf-8";

html { font-size: 100%; /* Évite un bug d'IE 6-7 */ } 
ul,ol,body { margin: 0; padding: 0 } 
a:active { outline: none; } /* Pas de bordure pointillée ou halo lors du clic sur un lien */ 
form  { margin: 0; padding: 0; border: none; } /* Formulaires */ 
input, button, select { vertical-align: middle; }

/* corps */
/*body { font-family: Arial, Trebuchet, sans-serif; background: #FFF url(/img/fond-noel.jpg) no-repeat 50% 0;  */
body { font-family: Arial, Trebuchet, sans-serif; background: #590D0D url(/img/fond.jpg) no-repeat 50% 0;
	color: #707172; font-size: 100%; height: 100%;}

/* div {border: 1px solid blue; }  */

/* éléments */
img { border: 0; }
abbr { border-bottom: 1px dotted #000000; cursor: help; }
.clear { clear: both; visibility: hidden; }

/* liens  */
a { text-decoration: none; color: #7a251b; }
a:hover { text-decoration: none; color: #9F5B01; }

/* paragraphes */
h1 { color: #7a251b; font-size: 130%; font-weight: bold; padding: 5px 0 12px 34px; background: url(/img/grappe-titre.png) no-repeat; margin-top: 2px;}
h2 { color: #7B241B; font-size: 100%; font-weight: bold; margin-top: 0px; padding: 8px 0 5px 5px; }
h3 { background: #C4A97A; font-size: 90%; font-weight: bold; color: #fff; padding: 3px; }

/* entête */
#blacktop { width: 949px; background: #000; margin: 0 auto; height: 8px; } /* trait noir */
#conteneurhaut,#conteneurmilieu { width: 941px; margin: 0 auto; border: 4px solid #fff; border-bottom: 0; position: relative; background: #fff url(/img/fond-conteneur.png); overflow: hidden; }
#conteneurhaut { background: #5B100F; }
#conteneurmilieu { border-top: 0; }

/* logo et cadres */
#header { width: 941px; height: 49px; background: url(/img/degrade_haut.png) }
#logo { position: absolute; left: 10px; top: 20px; z-index: 10; }

#header .cadre { background: #dcf42e; color: #3d0706; width: 160px; height: 32px; 
	text-align: center; font-size: 90%; margin-top: 17px; margin-right: 4px; line-height: 32px;  }
#header .cadre a { color: #3d0706; }
#header .cadre a:hover { color: #c1ad79; }

#header #paniertop { float: right; }
#header #login { float: right; }
#header #login span.loginname { white-space: nowrap; font-size: 80% }

/* menu horizontal */
#menu { padding-top: 5px; background: #FFF; float: left; width: 100%}
#menu ul { width: 100%; height: 40px; background: #FFF; list-style-type: none; font-weight: bold; line-height: 28px; font-size: 90%; padding-left: 10px}
#menu ul li { float: left; width: 117px; height: 28px; background: #ccb656; color: #3d0706; margin-right: 10px; text-align: center; margin-left: 5px; }
#menu ul li a:hover { display: block; width: 117px; height: 36px; background: #fff url(/img/menu-over.png) no-repeat; color: #fff; }
#menu ul li a:active { outline: none; } 
#menu ul li:hover a { display: block; width: 117px; height: 36px; background: #fff url(/img/menu-over.png) no-repeat; color: #fff; }
#menu ul #selected { display: block; width: 117px; height: 36px; background: #fff url(/img/menu-over.png) no-repeat; color: #fff; }
#menu ul #selected a { color: #fff; }

/* cadre affichage newsletter*/
#cadre-newsletter { text-align: center; margin: auto; font-size: 0.8em; color: #9c3b1c; font-weight: bold; }
#cadre-newsletter a { color: #fff; font-size: 130% }
#cadre-newsletter form { margin: 0; padding: 0}


/* menus verticaux */
#menurubrique { list-style-type: none; font-size: 90%; padding-top: 10px; }
#menurubrique li a { display: block; height: 22px; color: #FFF; line-height: 22px; 
	text-transform: uppercase; font-weight: bold; text-align: right; padding-right: 20px; }
#menurubrique a:hover { display: block; background: #590d0d url(/img/over-grappe.png); }
#menurubrique #menuselected { display: block; background: #590d0d url(/img/over-grappe.png); }

/* sous menu vertical appellation */
#menussrubrique { list-style-type: none; font-size: 80%; padding-bottom: 20px; }
#menussrubrique li a { display: block; height: 16px; color: #000; line-height: 22px; font-weight: bold; text-align: right; background: none; }
#menussrubrique li:hover a { background:none; color: #FFF; }
#menussrubrique li a:hover { color: #FFF; } /* ie6 */
#menussrubrique #ssmenuselected { color: #FFF; }

/* colonnes latérales */
#colgauche { float: left; width: 200px; background: #ccb656; background: url(/img/fond-menugauche.png); }
#coldroite { float: right; width: 172px; background: #d1bd67; }

/* liste de recherche */
#recherches { width: 162px; background: #5b100f; color: #fff; text-align: center; font-weight: bold; padding: 5px}
#recherches select { color: #555; font-size: 70%; width: 150px; margin-bottom: 4px; }

/* nouveautés et coup de coeur */
#nouveaute .titre { color: #FFF; font-weight: bold; background: #590D0D; text-align: center; line-height: 20px; }
#coupdecoeur .titre { color: #590D0D; font-weight: bold; background: #d8ed2f; text-align: center; line-height: 20px; }

#cave { background: #d8ed2f url(/img/fond-or2.png); }
#cave .titre { text-align: center; line-height: 20px; font-size: 120%; background: #590D0D}
#cave .titre a { color: #FFF; font-weight: bold; }
#cave .contenu { text-align: center; height: 70px; line-height: 23px; }
#cave .contenu a { color: #590D0D; font-weight: bold; }
#cave .contenu a:hover { color: #FFF; }

.encadre { border: 1px solid #333; text-align: left; margin: auto; margin-top: 20px; background: #FFFFFF; width: 90%; overflow: hidden; font-size: 90% }
#coupdecoeur .contenu,#nouveaute .contenu { padding: 5px; margin-bottom: 5px;}
.encadre .appell { color: #333; font-weight: bold; font-size: 100%; }
.encadre .producteur{ color: #333; font-size: 80%; }
.encadre .annee { color: #b3382d; font-weight: bold; font-size: 80%; }
.encadre .cuvee { color: #666; font-style: italic; font-size: 80% }
.encadre .prix { display: block; float: right; width: 90%; text-align: right; color: #b3382d; font-weight: bold; font-size: 100%; padding-right: 10px; }

/* encadré actualités */
#cadreactu { width: 90%; border: 1px solid black; text-align: center; margin: auto; margin-top: 20px; background: #FFF; font-size: 90%}
#cadreactu .titre { color: #FFF; font-weight: bold; background: #590D0D; text-align: center; line-height: 20px; }
#cadreactu a { font-size: 85%; text-decoration: none; color: #7B241B; }
#cadreactu a:hover { text-decoration: none; }

/* boite déroulante news */
#blocDeroulant { overflow: hidden; position: relative; height: 75px; text-align: left; padding-left: 8px; padding-right: 8px; }
#Scroll { position: relative; top: 0; left: 0; }

/* photos */
.album { float: left; width: 140px; margin-right: 20px; margin-top: 15px; text-align: center; font-size: 85% }
.titre_album { font-weight: bold; margin-bottom: 10px; font-size: 110%; text-transform: uppercase}
.photo { float: left; width: 125px; margin-left: 20px; margin-right: 20px; margin-bottom: 25px; text-align: center; font-size: 70%; }
.photoP { float: left; width: 105px; margin-left: 20px; margin-right: 20px; margin-bottom: 25px; text-align: center; font-size: 70%; }

/* zone texte */
#contenu { background: #FFF; border: 2px solid #eae4c1; margin: 45px 187px 30px 210px; margin-top: 0; padding: 10px; font-size: 90%; 
	text-align: justify; width: 520px !important; width: 514px; }

.liste { margin-top: 5px; list-style-type: none; text-align: justify; }
.liste li { margin-left: 30px; border-left: 1px solid #eae4c1; padding-left: 5px; margin-bottom: 5px; margin-top: 10px; }

/* éléments footer */
#footer { background: #FFF; margin-left: 215px; margin-right: 172px; clear: both; text-align: center; color: #3d0706;  }
#footer a { color: #3d0706; font-size: 70%; }

#footer ul { list-style: none; width: 520px; }
#footer li { float: left; }

/*#copyright { width: 949px; background: #590D0D; text-align: center; margin: auto; clear: both; margin-top: 5px; color: #eae4c1; font-size: 70%}*/
#copyright { width: 500px; background: #FFF; text-align: center; margin: auto; clear: both; margin-top: 5px; color: #eae4c1; font-size: 70%; }

/* photos */
.album { float: left; width: 140px; margin-right: 20px; margin-top: 15px; text-align: center; font-size: 75% }
.titre_album { font-weight: bold; margin-bottom: 10px; font-size: 110%; text-transform: uppercase; }
.legende { font-size: 85%; padding-bottom: 10px; font-weight: normal; color: #333; font-style: italic;}

/* tableau produits */
#vins { border-collapse: collapse; width: 100%; }
#vins form { padding: 0; margin: 0; }
#vins tr { border-bottom: 1px dotted #ccc;  }
#vins td.rubrique { vertical-align: middle; font-weight: bold; color: #3D0706; background: #EAE4C1; line-height: 20px; height: 20px; text-align: center;  }
#vins td.appell { vertical-align: middle; font-weight: bold; color: #3D0706; line-height: 30px; height: 30px; padding-top: 10px;}
#vins td { vertical-align: top; height: 35px; padding-top: 5px;}
#vins tr.odd { background: #EEE; }
#vins tr.even { background: #FFF; }
#vins td.millesime { color: #333; font-size: 80%; font-weight: bold; }
#vins td span.detail { color: #777; font-size: 80%; }
#vins td span.stock { color: #ff8040; font-size: 80%; text-align: right; }
#vins td.prix { color: #5B100F; white-space: nowrap; text-align: right; }
#vins td span.format { color: #999; font-size: 70%; }
#vins td.panier { text-align: right; padding-right: 3px; }
#vins td.panier select { font-family: Arial, sans-serif; font-size: 70%; }
#vins td.panier span.maxi { font-size: 80%; color: #BE1C1C }
#vins td.panier .contenupanier { font-size: 80%; color: #790E11 }
span.prix_barre { text-decoration: line-through; font-size: 85%; color: #333}

span.points { display: block: padding-right: 16px; font-size: 80%; color: #BE1C1C; }

.promo { background: #D1BD67; color: #fff; font-size: 80%; }

/* éléments */
.centre { text-align: center; }
.combopays { font-family: Arial, sans-serif; font-size: 90%; }
#panier .qte { float: right; }
#panier .prix { float: right; color: #9F5B01; width: 80px; text-align: right; }
.offert { background: #FF6600; text-transform: uppercase; font-size: 80%; padding: 2px; letter-spacing: 1px; color: #fff; }
.erreur { border: 1px solid #FF0000; color: #FFF; padding: 5px; background: #BE1C1C; width: 70%; margin: auto; text-align: center}

/* lignes de formulaire */
#contenu .entete { width: 150px; color: #111; float: left;}
#contenu .ligne { border-bottom: 1px solid #CCC; padding: 3px; margin-left: 30px; width: 450px; }
#contenu .valeur { color: #222; font-size: 100%; }

/* lignes de formulaire */

#vin { }
#vin .ligne { border-bottom: 1px solid #E1E1E1; padding: 3px; margin-left: 120px; width: 385px; color: #333; }
#vin .ligne:hover { background: #eee}
#vin .entete { width: 150px; color: #666; float: left; font-size: 92%}
#vin select { font-family: Arial, sans-serif; font-size: 80%; }

#panier .detail { color: #777; font-size: 80% }

.dernieres { font-size: 85%; color: #FF0000; font-weight: bold; }

.msgOK { padding: 5px; border: 1px dotted green; width: 400px; font-weight: bold; margin: auto; text-align: center; color: green; }
.msgNO { padding: 5px; border: 1px dotted red; width: 400px; font-weight: bold; margin: auto; text-align: center; color: red; }

/* boutons et forms */
input, button, select { vertical-align: middle; font-family: Arial, Helvetica, sans-serif; }
.form  { font-size: 85%; background : #FFF url(/icones/input_bg.png) left top repeat-x; border: 1px solid #bbb;  }
.formc { font-size: 85%; background : #FFF url(/icones/input_bg.png) left top repeat-x; border: 1px solid #bbb; text-align: center; }
.bouton	{ color: #FFF; font-size: 85%; background-color: #7B241B; }
.grandbouton	{ color: #FFF; font-size: 105%; background: #7B241B; }
.bouton:hover,.grandbouton:hover { background: #d1bd67; color: #333; }
/* présentation champs form */

input, textarea { border: 1px solid #AAA; }
input:hover,textarea:hover { background: #FAFAFA; } /* survol */
input:focus, textarea:focus { border: 1px solid #590D0D; background: #FAFAFA; } /* focus */
html* input { border: 1px solid #7F9DB9; } /* hack couleur simple pour IE6-7 */
input.noborder,div.noborder { border: 0; background: none}

/* backoffice */
#admin { background: #FFF; font-size: 12px; color: #333}
#admin a { font-size: 11px; }
#admin td { font-size: 11px; }
#admin .form  { font-size: 11px; background : #FFF url(/icones/input_bg.png) left top repeat-x; border: 1px solid #bbb; margin-bottom: 2px; }
#admin .formc { font-size: 11px; background : #FFF url(/icones/input_bg.png) left top repeat-x; border: 1px solid #bbb; text-align: center; margin-bottom: 2px; }
#admin .bouton	{ color: #FFF; font-size: 90%; background-color: #7B241B; }
span.disabled { color: #CCC; }
.colonneadmin { background-color: #C4A97A; color: #000; height: 25px; }
td.admin { color: #333; }
div.result { padding: 5px; border: 1px dotted #CCC; width: 600px; font-weight: bold; margin: auto;}
.box {	font-size: 14px; font-family: Arial, sans-serif; border: 1px solid #ddd; visibility: hidden; float: left; padding: 5px; width: 0px; height: 0px; margin: 5px; background: #F3EECC; z-index: 1; margin-left: 60px;}
.masque { vertical-align: middle; -moz-opacity:0.3; filter:alpha(opacity=30); -khtml-opacity: 0.3; opacity: 0.3; }
.fondrouge { background: #F9BD3B; color: #000; padding: 5px; }
.fondvert  { background: #7EC65F; color: #FFF; padding: 5px; }
#admin .titre { font-size: 14px; font-weight: bold; letter-spacing: 2px; color: #00004C; }