.scroll-in-fade-in .frame {
    opacity: 0;
    transition: opacity .4s ease-in-out;
}

.scroll-in-fade-in .frame.isInViewport {
    opacity: 1;
}

.scroll-in-slide-from-right .content>.frame {
    opacity: 0;
    transition: all .4s ease-out;
    transform: translate(5rem);
}

.scroll-in-slide-from-right .content>.frame.isInViewport {
    opacity: 1;
    transition: all .4s ease-out;
}

.scroll-in-slide-from-left .content>.frame {
    opacity: 0;
    transition: all .4s ease-out;
}

.scroll-in-slide-from-left .content>.frame.isInViewport {
    opacity: 1;
    transition: all .4s ease-out;
    transform: translate(0);
}

.scroll-in-slide-from-below .content>.frame {
    opacity: 0;
    transition: all .4s ease-out;
    transform: translate(0,5rem);
}

.scroll-in-slide-from-below .content>.frame.isInViewport {
    opacity: 1;
    transition: all .4s ease-out;
    transform: translate(0,0);
}