@keyframes fadeInUp {
from {
opacity: 0;
transform: translate3d(0, 100%, 0);
}
to {
opacity: 1;
transform: translate3d(0, 0, 0);
}
} @keyframes fadeOutDown {
from {
opacity: 1;
transform: translate3d(0, 0, 0);
}
to {
opacity: 0;
transform: translate3d(0, 100%, 0);
}
} .scroll-fade-element {
will-change: opacity, transform;
} .scroll-fade-element.is-scrolling {
animation: fadeOutDown 0.4s ease-out forwards;
} .scroll-fade-element.is-stopped {
animation: fadeInUp 0.4s ease-out forwards;
}