





/* robots & logo */

#robot, #logo  {
	position: absolute; /*absolute*/
	left:-180px; top: 300px;/*left: -180px; top: 300px;*/
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-ms-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	transform: rotate(10deg);
	-webkit-transition: all 1.4s cubic-bezier(.49,.22,.52,1);
	-moz-transition: all 1.4s cubic-bezier(.49,.22,.52,1);
	-ms-transition: all 1.4s cubic-bezier(.49,.22,.52,1);
	-o-transition: all 1.4s cubic-bezier(.49,.22,.52,1);
	transition: all 1.4s cubic-bezier(.49,.22,.52,1);
}

#robot{
z-index:100;
}

#logo {/*uniquement pour le logo, ne modifie pas le robot*/
	left: -280px;/*left: -280px;*/
	top: 350px;/*top: 400px*/
	width: 200px;/*width: 250px*/
	height: 200px;/*height: 400px*/
	z-index: 90
}

/* Wrapper */ 
#wrap {/* Gère le défilement des pages vers le bas */
	position: relative;
	top: 0;
	-webkit-transition: top 1.3s cubic-bezier(.49,.22,.52,1); /* les secondes gèrent le temps de défilement des pages vers le bas */
	-moz-transition: top 1.3s cubic-bezier(.49,.22,.52,1.35);
	-ms-transition: top 1.3s cubic-bezier(.49,.22,.52,1.35);
	-o-transition: top 1.3s cubic-bezier(.49,.22,.52,1.35);
	transition: top 1.3s cubic-bezier(.49,.22,.52,1.35);
}

#slide1, #slide2, #slide3, #slide4, #slide5    {
	height: 1000px;	
	padding-top:100px;
	-webkit-transition: background-position 1.4s  cubic-bezier(.49,.22,.52,1);/* pour Chrome et Safari */
	-moz-transition: background-position 1.4s cubic-bezier(.49,.22,.52,1.35);/* pour Firefox */
	-ms-transition: background-position 1.4s  cubic-bezier(.49,.22,.52,1.35);
	-o-transition: background-position 1.4s  cubic-bezier(.49,.22,.52,1.35);/* pour Opera */
	transition: background-position 1.4s  cubic-bezier(.49,.22,.52,1.35);
}

/* targeted elements */
/*les child servent à sélectionner et éclairer le menu*/

#s1:target ~ #wrap { top:0px; }/* Défilement des éléments qui flottent sur les backgrounds - Les px correspondent au % de défilement */
#s1:target ~ #wrap #nav li:first-child a { text-shadow: 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603; }
#s1:target ~ #wrap #slide1 { background-position: 50% 0%; }/* #s1:target ~ #wrap #slide1 { background-position: 50% 0%; }*/
#s1:target ~ #wrap #slide2 { background-position: 50% -35%; }/* #s1:target ~ #wrap #slide2 { background-position: 50% -35%; }*/
#s1:target ~ #wrap #slide3 { background-position: 50% -60%; }/* #s1:target ~ #wrap #slide3 { background-position: 50% -60%; }*/
#s1:target ~ #wrap #slide4 { background-position: 50% -85%; }/* #s1:target ~ #wrap #slide4 { background-position: 50% -85%; }*/
#s1:target ~ #wrap #slide5 { background-position: 50% -100%; }
#s1:target ~ #wrap #robot { left:-250px; top:250px; -webkit-transform: rotate(10deg);-moz-transform: rotate(10deg);-ms-transform: rotate(10deg);-o-transform: rotate(10deg);transform: rotate(10deg); }
#s1:target ~ #wrap #logo { left: -300px; top: 150px;?>;-webkit-transform: rotate(10deg);-moz-transform: rotate(10deg);-ms-transform: rotate(10deg);-o-transform: rotate(10deg);transform: rotate(10deg); }


#s2:target ~ #wrap { top:-1100px; }/* top:-1150px*/
#s2:target ~ #wrap #nav li:first-child + li a { text-shadow: 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603; }
#s2:target ~ #wrap #slide1 { background-position: 50% 35%; }/* #s2:target ~ #wrap #slide1 { background-position: 50% 36%; }*/
#s2:target ~ #wrap #slide2 { background-position: 50% 0%; }/* #s2:target ~ #wrap #slide2 { background-position: 50% 0%; }*/
#s2:target ~ #wrap #slide3 { background-position: 50% -35%; }/* #s2:target ~ #wrap #slide3 { background-position: 50% -30%; }*/
#s2:target ~ #wrap #slide4 { background-position: 50% -60%; }/* #s2:target ~ #wrap #slide4 { background-position: 50% -60%; }*/
#s2:target ~ #wrap #slide5 { background-position: 50% -85%; }
#s2:target ~ #wrap #robot { left: -250px; top: 1300px; -webkit-transform: rotate(-7deg);-moz-transform: rotate(-7deg);-ms-transform: rotate(-7deg);-o-transform: rotate(-7deg);transform: rotate(-7deg); }
#s2:target ~ #wrap #logo { left: -100px; top: 1250px; -webkit-transform: rotate(25deg);-moz-transform: rotate(25deg); -ms-transform: rotate(25deg); -o-transform: rotate(25deg);transform: rotate(25deg); }


#s3:target ~ #wrap { top:-2200px; }
#s3:target ~ #wrap #nav li:nth-child(3) a { text-shadow: 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603; }
#s3:target ~ #wrap #slide1 { background-position: 50% 60%; }/* #s3:target ~ #wrap #slide1 { background-position: 50% 60%; }*/
#s3:target ~ #wrap #slide2 { background-position: 50% 35%; }/* #s3:target ~ #wrap #slide2 { background-position: 50% 35%; }*/
#s3:target ~ #wrap #slide3 { background-position: 50% 0%; }/* #s3:target ~ #wrap #slide3 { background-position: 50% 0%; }*/
#s3:target ~ #wrap #slide4 { background-position: 50% -35%; }/* #s3:target ~ #wrap #slide4 { background-position: 50% -35%; }*/
#s3:target ~ #wrap #slide5 { background-position: 50% -60%; }
#s3:target ~ #wrap #robot { left: 550px;top:2400px;-webkit-transform:rotate(25deg);-moz-transform:rotate(25deg);-ms-transform:rotate(25deg);-o-transform:rotate(25deg);transform: rotate(25deg); }
#s3:target ~ #wrap #logo { left:-250px;top:200px;-webkit-transform: rotate(-15deg);-moz-transform: rotate(-15deg);-ms-transform: rotate(-15deg);-o-transform: rotate(-15deg);transform: rotate(-15deg); }


#s4:target ~ #wrap { top:-3300px; }
#s4:target ~ #wrap #nav li:nth-child(4) a { text-shadow: 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603; }
#s4:target ~ #wrap #slide1 { background-position: 50% 85%; }/* #s3:target ~ #wrap #slide1 { background-position: 50% 60%; }*/
#s4:target ~ #wrap #slide2 { background-position: 50% 60%; }/* #s3:target ~ #wrap #slide2 { background-position: 50% 35%; }*/
#s4:target ~ #wrap #slide3 { background-position: 50% 35%; }/* #s3:target ~ #wrap #slide3 { background-position: 50% 0%; }*/
#s4:target ~ #wrap #slide4 { background-position: 50%  0%; }/* #s3:target ~ #wrap #slide4 { background-position: 50% -35%; }*/
#s4:target ~ #wrap #slide5 { background-position: 50%  -15%; }
#s4:target ~ #wrap #robot { left:-250px;top:3500px;-webkit-transform:rotate(-7deg);-moz-transform:rotate(-7deg);-ms-transform:rotate(-7deg);-o-transform:rotate(-7deg);transform: rotate(-7deg); }
#s4:target ~ #wrap #logo { left:-250px;top: 200px;-webkit-transform: rotate(25deg);-moz-transform: rotate(25deg);-ms-transform: rotate(25deg);-o-transform: rotate(25deg);transform: rotate(25deg); }


#s5:target ~ #wrap { top:-4400px; }
#s5:target ~ #wrap #nav li:last-child a { text-shadow: 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603, 0 0 10px #eca603; }
#s5:target ~ #wrap #slide1 { background-position: 50% 85%; }/* #s3:target ~ #wrap #slide1 { background-position: 50% 60%; }*/
#s5:target ~ #wrap #slide2 { background-position: 50% 60%; }/* #s3:target ~ #wrap #slide2 { background-position: 50% 35%; }*/
#s5:target ~ #wrap #slide3 { background-position: 50% 35%; }/* #s3:target ~ #wrap #slide3 { background-position: 50% 0%; }*/
#s5:target ~ #wrap #slide4 { background-position: 50%  0%; }/* #s3:target ~ #wrap #slide4 { background-position: 50% -35%; }*/
#s5:target ~ #wrap #slide5 { background-position: 50%  0%; }
#s5:target ~ #wrap #robot { left:-120px;top:4600px;-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-ms-transform:rotate(10deg);-o-transform:rotate(10deg);transform: rotate(10deg); }
#s5:target ~ #wrap #logo { left:-250px;top: 300px;-webkit-transform: rotate(-15deg);-moz-transform: rotate(-15deg);-ms-transform: rotate(-15deg);-o-transform: rotate(-15deg);transform: rotate(-15deg); }


/* some social styles */

.fb-like { top: -5px; }
.or_follow { display: inline-block; vertical-align:top; margin-left: 135px; margin-right: 5px; }
