@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translateX(-100px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}


.fadeIn {
    will-change: opacity, transform;
    opacity: 0;
    transform: translateX(0);
}

.fadeIn.show {
    animation: fadeIn .250s ease-out forwards;
}

.fadeLeft {
    will-change: opacity, transform;
    opacity: 0;
    transform: translateX(0);
}

.fadeLeft.show {
    animation: fadeLeft .250s ease-out forwards;
}

@media all and (max-width: 768px) {
    .fadeIn.notMobile {
        opacity: 1;
    }
    .fadeIn.notMobile.show {
        animation: none;
    }
    .fadeLeft.notMobile {
        opacity: 1;
    }
    .fadeLeft.notMobile.show {
        animation: none;
    }
}
