Hello everyone,

I've a problem. My navigation bar is in the middle of the page in section Store, but when I go to Contact the navigation bar moves a little bit to the right. The code is the same voor the 2 pages. Can you help me? http://webshopproduct.net23.net/

Store page:
HTML Code:
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="mystyle.css">
		<title>Store</title>
	</head>
	<body>
		<ul id="list-nav" style="font-family: Verdana">
			<li><a href="index.html" title="Go to Store">Store</a></li>
			<li><a href="news.asp" title="Go to Home">News</a></li>
			<li><a href="contact.html" title="Go to Contact">Contact</a></li>
			<li><a href="about.asp" title="Go to Home">About</a></li>
			<img align="right" src="trusted2.png" width="100" height="61">
		</ul>
		
		<br></br>
		
		<iframe src="http://astore.amazon.com/webshopproduc-20" width="100%" height="4000" frameborder="0" scrolling="no"></iframe>
	</body>
</html>
Contact page:
HTML Code:
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="mystyle.css">
		<title>Contact</title>
	</head>
	<body>
		<ul id="list-nav" style="font-family: Verdana">
			<li><a href="index.html" title="Go to Store">Store</a></li>
			<li><a href="news.asp" title="Go to Home">News</a></li>
			<li><a href="contact.html" title="Go to Contact">Contact</a></li>
			<li><a href="about.asp" title="Go to Home">About</a></li>
			<img align="right" src="logo.png" width="100" height="61">
		</ul>
		
		<br></br>
		
		<p>You can contact me by sending an e-mail to: xxijkxx@hotmail.com</p>
	</body>
</html>
CSS:
HTML Code:
ul#list-nav {
	list-style:none;
	margin:0 auto;
	padding:0;
	width:525px;
}

ul#list-nav li {
	display:inline;
}

ul#list-nav li a {
	text-decoration:none;
	padding:5px 0;
	width:100px;
	background:#206BA2;
	color:#FFFFFF;
	float:left;
	text-align:center;
	border-left:1px solid #ffffff;
}

ul#list-nav li a:hover {
	background:#6397BE;
	color:#000000;
}