how to customize top level li's "only" for horizontal cssmenu

[blackhawk]

hello,
I'm having a challenge in trying to figure out how to customize the top li's for the Navigation: CSSMenu - Horizontal menu.

This is what I'm trying to do...I have an simple HTML menu i wrote in notpad...

Code: Select all

	<div id="des01navtop">
		<ul>
			<li><a href="/welcome" onmouseover="this.blur();"><span>HOME</span></a></li>
			<li><a href="/services" onmouseover="this.blur();"><span>PORTFOLIO</span></a></li>
			<li><a href="/news" onmouseover="this.blur();"><span>ABOUT US</span></a></li>
			<li><a href="/showcase" onmouseover="this.blur();"><span>MORE</span></a></li>
			<li><a href="/reachus" onmouseover="this.blur();"><span>CONTACT US</span></a></li>
		</ul>	
	</div><!--navtop ends/-->

and connects with a stylesheet I wrote...

Code: Select all

/*layouts for menu*/
#des01navtop ul li a {
    display: block;
    float: left;
    height: 28px;
    margin-right: 8px;
    padding-right: 4px;
}

#des01navtop ul li a span {
    display: block;
    line-height: 14px;
    padding: 7px 5px 7px 10px;
} 

#des01navtop ul li a:hover {
    background-position: bottom right;
    color: #ddd;
    outline: none;
}

#des01navtop ul li a:hover span {
    background-position: bottom left;
}


/*skirts for menu*/
#des01navtop ul li a {
    background: transparent url(../images/des01red_broll_a.gif) no-repeat scroll top right;
    color: #fff;
	font: bold 12px arial, sans-serif;
	text-decoration:none; 
}

#des01navtop ul li a span {
    background: transparent url(../images/des01red_broll_a_span.gif) no-repeat;
 }

my dream is to have this functionatily used in my cmsms code, as well as give it sub sections that hide/show like the original : CSSMenu - Horizontal menu does. 

So i figured I would start by editing the original CSSMenu - Horizontal menu file directly, but can't seem to find the one style that controls the top level li's.  In conclusion I want to be able to customize the top level li's of my menu so they stand out from the sub ul's and li's that are nested below, such as placing a background image on their rollover effects.  If there is a technique or solution i'm overlooking, I will be very greatful for the scoop 


thanks!

[blackhawk]

got it!
just modify the node->depth or node->hierarchy in my smarty code.

sweet!