layering multiple images as background

Hi – hope someone can help. I am trying to layer a .png image file with gradient transparent edges at the side, over a solid colour background, so that users with superior screen resolution don’t get nasty white edges a the side of the site.

http://www.darkarps.com

I currently have the .png file laid down , but cannot for the life of me get a colour background to show up as well. I’ve read that CSS3 allows you to have multiple backgrounds by separating with a comma, but I haven’t been able to make this work.

I’m using the Piano Black template, here’s the code:

/* —— basic ——————- */

body { margin:0; padding:0;

background:url(img/da_bg_blur_trans.png);
background-position:center;
background-repeat:no-repeat;
background-size:1500px;,
background:url(img/bg_solid_green.png);

the bg_solid_green.png file is the solid colour I wanted as a background behind the main graphic, although I’m pretty sure I can just specify a colour using “background-color:black” right?

I’d also like the have my background graphic stay stationary while users scroll up and down.

Can anyone help?