@media (max-width: 1600px) {
    #inhaltsbereich .rahmen, #footer .rahmen {
        width: 86%;
    }

    #karte .rahmen {
        width: 100%;
    }
}

@media (max-width: 1330px) {
    .owl-carousel .owl-nav button.owl-prev {
        left: -32px;
    }
    
    .owl-carousel .owl-nav button.owl-next {
        right: -32px;
    }

    #footerinhalt .frame-type-menu_subpages ul {
        margin: 0 20px 0 0;
    }
}

@media (max-width: 1130px) {
    .frame-font-big li {
        font-size: 26px;
    }
}

@media (max-width: 1100px) {
    h1, h2 {
        font-size: 25px;
        padding-left: 125px;
    }
    
    h1::before, h2::before {
        height: 23px;
	    width: 114px;
    }

    h1:before, h2:before {
        top: 0;
    }
}

@media (max-width: 1030px) {
    .frame-an-partner li {
        padding: 20px !important;
        margin: 0 2% 0 0 !important;
        width: calc(23% - 40px);
    }
}

@media (max-width: 1020px) {
    .logo {
        display: none;
    }
    
    #hauptnavi ul li.act a, #hauptnavi ul li:hover a {
        background: url(navi-balken.jpg) left top no-repeat;
        background-size: cover;
    }

    #header.mobile .logo {
        display: block;
    }

    .mob_button {
        display: block;
    }

    #header {
        background-color: #FFF;
    }

    #header > .rahmen {
        display: block;
    }

    .navibereich, #hauptnavi ul, #hauptnavi ul li {        
        float: left;
        clear: both;
        width: 100%;
        margin: 0;
        padding: 0;
    }

    #hauptnavi ul {
        display: none;
        width: 100% !important;
        margin: 25px 0 0 0;
    }

    #hauptnavi ul li a {
        display: block;
        width: 96%;
        text-align: center;
        padding: 15px 2%;
        margin: 0 0 5px 0;
        background: rgba(39, 52, 123, 0.1);
        color: var(--farbe4);
        position: relative;
    }

    #hauptnavi ul li a, #hauptnavi ul li.act a, #hauptnavi ul li a:hover {
        border-bottom: 0 !important;
    }

    #hauptnavi ul li.act a {
        border-bottom: 0;
        box-shadow: none;
    }

    .inhaltsheader {
        max-height: 400px;
        overflow: hidden;
    }

    .owl-carousel {
        text-align: center;
    }

    .owl-stage-outer {
        text-align: left;
    }

    .owl-carousel .owl-nav, .owl-carousel .owl-dots {
        position: static;
        margin: 0;
        padding: 0;
        display: inline-block;
        float: none;
        width: auto;
    }

    .owl-carousel .owl-dots {
        border-left: 1px solid rgba(0,0,0,0.3);
        padding-left: 6px;
        margin: 20px 0 0 5px;
    } 

    .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
        position: static;
        margin: 0 4px;
        padding: 0;
        display: inline-block;
        float: none;
        background: url(owl-resp-left.png) left top no-repeat;
        width: 12px;
        height: 20px;
    }

    .owl-carousel .owl-nav button.owl-next {
        background: url(owl-resp-right.png) left top no-repeat;
    }

    .owl-carousel .owl-dots .owl-dot {
        top: -3px;
        position: relative;
    }

    #footerinhalt .tx_cn-columns .row > div {
        width: auto;
        max-width: 45%;
    }

    #footerinhalt .tx_cn-columns .row > div:first-child {
        margin-right: 10%;
    }

    #footerinhalt .tx_cn-columns .row > div:last-child {
        float: left;
        clear: both;
        width: 100%;
        max-width: 100%;
        margin-top: 10px;
        padding-top: 20px;
        border-top: 1px solid rgba(0,0,0,0.1);
    }

    #footerinhalt .tx_cn-columns .row > div:last-child > div {
        margin-left: 0 !important;
        width: 100% !important;
    }
    
    #footerinhalt .frame-type-menu_subpages ul {
        float: left;
        width: 100%;
        margin: 0;
    }
    
    #footerinhalt .frame-type-menu_subpages ul li {
        text-align: left;
        margin: 0 10px 5px 0;
        max-width: 180px;
        display: inline-block;
        clear: none;
    }

    #footerinhalt .frame-type-menu_subpages ul li a {
        display: block;
        padding: 15px 5%;
        width: 90%;
        background: rgba(0,0,0,0.1);
    }
}

@media (max-width: 990px) {
    .frame-an-partner li {
        margin: 0 2% 20px 0 !important;
        width: calc(31% - 40px);
    }
}

@media (max-width: 900px) {
    .frame-chronik-bilder-trapez .ce-gallery, .frame-chronik-bilder-trapez .ce-bodytext {
        width: 100%;
        float: left;
        clear: both;
        margin: 0 0 0 0 !important;
    }

    .frame-chronik-bilder-trapez .ce-gallery .ce-row .ce-column {
        margin-bottom: 20px;
    }

    .frame-chronik-bilder-trapez .ce-gallery .ce-row .ce-column:first-child {
        clip-path: polygon(0% 0%, 100% 0%, calc(100% - 80px) 100%, 0% 100%);
    }
}

@media (max-width: 850px) {
    .inhalt .tx_cn-columns .row > div {
        width: 100% !important;
    }

    .inhalt .tx_cn-columns .row > div > div {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .frame-zertifikate {
        margin-top: 40px;
    }

    .frame-zertifikate .ce-gallery {
        text-align: center;
    }

    .frame-zertifikate .ce-row {
        display: inline-block;
        margin: 0 10px 10px 10px;
        float: none;
    }
}

@media (max-width: 730px) {
    .frame-an-partner li {
        margin: 0 2% 10px 0 !important;
        width: calc(48% - 40px);
    }
}

@media (max-width: 720px) {
    #inhaltsbereich .rahmen, #footer .rahmen {
        width: 82%;
    }

    .news .article {
        margin-bottom: 40px;
    }

    .news .article .news-img-wrap {
        float: left;
        clear: both;
        width: 100%;
        margin: 3px 0 5px;
    }

    #inhaltsbereich .news .article .news-img-wrap img {
        max-width: 100%;
    }

    #karte .rahmen {
        width: 100%;
    }

    #footerinhalt .frame-type-menu_subpages ul li {
        max-width: 100%;
    }
    
    #footerinhalt .tx_cn-columns .row > div {
        width: 100%;
        max-width: 100%;
    }

    #footerinhalt .tx_cn-columns .row > div:first-child {
        margin-right: 0;
    }
    
    #footerinhalt .tx_cn-columns .row > div > div {
        margin-left: 0 !important;
        width: 100% !important;
    }
    
    .mapsoverlay {
        padding: 0 5%;
    }

    .mapsoverlay button {
        display: inline-block;
        margin: 10px auto 5px;
        width: 100%;
        max-width: 300px;
    }
}

@media (max-width: 630px) {
    #start .inhaltsheader .rahmen .ce-bodytext {
        position: static;
        font-size: 16px;
        background: url(navi-balken.jpg) center center no-repeat;
        background-size: cover;
        width: 90%;
        padding: 10px 5%;
        margin: 0 0 0 0;
        max-width: none;
        color: #FFF;
        text-shadow: 1px 1px 1px black, 1px -1px 1px black, -1px 1px 1px black, -1px -1px 1px black;
        text-align: center;
    }

    #hauptnavi ul li.act a, #hauptnavi ul li:hover a {
        background: url(navi-balken.jpg) left top no-repeat;
        background-size: 100% 100%;
    }
    
    #inhaltsbereich.onepageinhalt > .bereiche:first-child .inhaltsheader::before {
        display: none;
    }

    .frame-chronik-bilder-trapez .ce-gallery .ce-row .ce-column {
        clip-path: none !important;
        float: left;
        clear: both;
    }
}

@media (max-width: 550px) {
    h1, h2 {
        font-size: 25px;
        padding-left: 90px;
    }
    
    h3 {
        font-size: 20px;
    }

    h1::before, h2::before {
        height: 23px;
	    width: 80px;
        background-size: 100% 100%;
    }
    
    .bereiche .inhalt > div:first-child {
        padding-top: 50px !important;
    }

    .bereiche .inhalt > div:last-child {
        padding-bottom: 50px !important;
    }

    .bereiche .inhalt > div {
        padding: 50px 0 0 0;
    }

    .frame-hintergrundfarbe1 {
        margin-top: 50px;
        padding: 50px 0 !important;
    }

    .frame-hintergrundfarbe1 + .frame-hintergrundfarbe1 {
        padding: 0 0 50px 0 !important;
    }
}

@media (max-width: 500px) {
    h1, h2 {
        padding-left: 0;
        z-index: 1;
    }

    h3 {
        font-size: 16px;
    }

    h1:before, h2:before {
        opacity: 0.4;
        z-index: -1;
    }

    .frame-an-partner li {
        margin: 0 0 10px 0 !important;
        width: calc(100% - 40px);
    }
}

@media (max-width: 430px) {
    .frame-font-big li, h1, h2 {
        font-size: 20px;
    }

    h1::before, h2::before {
        height: 20px;
    }
}