CSS Question(Suckerfish ) - Simply Modern theme

I'm using the Simply Modern theme on my website FreeTheChildren.us. I noticed if you go to the menu item: Connect when you hover over the child objects the parent menu is no longer highlighted. I did some searching online and found some js that would put the sfhover state on the items I wanted highlighted. I put the code in the themes page.tpl.php and when using FireBug I see the state being applied to the items. Only problem is I can't figure out why my CSS code will not apply the background colors I want. I don't know any CSS gurus so I was hoping the community could help me out. Below is the CSS and js code. I've changed the CSS code many times, the example below is an attempt to get any response. When I view the CSS in FireBug I do not see any affects being applied for sfhover. Any assistance would be appreciated, thanks!

FireFox 3.5.5
Drupal 6.14
Firebug 1.4.3

#suckerfishmenu sfhover,
#suckerfishmenu #sfhover,
#suckerfishmenu .sfhover,
#suckerfishmenu a.sfhover,
#suckerfishmenu li.sfhover,
#suckerfishmenu li sfhover,
#suckerfishmenu a sfhover
{
  background: #ccf000;
}

<script type="text/javascript"> <!--
  sfhover = function(nav) {
    var sfEls = document.getElementById(nav).getElementsByTagName("li");
    for (var i=1; i<sfEls.length; i++) {
      sfEls[i].onmouseover=function() {
        this.className+=" sfhover";
      }
      sfEls[i].onmouseout=function() {
        this.className=this.className.replace(new RegExp("\\s?sfhover\\b"), "");
      }
    }

    var listItem = document.getElementById(nav).getElementsByTagName('ul');
    for(var i=0;i<listItem.length;i++) {
      listItem[i].onmouseover=function() {
        var changeStyle = this.parentNode.getElementsByTagName('a');
        changeStyle[0].className+=" active";
      }

      listItem[i].onmouseout=function() {
        var changeStyle = this.parentNode.getElementsByTagName('a');
        changeStyle[0].className=this.className.replace(new RegExp("\\s?active\\b"), "");
      }
    }
  }

  function addEvent( obj, type, fn ) {
    if ( obj.attachEvent ) {
      obj['e'+type+fn] = fn;
      obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
      obj.attachEvent( 'on'+type, obj[type+fn] );
    } else
      obj.addEventListener( type, fn, false );
    }
  function removeEvent( obj, type, fn ) {
    if ( obj.detachEvent ) {
    obj.detachEvent( 'on'+type, obj[type+fn] );
    obj[type+fn] = null;
    } else
      obj.removeEventListener( type, fn, false );
    }

  addEvent(window, 'load', function () { sfhover('suckerfishmenu'); });

// --> </script>