Cable Forum - Could someone help out with a piece of CSS please?

Hey everyone, I am making up a website for one of my mates.

I got the some bits of the site going, mainly trying to do it by CSS.

ok I got a banner for a heading, and some glass looking buttons going down the left side for links in the site.

I was wanting to put a main part to the right of these links.

I have given an image, and its the white text that I am trying to fix, I got the text moved to the side but not up.

I not used a table, but will play with one soon, but was hoping to get it done without tables.

any help?
here is one HTML and CSS code;

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

 <HEAD>

 <LINK REL="Stylesheet" type="text/css" HREF="rick2.css">

  <TITLE> Site Map </TITLE>

  <META NAME="Generator" CONTENT="EditPlus">

  <META NAME="Author" CONTENT="">

  <META NAME="Keywords" CONTENT="">

  <META NAME="Description" CONTENT="">

 </HEAD>



 <BODY>

<span class="banner">Ricky Waddell</span><span class="bodyheading">Site Map</span>

    <a class="nav" href="home.html">Home</a>

    <a class="nav" href="career.html">Playing Career</a>

    <a class="nav" href="videos.html">Videos</a>

    <a class="nav" href="gallery.html">Gallery</a>

    <a class="nav" href="about.html">About Ricky</a>

    <a class="nav" href="links.html">Links</a>

    <a class="nav" href="site.html">Site Map</a>



    <div class="main">testing</div>

 </BODY>

</HTML>

Code:

body    

{

    background-color:#000000;

}

.banner 

{

    display:block; 

    width:800px; 

    height:45px; 

    background-image:url(images/banner.JPG); 

    margin-top:0px; 

    text-align:center; 

    font-weight:bold; 

    text-decoration:none; 

    font-family:palatino linotype, times new roman, verdana, arial, sans-serif; 

    font-size:30px; 

    color:#fdfe98; 

    line-height:40px; 

    overflow:hidden;

}

a.nav, a.nav:link, a.nav:visited 

{

    display:block; 

    width:150px;

    height:25px; 

    background-image:url(images/button0.JPG); 

    border:1px solid #000; 

    margin-top:2px; 

    text-align:center; 

    text-decoration:none; 

    font-family:verdana, arial, sans-serif; 

    font-size:12px; 

    color:#fdfe98; 

    line-height:25px; 

    overflow:hidden;

}

a.nav:hover 

{

    color:#fdfe98; 

    background-image:url(images/button1.JPG); 

    font-weight:bold;

}

a.nav:active 

{

    color:#fdfe98; 

    background:#000000;

}



.bodyheading 

{

    position:absolute; 

    margin-left:350px; 

    font-weight:bold; 

    font-size:16pt; 

    color:#fdfe98;

}

.main

{

    display:inline;

    margin-left:180px;

    color:#ffffff;

    font-family:arial, palatino linotype, times new roman, verdana;

    font-size:11pt;

}