body,
html {
	margin: 0; padding: 0;
	width: 2048px;
	height: 1536px;
	background-color: #fff;
	overflow: hidden;
}
body { display: none; }
header #logo {
	position: absolute;
	/*display: none;*/
	top: 44px;
	left: 78px;
	z-index: 1000;
}

footer #logo {
	position: absolute;
	display: none;
	top: 1361px;
	left: 78px;
	z-index: 1000;
}

#btn-home {
	display: none;
	position: absolute;
	top: 110px;
	left: 1918px;
}

#nestleskinhealth {
	position: absolute;
	top: 1416px;
	left: 1538px;
}

#reference_btn {
	position: absolute;
	top: 1362px;
    left: 1616px;
}

#content {
	width: 2048px;
	height: 1112px;
	display: block;
	position: absolute;
	top: 215px;
	-webkit-box-shadow: 0px 0px 27px 0px rgba(0,0,0,0.73);
	-moz-box-shadow: 0px 0px 27px 0px rgba(0,0,0,0.73);
	box-shadow: 0px 0px 27px 0px rgba(0,0,0,0.73);
	transition: all 0.3s;
}
#content.no-shadow {
	-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
	-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
}
.bkg-skin 		{ background-color: #4c4c8d; }
.bkg-factors 	{ background-color: #808bbc; }
.bkg-throught	{ background-color: #ccccce; }
.bkg-hair 		{ background-color: #edeef0; }
.bkg-holistic	{
	background-image: url('images/holistic/background.png');
	background-repeat: no-repeat;
	background-position: bottom center;
	background-color: #ffffff;
}
.bkg-references	{ background-color: #edeef0; }

#home, 
#skin, #skin-1, #skin-2, #skin-3, #skin-4, #skin-5, 
#factors, #factors-1, #factors-2, #factors-3, #factors-4,
#throught, #throught-1, #throught-2, #throught-3, #throught-4,
#hair-1, #hair-2, #hair-1-1, #hair-2-1,
#holistic-1, #holistic-2, #references {
	position: absolute;
	width: 2048px;
	height: 1112px;
}
#skin, #skin-1, #skin-2, #skin-3, #skin-4, #skin-5 {	
	display: none;
	background-color: #4c4c8d;
}
#factors, #factors-1, #factors-2, #factors-3, #factors-4 {	
	display: none;
	background-color: #808bbc;
}
#throught, #throught-1, #throught-2, #throught-3, #throught-4 {	
	display: none;
	background-color: #ccccce;
}
#hair-1, #hair-2, #hair-1-1, #hair-2-1 {	
	display: none;
	background-color: #edeef0;
}
#holistic-1, #holistic-2 {
	display: none;
	background-image: url('images/holistic/background.png');
	background-repeat: no-repeat;
	background-position: bottom center;
	background-color: #ffffff;
}
#references {	
	display: none;
	background-color: #edeef0;
	z-index: 8;
}
.touchscreen {
	position: absolute;
	margin: 0; padding: 0;
	width: 2048px;
	height: 1536px;
	display: block;
	z-index: 99;
	overflow: hidden;
	background-color: rgba(0, 0, 0, 0.4);
}

/*.touchscreen .icon-touch {
	position: absolute;
	margin: 0; padding: 0;
	width: 2048px;
	height: 1536px;
	display: block;
	z-index: 100;
	background-image: url(./images/home/touchscreen.png);
}*/

.touchscreen .icon-touch {
	position: absolute;
	display: block;
	width: 284px;
	height: 284px;
	z-index: 100;
	transition: all 0.8s;
}
.touchscreen .icon-touch.p1 { top: 692px; left: 330px; }
.touchscreen .icon-touch.p2 { top: 692px; left: 700px; }
.touchscreen .icon-touch.p3 { top: 692px; left: 1000px; }
.touchscreen .icon-touch.p4 { top: 692px; left: 1300px; }
.touchscreen .icon-touch.p5 { top: 692px; left: 1600px; }

.sub-title {
	font-size: 85px;
	font-weight: lighter;
	color: #fff;
	top: 92px;
	left: 68px;
	position: absolute;
	font-family: "Arial";
}

#throught .sub-title, #throught-1 .sub-title, #throught-2 .sub-title, #throught-3 .sub-title, #throught-4 .sub-title,
#hair-1 .sub-title, #hair-2 .sub-title, #hair-1-1 .sub-title, #hair-2-1 .sub-title {
	color: #002758;
}

.title {
	font-size: 85px;
	color: #004899;
	font-weight: bolder;
	top: 110px;
	left: 78px;
	position: absolute;
	display: none;
}
img.arrow-back {
	top: 103px;
	right: 68px;
	position: absolute;
	z-index: 10;
}

.ui-loader {
	display: none;
}

.tiroirSpot {
	display: none;
	top: 1370px; 
	left: 824px;
	position: absolute;
	width: 400px;
	height: 24px;
	text-align: center;
}
.tiroirSpotHome {
	top: 1370px; 
	left: 824px;
	position: absolute;
	width: 400px;
	height: 24px;
	text-align: center;
}

.spot {
	width: 24px;
	height: 24px;
	display: inline-block;
	margin: 0 8px;
	background-image: url(images/spot.png);
	background-position: left;
}
.spot.active {
	background-image: url(images/spot.png);
	background-position: right;
}

#home img.panel {
	margin: 0; bottom: 0;
	position: absolute;
	transition: all 0.3s;
}
#home img.panel.p1 { z-index: 5; top: 0; left: 0; }
#home img.panel.p2 { z-index: 4; top: 0; left: 338px; /*  left: 552px; 	 <-- Par défaut dans le PSD */ }
#home img.panel.p3 { z-index: 3; top: 0; left: 668px; /*  left: 847px;	 <-- Par défaut dans le PSD */ }
#home img.panel.p4 { z-index: 2; top: 0; right: 282px; /* right: 168px; <-- Par défaut dans le PSD */ }
#home img.panel.p5 { z-index: 1; top: 0; right: 0; }

#home img.panel.p1.active { z-index: 5; top: 0; left: 0; }
#home img.panel.p2.active { z-index: 4; top: 0; left: 382px; }
#home img.panel.p3.active { z-index: 3; top: 0; left: 654px; }
#home img.panel.p4.active { z-index: 2; top: 0; right: 304px; }
#home img.panel.p5.active { z-index: 1; top: 0; right: 0; }

img.bulle, img.course {
	margin: 0; bottom: 0;
	position: absolute;
	transition: all 0.3s;
}
/*** Skin - Resume ***/
#skin img.bulle.b1 		{ top: 244px; left: 478px; }
#skin img.bulle.b1-1 	{ top: 286px; left: 306px; z-index: 1; }
#skin img.bulle.b1-t 	{ top: 286px; left: 306px; z-index: 2; }
/***/
#skin img.bulle.b2 		{ top: 244px; right: 483px; }
#skin img.bulle.b2-1 	{ top: 286px; right: 305px; z-index: 1; }
#skin img.bulle.b2-t 	{ top: 286px; right: 305px; z-index: 2; }
/***/
#skin img.bulle.b3 		{ top: 604px; left: 58px; }
#skin img.bulle.b3-1 	{ top: 670px; left: 374px; z-index: 1; }
#skin img.bulle.b3-t 	{ top: 670px; left: 374px; z-index: 2; }
/***/
#skin img.bulle.b4 		{ top: 604px; left: 914px; }
#skin img.bulle.b4-1 	{ top: 666px; left: 727px; z-index: 1; }
#skin img.bulle.b4-t 	{ top: 666px; left: 727px; z-index: 2; }
/***/
#skin img.bulle.b5 		{ top: 600px; right: 61px; }
#skin img.bulle.b5-1 	{ top: 662px; right: 308px; z-index: 1; }
#skin img.bulle.b5-t 	{ top: 662px; right: 308px; z-index: 2; }
/*** Skin - Slides ***/
.slide img.bulle.b1 	{ top: 305px;  left: 383px; }
.slide img.bulle.b1-1 	{ top: 378px; left: 86px; z-index: 1; }
.slide img.bulle.b1-t 	{ top: 378px; left: 86px; z-index: 2; }
.slide img.bulle.b1-t2 	{ top: 504px; left: 1094px; }
.slide img.bulle.b1-t3 	{ top: 647px; left: 1094px; }


/*** Factors - Resume ***/
#factors img.bulle.b1 		{ top: 250px; left: 600px; }
#factors img.bulle.b1-t 	{ top: 250px; left: 600px; z-index: 2; }
/***/
#factors img.bulle.b2 		{ top: 250px; right: 203px; }
#factors img.bulle.b2-t 	{ top: 250px; right: 203px; z-index: 2; }
/***/
#factors img.bulle.b3 		{ top: 609px; left: 174px; }
#factors img.bulle.b3-t 	{ top: 609px; left: 174px; z-index: 2; }
/***/
#factors img.bulle.b4 		{ top: 609px; left: 1018px; }
#factors img.bulle.b4-t 	{ top: 609px; left: 1018px; z-index: 2; }
/*** Factors - Slides ***/
#factors-1.slide img.bulle.b1 		{ top: 292px;  right: 109px; left: auto; }
#factors-1.slide img.bulle.b1-t 	{ top: 305px;  left: 77px; }
#factors-1.slide img.bulle.b1-t2 	{ top: 443px; left: 77px; }
/***/
#factors-2.slide img.bulle.b2	 	{ top: 292px;  right: 109px;left: auto;  }
#factors-2.slide img.bulle.b2-t 	{ top: 305px;  left: 77px; }
#factors-2.slide img.bulle.b2-t2 	{ top: 445px; left: 77px; }
#factors-2.slide img.bulle.b2-t3 	{ top: 590px; left: 77px; }
/***/
#factors-3.slide img.bulle.b3 		{ top: 292px;  right: 109px;left: auto;  }
#factors-3.slide img.bulle.b3-t 	{ top: 305px;  left: 77px; }
#factors-3.slide img.bulle.b3-t2 	{ top: 444px; left: 77px; }
#factors-3.slide img.bulle.b3-t3 	{ top: 685px; left: 77px; }
/***/
#factors-4.slide img.bulle.b4 		{ top: 292px;  right: 109px;left: auto;  }
#factors-4.slide img.bulle.b4-t 	{ top: 305px;  left: 77px; }
#factors-4.slide img.bulle.b4-t2 	{ top: 448px; left: 77px; }
#factors-4.slide img.bulle.b4-t3 	{ top: 640px; left: 77px; }
#factors-4.slide img.bulle.b4-t4 	{ top: 834px; left: 77px; }


/*** Throught - Resume ***/
#throught img.course 		{ top: 349px; left: 607px; }
#throught img.bulle.b1-t 	{ top: 672px; left: 82px; }
#throught img.bulle.b1-t2 	{ top: 342px; right: 96px; }
/***/
#throught img.bulle.b1 		{ top: 398px; left: 360px; }
#throught img.bulle.b2 		{ bottom: 171px; left: 716px; }
#throught img.bulle.b3 		{ top: 398px; left: 932px; }
#throught img.bulle.b4 		{ bottom: 171px; right: 320px; }
/*** throught - Slides ***/
#throught-1.slide img.bulle.b1 		{ top: 306px; left: 376px; }
#throught-1.slide img.bulle.b1-1 	{ top: 380px; left: 80px; z-index: 1; }
#throught-1.slide img.bulle.b1-t 	{ top: 380px; left: 80px; z-index: 2; }
#throught-1.slide img.bulle.b1-t2 	{ top: 358px; right: 61px; }
#throught-1.slide img.bulle.b1-t3 	{ top: 496px; right: 61px; }
/***/
#throught-3.slide img.bulle.b3-t2 	{ top: 358px; right: 80px; }
#throught-3.slide img.bulle.b3-t3 	{ top: 450px; right: 80px; }
#throught-3.slide img.bulle.b3-t4 	{ top: 690px; right: 80px; }


/*** Hair & Nail - Resume ***/
#hair-1 img.bulle.b1 		{ top: 300px; left: 176px; z-index: 1; }
#hair-1 img.bulle.b1-t 		{ top: 300px; left: 176px; z-index: 2; }
#hair-1 img.bulle.b1-t2 	{ top: 365px; right: 293px; }
#hair-1 img.bulle.b1-t3 	{ top: 572px; right: 293px; }
#hair-1 img.bulle.b1-t4 	{ top: 772px; right: 253px; }
/***/
#hair-2 img.bulle.b1 		{ top: 266px; left: 156px; z-index: 1; }
#hair-2 img.bulle.b2 		{ top: 556px; left: 458px; z-index: 2; }
#hair-2 img.bulle.b1-t  	{ top: 356px; right: 136px; left: auto; }
#hair-2 img.bulle.b1-t2 	{ top: 618px; right: 136px; left: auto; }
/***/
#hair-1-1 img.bulle.b1 		{ top: 308px; left: 228px; z-index: 2; }
#hair-1-1 img.bulle.b2 		{ top: 430px; left: 290px; z-index: 1; }
#hair-1-1 img.bulle.b1-t  	{ top: 288px; right: 138px; left: auto; }
#hair-1-1 img.bulle.b1-t2 	{ top: 452px; right: 138px; }
#hair-1-1 img.bulle.b1-t3 	{ top: 650px; right: 138px; }
#hair-1-1 img.bulle.b1-t4 	{ top: 750px; right: 138px; }
#hair-1-1 img.bulle.b1-t5 	{ top: 942px; right: 138px; }
/***/
#hair-2-1 img.bulle.b1 		{ top: 308px; right: 270px; z-index: 2; left: auto; }
#hair-2-1 img.bulle.b2 		{ top: 332px; right: 290px; z-index: 1; left: auto; }
#hair-2-1 img.bulle.b1-t  	{ top: 288px; left: 75px; }
#hair-2-1 img.bulle.b1-t2 	{ top: 452px; left: 75px; }
#hair-2-1 img.bulle.b1-t3 	{ top: 610px; left: 75px; }
#hair-2-1 img.bulle.b1-t4 	{ top: 806px; left: 75px; }


/*** Holistic - Resume ***/
#holistic-2 img.bulle.t1 			{ top: 220px; left: 150px; z-index: 1; }
#holistic-2 img.bulle.t2 			{ top: 380px; left: 150px; z-index: 1; }
/***/
#holistic-1 img.bulle.img1 			{ top: 88px; left: 860px; z-index: 2; }
#holistic-1 img.bulle.img1-2 		{ top: 228px; left: 860px; z-index: 2; }
#holistic-1 img.bulle.img2 			{ top: 400px; left: 192px; z-index: 2; }
#holistic-1 img.bulle.img3 			{ top: 400px; left: 558px; z-index: 2; }
#holistic-1 img.bulle.img4-1 		{ top: 560px; left: 842px; z-index: 2; }
#holistic-1 img.bulle.img4-2 		{ bottom: 15px; left: 836px; z-index: 2; }
#holistic-1 img.bulle.img4-3 		{ top: 638px; left: 854px; z-index: 2; }
#holistic-1 img.bulle.img5 			{ top: 400px; right: 208px; left: auto; z-index: 2; }
#holistic-1 img.bulle.img6 			{ top: 400px; right: 572px; left: auto; z-index: 2; }
#holistic-1 img.bulle.img7 			{ top: 20px; left: 472px; z-index: 1; }
/***/
#holistic-2 img.bulle.img-schema 	{ top: 142px; right: 118px; left: auto; z-index: 2; }
#holistic-2 img.bulle.img-bubulle 	{ top: 20px; right: 70px; left: auto; z-index: 1; }

#hair-1 .arrow-right {
	position: absolute;
	top: 480px; right: 30px;
}
#hair-2 .arrow-left {
	position: absolute;
	top: 480px; left: 30px;
}
#holistic-1 .arrow-right {
	position: absolute;
	top: 480px; right: 30px;
}
#holistic-2 .arrow-left {
	position: absolute;
	top: 480px; left: 30px;
}

#references-slide	{ top: 0px; left: 0; z-index: 7; }