горизонтальное меню. хелп ми

если пользователь наводит на кнопку1 выпадает все содержимое меню и подменю.

делаю стилями, в принципе уже начало получатся, остались мелочи.. спасибо. вопрос закрыт.

но я по сути тупым путем делаю. применяю разные класса к каждому уровню меню..

хотелось бы узнать конечно как это по человечески сделать..

<div id="menu">

    	<ul>

	<li class="m4">
		<a class="m33"  href="#">Пункт №2</a>
		<ul>
			<li class="menu3"><a class="m3" href="#">Подпункт №1</a> </li>
            <li  style="border-top:1px solid #FFFFFF;"  class="lvl3"><a class="lvla3" href="#">Подпункт №11</a> </li>
            <li class="lvl3"><a class="lvla3" href="#">Подпункт №12</a> </li>
			<li class="menu3"><a class="m3"  href="#">Подпункт №2</a></li>
			<li class="menu3"><a class="m3"  href="#">Подпункт №3</a></li>
		</ul>
	</li>

</ul></div>

#menu {
	background: url("img/menu_bg.png") repeat-x scroll 0 0 transparent;
    height: 45px;
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-family: Georgia;
	text-align:center;
	margin:0 auto;
	display:table;

		}
.m4 {
	list-style: none;
	float: left;
	height: 33px;
	padding: 0;
	margin: 0;
	width: 150px;
	text-align: center;

	position: relative;
	padding-top: 12px;
	}
#menu li ul {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 150px;
	display: none;
	position: absolute;
	left: 0;
	top: 45px;
	}

.menu3{
	float: none;
border-top:1px solid #FFFFFF;

	margin: 0;
	width: 150px;
	text-align: center;
	background: #7F7F7F;
	height:40px;

	}

	.lvl3 {
	float: none;
	height: 40px;
	margin: 0;
	width: 150px;
	text-align: center;
	background: #D6D6D6;
	font-size:11px;
	color:#F00;
	height:25px;

	}
.lvla3{
	display: block;
	margin-left:10px;
	padding-top:5px;
	width: 150px;
	height: 33px;
	color: #333;
	text-decoration: none;
		}	

.m33{
	display: block;
	width: 150px;

	color: #fff;
	text-decoration: none;
		}

.m3{
	display: block;
	width: 150px;
	margin-top:10px;
	color: #fff;
	text-decoration: none;
		}

#menu li:hover ul, #menu li.jshover ul {
	display: block;
	}
#menu li:hover, #menu li.jshover {
	background: #424242;
	}