2 Body Backgrounds

[thesequel]

Okay I'm trying to code this: http://img15.imageshack.us/img15/5804/templategv.png
Here is the site so you can see what I have so far: http://thesequel.exofire.net
Here are my files for the background: http://localhost/test/images/backgroundgrad.png AND http://localhost/test/images/background.png

As you can see the design has a gradient for the background. I have taken the gradient and made a 20x768 (backgroundgrad) images to tile on the website. Then I also made another 20x20 (background) image to put under the gradient (backgroundgrad is repeat-x so I wanted background to come up 768px down the page).

Here is the code for my background

/*CSS*/
html {
    background: url(images/background.png);
}

body {
    width: 750px;
    margin: 0 auto;
    border: 5px solid #000;
    background: #9BA3AA url(images/backgroundgrad.png) repeat-x;
    font: 1em/1.3em Georgia, Arial, Verdana;
}

I noticed that the gradient is not there and the background's color has changed. Does anyone know of a way to get the background working correctly? And, does anybody know why it would come up like this?

Sorry if parts of my post don't make sense. It's pretty late and I just can't figure this out.

I've tried:

• creating an absolute positioned div, however it was centered along with everything else so the left side of the page was blank
• using background-position to get background where I wanted (tried in html and body)

Edit:
Nevermind guys. The design got changed. I dunno how to report threads, so I'll just hope a mod comes by and locks this.