Menu dropdown issue

I have been struggling with getting the menu dropdown to work, but in vain. Help would be appreciated.

Check out the website http://sodeitwp.designerr.net/. Its volunteer work for a NGO.

Here’s the css I am using.

ul#menu {
	margin:0px; padding:30px;
	position:absolute;
	right:0px;
}

ul#menu li {
	display:inline-block;
	vertical-align:top;
	margin-left:12px;
}

ul#menu li a {
	text-decoration:none;
	color:#716d6a;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
	text-transform:uppercase;
}

ul#menu li a.active, ul#menu li a:hover
{
	color:#211e1e;
}

ul#aboutuslinks li {
	display:inline;
	font-size:11px;
}

#menu .sub-menu {
	width: 212px;
	border:1px solid #A3A09E;
	background-color:#e7e4e3;
	position:absolute;
	padding:15px;
	margin-top:15px;
}

#menu ul.sub-menu li {
	display:block; float:left; margin:-1px; padding:0; width:212px;
}

#menu ul.sub-menu {
    display: none;
    list-style:none;
    z-index:100;
}

ul#menu li:hover #menu ul.sub-menu{
    display: block;
}