/********** STRUCTURE GENERALE **********/
* { margin: 0; padding: 0; }
HTML, BODY { height: 100%; }
BODY { font-family: Verdana, Arial, sans-serif; font-size: 10px; text-transform: uppercase; color: #9C9E9F; background: #F6F6F6; }
BODY.splash { background: #FFF; }
#global { position: relative; left: 50%; top: 50%; width: 700px; height: 550px; margin: -275px 0 0 -350px; }
BODY.splash #global { height: 300px; margin-top: -150px; }
#content { position: relative; height: 320px; padding: 10px 30px 10px 230px; background: #FFF; }
A { text-decoration: none; outline: none; }

/********** EN-TETE **********/
H1 { width: 100%; height: 70px; background: url(../pics/charte/bg-h1.png) center center no-repeat; }
H1 A { display: block; width: 100%; height: 100%; font-size: 0; text-indent: -9000px; }
BODY.splash H1 { height: 110px; margin-bottom: 40px; background-image: url(../pics/charte/bg-h1-splash.png); }
BODY.splash P { margin-bottom: 20px; padding: 0 160px; text-align: justify; }
BODY.splash A { color: #7C7F7B; }
BODY.splash A:hover { color: #050505 !important; }
#langues { overflow: hidden; margin-top: 30px; }
#langues A { display: block; float: left; width: 48%; text-align: center; }

/********** FONDS DES PAGES **********/
DIV.standalone { height: 340px; padding: 0 !important; }
DIV.standalone A { display: block; width: 100%; height: 100%; background-position: left top; background-repeat: no-repeat; }
DIV.home #content A { background: #FFF url(../pics/charte/bg-home.jpg) left top no-repeat !important; }
DIV.maison A { background: #FFF url(../pics/charte/bg-maison.jpg) left top no-repeat !important; }
DIV.edito { background: #FFF url(../pics/charte/bg-edito.jpg) left top no-repeat !important; }
DIV.philosophie { background: #FFF url(../pics/charte/bg-philosophie.jpg) left top no-repeat !important; }
DIV.domaine A { background: #FFF url(../pics/charte/bg-domaine.jpg) left top no-repeat !important; }
DIV.terroir { background: #FFF url(../pics/charte/bg-terroir.jpg) left top no-repeat !important; }
DIV.gout { background: #FFF url(../pics/charte/bg-gout.jpg) left top no-repeat !important; }
DIV.champagnes A { background: #FFF url(../pics/charte/bg-champagnes.jpg) left top no-repeat !important; }
DIV.champagnes A:hover { background-position: left bottom !important; }
DIV.presse { background: #FFF url(../pics/charte/bg-presse.jpg) left top no-repeat !important; }
DIV.credits { background: #FFF url(../pics/charte/bg-credits.jpg) left top no-repeat !important; }
DIV.pointsVente { background: #FFF url(../pics/charte/bg-pointsVente.jpg) left top no-repeat !important; }
DIV.contact { background: #FFF url(../pics/charte/bg-contact.jpg) left top no-repeat !important; }

/********** CONTENUS **********/
#content H2 { margin: 5px 0 5px 0; font-family: Arial, sans-serif; font-size: 14px; color: #333; }
#content H3 { margin-top: 8px; font-size: 10px; font-weight: normal; color: #333; }
#content P { margin-bottom: 5px; line-height: 14px; }
#content UL { margin: 5px 0 5px 25px; list-style: square; }
#content LI { margin-bottom: 1px; line-height: 14px; }
#content A { color: #C00; }
#content A:hover { text-decoration: underline; }
.illustration { position: absolute; left: 0; top: 0; }
.gold { color: #CC923E !important; }
P.signature { height: 60px; padding-top: 15px; text-align: right; background: url(../pics/charte/bg-signature.png) right bottom no-repeat; }
UL.pdf { margin: 5px 0 15px 15px !important; list-style: none !important; }
UL.pdf LI { margin-bottom: 5px !important; padding-left: 22px !important; line-height: 16px !important; background: url(../pics/charte/puce-acrobat.png) 0px 0px no-repeat; }

	/* Scrollers */
	DIV.credits DIV.controls, DIV.contact DIV.controls { margin-bottom: 10px; text-align: right; }
	DIV.champagne DIV.controls { margin-bottom: 5px; }
	DIV.controls A { margin-right: 10px; color: #7C7F7B !important; }
	DIV.controls A:hover, DIV.controls A.active { color: #050505 !important; text-decoration: none !important; }
	#infos DIV.scroller { overflow: hidden; width: 450px; }
	#infos DIV.scroll { width: 10000px; }
	#infos DIV.section { float: left; overflow: hidden; width: 450px; }

	/*Formulaires */
	INPUT, TEXTAREA { width: 200px; margin-right: 5px; font-family: Arial; font-size: 10px; color: #333; border-left: 1px solid #666; border-top: 1px solid #666; border-right: 1px solid #333; border-bottom: 1px solid #333; }
	SELECT { width: 250px; font-family: Arial; font-size: 10px; color: #333; }
	#contact SELECT { width: 300px; }
	TEXTAREA { width: 300px; height: 60px; overflow: auto; }
	LABEL { float: left; width: 110px; }
	P.nolabel { padding-left: 110px; }
	#content.contact.en LABEL { width: 90px; }
	#content.contact.en #form { width: 460px; }
	#nom, #prenom { width: 120px; }
	LABEL.nom { float: none; width: auto; }
	INPUT.btn { padding: 0 5px; background: #F6F6F6; }
	SPAN.btn { float: left; display: table-cell; height: 21px; background: url(../pics/charte/bg-btn.png) left top no-repeat; }
	SPAN.btn * { overflow: visible; width: auto; height: 21px; margin-left: 15px; padding-right: 15px; line-height: 18px; white-space: nowrap; vertical-align: middle; font-family: Arial; font-size: 10px; text-transform: uppercase; color: #FFF !important; text-decoration: none !important; border: none; background: transparent url(../pics/charte/bg-btn.png) right top no-repeat; cursor: pointer; outline: 0; }
	SPAN.btn A { display: block; float: left; margin-left: 7px; text-decoration: none; }
	*>SPAN.btn A { padding-left: 7px; }
	BUTTON::-moz-focus-inner { border: none; }
	@media screen and (-webkit-min-device-pixel-ratio:0) { SPAN.btn A { padding-top: 1px; }}
	SPAN.btn:hover { background-position: left -27px; }
	SPAN.btn:hover * { background-position: right -27px; }

	/* Philosophie */
	DIV.philosophie STRONG { font-weight: normal; color: #333; }
	DIV.philosophie LI { margin-bottom: 10px !important; }

	/* Points de vente */
	#depts { margin-bottom: 15px; }
	DIV.adresse { float: left; width: 212px; margin: 0 5px 15px 0; }
	P.nav { text-align: center; }
	P.nav A { margin: 0 10px; font-size: 14px; }
	P.nav A:hover { text-decoration: none !important; }

	/* Champagnes */
	DIV.champagne DIV.controls A:hover { text-decoration: underline !important; }
	DIV.champagne SPAN.btn { float: right; }
	SPAN.prix { float: left; color: #000; font-size: 14px; }
	#zoom { position: absolute; right: 0; bottom: 0; width: 55px; height: 20px; font-size: 10px; color: #000; text-transform: lowercase; text-align: center; cursor: pointer; }
	DIV.champagne #infos { padding-top: 10px; }
	P.links { position: absolute; bottom: 5px; width: 450px; }

/********** MENU & PIED DE PAGE **********/
MENU { float: left; width: auto; margin: 5px 0 20px 8px; list-style: none; }
*>MENU { margin: 10px 0 40px 15px; }
MENU * { color: #9C9E9F; }
#global.home MENU * { color: #050505 !important; }
MENU A { padding-right: 20px; border-bottom: 1px solid #F6F6F6; }
MENU LI { margin-bottom: 2px; }
MENU A:hover { color: #050505 !important; }
#global.home MENU A:hover { color: #9C9E9F !important; }
MENU A:active { border-bottom: 1px dotted #7C7F7B; }
MENU LI.active * { color: #050505; }

#footer { position: absolute; bottom: 30px; width: 100%; text-align: center; }
#footer P { margin-bottom: 5px; }
#footer P * { color: #050505; }
#footer A:hover { color: #7C7F7B !important; }
Q { display: block;  }
Q:before, Q:after { content: ""; }

/********** SURDEFINITIONS ET STYLES GENERIQUES **********/
IMG { border: none; }
IMG.bordure { padding: 1px; border: 2px solid #E0E6E7; }
.left { text-align: left !important; }
.right { text-align: right !important; }
.center { text-align: center !important; }
.justify { text-align: justify !important; }
.clear { clear: both !important; }
.spacer { clear: both; height: 1px; font-size: 1px; }
.l { float: left; margin: 0 20px 5px 0; }
.r { float: right; margin: 0 0 5px 20px; }