* {
    margin:0;
    padding:0;
    box-sizing:border-box;
     
}
.container{
    width:80%;
   
}
.slider {
    height:50vh;
    position:relative;
    text-align:center;
}

.slider img {
    
        object-fit:cover;
        height:100%;
        width:100%;
        position:absolute;
        top:0;
        left:0;
        opacity: 0;
        transition:opacity .5s;

}

.slider img.active {
    opacity:1;
}
.suivant, .precedent {
    color:#fff;
    font-size:3rem;
    position:absolute;
    top:50%;
    transform: translateY(-50%);
    cursor:pointer;
    
}

.suivant {
    
    right:1rem;
}
.precedent{
    left:1rem;
}