/*************************** FADINGS  ***************************/


[data-animate|=fade-start] {
  opacity: 0;
}
[data-animate|=fade-end] {
  opacity: 1;
}



[data-animate|=push-start] {
  opacity: 0;
  padding-top: 200px;
}
[data-animate|=push-end] {
  opacity: 1;
  padding-top: 0px;
}


[data-animate|=slideLeft-start] {
  opacity: 0;
  transform:translate(-100px,0px)
}
[data-animate|=slideLeft-end] {
  opacity: 1;
  transform:translate(0px,0px)
}

[data-animate|=slideRight-start] {
  opacity: 0;
  transform:translate(100px,0px)
}
[data-animate|=slideRight-end] {
  opacity: 1;
  transform:translate(0px,0px)
}


[data-animate|=slideUp-start] {
  opacity: 0;
  transform-origin: top left;
  transform:translate(0px,100px)
}
[data-animate|=slideUp-end] {
  opacity: 1;
  transform-origin: top left;
  transform:translate(0px,0px)
}

[data-animate|=slideDown-start] {
  opacity: 0;
  transform-origin: top left;
  transform:translate(0px,-100px)
}
[data-animate|=slideDown-end] {
  opacity: 1;
  transform-origin: top left;
  transform:translate(0px,0px)
}



[data-animate|=rotateLeft-start] {
  opacity: 0;
  transform-origin: top left;
  transform: rotate(45deg);
}
[data-animate|=rotateLeft-end] {
  opacity: 1;
  transform-origin: top left;
  transform: rotate(0deg);
}

[data-animate|=rotateRight-start] {
  opacity: 0;
  transform-origin: top right;
  transform: rotate(-45deg);
}
[data-animate|=rotateRight-end] {
  opacity: 1;
  transform-origin: top right;
  transform: rotate(0deg);
}



[data-animate|=scale-start] {
  opacity: 0;
  transform: scale(.3);
}
[data-animate|=scale-end] {
  opacity: 1;
  transform: scale(1);
}



[data-animate|=skew-start] {
  opacity: 0;
  transform:skew(-45deg,0deg)
}
[data-animate|=skew-end] {
  opacity: 1;
  transform:skew(0deg,0deg)
}

[data-animate|=prespective-start] {
  opacity: 0;
  transform-origin: top left;
  transform: perspective(200px) rotateY(50deg);
}
[data-animate|=prespective-end] {
  opacity: 1;
  transform-origin: top left;
  transform: perspective(0px) rotateY(0deg);
}




[data-animate|=scaleX-start] {
  opacity: 0;
  transform: scaleX(0);
}
[data-animate|=scaleX-end] {
  opacity: 1;
  transform: scaleX(1);
}


[data-animate|=growLeft-start] {
  opacity: 0;
  width: 0%;
}
[data-animate|=growLeft-end] {
  opacity: 1;
  width: 100%;
}





[data-animate|=heightBanner-start] {
  opacity: 0;
  height: 100%;
}
[data-animate|=heightBanner-end] {
  opacity: 1;
  height: 80%;
}

[data-animate|=heightBanner2-start] {
  opacity: 0;
  height: 70%;
}

[data-animate|=heightBanner2-end] {
  opacity: 1;
  height: 80%;
}

     





/*************************** EASINGS SPEED ***************************/

[easing=spd_1] {
    -webkit-transition:  .1s ease;
    -moz-transition:  .1s ease;
    -o-transition:  .1s ease;
    transition:  .1s ease;
}
[easing=spd_2] {
    -webkit-transition:  .2s ease;
    -moz-transition:  .2s ease;
    -o-transition:  .2s ease;
    transition:  .2s ease;
}
[easing=spd_3] {
    -webkit-transition:  .3s ease;
    -moz-transition:  .3s ease;
    -o-transition:  .3s ease;
    transition:  .3s ease;
}
[easing=spd_4] {
    -webkit-transition:  .4s ease;
    -moz-transition:  .4s ease;
    -o-transition:  .4s ease;
    transition:  .4s ease;
}
[easing=spd_5] {
    -webkit-transition:  .5s ease;
    -moz-transition:  .5s ease;
    -o-transition:  .5s ease;
    transition:  .5s ease;
}
[easing=spd_7] {
    -webkit-transition:  .7s ease;
    -moz-transition:  .7s ease;
    -o-transition:  .7s ease;
    transition:  .7s ease;
}
[easing=spd_10] {
    -webkit-transition:  1s ease;
    -moz-transition:  1s ease;
    -o-transition:  1s ease;
    transition:  1s ease;
}
[easing=spd_15] {
    -webkit-transition:  1.5s ease;
    -moz-transition:  1.5s ease;
    -o-transition:  1.5s ease;
    transition:  1.5s ease;
}
[easing=spd_20] {
    -webkit-transition:  2s ease;
    -moz-transition:  2s ease;
    -o-transition:  2s ease;
    transition:  2s ease;
}