Problema en Safari con menu desplegable CSS

hola queridos amigos mi problema esta que en todos los navegadores se reproduce bien el segundo nivel del menu de la imagen pero cundo le agrego un tercer nivel la opcion que tiene el tercer nivel desaparece pero esta activo y me aparecen las opciones al colocar el puntero del mouse sobre el el unico problema es que desaparece en safari en los otros navegadores todo bien espero su ayuda adjunto la imagen comparativa para que vean a que me refiero gracias.

Sin el código fuente es imposible diagnosticar el problema.

este es el HTML

<ul class="nav IR">
<li class="link1"><a href="index.html"><em></em></a></li>
<li class="link2"><a href=""><em></em></a>
<ul>
<li><a href="cultura.html"><img src="images/subtitle_nuestrohotel.png" width="112" height="19" /></a></li>
<li><a href="instalaciones.html"><img src="images/subtitle_instalaciones.png" width="112" height="19" /></a></li>
</ul>
</li>
<li class="link3"><a href=""><em></em></a>
<ul>
<li><a href="spa.html"><img src="images/subtitle_outdoorspa.png" width="112" height="19" /></a></li>
<li><a href="restaurante.html"><img src="images/subtitle_restaurante.png" width="112" height="19" /></a></li>
<li><a href="salones.html"><img src="images/subtitle_nuestrosalones.png" width="112" height="19" /></a></li>
<li><a href="habitaciones.html"><img src="images/subtitle_habitaciones.png" width="112" height="19" /></a>
<li>Opcion 1</li>
<li>Opcion 2</li>
</li>
</ul>
</li>
<li class="link4"><a href="actividades.html"><em></em></a></li>
<li class="link5"><a href="calendario.html" class="active"><em></em></a></li>
<li class="link6"><a href="promociones.html"><em></em></a></li>
<li class="link7"><a href="contacto.html"><em></em></a></li>
</ul>

=======================================================================

Este es el CSS

ul.IR li {
position: relative;
font-size: 0.9em;
}

.IR em {
display: block;
position:absolute;
top:1px;
left:2px;
z-index: 1;
}


* html>body .IR {
position: static;
font-size: 10px;
}

* html>body .IR em { position: static; }

.nav {
position:absolute;
width:952px;
height:52px;
top:-14px;
left:-40px;
list-style: none;
}
.nav li { float: left; padding-bottom: 0px; }
.nav li, .nav li em { width:136px; height:50px; }

.link1 em, .link2 em, .link3 em, .link4 em, .link5 em, .link6 em, .link7 em {
background: url(../images/menu.png) no-repeat;
cursor: pointer;
}

.link1 em {left: 0px;}
.link1 em {background-position: 0 0;}

.link2 { left: -2px; }
.link2 em {background-position: -136px 0;}

.link3 { left: -2px; }
.link3 em {background-position: -272px 0;}

.link4 { left: -2px; }
.link4 em {background-position: -408px 0;}

.link5 em {left: 0px;}
.link5 em {background-position: -544px 0;}

.link6 { left: -2px; }
.link6 em {background-position: -680px 0;}

.link7 { left: -2px; }
.link7 em {background-position: -816px 0;}

.link1 a:hover em {background-position: 0 -50px;}
.link2 a:hover em {background-position: -136px -50px;}
.link3 a:hover em {background-position: -272px -50px;}
.link4 a:hover em {background-position: -408px -50px;}
.link5 a:hover em {background-position: -544px -50px;}
.link6 a:hover em {background-position: -680px -50px;}
.link7 a:hover em {background-position: -816px -50px;}

.link1 a.active em {background-position: 0 -50px;}
.link2 a.active em {background-position: -136px -50px;}
.link3 a.active em {background-position: -272px -50px;}
.link4 a.active em {background-position: -408px -50px;}
.link5 a.active em {background-position: -544px -50px;}
.link6 a.active em {background-position: -680px -50px;}
.link7 a.active em {background-position: -816px -50px;}

body { behavior: url(hover.htc); }

.nav a { display: block; }

.nav a {height: 1%; }

.Sub1 {
background: url(../images/submenu_up_img.png) no-repeat;
cursor: pointer;
}

.nav li ul {
position:relative;
z-index: 10;
top: 51px;
left: -999em;
padding:0;
list-style-type:none;
border: 0px solid #FFCC00;
}

.nav li:hover ul { left: auto; }

.nav li li {
height:auto;
padding-bottom:0px;
font-size:100%;
list-style-type:none;
border-bottom: 0px solid #FFCC00;
}

.nav li ul a {
width:136px;
height:15px;
margin-left:2px;
padding:0.7em;
color: #FFF;
background-image:url(../images/submenu_normal_img.png);
background-repeat:no-repeat;
}
.nav li ul a:hover {
color:#FFF;
background-image:url(../images/submenu_hover_img.png);
background-repeat:no-repeat;
}

.nav li ul ul {
margin: -6.4em 0 0 9.6em;
}

.nav li:hover ul ul, .nav li:hover ul ul ul, .nav li:hover ul ul ul ul, .nav li.sfhover ul ul, .nav li.sfhover ul ul ul, .nav li.sfhover ul ul ul ul {
left: -999em;
}

De hecho, seria mejor que pongas eso en algun servidor y nos muestres, ver solo el codigo no tiene mucho sentido.

ok aqui les dejo el enlace para que puedan descargarlo

http://www.megaupload.com/?d=CSLJGSCH

NEO_JP escribió:

Nótese el "subir a un servidor"

Disculpa pero yo no voy a ponerme a copiar código.
El que tiene el problema eres tú, haznos las cosas fáciles para que te podamos ayudar y sube el sitio a alguna parte.

ok aca les dejo el enlace para que puedan visualizarlo en linea

[url=www.ditmax.com/menucss/index.html][/url]