Mysterious Margin-Right in Internet Explorer

[Epic]

I'm working on a site and I'm having some issues with a bug in Internet Explorer.

Here's the site:
http://www.360.ms

Everything looks fine in Firefox, but on the right side in Internet Explorer, there's a gap of 2px between the side of the container and the sidebar.

Here's my CSS:

body {
	margin: 0px;
	background-color: #383838;
	font-size: 11px;
	font-family: Verdana;
	text-align: center;
}
#all {
	text-align: center;
	width: 780px;
	margin-left: auto;
	margin-right: auto;
}
#container {
	width: 780px;
	text-align: left;
	background-color: #f1f1f1;
	border-left: 1px solid #222;
	border-right: 1px solid #222;
	border-bottom: 1px solid #222;
	margin-left: auto;
	margin-right: auto;
	float: left;
}
#menu {
	background-image: url(menu-back.jpg);
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	border-top: 1px solid #111;
	border-bottom: 1px solid #111;
	width: 780px;
}
#menu a {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	color: #ccc;
	background-image: url(menu-back.jpg);
	padding-left: 20px;
	padding-right: 20px;
	text-decoration: none;
}
#menu a:hover {
	background-image: url(menu-hover.jpg);
}
#sidebar {
	float: left;
	width: 180px;
	border-right: 1px solid #333;
	background-color: #555;
	color: #f4f4f4;
	margin: none;
	padding: none;
}
#sidebar h1 {
	font-size: 11px;
	color: #222;
	margin: 0px;
	text-align: center;
	background-image: url(head1.jpg);
	padding-top: 4px;
	padding-bottom: 4px;
}
#content {
	float: left;
	padding-left: 5px;
	width: 407px;
	padding-right: 5px;
}
#sidebar2 {
	float: right;
	width: 180px;
	border-left: 1px solid #333;
	background-color: #555;
	color: #f4f4f4;
	margin: none;
	padding: none;
}
#sidebar2 h1 {
	font-size: 11px;
	color: #222;
	margin: 0px;
	text-align: center;
	background-image: url(head1.jpg);
	padding-top: 4px;
	padding-bottom: 4px;
}

There's a few, not-so-efficient ways of doing things in my code, so don't laugh at me :red:

Thanks for the help