Riesen Problem mit Dropdownmenü und css

Hallo, versuche seit einieger Zeit ein Dropdownmenü in mein Template einzubauen. wia HTML geht auch alles, aber wenn ich es mit show_menu2 mache geht nix.

dieses ist der orginalcode des menüs

<nav>
<ul id="menu" >
<li class="current"><a href="index.html">Home</a></li>
         <li><a href="http://www.fussball-in-regensburg.de/pages/1.-mannschaft.php">1. Mannschaft</a><ul>
               <li><a href="http://www.fussball-in-regensburg.de/pages/1.-mannschaft/der-kader.php">Der Kader</a></li>
               <li><a href="http://www.fussball-in-regensburg.de/pages/1.-mannschaft/spielplan.php">Spielplan</a></li>
               <li><a href="http://www.fussball-in-regensburg.de/pages/1.-mannschaft/aktuelle-tabelle.php">Aktuelle Tabelle</a></li>
               <li><a href="page_boxy_white.htm l">Kreuztabelle</a></li>
               <li><a href="http://www.fussball-in-regensburg.de/pages/1.-mannschaft/bilder.php">Bilder</a></li>
               <li><a href="http://www.fussball-in-regensburg.de/pages/1.-mannschaft/videos.php">Videos</a></li>
            </ul>
</li>
         <li>
       <a href="pages.html">2. Mannschaft</a>
   <ul>
   <li><a href="page_boxy_black.htm l">Der Kader</a></li>
               <li><a href="page_boxy_black_wwh ite.html">Spielplan</a></li>
               <li><a href="page_boxy_black_com bined.html">Aktuelle Tabelle</a></li>
               <li><a href="page_boxy_white.htm l">Kreuztabelle</a></li>
               <li><a href="page_boxy_white_wbl ack.html">Bilder</a></li>
            </ul>
   </li>
         <li><a href="page_boxy_black.htm l">Senioren A</a>
            <ul>
                <li><a href="page_boxy_black.htm l">Der Kader</a></li>
               <li><a href="page_boxy_black_wwh ite.html">Spielplan</a></li>
               <li><a href="page_boxy_black_com bined.html">Aktuelle Tabelle</a></li>
               <li><a href="page_boxy_white.htm l">Kreuztabelle</a></li>
               <li><a href="page_boxy_white_wbl ack.html">Bilder</a></li>
            </ul>
         </li>
         <li><a href="page_boxy_black.htm l">Senioren B</a>
            <ul>
                <li><a href="page_boxy_black.htm l">Der Kader</a></li>
               <li><a href="page_boxy_black_wwh ite.html">Spielplan</a></li>
               <li><a href="page_boxy_black_com bined.html">Aktuelle Tabelle</a></li>
               <li><a href="page_boxy_white.htm l">Kreuztabelle</a></li>
               <li><a href="page_boxy_white_wbl ack.html">Bilder</a></li>
            </ul>
         </li>

         <li><a href="contact.html">Junioren</a></li>
   </ul>

   <br class="clear" />
   </nav>

----------------------------------------------------------------------------------------------------------------------------------
CSS:
#menu {

   list-style: none;

}

#menu li {

   float: left;

   margin: 0 13px 0 0;

   padding-bottom: 5px;

   position: relative;

}

#menu li a {

   display: block;

   color: #9d9d9d;

   font-size: 14px;

   padding-bottom: 3px;

   border-bottom: 1px solid #2a2a2a;

   font-family: 'BebasRegular', Georgia, 'Times New Roman', Times, serif;

}

#menu li a:hover {

   color: #b60202;

   text-decoration: none;

}

#menu li.current a {}

   /* Level 2 */



   #menu ul {

      background: #000000; border: 1px solid #1b1b1a;   display: none;   padding: 5px;

      list-style: none;   position: absolute;   left: 0; top: 100%;

      z-index: 100;

      -webkit-box-shadow: 1px 1px 3px #000;

      -moz-box-shadow: 1px 1px 3px #000;

      box-shadow: 1px 1px 3px #000;

   }



   #menu li:hover > ul { display: block; }



   #menu ul li {

      float: none;

      margin: 0 0px 0 0;

      min-width: 120px;

      padding: 0px;

      padding-top: 2px;

   }

   #menu ul li a{padding: 2px 0px;}

   #menu ul li.last a{border-bottom: none;}

Kann mir jemand helfen das umzusetzen? was muß ich eingeben damit es so aussieht wie im Orginal?

Danke im Vorraus