.caro {
    background: #ffffff;
    max-width: 800px;
    left: 30%;
    transform: translateX(-50%);
    z-index: 0;
    position: relative;
    -webkit-box-shadow: 0 25px 50px -10px rgba(26, 55, 77, 0.4);
    box-shadow: 0 25px 50px -10px rgba(26, 55, 77, 0.4);
    height: 608px;
    border-radius: 10px;
}

@media (max-width: 991.98px) {
    .caro {
        left: 0;
        transform: none;
    }
}

.caro img {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: 4s opacity ease;
    -o-transition: 4s opacity ease;
    transition: 4s opacity ease;
    background: #ffffff;
    border-radius: 10px;
}

    .caro img.active {
        opacity: 1;
        z-index: 1;
    }