/*-----------------------------------------------------------------------------
LELUXART Screen Stylesheet

version:   1.0
date:      08/05/2010
author:    Carl Servant / SÉQUENCE DIGITALE SENC
email:     info@sequencedigitale.com
website:   www.sequencedigitale.com/web/
version history: /templates/leluxart/css/
-----------------------------------------------------------------------------*


REMPLACER
http://www.leluxart.com/ 
PAR
../

LOCALE
file:///C:/SITES%20INTERNET/LELUXART.COM/SITE/version%202.0/


/* --------------------------------------------------------
    General
   -------------------------------------------------------- */

	* { font-style: normal; margin: 0; padding: 0; }
	html{ margin-left: -1px; }
		/* NON-IE */
		*+html{ margin-left: 0px; }

	body{ background: #000;	color: #000; font: 11px/20px Verdana, Tahoma, Helvetica, sans-serif; min-width: 984px; padding-bottom: 100px;	width: auto !important; width: 984px; }
	hr, .hide { display: none; }
	a{ color: #000; font-weight: bold; outline: none; }
	a:hover{ text-decoration: none; }
	
	h2{ font-size: 20px; margin-bottom: 0.2em; }
	h3{ font-size: 1em; margin-bottom: 1em; }
	
	input, select, textarea{ margin-bottom: 0.5em; }

	button{ background: #4b4022; border: 1px solid #d9ac0c; color: #f9e8ae; cursor: pointer; font-size: 0.9em; margin-right: 1em; padding: 3px; }
	button:hover{ color: #fff; border: 1px solid #fff; }

	p{ margin-bottom: 1em; }

	table{}
	tr{}
	td{ text-align: left; }

	.clearfix{ clear: both !important;	}

	.alignLeft{ text-align: left !important; }
	.alignRight{ text-align: right !important; }
	.alignCenter{ text-align: center !important; }

	.noBorder{ border: 0 !important; }


/* --------------------------------------------------------
    STRUCTURE
   -------------------------------------------------------- */

   .pageWrap{ margin: 0 auto; position: relative; width: 984px; }
	#pageContainer{ background: #FFF url(http://www.leluxart.com/images/pageContainer.jpg) repeat-y center top; height: auto !important; height: 100%; min-height: 100%; }
	#pageHeader{ background: transparent url(http://www.leluxart.com/images/pageHeader.jpg) no-repeat center top; }
	#pageHeader .pageWrap{ background: transparent url(http://www.leluxart.com/images/pageHeader.jpg) no-repeat center top !important; height: 400px; }
	#pageFooter{ background: url(../images/pageFooter.png) no-repeat center bottom; }
	#pageFooter .pageWrap{ background: url(../pageFooter.png) no-repeat center bottom; height: 105px; }
	#pageContenu{ position: relative; z-index: 33; }
	#pageContenu .pageWrap{ margin-top: -180px; padding: 35px 0 50px 0; position: relative; width: 984px; z-index: 66; }
		body.lebourget #pageContenu .pageWrap{ background: #FFF4CE url(http://www.leluxart.com/images/back_lebourget.png) repeat-x center top; }
		body.leluxart #pageContenu .pageWrap{ background: #FFF4CE url(http://www.leluxart.com/images/back_leluxart.png) repeat-x center top; }
		body.emeraude #pageContenu .pageWrap{ background: #FFF4CE url(http://www.leluxart.com/images/back_emeraude.png) repeat-x center top; }
		body.ambiance #pageContenu .pageWrap{ background: #FFF4CE url(../images/back_ambiance.png) repeat-x center top; }
		body.neutre #pageContenu .pageWrap{ background: #FFF4CE url(http://www.leluxart.com/images/back_neutre.png) repeat-x center top; }

/* --------------------------------------------------------
    Entete - les 3 Galeries
   -------------------------------------------------------- */

	#entete ul{ height: 156px; left: 4px; margin: 0; padding: 0; position: absolute; top: 19px; }
	#entete ul li{ display: inline; list-style: none; margin: 0; padding: 0; }
	#entete ul li a{ color: #521d0a; display: block; float: left; font: 16px arial; font-weight: bold; text-decoration: none; }	
	#entete ul li.lebourget a{}
	#entete ul li.leluxart a{ margin: 0 0 0 77px; }
	#entete ul li.emeraude a{ margin: 0 0 0 73px; }
	#entete ul li.ambiance a{ margin: 0 0 0 74px; }
	#entete ul li a img{ border: 0; border-bottom: 3px solid transparent; padding: 0 0 3px 0; }	
	body.lebourget #entete ul li.lebourget img{ border-bottom: 3px solid #00406d; }
	body.leluxart #entete ul li.leluxart img{ border-bottom: 3px solid #ab1d0f; }
	body.emeraude #entete ul li.emeraude img{ border-bottom: 3px solid #005a51; }
	body.ambiance #entete ul li.ambiance img{ border-bottom: 3px solid #2d2a78; }

/* --------------------------------------------------------
    Menu Principal
   -------------------------------------------------------- */

	#menuPrincipal{ float:right; left:-50%; position:relative; top: 181px; text-align:left; }
	#menuPrincipal ul{ left:50%; position:relative; }
	#menuPrincipal ul li{ background: transparent url(http://www.leluxart.com/images/menuPrincipal_spacer.gif) no-repeat right 0px; float: left; list-style: none; position:relative; }
	#menuPrincipal ul li.nousjoindre{ background: none !important; }
	#menuPrincipal ul li a{ background: none; color: #6d270d; display: block; float: left; font: 16px arial; font-weight: bold; height: 39px; margin-right: 2px; padding: 11px 17px; text-decoration: none; }
	body#accueil #menuPrincipal ul li.accueil a,
	body#galeries #menuPrincipal ul li.galeries a,
	body#artistes #menuPrincipal ul li.artistes a,
	body#nouveautes #menuPrincipal ul li.nouveautes a,
	body#cadeaux #menuPrincipal ul li.cadeaux a,
	body#deco #menuPrincipal ul li.deco a,
	body#nousjoindre #menuPrincipal ul li.nousjoindre a,
	#menuPrincipal ul li a:hover{ 
		background: url(http://www.leluxart.com/images/menuPrincipal_active.gif) repeat-x left 0px;	color: #000;
	}

/* --------------------------------------------------------
    Menu Secondaire
   -------------------------------------------------------- */

	#menuSecondaire ul{ line-height: 1em; margin-top: 2px; position: absolute; right: 2px; }
	#menuSecondaire ul li{ list-style: none; margin-left: 33px; float: left; }
	#menuSecondaire ul li a{ color: #a89e7e; font: 9px verdana; font-weight: bold; text-decoration: none; text-transform: uppercase; }
	#menuSecondaire ul li.english a{ color: #fade6f !important;}
	body#infolettre #menuSecondaire ul li.infolettre a,
	body#panier #menuSecondaire ul li.panier a,
	#menuSecondaire ul li a:hover{
		color: #FFF !important;
	}


/* --------------------------------------------------------
    Pied de page
   -------------------------------------------------------- */

	#pageFooter .pageWrap{ color: #fae8b0; font-size: 11px; }
	#pageFooter p.copyrights{ left: 17px; position: absolute; top: 11px; }
	#pageFooter p.credits{ position: absolute; right: 17px; text-align: right; top: 11px; }


/* --------------------------------------------------------
    CONTENU
   -------------------------------------------------------- */

	/* Accueil */
	body#accueil #pageContenu .pageWrap{ background: #FFF4CE url(../images/accueil_pageWrap.jpg) no-repeat; height: 445px; }
	body#accueil #pageContenu div.accueil_nepasmanquer{ left: 21px; padding: 0 35px 0 346px; position: absolute; top: 330px; width:582px; }

	/* Galeries */
	body#galeries #pageContenu .pageWrap{ background: url(../images/galeries_pageWrap.jpg) no-repeat; height: 100%; padding: 0; width: 984px; }
	body#galeries div.galeries{ color: #fef6dc; float: left; margin: 0 1px 0 0; padding: 250px 18px 50px 18px; text-align: justify; width: 209px; }
	body#galeries div.galeries h3{ text-align: center; }

	/* Liste des artistes - Cadeaux - Idees Deco - Nouveautes */
	body#artistes #pageContenu .pageWrap,
	body#cadeaux #pageContenu .pageWrap,
	body#nouveautes #pageContenu .pageWrap{
		padding: 0; width: 984px;
	}
	
	ul.index{ background: #a08f58 url(../images/ul.index.png) no-repeat; height: 53px; margin: 0; padding: 0; position: relative; }		
	ul.index li{ display: inline; list-style: none; margin: 0; padding: 0;	}
	ul.index li a{ background: url(../images/ul.index.li.a.png) no-repeat; display: block; height: 35px; padding: 17px 0 0 0; position: absolute; top: 12px; z-index: 333333; }
	ul.index li a{ color: #faedc2; font-size: 13px; font-weight: normal; line-height: 13px; text-align: center; text-decoration: none; }
	ul.index li.active a{ color: #fecd00; height: 38px; padding: 14px 0 0 0; text-decoration: none; }
	ul.index li a:hover{  color: #fff; text-decoration: underline; }
		
	ul.index li.tous a{ left: 159px; width: 165px; }				
	ul.index li.le-bourget a{ background-position: -166px 0; left: 325px; width: 128px; }	
	ul.index li.le-luxart a{ background-position: -295px 0; left: 454px; width: 120px; }
	ul.index li.emeraude a{ background-position: -416px 0; left: 575px; width: 124px; }
	ul.index li.ambiance a{ background-position: -541px 0; left: 700px; width: 123px; }	
	ul.index li.active.tous a{ background-position: 0 -51px; width: 165px; }
	ul.index li.active.le-bourget a{ background-position: -166px -51px; width: 128px; }
	ul.index li.active.le-luxart a{ background-position: -295px -51px; width: 120px; }
	ul.index li.active.emeraude a{ background-position: -416px -51px; width: 124px; }
	ul.index li.active.ambiance a{ background-position: -541px -51px; width: 123px; }
	body ul.index{ display: none; }
	body.has-script ul.index{ display: block; }

	div.galerie{ color: #fef6dc; padding: 0 0 31px 0; }	
	div.galerie.tous{ background-color: #1d1c1b;}		
	div.galerie.le-bourget{ background-color: #00416e; }		
	div.galerie.le-luxart{ background-color: #ab1d0f; }
	div.galerie.emeraude{ background-color: #005a51; }
	div.galerie.ambiance{ background-color: #232176; }	
	div.galerie h2{ background: #a08f58 url(../images/ul.index.png) no-repeat; height: 53px; margin: 0; padding: 0; position: relative; }
	div.galerie h2 a{ background: url(../images/ul.index.li.a.png) no-repeat; display: block; height: 38px; padding: 14px 0 0 0; position: absolute; top: 12px; z-index: 333333; }
	div.galerie h2 a{ color: #fecd00; font-size: 13px; font-weight: normal; left: 20px; line-height: 13px; text-align: center; text-decoration: none; }
	div.galerie.tous h2 a{ background-position: 0 -51px; width: 165px; }
	div.galerie.le-bourget h2 a{ background-position: -166px -51px; width: 128px; }
	div.galerie.le-luxart h2 a{ background-position: -295px -51px; width: 120px; }
	div.galerie.emeraude h2 a{ background-position: -416px -51px; width: 124px; }
	div.galerie.ambiance h2 a{ background-position: -541px -51px; width: 123px; }
	div.galerie ul{ padding: 31px 0px 0 20px; }
	div.galerie ul li{ display: inline; list-style: none; margin: 0; padding: 0; }
	div.galerie ul li a{ display: inline-block; margin: 0 12px; padding: 0 5px 25px 5px; vertical-align: top; width: 120px; }
	div.galerie ul li.clear-left a{ clear: left; }
	div.galerie ul li a{	color: #fef6dc; font-weight: normal; line-height: 1.2em; text-decoration: none; text-align: center; }
	div.galerie ul li a span.toile{ display: block; line-height: 94px; margin: 0 0 -8px 0; height: 94px; }
	div.galerie ul li a span.toile img{ border: 2px solid #fef6dc; display: inline-block; vertical-align: bottom; }
	div.galerie ul li a img.nouveau,
	div.galerie ul li a img.reserve{ border: 0; padding: 0 0 5px 0; }

	body.has-script div.galerie{ display: none; }
	body.has-script div.galerie.active{ display: block; }
	body div.galerie h2{ display: block; }
	body.has-script div.galerie h2{ display: none; }
	
	body#galerie div.galerie ul{ padding: 65px 15px 0 15px; }
	body#galerie div.galerie ul li a{ color: #4b4022; }

	
	
	
	
	
	
	

	/* Panier d'achats */
	body#panier h2{ color: #ebe4d9; height: 50px; }
	body#panier table{ margin: 0 auto 25px auto; width: 984px; }
	body#panier table th{ color: #ebe4d9; height: 25px; }

	/* Un Artiste - NOM */
	div.artisteNom{ left: 25px; position: absolute; top: 10px; }
	div.artisteNom h2, div.artisteNom span{ color: #fef6dc; float: left; }
	div.artisteNom h2{ font: normal 24px verdana; }
	div.artisteNom span{ font: 12px verdana; margin-left: 17px; margin-top: 1em; }

	/* Un Artiste - Liens Bio et Toutes les oeuvres */
	div.artisteLiens{ color: #fef6dc; position: absolute; top: 19px; right: 25px; }
	div.artisteLiens a{ color: #fef6dc; font: bold 11px verdana; text-decoration: none; }
	div.artisteLiens span{ margin: 0px 10px; }
	body.subToiles a.subToiles,
	body.subBiographie a.subBiographie,
	div.artisteLiens a:hover{
		color: #fed300;
	}

	/* Un Artiste -  Biographie d'un artiste */
	div.artisteBiographie{ font: 12px/17px verdana; padding: 102px 0 0 126px; text-align: justify; width: 740px; }
	img.artistePhoto{ left: 25px; position: absolute; top: 64px; }

	/*  Un Artiste - Carrousel des Toiles */
	div.artisteCaroussel{ float: left; margin-top: 59px; text-align: center; width: 264px; }
	div.artisteCarousselContainer{ height: 500px; overflow: hidden; padding: 15px 0; }
	div.artisteCaroussel ul li{ line-height: 1.2em !important; list-style: none; margin: 0 auto 25px auto; }
	div.artisteCaroussel ul li a{ color: #4b4022; font-weight: normal; line-height: 1em; text-decoration: none; }
	div.artisteCaroussel ul li a img{ border: 2px solid #FFF; margin-bottom: 0em; }
	
	div.artisteCaroussel a.boutonPrecedent, div.artisteCaroussel a.boutonSuivant{ display: block; height: 50px; margin: 0 auto; overflow: hidden; text-indent: -9999%; width: 200px; }
	div.artisteCaroussel a.boutonPrecedent{ background: url(http://www.leluxart.com/images/fleche_haut.png) no-repeat; }
	div.artisteCaroussel a.boutonPrecedent:hover{ background-position: 0 -50px; }
	div.artisteCaroussel a.boutonSuivant{	background: url(http://www.leluxart.com/images/fleche_bas.png) no-repeat; }
	div.artisteCaroussel a.boutonSuivant:hover{ background-position: 0 -50px; }

	
	div.artisteToile{ background: #fff; border: 1px solid #ddd; float: left; left: -2px; margin: 34px auto 0 auto; position: relative; text-align: center; }	
	div.artisteToile{ -moz-box-shadow: 0 0 16px rgba(0,0,0,0.75); -webkit-box-shadow: 0 0 16px rgba(0,0,0,0.75); box-shadow: 0 0 16px rgba(0,0,0,0.75); }
	div.artisteToile img{ border: 1px solid #fff; border-width: 7px 4px; display: block; }	

	div.artisteToileInfo{ color: #4b4022; float: left; margin: 95px 0 0 31px; width: 210px; }
	div.artisteToileInfo h3{ font: bold 13px/17px verdana; margin-bottom: 0; }
	div.artisteToileInfo ul li{ list-style: none; }
	div.artisteToileInfo ul li *{ color: #4b4022; font: bold 11px/15px verdana; text-decoration: none; }
	div.artisteToileInfo li a:hover{ text-decoration: underline;}

	#boutonCommander, #boutonPrix{ background: #A21B0D url(http://www.leluxart.com/images/button.png) repeat-x; border: 2px solid #D9AC0C; margin-bottom: 4px; padding: 4px 5px; }
	#boutonCommander, #boutonPrix{ color: #fef6dc; cursor: pointer; font: bold 11px verdana; }
	#boutonCommander:hover, #boutonPrix:hover{ border: 2px solid #FFFFFF; color: #FFF; }
	#boutonPrix{ margin-bottom: 15px; }
	
	/* Nous joindre et abonnement */
	body#nousjoindre #pageContenu .pageWrap{ background: url(../images/artistes_pageWrap.png) repeat-y; }
	body#infolettre #pageContenu .pageWrap{ background: url(../images/artistes_pageWrap.png) repeat-y; }
	div.adresse{ float: left; margin: 0 1px 0 0; width: 245px; }
	div.adresse{ color: #FEF6DC; text-align: center; }	
	div.adresse img{ border: 1px solid #fff; }
	div.adresse a{ color: #FEF6DC; font-weight: normal; text-decoration: none; }
	div.adresse form{ padding: 0 15px; text-align: left; }
	div.adresse form select{ width: 215px; }
	div.adresse form textarea{ width: 215px; }
