display in middle of screen

I appear to have spead my page out across the screen, how do I get it back to the center, so there are spaces either side of the sideboxes as per the default

In your stylesheet,
#mainWrapper { width: 100%;}
will make the page fill the window. If you want it smaller, make it width: 760px; or width: 90%; or whatever you want.

I tried changing the width of my template by doing what was noted... changing the 100% to 750px. However when i do this... it changes the color and the width of my whole zen cart.... why does it effect the color also when i am only updating the width.

Changing the width of #mainWrapper will not affect the colors of your site.

It will, however, reveal the background color of the page body at the sides, if #mainWrapper has a background color that is different from the body.

Thanks, I have quite a wide logo, is it possible to have the logo shrink with the size of the wrapper.
At the moment it sticks out to the left.

No, single images are the size they are. There are ways to use multiple overlapping pieces or background colors to make the logo look like it is seamlessly stretching.
Google "sliding door method" for a good article (about buttons, but relates to anything).