How to align/lock background image and text together when zooming in/out
 

Hi there,

I'm a complete beginner with CSS and am using squarespace.com to create a simple website. I have had to wander into the custom CSS section in order to add a background image.

Here is the page I'm referring to in the question below:
http://www.drawshow.co.uk/

The problem I'm having is that my text and background image are not aligned when I check the webpage on screens of different resolutions or when I zoom in or out - the text stays central but the background appears to be stuck to the left.

How can I keep my text and background in the same position however/wherever they are viewed, so that the text is effectively locked to the background and the text appears to be 'written' on top of the background page image?
I have tried shifting the position of the background with little success.

This is the CSS I have entered for the text and background:

body{background-image:url(http://danielmcallister.com/images/K...ePaper-5.png);
background-repeat:no-repeat;
background-position:10px 10px;}

body{margin-right:150px;}

body{margin-left:150px;}

I'd really appreciate any help - I'm sure the answer is simple!
Thanks in advance