@charset "UTF-8";

#page {background: url(img/fond_page.png) 0 0 repeat-y; margin-bottom:50px;}
/**********************************/
/*					BLOC Entete						*/
/**********************************/
.accueil					#entete {height:325px; background: url(img/bandeau_accueil.jpg) 0 25px no-repeat;}
.generique				#entete,

.nouveautes				#entete,
.a_decouvrir			#entete,
.erotiques				#entete,
.etrangers				#entete,
.francais					#entete,
.policiers				#entete,
.auteures					#entete,
.jeunesse					#entete,
.nonfiction					#entete,
.qui_sommes_nous	#entete,

.panier						#entete,
.point_vente			#entete,
.contact					#entete {height:205px;}

/* Gestion de l'image de fond du bandeau */
.generique 				#entete {background: url(img/bandeau_generique.jpg) 0 25px no-repeat;}

.nouveautes				#entete {background: url(img/bandeau_nouveautes.jpg) 0 25px no-repeat}
.a_decouvrir			#entete {background: url(img/bandeau_a_decouvrir.jpg) 0 25px no-repeat}
.erotiques				#entete {background: url(img/bandeau_erotiques.jpg) 0 25px no-repeat}
.etrangers				#entete {background: url(img/bandeau_etrangers.jpg) 0 25px no-repeat}
.francais					#entete {background: url(img/bandeau_francais.jpg) 0 25px no-repeat}
.policiers				#entete {background: url(img/bandeau_policiers.jpg) 0 25px no-repeat}
.auteures					#entete {background: url(img/bandeau_auteure.jpg) 0 25px no-repeat}
.qui_sommes_nous	#entete {background: url(img/bandeau_qui_sommes_nous.jpg) 0 25px no-repeat}
.jeunesse				#entete {background: url(img/bandeau_jeunesse.jpg) 0 25px no-repeat}
.nonfiction				#entete {background: url(img/bandeau_nonfiction.jpg) 0 25px no-repeat}


.panier						#entete {background: url(img/bandeau_panier.jpg) 0 25px no-repeat;}
.point_vente			#entete {background: url(img/bandeau_point_vente.jpg) 0 25px no-repeat;}
.contact					#entete {background: url(img/bandeau_contact.jpg) 0 25px no-repeat;}

/* Gestion du bandeau Commerce */
.accueil					#commerce {position:absolute; top:305px; width:960px; height:20px;}
.generique				#commerce,

.nouveautes				#commerce,
.a_decouvrir			#commerce,
.erotiques				#commerce,
.etrangers				#commerce,
.francais					#commerce,
.policiers				#commerce,
.jeunesse				#commerce,
.nonfiction				#commerce,
.auteures					#commerce,
.qui_sommes_nous	#commerce,

.panier						#commerce,
.point_vente			#commerce,
.contact					#commerce {position:absolute; top:185px; width:960px; height:20px;}

#entete h1 {margin-left: -3000px;}
#entete #logo a {display:block; position:absolute; width:148px; height:150px; top:36px; left:10px;} 

/* Gestion du bloc Flash Info */
#titre_flash_info, #flash_info_bloc { position:absolute; top:36px; right:32px; width:150px; font-size:13px; color:#333; background:url(img/fond_flash_info.png) 0 0 repeat; }
#titre_flash_info { top:36px; padding:5px 10px; text-align:center; letter-spacing:2px; text-shadow:1px 1px 8px red; }
#flash_info_bloc 	{ top:66px; padding:10px; }

/**********************************/
/* 				BLOC Conteneur 					*/
/**********************************/
#conteneur {width:960px; min-height:250px; padding:10px 0; background: url(img/fond_conteneur.png) repeat-x;}
#conteneur h2 {font-size:30px; font-weight: normal; color:#c30; text-transform:uppercase; margin:4px 0 20px 0;}
#conteneur h4 {font-size:14px; font-weight:normal; color:#c30; text-transform:uppercase;}

#conteneur .titre {font-size:14px; color:#c30; text-transform:uppercase; margin:10px 0 0 0; }
#conteneur .nom {font-size:14px; color:#c30; margin:0 0 10px 0;}
#conteneur .texte {font-size:12px; line-height:18px; color:#333; margin:18px 0; text-align:justify;}
#conteneur .texte p {margin:18px 0;}
#conteneur .texte_full {font-size:13px; line-height:18px; color:#333; margin:18px 180px 18px 0;}
#conteneur .caracteristique {margin:0; font-size:11px; color:#333;}
#conteneur .prix {font-size:11px; color:#c30;}
#conteneur a {color:#000; text-decoration:none;}
#conteneur a:hover {text-decoration:underline;}
#conteneur a.chevron_petit {background: url(img/chevron_petit.png) 0 0 no-repeat; padding-left:15px; font-size:12px;}
#conteneur .copy {font-size:10px;}
#conteneur reserve_droite { padding-right:10px; }
#conteneur .site_auteur {margin:10px 0;}

.col_un_quart			{width:240px; float:left;}
.col_deux_quart		{width:480px; float:left;}
.col_trois_quart	{width:700px; float:right;}

div.clear {clear:both;}

/* les classes sous_box ne concernent que la col_trois_quart */
.sous_box11 {float:left; width:620px; min-height:200px; padding:15px 20px 0 20px;}
.sous_box22 {float:left; width:320px; margin:0 15px 30px 0; padding:15px 0 0 15px;}
.sous_box33 {float:left; width:200px; min-height:225px; margin-bottom:40px;}

/* COMPOSANT Navigation haut */
#nav_haut {position:absolute; top:0; width:960px; height:25px; background:url(img/arc_en_ciel.png) no-repeat #5C5C5C; text-align:right;}
#nav_haut li {display:inline; letter-spacing:1px; text-transform:uppercase;}
#nav_haut li a {color:white; font-size:11px;  border-right:solid 1px white; padding:0 10px 0 8px; text-decoration:none;}
#nav_haut li a:hover {text-decoration:underline;}
#nav_haut li.last a {border:none;}

/* COMPOSANT Navigation Commerce : identification, compte, panier */
#commerce span {color:white; text-transform:uppercase; line-height:20px;}
#commerce span a {color:white; text-decoration:none;}
#commerce span a:hover {color:#c30;}
#commerce span.nom_client {position:absolute;left:20px; font-size:11px;}
#commerce span.identifier {position:absolute; left:631px; padding-left:10px; font-size:13px; width:100px; }
#commerce span.identifier_on {position:absolute; left:631px; padding-left:10px; font-size:13px; width:100px; background:url(img/fond_mon_compte.png) repeat-x;}
#commerce span.panier {position:absolute; left:780px; font-size:13px;}

/* COMPOSANT Navigation pied */
#nav_pied {width:828px; margin-left:-8px; padding-left:150px; height:20px; background:url(img/fond_pied.png) repeat-x;}
#nav_pied li {float:left; letter-spacing:1px; text-transform:uppercase; color:#ccc; font-size:10px; line-height:12px; padding:0 10px; margin:4px 0; border-right:solid 1px white;}
#nav_pied li.last {border:none;}
#nav_pied li a {color:white; text-decoration:none;}
#nav_pied li a:hover {text-decoration:underline;}

/* COMPOSANT Navigation métier */
#nav {border-top: solid 1px #ccc;}
#nav li {font-size:18px; text-transform:uppercase; padding:2px 0 5px 20px; border-bottom: solid 1px #ccc;}
#nav li a {display:block; color:#333; text-decoration:none;}
#nav li.on a {color:#c30;}
#nav li ul li {border:none; font-size:12px; line-height:20px; padding:0;}
a.facebook {float:right; margin-top:20px;}

/* COMPOSANT Recherche */
#recherche {position:relative; margin:0 0 10px 20px; height:28px;}
#recherche input[type=text] {width:130px; margin-top:2px;}
#recherche a.submit {position:absolute; top:0; right:0; display:block; width:68px; height:28px; border:none; background:transparent url(img/bouton_recherche.png) no-repeat;}

/* COMPOSANT diaporama accueil */
#diapo_accueil {position:relative; width:670px; margin:0 25px;}
#diapo_accueil .slideshow {z-index:0;}
#diapo_accueil ul {position:absolute; top:0; right:0; width:288px; z-index:100;}
#diapo_accueil ul#navdiapos li {display:block; color:#000; text-decoration:none; width:215px; height:60px; background:url(img/transpar_accueil_actus.png) top right no-repeat; padding:0 10px 0 63px; border-bottom: solid 1px transparent;}
#diapo_accueil ul#navdiapos li.activeSlide {background:url(img/transpar_accueil_actus_hover.png) top right no-repeat; color:white;}
#diapo_accueil ul#navdiapos li.activeSlide a { color:white;}
#diapo_accueil ul#liens_actus a {display:block; color:#333; text-decoration:none; width:215px; height:50px; text-align:right; text-transform:uppercase; padding:10px 10px 0 63px; font-size:12px; font-weight:bold; }

/* COMPOSANT boite catalogue */
.grand_degrade {background:url(img/fond_degrade.png) repeat-x #fff;}
.petit_degrade {background:url(img/fond_degrade_petit.png) 0 0 repeat-x;}
.chevron {display:block; background:url(img/chevron.png) 0 0 no-repeat; padding:10px 10px 10px 30px; text-transform:uppercase; line-height:14px; font-size:12px; color:#333; text-decoration:none;}
.chevron span {font-size:11px;}
.box_info {float:right; width:170px; height:72px; margin:0px 10px 15px 20px; background:url(img/fond_degrade_petit.png) 0 0 repeat-x;}
.box_info_left {float:left; width:170px; height:72px; margin:0px 10px 15px 0px; background:url(img/fond_degrade_petit.png) 0 0 repeat-x;}


/* COMPOSANT bloc couverture livre + bouton panier */
.bloc_couv {width:118px; height:220px;}
.top {margin-top:50px;}
.right {float:right; margin-left:20px;}
.left {float:left; margin-left:20px; margin-right:20px;}
img.couv {margin-left:4px; -moz-box-shadow:1px 1px 6px #888; -webkit-box-shadow:1px 1px 6px #888; box-shadow:1px 1px 6px #888; margin-bottom:6px;}

/********************************************/
/* 				COMPOSANT Classeur à onglet 			*/
/********************************************/
.classeur {position:relative; width:660px; margin:-20px 25px 0 0;}
.classeur h3 {position:absolute; top:4px; height:30px; line-height:30px; font-weight:normal; text-transform:uppercase; font-size:13px; text-align:center;} 
.classeur h3.on {color:#c30; background-color:#E1DADA;}
.classeur h3.fiche:hover {color:#c30; cursor:pointer;}
.classeur h3.off {color:#999; cursor:none;}
.classeur h3.off:hover {color:#999;}
.classeur h4 {font-size:14px; font-weight:normal; color:#c30; text-transform:uppercase;}
.classeur .box {display:none; margin-top:35px; text-align:justify;}
.classeur .sous_box22 {width:285px; margin:0 0 30px 0; padding-right:15px;}
.classeur .on {display:block;}
.classeur p {font-size:12px;}
.classeur .img_box {float:left; margin:35px 20px 0 20px; padding-top:20px; width:118px;}

.border_right{border-right:solid 1px #D5D1D1; margin-right:15px;}
.border_left{border-left:solid 1px #D5D1D1; padding-left:15px;}

/* Classeur livre */
#livre {background:url(img/onglets_livre.png) no-repeat;}
#livre .box {width:480px; padding-top:10px;}
#livre h3.information {width:110px; left:16px;}
#livre h3.resume {width:67px; left:136px;}
#livre h3.extrait {width:77px; left:215px;}
#livre h3.auteur {width:69px; left:304px;}
#livre h3.critiques {width:83px; left:385px;}
#livre h3.commentaires {width:115px; left:478px;}

/* Classeur auteur */
#auteur {background:url(img/onglets_auteur.png) no-repeat;}
#auteur .box {width:640px; padding:50px 0 20px 10px;}
#auteur h3.bio {width:95px; left:16px;}
#auteur h3.livres {width:60px; left:123px;}
#auteur h3.interviews {width:93px; left:194px;}
#auteur .photo {float:left; margin:0 20px 20px 20px;}
#conteneur #auteur .texte {font-size:12px; line-height:18px; color:#333; margin:0;}

/**********************************/
/* 				Gestion commande 				*/
/**********************************/

/* COMPOSANT boite catalogue */
#etapesDeCommande ul {width:660px; height:14px; background-color:#CAC4C4; padding:8px 0 8px 20px;}
#etapesDeCommande li {float:left; line-height:14px; font-size:12px; text-transform:uppercase; border-right: solid 1px #333; padding:0 15px 0 10px;}
#etapesDeCommande li span {font-size:16px; padding-right:5px;}
#etapesDeCommande li.last {border:none;}
#etapesDeCommande li.on {color:#c30;}
#etapesDeCommande li.off {color:#9F9999;}

/* COMPOSANT boutique :  Mon Compte et Commande */
.generique .boutique {width:680px; min-height:200px; background:url(img/fond_degrade.png) repeat-x #fff; margin-bottom:30px;}
.generique .boutique h4 {font-size:14px; font-weight:normal; color:#c30; text-transform:uppercase; text-align:left;}
.generique .boutique p {font-size:12px; margin:5px 0;}

.panier .boutique {width:680px; min-height:200px; background:url(img/fond_degrade.png) repeat-x #fff; margin-bottom:30px;}
.panier .boutique h4 {font-size:14px; font-weight:normal; color:#c30; text-transform:uppercase; text-align:left;}
.panier .boutique p {font-size:12px; margin:5px 0;}

.boutique .sous_box22 {width:310px; margin:0 0 30px 0; padding-right:10px;}
.boutique table {table-layout:fixed; width:679px; font-size:12px; margin-left:1px;}
.boutique table thead {text-transform:uppercase; font-size:11px; color:#666;}
.boutique table tbody {border-top:none;}
.boutique table tfoot {font-size:14px; font-weight:bolder; color:#666;}
.boutique table th {height:30px; }
.boutique table th.quantite {width:80px;}
.boutique table th.total {width:80px;}
.boutique table th.vider {width:70px;}
.boutique table th.grand_total {text-align:right; padding-right:10px;} 
.boutique table th.article{text-transform:uppercase;}
.boutique table td {border: solid 1px #ccc; padding-left:10px;} 
.boutique table th {border: solid 1px #ccc; border-top:none; padding-left:10px;}

/****************************/
/*				FORMULAIRE		 		*/
/****************************/

fieldset.standard {width:300px;}
.coord {font-size:12px; margin:5px 0;}
.coord label {display:block; line-height:18px;}
.coord input[type=text],
.coord input[type=password] {width:200px;}
.coord input[type=checkbox] {margin-left:50px;}
.coord textarea {width:200px;}
.bouton {width:148px; height:28px; line-height:28px; padding-right:15px; margin:10px 0 0 0; border:none; background:url(img/bouton_generique.png) no-repeat; text-align:right; font-size:12px; text-decoration:none; }
#conteneur .bouton a {display:block; color:#fff; padding-right:10px;}
#conteneur .bouton input[type="submit"] {width:148px; height:28px; line-height:28px; border:none; background:url(img/bouton_generique.png) no-repeat; text-align:right; font-size:12px; text-decoration:none; color:#fff; padding-right:15px;}
button {border:none; background-color:transparent; color:#fff; font-size:12px; width:148px; text-align:right; cursor:pointer;}

/* FORMULAIRE contact		*/
.contact fieldset {width:300px;}
.contact .coord textarea {width:300px; margin-left:0;}

/* FORMULAIRE dans processus de commande*/
.generique #conteneur .boutique .bouton {width:148px;}
.generique #conteneur .boutique .bouton a {color:#fff; padding-right:10px;}
.generique .boutique .ancien_email {background-color:#CAC4C4; padding:3px 8px; width:170px; margin:5px 0;}