Please help me how to center Ultimate Horizontal Drop-Down Menu Demo on DIV

ultimate.horizontal.html
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Ultimate Horizontal Drop-Down Menu Demo</title>
<link href="css/dropdown/dropdown.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/dropdown/themes/default/default.ultimate.css" media="screen" rel="stylesheet" type="text/css" />

<!--[if lt IE 7]>
<script type="text/javascript" src="js/jquery/jquery.js"></script>
<script type="text/javascript" src="js/jquery/jquery.dropdown.js"></script>
<![endif]-->

</head>
<body>

<h1>Ultimate Horizontal Drop-Down Menu Demo</h1>

<div id="catmenu">
<ul id="nav" class="dropdown dropdown-horizontal">
	<li><a href="./">Home</a></li>
	<li><span class="dir">About Us</span>
		<ul>
			<li><a href="./">History</a></li>
			<li><a href="./">Our Vision</a></li>
			<li><span class="dir">The Team</span>
				<ul>
					<li><a href="./">Brigita</a></li>
					<li><a href="./">John</a></li>
					<li><a href="./">Michael</a></li>
					<li><a href="./">Peter</a></li>
					<li><a href="./">Sarah</a></li>
				</ul>
			</li>
			<li><a href="./">Clients</a></li>
			<li><a href="./">Testimonials</a></li>
			<li><a href="./">Press</a></li>
			<li><a href="./">FAQs</a></li>
		</ul>
	</li>
	<li><span class="dir">Services</span>
		<ul>
			<li><a href="./">Product Development</a></li>
			<li><a href="./">Delivery</a></li>
			<li><a href="./">Shop Online</a></li>
			<li><a href="./">Support</a></li>
			<li><a href="./">Training &amp; Consulting</a></li>
		</ul>
	</li>
	<li><span class="dir">Products</span>
		<ul>
			<li><a href="./" class="dir">New</a>
				<ul>
					<li><a href="./">Corporate Use</a></li>
					<li><a href="./">Private Use</a></li>
				</ul>
			</li>
			<li><a href="./" class="dir">Used</a>
				<ul>
					<li><a href="./">Corporate Use</a></li>
					<li><a href="./">Private Use</a></li>
				</ul>
			</li>
			<li><a href="./">Featured</a></li>
			<li><a href="./">Top Rated</a></li>
			<li><a href="./">Prices</a></li>
		</ul>
	</li>
	<li><a href="./">Gallery</a></li>
	<li><a href="./">Events</a></li>
	<li><a href="./">Careers</a></li>
	<li><a href="./" class="dir">Contact Us</a>
		<ul>
			<li><a href="./">Enquiry Form</a></li>
			<li><a href="./">Map &amp; Driving Directions</a></li>
			<li><a href="./">Your Feedback</a></li>
		</ul>
	</li>
</ul>
</div>

</body>
</html>

css/dropdown/dropdown.css
Code:
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;
 display: block;
 /*margin: 0;
 padding: 0;*/
}

ul.dropdown {
 position: inherit;
 z-index: 597;
/* float: left;*/
}

ul.dropdown li {
 float: left;
 line-height: 1.3em;
 vertical-align: middle;
 zoom: 1;
 text-align:left;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
 position: relative;
 z-index: 599;
 cursor: default;
}

ul.dropdown ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
/* left: 0;*/
 z-index: 598;
 width: 100%;
}

ul.dropdown ul li {
 float: none;
}

ul.dropdown ul ul {
 top: 1px;
 left: 99%;
}

ul.dropdown li:hover > ul {
 visibility: visible;
}

css/dropdown/themes/default/default.ultimate.css
Code:
#catmenu{
 text-align:center;
 width:100%;
 background:#f6f6f6;
 border-style: solid;
 border-width: 1px 1px 1px 0;
 border-color: #fff #d9d9d9 #d9d9d9;
 height: 34px;
 top: 0;
 right: 0;
 margin: 0;
 padding: 0;
}



ul.dropdown {
 font-weight: bold;
}

	ul.dropdown li {
	 padding: 7px 10px;
	 border-style: solid;
	 border-width: 1px 1px 1px 0;
	 border-color: #fff #d9d9d9 #d9d9d9;
	 background-color: #f6f6f6;
	 color: #000;
	}

	ul.dropdown li.hover,
	ul.dropdown li:hover {
	 background-color: #eee;
	 color: #000;
	}

	ul.dropdown a:link,
	ul.dropdown a:visited	{ color: #000; text-decoration: none; }
	ul.dropdown a:hover		{ color: #000; }
	ul.dropdown a:active	{ color: #ffa500; }


	/* -- level mark -- */

	ul.dropdown ul {
	 width: 150px;
	 margin-top: 1px;
	}

		ul.dropdown ul li {
		 font-weight: normal;
		}



/*-------------------------------------------------/
 * @section		Support Class `dir`
 * @level sep	ul, .class
 */


ul.dropdown *.dir {
 padding-right: 20px;
 background-image: url(images/nav-arrow-down.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}


/* -- Components override -- */

ul.dropdown-horizontal ul *.dir {
 padding-right: 15px;
 background-image: url(images/nav-arrow-right.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul.dropdown-upward *.dir {
 background-image: url(images/nav-arrow-top.png);
}

ul.dropdown-vertical *.dir,
ul.dropdown-upward ul *.dir {
 background-image: url(images/nav-arrow-right.png);
}

ul.dropdown-vertical-rtl *.dir {
 padding-right: 10px;
 padding-left: 15px;
 background-image: url(images/nav-arrow-left.png);
 background-position: 0 50%;
}
css/dropdown/themes/default/default.css
Code:
#catmenu{
 text-align:center;
 width:100%;
 background:#f6f6f6;
 border-style: solid;
 border-width: 1px 1px 1px 0;
 border-color: #fff #d9d9d9 #d9d9d9;
 height: 34px;
 top: 0;
 right: 0;
 margin: 0;
 padding: 0;
}



ul.dropdown {
 font-weight: bold;
}

	ul.dropdown li {
	 padding: 7px 10px;
	 border-style: solid;
	 border-width: 1px 1px 1px 0;
	 border-color: #fff #d9d9d9 #d9d9d9;
	 background-color: #f6f6f6;
	 color: #000;
	}

	ul.dropdown li.hover,
	ul.dropdown li:hover {
	 background-color: #eee;
	 color: #000;
	}

	ul.dropdown a:link,
	ul.dropdown a:visited	{ color: #000; text-decoration: none; }
	ul.dropdown a:hover		{ color: #000; }
	ul.dropdown a:active	{ color: #ffa500; }


	/* -- level mark -- */

	ul.dropdown ul {
	 width: 150px;
	 margin-top: 1px;
	}

		ul.dropdown ul li {
		 font-weight: normal;
		}



/*-------------------------------------------------/
 * @section		Support Class `dir`
 * @level sep	ul, .class
 */


ul.dropdown *.dir {
 padding-right: 20px;
 background-image: url(images/nav-arrow-down.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}


/* -- Components override -- */

ul.dropdown-horizontal ul *.dir {
 padding-right: 15px;
 background-image: url(images/nav-arrow-right.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul.dropdown-upward *.dir {
 background-image: url(images/nav-arrow-top.png);
}

ul.dropdown-vertical *.dir,
ul.dropdown-upward ul *.dir {
 background-image: url(images/nav-arrow-right.png);
}

ul.dropdown-vertical-rtl *.dir {
 padding-right: 10px;
 padding-left: 15px;
 background-image: url(images/nav-arrow-left.png);
 background-position: 0 50%;
}
Thank you.