Looking for a teleport huh?
OK. Strap yourself in.
Your background images are displayed in different ways. for the header and footer they are images embedded in the HTML, for the main body of your site it's a background image.
Since your site width is 850px and your image is only 848px you have scope for small differences. Your header and footer images are centred within the 850, the background image starts to the left, so step 1, find this
#mainWrapper {
background: url(../images/wrapper_bg.jpg);
text-align: left;
width: 850px;
vertical-align: top;
/border: 1px solid #9a9a9a;/
}and change it to this> #mainWrapper {
background: url(../images/wrapper_bg.jpg) top center;
text-align: left;
width: 850px;
vertical-align: top;
/border: 1px solid #9a9a9a;/
}This will almost solve the problem, except that your footer image will be a pixel thin either side. The easiest way to solve this would be to use CSS to add left and right borders to the image that match the brown on its outside edges.
Kuroi Web Design and Development | Twitter
(Questions answered in the forum only - so that any forum member can benefit - not by personal message)