/* HTML5 Reset Stylesheet by HTML5Doctor.com */
	html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
	body{line-height:1}
	article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
	nav ul{list-style:none}
	blockquote,q{quotes:none}
	blockquote:before,blockquote:after,q:before,q:after{content:none}
	a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
	ins{background-color:#ff9;color:#000;text-decoration:none}
	mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
	del{text-decoration:line-through}
	abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
	table{border-collapse:collapse;border-spacing:0}
	hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
	input,select{vertical-align:middle}  
	/* box sizing combo */
	* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
	/* colors: 
		nav body (darkviolet) #2c1828;
		nav border & buttons (pinkviolet):#ae61a0;
		nav level 2 (lightpinkviolet):#bf72b1;
		hover : #ffe7fb;
	*/

	@font-face {
		font-family: 'Nunito';
		font-style: normal;
		font-weight: 400;
		src: local('Nunito-Regular'), url(Nunito-Regular.woff) format('woff');
	}

	@font-face {
		font-family: 'Miss Fajardose';
		font-style: normal;
		font-weight: 400;
		src: local('Miss Fajardose Regular'), local('MissFajardose-Regular'), url(Miss_Fajardose_Regular.woff) format('woff');
    }

html{font-family: 'Nunito'}
	body{
		font-size:1em;
		/*background: url("/img/robemarcus.png");
		background-position: bottom right;
		background-repeat: no-repeat;
	}
	.alphaBackground
	{
		position: fixed;
		width: 100%;
		height: 100%;
		background-color: rgba(255, 255, 255, 0.8);
		z-index: -1;
		top: 0;*/
	}
	body>section
	{
		min-height: 810px
	}
		/* COMMON RULES */
		body>nav,body>footer{
			width:100%;
			height: 40px;
			line-height:30px;
			background-color:#2c1828;
			border-top:4px solid #ae61a0;
			border-bottom:4px solid #ae61a0;
			box-shadow:0 0 1px #ae61a0;
		}
		body>header .content,body>nav .content,body>footer .content, body>section {width:1000px;margin:0 auto}
		body>nav .content .myAccount{text-align: right; display: inline-block; float: right; white-space: nowrap}
		body>nav .content .online{line-height: 15px}
		body>nav .content .myAccountClear{clear: both}
		
		a, a:visited, a:active{text-decoration: none;color:#ae61a0}
		a:hover{text-decoration: underline; color: #A83F9A}
		
		nav  a:hover, header a:hover{text-decoration: none; color:#ffe7fb}
		
		li{list-style:none}

		label:not(.semanticOnly), .label{
			clear: both;
			float: left;
			font-weight: bold;
			width: 300px;
		}
		
		label, .label, button{cursor: pointer}

		.AreYouReseller {margin-top: 1em; margin-bottom: 2em}
		.AreYouReseller label, .AreYouReseller input{width: 100%}
		/* .AreYouReseller{text-align: center}
		.AreYouReseller legend, .AreYouReseller em{text-align: left}*/
		
		button img{vertical-align: bottom}

		fieldset{
			border: 2px groove threedface;
			display: block;
			margin-bottom: 1em;
			margin-left: 2px;
			margin-right: 2px;
			padding: 0.35em 0.625em 0.75em;
		}

		fieldset > legend {
			font-weight: bold;
			padding-left: 2px;
			padding-right: 2px;
			width: -moz-fit-content;
		}

		legend {
			display: block;
		}

		#reviewCart{margin-bottom: 1em}
			#reviewCart td{vertical-align: middle}
		
		#review_total_wellby_outerHTML{margin-bottom: .5em}

		#chooseAddress{background-color: #ca98c1; margin-bottom: 1em; padding: 1em; word-wrap: break-word}
		#chooseAddress dl{display: inline}
		#chooseAddress dt{display: inline; font-weight: bold}
		#chooseAddress dd{display: inline}

		.deleteButton{background: none; border: 0; color: red; font-weight: bold; cursor: pointer; padding:0}
		.deleteButton img{vertical-align: middle}

		.horizontalAlignBlock{display: inline-block; width: 150px}

		.steps{height: 50px; background-repeat: no-repeat; padding-top: calc(25px - .5em); margin-bottom: 1em}

		.step1on3{background-image: url(img/3steps-step1.png)}
		.step2on3{background-image: url(img/3steps-step2.png)}
		.step3on3{background-image: url(img/3steps-step3.png)}

		.threeSteps > div:first-child{padding-left: calc(25px + .5em); width: calc(237px + 25px)} /* calc(calc(100% - 25px) / 3) = 237px */
		.threeSteps > div{padding-left: .5em; width: 237px; display: inline-block}

		.payement h1, .payement h2{margin-top: 1em; margin-bottom: 1em;}
		.payement h1{font-size: 3em;}
		.payement h2{font-size: 1.7em;}
		.payement h2+div{padding-left: 2em}

		/* Google RECaptcha bullshit (add an empty frame at the end of the page, breaking the CSS) */ 
		iframe[src="about:blank"]{display: none}
		#form_recaptcha{height: 145px}

		/*HEADER*/
		body>header{
			height:200px;
			width:100%;
			background-color:#ffe7fb;
			background-position:top center;
			background-image:url(img/header.png);
			background-repeat: no-repeat;
		}
		
		body>header .changeCover {
			display: none;
		}
		
		body>header:hover .changeCover {
			display: block;
		}
		
			body>header .content{
				/*color: white;
				background-image:url(img/logo5.png);
				background-position:middle left;
				background-repeat: no-repeat;
				display: none*/
				font-family: Miss Fajardose;
				font-size: 50px;
				/* color: #bf72b1; */
				display: block;
				text-shadow: 0 0 1px #2c1828;
			}
				body>header .content h1{
					float: left;
					font-weight: normal;
					font-size: 190px;
					color: white;
				}

				body>header .content p{
					/* text-align: center; */
					padding-top: 133px;
					color: black;
					padding-left: 492px;
					font-size: 1.3em;
				}


		/* BARRE SOUS HEADER (fil d'ariane+compte+panier)*/
		body>nav{}
			body>nav .content{color:#ae61a0}
			/*body>nav .content a,body>nav .content a:active,body>nav .content a:visited{color:#ae61a0}*/
				body>nav .content a.home{
					vertical-align: top;
					margin-top:4px;
					width:25px;height:20px;
					display:inline-block;
					background:url(img/icon-home20.png) no-repeat top left;
				}
				body>nav .content a.home:hover{background:url(img/icon-home20-hover.png) no-repeat top left}
				body>nav .content a{display: inline-block} /* Or the next line wont work (first-letter) */
				body>nav .content h1:first-letter,body>nav .content a::first-letter {color:white}
				body>nav .content h1{/* fil d'ariane/titre de page */
					display:inline-block;
					font-size:1.2em;
					width:55%;
					overflow:hidden;
					font-weight: normal;
					}
				body>nav .content .account, body>nav .content .basket{vertical-align: top;display:inline-block;width:160px}
					body>nav .content .basket em{font-style: normal;color:white}/* nb items dans le panier*/
				body>nav .content .connectedWith{text-decoration: underline}



		/* CONTENU PAGE*/
		body>section{}
			body>section nav{/*menu*/
				padding:5px;
				margin-right:2%;
				margin-bottom:30px;
				vertical-align: top;
				display: inline-block;
				width:22%;
				background-color:#2c1828;
				border-left:4px solid #ae61a0;
				border-right:4px solid #ae61a0;
				border-bottom:4px solid #ae61a0;
				border-radius: 0 0 2px 2px;
				box-shadow:0 0 1px #ae61a;
				line-height: 20px;
				min-height:350px;
				}
			body>section nav>ul:first-child{padding-top: 20px} /* Will only be effective when offline (so .myWellbies isn't the first child) */
				.myWellbies{
					font-size: .7em;
					/*font-style: italic;*/
					color: black;
					padding-bottom: 5px;
					text-align: center
				}
				body>section nav .myWellbies{color: white;}
				body>section nav>ul>li:first-of-type{background:url(img/icon-home20.png) no-repeat} /* tous les articles: premier item de la liste*/
					body>section nav>ul>li:first-of-type:hover, body>section nav>ul>li.active:first-of-type{background:url(img/icon-home20-hover.png) no-repeat; background-color: #ae60a0}
				body>section nav>ul>*{padding-left: 20px}
				body>section nav ul li{/*padding-left:20px;*/}/* item menu niveau 1*/
					body>section nav ul li:hover, body>section nav ul li.active{background-color: #ae60a0}
					body>section nav ul li:hover a, body>section nav ul li.active a{color:#ffe7fb}
					body>section nav ul li a{display: block; position: relative}

				body>section nav ul ul {/*padding-left:20px;*/color:#bf72b1;font-size:0.8em}/* item menu niveau 2*/

				body>section nav ul ul li {padding-left:20px; margin-left:-20px}

					body>section nav ul ul li a{color:#cf83c2; padding-left: 20px}
					body>section nav ul ul li a.active{color:#ffe7fb;text-shadow:0 0 1px #bf72b1}
					body>section nav ul ul li a.active:before{content:"►"}

			body>section .filter{margin-bottom: 1em; text-align: left}
						.filter .displayAll{font-size: 0.7em}

			body>section section{display:inline-block;width:75%;padding:5px;padding-top: 20px;text-align: left}

				body>section section .infoBox{padding: 1em; margin-bottom: 1em; background-color: #eccaec; color: #1c1c1c; font-size: .97em; border-radius: 5px; border: 3px solid #ae61a0}
				body>section section .infoBox h1{font-style:italic; font-size: 1.5em; margin-bottom: 1em}

				body>section section .titleForm{font-size:2em; padding-bottom: 1em; color: #934b85}
				body>section section .commandsTable{margin-bottom: 1em}
				body>section section .commandsTable th{background-color: #b975ad}
				body>section section .commandsTable hr{margin: .5em 0}
				body>section section .commandsTable .comment{text-align: left}
				body>section section input[type="submit"], body>section section button[type="submit"]{margin-top: 1.5em}

				/* section article{display:inline-block;width:23.8%;margin-left:5px;padding-bottom:10px;margin-bottom:50px}*/
				section article{display:inline-table;width:23.8%;margin-left:5px;padding-bottom:10px;margin-bottom:50px; text-align: center; }
				section article:hover{background-color:#ffc7f6}
				section article:first-of-type{margin-left:0}

				section article .mediumPreview{padding-left: .5em; padding-right: .5em}

					section article header{}
						section article header img{border-radius:2px;/*height:120px;*/width:auto;max-width:100%}/* image produit responsive : s'adaptera à la largeur */
						section article header img:hover{ /* zoom sur l'image on hover*/
							-moz-transform:scale(1.5,1.5);
							-webkit-transform:scale(1.5,1.5);
							-o-transform:scale(1.5,1.5);
							transform:scale(1.5,1.5);
							border: 1px solid black;
						} 
						section article header h1{
							font-size: .9em;
						}
					section article .content{font-size:0.9em;height:50px;color:#2c1828} /* description */
						section article .content h1{font-size:1em}
					section article footer{}
						section article footer .price{
								background:#ae61a0;
								box-shadow: 0 01px #ae61a0;
								height:40px;
								margin:4px;
								border-radius: 3px;
								line-height: 40px;
								white-space: nowrap;
							}
							.price .euros,.price .wellbies,.buyorsee .buy,.buyorsee .see{
								display:inline-block;
								width:30%;
								text-align:center;
								color:white;
								height:40px;
								border-radius: 3px;
								line-height: 40px;
							}
							.price .euros{}
							/*.price .euros:after{content:" €";color:#ffe7fb}*/
							.price .wellbies{}
							/*.price .wellbies:after{content:" w"}*/
							.price .alt_price{text-align: center;}
						section article footer .buyorsee{}
							.buyorsee .buy,.buyorsee .see, .buyDetails .basketEuro, .buyDetails .basketWellby{
								background-color:#2c1828;
								box-shadow: 0 01px #ae61a0;
								display:inline-block;
								width:47%;
								text-align:center;
								color:white;
								height:50px;
								border-radius: 3px;
								line-height: 50px;
								vertical-align: top;
							} 
							.buyorsee .buy{background-image:url(img/icon-basket32.png);background-repeat:no-repeat;background-position:center center}
							.buyorsee .buy:hover{background-image:url(img/icon-basket32-hover.png);background-repeat:no-repeat;background-position:center center}
							.buyorsee .see, .buyDetails .basketEuro, .buyDetails .basketWellby{font-size:1.8em;color:#ae61a0}
							.buyorsee .see:hover, .buyDetails .basketEuro:hover, .buyDetails .basketWellby:hover{color:white}
						section article footer .buyDetails{text-align: left}
							.buyDetails input[type=number]{width: 6em; text-align: right}
							.buyDetails label{
								font-weight: bold;
								margin-top: 1em;
								display: inline-block;
							}
							.buyDetails .dynamicPrices{padding-left: 1em}
							.buyDetails .basketChoice{text-align: center}
							.buyDetails .basketEuro, .buyDetails .basketWellby{
								cursor: pointer;
								border: 0;
							}

		body>section section .noArticle{margin-bottom: 2em}

		body>section section .pageNavigator
		{
			margin-bottom: .5em;
			text-align: center;
		}
		body>section section .pageNavigator input[type="submit"]{margin-top: 0}
		body>section section .pageNavigator a:hover{color: #ae61a0}
		.pageNavigator .previousPage{float: left}
		.pageNavigator .nextPage{float: right}


		/*FOOTER*/
		body>footer{overflow:hidden;color:#ae61a0}
			body>footer .content{}
			body>footer .content a{text-shadow:0 0 1px #ae61a0}
			





/* TRANSITIONS CSS3 */
/* pour ajouter un objet, le mettre ici avec son état hover*/
article,
a,
.buy,
.see,
article header img,
article:hover,
a:hover,
.buy:hover,
.see:hover,
article header img:hover
{-webkit-transition:all 200ms ;-moz-transition:all 200ms ;-o-transition:all 200ms ;transition:all 200ms }


/* RESPONSIVE */