/* Hintergrundbild für den Header / body { background-image: url(„http://www.deine-website.de/bg-big-header-holder.png“); background-repeat: repeat-x; background-size: cover; / skaliert das Bild, um den Bereich zu füllen */
background-position: top center;
}

/* Logo im Login-Bereich / .login h1 a { display: block; width: 274px; height: 63px; background-size: contain; / passt Logo proportional an */
background-repeat: no-repeat;
}

/* Login-Formular */

login, form {

max-width: 420px;
width: 90%; /* flexibel auf kleinen Bildschirmen */
margin: 20px auto; /* zentriert */
padding: 20px;
font-family: Verdana, sans-serif;
border: 1px solid #c3c3c3;
box-sizing: border-box; /* Padding + Border in Breite einberechnet */
background-color: #fff; /* optional: Formulare hervorheben */
border-radius: 6px; /* sanfte Ecken */
box-shadow: 0 2px 5px rgba(0,0,0,0.1);

}

/* Responsive Anpassungen */
@media (max-width: 500px) {
.login h1 a {
width: 200px;
height: 46px;
}
#login, form {
width: 95%;
padding: 15px;
}
}