Crear un submenu dentro de otro submenu

[lk2_89]

Buenas noches:

estoy intentando crear un submenu dentro de otro submenu en CSS, pero no consigo que me salga como los anteriores elementos (este nuevo me sale sin color ni relleno).

Os adjunto foto y códigos.



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

Código 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:

Código CSS:

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

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

Código CSS:

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;
}