Two background images, one overriding the other and i dont want it to, i want one to

This might be a silly question, but I have been unable to solve it.

essentially working within the framework of a bigcommerce template. What I need to do is have a bgimage flow 100% horizontal behind the header area but I would like a different background image to be tiled behind the content area under the header. ( i could do this as one large 2000px wide by 2000px tall image, but the file size is coming out pretty large.)

I have the bg behind the header via the body tag.
Just inside the body tag is a div tag (that was coded to 980px, but i moved that another inner div to keep the content at 980 and centered, so now my first div tag in the template is 100% across. But since the “header” of the template is also contained within this div tag, when i add a bg image to it, it overides the body bg tag and what i really want is for the bg image to start 123px down so that the body bg shines through before the div bg starts. So matter what i have tried to make that second, inner background start repeating under the black of the header, it’s a no go.

Can someone take a peek at this and see if you can come up with answer, it’s driving me nuts! http://www.redapplelipstick.com

This is probably quite simple, but I can’t work out quite what yo are describing. Could you name the divs involved? I really can’t see which divs you are talking about there.

plz use z-index:9999; in css