My site is here webtest.iu.edu/~iutreas/3.3.2/index3.html
I have SmartMenus working fine in normal UNcollapsed mode. In collapsed mode I have a problem. All the list items in the selected menu show up fine in collapsed mode (with dark text). When I hover over and click to expand the additional list items underneath a submenu then everything is still fine because I have a CSS rule for hover and active.
.container .navbar.navbar-inverse .container-fluid #navbar .nav.navbar-nav .dropdown .dropdown-menu>li>a:hover,
.container .navbar.navbar-inverse .container-fluid #navbar .nav.navbar-nav .dropdown .dropdown-menu>li>a:active {
color: #000;
background-color: #DBD8D6;
}
I click and expand the submenu items but when the mouse pointer goes off of the submenu header list item (and it is no longer hovered over or in focus) then the text for just that list item turns white and is no longer visible against the white background color. It can be hovered over again and seen but this does not solve the problem.
This URL shows the problem http://i60.tinypic.com/10qvtoo.jpg
Where the arrow is pointing shows the text that disappears after if has been expanded and then is no longer being hovered over. In the picture the text is still hovered over and thus can be seen still. I want the text to stay black whether it is hovered over or not after it has been expanded. What is the CSS syntax for such a state?