@charset "iso-8859-1";
@import "slimbox.css";
/****************************************************************************/
/*                            CSS GENERIQUES                                */
/****************************************************************************/
* {	
	margin:0;
	padding:0;
}

body {
	font-family:Tahoma;
	font-size:12px;
	line-height:16px;
	color:#797b7b;
	background:#b7b9b9;
}

ul, li {
	padding:0;
	margin:0;
	list-style:none;
}

p {
	padding:0 0 10px;
	margin:0;
}

img {
	border:none;
}

a {
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}


/***** Classes communes *****/
.clear { 
	height:0; 
	width:1px; 
	clear:both; 
	line-height:0; 
	*display:inline;
}


div.bouton {
	background-color:#fff;
	height:20px;
	padding:1px;
	float:right;
	margin:0;
	width:auto;
	border:1px solid #b7b9b9;
}
div.bouton a {
	color:#fff;
	text-transform:uppercase;
	font-size:10px;
	padding:0 10px 0 20px;
	line-height:20px;
	float:left;
	margin:0;
	width:auto;
	height:100%;
	background:#860202 url(../images/pictos/picto-bouton.gif) no-repeat 8px 7px;
}
div.bouton a:hover {
	background:#4a4a4a url(../images/pictos/picto-bouton-hover.gif) no-repeat 8px 7px;
	text-decoration:none;
}


div.legende {
	background-color:#860202;
	height:30px;
	padding:0 0 0 10px;
	position:absolute;
	right:5px;
	top:5px;
	float:left;
}
div.legende span {
	color:#fff;
	text-transform:uppercase;
	font-size:11px;
	letter-spacing:1px;
	display:block;
	line-height:30px;
	padding:0;
	height:100%;
	width:130px;
	text-align:left;
}

div.legende span a {color:#fff; text-decoration:none;}



/***** Les titres *****/
h1, h2, h3 {
	margin:0;
	padding:0;
}
h1 { 
	font-family:Tahoma;
	font-size:14px;
	letter-spacing:1px;
	text-transform:uppercase;
	font-weight:bold;
	color:#860202;
	padding-bottom:10px;
}
h2 {
	font-weight:bold;
	text-transform:uppercase;
	font-size:12px;
	color:#860202;
	padding-bottom:5px;
}

h1 a, h2 a { text-decoration:none; color:#860202;}

h3 {
	font-weight:bold;
	text-transform:uppercase;
	font-size:11px;
	padding-bottom:5px;
}

h3 a { text-decoration:none; color:#797b7b;}


/****************************************************************************/
/*                               CSS PAGES                                  */
/****************************************************************************/

/***** OMBRES *****/
.ombres {
	background: url(../images/bg-ombre.jpg) no-repeat center 0;
	width:938px;
	margin:0 auto;
	padding:0 31px;
}
/***** PAGE *****/
#page.home {
	width:938px;
	background:url(../images/bg-page-home.jpg) repeat-y 0 0;
}
#page {
	width:938px;
	background:url(../images/bg-page.jpg) repeat-y 0 0;
}


/***** COLONNE DE GAUCHE *****/
#page.home #col_gauche {
	float:left;
	width:410px;
}

#col_gauche {
	width:310px;
	float:left;
}

/**** Navigation ****/
#navigation {
	width:250px;
	margin:0 auto;
}
#navigation .border {
	background:#e6e6e6;
	width:250px;
	height:11px;
	font-size:1px;
	line-height:1px;
	margin:0;
	padding:0;
}
#navigation ul {
	background-color:#860202;
	padding:10px 20px;
	margin:8px 0;
	font-size:11px;
	width:210px;
}
#navigation ul li {
	border-bottom:1px dotted #9f5e5e;
	line-height:30px;
	width:210px;
	float:left;
}
#navigation ul li.last {
	border:none!important;
}
#navigation ul li a {
	color:#fff;
	text-transform:uppercase;
	background:url(../images/pictos/picto-navigation.gif) no-repeat 5px center;
	padding-left:20px;
	letter-spacing:1px;
	display:block;
	float:left;
	width:190px;
}
#navigation ul li a:hover {
	background-color:#4a4a4a;
	text-decoration:none;
}
#navigation li ul,
#page.home #navigation li ul
 {
	padding:0 20px;
	float:left;
	width:170px;
}
#navigation li ul li,
#page.home #navigation li ul li
 {
	border:none;
	padding:0 0 3px 0;
	margin:0;
	line-height:normal;
	background:url(../images/pictos/picto-li.gif) no-repeat 0 center;
	padding-left:10px;
	color:#fff;
	width:160px;
}
#navigation li ul li a,
#page.home #navigation li ul li a
 {
	background:none;
	text-transform:none;
	padding:0;
	margin:0;
	float:left;
	width:160px;
	text-transform:uppercase;
	font-size:10px;
}
#navigation li.on a{
	background-color:#4a4a4a;
	text-decoration:none;
	border-bottom:1px dotted #9f5e5e;
}
#navigation li.on ul li a,
#page.home #navigation li.on ul li a
 {
	background:none;
	border:none;
}
#navigation li.on ul li a:hover,
#page.home #navigation li.on ul li a:hover
 {
	text-decoration:none;
	color:#ffd201;	
	background:none;
}

#navigation li ul li.on,
#page.home #navigation li ul li.on
 {
	background:url(../images/pictos/picto-li-on.gif) no-repeat 0 center;
}
#navigation li ul li.on a,
#page.home #navigation li ul li.on a
{
	color:#ffd201;	
}

/*** Modification largeur de la Home ***/
#page.home #navigation {
	width:295px;
	margin:0 auto;
}
#page.home #navigation .border {
	background:#e6e6e6;
	width:295px;
	height:11px;
	margin:0;
	padding:0;
}
#page.home #navigation ul {
	width:255px;
}
#page.home #navigation ul li {
	border-bottom:1px dotted #9f5e5e;
	line-height:30px;
	width:auto;
	float:left;
	width:255px;
}
#page.home #navigation ul li a {
	width:235px;
}


/**** Bloc Actualités ****/
#page.home .bloc-actu {
	width:295px;
	margin:15px auto;
}

/**** Coordonnées ****/
#page .coordonnees {
	width:250px;
	margin:10px auto;
	color:#000;
}
#page .coordonnees h2 {
	padding-bottom:5px;
}
#page .coordonnees p {
	font-size:12px;
	line-height:16px;
}
#page .coordonnees p strong {
	font-size:11px;
}
#page .coordonnees .adresse {
	margin:20px 0;
	background:url(../images/pictos/picto-adresse.gif) no-repeat 0 5px;
	padding-left:15px;
}

#page .adresse_ligne {
	color:#000000;
	margin:1px 15px;
	padding:0;
}


/***** COLONNE DE DROITE *****/
#page.home #col_droite {
	float:left;
	width:528px;
}

#col_droite {
	float:left;
	width:628px;
}

/**** Image déco ****/
#page.home #col_droite .deco {
	position:relative;
	width:528px;
	height:235px;
}

#col_droite .deco {
	position:relative;
	width:628px;
	height:235px;
}

/**** Les actualités ****/
#col_droite .actualites {
	padding:15px 20px 10px 20px;
	background:url(../images/content-bg.jpg) no-repeat 0 0;
	width:488px;
	clear:both;
}
#col_droite .actualites p.date {
	font-weight:bold;
	font-size:11px;
	color:#ffc602;
	padding:0 0 5px 0;
}

#col_droite .actualites h3 { font-size:18px;}

#col_droite .date_actu {color:#860202; margin:0; padding:0; font-size:11px; }

/**** Nos produits ****/
#col_droite .produits {
	margin:10px 20px;
}
#col_droite .produits li {
	float:left;
	margin-right:7px;
	position:relative;
}
#col_droite .produits li.last {
	margin:0;
}

#col_droite .produits li img {padding:0 0 7px 6px; background:url(../images/fond_image_home.jpg) bottom left no-repeat;}



/**** Contenu de la page ****/
#col_droite .content {
	background:url(../images/content-bg-2.jpg) no-repeat 0 0;
}

#col_droite .content h3 { font-size:18px; line-height:normal;}

/*** Fil d'ariane ***/
#fil-ariane {
	float:left;
	margin:5px 5px 5px 15px;
	*margin:5px 5px 5px 7px;
	color:#860202;
}
#fil-ariane li {
	display:inline;
	padding:0 2px;
	font-size:11px;
}
#fil-ariane li.accueil {
	background:url(../images/pictos/picto-home.gif) no-repeat 0 center;	
	padding-left:15px;
}
#fil-ariane li a {
	color:#797b7b;
	text-decoration:underline;
}
#fil-ariane li a:hover {
	text-decoration:none;
}

/*** Date ***/
#col_droite .content .date {
	float:right;
	margin:5px 15px 5px 5px;
	*margin:5px 7px 5px 5px;
}
#col_droite .content .date p {
	font-size:11px;
}

/*** Listing des produits ***/
#col_droite #produit {
	margin:0 15px;
	width:598px;
}
#col_droite .listing-produits .ligne {
	width:auto;
	margin:10px 0;
	background:url(../images/border-ligne.gif) repeat-x 0 bottom;
	float:left;
	padding-bottom:15px;
}
#col_droite .listing-produits .ligne.last {
	background:none;
}
#col_droite .listing-produits .ligne li {
	float:left;
	width:277px;
	position:relative;
	margin-right:40px;
}
#col_droite .listing-produits .ligne li img {
	padding-bottom:10px;
	padding-left:5px;
	background:url(../images/fond_image_produit.jpg) top left no-repeat;
}
#col_droite .listing-produits .ligne li.last {
	margin:0;
}


/*** Détails du produit ***/
#col_droite .details-produits .desc {
	position:relative;
	width:580px;
	height:291px;
	top:0;
	left:0;
	

}
#col_droite .details-produits .desc .opacity {
	background:url(../images/opacity-bg.png) repeat 0 0!important;
	*background:none;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/opacity-bg.png", sizingMethod="scale"); 
	bottom:6px;
	left:4px;
	height:50px;
	position:absolute;
	padding:10px 15px;
	width:544px;
	overflow:hidden;
}
#col_droite .details-produits .desc .opacity h3,
#col_droite .details-produits .desc .opacity p {
	color:#fff;
}
#col_droite .details-produits .desc .opacity p {
	padding:0;
	
}
#col_droite .details-produits .desc .opacity p span span span {color:#FFFFFF; font-size:12px;}

#col_droite .details-produits .desc img {padding:0 0 6px 4px; background:url(../images/fond_first_image.jpg) bottom left no-repeat;}


#col_droite .details-produits .vignettes,
#col_droite .details-produits ul {
	margin:10px 0;
}
#col_droite .details-produits ul li {
	display:inline;
	padding-right:10px;
	position:relative;
}

#col_droite .details-produits ul li{
	border-bottom:1px dotted #dbdcdc;
	padding:5px 0;
	font-size:11px;
}
#col_droite .details-produits ul li strong {
	color:#860202;
	
}

#col_droite .details-produits .vignettes ul li span {
	display:block;
	line-height:13px;
	height:20px;
	font-size:10px;
	position:absolute;
	bottom:-20px;
	left:0;
}

#col_droite .details-produits .vignettes ul { margin-bottom:35px;}



/***** FOOTER *****/
#footer {
	background-color:#d9dbdb;
	padding:10px 0;
	text-align:center;
	margin:10px 0 0;
}
#footer ul {
	clear:both;
}
#footer li {
	color:#797b7b;
	display:inline;
	font-size:11px;
	padding:2px;
}
#footer li a {
	color:#797b7b;
	text-decoration:underline;
}
#footer li a:hover {
	text-decoration:none;
}
#footer li img {
	vertical-align:middle;
}


/* Champs de Formulaires
-------------------------------------------------------- */
input,textarea{margin : 1px;}
input.noborder {border:0;}
input.recherche {width:50px;}
input.button {	border:0px solid #2c220e;}
input.small_button {
	border:0px solid #2c220e;
	background-color:#2c220e;
	color:#ccc;
	font-size:9px;	
}

select {margin : 2px;}
form {padding:0;margin:0;}
textarea{
	width: 96%;
	font-size: 1em;
	padding:5px;
}

#titreForm, #piedForm {	/*** Mise en forme du titre et du pied de formulaire ***/
	font: bold 1.1em arial, hevetica, sans-serif;
	color: black;
	margin: 0;
	padding: .5em;
}

#piedForm {
	text-align: center; /*** Les boutons sont alignes a droite ***/
}

#piedForm input {
	font-weight: bold; /*** Pour ameliorer la lisibilite des boutons ***/
	padding: 0.1em 0.1em;

}

#corpForm {	/*** Mise en forme du corp du formulaire (bordure, couleur du fond...) ***/

	margin: 0;
	padding: 1em;
}

#corpForm .text-input {
	width: 200px;
	padding:2px 5px;
	border: 1px solid #B5B8C8;
	font-size: 12px;
	
	background: #FFF url('../images/text-bg.gif') repeat-x;
	
}

#corpForm fieldset {	/*** Mise en forme des cadres ***/
	margin: 0;
	font-style: normal;
	padding: 5px;
	border: 1px solid #867d78;
	
}
#corpForm legend {	/*** Mise en forme des titres des cadres ***/
	font-weight: bold;
	color: #867d78;
	background: transparent;
}
#corpForm p {	/*** Mise en forme des lignes du formulaire ***/
	padding: .2em 0;
	margin: 0 0 .2em 0;

}
#corpForm fieldset.coordonnees2 label {	/*** Mise en forme des intitules de champs ***/
	float: left;	/*** Tres important, ne pas suprimer ! ***/
	width: 40%;	/*** Les intitules prennent 1/3 de la largeur totale du formulaire... ***/
	text-align: right;	/*** ... et ils sont alignes a droite... ***/
	margin: 0;
	padding: 0 .5em 0 0;
	line-height: 1.8;	/*** ... et centres verticalement. ***/
}

#corpForm fieldset.interets p{	/*** Mise en forme des intitules de champs ***/
	
	/*** Les intitules prennent 1/3 de la largeur totale du formulaire... ***/
	text-align: left;	/*** ... et ils sont alignes a droite... ***/
	margin-left:40%;
	padding: 0 .5em 0 5px;
	line-height: 1.8;	/*** ... et centres verticalement. ***/
}

#corpForm fieldset.quizz p {
	padding:10px;
}

#corpForm fieldset.quizz input {border:0}


#corpForm label:hover, #piedForm input {
	cursor: pointer;	/*** Petite astuce pour apprendre aux utilisateurs a cliquer sur les intitules ***/
}
#corpForm label.oblig {
	font-weight: bold;	/*** Mise en evidence des champs obligatoires ***/
}
#corpForm .legende {	/*** Mise en forme des aides contextuelles ***/
	font-style: italic;
	color: #666;
	background: transparent;
	margin: 0;
	padding: 0;
	font-size:10px;
}
#corpForm a.aide {	/*** Mise en forme des bulles d'aide ***/
	text-decoration: none;
}
#corpForm a.aide img {	/*** Mise en forme de l'image des bulles d'aide ***/
	margin: 0;
	padding: 0;
	border: 0;
}

a.aide:hover {	/*** Le curseur de la souris change d'aspect quand il passe au-dessus d'une bulle d'aide ***/
	cursor: help;
}

/* bouton ok */
.submit {
     border:none;
     color:#fff;
     width:36px;
     height:20px;
	 font-weight:bold;
	 font-size:10px;
	 padding:0 ;
	 margin:0;
}

.galerie_photo_gauche
{
	margin: 0 ;
	padding: 0px 0px ;
	list-style-type: none ;
	text-align:center;
	float:left;
}

.galerie_photo_gauche ul {margin:0;padding:0;list-style-type: none ;}
.galerie_photo_gauche li
{
	margin:0;padding:0;
	margin: 0px 2px 2px 2px;
	padding: 0px ;
	text-align:center;
	font-size:10px;
	color:#fff;
	font-family:Arial, Helvetica, sans-serif;
}

.galerie_photo_gauche  img 
{
	margin: 1px 5px 3px 0px;
	padding:0px;
}

.galerie_photo_gauche a, .galerie_photo_gauche a:visited, .galerie_photo_gauche a:hover {
	text-decoration:none;
	color:#f7941d;
}

.galerie_photo_gauche span {
		background-color:#860202;
		font-weight:bold;
		line-height:15px;
		padding: 1px 3px;
		display:block;
		margin-right:5px;

}


.separation {margin:10px 0; background:url(../images/border-ligne.gif) repeat-x;}



/**** Pagination ****/
.pagination {
	padding:10px 0;
}
.pagination ul {
	float:right;
}
.pagination li {
	display:inline;
	padding:1px 2px;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
}
.pagination li a {
	color:#103e69;
	background:#4a4a4a;
	text-align:center;
	padding:2px 5px;
	text-decoration:none;
}
.pagination li a:hover,
.pagination li.on a {
	background:#860202;
	color:#fff;
	font-weight:bold;
}

.pagination li.suite a {
	background:none;
	width:auto;
	padding:0;
} 
.pagination li.suite a img {
	padding:0;
	border:none;
	margin-right:0;
	vertical-align:text-bottom;
}

.logo {position:relative;}
#choix_langue {
	position:absolute;
	top:5px;
	right:25px;
	width:100px;
	text-align:right;
	height:18px;
}