can someone help me out with my code?

my content is not working within it's respective div classes ...

here's the code ...

body {
margin:0px;
font-family: georgia, verdana, gill sans MT, arial;
font-size:12px;
line-height:18px;
background: #fff;
}

.content {
position:relative;
top:0px;
width:650px;
margin:10px auto;
background:#fff;
}

.main {
position:relative;
top:0px;
width:400px;
margin:10px;
background:#fff;
}

.menu {
font-size:12px;
padding:0px 0px;
margin:15px;
text-align:left;
width: 175px;
}

.archives {
font-size:12px;
padding:0px 15px;
margin:5px;
text-align:left;
border-bottom:0px #021FCE solid;
}

a {
text-decoration:none;
color:#930f1c;
}

.body a:hover {
border-bottom:0px dotted #fff;
}

.right a:hover {
border-bottom:0px dotted #fff;
}

.main a:hover {
border-bottom:0px dotted #fff;
}

h2 {
font-size:12px;
text-decoration: none;
text-transform: lowercase;
}

h3 {
font-size:12px;
text-decoration: overline;
text-transform: uppercase;
}

h4 {
font-size:12px;
text-decoration:underline;
line-height:14px;
}

h5 {
font-size:14px;
text-decoration:bold;
border-bottom:0px dotted #fff;
line-height:18px;
color: #930f1c;
text-transform: uppercase;
text-decoration: none;

}

h6 {
font-size:12px;
text-decoration:none;
line-height:18px;
}

img {
border:0px none;
}

here's the page

http://www.jadingheart.com/sample.html

but nothing's working ... the content that is supposed to go in "main" is loading in the web browser underneath the side bar ... i'm throughly confused ... can someone help me out please?!?