.logoanim1 {
	position:relative;
	top:-50px;
	left:290px;
	width: 125px;
	height: 86px;
	background-image: url("/tornado/gfx/logo_anim1.png");
    
    -webkit-animation: logoanimate 6s infinite;
       -moz-animation: logoanimate 4s steps(22) infinite;
        -ms-animation: logoanimate 4s steps(22) infinite;
         -o-animation: logoanimate 4s steps(22) infinite;
            animation: logoanimate 4s steps(22) infinite;
}

@-webkit-keyframes logoanimate {
	 0% 	{ background-position-x:    0px; } /* 1 fade */
	 1.999%	{ background-position-x:    0px; }
	 2% 	{ background-position-x: -125px; } /* 1 */
	 5.999% { background-position-x: -125px; }
	 6% 	{ background-position-x: -250px; } /* 2 fade */
	 7.999% { background-position-x: -250px; }
	 8% 	{ background-position-x: -375px; } /* 2 */
	11.999% { background-position-x: -375px; }
	12% 	{ background-position-x: -500px; } /* 3 fade */
	13.999% { background-position-x: -500px; }
	14% 	{ background-position-x: -625px; } /* 3 */
	17.999% { background-position-x: -625px; }
	18% 	{ background-position-x: -750px; } /* 4 fade */
	19.999% { background-position-x: -750px; }
	20% 	{ background-position-x: -875px; } /* 4 */
	49.999% { background-position-x: -875px; }
	50% 	{ background-position-x: -750px; } /* 4 fade */
	52.999% { background-position-x: -750px; }
	53%     { background-position-x: -875px; } /* 4 */
	100%    { background-position-x: -875px; }
}

@-moz-keyframes logoanimate {
   from { background-position:    0px; }
     to { background-position: -2750px; }
}

@-ms-keyframes logoanimate {
   from { background-position:    0px; }
     to { background-position: -2750px; }
}

@-o-keyframes logoanimate {
   from { background-position:    0px; }
     to { background-position: -2750px; }
}

@keyframes logoanimate {
   from { background-position:    0px; }
     to { background-position: -2750px; }
}
