I was having issues with my mobile site at http://buildclass.org/ . (This topic has been posted about before related to unwanted back and forth scrolling on mobile). I was going to try to fix this problem by setting my background image to “cover” as had been suggested, however no matter how many times I press publish this change does not take effect.
I have noted, on occasion, updates on the live website are delayed, some times more than an hour or so. Not sure where this happens. Might even be some sort of corrupted file that refuses to accept changes. So the only thing that has worked for me is to walk away for some time, or rebuild the offending section. Both take up a lot of time.
So the first thing to change is the 1px margin you have on the body element.
The interplay between all of the negative and positive margins used to create the layout is most likely the source of the problems. because there are so many of those settings it makes it very difficult to find the overflow. I would suggest going through the design an removing all of the margins used.
I would avoid using fixed widths, negative margins and empty elements as much as possible going forward in the design.
My I suggest starting with some of the layout tutorial videos.