Hi, I was wondering if someone could help me with a dropdown navigation bar I've coded. It's all CSS. The problem is, even though I have the overflow hidden, when you hover on a topic that has sub-links, it pushes everything else down. You can see it at http://thestreetlight.net/clients/thearmoire. Or, I'll just copy and paste the code here if you prefer to look at it that way. Thanks in advance!

Code:
/* Navigation */
/* ---------------------------------------------------------- */

#navi {
	width: 620px;
	text-align: center;
	text-transform: lowercase;
	font-family: 'Muli', Arial, sans-serif;
	font-size: 13px;
	letter-spacing: 1px;
	color: #fff;
	padding: 0;
	margin: 0;
}

ul#navi a {
	text-decoration: none;
	color: #cacaca;
	background-color: #fff;
	padding: 3px 7px 3px 7px;
}

/* bg was #ede0cb */

ul#navi a:hover {
	text-decoration: none;
	color: #fff;
	background-color: #f4e0c1;
}


ul#navi {
	width: 620px;
	list-style: none;
	padding: 0 0 0 70px;
	margin: 0 auto;
}

ul#navi li {
	display: inline;
	list-style: none;
	float: left;
	padding: 0;
	margin: 4px;
}

ul#navi li ul {
	display: none;
}

ul#navi li a {
	display: block;
	text-decoration: none;
}

ul#navi li:hover ul {
	display: block;
	text-align: left;
}

ul#navi li:hover li {
	float: none;
	text-align: left;
}

ul#navi:hover {
	width: 620px;
}