Hey everyone, I'm working on a website and I've run into a problem that's been stressing me out. I can't seem to figure out how to center my css menu. Any help is greatly appreciated. I used this program to create the menu http://css3menu.com/.

Here's an example of what it looks like:
http://ikandymag.net/theme/index.html

Here's the css:
Code:
ul#css3menu1,ul#css3menu1 ul{
	margin:0 auto;text-align:center;list-style:none;padding:0;background-color:#dedede;-moz-border-radius:9px;-webkit-border-radius:9px;border-radius:9px;}
ul#css3menu1 ul{
	display:none;position:absolute;left:0;top:100%;padding:0 10px 10px;background-color:#000000;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;border-color:#d4d4d4;}
ul#css3menu1 li:hover>*{
	display:block;}
ul#css3menu1 li:hover{
	position:relative;}
ul#css3menu1 ul ul{
	position:absolute;left:100%;top:0;}
ul#css3menu1{
	display:block;font-size:0;margin:0 auto;}
ul#css3menu1 li{
	display:block;white-space:nowrap;font-size:0;float:left;}
ul#css3menu1>li,ul#css3menu1 li{
	margin:0;}
ul#css3menu1 a:active, ul#css3menu1 a:focus{
	outline-style:none;}
ul#css3menu1 a,ul#css3menu1 a.pressed{
	display:block;vertical-align:middle;text-align:center;text-decoration:none;text-transform:uppercase;font:27px 'CaviarDreamsRegular', Arial, sans-serif;color:#000000;cursor:pointer;}
ul#css3menu1 ul li{
	float:none;margin:10px 0 0;}
ul#css3menu1 ul a{
	text-align:center;padding:4px;background-color:#000000;background-image:none;border-width:0;border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;font:14px 'CaviarDreamsRegular', Arial, sans-serif;color:#e8007b;text-decoration:none;}
ul#css3menu1 li:hover>a{
	background-color:#000000;border-color:#C0C0C0;border-style:solid;font:27px 'CaviarDreamsRegular', Arial, sans-serif;color:#ffffff;text-decoration:none;text-shadow:#FFF 0 0 1px;background-image:url("mainbk.png");background-position:0 100px;}
ul#css3menu1 img{
	border:none;vertical-align:middle;margin-right:10px;}
ul#css3menu1 img.over{
	display:none;}
ul#css3menu1 li:hover > a img.def{
	display:none;}
ul#css3menu1 li:hover > a img.over{
	display:inline;}
ul#css3menu1 li a.pressed img.over{
	display:inline;}
ul#css3menu1 li a.pressed img.def{
	display:none;}
ul#css3menu1 span{
	display:block;overflow:visible;background-position:right center;background-repeat:no-repeat;padding-right:0px;}
ul#css3menu1 a{
	padding:10px;background-color:#e8007b;background-image:url("mainbk.png");background-repeat:repeat;background-position:0 0;border-width:0 0 0 1px;border-style:solid;border-color:#C0C0C0;color:#000000;text-decoration:none;}
ul#css3menu1 li:hover>a,ul#css3menu1 li>a.pressed{
	background-color:#000000;background-image:url("mainbk.png");background-position:0 100px;border-style:solid;border-color:#C0C0C0;color:#ffffff;text-decoration:none;}
ul#css3menu1 ul li:hover>a,ul#css3menu1 ul li>a.pressed{
	background-color:#000000;background-image:none;font:14px 'CaviarDreamsRegular', Arial, sans-serif;color:#ffffff;text-decoration:none;}
ul#css3menu1 li.topfirst>a{
	height:18px;line-height:18px;border-radius:9px 0 0 9px;-moz-border-radius:9px 0 0 9px;-webkit-border-radius:9px;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;}
ul#css3menu1 li.topfirst:hover>a,ul#css3menu1 li.topfirst>a.pressed{
	line-height:18px;}
ul#css3menu1 li.topmenu>a{
	height:18px;line-height:18px;}
ul#css3menu1 li.topmenu:hover>a,ul#css3menu1 li.topmenu>a.pressed{
	line-height:18px;}
ul#css3menu1 li.toplast>a{
	height:18px;line-height:18px;border-radius:0 9px 9px 0;-moz-border-radius:0 9px 9px 0;-webkit-border-radius:0;-webkit-border-top-right-radius:9px;-webkit-border-bottom-right-radius:9px;}
ul#css3menu1 li.toplast:hover>a,ul#css3menu1 li.toplast>a.pressed{
	line-height:18px;}
Here's the html:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="EN" lang="EN" dir="ltr">
<head profile="http://gmpg.org/xfn/11">
<title>iKandy Magazine | Oh So Sweet!</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="imagetoolbar" content="no" />
<link rel="shortcut icon" href=""> 
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="CSS3 Menu_files/css3menu1/style.css" type="text/css" />
</head>
<body>
<div id="border">
</div>

<div id="headerbg">
<div id="header">
</div>
<ul id="css3menu1" class="topmenu">
<li class="topfirst"><a href="#" title="Models" style="height:45px;line-height:45px;"><span><img src="CSS3 Menu_files/css3menu1/bullet.png" alt="Models"/>Models</span></a>
<ul>
<li><a href="#" target="_top" title="Featured">Featured</a></li>
<li><a href="#" target="_top" title="Interviews">Interviews</a></li>
<li><a href="#" target="_top" title="Model Contest">Model Contest</a></li>
<li><a href="#" target="_blank" title="Model Of The Week">Model Of The Week</a></li>
</ul>

</li>
<li class="topmenu"><a href="#" title="Music" style="height:45px;line-height:45px;"><span><img src="CSS3 Menu_files/css3menu1/bullet.png" alt="Music"/>Music</span></a>
<ul>
<li><a href="#" target="_top" title="Featured">Featured</a></li>
<li><a href="#" target="_top" title="Interviews">Interviews</a></li>
<li><a href="#" target="_top" title="Current Contest">Current Contest</a></li>
<li><a href="#" target="_top" title="iKandy Favorites">iKandy Favorites</a></li>
</ul>

</li>
<li class="topmenu"><a href="#" title="DJs|Producers" style="height:45px;line-height:45px;"><span><img src="CSS3 Menu_files/css3menu1/bullet.png" alt="DJs|Producers"/>DJs|Producers</span></a>
<ul>
<li><a href="#" target="_top" title="Twitter's Top 5">Twitter's Top 5</a></li>
<li><a href="#" target="_top" title="Downloads">Downloads</a></li>
</ul>

</li>
<li class="topmenu"><a href="#" title="Life&amp;Love" style="height:45px;line-height:45px;"><span><img src="CSS3 Menu_files/css3menu1/bullet.png" alt="Life&amp;Love"/>Life&amp;Love</span></a>
<ul>
<li><a href="#" target="_top" title="Advice From JacQui">Advice From JacQui</a></li>
<li><a href="#" target="_top" title="Tips On Life">Tips On Life</a></li>
<li><a href="#" target="_top" title="Tips On Love">Tips On Love</a></li>
</ul>

</li>
<li class="toplast"><a href="#" title="Link" style="height:45px;line-height:45px;"><span><img src="CSS3 Menu_files/css3menu1/bullet.png" alt="Link"/>Link</span></a>
<ul>
<li><a href="#" target="_top" title="Link">Link</a></li>
<li><a href="#" target="_top" title="Link">Link</a></li>
<li><a href="#" target="_top" title="Link">Link</a></li>
</ul>

</li>
</ul>
</div>

<div id="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam id nisl nec libero tempor eleifend a ac diam. Proin vitae sodales libero. Curabitur eget euismod leo. Praesent quis leo nec lacus ullamcorper vehicula. Nullam tincidunt ligula ac quam adipiscing laoreet eu sed ligula. Pellentesque pulvinar consectetur ante, non mattis nisi scelerisque ut. Nam hendrerit, lorem sit amet commodo tempor, dui nisl dapibus arcu, quis dapibus ligula magna nec velit. Vestibulum ut odio eu neque placerat vestibulum. Curabitur non diam non libero malesuada dictum. Nam eleifend lorem sed libero sodales placerat.

Etiam ac nisl mauris, vitae lacinia lectus. Cras gravida adipiscing odio tristique ullamcorper. Donec ultrices laoreet nulla, quis placerat tellus convallis ut. Etiam tristique, metus id facilisis egestas, nunc urna ornare augue, sit amet volutpat lectus leo quis nisi. Duis elit velit, vulputate et convallis lacinia, auctor id dui. Etiam cursus sapien sed tortor egestas convallis. Pellentesque sit amet massa orci. Donec iaculis dui ac lorem imperdiet hendrerit. 
</div>
</body>
</html>
Any ideas?