Extended Menu in Joomla 2.5 - Joomla! Forum - community, help and support

i have installed extended menu in joomla 2.5.

i followed tutorials, , drop down menus shown fine.

but cannot css working. if add css lines or not, shows same. missing step. example copied following lines in template.css without apparent change in menu(taken great tutotial http://ethanlee83.wordpress.com/2011/11 ... mentation/ ).

any ideas on hot css working also?

code: select all

#mainlevel{
   list-style:none;
   /* clear floats */
   float:left;
   width:800px;
        margin:0px;
        padding:0px 0px 0px 10px;
        margin-top:2px;
   /* bring nav above else--uncomment if needed.*/
   position:relative;
   z-index:5;   
}
#mainlevel li{
   float:left;
   margin-right:30px;
   position:relative;
}
#mainlevel a{
   display:block;
   padding:5px;
   color:#900;
   text-decoration:none;
}
#mainlevel a:hover{
   color:#fff;
   background:#900;
   text-decoration:none;
}

#mainlevel ul{
   background:#fff; /* adding background makes dropdown work in ie7+. make close page's background possible (i.e. white page == white background). */
   background:rgba(255,255,255,0); /* but! let's make background transparent can, don't want see if can it... */
   list-style:none;
   position:absolute;
   margin:0px;
   padding:0px;
   left:-9999px; /* hide off-screen when not needed (this more accessible display:none;) */
}
#mainlevel ul li{
   padding-top:0px; /* introducing padding between li , give illusion spaced items */
   float:none;
}
#mainlevel ul a{
   white-space:nowrap; /* stop text wrapping , creating multi-line dropdown items */
}
#mainlevel li:hover ul{ /* display dropdown on hover */
   left:0; /* bring on-screen when needed */
}
#mainlevel li:hover a{ /* these create persistent hover states, meaning top-most link stays 'hovered' when cursor has moved down list. */
   background:#900;
   color:#fff;
   text-decoration:none;
}
#mainlevel li:hover ul a{ /* persistent hover state create global style links before they're hovered. here undo these effects. */
   text-decoration:none;
}
#mainlevel li:hover ul li a:hover{ /* here define explicit hover states--what happens when hover each individual link. */
   color:#ccc;
   background:#790101;
}