Menu desplegable 100% CSS

[Milad]

hola a todos, tengo una duda que me está volviendo loco, y no logro encontrar el problema. veo que a todo el mundo le funcionó, y no veo que mi problema se haya repetido en el hilo.

El inconveniente: quiero usar el primer menu (horizontal y que se despliegue hacia abajo) pero no logro hacer que el menu me aparezca centrado. El nivel 2 parece que sí aparece centrado con respecto al contenedor general, entonces sucede que el nivel 2 se ve corrido hacia la derecha del nivel 1 (que no está centrado)

pego el código css, a ver si me pueden ayudar:

@charset "utf-8";
/* CSS Document */

/* Propiedades del fondo, para que ocupe todo el fondo de pantalla */

html, body {
background-color: #0e4663;
}

/* estilo que permite que el contenido del sitio se sitúe encima del fondo */

#scrollable {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
overflow:auto;
z-index:2;
}

/* caja */


#contenedor {
width: 760px;
margin: auto;
text-align: left;
background-color: #dde0db;
padding: 10px;
}

/* estilos de cabecera */

#cabecera {
text-align: center;
margin: auto;
}

#img_cabecera {
text-align: center;
margin: auto;
width:760px;
height:160px;
background-image: url('../img/encabezado.jpg');
}

#menu {
text-align: center;
font-family: Arial, sans-serif;
font-size: 10pt;
background-color: #094a2b;
width: 760px;
height: 25px;
margin: 0 auto;
}

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

#menu ul li.nivel1 { float: left;
width: 100px;
margin-right: 1px;
padding: 5px;
}
#menu ul li a {display: block;
text-decoration: none;
color: #fff;
background-color: #094a2b;
position: relative;
}

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

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

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

#menu ul li ul {display: none;
}

#menu ul li a:hover ul, #menu ul li:hover ul {display: block;
position: absolute;left: 0px;
}
#menu ul li ul li a {width: 100px;
border-top-color: #000;
}
#menu ul li ul li a:hover {border-top-color: #000;
position: relative;
}
table.falsa {border-collapse:collapse;
border:0px;
float: left;
position: relative;
}



/* estilos de contenido */

#colcont {
width: 740px;
background: #ccd6ce;
float: left;
margin-top: 10px;
margin-bottom: 10px;
padding: 10px;
}

#col1 {
width: 350px;
float: left;
font-family: Arial, sans-serif;
font-size: 10pt;
color: #0e4663;
text-align: left;
margin-left: 10px;
}

#col2 {
width: 350px;
float: left;
font-family: Arial, sans-serif;
font-size: 10pt;
color: #0e4663;
text-align: left;
margin-top: 40px;
margin-left: 20px;
}


/* estilos de pie */

#pie {
width: 760px;
font-family: Arial, sans-serif;
font-size: 8pt;
font-weight: strong;
color: #dde0db;
text-align: center;
background: #0e4663;
padding: 3px 0px 3px 0px;
margin-top: 10px;
clear: both;
}



/* estilos de formulario de contacto */

input {
width:330px;
height:20px;
color:#000;
font-family: Arial, sans-serif;
}

#boton {
float:left;
background:#fff;
color:#c4161c;
width: 50px;
height: 20px;
font-family: Arial, sans-serif;
font-size: 10px;
outline:none;
border: 0px;
}

.estilotextarea {
width: 330px;
height: 200px;
}

/* estilo de texto del contenido */

.titulo {
font-family: Arial, sans-serif;
font-size: 13pt;
text-align: left;
color: #0e4663;
font-weight: bold;
}

.subtitulo {
font-family: Arial, sans-serif;
font-size: 9pt;
text-align: left;
color: #0e4663;
font-weight: bold;
}

.requeridos {
font-family: Arial, sans-serif;
font-size: 9pt;
text-align: left;
color: #005b7b;
font-style:italic;
}

Espero que alguna persona pueda ayudarme, desde ya gracias!