Help with sub menus CSS hover in navigation

[solidariti]

Hi Everyone

I have been racking my brains for about 2 days now why these drop down submenus in the about us menu display a blue hover state when the parent is active. When someone is visiting the About Us page the children should have a background of #313131 color of #fff and the hover state should be background of #313131 color #bbb9ba, while the active state (so when the user is on that page) background of #363a3f color #fff

Below is the link and CSS and HTML, can any one please shed some light on this issue for me thank you. :-).

http://tinyurl.com/yfbuqds

/* Menu +++++++++++ */
#navigation-container{padding:0; margin:0 20px 0 0; width:600px; height:33px; float:right;}
    #navigation-container ul,#navigation-container ul li,#navigation-container li{list-style:none;float:left;}
        #navigation-container ul li a{display:block;padding:10px 10px 10px 10px;color:#fff;text-decoration:none;font-size:120%;}
            #navigation-container ul li a:hover{color:#bbb9ba; text-decoration:none; }
                #navigation-container li ul{position:absolute;width:150px;top:147px;left:-999em;z-index:999;}
                    /*#navigation-container li ul li{background:#313131;width:130px;border:1px solid #363a3f; margin:0 0 0 -40px;}*/
                        #navigation-container li ul li:first-child {border-top:1px solid #313131;} 
                        #navigation-container li ul li.current_page_item a{background:#313131;color:#fff;display:block;padding:6px;font-size:100%;}
                            #navigation-container li:hover ul,#navigation-container li.sfhover ul{left:auto;margin-top:-1px;padding-top:3px;}
                        
#navigation a:hover strong{font-weight:500;color:#00BEDF;z-index:999;}
    #navigation a:focus{color:#fff;}
        #navigation li.page_item a{color:#fff;}
            #navigation li.page_item a:hover{color:#bbb9ba;background:none;}
            /*ul#navigation li.current_page_item ul li a{color:#fff; font-weight:800; text-decoration:none; background:#006CB0; width:100%; }
                 #navigation li.current_page_item a{color:#fff; font-weight:800; text-decoration:none; background:#006CB0; }
                     #navigation li.current_page_item a:hover{color:#bbb9ba;font-weight:800; text-decoration:none; background:#006CB0;}*/
                    #navigation li.current_page_item li {color:#fff; text-decoration:none; background:#313131;}
                    #navigation-container li ul li{color:#fff; text-decoration:none; background:#313131;}
                        #navigation li.current_page_item a:focus{color:#fff;}
                             #navigation li.current_page_ancestor a{color:#fff!important; background:#313131;}
                                #navigation a{display:block;float:left;padding:36px 3px 0;text-decoration:none;} 

<ul id="navigation">
<li>
</li>
<li class="page_item page-item-41">
<a title="Products" href="http://www.newmovementfitness.co.uk/products-page">Products</a>
</li>
<li class="page_item page-item-21">
<a title="Latest News" href="http://www.newmovementfitness.co.uk/latest-news">Latest News</a>
</li>
<li class="page_item page-item-2 current_page_item">
<a title="About Us" href="http://www.newmovementfitness.co.uk/about-us">About Us</a>
<ul>
<li class="page_item page-item-363">
<a title="James Griffiths" href="http://www.newmovementfitness.co.uk/about-us/james-griffiths">James Griffiths</a>
</li>
<li class="page_item page-item-365">
<a title="Paula Glanfield" href="http://www.newmovementfitness.co.uk/about-us/paula-glanfield">Paula Glanfield</a>
</li>
<li class="page_item page-item-367">
<a title="Barry Ashby" href="http://www.newmovementfitness.co.uk/about-us/barry-ashby">Barry Ashby</a>
</li>
</ul>
</li>
<li class="page_item page-item-28">
</li>
</ul>