CSS Dropdown Menu Alignment Problem with only IE7 and below

I have a dropdown menu made purely with CSS and this code works perfectly on every major browser except IE7 and below. In IE7 the dropdown appears to the right of its parent. I've spent several hours trying to figure it out and am completely stumped. Any help would be greatly appreciated!

Here is the css:

#homepage #top-nav {
    height: 29px;
    padding-top: 3px;
    border-top: 1px solid #c9c9c9;
    background-image: url('http://www.doubleverify.com/wp-content/themes/horngroup/images/homepage/top-nav-shading.png');
    background-repeat: repeat-x;

Good old IE

I have a site I just put together at http://forwardbranding.com/Alcame/wordpress/. It works great in most browsers, but in IE 7 & 8 the menu element (collections) on hover is having a color issue. The text should stay white, but instead, it's turning a blue-ish color. I've even looked for that color in my CSS and can't seem to find it. In IE7 and compatibility mode, the top most element will stay white, but the sub-menu changes to that blue. I do have a separate style sheet for IE, but this element is getting most of it's style rules from the standard styles.css.

Syndicate content