.reveal {
    opacity: 0;
    transition: 1s
}

.clickable.delay,.reveal.delay {
    transition-delay: 1s
}

.up_to_down {
    transform: translateY(-75px)
}

.right_to_left {
    transform: translateX(75px)
}

.left_to_right {
    transform: translateX(-75px)
}

.down_to_up {
    transform: translateY(75px)
}

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

@media screen and (max-width: 550px) {
    .right_to_left {
        transform: translateY(75px)
    }
    
    .left_to_right {
        transform: translateY(-75px)
    }
}