Background Color, not displaying? Options

[cherry_starr]

Here is the profile that is having the problems on it. I want the background color to show up behind the images and fill the rest of the page, but all it is displaying is a white background? Is there something I am doing wrong?

Here is my current code:
About Me

CODE

<style>td td embed, td td object{position:absolute; left:0px; top:0px; width:1px; height:1px;}
td.text embed {width:260px; height:38px;}
td.text embed, td.text object {width:260px; height:38px;}</style>

<style>
div table.navigationBar table {
margin-bottom:464px;}
div table.navigationBar {
background-image: url(http://i36.photobucket.com/albums/e5/smayzes/topcopy-1.jpg) !important;
background-repeat: no-repeat !important;
background-position:  bottom center  !important;
width:800px !important}
div table.navigationBar td {
background-color:transparent !important}
div table.navigationBar table td {
background-color:636363 !important}
</style>

<style>
body {
background-color:636363;
background-image: url('http://i36.photobucket.com/albums/e5/smayzes/bg3copy.jpg');
background-attachment:scroll;
background-repeat:repeat;
background-position:center;
}

font, body, table, td, div, h1, h2, br, a, p {font-family:arial; font-size:11; color:a3a3a3; background-color:white; text-decoration:none;}

.orangetext15 {font-family:; font-size:arial; color:dfa213; text-decoration:none; font-weight:normal; font-size:12;}

a:link, a:active, a.man:link, a.text:link, a.redlink:link, a.redlink:active, a.navbar:link, a.navbar:active {font-family:times new roman; font-size:14; color:01c9c7; background-color:transparent;text-transform:lowercase; text-decoration:none; font-weight:none; letter-spacing:-1px;}

a:visited, a.man:visited, a.text:visited, a.redlink:visited, a.navbar:visited {font-family:times new roman; font-size:14; color:01c9c7; background-color:transparent;text-transform:lowercase; text-decoration:none; font-weight:none; letter-spacing:-1px;}

a:hover, a.man:hover, a.text:hover, a.redlink:hover, a.navbar:hover {font-family:times new roman; font-size:14; color:a30166; background-color:transparent;text-transform:lowercase; text-decoration:none; font-weight:none; letter-spacing:-1px;}
</style>

<style>
table, tr, td {background-color: transparent; border: 0px; padding:0;}
table table {border: 0px;}
table table table table{border: 0px;}

table table table {border: 0px solid; width:340;}

</style>

Heroes

CODE

</td></tr></table>
</td></tr></table><br>
<table><tr><td>
<div class="off">
<table><tr><td><table><tr><td>

[cherry_starr]

I tried your suggestion but I am still getting white bands on the outside of the page instead of the background color. Also it makes all the text overrides that come after not work.