/*-- Effects onscroll --*/
.fade-up{
    -webkit-transform: translate3d(0, 100px, 0);
    -moz-transform: translate3d(0, 100px, 0);
    -ms-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
    visibility: hidden;
}

.fade-down{
    -webkit-transform: translate3d(0, -100px, 0);
    -moz-transform: translate3d(0, -100px, 0);
    -ms-transform: translate3d(0, -100px, 0);
    transform: translate3d(0, -100px, 0);
    visibility: hidden;
}

.fade-right{
    -webkit-transform: translate3d(100px, 0, 0);
    -moz-transform: translate3d(100px, 0, 0);
    -ms-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
    visibility: hidden;
}

.fade-left{
    -webkit-transform: translate3d(-100px, 0, 0);
    -moz-transform: translate3d(-100px, 0, 0);
    -ms-transform: translate3d(-100px, 0, 0);
    transform: translate3d(-100px, 0, 0);
    visibility: hidden;
}

.slide.already-visible,
.slide.come-in{
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);

    -webkit-transition: visibility 800ms ease, transform 800ms ease;
    -moz-transition: visibility 800ms ease, transform 800ms ease;
    -ms-transition: visibility 800ms ease, transform 800ms ease;
    transition: visibility 800ms ease, transform 800ms ease;
    visibility: visible;
}

.step .col.slide:nth-child(1){
    -webkit-transition: visibility 500ms ease, transform 500ms ease;
    transition: visibility 500ms ease, transform 500ms ease;
}

.step .col.slide:nth-child(2){
    -webkit-transition: visibility 1000ms ease, transform 1000ms ease;
    transition: visibility 1000ms ease, transform 1000ms ease;
}

.step .col.slide:nth-child(3){
    -webkit-transition: visibility 1300ms ease, transform 1300ms ease;
    transition: visibility 1300ms ease, transform 1300ms ease;
}