/***********************************************************************
* Masterpage.css
* - Généralités
* - Container principal
* - Header 
* - Contenu de la page 
* - Footer 
* - Mentions légales 
***********************************************************************/

/* - Généralités ******************************************************/
* { margin: 0; padding: 0; }

body
{
	font-family: Arial, Sans-Serif;
	font-size:12px;
	color:#000;
	background:#fff; 
}

a		{ color:#000; }
a img	{ border:none; }

::selection { background:#2b2525; color:#fff; }
::-moz-selection { background:#2b2525; color:#fff; }

/* - Tools ************************************************************/
.clear {clear:both; font-size:.1em;}

/* - Container principal **********************************************/
#container
{
	margin:0 auto;
	min-width:925px;
}

	.center
	{
		width:925px;
		margin:0 auto;
		position:relative;
	}
	
		.center .global
		{
			_height: 100%;
			overflow: hidden;	
		}

/* - Header ***********************************************************/
.header
{
	background:#000;
	height:53px;
	margin-bottom:45px;
}

	.header h4
	{
		position:absolute;
                @margin-left: -288px;
	}
	
	.header h5
	{
		position:absolute;
		top:13px;
		left:95px;
	}
	
/* - Haut du site *****************************************************/
.introduction
{
	margin-bottom:17px;
	position:relative;
}
	.introduction ul { list-style:none;position:relative; }
	
	.introduction h5
	{
		margin-left:12px;
	}
	
	.introduction .btEnSavoirPlus
	{
		position:absolute;
		bottom:-11px;
		right:17px;
	}

	.introduction .timer
	{
		position:absolute;
		top:-65px;
		right:0;
		background:url(timer.gif) no-repeat right top;
		padding:25px 50px 10px 0;
	}
	
		.introduction .timer strong
		{
			color:#fe0030;
		}
		
		
	.introduction .avantages li,
	.introduction .engagement li
	{
		background:url(puce-grey.gif) no-repeat left 3px;
		padding-left:16px;
	}
	
	.introduction .chiffres li
	{
		background:url(puce-white.gif) no-repeat left 3px;
		padding-left:16px;
	}
	
	.introduction .panier li
	{
		background:url(puce-pink.gif) no-repeat left 3px;
		padding-left:16px;
	}
		
	.introduction .avantages
	{
		background:url(bloc-avantages.gif) no-repeat left bottom;
		width:269px;
		height:184px;
		margin-bottom:20px;
		color:#fff;
		position:relative;
	}
	
		.introduction .avantages ul
		{
			margin:10px 20px 0 10px;
		}
		
			.introduction .avantages li
			{
				margin-bottom:5px;
			}
		
	.introduction .engagement
	{
		background:url(bloc-engagement.gif) no-repeat left bottom;
		width:269px;
		height:107px;
		margin-bottom:20px;
		color:#fff;
		position:relative;
	}
	
		.introduction .engagement ul
		{
			margin:12px 20px 0 10px;
			line-height:14px;
		}
		
	.introduction .op
	{
		position:absolute;
		top:15px;
		left:275px;
		width:646px;
		height:258px;
		overflow:hidden;
	}
		
	.introduction .chiffres
	{
		background:url(bloc-chiffres.gif) no-repeat left bottom;
		width:269px;
		height:152px;
	}
		.introduction .chiffres h5
		{
			margin-left:77px;
		}
		
		.introduction .chiffres strong
		{
			color:#fe0030;
		}
	
		.introduction .chiffres ul
		{
			margin:30px 10px 0 15px;
		}
	
		.introduction .chiffres li
		{
			margin-bottom:3px;
		}
		
	.introduction .vous
	{
		position:absolute;
		left:275px;
		bottom:0px;
		width:354px;
		height:144px;
		padding-top:10px;
		background:no-repeat left bottom;
	}
	
		.introduction .vous h5
		{
			margin-bottom:12px;
		}
	
		.introduction .vous cite
		{
			display:block;
			font-weight:bold;
			font-style:normal;
			margin:13px 0px 5px 18px;
		}
	
		.introduction .vous blockquote
		{
			width: 175px;
			margin: 0px 0px 0px 18px;
			line-height:14px;
		}
	
		.introduction .homme	{ background-image:url(bloc-vous-homme.jpg); }
		.introduction .femme	{ background-image:url(bloc-vous-femme.jpg); }
		
	.introduction .panier
	{
		position:absolute;
		left:645px;
		bottom:0px;
		background:url(bloc-panier.gif) no-repeat left bottom;
		width:277px;
		height:147px;
		padding-top:3px;
	}
		.introduction .panier h5
		{
			margin-left:49px;
		}
		
		.introduction .panier em
		{
			color:#fe0030;
			font-style:normal;
		}
		
		.introduction .panier .intro
		{
			margin:3px 15px 0 50px;
		}
		
		.introduction .panier .panier-vide
		{
			display:block;
			margin:30px 25px 0 80px;
			color:#fe0030;
		}
		.introduction .panier span.panier-plein {display:block; color:#000; padding:4px 10px 0 10px; text-align:center}	
		.introduction .panier span.panier-plein strong {color:#fe0030;}
		
		.introduction .panier ul
		{
			margin:10px 10px 0 15px;
		}
	
			.introduction .panier ul a
			{
				text-decoration:none;
			}
		
		.introduction .panier a.consulter-panier
		{
			color:#fe0030;
			position:absolute;
			bottom:8px;
			left:78px;
		}

/* - Bandeau Rejoignez le club ****************************************/
.join
{
	background:url(join-arrow.gif) no-repeat center bottom;
	padding-bottom:26px;
}

	.steps
	{
		background:#2b2525;
		height:55px;
	}

		.steps ol
		{
			list-style:none;
			font-size:15px;
			color:#fff;
			font-weight:bold;
			line-height:55px;
		}
		
			.steps ol li
			{
				float:left;
                                width:300px;
				height:53px;
                                font-size:14px; 
			}
			
			.steps ol li.step1
			{
                            width:250px;
				/* background-image:url(step1-off.gif); */
				
			}
			
			.steps ol li.step2
			{
                            padding-left:30px;                           
                            width:290px;
				/* background-image:url(step2-off.gif); */
				
			}
			
			.steps ol li.step3
			{
                            width:290px;
                            padding-left:30px;                           
				/* background-image:url(step3-off.gif); */
				
			}
			
			.steps ol li.step1-on	{ 
                            /* background-image:url(step1-on.gif); */
                            font-size:17px; 
                        }
			
                        .steps ol li.step2-on	{ 
                            /* background-image:url(step2-on.gif); */
                            font-size:17px; 
                        }
			.steps ol li.step3-on	{ 
                            /* background-image:url(step3-on.gif); */
                            font-size:15px;
                        }

			.steps ol li.step1-on,
			.steps ol li.step2-on,
			.steps ol li.step3-on
			{
				color:#ff0036;
			}

                        .steps ol li a
			{
				color:#ffffff;
                                text-decoration: none;
			}

.content
{

}

/* - Footer ***********************************************************/
.footer
{
	text-align:center;
	font-size:10px;
	padding:25px 0;
}

	.footer p
	{
		margin-bottom:3px;
	}

	.footer span
	{
		padding:0 5px;
	}
	
	
/* - Mentions légales *************************************************/
.legal
{
	background:#000 url(legal-arrow.gif) no-repeat center top;
	padding:55px 0 40px 0;
	color:#fff;
	font-size:10px;
}

	.legal a
	{
		color:#fff;
		text-decoration:underline;
	}

	.legal p
	{
		margin-bottom:10px;
	}
	
	.legal h2
	{
		font-size:11px;
		margin-top:20px;
	}
	.legal .center {position:static;}


/* - Popup javascript **************************************************/
	
	.payment-information {width:428px; padding-bottom:13px; background:url('info-payment-bg-bot.gif') 0 bottom no-repeat}
	.payment-information dt {width:428px; height:38px; padding-top:15px; position:relative; color:#ff0036; font-size:14px; text-transform:uppercase; text-align:center; font-weight:bold; background:url('info-payment-bg-top.gif') 0 0 no-repeat}
	.payment-information dt span {cursor:pointer; display:block; width:17px; height:17px; position:absolute; right:11px; top:9px; text-decoration:none; background:url('btn-close.gif') 0 0 no-repeat}
	.payment-information dd {width:380px; padding:15px 23px 0 23px; background-color:#fff; border-left:1px solid #000; border-right:1px solid #000;}
	.payment-information dd ul {margin:0;padding:0;list-style-type:none;}
	.payment-information dd ul li {padding-bottom:10px; text-align: justify;}
	.payment-information dd strong {padding-left:16px; background:url('popup/dot.gif') 0 4px no-repeat}
	.payment-information dd strong.crypto {padding-right:60px}
	.payment-information dd img.crypto {display:block; margin:15px auto}
	.payment-information dd img.picCard {margin-left:5px; border:1px solid #797171}
	.payment-information dd span.closeWindow {cursor:pointer; display:block; padding-top:5px; text-align:center; color:#ff0036; font-size:11px}
	
	.ajout-panier {width:240px; padding-top:13px; background:url('basket-add-bg-top.gif') 0 0 no-repeat}
	.ajout-panier dt {width:178px; padding:0 30px; position:relative; text-align:center; font-weight:normal; background-color:#fff; border-left:1px solid #000; border-right:1px solid #000;}
	.ajout-panier dt span {cursor:pointer; display:block; width:17px; height:17px; position:absolute; right:7px; top:-5px; text-decoration:none; background:url('btn-close-white.gif') 0 0 no-repeat}
	.ajout-panier dt strong {display:block; color:#ff0036; font-size:14px; text-transform:uppercase}
	.ajout-panier dd {width:238px; padding-top:10px; text-align:center; font-weight:bold; background-color:#fff; border-left:1px solid #000; border-right:1px solid #000;}
	.ajout-panier dd img {width:124px; height:198px; display:block; margin:0 auto 15px auto; border:1px solid #000}
	.ajout-panier dd.bot{width:240px; height:13px; padding:0; background:transparent url('basket-add-bg-bot.gif') 0 0 no-repeat; border:0;}
	.ajout-panier dd span.closeWindow {cursor:pointer; display:block; padding-top:5px; text-align:center; font-weight:normal; color:#ff0036; font-size:11px}
	
	


	.payment-information-formPaiement {position:relative; clear:both;margin:0 auto;width:428px; padding-bottom:13px; background:url('info-payment-bg-bot.gif') 0 bottom no-repeat}
	.payment-information-formPaiement dt {width:428px; height:38px; padding-top:15px; position:relative; color:#ff0036; font-size:14px; text-transform:uppercase; text-align:center; font-weight:bold; background:url('info-payment-bg-top.gif') 0 0 no-repeat}
	.payment-information-formPaiement dt span {cursor:pointer; display:block; width:17px; height:17px; position:absolute; right:11px; top:9px; text-decoration:none; background:url('btn-close.gif') 0 0 no-repeat}
	.payment-information-formPaiement dd {width:380px; padding:15px 23px 0 23px; background-color:#fff; border-left:1px solid #000; border-right:1px solid #000;}
	.payment-information-formPaiement dd ul {margin:0;padding:0;list-style-type:none;}
	.payment-information-formPaiement dd ul li {padding-bottom:10px; text-align: justify;}
	.payment-information-formPaiement dd strong {padding-left:16px; background:url('dot.gif') 0 4px no-repeat}
	.payment-information-formPaiement dd strong.crypto {padding-right:60px}
	.payment-information-formPaiement dd img.crypto {display:block; margin:15px auto}
	.payment-information-formPaiement dd img.picCard {margin-left:5px; border:1px solid #797171}
	.payment-information-formPaiement .button input {margin:auto;display:block;width:200px;font-weight:bold;}