div#haut ul h2 {
    display: block;
    text-align: center;
}

div#bas {
    margin-left: 3%;
    margin-right: 3%;
    text-align: center;
}

#bas ul li{
    display: block;
}

#bas ul a .img {
    height: 400px;
    display: block;
    margin: auto;
}

.slide-cadre {
    --width: 400px;
    position: relative;
    box-sizing: border-box;
    width: var(--width);
    margin: 0 auto !important;
    max-width: 100%;
    border: 6px solid #FFF;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 1px 1px 20px #888;
}

.slide-cadre ul {
    display: flex;
    position: relative;
    width: var(--width);
    height: 300px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.slide-cadre img {
    display: block;
    width: 400px;
    height: 300px;
}
/*-- pour visualiser l'image en cours --*/
.slide-liste li {
    position: relative;
}

.anim {
    animation: slide-image 21s infinite;
}

@keyframes slide-image {
    0%, 9.52% { 
        transform: translate3d(0,0,0);
    }
    14.29%, 23.81% {
        transform: translate3d(-100%,0,0);
    }
    28.57%, 38.10% {
        transform: translate3d(-200%,0,0);
    }
    42.86%, 52.38% {
        transform: translate3d(-300%,0,0);
    }
    57.14%, 66.67% {
        transform: translate3d(-400%,0,0);
    }
    71.43%, 80.95% {
        transform: translate3d(-500%,0,0);
    }
    85.71%, 95.24% {
        transform: translate3d(-600%,0,0);
    }
    100% {
    transform: translate3d(-700%,0,0);
    }
}