@charset "UTF-8";
/* CSS Document */
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;	
background-image: url("../img/bgShop.jpg");
background-size:auto 100%;
font-family:Arial, sans-serif;
}
	a {text-decoration: none;}	
	a:hover {text-decoration: none;}


#wrapper{
position: absolute;
background:no-repeat;
background-image: url("bg.jpg");
background-size: 100% auto;	
top:0px;
left:50%;	
margin: 0 0 0 -750px;
width: 1500px;
height: 844px;
overflow: hidden;
}

/* NAVMENU */
#navMenu{
position: absolute;
top: 480px;
width: 10px;
left : -2px;
}

.navBtn{
	display:inline-block;
	white-space:nowrap;
	margin-bottom: 3px;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight: bold;
	font-size: 26px;
	text-align: left;
	padding-left: 10px;
	padding-right: 10px;
	text-decoration: none;	
	color: #0e1655;
	height: 50px;
	line-height: 50px;
	background-color: white;
	border: 2px solid #e01179;
	border-radius: 0px 20px 30px 0px;
	cursor: pointer;
}

.navBtn:hover{
	color: #e01179;
}
/*.navBtn1{width: 220px}.navBtn2{width: 200px}.navBtn3{width: 290px}.navBtn4{width: 250px}.navBtn5{width: 270px}*/

/* bgLink */
#bgLink{
position: absolute;
	width: 100%;
	height: 100%;
}



/* Bulles */
#bulle1{
position: absolute;
	width: 707px;
	height: 600px;
	top: 230px;
	left:220px;
	background:no-repeat;
background-image: url("../img/bulle_1.png");
background-size: 100% auto;	
}
#bulle2{
position: absolute;
	width: 707px;
	height: 600px;
	top: 230px;
	left:220px;
	background:no-repeat;
background-image: url("../img/bulle_2.png");
background-size: 100% auto;	
}
#bulle3{
position: absolute;
	width: 707px;
	height: 600px;
	top: 230px;
	left:270px;
	background:no-repeat;
background-image: url("../img/bulle_3.png");
background-size: 100% auto;	
}
#bulle4{
position: absolute;
	width: 707px;
	height: 600px;
	top: 230px;
	left:240px;
	background:no-repeat;
background-image: url("../img/bulle_4.png");
background-size: 100% auto;	
}
#bulle5{
position: absolute;
	width: 707px;
	height: 600px;
	top: 230px;
	left:270px;
	background:no-repeat;
background-image: url("../img/bulle_5.png");
background-size: 100% auto;	
}

/* Bulles inter */
#bulle3inter,#bulle5inter{
	position: absolute;
	width: 100%;
	height: 25%;
	bottom: 0;
 
}


/* PIED */
#pied{
position: absolute;
	width: 1500px;
	top: 830px;
	left:50%;
	margin-left:-750px;
	font-size: 14px;
	text-align: center;
	text-decoration: none;	
	height: 35px;
	line-height: 35px;
	background-color: white;
}
#pied a {
	color: purple;
}
	


@media all and (max-width: 1500px) {
    #navMenu{top: 420px;}
	#wrapper{width: 1300px;height: 732px;margin-left:-650px;}
	#pied{width: 1300px;top: 720px;margin-left:-650px;}
	#bulle1,#bulle2,#bulle3,#bulle4,#bulle5{width: 589px;height: 500px;top: 220px;left:200px;}
	#bulle3{left:240px;}#bulle5{left:240px;}
	.navBtn{
	margin-bottom: 3px;
	font-size: 20px;
	text-decoration: none;	
	height: 45px;
	line-height: 45px;
	border-radius: 0px 20px 30px 0px;
	}
}

@media all and (max-width: 1300px ){
    #navMenu{top: 345px;}
	#wrapper{width: 1100px;height: 619px;margin-left:-550px;}
	#pied{width: 1100px;top: 610px;margin-left:-550px;}
	#bulle1,#bulle2,#bulle3,#bulle4,#bulle5{width: 500px;height: 425px;top: 180px;left:180px;}
	#bulle3{left:200px;}#bulle5{left:200px;}
	.navBtn{
	margin-bottom: 2px;
	font-size: 18px;
	text-decoration: none;	
	height: 38px;
	line-height: 38px;
	border-radius: 0px 18px 25px 0px;
	}
}

@media all and (max-width: 1100px) {
    #navMenu{top: 280px;}
	#wrapper{width: 900px;height: 507px;margin-left:-450px;}
	#pied{width: 900px;top: 500px;margin-left:-450px;}
	#bulle1,#bulle2,#bulle3,#bulle4,#bulle5{width: 424px;height: 360px;top: 140px;left:150px;}
	#bulle3{left:180px;}#bulle4{left:160px;}#bulle5{left:180px;}
	.navBtn{
	margin-bottom: 2px;
	font-size: 15px;
	text-decoration: none;	
	height: 33px;
	line-height: 33px;
	border-radius: 0px 15px 20px 0px;
	}
	/*.navBtn1{width: 120px}.navBtn2{width: 110px}.navBtn3{width: 190px}.navBtn4{width: 150px}.navBtn5{width: 170px}*/

}

@media all and (max-width: 900px) {
    #navMenu{top: 210px;}
	#wrapper{width: 700px;height: 394px;left:0px; margin-left:0px;}
	#pied{width: 700px;top: 390px;left:0px; margin-left:0px;}
	#bulle1,#bulle2,#bulle3,#bulle4,#bulle5{width:330px;height: 280px;top: 100px;left:130px;}
	#bulle3{left:150px;}#bulle5{left:150px;}
	.navBtn{
	margin-bottom: 2px;
	font-size: 12px;
	text-decoration: none;	
	height: 25px;
	line-height: 25px;
	border-radius: 0px 12px 15px 0px;
	}
}

#loading{
position: absolute;
background-color: #FFFFFF;
margin: 0 0 0 0;
width: 100%;
height: 100%;
}