Problema Barra de navegación

[Jackie_Star]

Saludos, soy nueva en el foro y creo que voy a plantear mis dudas aquí a partir de ahora. Felicitaciones!

Mi problema es sencillo, llevo poco tiempo aprendiendo css y suelo usar mi intuición y prueba tras prueba cuando tengo problemas. Pero este problema se me está resistiendo y seguramente es una tontería, pero no sé como arreglarlo...T_T

Resulta que mi navbar se crea mediante categorias pero a medida que he ido creando categorías se ha ampliado a una segunda barra de navegación extendida de la primera. El problema es que el estilo de la segunda barra no se ve, las categorías están ahi pero se ven en blanco. Quiero que se vean igual que en la primera barra y no se como arreglarlo. Probablemente debo modificar el style.css.

La web es esta: juegosvirtuales.com.es

Y el style css de la navbar es este:

Código CSS:

/******* TOP MENU ********/
 
#topmenu{
height:32px;
display:block;
padding:0px 0 0px 0px;
font: 14px Arial, Verdana, Arial, Sans-Serif;
font-weight:bold;
text-transform:uppercase;
background:#b21348 url(images/topmenu.png) no-repeat;
margin:10px 9px 10px 9px;
}
 
#topcatmenu{
margin: 0px;
padding: 0px;
width:962px;
height:32px;
}
    
#topcatmenu ul {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
}
    
#topcatmenu li {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
border-left:1px solid #990033;
}
 
#topcatmenu li.home {
border-left:none;
}
    
#topcatmenu li a, #topcatmenu li a:link, #topcatmenu li a:visited {
color:#fff;
display: block;
margin: 0px;
padding: 8px 15px 8px 15px;
}
 
#topcatmenu li a:hover, #topcatmenu li a:active {
color: #f7f7f7;
margin: 0px;
text-decoration: none;
}
 
#topcatmenu li li {
margin-left:-1px;
border-top:1px solid #b21348;
}
    
#topcatmenu li li a, #topcatmenu li li a:link, #topcatmenu li li a:visited {
background:#990033;
color:#fff;
font-weight: normal;
float: none;
margin: 0px;
padding: 5px 10px 5px 15px;
}
    
#topcatmenu li li a:hover, #topcatmenu li li a:active {
padding: 5px 10px 5px 15px;
background:#b8194e;
}
 
#topcatmenu li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 170px;
margin: 0px;
padding: 0px;
}
 
#topcatmenu li li { 
}
 
#topcatmenu li ul a { 
width: 140px;
}
 
#topcatmenu li ul a:hover, #topcatmenu li ul a:active { 
}
 
#topcatmenu li ul ul {
margin: -27px 0 0 175px;
}
 
#topcatmenu li:hover ul ul, #topcatmenu li:hover ul ul ul, 
#topcatmenu li.sfhover ul ul, #topcatmenu li.sfhover ul ul ul {
left: -999em;
}
 
#topcatmenu li:hover ul, #topcatmenu li li:hover ul, 
#topcatmenu li li li:hover ul, #topcatmenu li.sfhover ul, 
#topcatmenu li li.sfhover ul, #topcatmenu li li li.sfhover ul {
left: auto;
}
 
#topcatmenu li:hover, #topcatmenu li.sfhover { 
position: relative;
}
 

Este es el código correspondiente del archivo header de wordpress

Código PHP:

<div id="topmenu">
    <div id="topcatmenu">         
           <ul>
             <li class="home"><a href="<?php bloginfo('home'); ?>">Home</a></li>
             <?php wp_list_categories('sort_column=name&title_li=&depth=4'); ?>
           </ul>
    </div>
 

Una ayudita por favor. Lo agradecería mucho. Saludos.