@charset "utf-8";

img, object, embed, video {
    max-width: 100%;
}

.ie6 img {
    width: 100%;
}

@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,400;0,500;&display=swap');

/* Mobile Layout: 480px and below. */

@media screen and (max-width: 670px) and (min-width: 0px) {
    .gridContainer {
        margin-left: auto;
        margin-right: auto;
        width: 87.9666%;
        padding-left: 1.5166%;
        padding-right: 1.5166%;
    }

    #d01 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d02 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d03 {
        clear: both;
        float: left;
        margin-left: 0;
        margin-top: -130px;
        width: 100%;
        display: block;
    }

    #d04 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d05 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d06 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d07 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d08 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d09 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #impress {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    /*.banner {
        background-image: url(../media/Header_AmrasWandel_770px.png);
        background-repeat: no-repeat;
        background-position: center;
    }

    .banner_back {
        background-image: url(../media/Header_AmrasWandel_770px.png);
        background-position: center;
        background-repeat: no-repeat;
        top: 0;
        left: 0;
        height: 137px;
        width: 100%;
        position: absolute;
        z-index: 1;
    }*/

    .d03 img {
        visibility: visible;
        margin-left: 30px;
        margin-bottom: 30px;
        margin-top: -7px;
        float: right;
        margin-right: 30px;
    }

    .char {
        display: none !important;
    }

    .d01 {
        margin-top: 20px;
        padding-top: 255px;
        margin-bottom: 40px;
    }

    html body div#bg_color.bg_color div#lvl2.lvl2 div.gridContainer.clearfix div#d03.d03 p {
        margin-top: 26px;
        margin-right: 30px;
    }
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media screen and (max-width: 1319px) and (min-width: 671px) {
    .gridContainer {
        width: 90.675%;
        padding-left: 1.1625%;
        padding-right: 1.1625%;
    }

    #d01 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d02 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d03 {
        clear: both;
        float: left;
        margin-left: 26px;
        margin-top: 187px;
        width: 100%;
        display: block;
    }

    #d04 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d05 {
        clear: both;
        float: left;
        margin-left: 25px;
        width: 100%;
        display: block;
    }

    #d06 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 48.7179%;
        display: block;
    }

    #d07 {
        clear: none;
        float: left;
        margin-left: 2.5641%;
        width: 48.7179%;
        display: block;
    }

    #d08 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 48.7179%;
        display: block;
    }

    #d09 {
        clear: none;
        float: left;
        margin-left: 2.5641%;
        width: 48.7179%;
        display: block;
    }

    #impress {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

   /* .banner {
        background-image: url(../media/Header_AmrasWandel_1320px.png);
        background-repeat: no-repeat;
        background-position: center;
    }

    .banner_back {
        background-image: url(../media/Header_AmrasWandel_1320px.png);
        background-position: center;
        background-repeat: no-repeat;
        top: 0;
        left: 0;
        padding-top: 97px;
        height: 137px;
        width: 100%;
        position: absolute;
        z-index: 1;
    }*/

    .d03 img {
        visibility: visible;
        margin-left: 30px;
        margin-bottom: 30px;
        margin-top: -7px;
        float: right;
        margin-right: 30px;
    }

    .char {
        display: none !important;
    }

    div#d03.d03 p {
        margin-top: 30px;
    }
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1320px) {
    .gridContainer {
        width: 88.5%;
        max-width: 1232px;
        padding-left: 0.75%;
        padding-right: 0.75%;
        margin: auto;
    }

    #d01 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d02 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d03 {
        clear: both;
        float: left;
        margin-left: 0;
        margin-top: 275px;
        width: 57.6271%;
        display: block;
    }

    #d04 {
        clear: none;
        float: left;
        margin-left: 1.6949%;
        width: 40.6779%;
        display: block;
    }

    #d05 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    #d06 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 23.7288%;
        display: block;
    }

    #d07 {
        clear: none;
        float: left;
        margin-left: 1.6949%;
        width: 23.7288%;
        display: block;
    }

    #d08 {
        clear: none;
        float: left;
        margin-left: 1.6949%;
        width: 23.7288%;
        display: block;
    }

    #d09 {
        clear: none;
        float: left;
        margin-left: 1.6949%;
        width: 23.7288%;
        display: block;
    }

    #impress {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
    }

    .d03 img {
        display: none;
        margin-right: -230px;
    }

    .d01 {
        margin-top: 100px;
    }

    /*.banner {
        margin-top: 0px;
        background-image: url(../media/Header_AmrasWandel.png);
        background-repeat: no-repeat;
        background-position: center;
    }
    .banner_back {
        background-image: url(../media/Header_AmrasWandel.png);
        background-position: center;
        background-repeat: no-repeat;
        top: 0;
        left: 0;
        height: 342px;
        width: 100%;
        position: absolute;
        z-index: 1;
    }*/

    .char {
        visibility: visible;
        height: 58%;
        width: 58%;
        right: 2%;
        top: 40px;
        position: absolute;
        z-index: 2;
    }
}


    /* _____________________________________________________________ */


    .lvl2 {
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: absolute;
        z-index: 3;
    }

    p {
        font-family: "Ubuntu", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 12pt;
        line-height: 135%;
        color: #C0BCA5FF;
    }

    .d03 {
        margin-bottom: 40px;
    }

    .d05 {
        text-align: center;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #content {
        display: none;
        margin-top: 2px;
    }

    button {
        width: 100%;
        padding-top: 20px;
        padding-bottom: 20px;
        background-color: rgba(0,0,0,.1);
        font-family: 'Ubuntu', sans-serif;
        line-height: 135%;
        display: inline;
        font-size: 14pt;
        color: #666;
    }

    .hover:hover {
        background-color: rgba(0,0,0,.4);
    }

    .change {
        margin-top: 2px;
        padding: 6px 16px;
        overflow: hidden;
        background-color: #1b2626;
    }

    h2 {
        display: inline;
        color: #9B7132;
    }


    .nav {
        margin-top: 30px;
    }

        .nav img {
            float: left;
            padding-left: 20px;
            padding-right: 10px;
        }

        .nav p {
            font-size: 14pt;
            font-weight: 500;
            color: #977747;
            padding-top: 35px;
        }