.bp-carrusel {
    position: relative;
    margin: 50px 0;
    background: #111;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,.15);
}

.bp-slides {
    position: relative;
}

.bp-slide {
    display: none;
    animation: fade .45s;
}

.bp-slide img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    object-position: center center;
    display: block;
    transition: transform .4s;
}

.bp-slide:hover img {
    transform: scale(1.02);
}

.bp-prev,
.bp-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 54px;
    height: 54px;
    border: none;
    border-radius: 50%;
    background: rgba(0,0,0,.55);
    color: #fff;
    cursor: pointer;
    font-size: 22px;
    z-index: 20;
    opacity: .2;
    transition: .3s;
}

.bp-prev {
    left: 20px;
}

.bp-next {
    right: 20px;
}

.bp-prev:hover,
.bp-next:hover {
    background: #9d0b0e;
}

.bp-carrusel:hover .bp-prev,
.bp-carrusel:hover .bp-next {
    opacity: 1;
}

@keyframes fade {
    from {
        opacity: .4;
    }
    to {
        opacity: 1;
    }
}