Issue With CSS Menu

I've made a lot of changes to the CSS for the top navigation menu. I have only a little experience with CSS, but it seems some of my fixes often cause other issues. On hover of menu links, the inactive menu links shift right. On hover of the drop down menu, the inactive menu links shift back in place.

You can view here at http://www.buygenieclips.com. Mouse over the Products to see what I mean.

What needs to be changed in the CSS to fix this issue?

Hello tandylacker,
Try commenting out one of your negative margins like this - /* 0 Level */
#nav li { float:left; margin:0px 7px 11px 0px; padding:4px 8px; }
#nav li.active a { }
#nav a {
float:left;
background: none;
padding-right:0px;
/*margin-right: -40px; */
color:#444;
font-weight:bold;
}

Yep, that did it. Thank you very much!