/* desgin du caroussel */

#carousel-container {
    width: 250px;
    height: 150px;
    position: relative;
    margin: 50px auto 0;
    border-radius: 15px;
}

#carousel-container>div:first-child {
    overflow: hidden;
    max-width: 100%;
    margin: 0;
    border-radius: 15px;
}

.carousel {
    z-index: 1;
}

#carousel {
    width: 250px;
    height: 150px;
    padding: 0;
    margin: 0;
}

.animate {
    -webkit-transition-duration: .5s;
    -moz-transition-duration: .5s;
    -o-transition-duration: .5s;
    transition-duration: .5s;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
}

.slide {
    list-style: none;
    position: relative;
    float: left;
    transform: translateX(-500px);
    width: 250px;
    height: 150px;
    border-radius: 15px;
}

#controls {
    position: absolute;
    width: 375px;
    top: calc( 50% - 25px);
    margin: 0 -70px;
    z-index: -1;
}

#controls span {
    width: 50px;
    cursor: pointer;
    opacity: 0.3;
    padding-right: 40px;
}

#controls span:hover {
    opacity: 1;
}

#prev {
    float: left;
}

#next {
    float: right;
}

#carousel li img {
    width: 250px;
    height: 150px;
}


/* ---------- */


}