Есть горизонтальное выпадающее меню в низ, но как его переделать чтобы он выпадал в верх?

[lektor]

Есть горизонтальное выпадающее меню в низ, но как его переделать чтобы он выпадал в верх?

Код естественно прилагается):

#nav { 
margin: auto; 
z-index: auto; 
display: block; 
} 
#nav li { float: left; } 
#nav li:hover { position: relative } 
#nav li:hover > a { 
background: #021A1A; 
box-shadow: 5px 5px 25px #000; 
-moz-box-shadow: 5px 5px 25px #000; 
-webkit-box-shadow: 5px 5px 25px #000; 
border-radius: 10px; 
-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
} 
#nav li.sub:hover > a { 
border-radius: 10px 10px 0 0; 
-moz-border-radius: 10px 10px 0 0; 
-webkit-border-radius: 10px 10px 0 0; 
} 
#nav li a { 
color: #fff; 
font-weight: bold; 
text-decoration: none; 
padding: 12px; 
display: block; 
} 
#nav li a:hover { background-color: #021A1A; } 
#nav li ul { 
background: #fff; 
margin-top: -2px; 
display: none; 
} 
#nav li:hover ul { 
display:block; 
position:absolute; 
} 
#nav li ul { 
background: rgba(255,255,255,0.5); 
padding: 10px 5px; 
box-shadow: 5px 5px 25px #000; 
-moz-box-shadow: 5px 5px 25px #000; 
-webkit-box-shadow: 5px 5px 25px #000; 
border-radius: 0px 15px 15px 15px; 
-moz-border-radius: 0px 15px 15px 15px; 
-webkit-border-radius: 0px 5px 5px 5px; 
} 
#nav li ul li a, #nav li ul li a:hover { 
background: transparent; 
color: #000; 
width: 150px; 
font-size: 0.95em; 
font-weight: normal; 
} 
#nav li ul li a:hover { text-decoration: underline; 
box-shadow: none; 
-moz-box-shadow: none; 
-webkit-box-shadow: none; 
border-radius: 0; 
-moz-border-radius: 0; 
-webkit-border-radius: 0; 
}

[4237723]

а можно и body