My b2evolution Version: 3.3.2

Hi all!

I was wondering if one of you CSS wizards can help me figure something out. I am using the "Sorted Public Bloglist" widget to display a menu of all my blogs in the header. This works fine. What I am trying to do is set a different color for menu item of the currently selected blog, so it's obvious to the end user to figure out where they are by just looking at the header menu. There has to be a simple way to do this with CSS, right?

My blogs are on an intranet, so I cannot post a live link. However this is a html excerpt:

<div id="header">
	<div id="title">
		    </div>
    <div id="pagenav">
      <ul>
        
<div class="widget_core_colls_list_public widget_plugin_sorted_bloglist">

<li class="selected"><a href="blog6/" title="" class="mBlog6 selected">John's Blog</a></li>
<li><a href="blog8/" title="" class="mBlog8 default">Joe's Blog</a></li>
<li><a href="blog9/" title="" class="mBlog9 default">Jenny's Blog</a></li>
</div>

      </ul>
      </div>
</div><!-- end of header -->
<div id="sidebar">

I tried this and it did not work:

.selected li a{
color:#ffcc33;
}

Any suggestions?