Position absolute takes that box out of the flow of the document. This means it will always be on top of whatever else is IN the flow. The flow starts on top and works down. So simply take the position absolute off that div and start your next div- it will automatically go underneath it.
example--
.top {
width: 100%;
}
.bottom {
width: 100%;
}
and the html the same way you showed it.
It's also best cross browser to learn to use float layouts. For info and layouts see
Kickass WebGeek CSS Resources.