Add submenu to menu without submenu in CSS

[igotregistered]

I need to add a submenu to this menu which by default the CSS does not have submenu written.

Any help is greatly appreciated!!!

CSS

#header .topnav ul { 
-webkit-border-radius: 10px; 
-moz-border-radius: 10px; 
border-radius: 10px; 
border: 1px solid #3f3f3f; 
background: url(../images/nav-bg.gif) repeat-x left top; height: 40px; 
}

#header .topnav ul li:first-child { 
-webkit-border-radius: 10px 0 0 10px; 
-moz-border-radius: 10px 0 0 10px; 
border-radius: 10px 0 0 10px; 
}

#header .topnav ul li:last-child { 
border: 0; 
}

#header .topnav ul li { 
border-right: 1px solid #3f3f3f; 
float: left; 
font: bold 13px/40px Arial, Helvetica, sans-serif; 
text-transform: uppercase; 
text-shadow: 0 -1px 1px #000; 
}

#header .topnav ul li:hover, #header .topnav ul li.on { 
-webkit-box-shadow: 0 0 30px #000 inset; 
-moz-box-shadow: 0 0 30px #000 inset; 
box-shadow: 0 0 30px #000 inset; 
background: url(../images/nav-bg.gif) repeat-x left bottom; 
}

#header .topnav ul li a { 
display: block; 
line-height: 40px; 
color: #FFF; 
width: 123px; 
text-align: center; 
}

html

	<div class="topnav">

		<ul>

			<li class="on"><a href="index.php">Home</a></li>

			<li><a href="about-us.php">About Us</a></li>

			<li><a href="services.php">Our Services</a>
<ul>
<li>submenu 1</li>
<li>submenu 2</li>
</ul>
</li>

			<li><a href="products.php">Our Products</a></li>

			<li><a href="specials.php">Specials</a></li>

			<li><a href="faqs.php">FAQs</a></li>

			<li><a href="blog">Blog</a></li>

			<li><a href="contact-us.php">Contact Us</a></li>

		</ul>

	</div>

[igotregistered]

Working thanks!