@charset "UTF-8";
*
	{
	margin: 			0; /* il est conseillé de mettre à zéro la marge et le remplissage de l'élément body, pour tenir compte des différentes valeurs par défaut des navigateurs */
	padding: 			0;
	}
body
	{
	background: 		transparent url(../images/template/images/comics-bottom.jpg) bottom repeat-x;
	font: 				100% Tahoma, Verdana, Arial, Helvetica, sans-serif;
	background-color:	#faf7f0;
	text-align: 		center; /* ce paramétrage centre le conteneur dans les navigateurs IE 5.x. Le texte est ensuite aligné à gauche (valeur par défaut) dans le sélecteur #container */
	color: 				#313d45;
	width:				100%;
    }
#body
	{
	position:			relative;
	background: 		transparent url(../images/template/images/frise.jpg) right top repeat-y;
	padding:			0 0 120px;
    }

img
	{
	border: 			none;
	}

a
	{
	color:				#b40606;
	text-decoration:	none;
	}
	a:hover
		{
		text-decoration:	underline;
		}
hr
	 {
	 display:block;
	 height: 1px;
	 margin: 0;
	 _margin: -7px 0;
	 padding: 0;
	 color: #5a5a5a;
	 background-color: #5a5a5a;
	 border: 0;
	 }

em
	{
	font-size:			0.9em;
	}
sup
	{
	font-size:			0.6em;
	}
strike
	{
		background: url(/images/strike-through.gif) repeat-x center left;
		padding:0pt 5px;
		text-decoration:none;
	}
   

    .twoColHybLtHdr #container
		{ 
		position:			relative;
    	width: 				1025px; 
    	background: 		#FFFFFF url(../images/template/images/menu_repeat-y.png) repeat-y left;
    	margin: 			0 auto; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
    	text-align: 		left; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
		} 

    .twoColHybLtHdr #header
		{ 
    	background: 		#FFFFFF url(../images/template/images/header_repeat-x.png) repeat-x top;
		height: 			135px; 
    	padding: 			0;
		} 

    .twoColHybLtHdr #header h1
		{
    	margin: 			0; /* la mise à zéro de la marge du dernier élément du div #header permet d'éviter une disparition de la marge (espace inexplicable entre les éléments div). Si l'élément div est entouré d'une bordure, cette précaution n'est pas nécessaire, car la bordure évite également la disparition de la marge */
    	padding: 			10px 0; /* l'utilisation de remplissage, au lieu d'une marge, permet d'éloigner l'élément des bords de l'élément div */
    	}

    .twoColHybLtHdr #header_menu
		{ 
		width:				200px;
    	padding-bottom: 	10px;
		text-align:			right;
		vertical-align:		top;
    	} 

    

    /* Styles pour sidebar1 : */

    .twoColHybLtHdr #sidebar1
		{
    	position: 			absolute; 
		left:				0;
		top:				225px;
    	width: 				165px; /* cet élément est flottant, il faut donc lui attribuer une largeur */
    	padding: 			0;
		background:			#faf7f0 url(../images/template/images/menu_repeat-y.png) left repeat-y;
		font-size: 			0.85em;
		font-weight: 		bold;
    	}
    	
    

    /* Styles pour mainContent :

    Dans le commentaire conditionnel pour Internet Explorer ci-dessous, la propriété zoom permet de donner à l'élément mainContent l'attribut "hasLayout." Cela évite l'apparition de plusieurs bogues spécifiques d'Internet Explorer.

    */

    .twoColHybLtHdr #mainContent 
		{ 
    	margin-left: 		180px;
		padding:			20px;
		min-height:			600px;
		_height:				600px;
		} 

    .twoColHybLtHdr #footer 
		{ 
    	padding: 			0 10px; /* ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent au-dessus. */
    	background:			#FAF7F0;
		clear:				both;
    	} 
		.twoColHybLtHdr #footer p 
			{
			margin: 			0; /* la mise à zéro de la marge du premier élément du pied de page permet d'éviter une possible disparition de la marge (espace entre les éléments div) */
			padding: 			5px 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en évitant le risque de disparition de la marge */
			text-align:			center;
			font-size:			0.8em;
			}
		.twoColHybLtHdr #footer img 
			{
			vertical-align:		bottom;
			}
		.twoColHybLtHdr #footer em.tiny 
			{
			height:				15px;
			font-size:			0.6em;
			}

    

    /* Diverses classes à réutiliser */

	table.outlined
		{
		width: 				100%;
		}
		table.outlined td
			{
			border:				#990000 2px solid;
			background-color:	#FAF7F0;
			border:				1px solid #AAAAAA;
			padding:			6px;
			}
		table.outlined table
			{
			width: 				100%;
			}
		table.outlined table td
			{
			border:				none;
			padding:			0;
			font-size: 			0.9em;
			}
		table.outlined table th
			{
			background-color: 	#F4F2ED;
			padding: 			2px;
			font-size: 			1.1em;
			}
		table.outlined table input,
		table.outlined table textarea
			{
			border: 			1px #999 solid;
			}

    .fltrt
		{ /* cette classe permet de rendre flottant le côté droit d'un élément dans la page. L'élément flottant doit précéder l'élément à côté duquel il doit se trouver dans la page. */
    	float: 				right;
    	margin-left: 		8px;
		}

    .fltlft
		{ /* cette classe permet de rendre flottant le côté gauche d'un élément dans la page */
    	float: 				left;
    	margin-right: 		8px;
		}

    .clearfloat
		{ 
    	clear:				both;
        height:				0;
        font-size: 			1px;
        line-height:		0px;
    	}
    .clearright
		{ 
    	clear:				right;
        height:				0;
        font-size: 			1px;
        line-height:		0px;
    	}
    .clearleft
		{ 
    	clear:				left;
        height:				0;
        font-size: 			1px;
        line-height:		0px;
    	}
    hr.clearfloat,
    hr.clearright,
    hr.clearleft
		{ 
    	visibility:		hidden;
		height:			0px;
		border:			0px;
		margin:			0;
		padding:		0;
    	}

	.warn
		{
		background-color: 	#ffc90f;
		background-image:	url(../images/warn_end.jpg);
		background-position: right;
		background-repeat:	no-repeat;
		margin: 			0;
		text-align: 		left;
		color:				#9e0103;
		font-weight: 		bold;
		font-size:			0.9em;
		line-height:		1em;
		}
		.warn h4
			{
			font-weight: 		normal;
			}
		.warn fieldset
			{
			border: #A43F3F 1px solid;
			margin: 5px;
			padding: 5px;
			}
			.warn fieldset li
				{
				list-style: none;
				font-weight: normal;
				}
			.warn fieldset input
				{
				margin-right: 10px;
				}

	.title
		{
		background-color:	#EFECE5;
		opacity:			0.66;
		border:				#A10D0D 2px solid;
		margin-top:			15px;
		margin-bottom:		5px;
		padding:			10px;
		color:				#2A2A2A;
		font-size:			1.2em;
		text-align:			center;
		}

	.bigR
		{
		background-color: 	#D4AFAF;
		border: 			#CC0000 1px solid;
		}
	.bigG
		{
		background-color: 	#B7E6AC;
		border: 			#105B00 2px solid;
		}
	.bigO
		{
		background-color: 	#D4D4AF;
		border: 			#CCCC00 1px solid;
		}
	.bigR,
	.bigG,
	.bigO
		{
		width: 				172px;
		padding: 			2px;
		margin:				15px 0;
		text-align: 		center;
		font-size: 			1.1em;
		font-weight: 		bold;
		}

	.cadre_rouge
		{
		background: 		#d62322 url(../images/template/images/cadre_rouge_bkg.png) top left repeat-x;
		position:			relative;
		width:				99.5%;
		border:				#990000 2px solid;
		font-size:			0.80em;
		margin:				15px 0;
		}
		.cadre_rouge .cadre_rouge_content
			{
			position:			relative;
			top:				0;
			right:				0;
			_height:				200px;
			min-height:			200px;
			padding:			10px;
			}
			.cadre_rouge .cadre_rouge_content a,
			.cadre_rouge .cadre_rouge_content h2
				{
				margin:				0;
				color:				#fff390;
				}
			.cadre_rouge .cadre_rouge_content p
				{
				padding:			0 5px;
				letter-spacing:		0.05em;
				color:				#ffffff;
				}
			.cadre_rouge .cadre_rouge_content img
				{
				margin-bottom:		25px;
				border:				#9b0404 3px solid;
				}
			.cadre_rouge .cadre_rouge_content a
				{
				}
			.cadre_rouge .cadre_rouge_prix
				{
				display:			block;
				position:			absolute;
				width:				200px;
				height:				32px;
				right:				10px;
				bottom:				10px;
				background-color:	#d92322;
				padding:			3px;
				text-align:			right;
				}

	.cadre_gris
		{
		background: 		#fcfcfc url(../images/template/images/cadre_gris_tl.png) top left no-repeat;
		position:			relative;
		float:				right;
		width:				50%;
		font-size:			0.80em;
		margin-bottom:		15px;
		}
		.cadre_gris .cadre_gris_content
			{
			background: 		transparent url(../images/template/images/cadre_gris_tr.png) top right no-repeat;
			position:			relative;
			top:				0;
			right:				0;
			padding:			10px;
			}
			.cadre_gris .cadre_gris_content a,
			.cadre_gris .cadre_gris_content h2
				{
				margin:				0;
				color:				#9D0808;
				}
			.cadre_gris .cadre_gris_content p,
			.cadre_gris .cadre_gris_content h4
				{
				padding:			10px 5px 0;
				letter-spacing:		0.05em;
				color:				#555;
				}
			.cadre_gris .cadre_gris_content img
				{
				margin:				5px;
				text-align:			center;
				}
			.cadre_gris .cadre_gris_content a
				{
				}
			.cadre_gris .cadre_gris_prix
				{
				display:			block;
				position:			absolute;
				width:				120px;
				height:				32px;
				right:				15px;
				bottom:				0px;
				text-align:			right;
				}
		.cadre_gris .cadre_gris_bl
			{
			background: 		transparent url(../images/template/images/cadre_gris_bl.png) bottom left no-repeat;
			position:			relative;
			bottom:				0;
			left:				0;
			width:				100%;
			height:				10px;
			}
		.cadre_gris .cadre_gris_br
			{
			background: 		transparent url(../images/template/images/cadre_gris_br.png) bottom right no-repeat;
			position:			absolute;
			bottom:				0;
			right:				0;
			width:				10px;
			height:				10px;
			}

	.product_promo
		{
		float:				right;
		width:				33.33%;
		min-width:			195px;
		}
		.product_promo_inside
			{
			position:			relative;
			background:			#FAF7F0 url(../images/template/images/promo_top.png) left top no-repeat;
			margin:				5px;
			padding:			4px;
			border:				#A10D0D 2px solid;
			font-size:			0.9em;
			}
			.product_promo h5
				{
				margin:				0;
				height:				28px;
				padding:			2px 2px 2px 45px;
				margin-bottom:		5px;
				overflow:			hidden;
				text-align:			center;
				font-size:			0.9em;
				}
			.product_promo h5 a
				{
				color:				#FFFFFF;
				text-transform:		uppercase;
				font-style:			italic;
				}
			.product_promo .sub
				{
				margin-right: 		85px;
				height: 			65px;
				overflow: 			hidden;
				font-size:			0.85em;
				}
			.product_promo p
				{
				margin:				0;
				padding:			5px;
				min-height:			70px;
				width:				125px;
				font-size:			0.7em;
				}
			.product_promo .pic_zone
				{
				margin:				5px 0;
				text-align:			center;
				}
			.product_promo .pic_zone_teaser
				{
				margin:				5px 90px 0 0;
				text-align:center;
				}
			.product_promo .pic_zone_teaser img
				{
				width:				100%;
				}
			.product_promo img
				{
				width:				82%;
				border:				#CCCCCC 1px solid;
				}
			.product_promo .cart_box
				{
				display:			block;
				position:			relative;
				float: 				right;
				
				float: none;
				position: absolute;
				bottom: 4px;
				right: 4px;
				_bottom: 15px;
				_right: 11px;
				
				width:				80px;
				height:				65px;
				background:			#A10D0D url(../images/template/images/promo_price.png) top left no-repeat;
				overflow:			hidden;
				}
			.product_promo .cart_box a.big_prix
				{
				display:			block;
				height:				36px;
				padding-top:		2px;
				text-align:			center;
				color:				#FFF390;
				font-size:			1.9em;
				}
			.product_promo .cart_box .prix_cents
				{
				font-size:			0.4em;
				margin-left:		-0.75em;
				}
			.product_promo .cart_box a.mess_1l
				{
				display:			block;
				padding-top:		10px;
				text-align:			center;
				color:				#A10D0D;
				font-size:			0.9em;
				}
			.product_promo .cart_box a.mess_2l
				{
				display:			block;
				padding-top:		8px;
				text-align:			center;
				color:				#A10D0D;
				font-size:			0.75em;
				line-height:		0.78em;
				text-transform:		uppercase;
				}

	.product
		{
		}
		.product p
			{
			margin-left:		10px;
			}
		.product .pic-zone
			{
			float:				right;
			margin:				0 0 10px 10px;
			border:				#A10D0D 2px solid;
			}
		.product .tags-zone
			{
			margin:				5px;
			text-align:			center;
			}
		.product .text-zone
			{
			font-size:			0.9em;
			}

	#cart_form fieldset
		{
		margin: 			0 2px;
		padding: 			10px;
		border: 			none;
		background-color: 	#f4f2ed;
		}
	#cart_form fieldset legend
		{
		color: 				#a10d0d;
		font-weight: 		bold;
		}
	#cart_form fieldset li
		{
		list-style: 		none;
		padding-left: 		5px;
		}
	#cart_form fieldset li label
		{
		list-style: 		none;
		}
	#cart_form fieldset li input
		{
		margin: 			0 10px 0 0;
		}

    .addcart_box
		{
		clear: 				right;
		position: 			relative;
		}
    .tocart_btn
		{
		width: 				100%;
		margin-top: 		5px;
		}
    .tocart_btn tr
		{
		background-color: 	#f4f2ed;
		}
    .tocart_btn .cart_price_info
		{
		padding: 			5px 10px;
		font-size:			1.2em;
		text-align:			left;
		vertical-align: 	middle;
		}
    .tocart_btn .cart_price_price
		{
		padding: 			5px;
		width: 				130px;
		text-align:			right;
		vertical-align: 	middle;
		}
    .tocart_btn a 
		{
		display:			block;
		overflow:			hidden;
		height:				28px;
		width:				130px;
		background-image:	url(../images/template/add-to-cart.png);
		background-repeat:	no-repeat;
		background-position:0 0px;
		padding:			6px 8px 6px 62px;
		color:				#fff390;
		font-size:			1.6em;
		text-align:			right;
		}
    .tocart_btn a.btn_nobuy
		{
		background-position:0 -80px;
		}
    .tocart_btn a.btn_cart:hover
		{
		background-position:0 -40px;
		}
		

/* Visible a l'impression uniquement */
	#footer .print_only
		{
		display: 			none;
		}
	
/* *
 * printer 
 */
@media print
	{

	body
		{
		background:			none;
		font-size:			0.9em;
		}
		
	.no_print,
	#sidebar1,
	#footer_menu,
	#footer #pitoo
		{
		display: 			none;
		}
		
	#footer .print_only
		{
		display: 			inline;
		}
	
	.twoColHybLtHdr #container
		{ 
		width: 				100%;  /* ce paramétrage crée un conteneur dont la largeur est 80 % de celle du navigateur */
		background: 		none;
		margin: 			0 0; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
		} 
		
	.twoColHybLtHdr #mainContent,
	.twoColHybLtHdr #header
		{ 
		margin: 			0;
		background:			none;
		}
		
	.twoColHybLtHdr #header 
		{ 
		margin: 			0;
		background:			none;
		}
		
	.twoColHybLtHdr #header #header_logo img
		{
		height: 			100px;
		}
		
	}