  /* SLIDER  */
  .slider,.slider_home{
    height: calc(100vh - 160px);
}
.slider h1,.slider_home h1{
    font-size: 5rem;
    padding-bottom: 60px ; 
}
#ctn_title_cta h1,#ctn_title_cta h2{
    text-align: center;
}
#ctn_title_cta h2{
    text-align: center;
    font-size: 3rem;
    padding-bottom: 30px;
    line-height: 60px;
}
.slider video{
    height: 100vh;
    object-fit: cover;
    z-index: -1;
}
#ctn_cta{
    bottom: 150px;
    z-index: 1;
}
#ctn_cta .btn{
   width: max-content;
}
#ctn_cta{
    bottom: 150px;
    z-index: 1;
}
#ctn_fleche{
    bottom: 0px;
    z-index: 1;
    width: 100%;
}
#ctn_fleche img{
    width: 50px;
    /* animation: annimate_scrall 2s linear infinite; */
}
#ctn_fleche>a{   
display: inline-block;
padding: 15px;
}
div[role=button]:active, input[type=submit]:active{
    transform: scale(.90);
}
/* FIN SLIDER  */

/* slider mobile*/
.img_slider .darkened_image img{
    object-fit: cover;
    object-position: center;
    height: 100vh;
    width: 100%;
}
.darkened_image,video.darkened_image{/*pour assombrir l'image sans mettre le titre dans avec un z-index qui affiche le titre sur tout les slides*/
    background: url(img/filtre.webp) no-repeat center;
    background-size: 100%;
}
.darkened_image{/*pour assombrir l'image sans mettre le titre dans avec un z-index qui affiche le titre sur tout les slides*/
    filter: brightness(95%);
}
.darkened_image::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background:var(--color1);
    z-index: 1;
    opacity: .15;
}
video.darkened_image{
    filter: brightness(70%)
}
.img_slider .darkened_image {
    height: 100%;
    width: 100%;
}
.img_slider:not([class*="active"]) .title_slider {
    opacity: 0;
}
.img_slider div:last-child{
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
}
.img_slider div[role="button"]{
    height: max-content;
    position: absolute;
}
.img_slider div[role="button"] a{
    bottom:60px;
    margin-left: -150px;
    font-size: 3rem;   
}
.title_slider{
    transition: all ease-in-out .5s;
}
.img_slider{
    height: 100%;
    width: 100%; 
    top: 0;
    left: 0;  
    opacity: 0;
    transition: opacity 2s; 
}
.img_slider.active{
    opacity: 1; 
}
.active .title_slider{
    opacity: 1;
} 
.slider_home .img_slider{
    width: 100%;
    height: 100%;
}
.slider_home div[role="button"],.slider div[role="button"]{
    top: 80%;
    z-index: 3;
    padding: 30px 50px;
}
.slider_home div[role="button"]>a,.slider div[role="button"]>a{
    display: inline-block;
}
.precedent,.suivant{
    background: url(../img/next_fleche.webp) no-repeat center ;
    background-position: center;
    background-size: 50%;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    background-color:var(--color1) ;
    cursor: pointer;
    padding: 24px;
    opacity: 0;
    transition: all ease-in-out .3s;
}
/* div qui contient les commandes  */
.ctn_cmd_slider_suivant,.ctn_cmd_slider_precedent{
    height: 100%;
    width: 100px;
    display: flex;
    justify-content: center;
    align-items: center; 
    z-index: 3;
}
.ctn_cmd_slider_suivant{
    top: 0;
    right: 0;
}
.ctn_cmd_slider_precedent{
    top: 0;
    left: 0;
}
.suivant{
    right: 5vh;
} 
.precedent{
    transform: rotate(180deg);   
} 
.ctn_cmd_slider:hover>div{
    opacity: 1;
}
/*  fin div qui contient les commandes  */

/* fin slider mobile */ 

/* les CTA */
#ctn_title_cta{
    height:calc(100vh - 354px); 
    top:100px;
    z-index: 0;
}


#ctn_fleche img {
    height: 40px;
    width: 40px;
    transform: rotate(90deg);
}
/* fin les CTA */

@media screen and (max-width: 767px) {

}
@media screen and (max-width: 650px) {
    .slider h1,.slider_home h1{
    font-size: 3rem;
    }
      #ctn_title_cta div > h2 {
        font-size: 2.3rem;
    } 
}
@media screen and (max-width: 400px) {
    .slider h1,.slider_home h1{
    font-size: 2.5rem;
    }
}