html.de - Menü klappt sofort wieder zu

by SpiceLab

HTML

<nav id="menu">  
  <ul>
    <li>Top-Item 1
      <ul>
        <li>Sub-Item 1.1</li>
        <li>Sub-Item 1.2</li>
        <li>Sub-Item 1.3</li>
      </ul>
    </li>
  </ul>
</nav>

CSS

#menu {
height: 100px;
width: 900px;
margin-left: 500px;
margin-top: 0;
position: relative;
background: #ddd;
}
#menu h3 {
font-size: 16px;
color: #fff;
padding: 10px;
margin: 0;
background: #000;
line-height: 20px;
}
#menu ul {
position: absolute;
margin: 0 auto;
list-style: none;
}
#menu ul li {
float: left;
margin: 0 0 0 0px;
font-size: 20px;
font-family: 'Bree Serif', serif;
line-height: 50px;
background: #666;
}
#menu ul li a {
color: #000;
text-decoration: none;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
#menu ul li a:hover {
color: #999;
}
#menu ul li img {
float: left;
width: 16px;
height: 16px;
margin: 14px 5px;
padding: 6px;
background: #999;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
#menu ul li:hover img {
background: #000;
}
#menu ul ul {
position: absolute;
top: -9999px;
background: #fff;
padding: 0;
margin: 0 0 0 -5px;
-webkit-box-shadow: 0 10px 20px #888;
-moz-box-shadow: 0 10px 20px #888;
box-shadow: 0 10px 20px #888;
}
#menu ul ul::before {
position: absolute;
content:"";
width: 10px;
height: 10px;
top: -5px;
left: 20px;
background: #000;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
#menu ul li:hover ul {
top: 50px;
padding-top: 5px;
}
#menu ul ul li {
float: none;
font-size: 16px;
padding: 5px 10px;
text-align: left;
text-transform: uppercase;
margin: 0;
border-bottom: 1px solid #ddd;
line-height: 20px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
transition: all .5s...