/*pour le saut de page, on cree une class que l'on met en display:none*/
.target{

display: none

}


/* englobe le slider */

.cadre_diapo2{

max-width: 800px; 
margin: 2rem auto;
overflow: hidden;

}

.interieur_diapo2{

display: flex;
width: 500%;
transition: transform .6s ease-in-out

}




#page1:target ~ .cadre_diapo2 .interieur_diapo2{

transform:translatex(0)

}/*image 1*/

#page2:target ~ .cadre_diapo2 .interieur_diapo2{

transform:translatex(-20%)

}/*image 2*/

#page3:target ~ .cadre_diapo2 .interieur_diapo2{

transform:translatex(-40%)

}/*image 3*/

#page4:target ~ .cadre_diapo2 .interieur_diapo2{

transform:translatex(-60%)

}/*image 4*/

#page5:target ~ .cadre_diapo2 .interieur_diapo2{

transform:translatex(-80%)

}/*image 5*/




/*navigation avec images miniatures*/
.navigation_diapo2{

display: flex; /*permet d'aligner les photos les unes à la suite des autres, on peut aussi utiliser le positionnement absolu*/
list-style-type: none;
margin: 0;
padding: 0

}




@media (min-width:31.25rem){

.description2 span{

font-size: initial
	
	}}