@charset "utf-8";
/* CSS Document */

div#inhalt {
position: relative;   /*  Diese Angabe ist extrem wichtig, da ansonsten der Inhalt nicht angezeigt wird!  */
}

div.hintergrundbild {
width: 100%;        /*  Die Regeln, welche für die Skalierung sorgen  */
height: auto;
position: fixed;   /*  Die Positionierung  */
top: 0;
left: 0;
}

@media screen and (min-width: 481px) and (max-width: 9024px){
div.hintergrundbild {
background:url(http://www.mentalkraft.eu/images/bg/background.jpg) no-repeat ; 
min-height: 100%;    /*  Diese zwei Zeilen setzen die Regeln um den Hintergrund zu füllen  */
min-width: 1024px;
right: 50%;                /*  Ohne diese Angaben funktioniert es nicht  */
margin-right: -512px; }
}

/* Smartphones (portrait and landscape) ----------- */
@media (min-width: 320px) and (max-width: 480px) {
div.hintergrundbild {
background:url(http://www.mentalkraft.eu/images/bg/background.jpg) no-repeat ; 
background-position: left;
background-size: auto 100%;
min-height: 100%;    /*  Diese zwei Zeilen setzen die Regeln um den Hintergrund zu füllen  */
min-width: 320px;
left: 10%;                /*  Ohne diese Angaben funktioniert es nicht  */
margin-left: 0px; }
 }


/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}