Menu css desaparece con mootools.js, slideshow.js

[lana27]

Hola tengo la siguiente consulta, tengo una página dividida en header, content....
en el header tengo un menu solo con css para llamar al header hago un include dentro del index. Aqui viene el problema dentro del contenido tengo unas imagenes que se desplegan con mootools.js, slideshow.js pero una vez que quiero seleccionar el menu se pierde o desaparece. Que opción habría que agregar en el menú para que se habilite encima de las imagenes..

Gracias por la ayuda!!

Adjunto el código del css

Código CSS:

.dropList {height:35px; /*background:#FBC21B;*/ font-family:arial, sans-serif; font-size:8pt; position:relative;
 
}
.dropList ul {padding:0; margin:0; list-style:none;}
.dropList ul li div {position:absolute; left:-9999px; top:-9999px; background:url(../img/divBack_menu.gif); border:1px solid #aaa; border-top-color:#ddd; padding-bottom:6px;
-o-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-icab-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-khtml-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
 
-o-border-radius: 0 0 6px 6px;
-icab-border-radius: 0 0 6px 6px;
-khtml-border-radius: 0 0 6px 6px;
-moz-border-radius: 0 0 6px 6px; 
-webkit-border-bottom-right-radius: 6px; 
-webkit-border-bottom-left-radius: 6px;
border-radius: 0 0 6px 6px;
}
.dropList ul li div ul {width:180px; float:left;}
 
.dropList ul li {float:left;}
.dropList ul li a {display:block; padding:0 25px 0 10px; float:left; line-height:35px; text-decoration:none; font-weight:bold; color:#000;}
.dropList ul li a.fly {background:url(../img/arrow_menu.gif) no-repeat right center;}
.dropList ul ul li a {padding:0; width:180px; text-indent:10px; line-height:20px; font-weight:normal;}
.dropList ul ul li h4 {padding:8px 0 4px 0; margin:0;} 
.dropList ul ul li h4 a {padding:0; width:180px; text-indent:10px; line-height:20px; font-weight:bold; font-size:14px;}
 
.dropList ul li a:hover {background-color:#ddd;}
.dropList ul li:hover > a {background-color:#ddd;}
 
.dropList ul .fourCol:hover div {left:-1px; top:35px; width:720px;}
 
.dropList ul .threeCol:hover {position:relative;}
.dropList ul .threeCol:hover div {left:-1px; top:35px; width:540px;}
 
.dropList ul .twoCol:hover {position:relative;}
.dropList ul .twoCol:hover div {left:-1px; top:35px; width:360px;}
 
.dropList ul .oneCol:hover {position:relative;}
.dropList ul .oneCol:hover div {left:-1px; top:35px; width:180px;}
 
.dropList ul :hover div ul ul {position:absolute; left:-9999px; top:-9999px;}
 
.dropList ul :hover div ul .fly:hover {position:relative;}
.dropList ul :hover div ul .fly:hover ul {left:170px; top:-7px; background:#fff; border:1px solid #aaa; padding:6px 0;
-o-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-icab-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-khtml-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2);
 
-o-border-radius: 6px;
-icab-border-radius: 6px;
-khtml-border-radius: 6px;
-moz-border-radius: 6px; 
-webkit-border-radius: 6px; 
border-radius: 6px;
}
 
.dropList ul :hover div ul .fly:hover ul ul {left:-9999px; top:-9999px;}
 
.dropList ul :hover div ul .fly:hover ul .fly:hover ul {left:170px; top:-7px; background:#fff; border:1px solid #aaa;}
 
.dropList table {border-collapse:collapse; width:0; height:0; margin-bottom:-1px;}