@-webkit-keyframes widthAni{ 0%{ width:0;}100%{ width:100%;}}
@keyframes widthAni{ 0%{ width:0;}100%{ width:100%;}}
.widthAni{ -webkit-animation-name:widthAni; animation-name:widthAni;}

@-webkit-keyframes heightAni{ 0%{ height:0;}100%{ height:100%;}}
@keyframes heightAni{ 0%{ height:0;}100%{ height:100%;}}
.heightAni{ -webkit-animation-name:heightAni; animation-name:heightAni;}

@-webkit-keyframes opacity { 0%{ opacity:0;} 100%{ opacity:1;}}
@keyframes opacity { 0%{ opacity:0;} 100%{ opacity:1;}}
.opacity{ -webkit-animation-name:opacity; animation-name:opacity;}

@-webkit-keyframes rotate{from{-webkit-transform: rotate(0deg)} to{-webkit-transform: rotate(360deg)}}
@-moz-keyframes rotate{from{-moz-transform: rotate(0deg)} to{-moz-transform: rotate(359deg)}}
@keyframes rotate{from{transform: rotate(0deg)} to{transform: rotate(359deg)}}
.rotate{ -webkit-animation-name:rotate; animation-name:rotate;}

@-webkit-keyframes rotateF{from{-webkit-transform: rotate(360deg)} to{-webkit-transform: rotate(0deg)}}
@-moz-keyframes rotateF{from{-moz-transform: rotate(360deg)} to{-moz-transform: rotate(0deg)}}
@keyframes rotateF{from{transform: rotate(360deg)} to{transform: rotate(0deg)}}
.rotateF{ -webkit-animation-name:rotateF; animation-name:rotateF;}

@keyframes loading{ 0%{ left:0; opacity:0;} 35%{ left:41%; transform:rotate(0deg); opacity:1;} 65%{ left:59%; transform:rotate(0deg); opacity:1;} 100%{ left:100%; transform:rotate(-180deg); opacity:0;} }
@-webkit-keyframes loading{ 0%{ left:0; opacity:0;} 35%{ left:41%; -webkit-transform:rotate(0deg); opacity:1;} 65%{ left:59%; -webkit-transform:rotate(0deg); opacity:1;} 100%{ left:100%; -webkit-transform:rotate(-180deg); opacity:0;}}
.loading{ -webkit-animation-name:loading; animation-name:loading;}

@-webkit-keyframes warn{ 
	0% { -webkit-transform: scale(1); transform: scale(1);}
	50%,80% { -webkit-transform: scale(1.25); transform: scale(1.25);}
	100% { opacity: 0;}
}
@keyframes warn{
	0% { -webkit-transform: scale(1); transform: scale(1);}
	50%,80% { -webkit-transform: scale(1.25); transform: scale(1.25);}
	100% { opacity: 0;}
}
.warn{ -webkit-animation-name:warn; animation-name:warn;}

@-webkit-keyframes banScroll{ 0%{ top:5px; opacity:1;} 100%{ top:90%; opacity:0;}}
@keyframes banScroll{ 0%{ top:5px; opacity:1;} 100%{ top:90%; opacity:0;}}
.banScroll{ -webkit-animation-name:banScroll; animation-name:banScroll;}

@-webkit-keyframes bgAni{ 0%{ background-position:0% center;} 100%{ background-position:100% center;}}
@keyframes bgAni{ 0%{ background-position:0% center;} 100%{ background-position:100% center;}}
.bgAni{ -webkit-animation-name:bgAni; animation-name:bgAni;}

@-webkit-keyframes reverseImg{ 0%{ transform:rotateY(0);} 20%{ transform:rotateY(360deg);} 100%{ transform:rotateY(360deg);}}
@keyframes reverseImg{ 0%{ transform:rotateY(0);} 20%{ transform:rotateY(360deg);} 100%{ transform:rotateY(360deg);}}
.reverseImg{ -webkit-animation-name:reverseImg; animation-name:reverseImg;}