CSS Keyframe Animation : Immediate background position change

Question

I am creating a CSS keyframe animation in which I would like the background to change positions immediately with no transition. I've seen an example of this where two keyframes were used with the same value but I can't recreate the effect, I still get a smooth transition.

Here is my code http://jsbin.com/EvAHAKO/1/edit

Can anyone tell me what I am doing wrong?

Thank you

Answer 1

Im not quite sure if this is what you want: http://jsbin.com/EvAHAKO/5/edit

Use two animations: http://jsbin.com/EvAHAKO/8/edit