Lo del margen ocurre por varias razones. Principalmente por el valor left y que no quitaste el padding que por defecto llevan las listas.
Si cambias esto:
Código CSS:
Ver original#menu ul li a:hover ul, #menu ul li:hover ul {
display: block;
position: absolute;
left: 161px;
top:-1px!important;
top: -31px;
}
Por esto:
Código CSS:
Ver original#menu ul li:hover ul {
display: block;
position: absolute;
left: 100%;
top: 0;
padding: 0;
}
Se pone todo en su lugar.
Modifiqué el selector porque no tiene mucho sentido cambiar las propiedades a la lista al pasar el ratón por encima de dos elementos, basta uno.