Q:

How to get my background photos to stay at the top?

When I view my homepage in the "portrait tablet" dimension, the background photos of my middle content are pushed down below the heading text. What CSS rules can I write so that the background photos stay up at the top when viewed in the portrait tablet mode?
To better illustrate the problem:
The problem: 
Intended layout: looks like this http://www.ogmda.com/test/screen2.jpg.
Live code for the site is here. Be sure to drag the browser corners to view it in "portrait-tablet" mode.

A:

The background-position property allows you to control where your image appears.  You've currently got this set to left, meaning the image is vertically centered.  Change it to top left to have the image at the top left.
Change
background-position: left;

to
background-position: top left;

