Layer in Layer, mit css

[mabuhay]

Hallo

Hab ein kleines Problem. Ich bin gerade am Aufbau einer Seite und bin gerade daran das Menu zu erstellen. Das Menu hat vier Hauptpunkte, werden die angewählt wird das dazugehörige Untermenu darunter (im gleichen div-bereich) angezeigt. Die Farbe und die Ränder sind beim Hauptmenu per CSS definiert, beim Untermenu auch (ein wenig eingerückt,  hover-effekt). Dies funktioniert auch. Möchte ich aber jetzt beim Untermenu eine andere Hintergrundfarbe per CSS definieren, geht nix. Habe gedacht da der Untermenulayer ja über dem Hauptlayer steht sollte das gehen.
Die seite ist: http://test.thnaeff.ch/mytinyarchive/index.php

Hier mal die wichtigen teile:
-------------------------------

der Hauptmenupunkt:

  
<div class="index" style="text-align:<?php echo menu_align("index", "0"); ?>">  
<a href="?content=index"><?php echo menu_mark("index", "0", ":: "); ?>Home</a>  
<?php show_submenu("index"); ?>  
</div>  

das Untermenu:

  
<!-- auch das auswechseln des PHP-Teils durch "#FF0000" und "bold" bringt nix -->  
<div class="mta_submenu" style="background-color:<?php echo menu_mark("news", "1", "#FF0000"); ?>; font-weight:<?php echo menu_mark("news", "1", "bold"); ?>;">  
<a href="?content=index.news">News</a>  
</div>  

CSS für den Hauptmenupunkt:

  
.index, .programme, .dokumente, .fundgrube {  
padding-left:5px;  
padding-right:5px;  
border-top-color:#000000;  
border-top-style:dotted;  
border-top-width:1px;  
border-bottom-color:#000000;  
border-bottom-style:dotted;  
border-bottom-width:1px;  
margin-bottom:5px;  
}  
  
.index a, .programme a, .dokumente a, .fundgrube a {  
display:block;  
text-decoration:none;  
font-weight:bold;  
color:#000000;  
}  
  
.index a:hover, .programme a:hover, .dokumente a:hover, .fundgrube a:hover {  
text-align:center;  
display:block;  
}  
  
.index a {  
background-color:#C8EEFD;  
}  

CSS für das Untermenu:

  
.mta_submenu {  
background-color:#0000FF;  
  
}  
  
.mta_submenu a {  
display:block;  
text-decoration:none;  
font-weight:normal;  
text-align:right;  
margin-left:5px;  
padding-right:10px;  
}  
  
.mta_submenu a:hover {  
background-color:#FFFFFF;  
text-align:right;  
font-weight:bold;  
}  

hoffe ihr könnt damit was anfangen
gruss