#box1 {position: relative; width:650px; height: 250px; top:20px; border: 0px white solid;}
#box2 {background-color: white; position: absolute; width: 600px; height: 400px; top:100px; left: 800px; border: 0px black solid;}
#box3 {position: absolute; width:180px; height: 180px; top:320px; left: 50px; border: 0px black solid;}
#box4 {background-color: white; position: absolute; width:630px; height: 100px; top:500px; left: 50px; border: 0px black solid;}
html {
    background: url(Hintergrund%20hopa.JPG) no-repeat center center fixed;
    -webkit-background-size:  cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}
<!-- Hier (oben)  wird das ganzseitige Hintergrundbild festgelegt, zusammen mit s.u. dem body-Befehl -->
class=rahmen {border-style: double; border-color: red; border-width: 10px; padding: 5px}
body {width: 1000px; margin: 0 auto;}
<!-- diese body-Einstellung scheint für den ganzseitigen Hindergrund wichtig zu sein -->