I have a web page with a horizontal menu that sticks to the top of my screen even when you scroll down the page, It works perfectly but I now have to many items under each menu so I need to create sub menu's. I need to keep my format for my menu such as color, font size and the fact that it sticks to the top while scrolling, and create a sub-menu.

games
------flash
----------Pac-man
---------- Mario
---------- fake game name
------Downloadable
---------- Track Mania
---------- Maple story

Kind of like that were instead of all the games are under games, they have there own sub-menu (this is just an example lol not my true content).




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>PortalWolf Games Movies TV</title>
<script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script>



<link rel="stylesheet" type="text/css" href="/css/result-light.css">


<script type='text/javascript' src="https://raw.github.com/LiranCohen/stickUp/master/stickUp.min.js"></script>


<style type='text/css'>
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
margin: 0;
padding: 0;
position: relative;
}
#cssmenu:after,
#cssmenu ul:after {
content: '';
display: block;
clear: both;
}
#cssmenu a {
color: #FF0000;
display: inline-block;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
font-size: 12px;
min-width: 35px;
text-align: center;
text-decoration: none;
text-shadow: 0 -1px 0 #000000;
}
#cssmenu ul {
list-style: none;
}
#cssmenu > ul > li {
float: left;
}
#cssmenu > ul > li.active a {
background: #000000 url(grad_dark.png) repeat-x left bottom;
background: -moz-linear-gradient(top, #000000 0%, #000000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(100%, #000000));
background: -webkit-linear-gradient(top, #000000 0%, #000000 100%);
background: -o-linear-gradient(top, #000000 0%, #000000 100%);
background: -ms-linear-gradient(top, #000000 0%, #000000 100%);
background: linear-gradient(to bottom, #000000 0%, #000000 100%);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
box-shadow: inset 0 0 10px #000000, inset 0 10px 10px #000000;
-moz-box-shadow: inset 0 0 10px #000000, inset 0 10px 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000, inset 0 10px 10px #000000;
filter: none;
}
#cssmenu > ul > li.active a:hover {
background: -moz-linear-gradient(top, #000000 0%, #000000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(100%, #000000));
background: -webkit-linear-gradient(top, #000000 0%, #000000 100%);
background: -o-linear-gradient(top, #000000 0%, #000000 100%);
background: -ms-linear-gradient(top, #000000 0%, #000000 100%);
background: linear-gradient(to bottom, #000000 0%, #000000 100%);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
filter: none;
}
#cssmenu > ul > li a {
box-shadow: inset 0 0 0 1px #000000;
-moz-box-shadow: inset 0 0 0 1px #000000;
-webkit-box-shadow: inset 0 0 0 1px #000000;
background: #000000 url(grad_dark.png) repeat-x left top;
background: -moz-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #000000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(50%, #000000), color-stop(51%, #000000), color-stop(100%, #000000));
background: -webkit-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #000000 100%);
background: -o-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #000000 100%);
background: -ms-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #000000 100%);
background: linear-gradient(to bottom, #000000 0%, #000000 50%, #000000 51%, #000000 100%);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
border-bottom: 1px solid #000000;
border-top: 1px solid #000000;
border-right: 1px solid #000000;
line-height: 34px;
padding: 0 35px;
filter: none;
}
#cssmenu > ul > li a:hover {
background: #000000 url(grad_dark.png) repeat-x left bottom;
background: -moz-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #525252 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(50%, #000000), color-stop(51%, #000000), color-stop(100%, #525252));
background: -webkit-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #525252 100%);
background: -o-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #525252 100%);
background: -ms-linear-gradient(top, #000000 0%, #000000 50%, #000000 51%, #525252 100%);
background: linear-gradient(to bottom, #000000 0%, #000000 50%, #000000 51%, #c 100%);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
filter: none;
}
#cssmenu > ul > li:first-child a {
border-radius: 5px 0 0 5px;
-moz-border-radius: 5px 0 0 5px;
-webkit-border-radius: 5px 0 0 5px;
border-left: 1px solid #000000;
}
#cssmenu > ul > li:last-child a {
border-radius: 0 5px 5px 0;
-moz-border-radius: 0 5px 5px 0;
-webkit-border-radius: 0 5px 5px 0;
}
#cssmenu .has-sub:hover ul {
display: block;
}
#cssmenu .has-sub ul {
display: none;
position: absolute;
top: 36px;
left: -1px;
min-width: 100%;
text-align: center;
/* IE7 */

*width: 100%;
}
#cssmenu .has-sub ul li {
text-align: center;
}
#cssmenu .has-sub ul li a {
border-top: 0 none;
border-left: 1px solid #000000;
display: block;
line-height: 120%;
padding: 9px 5px;
text-align: center;
}
</style>



<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
//initiating jQuery
jQuery(function($) {
$(document).ready( function() {
//enabling stickUp on the '.navbar-wrapper' class
$('#cssmenu').stickUp();
});
});
});//]]>

</script>

<meta name="AUTHOR" content="Steven Wolf">
<meta name="KEYWORDS" content="TV, Games, Movies, Museums, Music, Chat">
<meta name="DESCRIPTION" content="Watch movies, watch tv, play games, visit virtual museums, listen to music and much much more online">
<meta name="GENERATOR" content="Created by BlueVoda Website builder http://www.bluevoda.com">
<meta name="HOSTING" content="Hosting Provided By VodaHost http://www.vodahost.com">
<style type="text/css">
body
{
background-color: #000000;
color: #FFFFFF;
scrollbar-face-color: #00FF00;
scrollbar-arrow-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #004040;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
}
</style>
<style type="text/css">
a
{
color: #FFFFFF;
}
a:visited
{
color: #FFFFFF;
}
a:active
{
color: #FFFFFF;
}
a:hover
{
color: #90F518;
}
</style>
<meta name="AUTHOR" content="Steven Wolf">
<meta name="KEYWORDS" content="TV, Games, Movies, Museums, Music, Chat">
<meta name="DESCRIPTION" content="Watch movies, watch tv, play games, visit virtual museums, listen to music and much much more online">
<meta name="GENERATOR" content="Created by BlueVoda Website builder http://www.bluevoda.com">
<meta name="HOSTING" content="Hosting Provided By VodaHost http://www.vodahost.com">
<style type="text/css">
body
{
background-color: #000000;
color: #FFFFFF;
scrollbar-face-color: #00FF00;
scrollbar-arrow-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #004040;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
}
</style>
<style type="text/css">
a
{
color: #FFFFFF;
}
a:visited
{
color: #FFFFFF;
}
a:active
{
color: #FFFFFF;
}
a:hover
{
color: #90F518;
}
</style>
</head>
<body>
<iframe name="frame" id="InlineFrame1" style="position:absolute;left:0px;top:33px;width:1358px;height:8799px;z-index:0;" src="./homeinfoframe.html" scrolling="no" frameborder="0">Your browser does not support inline frames or is currently configured not to display inline frames.</iframe>
<div id="Html1" style="position:absolute;left:0px;top:0px;width:974px;height:33px;z-index:1">
<div id='cssmenu'>
<ul>
<li class='Stream Portal'><a href="./homeinfoframe.html" target="frame">Home</a></li>
<li class='has-sub'><a href="./homeinfo.html" target="frame">TV</a>
<ul>
<li><a href="./justintv.html" target="frame">Justin</a></li>
<li><a href="http://www.mtv.com/ontv/" target="frame">MTV</a></li>
<li><a href="http://www.spike.com/episodes" target="frame">Spike</a></li>
<li><a href="http://www.cartoon-world.tv/cartoon-list/" target="frame">Toon</a></li>
<li><a href="./tubtub.html" target="frame">TubTub</a></li>
<li class='last'><a href="http://veetle.com/index.php/listing/index/shows" target="frame">Veetle</a></li>


</ul>
</li>

<li class='has-sub'><a href="./homeinfoframe.html" target="frame">Movies Online</a>
<ul>
<li><a href="./moviesearchframe.html" target="frame">Movie Search</a></li>
<li><a href="http://topdocumentaryfilms.com/" target="frame">Documentaries</a></li>
<li><a href="http://freeonlinemoviestream.co/" target="frame">Movie Stream</a></li>
<li><a href="./megashare.html" target="frame">MegaShare</a></li>
<li><a href="http://megavideo.to/" target="_blank">*Mega Video*</a></li>
<li><a href="http://putlocker.bz" target="frame">Putlocker</a></li>
<li><a href="http://www.cartoon-world.tv/movie-list/" target="frame">Toon</a></li>
<li><a href="http://viooz.co/" target="_blank">*Viooz*</a></li>
<li class='last'><a href="http://watch32.com/new-movies.html" target="frame">Watch32</a></li>

</ul>
</li>






<li class='has-sub'><a href="./homeinfoframe.html" target="frame">Games Online</a>
<ul>
<li><a href="./gamesearchframe.html" target="frame">Game Search</a></li>
<li><a href="http://gameswebfree.com/categories/25/mame.html" target="frame">Arcade</a></li>
<li><a href="./atari2600.html" target="frame">Atari 2600</a></li>
<li><a href="http://www.gbafun.com/" target="frame">GBA 1</a></li>
<li><a href="http://gameswebfree.com/categories/35/gameboy-advance.html" target="frame">GBA 2</a></li>
<li><a href="http://gameswebfree.com/categories/11/neo-geo.html" target="frame">Neogeo</a></li>
<li><a href="http://nesbox.com/game/nes" target="frame">Nes</a></li>
<li><a href="http://gameswebfree.com/categories/46/nintendo-ds.html" target="frame">Nintendo DS</a></li>
<li><a href="oldhandheld.html" target="frame">Old Hand Held</a></li>
<li><a href="http://www.xtdos.com/?cat=75" target="frame">PC 1</a></li>
<li><a href="http://gamesedition.com/games/browse#.UuhonLTnbIU" target="frame">PC 2</a></li>
<li><a href="http://www.playdosgames.com/" target="frame">PC 3</a></li>
<li><a href="http://www.retrosega.com/" target="frame">Sega Game Gear</a></li>
<li><a href="http://nesbox.com/game/sega" target="frame">Sega Genesis 1</a></li>
<li><a href="http://www.ssega.com/" target="frame">Sega Genesis 2</a></li>
<li><a href="http://nesbox.com/game/snes" target="frame">SNES 1</a></li>
<li><a href="http://www.snesfun.com/" target="frame">SNES 2</a></li>
<li class='last'><a href="http://www.tgx16.com/" target="frame">Turbografx 16</a></li>
</ul>
</li>

<li class='has-sub'><a href="./homeinfoframe.html" target="frame">Games & Apps</a>
<ul>
<li><a href="./all.html" target="frame">All</a></li>
<li><a href="./adventure.html" target="frame">Adventure</a></li>
<li><a href="./applications.html" target="frame">Applications</a></li>
<li><a href="./arcade.html" target="frame">Arcade</a></li>
<li><a href="./fps.html" target="frame">FPS</a></li>
<li><a href="./horror.html" target="frame">Horror</a></li>
<li><a href="./racing.html" target="frame">Racing</a></li>
<li><a href="./rpg.html" target="frame">RPG</a></li>
<li><a href="./space.html" target="frame">Space</a></li>
<li class='last'><a href="./strategy.html" target="frame">Strategy</a></li>
</ul>
</li>



<li class='has-sub'><a href="./homeinfoframe.html" target="frame">Music</a>
<ul>
<li><a href="http://www.itemvn.com/browse_songs/?sort=mp&genre=&t=m" target="frame">ItemVN</a></li>
<li class='last'><a href="http://www.presto.fm/" target="frame">Presto</a></li>
</ul>
</li>




<li class='has-sub'><a href="./homeinfoframe.html" target="frame">Other</a>
<ul>
<li><a href="https://www.facebook.com/" target="_blank">*Facebook*</a></li>
<li><a href="https://mail.google.com/mail/?tab=wm" target="_blank">*Gmail*</a></li>
<li><a href="./nhm.html" target="frame">Natural History Museum</a></li>
<li><a href="http://www.broadcastify.com/listen/coid/1" target="frame">Police Scanner U.S.A.</a></li>
<li><a href="https://twitter.com/" target="_blank">*Twitter*</a></li>
<li><a href="https://login.yahoo.com/config/login_verify2?&.src=ym&.intl=us" target="_blank">*Yahoo Mail*</a></li>
<li class='last'><a href="http://www.youtube.com/" target="_blank">*Youtube*</a></li>
</ul>
</li>
</ul>
</div>
<div style="height:25px">
</div></div>
</body>
</html>