problemas con el menu horizontal

[WinderJerter]

hola que tal, les cuento que ando realizando un menu horizontal para mi web (xboxlatino.byethost10.com/) y lo quiero modificar... por sierto me estoy basando en el ejemplo de (documentoweb.com/CSS/Ejemplos/Menu-desplegable-1.html) y lo que pasa esque ese menu utiliza en div menu que en mi caso se llama navigation y nivel1 los mismos colores tanto cuando no esta ensima el maus y cuando esta

aqui les dejo el codigo css der archivo.. es el mismo del ejemplo pero yo lo acomode

Código:

#navigation {
	font-size:0.7em;
	text-align:center;
	width:696px;
}

#navigation ul {
	list-style-type:none;
}

#navigation ul li.nivel1 {
	float:left;
	width:174px;
}

#navigation ul li a {
	background-color:#399;
	color:#fff;
	display:block;
	padding:8px;
	position:relative;
	text-decoration:none;
}

#navigation ul li:hover {
	position:relative;
}

#navigation ul li a:hover, #navigation ul li:hover a.nivel1 {
	background-color:#6cc;
	color:#000;
	position:relative;
}

#navigation ul li a.nivel1 {
	display:block!important;
	display:none;
	position:relative;
}

#navigation ul li ul {
	display:none;
	left:0;
	position:absolute;
}

#navigation ul li a:hover ul, #navigation ul li:hover ul {
	display:block;
}

#navigation ul li ul li a {
	padding:6px 0 8px 0;
	width:174px;
}

#navigation ul li ul li a:hover {
	position:relative;
}

y lo que kiero conseguir que los colores de navigato y los del nivel1 sean diferentes tando en a como en a:hover... no se si se llame asi, espero que me puedan ayudar.

saludos y gracias de antemano