* {
    box-sizing: border-box
}

.image-slideshow {
    width: 100%;
    max-height: 40%;
    position: relative;
    margin-top: 10%;
    /* background: linear-gradient(rgba(0, 0, 0, 0.5) 100%, rgba(0, 0, 0, 0.5) 100%, url('assets/img/hero-carousel/hero-carousel-3.svg')); */
    /* background: url('assets/img/hero-carousel/hero-carousel-3.svg'), linear-gradient(to bottom, #fafafc, #a3d1fa); */
}

.fade img {
    width: 100%
}

.fade {
    position: relative;
    animation-name: fade;
    animation-duration: 2s;
}

.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@keyframes fade {
    from {
        opacity: .5
    }
    to {
        opacity: 1
    }
}