/*HOME
-------------------------------------------------- */

.hidden-on-load {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 1s ease-out, transform 1s ease-out;
}

.visible {
    opacity: 1;
    transform: translateY(0);
}




/* Entry animation styles
-------------------------------------------------- */
.entry {
    /* Slide up */
    &.entry-slideUp {
        transform: translateY(32px);
        transition: transform .8s ease, opacity .8s ease;
        opacity: 0;

        &.entry-active {
            transform: translateY(0);
            opacity: 1;
        }
    }

    /* Slide down */
    &.entry-slideDown {
        transform: translateY(-32px);
        transition: transform .4s ease, opacity .4s ease;
        opacity: 0;

        &.entry-active {
            transform: translateY(0);
            opacity: 1;
        }
    }

    /* Slide left */
    &.entry-slideLeft {
        transform: translateX(32px);
        transition: transform .4s ease, opacity .4s ease;
        opacity: 0;

        &.entry-active {
            transform: translateX(0);
            opacity: 1;
        }
    }

    /* Slide right */
    &.entry-slideRight {
        transform: translateX(-32px);
        transition: transform .4s ease, opacity .4s ease;
        opacity: 0;

        &.entry-active {
            transform: translateX(0);
            opacity: 1;
        }
    }

    /* Fade in */
    &.entry-fadeIn {
        transition: opacity .5s ease;
        opacity: 0;

        &.entry-active {
            opacity: 1;
        }
    }
}