CSS - Positions Are Off

<div id="container">
 <div class="logo"></div><div class="top"></div>
 <div class="navline"></div>
<div class="navbar">

<div class="navsquare"><img src="images/faq.gif" alt="Taz Limousine Service Policy" width="43" height="41" /><br />F.A.Q.</div>
<div class="navsquare"><img src="images/fleet.gif" alt="Our Vehicles" width="43" height="41" /><br />Fleet</div>
<div class="navsquare"><img src="images/contact.gif" alt="Contact Us" width="43" height="41" /><br />Contact</div>
<div class="navsquare"><img src="images/maps.gif" alt="Maps & Directions" /><br />Maps</div>
</div>

<div class="content">
<div id="left">
 <div class="about">
   <p><br />
       <br />

     Taz Limousine is dedicated to dependable,courteous and quality service for business or personal transportation at competitive pricing. In order to achieve that goal in a secure and comfortable environment we rely on experienced chauffeurs and well maintained vehicles that meet city, state and federal regulations. Thank you for considering Taz Limousine Service.</p>
   <p>&nbsp;</p>
   <div class="weather">
     <div align="center">
    <br />
       <p></p>
     </div>
   </div>

   <div style="float:right; width:150px;"><br /><br />
     <h2>       Atlanta, GA</h2>
   </div>
 </div>
</div>
<div id="mid"> <div class="rotate"><img src="images/rotate/rotate.php" alt="Limousine Service Atlanta" /></div></div>
<div id="right"><div class="special">
  <h1>  Reserve A Limo Today!</h1>

</div></div>
</div>
</div>

body, html {
font-family:Arial, Helvetica, sans-serif;
color:white;
height:100%;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;

}
a:link {
	color: #FFFFFF;
	text-decoration: none;
	font-weight:bold;
}
a:visited {
	text-decoration: none;
	color: #0066FF;
}
a:hover {
	text-decoration: underline;
	color: #0000FF;
}
a:active {
	text-decoration: none;
	color: #FFFFFF;
}
#container {
width:800px;
margin: 0px auto;
position:relative;
background:#000033;
border: thin #0000ff solid;
}
.top {
	height: 108px;
	width: 800px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-image:url(images/gradient.jpg);
	background-repeat: repeat;
	z-index: 2;
}
.logo {
	background-image: url(images/taz-logo.gif);
	background-repeat: no-repeat;
	background-position:top;
	height: 60px;
	width: 305px;
	left: 0px;
	top: 25px;
	z-index:4;
	position:absolute;
}
.navline {
	background-image: url(images/blk-gradient.jpg);
	background-repeat: repeat-x;
	position: absolute;
	height: 42px;
	width: 100%;
	left: 0px;
	top: 108px;
	z-index: 3;
}
.content {
	background:#000033;
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0px;
	top: 0px;
	z-index: 1;
	border:solid #0000ff thin;
}
.navbar {
	position: absolute;
	height: 60px;
	left: 60%;
	top: 75px;
	z-index: 15;
	width:288px;
}
.navsquare {
	position:relative;
	float:left;
	height:60px;
	width:72px;
	background-image:url(images/nav-square.gif);
	background-repeat:no-repeat;
	text-align:center;
	font-size:9px;
	font-style:italic;
}

.about {
	position:relative;
	left:5%;
	top:40%;
	background-image:url(images/about_taz_limousine.gif);
	background-repeat:no-repeat;
	width:225px;
	height:150px;
	font-size:10px;
	padding-left:25px;
	z-index:4;
	}
.rotate {
	position:relative;

	top:10%;
	z-index:3;
}
.weather {
	position:absolute;
	background-color:#000033;
	top:159px;
	background-image:url(images/weatherbox.jpg);
	background-position:left;
	background-repeat:no-repeat;
	height:81px;
	width:94px;
	left: 6px;
}
.special {
	background-image:url(images/special.gif);
	width:271px;
	height:88px;
	position:absolute;
	text-align:center;
	top:15%;
	
}
#left {
float:left;
position:relative;
top:200px;
width:35%;
z-index:50;
}
#mid {
float:left;
position:relative;
top:175px;
width:35%;

}
#right {
float:left;
position:relative;
top:200px;
height:300px;
width:30%;
z-index:30;

}
h2 {
font-size:15px;
}
h1 {
font-size:18px;
font-variant:small-caps;
}