.sr{
opacity:0;
transition:opacity .8s ease, transform .4s ease;
}

/* when visible */

.sr.sr-visible{
opacity:1;
transform:translateY(0) translateX(0) scale(1);
}

/* effects */

.sr-fade-up{
transform:translateY(40px);
}

.sr-fade-left{
transform:translateX(-40px);
}

.sr-fade-right{
transform:translateX(40px);
}

.sr-zoom{
transform:scale(.9);
}

.sr-soft{
opacity:0;
}

/* cascade delays */

.sr-delay-1{transition-delay:.1s}
.sr-delay-2{transition-delay:.2s}
.sr-delay-3{transition-delay:.3s}
.sr-delay-4{transition-delay:.4s}
.sr-delay-5{transition-delay:.5s}