Probleme mit dem Viewport

[Anima97]

Guten Tag,
ich habe mich letztens mal an einer eigenen Website versucht. Die Seite sieht eigentlich auch ganz gut aus, nur habe ich noch ein kleines Problem mit der Darstellung der Div's, genauer gesagt mit dem Viewport:

/**
  * Main declarations for Manu@web
  *
  * @author		Manuel J.
  * @copyright	2011 Manuel J.
  */

@font-face {
	font-family:Opificio;
	src:url(../fonts/opificio.ttf);
}
		
body {
	background-color:black;
	background-image:url(../images/stripe.gif);
}

a {
	color:black;
	text-decoration:none;
	text-shadow:0 0 1px #000000;
}

#header {
	font-family:Opificio;
	font-size:100px;
	color:yellow;
	text-shadow:0 0 5px yellow;
	text-align:center;
}
		
#slogan {
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:25px;
	text-shadow:0 0 5px #FFFFFF;
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}
		
#content {
	background-color:#CCCCCC;
	margin:50px 350px 50px 350px;
	font-family:Arial, Helvetica, sans-serif;
	text-align:left;
	padding-left:10px;
	padding-right:10px;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
}
		
.navi {
	background-color:#C7FE7C;
	border:1px solid #000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	height:250px;
	left:200px;
	padding:10px 5px;
	position:absolute;
	top:205px;
	width:115px;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
}
		
.navi a {
	color:black;
	text-decoration:none;
	text-shadow:0 0 0.4px #000000;
}

.navi b {
	color:black;
	text-shadow:0 0 0.4px #000000;
}
		
h2 {
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:0 0 0.4px black;
	color:#333333;
}

b {
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:0 0 0.3px black;
	color:#333333;
}

#footer {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	padding:5px;
	text-align:center;
}

.textbox {
	padding:5px;
	margin:25px 10px;
	border:1px solid #333333;
	-moz-box-shadow:-5px -5px 5px #888;
	-webkit-box-shadow:-5px -5px -5px #888;
	box-shadow:-5px -5px -5px #888;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
}

.textbox h3 {
    margin-top:0;
}

.textbox p {
    margin:1px;
}

#pagination {
	text-align:center;
}

#comments {
	font-size:14px;
}

#posttitle:link {
	text-shadow:none;
}

#posttitle:hover {
	text-shadow:none;
	text-decoration:underline;
}

Das ist mein (ziemlich umständlich geschriebener und noch nicht optimierter) Stylesheet. Es geht konkret um die ersten Div's (header, slogan und content).
Sobald ich mein Browserfenster minimiere, verschieben sich die Container ungewollt.

Was kann ich tun, um diesen Effekt zu verhindern?
So sieht die Website momentan aus: http://manuweb.taess.net (optimiert für Firefox)