The CSS
@-webkit-keyframes bounce-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
30% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
40% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 50px; }
80% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
90% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
}
@-moz-keyframes bounce-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
30% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
40% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 50px; }
80% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
90% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
}
@-ms-keyframes bounce-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
30% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
40% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 50px; }
80% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
90% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
}
@-o-keyframes bounce-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
30% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
40% { color: rgba(0,0,0,0.9); text-shadow: 0 -3px 5px rgba(0,0,0,0.15), 0 -6px 5px rgba(0,0,0,0.1), 0 -9px 5px rgba(0,0,0,0.05); }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 50px; }
80% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
90% { color: rgba(0,0,0,0.9); text-shadow: 0 3px 5px rgba(0,0,0,0.15), 0 6px 5px rgba(0,0,0,0.1), 0 9px 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); top: 0; }
}
.test.bounce {
-webkit-animation: bounce-slow 1s linear infinite;
-moz-animation: bounce-slow 1s linear infinite;
-ms-animation: bounce-slow 1s linear infinite;
-o-animation: bounce-slow 1s linear infinite;
}
@-webkit-keyframes bounce-fast {
from { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
25% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
35% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
50% { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 50px; }
75% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
85% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
to { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
}
@-moz-keyframes bounce-fast {
from { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
25% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
35% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
50% { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 50px; }
75% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
85% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
to { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
}
@-ms-keyframes bounce-fast {
from { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
25% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
35% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
50% { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 50px; }
75% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
85% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
to { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
}
@-o-keyframes bounce-fast {
from { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
25% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
35% { color: rgba(0,0,0,0.35); text-shadow: 0 -6px 5px rgba(0,0,0,0.275), 0 -12px 5px rgba(0,0,0,0.225), 0 -18px 5px rgba(0,0,0,0.175); }
50% { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 50px; }
75% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
85% { color: rgba(0,0,0,0.35); text-shadow: 0 6px 5px rgba(0,0,0,0.275), 0 12px 5px rgba(0,0,0,0.225), 0 18px 5px rgba(0,0,0,0.175); }
to { color: rgba(0,0,0,0.7); text-shadow: 0 0 5px rgba(0,0,0,0.275), 0 0 5px rgba(0,0,0,0.225), 0 0 5px rgba(0,0,0,0.175); top: 0; }
}
.test.bounce.fast {
-webkit-animation: bounce-fast 0.35s linear infinite;
-moz-animation: bounce-fast 0.35s linear infinite;
-ms-animation: bounce-fast 0.35s linear infinite;
-o-animation: bounce-fast 0.35s linear infinite;
}
@-webkit-keyframes bounce-faster {
from { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
40% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
45% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
50% { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 50px; }
90% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
95% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
to { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
}
@-moz-keyframes bounce-faster {
from { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
40% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
45% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
50% { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 50px; }
90% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
95% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
to { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
}
@-ms-keyframes bounce-faster {
from { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
40% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
45% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
50% { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 50px; }
90% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
95% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
to { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
}
@-o-keyframes bounce-faster {
from { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
40% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
45% { color: rgba(0,0,0,0.2); text-shadow: 0 -6px 5px rgba(0,0,0,0.35), 0 -12px 5px rgba(0,0,0,0.3), 0 -18px 5px rgba(0,0,0,0.25); }
50% { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 50px; }
90% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
95% { color: rgba(0,0,0,0.2); text-shadow: 0 6px 5px rgba(0,0,0,0.35), 0 12px 5px rgba(0,0,0,0.3), 0 18px 5px rgba(0,0,0,0.25); }
to { color: rgba(0,0,0,0.4); text-shadow: 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3), 0 0 5px rgba(0,0,0,0.25); top: 0; }
}
.test.bounce.faster {
-webkit-animation: bounce-faster 0.2s linear infinite;
-moz-animation: bounce-faster 0.2s linear infinite;
-ms-animation: bounce-faster 0.2s linear infinite;
-o-animation: bounce-faster 0.2s linear infinite;
}
@-webkit-keyframes bounce-ultrafast {
from { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
40% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
45% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
50% { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 50px; }
90% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
95% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
to { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
}
@-moz-keyframes bounce-ultrafast {
from { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
40% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
45% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
50% { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 50px; }
90% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
95% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
to { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
}
@-ms-keyframes bounce-ultrafast {
from { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
40% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
45% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
50% { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 50px; }
90% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
95% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
to { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
}
@-o-keyframes bounce-ultrafast {
from { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
40% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
45% { color: rgba(0,0,0,0.1); text-shadow: 0 -6px 5px rgba(0,0,0,0.4), 0 -12px 5px rgba(0,0,0,0.35), 0 -18px 5px rgba(0,0,0,0.3); }
50% { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 50px; }
90% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
95% { color: rgba(0,0,0,0.1); text-shadow: 0 6px 5px rgba(0,0,0,0.4), 0 12px 5px rgba(0,0,0,0.35), 0 18px 5px rgba(0,0,0,0.3); }
to { color: rgba(0,0,0,0.2); text-shadow: 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35), 0 0 5px rgba(0,0,0,0.3); top: 0; }
}
.test.bounce.ultrafast {
-webkit-animation: bounce-ultrafast 0.1s linear infinite;
-moz-animation: bounce-ultrafast 0.1s linear infinite;
-ms-animation: bounce-ultrafast 0.1s linear infinite;
-o-animation: bounce-ultrafast 0.1s linear infinite;
}
@-webkit-keyframes slide-back-forth-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
15% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
45% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 80%; }
65% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
85% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
}
@-moz-keyframes slide-back-forth-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
15% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
45% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 80%; }
65% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
85% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
}
@-ms-keyframes slide-back-forth-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
15% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
45% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 80%; }
65% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
85% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
}
@-o-keyframes slide-back-forth-slow {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
15% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
45% { color: rgba(0,0,0,1); text-shadow: -13px 0 5px rgba(0,0,0,0.15), -26px 0 5px rgba(0,0,0,0.1), -39px 0 5px rgba(0,0,0,0.05) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 80%; }
65% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
85% { color: rgba(0,0,0,1); text-shadow: 13px 0 5px rgba(0,0,0,0.15), 26px 0 5px rgba(0,0,0,0.1), 39px 0 5px rgba(0,0,0,0.05); }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.15), 0 0 5px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,0.05); left: 0; }
}
.test.back-and-forth {
-webkit-animation: slide-back-forth-slow 2s ease-in-out infinite;
-moz-animation: slide-back-forth-slow 2s ease-in-out infinite;
-ms-animation: slide-back-forth-slow 2s ease-in-out infinite;
-o-animation: slide-back-forth-slow 2s ease-in-out infinite;
}
@-webkit-keyframes slide-back-forth-fast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
}
@-moz-keyframes slide-back-forth-fast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
}
@-ms-keyframes slide-back-forth-fast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
}
@-o-keyframes slide-back-forth-fast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -36px 0 5px rgba(0,0,0,0.25), -72px 0 5px rgba(0,0,0,0.2), -108px 0 5px rgba(0,0,0,0.15) , -144px 0 5px rgba(0,0,0,0.15) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 36px 0 5px rgba(0,0,0,0.25), 72px 0 5px rgba(0,0,0,0.2), 108px 0 5px rgba(0,0,0,0.15), 108px 0 5px rgba(0,0,0,0.15) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.2), 0 0 5px rgba(0,0,0,0.15); left: 0; }
}
.test.back-and-forth.fast {
-webkit-animation: slide-back-forth-fast 0.7s ease-in-out infinite;
-moz-animation: slide-back-forth-fast 0.7s ease-in-out infinite;
-ms-animation: slide-back-forth-fast 0.7s ease-in-out infinite;
-o-animation: slide-back-forth-fast 0.7s ease-in-out infinite;
}
@-webkit-keyframes slide-back-forth-faster {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
@-moz-keyframes slide-back-forth-faster {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
@-ms-keyframes slide-back-forth-faster {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
@-o-keyframes slide-back-forth-faster {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
25% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
35% { color: rgba(0,0,0,0.5); text-shadow: -63px 0 5px rgba(0,0,0,0.45), -126px 0 5px rgba(0,0,0,0.4), -189px 0 5px rgba(0,0,0,0.35) , -252px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
75% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
85% { color: rgba(0,0,0,0.5); text-shadow: 63px 0 5px rgba(0,0,0,0.45), 126px 0 5px rgba(0,0,0,0.4), 189px 0 5px rgba(0,0,0,0.35), 189px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
.test.back-and-forth.faster {
-webkit-animation: slide-back-forth-faster 0.4s ease-in-out infinite;
-moz-animation: slide-back-forth-faster 0.4s ease-in-out infinite;
-ms-animation: slide-back-forth-faster 0.4s ease-in-out infinite;
-o-animation: slide-back-forth-faster 0.4s ease-in-out infinite;
}
@-webkit-keyframes slide-back-forth-ultrafast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
40% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
45% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
90% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
95% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
@-moz-keyframes slide-back-forth-ultrafast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
40% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
45% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
90% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
95% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
@-ms-keyframes slide-back-forth-ultrafast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
40% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
45% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
90% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
95% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
@-o-keyframes slide-back-forth-ultrafast {
from { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
40% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
45% { color: rgba(0,0,0,0.5); text-shadow: -125px 0 5px rgba(0,0,0,0.45), -250px 0 5px rgba(0,0,0,0.4), -375px 0 5px rgba(0,0,0,0.35) , -500px 0 5px rgba(0,0,0,0.35) ; }
50% { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 80%; }
90% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
95% { color: rgba(0,0,0,0.5); text-shadow: 125px 0 5px rgba(0,0,0,0.45), 250px 0 5px rgba(0,0,0,0.4), 375px 0 5px rgba(0,0,0,0.35), 375px 0 5px rgba(0,0,0,0.35) ; }
to { color: rgba(0,0,0,1); text-shadow: 0 0 5px rgba(0,0,0,0.45), 0 0 5px rgba(0,0,0,0.4), 0 0 5px rgba(0,0,0,0.35); left: 0; }
}
.test.back-and-forth.ultrafast {
-webkit-animation: slide-back-forth-ultrafast 0.2s ease-in-out infinite;
-moz-animation: slide-back-forth-ultrafast 0.2s ease-in-out infinite;
-ms-animation: slide-back-forth-ultrafast 0.2s ease-in-out infinite;
-o-animation: slide-back-forth-ultrafast 0.2s ease-in-out infinite;
}
@-webkit-keyframes slide-slow {
from { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 0; }
to { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 80%; }
}
@-moz-keyframes slide-slow {
from { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 0; }
to { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 80%; }
}
@-ms-keyframes slide-slow {
from { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 0; }
to { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 80%; }
}
@-o-keyframes slide-slow {
from { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 0; }
to { color: rgba(0,0,0,1); text-shadow: -6.5px 0 5px rgba(0,0,0,0.15), -13px 0 5px rgba(0,0,0,0.1), -19.5px 0 5px rgba(0,0,0,0.05) ; left: 80%; }
}
.test.continuous {
-webkit-animation: slide-slow 2s linear infinite;
-moz-animation: slide-slow 2s linear infinite;
-ms-animation: slide-slow 2s linear infinite;
-o-animation: slide-slow 2s linear infinite;
}
@-webkit-keyframes slide-fast {
from { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 80%; }
}
@-moz-keyframes slide-fast {
from { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 80%; }
}
@-ms-keyframes slide-fast {
from { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 80%; }
}
@-o-keyframes slide-fast {
from { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -18px 0 5px rgba(0,0,0,0.25), -36px 0 5px rgba(0,0,0,0.2), -54px 0 5px rgba(0,0,0,0.15) , -72px 0 5px rgba(0,0,0,0.15) ; left: 80%; }
}
.test.continuous.fast {
-webkit-animation: slide-fast 0.7s linear infinite;
-moz-animation: slide-fast 0.7s linear infinite;
-ms-animation: slide-fast 0.7s linear infinite;
-o-animation: slide-fast 0.7s linear infinite;
}
@-webkit-keyframes slide-faster {
from { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
@-moz-keyframes slide-faster {
from { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
@-ms-keyframes slide-faster {
from { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
@-o-keyframes slide-faster {
from { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -31.5px 0 5px rgba(0,0,0,0.45), -63px 0 5px rgba(0,0,0,0.4), -94.5px 0 5px rgba(0,0,0,0.35) , -126px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
.test.continuous.faster {
-webkit-animation: slide-faster 0.4s linear infinite;
-moz-animation: slide-faster 0.4s linear infinite;
-ms-animation: slide-faster 0.4s linear infinite;
-o-animation: slide-faster 0.4s linear infinite;
}
@-webkit-keyframes slide-ultrafast {
from { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
@-moz-keyframes slide-ultrafast {
from { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
@-ms-keyframes slide-ultrafast {
from { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
@-o-keyframes slide-ultrafast {
from { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 0; }
to { color: rgba(0,0,0,0.5); text-shadow: -62.5px 0 5px rgba(0,0,0,0.45), -125px 0 5px rgba(0,0,0,0.4), -187.5px 0 5px rgba(0,0,0,0.35) , -250px 0 5px rgba(0,0,0,0.35) ; left: 80%; }
}
.test.continuous.ultrafast {
-webkit-animation: slide-ultrafast 0.2s linear infinite;
-moz-animation: slide-ultrafast 0.2s linear infinite;
-ms-animation: slide-ultrafast 0.2s linear infinite;
-o-animation: slide-ultrafast 0.2s linear infinite;
}