Помощ за падащо меню

[confiscate]

Здравейте , ще Ви помоля за малко помощ за падащо меню. В момента имам следното:

<div id="navigation_wrap">
        <ul class="menu">
            <li>Начало</li>
            <li><b>|</b></li>
            <li><b><a href="#" class="links">Цени</a></b></li>
            <li><b>|</b></li>
            <li><b><a href="#" class="links">Резервации</a></b></li>
            <li><b>|</b></li>
            <li><b><a href="#" class="links">Треньори</a></b></li>
            <li><b>|</b></li>
            <li><b><a href="#" class="links">Турнири</a></b>
            <ul class="sub_menu">
                <li><b><a href="#">Текущ турнир</a></b></li>
                <li><b><a href="#">Регистрацияс</a></b></li>
            </ul>
            </li>
        </ul>
    </div>

С със следния css: [css]#navigation_wrap {
width:840px;
height: 100%;
overflow: hidden;
font-size: 14px;
color: #fff;
margin:0 auto;
text-align:center;
}

#navigation_wrap ul {
display: inline-block;
}

ul.menu li {
float:left;
padding-left:8px;
}
[/css]

Как мога да направя , така че като отида на турнири под него да падат 2 менюта: "Текущ турнир и Регистрация".

Ще съм Ви благодарен , ако ми помогнете малко с css.

Благодаря предварително !

Поздрави

 

[mapka7a]

#navigation_wrap li
{
	list-style-type: none;
	position: relative;
	width: 170px;
	background: #efef44;
}

#navigation_wrap  li a
{
	display: block;
	padding: 1px;
}

#navigation_wrap  li, #navigation_wrap li a
{
	float: left;
}

#navigation_wrap li ul
{
	position: absolute;
	top: 100%;
	right: 5%;
	line-height: 40px;
	display: none;
}

#navigation_wrap li:hover > ul
{
	display: block;
}

?