.swiper-wrapper{
    z-index: 0;
}
.swiper-slide {
    background: transparent no-repeat center center / cover;
}
.swiper-slide .screen{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    mix-blend-mode: multiply;
    background-color: rgba(0,0,0,0.7);
    box-shadow: 0px -250px 200px -50px rgba(0, 0, 0, .25) inset;
    animation: swiper-slide_fadeout .1s linear 0s forwards;
}
.swiper-slide-active .screen{
    background-color: rgba(0,0,0,0.7);
    animation: swiper-slide_fadein .5s linear 0s forwards;
}
@keyframes swiper-slide_fadein{
    0% {
        background-color: rgba(0,0,0,0.7);
    }
    100% {
        background-color: rgba(0,0,0,.5);
    }
}
@keyframes swiper-slide_fadeout{
    0% {
        background-color: rgba(0,0,0,.5);
    }
    100% {
        background-color: rgba(0,0,0,0.7);
    }
}
  
.description{
    opacity: 0;
    margin-left: 10px;
    animation: description_fadeout .1s linear 0s forwards;
}

.swiper-slide-active .description{
    animation: description_fadein .5s linear .4s forwards;
}
@keyframes description_fadein{
    0% {
        margin-left: 10px;
        opacity: 0;
    }
    100% {
        margin-left: 0;
        opacity: 1;
    }
}
@keyframes description_fadeout{
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.next_attempt{
    opacity: 0;
    margin-right: -10px;
    animation: next_attempt_fadeout .1s linear 0s forwards;
}
.swiper-slide-active .next_attempt{
    animation: next_attempt_fadein .5s linear .8s forwards;
}
@keyframes next_attempt_fadein{
    0% {
        margin-right: -10px;
        opacity: 0;
    }
    100% {
        margin-right: 0;
        opacity: 1;
    }
}
@keyframes next_attempt_fadeout{
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}