Applying Multiple Overlapping Background Images

I'm working on building a design that I'm not 100% sure how to carry out. Here's a really rough example of it. http://jsfiddle.net/cgRyH/1/ Essentially, I need a simple background texture to repeat horizontally into infinity. On top of that, beneath my content, I need to add some accents to the background that are a bit wider than the `divs` that hold my content. In my example I've accomplished this with a `div` that's only purpose is to add this additional background image...but this seems clunky. Is there a better way of accomplishing this? Edit: My white footer needs to appear to stretch to the bottom and both sides of the screen.