CSS3: Base state, animation and back

[Hadn]

Basically, I have an element with a given width and height. When I add the "zoomed" class to it, I want it to change its size and position. I got it working with a proper webkit-animation (keyframed).The problem is that when I remove the "zoomed" class, it suddenly reverts to the original size and position, and I'd love to do it with an animation.Note that this is an example that could probably be solved with the use of the transition property, but in my real world case, it can't because I have a fairly complex keyframed animation.So, how to have a basic state, animate to a new state when a class is added and reverse the animation to the basic state when the class is removed? Thanks.