* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

section {
    /*background: #eee;
    padding: 40vh 10%;
    overflow: hidden;*/
}

    /*section p {
        color: rgba(0, 0, 0, 0.5) !important;
        font-weight: 100;
        font-size: 36pt;
    }*/

.module {
    position: relative;
    float: left;
    /*margin: 5%;*/
    opacity: 0;
}

    .module:nth-child(even) {
        margin-right: 0;
    }

.come-in {
    transform: translateX(-300px);
    animation: come-in 2s cubic-bezier(0, -0.01, 0, 0.99) forwards;
}

.come-in2 {
    transform: translateX(300px);
    animation: come-in2 2s cubic-bezier(0, -0.01, 0, 0.99) forwards;
}

.come-in3 {
    transform: translateY(500px);
    animation: come-in3 2s cubic-bezier(0, -0.01, 0, 0.99) forwards;
}

.come-in:nth-child(odd) {
    animation-delay: 0.1s;
    animation-duration: 0.75s;
}

.come-in2:nth-child(odd) {
    animation-delay: 0.1s;
    animation-duration: 0.75s;
}

.come-in3:nth-child(odd) {
    animation-delay: 0.1s;
    animation-duration: 0.75s;
}

.leave {
    transform: translateX(150px);
    animation: leave 0.5s cubic-bezier(0, -0.01, 0, 0.99) forwards;
}

    .leave:nth-child(odd) {
        animation-delay: 0.1s;
        animation-duration: 0.75s;
    }

.already-visible {
    transform: translateY(0);
    animation: none;
    opacity: 1;
}

@keyframes come-in {
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes come-in2 {
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes come-in3 {
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes leave {
    to {
        transform: translateX(-150);
        opacity: 0;
    }
}