The css works fine, that is not my issue so no comment needed there, but as soon as you stack several hover classes for 1 definition, it breaks down. Whereas you can stack other styles on a single definition no problem.
The "definition" works totally fine. So no issues there.
Where there is an issue is with tying multiple classes to the definition. Something that is very common. If I just tie 1 class to the definition, it works perfect. But the moment you do #XXX:hover, #YYY:hover, #ZZZ:hover and tie multiple classes to that definition, it fails. It is very common to do several classes .xxx, .yyy, .zzz, .aaa tied to 1 definition. But when using the hover class, it seems to break that ability.
So if I "group" them it busts the function. If I do each one separate - unnecessarily redundant - it works.
Really, the example I gave is crystal clear. As I have said several times, the css definition works fine. Perfect. No issues. Cross browser tested. It is not a browser issue either. At all. Not related.
I am not sure how much clearer I can make this.
The issue is multiple classes tied to the definition.
I will try to explain this 1 more time with example and hope it is clear.
We all know what this means, right? It means that paragraph, header size 1, header size 2 and tables use the font family 'Helvetica', 'Myriad Pro', 'Myriad Pro Bold', Arial, Helvetica, Sans-serif.
Do you want it when one is hovered over for them all to be zoomed in? From what I can see it seems you only want one to zoom in at a time whilst the overs aren't zoomed. This is why showing some HTML can really help since it shows what your aiming for. If you want single zoom stick to the code that worked.