
body{
color:black;
 background-color:rgb(237,20,20);
 background-image:url('https://www.dcplanet.fr/wp-content/uploads/2022/10/the-flash-banniere.jpg');
    background-repeat: no-repeat; /* par défaut, l'image ne se répétera pas */
    background-size: 900px;
    background-position: top; /* Centrer l'image */
	 margin: 0; /* Supprimer les marges par défaut du corps */
    padding: 0; /* Supprimer les rembourrages par défaut du corps */
    height:750vh;

    /* Autres styles pour le corps */
    margin: 0; /* Supprimer les marges par défaut du corps */
    padding: 0; /* Supprimer les rembourrages par défaut du corps */
    height: 100vh;
    
}


h1{color:red;
font-size:55px;
font-family:cursive;
text-decoration:underline;


	
}
h2{
color:red;
font-size:30px;
font-family:cursive;

	
}
p{
font-family:cursive;	
color:black;
font-size:20px;	
text-align:center;
	
}

.element1{
margin:17%;
background-color:yellow	;
text-align:center;

}
li{
	font-size:20px;
	text-align:left;
	color:black;
	font-family:cursive;
}
.slideshow {
    position: relative;
    width: 100%;
    max-width: 600px;
    margin: auto;
    overflow: hidden;
	left:40px;
}

.slides {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.slide {
    min-width: 100%;
    position: relative;
}

img {
    width: 100%;
    height: auto;
}

.description {
    position: absolute;
    bottom:15px;
    bottom:15px;
    left: 0%;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    padding: 10px;
    box-sizing: border-box;
	font-size:29px;
	font-family:cursive;
}

input[type="radio"] {
    display: none;
}

.additional-images {
    display: block;
    justify-content: space-around;
    margin-top: 20px;
}

.additional-images img {
    width: 250px;
    height:auto;
	margin-right: auto;
	
}

.dot {
    height: 15px;
    width: 15px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}


#slide1:checked ~ .slides { transform: translateX(0%); }
#slide2:checked ~ .slides { transform: translateX(-100%); }
#slide3:checked ~ .slides { transform: translateX(-200%); }
#slide4:checked ~ .slides { transform: translateX(-300%); }
#slide5:checked ~ .slides { transform: translateX(-400%); }
#slide6:checked ~ .slides { transform: translateX(-500%); }
#slide7:checked ~ .slides { transform: translateX(-600%); }


#slide1:checked ~ .navigation #dot1 { background-color: #717171; }
#slide2:checked ~ .navigation #dot2 { background-color: #717171; }
#slide3:checked ~ .navigation #dot3 { background-color: #717171; }
#slide4:checked ~ .navigation #dot4 { background-color: #717171; }
#slide5:checked ~ .navigation #dot5 { background-color: #717171; }
#slide6:checked ~ .navigation #dot6 { background-color: #717171; }
#slide7:checked ~ .navigation #dot7 { background-color: #717171; }









#slide7:checked ~ .slides { transform: translateX(0%); }
#slide8:checked ~ .slides { transform: translateX(-100%); }
#slide9:checked ~ .slides { transform: translateX(-200%); }
#slide10:checked ~ .slides { transform: translateX(-300%); }
#slide11:checked ~ .slides { transform: translateX(-400%); }
#slide12:checked ~ .slides { transform: translateX(-500%); }

#slide7:checked ~ .navigation #dot7 { background-color: #717171; }
#slide8:checked ~ .navigation #dot8 { background-color: #717171; }
#slide9:checked ~ .navigation #dot9 { background-color: #717171; }
#slide10:checked ~ .navigation #dot10 { background-color: #717171; }
#slide11:checked ~ .navigation #dot11 { background-color: #717171; }
#slide12:checked ~ .navigation #dot12 { background-color: #717171; }


