body{
    margin: 0;
    height: 400vh;
}

.parallax{
    height: 142vh;
    position: relative;
    overflow: hidden;
}

.parallax__bg, .parallax__layer{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.parallax__bg{
    z-index: 1;
  --parallax-speed: 0.4;

}

.parallax__layer--2 {
  z-index: 3;
  --parallax-speed: -1;
  opacity: 165%;
}


.parallax__layer--3{
    z-index: 6;
    --parallax-speed: 0.8;
}

.parallax__layer--4{
    z-index: 7;
    --parallax-speed: 0.52;
}

.parallax__layer--5{
    z-index: 8;
    --parallax-speed: 0.14;
}

.parallax__layer--6{
   z-index: 2;
  --parallax-speed: 0.7;
  opacity: 40%;
}


.parallax__layer--7{
    z-index: 9;
    --parallax-speed: 0.33;  
}

.parallax__layer--8{
    z-index: 7;
    --parallax-speed: 0.2;
    
}

.parallax__layer--10{
    z-index: 9;
    --parallax-speed: 0.2;
    opacity: 70%;
}

.parallax__layer--11{
    z-index: 10;
    --parallax-speed: 0.15; 
}



.parallax__layer--12{
     position: relative;
     z-index: 1;
     --parallax-speed: 1.5;

    filter: drop-shadow(0px 4px 0 rgb(36, 35, 35));
}


h1{
  color: white;  
  text-align: center;
  margin: 20px 0;
  font-size: 2em;
}

.menu{
  background-image: url(../images/046\ \(1\).jpg);
  ;   
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: cover;       /* couvre tout le conteneur */
    background-position: center;  /* centrée */
    background-repeat: no-repeat; /* pas de répétition */
    width: 100%;                  /* prend toute la largeur */
    height: 178vh;
 
} 




.caroussel{
  overflow: hidden;
  border: 10px solid rgba(164,159,79,0.53);
border-radius: 18px;
-webkit-box-shadow: 2px 3px 9px 6px #F2FF25; 
box-shadow: 2px 3px 9px 6px #F2FF25; 

margin: 133px;
  
  margin-top: -428px;
  width: 100%;
}

 
  



.caroussel figure{
  display: flex;
  justify-content: flex-start; 
  position: relative;
	width: 500%; 
	margin: 0;
	left: 0;
  animation: 9s slideCaroussel infinite;
}

.caroussel figure img{
  width: 20%;
  float: right;
}

@keyframes slideCaroussel {
  0% {
		left: 0;
	}
  33%{
    left: -100%;
  }
  66%{
    left: -200%;
  }

  

}


video {
    height: 108vh;
    width: 100%;
    object-fit: fill;
    
}

#cards {
    height: 709px;
  border-radius: 79px;
  width: 85%;
  display: flex;
  gap: 5px;
  padding: 6px;
  justify-content: space-between;
}


#cards .card-items {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex:1;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    text-decoration: none;
    color: white;
    filter: grayscale(100%);
     transition: all .5s;
}
section {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 95vh;
    margin-top: -849px;
    }

#cards .card-items:hover{filter:none;
                        flex:5;}


#cards .card-items h1{color:rgb(65, 63, 63);
                        transform: rotate(-90deg);
                        transition: all .5s;
                    }

#cards .card-items:hover h1{transform:rotate(0);}

#cards .card-items:nth-child(1) {
    background-image: url(../images/014.png);
}

#cards .card-items:nth-child(2) {
    background-image: url(../images/020.png);
}

#cards .card-items:nth-child(3) {
    background-image: url(../images/023.png);
}

#cards .card-items:nth-child(4) {
    background-image: url(../images/031.png);
}

#cards .card-items:nth-child(5) {
    background-image: url(../images/033.png);
}

#cards .card-items:nth-child(6) {
    background-image: url(../images/025.png);
}