SOLUCIONADO.
Al final encontré con la solución, tuve que meter algo más de código en el css, en negrita os pongo he escrito la palabra "AÑADIDO!" para que veáis lo que he puesto para que funcione.
Código CSS:
Ver originalnav ul {
padding: 0;
list-style-type: none;
float: left;
margin: 0;
width: 77%;
box-sizing: border-box;
-moz-box-sizing: border-box;
height: 52px;
}
nav ul li {
display: block;
text-align: center;
float: right;
line-height: 2.2em;
font-family: 'Marcellus SC', serif;
font-size: 1em;
margin: 0 0 0 5%;
width: 15%;
}
nav li a {
display: block;
text-decoration: none;
color: #2c455b;
background-color: #e9e8e8;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, .5);
box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, .5);
text-shadow: 1px 1px 1px rgba(000,000,000,0.2);
}
nav ul li a:hover {
background-color: #1f3948;
color: #e7e5e5;
}
nav ul li ul {
padding: 0;
margin: 0 0 0 -50%;
width: 200%;
height: 150px;
z-index: 2;
display: none; /*** AÑADIDO!!! ***/
}
nav ul li ul li {
display: none;
width: 100%;
float: left;
margin: 10px 0 0 0;
}
nav ul li:hover ul li {
display: block;
}
nav ul li:hover ul {
display: block /*** AÑADIDO! ***/
}
Aquí podéis ver como ha quedado ;)
http://sergibeltran.com/jim3/#
Gracias por la ayuda ;)