﻿[data-animate]{opacity:0}
[data-animate].visible{opacity:1}

.animated{animation-duration:1s;animation-fill-mode:both}
.fadeInUp{animation-name:fadeInUp}
.fadeInLeft{animation-name:fadeInLeft}
.fadeInRight{animation-name:fadeInRight}
.visible{visibility:visible!important}
.fade {animation-name: fade;animation-duration: 1.5s;}

.fade-slow {-webkit-animation-name: fade-slow;-webkit-animation-duration: 1s;animation-name: fade;animation-duration: 1s;}

@keyframes fadeInUp{
    0%{opacity:0;transform:translate3d(0,100%,0)}
    100%{opacity:1;transform:translateZ(0)}
}

@keyframes fadeInLeft{
    0%{opacity:0;transform:translateX(-10%)}
    100%{opacity:1;transform:translateX(0)}
}

@keyframes fadeInRight{
    0%{opacity:0;transform:translateX(100%)}
    100%{opacity:1;transform:translateX(0)}
}

@keyframes fade-in-out{
    0%{opacity:0}
    100%{opacity:1}
}

@keyframes fade {from {opacity: .5} to {opacity: 1}}

@keyframes spin {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}

@keyframes animation-background{
    0% {background-position: 0 50%;}
    50% {background-position: 100% 50%;}
    100% {background-position: 0 50%;}
}

@keyframes animation-background-hover{
    0% {background:#20B4EA;}
    100% {background: #0053A0;}
}

@keyframes shake{
    0%,50%,100%{transform:translateY(0)}
    25%,75%{transform:translateY(-6px)}
}



