I keep getting a problem with the background of the MenuItem changing to an off white like in the image below

This only happens when you hover over the problem menu item and there is a submenu to the right
Once you are not hovering over the problem MenuItem it will display properly.
As you can see by the image below as I move right to hover over the next Sub Menu Item the previous menu item turns the proper red colour.

How do I stop the off white background from appearing? and have it so it will have the darker read when you hover over the MenuItem with the mouse?
I have tried using the following solution but that has not worked
http://stackoverflow.com/questions/19250723/twitter-bootstrap-dropdown-submenu-background-color
http://www.bootply.com/75155
Any help will much appreciated
Thanks
John