CSS question

Can anyone help me figure out why one of my divs wont line up where it's supposed to? The "rnav" div lines up about 2% to the right of where it's supposed to go.

Here is my code and the css sheet, any ideas would be helpful.

Thanks,

-Lion

<div id="body">
<div class="body"></div>

<div id="header">
<div class="header"></div>

<div id="lnav">
<div class="lnav"></div>

<div id="content">
<div class="content"></div>

<div id="rnav">
<div class="rnav"></div>


.body {
height: 100%;
width: 100%;
left: 0%;
top: 0%;
position: absolute;
}
.header {
height: 30%;
width: 90%;
top: 0%;
background-attachment: fixed;
background-image: url(/Images/logo.jpg);
background-repeat: no-repeat;
background-position: center top;
background-color: #FFFFFF;
left: 5%;
position: relative;
}
.lnav {
height: 60%;
width: 10%;
left: 5%;
top: 30%;
position: absolute;
}
.content {
height: 60%;
width: 70%;
left: 15%;
top: 30%;
background-image: url(/Images/TestBackground.jpg);
background-repeat: no-repeat;
position: absolute;
margin: 0%;
}
.rnav {
height: 60%;
width: 10%;
left: 85%;
top: 30%;
position: absolute;
background-color: #2C3260;
}