[w_scroll]  {animation-duration: 1s;}
[w_scroll="on"]  {}

[e_wins='down'][w_scroll='on'] {animation-name: smartbox_kf_slideDown;}
[e_wins='up'][w_scroll='on'] {animation-name: smartbox_kf_slideUp;}
[e_wins='left'][w_scroll='on'] {animation-name: smartbox_kf_slideLeft;}
[e_wins='right'][w_scroll='on'] {animation-name: smartbox_kf_slideRight;}
[e_wins='in'][w_scroll='on'] {animation-name: smartbox_kf_fadeIn;}
[e_wins='out'][w_scroll='on'] {animation-name: smartbox_kf_fadeOut;}
[e_wins='jump'][w_scroll='on'] {animation-name: smartbox_kf_bound;}
[e_wins='zoom_out'][w_scroll='on'] {animation-name: smartbox_kf_zoom_out;}
[e_wins='zoom_in'][w_scroll='on'] {animation-name: smartbox_kf_zoom_in;}

[e_wins='flipY'][w_scroll='on'] {animation-name: smartbox_kf_flipY;}
[e_wins='flipX'][w_scroll='on'] {animation-name: smartbox_kf_flipX;}




@keyframes smartbox_kf_flipX {
	0% {
    -webkit-transform: perspective(400px) rotate3d(1,0,0,90deg);
    transform: perspective(400px) rotate3d(1,0,0,90deg);
    transition-timing-function: ease-in;
    opacity: 0;
	}
	40% {
    -webkit-transform: perspective(400px) rotate3d(1,0,0,-20deg);
    transform: perspective(400px) rotate3d(1,0,0,-20deg);
    transition-timing-function: ease-in;
	}
	60% {
    -webkit-transform: perspective(400px) rotate3d(1,0,0,10deg);
    transform: perspective(400px) rotate3d(1,0,0,10deg);
    opacity: 1;
	}
	80% {
    -webkit-transform: perspective(400px) rotate3d(1,0,0,-5deg);
    transform: perspective(400px) rotate3d(1,0,0,-5deg);
	}
	100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
	}	
}
@keyframes smartbox_kf_flipY {
	0% {
    -webkit-transform: perspective(400px) rotate3d(0,1,0,90deg);
    transform: perspective(400px) rotate3d(0,1,0,90deg);
    transition-timing-function: ease-in;
    opacity: 0;
	}
	40% {
    -webkit-transform: perspective(400px) rotate3d(0,1,0,-20deg);
    transform: perspective(400px) rotate3d(0,1,0,-20deg);
    transition-timing-function: ease-in;
	}
	60% {
    -webkit-transform: perspective(400px) rotate3d(0,1,0,10deg);
    transform: perspective(400px) rotate3d(0,1,0,10deg);
    opacity: 1;
	}
	80% {
    -webkit-transform: perspective(400px) rotate3d(0,1,0,-5deg);
    transform: perspective(400px) rotate3d(0,1,0,-5deg);
	}
	100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
	}	
}
@keyframes smartbox_kf_slideDown {
	0% {transform: translateY(-30%);}
	50%{transform: translateY(8%);}
	65%{transform: translateY(-4%);}
	80%{transform: translateY(4%);}
	95%{transform: translateY(-2%);}			
	100% {transform: translateY(0%);}		
}

@keyframes smartbox_kf_slideUp {
	0% {transform: translateY(30%);}
	50%{transform: translateY(-8%);}
	65%{transform: translateY(4%);}
	80%{transform: translateY(-4%);}
	95%{transform: translateY(2%);}			
	100% {transform: translateY(0%);}		
}
@keyframes smartbox_kf_slideLeft {
	0% {transform: translateX(-30%);}
	50%{transform: translateX(8%);}
	65%{transform: translateX(-4%);}
	80%{transform: translateX(4%);}
	95%{transform: translateX(-2%);}			
	100% {transform: translateX(0%);}		
}
@keyframes smartbox_kf_slideRight {
	0% {transform: translateX(30%);}
	50%{transform: translateX(-8%);}
	65%{transform: translateX(4%);}
	80%{transform: translateX(-4%);}
	95%{transform: translateX(2%);}			
	100% {transform: translateX(0%);}		
}
@keyframes smartbox_kf_fadeIn {
	0% {transform: scale(0.7);}
	60% {transform: scale(1.1);}
	80% {transform: scale(0.9);}
	100% {transform: scale(1);}
}
@keyframes smartbox_kf_fadeOut {
	0% {transform: scale(1.35);}
	60% {transform: scale(0.95);}
	80% {transform: scale(1.15);}
	100% {transform: scale(1);}
}
@keyframes smartbox_kf_zoom_out {
	0% {transform: scale(0.5);}
	70% {transform: scale(1.1);}
	100% {transform: scale(1);}
}
@keyframes smartbox_kf_zoom_in {
	0% {transform: scale(2);}
	70% {transform: scale(0.8);}
	100% {transform: scale(1);}
}
@keyframes smartbox_kf_bound {
	0% {transform: translateY(0%) scaleY(0.8);}
	60%{transform: translateY(-30%) scaleY(1.1);}
	70%{transform: translateY(0%) scaleY(0.7) scaleX(1.05);}
	80%{transform: translateY(0%) scaleY(1.1) scaleX(1);}	
	90%{transform: translateY(0%) scaleY(0.9) scaleX(1);}				
	100%{transform: translateY(0%) scaleY(1) scaleX(1);}	
}