I do not have your images, But the place holders seem to overlap. I see what you have done. those statements are for the Body not the Css file. I do not use a Css file in 95% of my pages.
Say I want to fit an image into a space I get the coordinates to give me height width top and left and use the object setting (Widget on its way) provided the aspect ratio does not look off then the image fits in hand in glove.

I create pages like I paint. To me a page is similar so for a complicated one I get my A4 sketch pad and sketch the basic shapes and what is going in and where. Then I put the elements on and adjust background. In painting it is normally dark to light top to bottom (Acrylics and Oils, had to put that in otherwise the watercolourists would comment) but with a web page I start with background/image and work from back to front in layers. A table could sit over two images or underlined with text. Depends on the effect desired. Then comes the fun part you can have the page elements shifting whilst you watch. Just use the refresh and use php to give different settings. Time consuming though. I had one example once of a page where a hole appeared and the whole subject on the page just went down the gurgler.

The possibilities are endless. If I get time I might put up a site showing the unusual effects and how it is done. My Moral or one there of: "If you stretch your limits the limits becomes normal"

Have fun with my widget. If a way is hard try an easier way