I would not have that footer as an image. I would have it as a div with a grey BG and a yellow border-top ... what is the point in it being an image? ... plus it means that the page is not flexible because it is in the same image as the top BG- if you want to add more content or if users insist on making the text bigger then your page will get all screwed up.

So take that bottom out of the Main background image and add this div to the page:

Code CSS:
#footer {
  height: 86px;
  background: #F0F0F0;
  width: 100%;
  border-top: 2px solid #fbc53f;
  text-align: center;

(Add it outside of all other Divs.)
You can fiddle around with the padding and perhaps line-height to get the text in the proper place.

<div id="footer">FOOTER TEXT</div>