Problema con subelemento menú

[lk2_89]

Buenas tardes amig@s:

vuelvo a haceros una pregunta sobre un menú por el que tuve que preguntar hace un par de semanas. La cosa es que en aquella ocasión, el problema se solucionó, pero ahora vuelvo a tener otro problemilla, a ver si podéis resolvérmelo. Resulta que cuando abro un subelemento de otro subelemento, se solapan entre sí y no se visualiza correctamente; aquí os dejo una imagen para que veáis a que me refiero.



Aquí os dejo los distintos códigos:

---------HTML---------

Código HTML:

<div class="menu">
                                            <ul class="nav">
                                                <li>
                                                    <a href="index.html">Inicio<span class="flecha">▼</span></a>
                                                </li>
                                                <li>
                                                    <a href="colecciones.html">Relojes<span class="flecha">▼</span></a>
                                                    <ul>
                                                        <li><a href="colecciones.html">Colecciones<span class="flecha">▼</span></a>
                                                            <ul>
                                                                <li><a href="colecciones.html">Tapi<span class="flecha">▼</span></a></li>
                                                            </ul>
                                                        </li>
                                                    </ul>
                                              </li>
                                                <li>
                                                    <a href="tiendas.html">Tiendas<span class="flecha">▼</span></a>
                                                    <ul>
                                                        <li><a href="cadiz.html">C&aacute;diz<span class="flecha">▼</span></a></li>
                                                        <li><a href="cordoba.html">C&oacute;rdoba<span class="flecha">▼</span></a></li>
                                                        <li><a href="castellon.html">Castell&oacute;n<span class="flecha">▼</span></a></li>
                                                        <li><a href="malaga.html">M&aacute;laga<span class="flecha">▼</span></a></li>
                                                        <li><a href="salamanca.html">Salamanca<span class="flecha">▼</span></a></li>
                                                        <li><a href="sevilla_capital.html">Sevilla capital<span class="flecha">▼</span></a></li>
                                                        <li><a href="sevilla_provincia.html">Sevilla provincia<span class="flecha">▼</span></a></li>
                                                    </ul>
                                              </li>
                                                <li>
                                                    <a href="contacto.html">Contacto<span class="flecha">▼</span></a>
                                                </li>
                                            </ul>        
         </div>
 

---------CSS del div que lo contiene---------

Código CSS:

.menu {
    padding-top:5px;
    margin:0 auto;
    width:960px;
    height:45px;
    }
 

---------CSS del menu en si---------

Código CSS:

* {
font-family:sans-serif;
list-style:none;
text-decoration:none;
margin:0;
padding:0;
text-align:center;
}
 
.nav {
    position: relative;
    z-index: 999;
}
 
.nav > li {
width:240px;
float:left;
}
 
.nav li a {
background:#20a64f;
color:#FFF;
display:block;
border:1px solid;
padding:10px 12px;
}
 
.nav li .flecha{
font-size: 9px;
padding-left: 6px;
display: none;
}
 
.nav li a:not(:last-child) .flecha {
display: inline;
}
 
.nav li a:hover {
background:#e61229;
}
 
.nav li {
position:relative;
}
 
.nav li ul {
display:none;
position:absolute;
min-width:240px;
}
 
.nav li:hover > ul {
display:block;
}
 
.nav li ul li ul {
right:-140px;
top:0;
}