#slideshow {
	position: relative;    /*le parent positionné*/
	width: 960px;          /*limite en largeur (1 élément du slideshow)*/
	height: 500px;         /*limite en hauteur*/
	margin: 0px auto;
	overflow: hidden;      /*on cache ce qui déborde*/
}

#sContent {
	position: absolute;   /*on sort l'élément du flux*/
	top: 0;               /*on le positionne précisément dans ...*/
	left: 0;              /*l'angle haut gauche de son parent positionné*/
	width: 2880px;		  /*ou 300% car 3 éléments*/
	margin: 0;            
	padding: 0;
	z-index: 10;
	
	/*CSS3 transition*/
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
#sContent li {
	display: inline;      /*on aligne les éléments du slideshow*/
}

.cadre{
	display: none;
	position: relative;
	z-index: 15;
}

#cadre1{ display: block; }

#indicateur{
	margin-top: 10px;
	width: 960px;
	height: 10px;
	position: absolute;
	top: 425px;
	left: 0;
	z-index: 999999999;
	text-align: center;
}
#indicateur ul{
	margin-top: 30px;
	list-style-type: none;
}
#indicateur li{
	display: inline-block;
}
#indic1{
	margin: 0px 10px 0px 10px;
	background-color: #000; /*#B2B2B2;*/
	height: 10px;
	width: 10px;
}
#indic2{
	margin: 0px 10px 0px 10px;
	background-color: #B2B2B2;
	height: 10px;
	width: 10px;
}
#indic3{
	margin: 0px 10px 0px 10px;
	background-color: #B2B2B2;
	height: 10px;
	width: 10px;
}
#slideshow .next, #slideshow .prev {
	position: absolute;
	top: 300px;
	z-index: 20;
}
#slideshow .prev { left: 3px; }
#slideshow .next { right: 3px; }

/* initialisation */
#slideshow .next, #slideshow .prev { display: none; }
#slideshow .next1 { display: block; }

/* Vers 1ère étape */
#s1:target #sContent { left: 0px; }
#s1:target .next, #s1:target .prev { display: none; }
#s1:target .next1 { display: block; }

/* Vers 2ème étape */
#s2:target #sContent { left: -960px; } /*ou -100%*/
#s2:target .next, #s2:target .prev { display: none; }
#s2:target .next2, #s2:target .prev2 { display: block; }

/* Vers 3ème étape */
#s3:target #sContent { left: -1920px; } /*ou -200%*/
#s3:target .next, #s3:target .prev { display: none; }
#s3:target .prev3 { display: block; }

#s1:target .next1 ~ #indicateur li#indic1{ background-color: #000; }

#s2:target .next2 ~ #indicateur li{ background-color: #B2B2B2; }
#s2:target .next2 ~ #indicateur li#indic2{ background-color: #000; }

#s3:target .next2 ~ #indicateur li{ background-color: #B2B2B2; }
#s3:target .next2 ~ #indicateur li#indic3{ background-color: #000; }

#s2:target .next2 ~ .cadre{ display: none; }
#s2:target .next2 ~ #cadre2{ display: block; }

#s3:target .next2 ~ .cadre{ display: none; }
#s3:target .next2 ~ #cadre3{ display: block; }

/*html {
	margin: 0px;
	padding: 0px;
	overflow-x: hidden;
	overflow-y: hidden;
	border: 0px none;
}

body {
	margin: 0px;
	padding: 0px;
	border: 0px none;
	overflow-x: hidden;
	overflow-y: hidden;
	width: 960px;
	height: 520px;
}*/