/* header u. footer haben ab 1 Joh 1 diese Farben */

header,
footer {
    background-color: #2473a5;
    border-style: solid;
    border-color: #ddbd82;
}

/* h2 (ehem. h3) hat ab 1 Joh 1 diese Farbe */

h2.arcive {
    color: #034976;
}

/* article hat ab 1 Joh 1 diese Farbe */

article {
    border-style: solid;
    border-color: #2473a5;
}



/* body hat ab 1 Joh 1 diese Farbe */

body {
    background-color: #fff9e0
}


@media only screen and (max-width: 480px) and (orientation: portrait) {

    header,
    article,
    footer {
        border-radius: 0.3rem;
    }

    /* h1 in Offb 10 eigene font-size */
    header h1 {
        margin: 25px 0.2rem 0.5rem;
        font-size: 2.7rem;
    }

    header hr {
        margin: 1.8rem auto 0;
    }

    /*
            img {
            width: 40%;
            }
*/
    #zurFront {
        font-size: 1.5rem;
        width: 70%;
        margin: 1.2rem auto 0.1rem;
    }
}

@media screen and (min-width: 481px),
screen and (orientation: landscape) {

    header,
    article,
    footer {
        border-radius: 6px;
    }

    /* h1 in offb 10 eigene font-size */
    header h1 {
        margin: 33px 12px 8px;
        font-size: 43px;
    }

    header hr {
        margin: 27px auto 0;
    }

    /*
            img {
                width: 32%
            }
*/
    #zurFront {
        width: 70%;
        margin: auto;
    }
}