/*Media CSS ================================================== */
/*
/*mit dieser CSS werden Elemente auf mit definiertem  
/*Media-Screen attributiert.
/*
/*Author: Andreas Wasner
/*Stand : 22.12.2019                                      
/*
/* ============================================================ */

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    header {
        height: 60px;
    }
    footer {
        margin-left: 15px;
        margin-right: 15px;
        height: 50px;
        margin-top: 50px;
        border-top: 1px solid rgb(220,220,220);
    }
        footer p {
            font-size: 0.7em;
        }
        footer a {
            padding: 10px 5px 10px 5px;
        }
            footer a:hover {
                background-color: #e2e6e9;
            }

    /*Logo*/
    .logo {
        background-color: #FFD700;
        float: left;
        height: 21px;
        width: 15px;
        margin: 1.0em 0.6em 0 15px;
    }
    .logo-main-txt {
        font-size: 1.0em;
        padding: 1.35em 0 0 0;
    }
    .logo-sub-txt {
        display:none;
    }

    /*FA-BARs*/
    .fa-bars {
        color: rgb(80,80,80);
        font-size: 18px;
        background-color: rgb(252, 252, 252);
    }

        .fa-bars:hover {
            color: gold;
            font-size: 18px;
            background-color: rgb(252, 252, 252);
            cursor: pointer;
        }

    /*Intro-Kasten im owl-carousel*/
    .id_article {
        background-size:cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top:60px;
        padding-top:100px;
        height: 160px;
        position: relative;
        z-index: 1;
    }

        .id_article:before {
            background-color: rgb(0,0,0);
            content: "";
            height: 100%;
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: -1;
        }

        .id_article h3 {
            font-weight: 300;
            font-size: 1.6em;
        }

        .id_article h4 {
            font-weight: 200;
            font-size: 1.1em;
        }

    .id_titel-en {
        font-family: 'Lexend Mega', sans-serif;
        font-size: 0.4em;
        padding-bottom: 5px;
    }

    .id_titelstatement-left,
    .id_titelstatement-right,
    .id_titelstatement-center,
    .id_announcement-left {
        color: lightgray;
        margin-left: 15px;
        margin-right: 15px;
        padding-left: 5px;
        padding-right: 5px;
    }

    .id_titelstatement-left,
    .id_announcement-left {
        border-left: 3px solid gold;
        text-align: left;
    }

    .id_titelstatement-right {
        border-right: 3px solid gold;
        text-align: right;
    }

    .id_titelstatement-center {
        text-align: center;
    }

    .id_titelstatement-center-border {
        border-top: solid;
        border-color: gold;
        border-width: 3px;
        width: 120px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 8px;
    }

    .id_announcement-left {
        padding-bottom: 10px;
    }

        .id_announcement-left a {
            font-size: 0.75em;
            color: rgb(70,70,70);
            background-color: none;
            padding: 10px 10px 10px 10px;
            border: 1px solid rgb(70,70,70);
            border-radius: 5px;
            margin-bottom: 15px;
        }

            .id_announcement-left a:hover {
                background-color: rgb(80,80,80);
                Color: white;
                transition: 0.2s;
            }

        .id_announcement-left img {
            position: relative;
            top: 0;
            left: 0;
            width:30px !important;
            height:30px !important;
            padding-bottom: 15px;
            margin-left: 0;
            margin-right: 0
        }


    /*Produkt-Kasten im owl-carousel*/
    .id_product {
        background: rgb(223,223,223);
        background: linear-gradient(320deg, rgba(223,223,223,1) 0%, rgba(255,255,255,1) 100%);
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top:60px;
        padding-top: 50px;
        height: 210px;
        position: relative;
        z-index: 1;
    }

        .id_product h3 {
            font-weight: 300;
            font-size: 1.6em;
            color: rgb(70,70,70);
        }

        .id_product h4 {
            font-weight: 200;
            font-size: 1.1em;
            color: rgb(70,70,70);
            margin-bottom: 40px;
        }


    .id_productimg {
        display: none;
        margin-right:15px;
        margin-left:15px;
    }

        .id_productimg img {
        }

    #klindworth {
        position: absolute;
        left: 15px;
        bottom: 10px;
        font-size: 0.6em;
        font-weight: lighter;
        color: rgb(160,160,160);
    }

    /*Claim*/
    /*Statement unterhalb Owl-Carrousel*/
    .id_claim {
        column-count: 1;
        margin-top: 15px;
        margin-left: 15px;
        margin-right: 15px;
    }

        .id_claim h1 {
            font-size: 1.6em;
            text-align: center;
            padding: 10px 0 20px 0;
            width:auto;
        }

    .id_claim p {
        padding: 0 0 10px 0;
        font-size:0.75em;
    }

    .id_claim-left p {
        text-align: left;
        hyphens: none;
    }

    .id_claim-center p {
        text-align: center;
        hyphens: none;
    }

    .id_claim-dist {
        padding-bottom: 15px;
    }

    .id_claim ul {
        margin:0;
        padding-bottom: 30px;
        padding-left: 15px;
    }

    .id_claim li {
        font-size: 0.75em;
        line-height: 1.3;
        padding-bottom: 2px;
    }

    .id_confirmation {
        margin-top: 90px;
        border-radius: 33px;
        width: 33px;
        height:33px;
        margin-left: auto;
        margin-right: auto;
        padding: 10px;
        background-color: none;
        border: 1px solid #808080;
        color: gold;
    }

        .id_confirmation i {
            font-size: 2em;
        }

        .id_confirmation p {
            padding: 10px;
            text-align: center;
        }

    .id_produktcode {
        margin-top: 90px;
    }

        .id_produktcode h1 {
            font-size: 1.6em;
            text-align: center;
        }

        .id_produktcode h2 {
            padding: 6px 0 12px 0;
            font-size: 1em;
            text-align: center;
        }

        .id_produktcode h3 {
            padding: 6px 0 12px 0;
            font-size: 1em;
            font-stretch: normal;
            font-weight: normal;
            color: #404040
        }

    .id_produktcode-h3l h3,
    .id_produktcode-h3r h3 {
        text-align: center;
    }

    .id_imgleft img,
    .id_imgright img {
        float: none;
        margin-left: 5%;
        margin-right: 5%;
        margin-bottom: 10px;
        width:90%;
        height:auto;
    }

    .id_offer {
        font-size: 0.75em;
        color: rgb(70,70,70);
        background-color: rgb(250,250,250);
        text-align: center;
        padding: 15px 10px 15px 10px;
        border: 1px solid rgb(70,70,70);
        border-radius: 5px;
        margin: 15px auto 15px auto;
    }

    .id_numbersequence {
        font-size: 10px;
        color: white;
        background-color: red;
        padding: 6px 6px 6px 6px;
        width: 10px;
        height: 10px;
        border-radius: 30px;
        text-align: center;
        float: left;
        font-weight: bold;
        margin-right: 10px;
    }
    
/* Accordion aus w3school */
.accordionwrapper {
    width: auto;
    margin: 0 15px 0 15px;
    padding: 0 0 0 0 ;
    margin-top: 15px;
    border-bottom: 1px solid rgb(220,220,220);
}
    .accordionwrapper h1 {
        margin:0;
        padding: 0 0 15px 0;
        font-size:1.6em;
    }
    .accordion {
        font-weight: 300;
        font-size: 1.1em;
        width: 100%;
        background-color: white;
        outline: none;
        border: none;
        border-top: 1px solid rgb(220,220,220);
        color: #444;
        cursor: pointer;
        padding: 12px 5px 0 0;
        text-align: left;
        transition: 0.4s;
    }
        .active_acc, .accordion:hover {
            background-color: white;
        }
        .accordion botton {
            background-color: white;
            cursor: pointer;
            padding: 14px 16px;
            transition: 0.2s;
        }
        .accordion:after {
            content: '\002B';
            color: #777;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }
    .active_acc::after {
        content: "\2212";
    }
    .panel {
        padding: 8px 0 0 0;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }
        .panel ul {
            padding-bottom: 15px;
            padding-left:15px;
        }
        .panel li {
            font-size: 0.75em;
            line-height:1.3;
            padding-bottom: 2px;
        }
        .panel p {
            padding-bottom: 2px;
            text-align: left;
            font-size:0.75em;
        }
    .panelspacer {
        padding-top: 15px;
        padding-bottom: 15px
    }

    /* Produktkästchen auf den Übersichtsseiten */
    .productbox {
        margin: 10px 0 10px 0;
        float: left;
        width: auto;
        background-color: #fcfcfc;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px;
    }

        .productbox h2 {
            padding: 10px 50px 10px 10px;
            font-stretch: normal;
            font-size: 1.1em;
            font-weight: 500;
            color: rgb(80,80,80);
        }

        .productbox p {
            text-align: left;
            font-size: 0.75em;
            margin: 10px 10px 10px 10px;
            padding-bottom:10px;
            border-bottom: 1px solid rgb(200,200,200)
        }

        .productbox a {
            float: right;
            margin: 10px 10px 10px 0;
            padding: 8px 8px 8px;
            font-size: 0.75em;
            font-stretch: normal;
            background-color: whitesmoke;
            border: 1px solid rgb(200,200,200);
            border-radius: 2px 2px 2px 2px;
        }

            .productbox a:hover {
                background-color: rgb(80,80,80);
                border: 1px solid rgb(80,80,80);
                color: #fff;
                transition: 0.3s;
            }

        .productbox img {
            margin: 10px 10px 0 10px;
            height: 26px;
        }

    .productboxtipp {
        font-size: 0.70em;
        margin: 10px 0 0 0;
        padding: 5px 5px 5px 8px;
        float: right;
        background-color: #EEDC82;
        border: 1px solid rgb(200,200,200);
        border-right: 0;
        border-radius: 5px 0px 0px 5px;
    }

    .productboxprice {
        margin: 0 0 0 10px;
        font-size:0.9em;
    }

        .productboxprice span {
            font-size: 0.75em;
        }

    .productboxpricesub {
        margin: 5px 0 0 10px;
        font-size: 0.75em;
        font-style: italic;
    }

    /* Bestellformular */
    .id_form_txt {
        font-size:0.75em;
    }

    .id_form_txt p {
        font-size:1em;
        padding: 8px 5px 0 5px;
    }

        .id_form_txt fieldset {
            font-size: 1em;
            border: 1px solid lightgray;
            margin: 15px 0 15px 0;
            padding:0 20px 15px 10px;
        }

        .id_form_txt input {
            font-size: 1em;
            width:100%;
            border-radius:2px;
            
        }

        .id_form_txt label {
            font-size: 1em;
            width:100%;
            float: left;
            background-color: whitesmoke;
            margin: 9px 0 0 0;
            padding: 8px 0 6px 6px;
        }

    .id_form_agb {
        width: 100%;
        background-color:none;
    }

        .id_form_agb a {
            color:#000;
            text-decoration:underline
        }

        .id_form_agb input {
            margin: 0 5px 0 8px;
            width: 15px;
            float:left;
            border-radius:2px;
        }

        .id_form_agb label {
            background-color:inherit;
            padding: 0 0 0 0;
            margin: 6px 5px 5px 5px;
            line-height:1.5;
            max-width:80%;
        }

    .id_form_txt button {
        float: right;
        font-size: 1em;
        margin: 25px 8px 15px 0;
        padding:8px;
        background-color: whitesmoke;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px 2px 2px 2px;
    }

        .id_form_txt button:hover {
            background-color: rgb(80,80,80);
            border: 1px solid rgb(80,80,80);
            color: #fff;
            transition: 0.3s;
        }

    .id_licensecounter {
        margin: 5px 0 0 0;
        padding:5px;
        float:left;
    }

        .id_licensecounter input {
            float:left;
            width: 30px;
            height:28px;
            text-align:center;
            padding: 0;
            margin: 0 5px 0 5px;
            border-radius:2px;
        }

        .id_licensecounter button {
            float:left;
            width: 30px;
            height:30px;
            text-align: center;
            padding: 0;
            margin:0;
        }

    .id_anrede {
        margin: 0px 0 0 0;
        background-color:none;
    }

        .id_anrede label {
            background-color:inherit;
            margin: 8px 5px 0 0;
            float:left;
            width: auto;
        }

        .id_anrede input {
            float: left;
            width: 15px;
            text-align: center;
            padding: 0;
            margin: 8px 5px 0 0;
            border-radius: 2px;
        }

    /*Unternehmen, Leistungen*/
    #unternehmen h1, #leistungen h1 {
        font-family: 'nunito sans', sans-serif;
        font-size: 1.6em;
        margin: 20px 15px 0 15px;
        padding: 0 0 15px 0;
    }

    #leistungen .owl-theme,
    #unternehmen .owl-theme {
        margin-left: 0;
        margin-right: 0;
        width: auto;
    }

    #leistungen .owl-nav,
    #unternehmen .owl-nav {
        position: absolute;
        top: 417px;
        right: 0;
    }

    #leistungen .owl-prev,
    #leistungen .owl-next,
    #unternehmen .owl-prev,
    #unternehmen .owl-next {
        background-color: rgb(248,249,250);
        border-radius: 5%;
        border-color: darkgray;
        border: 1px solid rgb(210,210,210);
        color: rgb(143,157,171);
        font-size: 20px;
        font-weight: bold;
        transition: 0.3s;
        margin-right: 20px;
        height: 47px;
    }

        #leistungen .owl-prev:hover,
        #leistungen .owl-next:hover,
        #unternehmen .owl-prev:hover,
        #unternehmen .owl-next:hover {
            opacity: 1;
            background-color: lightslategray;
            color: white;
        }


    /*------ Topic ------*/
    .topicwrapper {
        margin: 15px 0 0 0;
    }

    .topicpanel {
        background-color: rgb(248,249,250);
    }

        .topicpanel img {
            width: auto;
            height: 300px;
            object-fit:cover;
            filter: grayscale(30%);
        }

    .topicframe {
        border: 0 solid rgb(220,220,220);
        border-top: none;
        padding: 35px 15px 10px 15px;
    }

        .topicframe:hover {
            cursor: grab;
        }

    .topicframetxt {
        height: 260px;
    }

        .topicframetxt ul {
            font-family: 'nunito sans', sans-serif;
            font-weight: 500;
            font-size: 0.75em;
            padding: 0 0 0 30px;
        }

        .topicframetxt li {
            line-height: 1.4;
        }

    .topicframe h6 {
        font-family: 'nunito sans', sans-serif;
        font-weight: 500;
        font-size: 1em;
        margin: 20px 10px 10px 0;
        padding: 3px 0 3px 10px;
        text-align: left;
        line-height: 1.25;
        color: #404040;
        border-left: 3px solid gold;
    }

    .topicstatement {
        font-family: 'Source Sans Pro', sans-serif;
        text-align: center;
        border: 1px solid rgb(220,220,220);
        border-radius: 10px;
        padding: 15px 25px 15px 25px;
    }

    .topicframe p {
        font-family: 'nunito sans', sans-serif;
        font-weight:500;
        text-align: left;
        hyphens: auto;
        font-size: 0.75em;
        padding: 15px 15px 0 14px;
    }

    .topic {
        font-family: 'nunito sans', sans-serif;
        font-weight: 300;
        font-size: 0.75em;
        padding: 14px 0 16px 0;
        background-color: lightslategrey;
        color: white;
        width: 200px;
        text-align: center;
        border: none;
    }

    .topicpagination {
        position: relative;
        bottom: 375px;
        float:right;
        margin-right: 15px;
        padding: 10px;
        font-size: 1.8em;
        color: #303030;
        border-bottom: 1px solid rgb(210,210,210);
    }

        .topicpagination span {
            font-size: 0.4em;
            color: gray
        }

    .topic-sidenav {
        display:none;
    }

    /*KOSTRA-DWD*/
    .id_kostra {
        margin: 0 15px 0 15px;
        padding: 100px 0 0 0;
    }

        .id_kostra h1 {
            margin: 0 0 0 0;
            padding: 0 0 0 0;
            font-size: 1.6em;
        }

        .id_kostra h2 {
            padding: 15px 0 0 0;
            font-stretch: normal;
            font-size: 1.1em;
        }

    .cr {
        background-color: none;
        padding: 2px 2px 2px 0;
        height: 26px;
        margin: 1px;
        font-size: 0.75em;
    }

    .c0 {
        background-color: lightgray;
        padding: 4px;
        width: 10%;
        float: left;
        text-align: right;
    }

    .cx {
        background-color: whitesmoke;
        padding: 4px;
        width: 8%;
        float: left;
        text-align: right;
    }

    #googleMap {
        margin: 10px 15px 10px 15px;
        height: 400px;
    }

    /*Tableblock*/
    .tableblock {
        font-family: 'Segoe UI';
        height: auto;
        margin: 0 15px 0 15px;
        padding: 0;
    }

        .tableblock h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

        .tableblock table {
            margin-top: 15px;
            font-size: 12px;
            color: #2A2A2A;
            border: 1px solid #BDBDBD;
            border-collapse: collapse;
            text-align: left
        }

        .tableblock th {
            background-color: #EDEDED;
        }

        .tableblock th, td, tr {
            border: 1px solid #BDBDBD;
            padding: 8px;
        }

    /*Newsblock*/
    .newsblock {
        display: flex;
        align-items: flex-start;
        font-family: 'Segoe UI';
        font-size: 16px;
        height: auto;
        margin: 0;
        padding: 10px;
    }

        .newsblock a {
            color: steelblue;
            font-weight: 400;
        }

            .newsblock a:hover {
                text-decoration: underline;
            }

    .newstext {
        flex: 1;
    }

        .newstext h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

    .newsblock-left {
        background-color: none;
    }

        .newsblock-left img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: left;
        }

    .newsblock-right {
        background-color: whitesmoke;
    }

        .newsblock-right img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: right;
        }

    .newsblock-height {
        height: auto;
    }

    .newsblock table {
        margin-top: 15px;
        font-size: 12px;
        color: #2A2A2A;
        border: 1px solid #BDBDBD;
        border-collapse: collapse;
        text-align: left
    }

    .newsblock th {
        background-color: #EDEDED;
    }

    .newsblock th, td, tr {
        border: 1px solid #BDBDBD;
        padding: 8px;
    }





    /*Impressum*/
    #impressum {
        margin: 50px 15px 0 15px;
        padding: 0 0 0 0;
    }
        #impressum h3 {
            font-weight: normal;
            padding: 2em 0 1.2em 0;
        }
        #impressum p {
            text-align:left;
            font-size: 0.75em;
            padding: 0 0 0 0;
        }

    /*AGB, Datenschutz*/
    #agb,
    #datenschutz {
        margin: 50px 15px 0 15px;
        color: rgb(80,80,80);
    }

        #agb h3,
        #datenschutz h3 {
            font-weight: normal;
            padding: 2em 0 0.8em 0;
        }

        #agb h4,
        #datenschutz h4 {
            font-weight: normal;
            padding: 0.5em 0 0.7em 0;
        }

        #agb p {
            font-size: 0.75em;
            padding: 0 0 0.4em 0;
            text-align: left;
        }

        #datenschutz p {
            font-size: 0.75em;
            padding: 0 0 0 0px;
            text-align: left;
        }

        #datenschutz ol {
            font-size: 0.75em;
            padding: 0 30px 0 30px;
            list-style-type: upper-roman;
        }

            #datenschutz ol p {
                font-size: 1.0em;
            }

            #datenschutz ol li {
                padding: 0 0 10px 0;
            }

        #datenschutz ul {
            padding-left:15px;
            padding-top: 5px;
            padding-bottom: 10px;
        }

            #datenschutz ul li {
                font-size: 0.75em;
                line-height: 1.75;
                list-style: disc;
            }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    header {
        height: 60px;
    }

    footer {
        margin-left: 15px;
        margin-right: 15px;
        height: 50px;
        margin-top: 50px;
        border-top: 1px solid rgb(220,220,220);
    }

        footer p {
            font-size: 0.7em;
        }

        footer a {
            padding: 10px 10px 10px 10px;
        }

            footer a:hover {
                background-color: #e2e6e9;
            }

    /*Logo*/
    .logo {
        background-color: #FFD700;
        float: left;
        height: 21px;
        width: 15px;
        margin: 1.0em 0.6em 0 15px;
    }

    .logo-main-txt {
        font-size: 1.0em;
        padding: 1.35em 0 0 0;
    }

    .logo-sub-txt {
        display:none;
    }

    /*FA-BARs*/
    .fa-bars {
        color: rgb(80,80,80);
        font-size: 18px;
        background-color: rgb(252, 252, 252);
    }

        .fa-bars:hover {
            color: gold;
            font-size: 18px;
            background-color: rgb(252, 252, 252);
            cursor: pointer;
        }

    /*Intro-Kasten im owl-carousel*/
    .id_article {
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 60px;
        padding-top: 130px;
        height: 170px;
        position: relative;
        z-index: 1;
    }

        .id_article:before {
            background-color: rgb(0,0,0);
            content: "";
            height: 100%;
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: -1;
        }

        .id_article h3 {
            font-weight: 300;
            font-size: 1.7em;
        }

        .id_article h4 {
            font-weight: 200;
            font-size: 1.1em;
        }

    .id_titel-en {
        font-family: 'Lexend Mega', sans-serif;
        font-size: 0.4em;
        padding-bottom: 5px;
    }

    .id_titelstatement-left,
    .id_titelstatement-right,
    .id_titelstatement-center,
    .id_announcement-left {
        color: lightgray;
        margin-left: 15px;
        margin-right: 15px;
        padding-left: 5px;
        padding-right: 5px;
    }

    .id_titelstatement-left,
    .id_announcement-left {
        border-left: 3px solid gold;
        text-align: left;
    }

    .id_titelstatement-right {
        border-right: 3px solid gold;
        text-align: right;
    }

    .id_titelstatement-center {
        text-align: center;
    }

    .id_titelstatement-center-border {
        border-top: solid;
        border-color: gold;
        border-width: 3px;
        width: 120px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 8px;
    }

    .id_announcement-left {
        padding-bottom: 10px;
    }

        .id_announcement-left a {
            font-size: 0.75em;
            color: rgb(70,70,70);
            background-color: none;
            padding: 10px 10px 10px 10px;
            border: 1px solid rgb(70,70,70);
            border-radius: 5px;
            margin-bottom: 15px;
        }

        .id_announcement-left a:hover {
            background-color: rgb(80,80,80);
            Color: white;
            transition: 0.2s;
        }

        .id_announcement-left img {
            position: relative;
            top: 0;
            left: 0;
            width: 30px !important;
            height: 30px !important;
            padding-bottom: 15px;
            margin-left: 0;
            margin-right: 20px;
        }

    /*Produkt-Kasten im owl-carousel*/
    .id_product {
        background: rgb(223,223,223);
        background: linear-gradient(320deg, rgba(223,223,223,1) 0%, rgba(255,255,255,1) 100%);
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 60px;
        padding-top: 50px;
        height: 210px;
        position: relative;
        z-index: 1;
    }

        .id_product h3 {
            font-weight: 300;
            font-size: 1.7em;
            color: rgb(70,70,70);
        }

        .id_product h4 {
            font-weight: 200;
            font-size: 1.1em;
            color: rgb(70,70,70);
            margin-bottom: 40px;
        }


    .id_productimg {
        margin-left:15px;
        margin-right:15px;
    }

        .id_productimg img {
            position: absolute;
            margin: 5% 20% 0 50%;
            width: 30% !important;
            height: auto !important;
        }


    #klindworth {
        position: absolute;
        left: 15px;
        bottom: 10px;
        font-size: 0.6em;
        font-weight: lighter;
        color: rgb(160,160,160);
    }

    /*Claim*/
    /*Statement unterhalb Owl-Carrousel*/
    .id_claim {
        column-count: 1;
        margin-top: 15px;
        margin-left: 15px;
        margin-right: 15px;
    }

        .id_claim h1 {
            font-size: 1.7em;
            text-align: center;
            padding: 10px 0 20px 0;
            width: auto;
        }

        .id_claim p {
            padding: 0 0 10px 0;
            font-size:0.75em;
        }

    .id_claim-left p {
        text-align: left;
        hyphens: none;
    }

    .id_claim-center p {
        text-align: center;
        hyphens: none;
    }

        .id_claim-dist {
            padding-bottom: 15px;
        }

        .id_claim ul {
            margin: 0;
            padding-bottom: 30px;
            padding-left: 15px;
        }

        .id_claim li {
            font-size: 0.75em;
            line-height: 1.3;
            padding-bottom: 2px;
        }

    .id_confirmation {
        margin-top: 90px;
        border-radius: 33px;
        width: 33px;
        height:33px;
        margin-left: auto;
        margin-right: auto;
        padding: 10px;
        background-color: none;
        border: 1px solid #808080;
        color: gold;
    }
   

    .id_confirmation i {
        font-size:2em;
    }

        .id_confirmation p {
            padding: 10px;
            text-align: center;
        }

    .id_produktcode {
        margin-top: 90px;
    }

        .id_produktcode h1 {
            font-size: 1.7em;
            text-align: center;
        }

        .id_produktcode h2 {
            padding: 6px 0 12px 0;
            font-size: 1.1em;
            font-stretch:normal;
            text-align: center;
        }

        .id_produktcode h3 {
            padding: 6px 0 12px 0;
            font-size: 1.1em;
            font-stretch: normal;
            font-weight: normal;
            color: #404040
        }

    .id_produktcode-h3l h3,
    .id_produktcode-h3r h3 {
        text-align: center;
    }

    .id_imgleft img,
    .id_imgright img {
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 15px;
    }

    .id_offer {
        font-size: 0.75em;
        color: rgb(70,70,70);
        background-color: rgb(250,250,250);
        text-align: center;
        padding: 15px 10px 15px 10px;
        border: 1px solid rgb(70,70,70);
        border-radius: 5px;
        margin: 15px auto 15px auto;
    }

    .id_numbersequence {
        font-size: 10px;
        color: white;
        background-color: red;
        padding: 6px 6px 6px 6px;
        width: 10px;
        height: 10px;
        border-radius: 30px;
        text-align: center;
        float: left;
        font-weight: bold;
        margin-right: 10px;
    }

    /* Accordion aus w3school */
    .accordionwrapper {
        width: auto;
        margin: 0 15px 0 15px;
        padding: 0 0 0 0;
        margin-top: 15px;
        border-bottom: 1px solid rgb(220,220,220);
    }

        .accordionwrapper h1 {
            margin:0;
            padding: 0 0 15px 0;
            font-size: 1.7em;
        }

    .accordion {
        font-weight: 300;
        font-size: 1.1em;
        width: 100%;
        background-color: white;
        outline: none;
        border: none;
        border-top: 1px solid rgb(220,220,220);
        color: #444;
        cursor: pointer;
        padding: 12px 5px 0 0;
        text-align: left;
        transition: 0.4s;
    }

        .active_acc, .accordion:hover {
            background-color: white;
        }

        .accordion botton {
            background-color: white;
            cursor: pointer;
            padding: 14px 16px;
            transition: 0.2s;
        }

        .accordion:after {
            content: '\002B';
            color: #777;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }

    .active_acc::after {
        content: "\2212";
    }
       
    .panel {
        padding: 8px 0 0 0;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }

        .panel ul {
            padding-bottom: 15px;
            padding-left: 15px;
        }

        .panel li {
            font-size: 0.75em;
            line-height: 1.3;
            padding-bottom: 2px;
        }

        .panel p {
            padding-bottom: 2px;
            text-align: left;
            font-size: 0.75em;
        }

    .panelspacer {
        padding-top: 15px;
        padding-bottom: 15px
    }

    /* Produktkästchen auf den Übersichtsseiten */
    .productbox {
        margin: 10px 0 10px 0;
        float: left;
        width: auto;
        background-color: #fcfcfc;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px;
    }

        .productbox h2 {
            padding: 10px 50px 10px 10px;
            font-stretch: normal;
            font-size: 1.1em;
            font-weight: 500;
            color: rgb(80,80,80);
        }

        .productbox p {
            text-align: left;
            font-size: 0.75em;
            margin: 10px 10px 10px 10px;
            padding-bottom:10px;
            border-bottom: 1px solid rgb(200,200,200)
        }

        .productbox a {
            float: right;
            margin: 10px 10px 10px 0;
            padding: 8px 8px 8px;
            font-size: 0.75em;
            font-stretch: normal;
            background-color: whitesmoke;
            border: 1px solid rgb(200,200,200);
            border-radius: 2px 2px 2px 2px;
        }

            .productbox a:hover {
                background-color: rgb(80,80,80);
                border: 1px solid rgb(80,80,80);
                color: #fff;
                transition: 0.3s;
            }

        .productbox img {
            margin: 10px 10px 0 10px;
            height: 26px;
        }

    .productboxtipp {
        font-size: 0.7em;
        margin: 10px 0 0 0;
        padding: 5px 5px 5px 8px;
        float: right;
        background-color: #EEDC82;
        border: 1px solid rgb(200,200,200);
        border-right: 0;
        border-radius: 5px 0px 0px 5px;
    }

    .productboxprice {
        margin: 0 0 0 10px;
        font-size: 0.9em;
    }

        .productboxprice span {
            font-size: 0.75em;
        }

    .productboxpricesub {
        margin: 5px 0 0 10px;
        font-size: 0.75em;
        font-style: italic;
    }

    /* Bestellformular */
    .id_form_txt {
        font-size: 0.75em;
    }

        .id_form_txt p {
            font-size: 1em;
            padding: 8px 5px 0 5px;
        }

        .id_form_txt fieldset {
            font-size: 1em;
            border: 1px solid lightgray;
            margin: 15px 0 15px 0;
            padding: 0 20px 15px 10px;
        }

        .id_form_txt input {
            font-size: 1em;
            width: 100%;
            border-radius:2px;
        }

        .id_form_txt label {
            font-size: 1em;
            width:100%;
            float: left;
            background-color: whitesmoke;
            margin: 9px 0 0 0;
            padding: 8px 0 6px 6px;
        }

     .id_form_agb {
        width: 100%;
        background-color: none;
    }

        .id_form_agb a {
            color: #000;
            text-decoration: underline
        }

        .id_form_agb input {
            margin: 0 5px 0 8px;
            width: 15px;
            float: left;
            border-radius: 2px;
        }

        .id_form_agb label {
            background-color: inherit;
            padding: 0 0 0 0;
            margin: 6px 5px 5px 5px;
            line-height: 1.5;
            max-width: 80%;
        }

    .id_form_txt button {
        float: right;
        font-size: 1em;
        margin: 25px 8px 15px 0;
        padding: 8px;
        background-color: whitesmoke;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px 2px 2px 2px;
    }

        .id_form_txt button:hover {
            background-color: rgb(80,80,80);
            border: 1px solid rgb(80,80,80);
            color: #fff;
            transition: 0.3s;
        }

    .id_licensecounter {
        margin: 5px 0 0 0;
        padding: 5px;
        float: left;
    }

        .id_licensecounter input {
            float: left;
            width: 30px;
            height: 28px;
            text-align: center;
            padding: 0;
            margin: 0 5px 0 5px;
            border-radius: 2px;
        }

        .id_licensecounter button {
            float: left;
            width: 30px;
            height: 30px;
            text-align: center;
            padding: 0;
            margin: 0;
        }

    .id_anrede {
        margin: 0 0 0 0;
        background-color: none;
    }

        .id_anrede label {
            background-color: inherit;
            margin: 8px 5px 0 0;
            float: left;
            width: auto;
        }

        .id_anrede input {
            float: left;
            width: 15px;
            text-align: center;
            padding: 0;
            margin: 8px 5px 0 0;
            border-radius: 2px;
        }

    /*Unternehmen, Leistungen*/
    #unternehmen h1, #leistungen h1 {
        font-family: 'nunito sans', sans-serif;
        font-size: 1.7em;
        margin: 20px 15px 0 15px;
        padding: 0 0 15px 0;
    }

    #leistungen .owl-theme,
    #unternehmen .owl-theme {
        margin-left: 0;
        margin-right: 0;
        width: auto;
    }

    #leistungen .owl-nav,
    #unternehmen .owl-nav {
        position: absolute;
        top: 417px;
        right: 0;
    }

    #leistungen .owl-prev,
    #leistungen .owl-next,
    #unternehmen .owl-prev,
    #leistungen .owl-prev,
    #leistungen .owl-next,
    #unternehmen .owl-prev,
    #unternehmen .owl-next {
        background-color: rgb(248,249,250);
        border-radius: 5%;
        border-color: darkgray;
        border: 1px solid rgb(210,210,210);
        color: rgb(143,157,171);
        font-size: 20px;
        font-weight: bold;
        transition: 0.3s;
        margin-right: 20px;
        height: 47px;
    }

        #leistungen .owl-prev:hover,
        #leistungen .owl-next:hover,
        #unternehmen .owl-prev:hover,
        #unternehmen .owl-next:hover {
            opacity: 1;
            background-color: lightslategray;
            color: white;
        }

    /*------ Topic ------*/
    .topicwrapper {
        margin: 15px 0 0 0;
    }

    .topicpanel {
        background-color: rgb(248,249,250);
    }

        .topicpanel img {
            width: auto;
            height: 300px;
            object-fit: cover;
            filter: grayscale(30%);
        }

    .topicframe {
        border: 0 solid rgb(220,220,220);
        border-top: none;
        padding: 35px 15px 10px 15px;
    }

        .topicframe:hover {
            cursor: grab;
        }

    .topicframetxt {
        height: 170px;
    }

        .topicframetxt ul {
            font-family: 'nunito sans', sans-serif;
            font-weight: 500;
            font-size: 0.75em;
            padding: 0 0 0 30px;
        }

        .topicframetxt li {
            line-height: 1.4;
        }

    .topicframe h6 {
        font-family: 'nunito sans', sans-serif;
        font-weight: 500;
        font-size: 1em;
        text-align: left;
        line-height: 1.25;
        margin: 20px 10px 10px 0;
        padding: 3px 0 3px 10px;
        color: #404040;
        border-left: 3px solid gold;
    }

    .topicstatement {
        font-family: 'Source Sans Pro', sans-serif;
        text-align: center;
        border: 1px solid rgb(220,220,220);
        border-radius: 10px;
        padding: 15px 25px 15px 25px;
    }

    .topicframe p {
        font-family: 'nunito sans', sans-serif;
        font-weight:500;
        text-align: left;
        hyphens: auto;
        font-size: 0.75em;
        padding: 15px 15px 0 14px;
    }

    .topic {
        font-family: 'nunito sans', sans-serif;
        font-weight: 300;
        font-size: 0.75em;
        border-left: 4px solid gold;
        padding: 14px 0 16px 0;
        background-color: lightslategrey;
        color: white;
        width: 200px;
        text-align: center;
        border: none;
    }

    .topicpagination {
        position: relative;
        bottom: 320px;
        float:right;
        margin-right: 15px;
        padding: 10px;
        font-size: 1.8em;
        color: #303030;
        border-bottom: 1px solid rgb(210,210,210);
    }

        .topicpagination span {
            font-size: 0.4em;
            color: gray
        }

    .topic-sidenav {
        display: none;
    }

    /*KOSTRA-DWD*/
    .id_kostra {
        margin: 0 15px 0 15px;
        padding: 100px 0 0 0;
    }

        .id_kostra h1 {
            margin: 0 0 0 0;
            padding: 0 0 0 0;
            font-size: 1.7em;
        }

        .id_kostra h2 {
            padding: 15px 0 0 0;
            font-stretch: normal;
            font-size: 1.1em;
        }

    .cr {
        background-color: none;
        padding: 2px 2px 2px 0;
        height: 26px;
        margin: 1px;
        font-size: 0.75em;
    }

    .c0 {
        background-color: lightgray;
        padding: 4px;
        width: 10%;
        float: left;
        text-align: right;
    }

    .cx {
        background-color: whitesmoke;
        padding: 4px;
        width: 8%;
        float: left;
        text-align: right;
    }

    #googleMap {
        margin: 10px 15px 10px 15px;
        height: 400px;
    }

    /*Tableblock*/
    .tableblock {
        font-family: 'Segoe UI';
        height: auto;
        margin: 0 15px 0 15px;
        padding: 0;
    }

        .tableblock h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

        .tableblock table {
            margin-top: 15px;
            font-size: 12px;
            color: #2A2A2A;
            border: 1px solid #BDBDBD;
            border-collapse: collapse;
            text-align: left
        }

        .tableblock th {
            background-color: #EDEDED;
        }

        .tableblock th, td, tr {
            border: 1px solid #BDBDBD;
            padding: 8px;
        }
    /*Newsblock*/
    .newsblock {
        display:flex;
        align-items:flex-start;
        font-family: 'Segoe UI';
        font-size: 16px;
        height: auto;
        margin: 0;
        padding: 10px;
    }

        .newsblock a {
            color: steelblue;
            font-weight: 400;
        }

            .newsblock a:hover {
                text-decoration: underline;
            }

        .newstext {
            flex:1;
        }

        .newstext h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

    .newsblock-left {
        background-color: none;
    }

    .newsblock-left img {
        padding: 10px;
        width: 50%;
        height: auto;
        float: left;
    }

    .newsblock-right {
        background-color: whitesmoke;
    }

        .newsblock-right img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: right;
        }

    .newsblock-height {
        height: auto;
    }

    .newsblock table {
        margin-top: 15px;
        font-size: 12px;
        color: #2A2A2A;
        border: 1px solid #BDBDBD;
        border-collapse: collapse;
        text-align: left
    }

    .newsblock th {
        background-color: #EDEDED;
    }

    .newsblock th, td, tr {
        border: 1px solid #BDBDBD;
        padding: 8px;
    }

    /*Impressum*/
    #impressum {
        margin: 50px 15px 0 15px;
        padding: 0 0 0 0;
    }

        #impressum h3 {
            font-weight: normal;
            padding: 2em 0 1.2em 0;
        }

        #impressum p {
            text-align: left;
            font-size: 0.75em;
            padding: 0 0 0 0;
        }

    /*AGB, Datenschutz*/
    #agb,
    #datenschutz {
        margin: 50px 15px 0 15px;
        color: rgb(80,80,80);
    }

        #agb h3,
        #datenschutz h3 {
            font-weight: normal;
            padding: 2em 0 0.8em 0;
        }

        #agb h4,
        #datenschutz h4 {
            font-weight: normal;
            padding: 0.5em 0 0.7em 0;
        }

        #agb p {
            font-size: 0.75em;
            padding: 0 0 0.4em 0;
            text-align: left;
        }

        #datenschutz p {
            font-size: 0.75em;
            padding: 0 0 0 0px;
            text-align: left;
        }

        #datenschutz ol {
            font-size: 0.75em;
            padding: 0 30px 0 30px;
            list-style-type: upper-roman;
        }

            #datenschutz ol p {
                font-size: 1.0em;
            }

            #datenschutz ol li {
                padding: 0 0 10px 0;
            }

        #datenschutz ul {
            padding-left: 15px;
            padding-top: 5px;
            padding-bottom: 10px;
        }

            #datenschutz ul li {
                font-size: 0.75em;
                line-height: 1.75;
                list-style: disc;
            }




}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    header {
        height: 60px;
        padding: 0 15px 5px 15px;
    }

    footer {
        margin-left: 15px;
        margin-right: 15px;
        height: 50px;
        margin-top: 50px;
        border-top: 1px solid rgb(220,220,220);
    }

        footer p {
            font-size: 0.7em;
        }

        footer a {
            padding: 10px 10px 10px 10px;
        }

            footer a:hover {
                background-color: #e2e6e9;
            }

    /*Logo*/
    .logo {
        background-color: #FFD700;
        float: left;
        height: 25px;
        width: 19px;
        margin: 0.6em 0.6em 1em 0;
    }

    .logo-main-txt {
        font-size: 1.3em;
        padding: 0.8em 0 0 0;
    }

    .logo-sub-txt {
        display:block;
        font-size: 0.6em;
    }

    /*FA-BARs*/
    .fa-bars {
        color: rgb(80,80,80);
        font-size: 18px;
        background-color: rgb(252, 252, 252);
    }

        .fa-bars:hover {
            color: gold;
            font-size: 18px;
            background-color: rgb(252, 252, 252);
            cursor: pointer;
        }

    /*Intro-Kasten im owl-carousel*/
    .id_article {
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 65px;
        padding-top: 160px;
        height: 200px;
        position: relative;
        z-index: 1;
    }

        .id_article:before {
            background-color: rgb(0,0,0);
            content: "";
            height: 100%;
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: -1;
        }

        .id_article h3 {
            font-weight: 300;
            font-size: 2.0em;
        }

        .id_article h4 {
            font-weight: 200;
            font-size: 1.3em;
        }

    .id_titel-en {
        font-family: 'Lexend Mega', sans-serif;
        font-size: 0.45em;
        padding-bottom: 5px;
    }

    .id_titelstatement-left,
    .id_titelstatement-right,
    .id_titelstatement-center,
    .id_announcement-left {
        color: lightgray;
        margin-left: 15px;
        margin-right: 15px;
        padding-left: 5px;
        padding-right: 5px;
    }

    .id_titelstatement-left,
    .id_announcement-left {
        border-left: 3px solid gold;
        text-align: left;
    }

    .id_titelstatement-right {
        border-right: 3px solid gold;
        text-align: right;
    }

    .id_titelstatement-center {
        text-align: center;
    }

    .id_titelstatement-center-border {
        border-top: solid;
        border-color: gold;
        border-width: 3px;
        width: 145px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 8px;
    }

    .id_announcement-left {
        padding-bottom: 10px;
    }

        .id_announcement-left a {
            font-size: 0.8em;
            color: rgb(70,70,70);
            background-color: none;
            padding: 10px 10px 10px 10px;
            border: 1px solid rgb(70,70,70);
            border-radius: 5px;
            margin-bottom: 15px;
        }

            .id_announcement-left a:hover {
                background-color: rgb(80,80,80);
                Color: white;
                transition: 0.2s;
            }

        .id_announcement-left img {
            position: relative;
            top: 0;
            left: 0;
            width: 35px !important;
            height: 35px !important;
            padding-bottom: 15px;
            margin-left: 0;
            margin-right: 0
        }

    /*Produkt-Kasten im owl-carousel*/
    .id_product {
        background: rgb(223,223,223);
        background: linear-gradient(320deg, rgba(223,223,223,1) 0%, rgba(255,255,255,1) 100%);
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 65px;
        padding-top: 80px;
        height: 280px;
        position: relative;
        z-index: 1;
    }

        .id_product h3 {
            font-weight: 300;
            font-size: 2.0em;
            color: rgb(70,70,70);
        }

        .id_product h4 {
            font-weight: 200;
            font-size: 1.3em;
            color: rgb(70,70,70);
            margin-bottom: 40px;
        }


    .id_productimg {
        margin-left:15px;
        margin-right: 15px;
    }

        .id_productimg img {
            position: absolute;
            margin: 5% 20% 0 50%;
            width: 30% !important;
            height: auto !important;
        }

    #klindworth {
        position: absolute;
        left: 15px;
        bottom: 10px;
        font-size: 0.6em;
        font-weight: lighter;
        color: rgb(160,160,160);
    }
    
    /*Claim*/
    /*Statement unterhalb Owl-Carrousel*/
    .id_claim {
        column-count: 2;
        margin-top: 15px;
        margin-left: 15px;
        margin-right: 15px;
        column-gap: 50px;
        column-rule-style: solid;
        column-rule-width: 1px;
        column-rule-color: rgb(210,210,210);
    }

        .id_claim h1 {
            font-size: 2em;
            text-align: center;
            padding: 10px 0 20px 0;
            width: auto;
        }

        .id_claim p {
            padding: 0 0 10px 0;
            font-size: 0.80em;
        }

    .id_claim-left p {
        text-align: left;
        hyphens: none;
    }

    .id_claim-center p {
        text-align: center;
        hyphens: none;
    }

    .id_claim-dist {
        padding-bottom: 15px;
    }

    .id_claim ul {
        margin: 0;
        padding-bottom: 30px;
        padding-left: 15px;
    }

    .id_claim li {
        font-size: 0.8em;
        line-height: 1.3;
        padding-bottom: 2px;
    }

    .id_confirmation
     {
        margin-top: 110px;
        border-radius: 35px;
        width: 35px;
        height:35px;
        margin-left: auto;
        margin-right: auto;
        padding: 12px;
        background-color: none;
        border: 1px solid #808080;
        color: gold;
    }

    .id_confirmation i {
        font-size: 2.2em;
    }

        .id_confirmation p {
            padding: 10px;
            text-align: center;
        }

    .id_produktcode {
        margin-top: 90px;
    }

        .id_produktcode h1 {
            font-size: 2.0em;
            text-align: center;
        }

        .id_produktcode h2 {
            padding: 6px 0 12px 0;
            font-size: 1.4em;
            font-stretch:normal;
            text-align: center;
        }

        .id_produktcode h3 {
            padding: 6px 0 12px 0;
            font-size: 1.4em;
            font-stretch: normal;
            font-weight: normal;
            color: #404040
        }

    .id_produktcode-h3l h3 {
        text-align: center;
    }

    .id_produktcode-h3r h3 {
        text-align: center;
    }

    .id_imgleft img {
        float: right;
        margin-left: 80px;
        margin-right: 20px;
        margin-bottom: 35px;
    }

    .id_imgright img {
        float: left;
        margin-right: 80px;
        margin-left: 20px;
        margin-bottom: 35px;
    }

    .id_offer {
        font-size: 0.8em;
        color: rgb(70,70,70);
        background-color: rgb(250,250,250);
        text-align: center;
        padding: 15px 10px 15px 10px;
        border: 1px solid rgb(70,70,70);
        border-radius: 5px;
        width: 600px;
        margin: 15px auto 15px auto;
    }

    .id_numbersequence {
        font-size: 10px;
        color: white;
        background-color: red;
        padding: 6px 6px 6px 6px;
        width: 10px;
        height: 10px;
        border-radius: 30px;
        text-align: center;
        float: left;
        font-weight: bold;
        margin-right: 10px;
    }

    /* Accordion aus w3school */
    .accordionwrapper {
        width: auto;
        margin: 0 15px 0 15px;
        padding: 0 0 0 0;
        margin-top: 15px;
        border-bottom: 1px solid rgb(220,220,220);
    }

        .accordionwrapper h1 {
            margin:0;
            padding: 0 0 20px 0;
            font-size: 2.0em;
        }

    .accordion {
        font-weight: 300;
        font-size: 1.1em;
        width: 100%;
        background-color: white;
        outline: none;
        border: none;
        border-top: 1px solid rgb(220,220,220);
        color: #444;
        cursor: pointer;
        padding: 12px 5px 0 0;
        text-align: left;
        transition: 0.4s;
    }

        .active_acc, .accordion:hover {
            background-color: white;
        }

        .accordion botton {
            background-color: white;
            cursor: pointer;
            padding: 14px 16px;
            transition: 0.2s;
        }

        .accordion:after {
            content: '\002B';
            color: #777;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }

    .active_acc::after {
        content: "\2212";
    }

    .panel {
        padding: 8px 70px 0 0;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }

    .panel-np {
        padding: 8px 0 0 0;
        }

        .panel ul {
            padding-bottom: 15px;
            padding-left: 15px;
        }

        .panel li {
            font-size: 0.8em;
            line-height: 1.3;
            padding-bottom: 2px;
        }

        .panel p {
            padding-bottom: 2px;
            text-align: left;
            font-size: 0.80em;
        }

    .panelspacer {
        padding-top: 15px;
        padding-bottom: 15px
    }

    /* Produktkästchen auf den Übersichtsseiten */
    .productbox {
        margin: 10px 10px 10px 0;
        float: left;
        width: 48%;
        background-color: #fcfcfc;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px;
    }

        .productbox h2 {
            padding: 10px 50px 10px 10px;
            font-stretch: normal;
            font-size: 1.1em;
            font-weight: 500;
            color: rgb(80,80,80);
            height:25px;
        }

        .productbox p {
            text-align: left;
            font-size: 0.80em;
            margin: 10px 10px 10px 10px;
            height: 95px;
            border-bottom: 1px solid rgb(200,200,200)
        }

        .productbox a {
            position: relative;
            float: right;
            margin: 10px 10px 10px 0;
            padding: 8px 8px 8px;
            font-size: 0.80em;
            font-stretch: normal;
            background-color: whitesmoke;
            border: 1px solid rgb(200,200,200);
            border-radius: 2px 2px 2px 2px;
        }

            .productbox a:hover {
                background-color: rgb(80,80,80);
                border: 1px solid rgb(80,80,80);
                color: #fff;
                transition: 0.3s;
            }

        .productbox img {
            margin: 10px 10px 0 10px;
            height: 28px;
        }

    .productboxtipp {
        font-size: 0.75em;
        margin: 10px 0 0 0;
        padding: 5px 5px 5px 8px;
        float: right;
        background-color: #EEDC82;
        border: 1px solid rgb(200,200,200);
        border-right: 0;
        border-radius: 5px 0px 0px 5px;
    }

    .productboxprice {
        margin: 0 0 0 10px;
        font-size: 0.9em;
    }

        .productboxprice span {
            font-size: 0.75em;
        }

    .productboxpricesub {
        margin: 5px 0 0 10px;
        font-size: 0.75em;
        font-style: italic;
    }

    /* Bestellformular */
    .id_form_txt {
        font-size: 0.80em;
    }

        .id_form_txt p {
            font-size: 1em;
            padding: 8px 5px 0 5px;
        }

        .id_form_txt fieldset {
            font-size: 1em;
            border: 1px solid lightgray;
            margin: 15px 0 15px 0;
            padding: 0 5px 15px 10px;
        }

        .id_form_txt input {
            font-size: 1em;
            width: auto;
            border-radius:2px;
            padding:0 5px 0 5px;
        }

        .id_form_txt label {
            font-size: 1em;
            float: left;
            background-color: whitesmoke;
            margin: 11px 8px 0 0;
            padding: 8px 0 6px 6px;
            width:200px;
        }

    .id_form_agb {
        width: 100%;
        background-color: none;
    }

        .id_form_agb a {
            color: #000;
            text-decoration: underline
        }

        .id_form_agb input {
            margin: 0 5px 0 8px;
            width: 15px;
            float: left;
            border-radius: 2px;
        }

        .id_form_agb label {
            background-color: inherit;
            padding: 0 0 0 0;
            margin: 6px 5px 5px 5px;
            line-height: 1.5;
            width: auto;
        }

    .id_form_txt button {
        float: right;
        font-size: 1em;
        margin: 0 8px 15px 0;
        padding: 8px;
        background-color: whitesmoke;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px 2px 2px 2px;
    }

        .id_form_txt button:hover {
            background-color: rgb(80,80,80);
            border: 1px solid rgb(80,80,80);
            color: #fff;
            transition: 0.3s;
        }

    .id_licensecounter {
        margin: 5px 0 0 0;
        padding: 5px;
        float: left;
    }

        .id_licensecounter input {
            float: left;
            width: 30px;
            height: 28px;
            text-align: center;
            padding: 0;
            margin: 0 5px 0 5px;
            border-radius: 2px;
        }

        .id_licensecounter button {
            float: left;
            width: 30px;
            height: 30px;
            text-align: center;
            padding: 0;
            margin: 0;
        }

    .id_anrede {
        margin: 0 0 0 0;
        height:30px;
        background-color: none;
    }

        .id_anrede label {
            background-color: inherit;
            margin: 8px 5px 0 0;
            float: left;
            width: auto;
        }

        .id_anrede input {
            float: left;
            width: 15px;
            text-align: center;
            padding: 0;
            margin: 8px 5px 0 0;
            border-radius: 2px;
        }

    /*Unternehmen, Leistungen*/
    #unternehmen h1, #leistungen h1 {
        font-family: 'nunito sans', sans-serif;
        font-size: 2.0em;
        margin: 20px 15px 0 15px;
        padding: 0 0 15px 0;
    }

    #leistungen .owl-theme,
    #unternehmen .owl-theme {
        margin-left: 0;
        margin-right: 0;
        width: auto;
    }

    #leistungen .owl-nav,
    #unternehmen .owl-nav {
        position: absolute;
        top: 518px;
        right: 0;
    }

    #leistungen .owl-prev,
    #leistungen .owl-next,
    #unternehmen .owl-prev,
    #unternehmen .owl-next {
        background-color: rgb(248,249,250);
        border-radius: 5%;
        border-color: darkgray;
        border: 1px solid rgb(210,210,210);
        color: rgb(143,157,171);
        font-size: 20px;
        font-weight: bold;
        transition: 0.3s;
        margin-right: 20px;
        height:48px;
    }

        #leistungen .owl-prev:hover,
        #leistungen .owl-next:hover,
        #unternehmen .owl-prev:hover,
        #unternehmen .owl-next:hover {
            opacity: 1;
            background-color: lightslategray;
            color: white;
        }

    /*------ Topic ------*/
    .topicwrapper {
        margin: 15px 0 0 0;
    }

    .topicpanel {
        background-color: rgb(248,249,250);
    }

        .topicpanel img {
            width: auto;
            height: 400px;
            object-fit: cover;
            filter: grayscale(30%);
        }

    .topicframe {
        border: 0 solid rgb(220,220,220);
        border-top: none;
        padding: 35px 15px 10px 15px;
    }

        .topicframe:hover {
            cursor: grab;
        }

    .topicframetxt {
        height: 170px;
    }

        .topicframetxt ul {
            font-family: 'nunito sans', sans-serif;
            font-weight: 500;
            font-size: 0.80em;
            padding: 0 0 0 30px;
        }

        .topicframetxt li {
            line-height: 1.4;
        }

    .topicframe h6 {
        font-family: 'nunito sans', sans-serif;
        font-weight: 500;
        font-size: 1em;
        text-align: left;
        line-height: 1.25;
        margin: 20px 10px 10px 0;
        padding: 3px 0 3px 10px;
        color: #404040;
        border-left: 3px solid gold;
    }

    .topicstatement {
        font-family: 'Source Sans Pro', sans-serif;
        text-align: center;
        border: 1px solid rgb(220,220,220);
        border-radius: 10px;
        padding: 15px 25px 15px 25px;
    }

    .topicframe p {
        font-family: 'nunito sans', sans-serif;
        font-weight:500;
        text-align: left;
        hyphens: auto;
        font-size: 0.80em;
        padding: 15px 15px 0 14px;
    }

    .topic {
        font-family: 'nunito sans', sans-serif;
        font-weight: 300;
        font-size: 0.80em;
        border-left: 4px solid gold;
        padding: 14px 0 16px 0;
        background-color: lightslategrey;
        color: white;
        width: 200px;
        text-align: center;
        border: none;
    }

    .topicpagination {
        position: relative;
        bottom: 320px;
        float: right;
        margin-right: 15px;
        padding: 10px;
        font-size: 1.8em;
        color: #303030;
        border-bottom: 1px solid rgb(210,210,210);
    }

        .topicpagination span {
            font-size: 0.4em;
            color: gray
        }

    .topic-sidenav {
        display: none;
    }

    /*KOSTRA-DWD*/
    .id_kostra {
        margin: 0 15px 0 15px;
        padding: 100px 0 0 0;
    }

        .id_kostra h1 {
            margin: 0 0 0 0;
            padding: 0 0 0 0;
            font-size: 2.0em;
        }

        .id_kostra h2 {
            padding: 15px 0 0 0;
            font-stretch: normal;
            font-size: 1.1em;
        }

    .cr {
        background-color: none;
        padding: 2px 2px 2px 0;
        height: 26px;
        margin: 1px;
        font-size: 0.8em;
    }

    .c0 {
        background-color: lightgray;
        padding: 4px;
        width: 10%;
        float: left;
        text-align: right;
    }

    .cx {
        background-color: whitesmoke;
        padding: 4px;
        width: 8%;
        float: left;
        text-align: right;
    }

    #googleMap {
        margin: 10px 15px 10px 15px;
        height: 400px;
    }

    /*Tableblock*/
    .tableblock {
        font-family: 'Segoe UI';
        height: auto;
        margin: 0 15px 0 15px;
        padding: 0;
    }

        .tableblock h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

        .tableblock table {
            margin-top: 15px;
            font-size: 12px;
            color: #2A2A2A;
            border: 1px solid #BDBDBD;
            border-collapse: collapse;
            text-align: left
        }

        .tableblock th {
            background-color: #EDEDED;
        }

        .tableblock th, td, tr {
            border: 1px solid #BDBDBD;
            padding: 8px;
        }


    /*Newsblock*/
    .newsblock {
        display: flex;
        align-items: flex-start;
        font-family: 'Segoe UI';
        font-size: 16px;
        height: auto;
        margin: 0;
        padding: 10px;
    }

        .newsblock a {
            color: steelblue;
            font-weight: 400;
        }

            .newsblock a:hover {
                text-decoration: underline;
            }

    .newstext {
        flex: 1;
    }

        .newstext h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

    .newsblock-left {
        background-color: none;
    }

        .newsblock-left img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: left;
        }

    .newsblock-right {
        background-color: whitesmoke;
    }

        .newsblock-right img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: right;
        }

    .newsblock-height {
        height: auto;
    }

    .newsblock table {
        margin-top: 15px;
        font-size: 12px;
        color: #2A2A2A;
        border: 1px solid #BDBDBD;
        border-collapse: collapse;
        text-align: left
    }

    .newsblock th {
        background-color: #EDEDED;
    }

    .newsblock th, td, tr {
        border: 1px solid #BDBDBD;
        padding: 8px;
    }



    /*Impressum*/
    #impressum {
        margin: 80px 15px 0 15px;
        padding: 0 0 0 0;
    }

        #impressum h3 {
            font-weight: normal;
            padding: 2em 0 1.2em 0;
        }

        #impressum p {
            text-align: left;
            font-size: 0.75em;
            padding: 0 0 0 0;
        }

    /*AGB, Datenschutz*/
    #agb,
    #datenschutz {
        margin: 50px 15px 0 15px;
        color: rgb(80,80,80);
    }

        #agb h3,
        #datenschutz h3 {
            font-weight: normal;
            padding: 2em 0 0.8em 0;
        }

        #agb h4,
        #datenschutz h4 {
            font-weight: normal;
            padding: 0.5em 0 0.7em 0;
        }

        #agb p {
            font-size: 0.75em;
            padding: 0 0 0.4em 0;
            text-align: left;
        }

        #datenschutz p {
            font-size: 0.75em;
            padding: 0 0 0 0px;
            text-align: left;
        }

        #datenschutz ol {
            font-size: 0.75em;
            padding: 0 30px 0 30px;
            list-style-type: upper-roman;
        }

            #datenschutz ol p {
                font-size: 1.0em;
            }

            #datenschutz ol li {
                padding: 0 0 10px 0;
            }

        #datenschutz ul {
            padding-left: 15px;
            padding-top: 5px;
            padding-bottom: 10px;
        }

            #datenschutz ul li {
                font-size: 0.75em;
                line-height: 1.75;
                list-style: disc;
            }


}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

    header {
        height: 60px;
        padding: 0 10% 8px 10%;
    }

    footer {
        margin-left: 10%;
        margin-right: 10%;
        height: 50px;
        margin-top: 30px;
        border-top: 1px solid rgb(220,220,220);
    }

        footer p {
            font-size: 0.7em;
        }

        footer a {
            padding: 10px 10px 10px 10px;
        }

            footer a:hover {
                background-color: #e2e6e9;
            }

    /*Logo*/
    .logo {
        background-color: #FFD700;
        float: left;
        height: 25px;
        width: 19px;
        margin: 0.6em 0.6em 1em 0;
    }

    .logo-main-txt {
        font-size: 1.3em;
        padding: 0.8em 0 0 0;
    }

    .logo-sub-txt {
        display: block;
        font-size: 0.6em;
    }

    /*Intro-Kasten im owl-carousel*/
    .id_article {
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 65px;
        padding-top: 200px;
        height: 300px;
        position: relative;
        z-index: 1;
    }

        .id_article:before {
            background-color: rgb(0,0,0);
            content: "";
            height: 100%;
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: -1;
        }

        .id_article h3 {
            font-weight: 300;
            font-size: 2.2em;
        }

        .id_article h4 {
            font-weight: 200;
            font-size: 1.5em;
        }
    
        .id_titel-en {
        font-family: 'Lexend Mega', sans-serif;
        font-size: 0.5em;
        padding-bottom: 5px;
    }

    .id_titelstatement-left,
    .id_titelstatement-right,
    .id_titelstatement-center,
    .id_announcement-left {
        color: lightgray;
        margin-left: 10%;
        margin-right: 10%;
        padding-left: 5px;
        padding-right: 5px;
    }

    .id_titelstatement-left,
    .id_announcement-left {
        border-left: 4px solid gold;
        text-align: left;
    }

    .id_titelstatement-right {
        border-right: 4px solid gold;
        text-align: right;
    }

    .id_titelstatement-center {
        text-align: center;
    }

    .id_titelstatement-center-border {
        border-top: solid;
        border-color: gold;
        border-width: 4px;
        width: 170px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 8px;
    }

    .id_announcement-left {
        padding-bottom: 10px;
    }

        .id_announcement-left a {
            font-size: 0.85em;
            color: rgb(70,70,70);
            background-color: none;
            padding: 10px 10px 10px 10px;
            border: 1px solid rgb(70,70,70);
            border-radius: 5px;
            margin-bottom: 15px;
        }

            .id_announcement-left a:hover {
                background-color: rgb(80,80,80);
                Color: white;
                transition: 0.2s;
            }

        .id_announcement-left img {
            position: relative;
            top: 0;
            left: 0;
            width: 40px !important;
            height: 40px !important;
            padding-bottom: 15px;
            margin-left: 0;
            margin-right: 0
        }

    /*Produkt-Kasten im owl-carousel*/
    .id_product {
        background: rgb(223,223,223);
        background: linear-gradient(320deg, rgba(223,223,223,1) 0%, rgba(255,255,255,1) 100%);
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 65px;
        padding-top: 200px;
        height: 300px;
        position: relative;
        z-index: 1;
    }

        .id_product h3 {
            font-weight: 300;
            font-size: 2.2em;
            color: rgb(70,70,70);
        }

        .id_product h4 {
            font-weight: 200;
            font-size: 1.5em;
            color: rgb(70,70,70);
            margin-bottom: 40px;
        }


    .id_productimg {
       margin-left:20%;
       margin-right:20%;
    }

        .id_productimg img {
            position: absolute;
            margin: 5% 20% 0 60%;
            width: 40% !important;
            height: auto !important;
        }

    #klindworth {
        position: absolute;
        left: 10%;
        bottom: 10px;
        font-size: 0.6em;
        font-weight: lighter;
        color: rgb(160,160,160);
    }

    /*Claim*/
    /*Statement unterhalb Owl-Carrousel*/
    .id_claim {
        column-count: 2;
        margin-top:30px;
        margin-left: 10%;
        margin-right: 10%;
        column-gap: 50px;
        column-rule-style: solid;
        column-rule-width: 1px;
        column-rule-color: rgb(210,210,210);
    }

        .id_claim h1 {
            font-size: 2em;
            text-align: center;
            padding: 10px 0 20px 0;
            width: auto;
        }

        .id_claim p {
            padding: 0 0 10px 0;
            font-size: 0.85em;
        }

    .id_claim-left p {
        text-align: left;
        hyphens: none;
    }

    .id_claim-center p {
        text-align: center;
        hyphens: none;
    }

    .id_claim-dist {
        padding-bottom: 15px;
    }

    .id_claim ul {
        margin: 0;
        padding-bottom: 30px;
        padding-left: 15px;
    }

    .id_claim li {
        font-size: 0.85em;
        line-height: 1.3;
        padding-bottom: 2px;
    }

    .id_confirmation {
        margin-top: 130px;
        border-radius: 40px;
        width: 40px;
        height:40px;
        margin-left: auto;
        margin-right: auto;
        padding: 12px;
        background-color: none;
        border: 1px solid #808080;
        color: gold;
    }

    .id_confirmation i {
        font-size: 2.5em;
    }

        .id_confirmation p {
            padding: 10px;
            text-align: center;
        }

    .id_produktcode {
        margin-top: 90px;
    }

        .id_produktcode h1 {
            font-size: 2em;
            text-align: center;
        }

        .id_produktcode h2 {
            padding: 6px 0 12px 0;
            font-size: 1.4em;
            font-stretch:normal;
            text-align: center;
        }

        .id_produktcode h3 {
            padding: 6px 0 12px 0;
            font-size: 1.4em;
            font-stretch: normal;
            font-weight: normal;
            color: #404040
        }

    .id_produktcode-h3l h3 {
        text-align: center;
    }

    .id_produktcode-h3r h3 {
        text-align: center;
    }

    .id_imgleft img {
        float: right;
        margin-left: 80px;
        margin-right: 20px;
        margin-bottom: 35px;
    }

    .id_imgright img {
        float: left;
        margin-right: 80px;
        margin-left: 20px;
        margin-bottom: 35px;
    }

    .id_offer {
        font-size: 0.85em;
        color: rgb(70,70,70);
        background-color: rgb(250,250,250);
        text-align: center;
        padding: 15px 10px 15px 10px;
        border: 1px solid rgb(70,70,70);
        border-radius: 5px;
        width: 600px;
        margin: 15px auto 15px auto;
    }

    .id_numbersequence {
        font-size: 10px;
        color: white;
        background-color: red;
        padding: 6px 6px 6px 6px;
        width: 10px;
        height: 10px;
        border-radius: 30px;
        text-align: center;
        float: left;
        font-weight: bold;
        margin-right: 10px;
    }

    /* Accordion aus w3school */
    .accordionwrapper {
        width: auto;
        margin: 0 10% 0 10%;
        padding: 0 0 0 0;
        margin-top: 15px;
        border-bottom: 1px solid rgb(220,220,220);
    }

        .accordionwrapper h1 {
            margin: 0;
            padding: 0 0 20px 0;
            font-size: 2.0em;
        }

    .accordion {
        font-weight: 300;
        font-size: 1.1em;
        width: 100%;
        background-color: white;
        outline: none;
        border: none;
        border-top: 1px solid rgb(220,220,220);
        color: #444;
        cursor: pointer;
        padding: 12px 5px 0 0;
        text-align: left;
        transition: 0.4s;
    }

        .active_acc, .accordion:hover {
            background-color: white;
        }

        .accordion botton {
            background-color: white;
            cursor: pointer;
            padding: 14px 16px;
            transition: 0.2s;
        }

        .accordion:after {
            content: '\002B';
            color: #777;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }

    .active_acc::after {
        content: "\2212";
    }



    .panel {
        padding: 8px 70px 0 2px;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }

    .panel-np {
        padding: 8px 0 0 0;
    }

        .panel ul {
            padding-bottom: 15px;
            padding-left: 15px;
        }

        .panel li {
            font-size: 0.85em;
            line-height: 1.3;
            padding-bottom: 2px;
        }

        .panel p {
            padding-bottom: 2px;
            text-align: left;
            font-size: 0.85em;
        }

    .panelspacer {
        padding-top: 15px;
        padding-bottom: 15px
    }

    /* Produktkästchen auf den Übersichtsseiten */
    .productbox {
        margin: 10px 10px 10px 0;
        float: left;
        width: 265px;
        background-color: #fcfcfc;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px;
    }

        .productbox h2 {
            padding: 10px 50px 10px 10px;
            font-stretch: normal;
            font-size: 1.1em;
            font-weight: 500;
            color: rgb(80,80,80);
            height:40px
        }

        .productbox p {
            text-align: left;
            font-size: 0.85em;
            margin: 10px 10px 10px 10px;
            height: 170px;
            border-bottom: 1px solid rgb(200,200,200)
        }

        .productbox a {
            position: relative;
            float: right;
            margin: 10px 10px 10px 0;
            padding: 8px 8px 8px;
            font-size: 0.85em;
            font-stretch: normal;
            background-color: whitesmoke;
            border: 1px solid rgb(200,200,200);
            border-radius: 2px 2px 2px 2px;
        }

            .productbox a:hover {
                background-color: rgb(80,80,80);
                border: 1px solid rgb(80,80,80);
                color: #fff;
                transition: 0.3s;
            }

        .productbox img {
            margin: 10px 10px 0 10px;
            height: 30px;
        }

    .productboxtipp {
        font-size: 0.75em;
        margin: 10px 0 0 0;
        padding: 5px 5px 5px 8px;
        float: right;
        background-color: #EEDC82;
        border: 1px solid rgb(200,200,200);
        border-right: 0;
        border-radius: 5px 0px 0px 5px;
    }

    .productboxprice {
        margin: 0 0 0 10px;
        font-size: 0.9em;
    }

        .productboxprice span {
            font-size: 0.75em;
        }

    .productboxpricesub {
        margin: 5px 0 0 10px;
        font-size: 0.75em;
        font-style: italic;
    }

    /* Bestellformular */
    .id_form_txt {
        font-size: 0.85em;
    }

        .id_form_txt p {
            font-size: 1em;
            padding: 8px 5px 0 5px;
        }

        .id_form_txt fieldset {
            font-size: 1em;
            border: 1px solid lightgray;
            margin: 15px 0 15px 0;
            padding: 0 5px 15px 10px;
        }

        .id_form_txt input {
            font-size: 1em;
            width: auto;
            border-radius:2px;
            padding:0 5px 0 5px;
        }

        .id_form_txt label {
            font-size: 1em;
            float: left;
            background-color: whitesmoke;
            margin: 11px 8px 0 0;
            padding: 8px 0 6px 6px;
            width: 200px;
        }

    .id_form_agb {
        width: 100%;
        background-color: none;
    }

        .id_form_agb a {
            color: #000;
            text-decoration: underline
        }

        .id_form_agb input {
            margin: 0 5px 0 8px;
            width: 15px;
            float: left;
            border-radius: 2px;
        }

        .id_form_agb label {
            background-color: inherit;
            padding: 0 0 0 0;
            margin: 6px 5px 5px 5px;
            line-height: 1.5;
            width: 450px;
        }

    .id_form_txt button {
        float: right;
        font-size: 1em;
        margin: 0 8px 15px 0;
        padding: 8px;
        background-color: whitesmoke;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px 2px 2px 2px;
    }

        .id_form_txt button:hover {
            background-color: rgb(80,80,80);
            border: 1px solid rgb(80,80,80);
            color: #fff;
            transition: 0.3s;
        }

    .id_licensecounter {
        margin: 5px 0 0 0;
        padding: 5px;
        float: left;
    }

        .id_licensecounter input {
            float: left;
            width: 30px;
            height: 28px;
            text-align: center;
            padding: 0;
            margin: 0 5px 0 5px;
            border-radius: 2px;
        }

        .id_licensecounter button {
            float: left;
            width: 30px;
            height: 30px;
            text-align: center;
            padding: 0;
            margin: 0;
        }

    .id_anrede {
        margin: 0 0 0 0;
        height: 30px;
        background-color: none;
    }

        .id_anrede label {
            background-color: inherit;
            margin: 8px 5px 0 0;
            float: left;
            width: auto;
        }

        .id_anrede input {
            float: left;
            width: 15px;
            text-align: center;
            padding: 0;
            margin: 8px 5px 0 0;
            border-radius: 2px;
        }

    /*Unternehmen, Leistungen*/
    #leistungen {
        margin-top:130px;
    }

        #unternehmen h1, #leistungen h1 {
            font-family: 'nunito sans', sans-serif;
            font-size: 2.0em;
            margin: 20px 10% 0 10%;
            padding: 0 0 15px 0;
        }

    #leistungen .owl-theme,
    #unternehmen .owl-theme {
        margin-left: 10%;
        margin-right: 10%;
        width: auto;
    }

    #leistungen .owl-nav,
    #unternehmen .owl-nav {
        position: relative;
        float: left;
        top: -380px;
        left: -3%;
        height:100px;
    }

    #unternehmen .owl-prev,
    #leistungen .owl-prev {
        position:absolute;
        top:-20px; 
        left:-68px;
        float:none;
        transition:none;
    }

    #unternehmen .owl-next, 
    #leistungen .owl-next {
        position: absolute;
        top: -20px;
        left: -25px;
        float: none;
        transition: none;
    }

        #leistungen .owl-prev,
        #leistungen .owl-next,
        #unternehmen .owl-prev,
        #unternehmen .owl-next {
            background-color: rgb(248,249,250);
            border-radius: 5%;
            border-color: darkgray;
            border: 1px solid rgb(210,210,210);
            color: rgb(143,157,171);
            font-size: 25px;
            font-weight: bold;
            margin-right: 20px;
            height:50px;
        }

            #leistungen .owl-prev:hover,
            #leistungen .owl-next:hover,
            #unternehmen .owl-prev:hover,
            #unternehmen .owl-next:hover {
                opacity: 1;
                background-color: lightslategray;
                color: white;
            }

    /*------ Topic ------*/
    .topicwrapper {
        margin: 20px 0 0 0;
    }

    .topicpanel {
        background-color: rgb(248,249,250);
    }

        .topicpanel img {
            width: auto;
            height: 300px;
            object-fit: cover;
            filter: grayscale(30%);
        }

    .topicframe {
        border: 0 solid rgb(220,220,220);
        border-top: none;
        padding: 35px 15px 10px 0;
    }

        .topicframe:hover {
            cursor: grab;
        }

    .topicframetxt {
        height: 265px;
    }

        .topicframetxt ul {
            font-family: 'nunito sans', sans-serif;
            font-weight: 500;
            font-size: 0.85em;
            padding: 0 0 0 30px;
        }

        .topicframetxt li {
            line-height: 1.4;
        }

    .topicframe h6 {
        font-family: 'nunito sans', sans-serif;
        font-weight: 500;
        font-size: 1em;
        text-align: left;
        line-height: 1.25;
        margin: 20px 10px 10px 0;
        padding: 3px 0 3px 10px;
        color: #404040;
        border-left: 4px solid gold;
    }

    .topicstatement {
        font-family: 'Source Sans Pro', sans-serif;
        text-align: center;
        border: 1px solid rgb(220,220,220);
        border-radius: 10px;
        padding: 15px 25px 15px 25px;
    }

    .topicframe p {
        font-family: 'nunito sans', sans-serif;
        font-weight:500;
        font-size: 0.85em;
        text-align: left;
        hyphens: auto;
        padding: 15px 15px 0 14px;
    }

    .topic {
        font-family: 'nunito sans', sans-serif;
        font-weight: 300;
        font-size: 0.85em;
        border-left: 4px solid gold;
        padding: 14px 0 16px 0;
        background-color: lightslategrey;
        color: white;
        width: 210px;
        text-align: center;
        border: none;
    }

    .topicpagination {
        position: relative;
        bottom: 250px;
        float:right;
        margin-right: 15px;
        padding: 10px;
        font-size: 1.8em;
        color: #303030;
        border-bottom: 1px solid rgb(210,210,210);
    }

        .topicpagination span {
            font-size: 0.5em;
            color: gray
        }

    .topic-sidenav {
        display: none;
    }

    /*KOSTRA-DWD*/
    .id_kostra {
        margin: 0 10% 0 10%;
        padding: 100px 0 0 0;
    }

        .id_kostra h1 {
            margin: 0 0 0 0;
            padding: 0 0 0 0;
            font-size: 2.0em;
        }

        .id_kostra h2 {
            padding: 15px 0 0 0;
            font-stretch: normal;
            font-size: 1.1em;
        }

    .cr {
        background-color: none;
        padding: 2px 2px 2px 0;
        height: 26px;
        margin: 1px;
        font-size: 0.85em;
    }

    .c0 {
        padding: 4px;
        background-color: lightgray;
        width: 10%;
        float: left;
        text-align: right;
    }

    .cx {
        padding: 4px;
        background-color: whitesmoke;
        width: 8%;
        float: left;
        text-align: right;
    }

    #googleMap {
        margin: 10px 10% 10px 10%;
        height: 400px;
    }

    /*Tableblock*/
    .tableblock {
        font-family: 'Segoe UI';
        height: auto;
        margin: 0 10% 0 10%;
        padding: 0;
    }

        .tableblock h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

        .tableblock table {
            margin-top: 15px;
            font-size: 12px;
            color: #2A2A2A;
            border: 1px solid #BDBDBD;
            border-collapse: collapse;
            text-align: left
        }

        .tableblock th {
            background-color: #EDEDED;
        }

        .tableblock th, td, tr {
            border: 1px solid #BDBDBD;
            padding: 8px;
        }


    /*Newsblock*/
    .newsblock {
        display: flex;
        align-items: flex-start;
        font-family: 'Segoe UI';
        font-size: 16px;
        height: auto;
        margin: 0;
        padding: 10px;
    }

        .newsblock a {
            color: steelblue;
            font-weight: 400;
        }

            .newsblock a:hover {
                text-decoration: underline;
            }

    .newstext {
        flex: 1;
    }

        .newstext h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

    .newsblock-left {
        background-color: none;
    }

        .newsblock-left img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: left;
        }

    .newsblock-right {
        background-color: whitesmoke;
    }

        .newsblock-right img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: right;
        }

    .newsblock-height {
        height: auto;
    }


    .newsblock table {
        margin-top: 15px;
        font-size: 12px;
        color: #2A2A2A;
        border: 1px solid #BDBDBD;
        border-collapse: collapse;
        text-align: left
    }

    .newsblock th {
        background-color: #EDEDED;
    }

    .newsblock th, td, tr {
        border: 1px solid #BDBDBD;
        padding: 8px;
    }

    /*Impressum*/
    #impressum {
        margin: 80px 10% 0 10%;
        padding: 0 0 0 0;
    }

        #impressum h3 {
            font-weight: normal;
            padding: 2em 0 1.2em 0;
        }

        #impressum p {
            text-align: left;
            font-size: 0.75em;
            padding: 0 0 0 0;
        }

    /*AGB, Datenschutz*/
    #agb,
    #datenschutz {
        margin: 70px 10% 0 10%;
        color: rgb(80,80,80);
    }

        #agb h3,
        #datenschutz h3 {
            font-weight: normal;
            padding: 2em 0 0.8em 0;
        }

        #agb h4,
        #datenschutz h4 {
            font-weight: normal;
            padding: 0.5em 0 0.7em 0;
        }

        #agb p {
            font-size: 0.75em;
            padding: 0 0 0.4em 0;
            text-align: left;
        }

        #datenschutz p {
            font-size: 0.75em;
            padding: 0 0 0 0px;
            text-align: left;
        }

        #datenschutz ol {
            font-size: 0.75em;
            padding: 0 30px 0 30px;
            list-style-type: upper-roman;
        }

            #datenschutz ol p {
                font-size: 1.0em;
            }

            #datenschutz ol li {
                padding: 0 0 10px 0;
            }

        #datenschutz ul {
            padding-left: 15px;
            padding-top: 5px;
            padding-bottom: 10px;
        }

            #datenschutz ul li {
                font-size: 0.75em;
                line-height: 1.75;
                list-style: disc;
            }

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width:1200px) {

    header {
        height: 80px;
        padding: 0 20% 10px 20%;
    }

    footer {
        margin-left: 20%;
        margin-right: 20%;
        height: 150px;
        margin-top: 30px;
        border-top: 1px solid rgb(220,220,220);
    }

        footer p {
            font-size: 0.7em;
        }

        footer a {
            padding: 10px 10px 10px 10px;
        }

            footer a:hover {
                background-color: #e2e6e9;
            }

    /*Logo*/
    .logo {
        background-color: #FFD700;
        float: left;
        height: 32px;
        width: 22px;
        margin: 1.2em 0.6em 1em 0;
    }

    .logo-main-txt {
        font-size: 1.5em;
        padding: 1.2em 0 0 0;
    }

    .logo-sub-txt {
        display: block;
        font-size: 0.8em;
    }

    /*Intro-Kasten im owl-carousel*/
    .id_article {
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 85px;
        padding-top: 330px;
        height: 330px;
        position: relative;
        z-index: 1;
    }

        .id_article:before {
            background-color: rgb(0,0,0);
            content: "";
            height: 100%;
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: -1;
        }

    .id_article-middle {
        height: 80px;
        background-color: slategray;
        margin-top:30px;
        padding:90px;
    }

        .id_article h3 {
            font-weight:300;
            font-size: 3.8em;
        }

        .id_article h4 {
            font-weight:200;
            font-size: 2.3em;
        }

    .id_titel-en {
        font-family: 'Lexend Mega', sans-serif;
        font-size: 0.6em;
        padding-bottom: 5px;
    }

    .id_titelstatement-left,
    .id_titelstatement-right,
    .id_titelstatement-center,
    .id_announcement-left {
        color: lightgray;
        margin-left: 20%;
        margin-right: 20%;
        padding-left: 5px;
        padding-right: 5px;
    }

    .id_titelstatement-left,
    .id_announcement-left {
        border-left: 5px solid gold;
        text-align: left;
    }

    .id_titelstatement-right {
        border-right: 5px solid gold;
        text-align: right;
    }

    .id_titelstatement-center {
        text-align: center;
    }

    .id_titelstatement-center-border {
        border-top: solid;
        border-color: gold;
        border-width: 5px;
        width: 250px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 8px;
    }

    .id_announcement-left {
        padding-bottom: 10px;
    }

        .id_announcement-left a {
            font-size: 0.9em;
            color: rgb(70,70,70);
            background-color: none;
            padding: 10px 10px 10px 10px;
            border: 1px solid rgb(70,70,70);
            border-radius: 5px;
            margin-bottom: 15px;
        }

            .id_announcement-left a:hover {
                background-color: rgb(80,80,80);
                Color: white;
                transition: 0.2s;
            }

        .id_announcement-left img {
            position: relative;
            top: 0;
            left: 0;
            width: 50px !important;
            height: 50px !important;
            padding-bottom: 15px;
            margin-left: 0;
            margin-right: 0
        }

    /*Produkt-Kasten im owl-carousel*/
    .id_product {
        background: rgb(223,223,223);
        background: linear-gradient(320deg, rgba(223,223,223,1) 0%, rgba(255,255,255,1) 100%);
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-origin: padding-box;
        margin-top: 85px;
        padding-top: 330px;
        height: 330px;
        position: relative;
        z-index: 1;
    }

        .id_product h3 {
            font-weight: 300;
            font-size: 2.4em;
            color: rgb(70,70,70);
        }

        .id_product h4 {
            font-weight: 200;
            font-size: 1.6em;
            color: rgb(70,70,70);
            margin-bottom: 40px;
        }

    .id_productimg {
        margin-left:20%;
        margin-right:20%;
    }

        .id_productimg img {
            position: absolute;
            margin: 5% 20% 0 50%;
            width: 30% !important;
            height: auto !important;
        }



    #klindworth {
        position: absolute;
        left: 20%;
        bottom: 10px;
        font-size: 0.6em;
        font-weight: lighter;
        color: rgb(160,160,160);
    }

    /*Claim*/
    /*Statement unterhalb Owl-Carrousel*/
    .id_claim {
        column-count: 2;
        margin-top:35px;
        margin-left: 20%;
        margin-right: 20%;
        column-gap: 50px;
        column-rule-style: solid;
        column-rule-width: 1px;
        column-rule-color: rgb(210,210,210);
    }

        .id_claim h1 {
            font-size: 2em;
            text-align: center;
            padding: 10px 0 20px 0;
            width: auto;
        }


        .id_claim p {
            padding: 0 0 10px 0;
        }

    .id_claim-left p {
        text-align: left;
        font-size: 0.90em;
        hyphens:none;
    }

    .id_claim-center p {
        text-align: center;
        font-size: 0.90em;
        hyphens: none;
    }


    .id_claim-dist {
        padding-bottom:30px;
    }


    .id_claim ul {
        margin: 0;
        padding-bottom: 30px;
        padding-left: 15px;
    }

    .id_claim li {
        font-size: 0.9em;
        line-height: 1.3;
        padding-bottom: 2px;
    }

    .id_column {
        margin-left: 40%;
        margin-right: 40%;
    }

    .id_confirmation {
        margin-top: 150px;
        border-radius: 50px;
        width: 50px;
        height:50px;
        margin-left: auto;
        margin-right: auto;
        padding:15px;
        background-color: none;
        border: 1px solid #808080;
        color: gold;
    }

    .id_confirmation i {
        font-size:3.0em;
    }

    .id_confirmation p {
        padding: 10px;
        text-align:center;
    }

    .id_produktcode {
        margin-top: 120px;
    }

        .id_produktcode h1 {
            font-size: 2em;
            text-align: center;
        }

        .id_produktcode h2 {
            padding:6px 0 12px 0;
            font-size: 1.4em;
            font-stretch:normal;
            text-align: center;
        }

    .id_produktcode h3 {
        padding: 6px 0 12px 0;
        font-size: 1.4em;
        font-stretch: normal;
        font-weight: normal;
        color: #404040
    }

        .id_produktcode-h3l h3 {
            text-align: center;
        }

        .id_produktcode-h3r h3 {
            text-align: center;
        }

        .id_imgleft img {
            float:right;
            margin-left:80px;
            margin-right:20px;
            margin-bottom:35px;
        }

    .id_imgright img {
        float: left;
        margin-right: 80px;
        margin-left:20px;
        margin-bottom: 35px;
    }

    .id_offer {
        font-size: 0.9em;
        color: rgb(70,70,70);
        background-color: rgb(250,250,250);
        text-align:center;
        padding: 15px 10px 15px 10px;
        border: 1px solid rgb(70,70,70);
        border-radius: 5px;
        width:600px;
        margin: 15px auto 15px auto;
    }

    .id_numbersequence {
        font-size:10px;
        color:white; 
        background-color:red; 
        padding:6px 6px 6px 6px;
        width:10px;
        height:10px;
        border-radius:30px; 
        text-align:center; 
        float:left;
        font-weight:bold;
        margin-right:10px;
    }

    section a {
        color: rgb(50,50,50);
        border: 1px solid rgb(50, 50,50);
        padding: 15px;
        float: right;
        margin-top: 50px
    }

        section a:hover {
            background-color: rgb(140, 140, 140);
            color: white;
            opacity: 0.35;
        }

    /* Accordion aus w3school */
    .accordionwrapper {
        width: 60%;
        margin: 0 auto 0 auto;
        padding: 0 0 0 0;
        border-bottom: 1px solid rgb(220,220,220);
    }

        .accordionwrapper h1 {
            margin: 0;
            padding: 0 0 20px 0;
            font-size:2.0em;
        }

    .accordion {
        font-weight: 300;
        font-size: 1.1em;
        width: 100%;
        background-color: white;
        outline: none;
        border: none;
        border-top: 1px solid rgb(220,220,220);
        color: #444;
        cursor: pointer;
        padding: 12px 5px 0 0;
        text-align: left;
        transition: 0.4s;
    }

        .active_acc, .accordion:hover {
            background-color: white;
        }

        .accordion botton {
            background-color: white;
            cursor: pointer;
            padding: 14px 16px;
            transition: 0.2s;
        }

        .accordion:after {
            content: '\002B';
            color: #777;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }

    .active_acc::after {
        content: "\2212";
    }

    .panel {
        padding: 8px 70px 0 2px;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }

    .panel-np {
        padding: 8px 0 0 0;
    }

        .panel ul {
            padding-bottom: 10px;
            padding-left: 15px;
        }

        .panel li {
            font-size: 0.9em;
            line-height: 1.3;
            padding-bottom: 2px;
        }

        .panel p {
            padding-bottom: 2px;
            text-align: left;
            font-size: 0.90em;
        }

     .panelspacer {
        padding-top: 15px;
        padding-bottom: 15px
    }

    /* Produktkästchen auf den Übersichtsseiten */
    .productbox {
        margin: 10px 10px 10px 0;
        float: left;
        width: 265px;
        background-color: rgb(248,249,250);
        border: 1px solid rgb(200,200,200);
        border-radius: 2px;
    }

        .productbox h2 {
            padding: 10px 50px 10px 10px;
            font-stretch: normal;
            font-size: 1.1em;
            font-weight: 500;
            color: rgb(80,80,80);
            height:40px;
        }

        .productbox p {
            text-align: left;
            font-size: 0.90em;
            margin: 10px 10px 10px 10px;
            height: 180px;
            border-bottom: 1px solid rgb(200,200,200)
        }

        .productbox a {
            position: relative;
            float: right;
            margin: 10px 10px 10px 0;
            padding: 8px 8px 8px;
            font-size: 0.90em;
            font-stretch: normal;
            background-color: whitesmoke;
            border: 1px solid rgb(200,200,200);
            border-radius: 2px 2px 2px 2px;
        }

            .productbox a:hover {
                background-color: rgb(80,80,80);
                border: 1px solid rgb(80,80,80);
                color: #fff;
                transition: 0.3s;
            }

        .productbox img {
            margin: 10px 10px 0 10px;
            height: 32px;
        }

    .productboxtipp {
        font-size: 0.80em;
        margin: 10px 0 0 0;
        padding: 5px 5px 5px 8px;
        float: right;
        background-color: #EEDC82;
        border: 1px solid rgb(200,200,200);
        border-right: 0;
        border-radius: 5px 0px 0px 5px;
    }

    .productboxprice {
        margin: 0 0 0 10px;
        font-size: 0.9em;
    }

        .productboxprice span {
            font-size: 0.75em;
        }

    .productboxpricesub {
        margin: 5px 0 0 10px;
        font-size: 0.75em;
        font-style: italic;
    }

    /* Bestellformular */
    .id_form_txt {
        font-size: 0.90em;
    }

        .id_form_txt p {
            font-size: 1em;
            padding: 8px 5px 0 5px;
        }

        .id_form_txt fieldset {
            font-size: 1em;
            border: 1px solid lightgray;
            margin: 15px 0 15px 0;
            padding: 0 5px 15px 10px;
        }

        .id_form_txt input {
            font-size: 1em;
            width: auto;
            border-radius:2px;
            padding: 0 5px 0 5px;
        }

        .id_form_txt label {
            font-size: 0.9em;
            float: left;
            background-color: whitesmoke;
            margin: 11px 8px 0 0;
            padding: 8px 0 6px 6px;
            width: 200px;
        }

    .id_form_agb {
        width: 100%;
        background-color: none;
    }

        .id_form_agb a {
            color: #000;
            text-decoration: underline
        }

        .id_form_agb input {
            margin: 0 5px 0 8px;
            width: 15px;
            float: left;
            border-radius: 2px;
        }

        .id_form_agb label {
            background-color: inherit;
            padding: 0 0 0 0;
            margin: 6px 5px 5px 5px;
            line-height: 1.5;
            width: 450px;
        }

    .id_form_txt button {
        float: right;
        font-size: 1em;
        margin: 0 8px 15px 0;
        padding: 8px;
        background-color: whitesmoke;
        border: 1px solid rgb(200,200,200);
        border-radius: 2px 2px 2px 2px;
    }

        .id_form_txt button:hover {
            background-color: rgb(80,80,80);
            border: 1px solid rgb(80,80,80);
            color: #fff;
            transition: 0.3s;
        }

    .id_licensecounter {
        margin: 5px 0 0 0;
        padding: 5px;
        float: left;
    }

        .id_licensecounter input {
            float: left;
            width: 30px;
            height: 28px;
            text-align: center;
            padding: 0;
            margin: 0 5px 0 5px;
            border-radius: 2px;
        }

        .id_licensecounter button {
            float: left;
            width: 30px;
            height: 30px;
            text-align: center;
            padding: 0;
            margin: 0;
        }

    .id_anrede {
        margin: 0 0 0 0;
        height: 30px;
        background-color: none;
    }

        .id_anrede label {
            background-color: inherit;
            margin: 8px 5px 0 0;
            float: left;
            width: auto;
        }

        .id_anrede input {
            float: left;
            width: 15px;
            text-align: center;
            padding: 0;
            margin: 8px 5px 0 0;
            border-radius: 2px;
        }

    /*Unternehmen, Leistungen*/

    #leistungen {
        margin-top:150px;
        margin-bottom: 0;
    }

        #unternehmen h1, #leistungen h1 {
            font-family: 'nunito sans', sans-serif;
            font-size: 2em;
            margin: 60px 20% 0 20%;
            padding: 10px 0 20px 0;
            text-align: center;

        }

    /*------ Unternehmen / Leistungen ----------------------------*/

        #leistungen .owl-theme,
        #unternehmen .owl-theme {
            margin-left: 20%;
            margin-right: 20%;
            width: auto;
        }

        #leistungen .owl-nav,
        #unternehmen .owl-nav {
            position: relative;
            top: -375px;
            left: -3%;
        }

    #unternehmen .owl-prev,
    #leistungen .owl-prev {
        position: absolute;
        top: -82px;
        left: -135px;
        float: left;
        transition:none;
   }

    #unternehmen .owl-next,
    #leistungen .owl-next {
        position: absolute;
        top: -82px;
        left:-80px;
        float: left;
        transition:none;
    }

    #leistungen .owl-prev,
    #leistungen .owl-next,
    #unternehmen .owl-prev,
    #unternehmen .owl-next {
        background-color: rgb(248,249,250);
        border-radius: 5%;
        border-color:darkgray;
        border: 1px solid rgb(210,210,210);
        color:rgb(143,157,171);
        font-size: 25px;
        font-weight:bold;
        transition: 0.3s;
        margin-right: 20px;
    }

        #leistungen .owl-prev:hover,
        #leistungen .owl-next:hover,
        #unternehmen .owl-prev:hover,
        #unternehmen .owl-next:hover {
            opacity:1;
            background-color: lightslategray;
            color:white;
        }

        /*------ Topic -----------------------*/
        .topicwrapper {
            margin: 25px 0 0 0;
        }

    .topicpanel {
        background-color: rgb(248,249,250);
    }

        .topicpanel img {
            height: 300px;
            filter: grayscale(30%);
            border: 1px solid rgb(210,210,210);
        }

    .topicframe {
        border: 0 solid rgb(220,220,220);
        border-top: none;
        padding: 35px 10px 10px 0;
    }

        .topicframe:hover {
            cursor: grab;
        }

    .topicframetxt {
        height: 285px;
    }

        .topicframetxt ul {
            font-family: 'nunito sans', sans-serif;
            font-weight: 500;
            font-size: 0.9em;
            padding: 0 0 0 32px;
        }

        .topicframetxt li {
            line-height: 1.4;
        }

    .topicframe h6 {
        font-family: 'nunito sans', sans-serif;
        font-weight: 500;
        font-size: 1.4em;
        text-align: left;
        line-height: 1.25;
        margin: 40px 10px 10px 0;
        padding: 3px 0 3px 10px;
        color: #404040;
        border-left: 5px solid gold;
    }

    .topicstatement {
        text-align: center;
        border: 1px solid rgb(220,220,220);
        border-radius: 10px;
        padding: 15px 15px 15px 15px;
    }

    .topicframe p {
        font-family: 'nunito sans', sans-serif;
        font-weight:500;
        text-align: left;
        hyphens: auto;
        padding: 15px 15px 0 15px;
    }

    .topic {
        font-family:'nunito sans', sans-serif;
        font-weight:300;
        font-size: 15px;
        padding: 14px 0 16px 0;
        background-color:lightslategrey;
        color:white;
        width:220px;
        text-align:center;
        border:none;
        }

    .topicpagination {
        position: relative;
        bottom: 250px;
        float: right;
        margin-right: 10%;
        padding: 10px;
        font-size: 2.8em;
        color: #303030;
        border-bottom: 1px solid rgb(210,210,210);
    }

        .topicpagination span {
            font-size: 0.5em;
            color: gray
        }

    .topic-sidenav {
        display: block;
        font-family: 'Source Sans Pro', sans-serif;
        position: relative;
        float: left;
        margin: 0;
        background-color: none;
        border-top: 1px solid rgb(210,210,210);
        border-bottom: 1px solid rgb(210,210,210);
        width: 17%;
        padding: 5px 0 5px 0;
        transition: 0.6s;
    }

        .topic-sidenav ul {
            line-height: 1.6;
            list-style: none;
            height: 140px;
        }

        .topic-sidenav li {
            font-size: 1em;
            text-align: right;
                
        }

     /*KOSTRA-DWD*/
    .id_kostra {
        margin: 0 20% 0 20%;
        padding: 120px 0 0 0;
    }

    .id_kostra h1 {
        margin: 0 0 0 0;
        padding: 0 0 0 0;
        font-size:2.0em;
    }

        .id_kostra h2 {
            padding: 15px 0 0 0;
            font-stretch: normal;
            font-size: 1.1em;
        }

    .panel-dwd {
        padding: 8px 0 0 0;
        background-color: white;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.2s ease-out;
    }

    .cr {
        background-color:red;
        margin:2px;  
        padding:0;
        height:auto;
        width:100%;
        font-size:0.9em;
    }

    .c0 {
        background-color: lightgray;
        margin:0 0 1px 0;
        padding: 4px;
        width: 12%;
        float: left;
        text-align: right;
    }

    .cx {
        background-color: whitesmoke;
        margin: 0 0 1px 0;
        padding: 4px;
        width: 8%;
        float: left;
        text-align: right;
    }

    #googleMap {
        margin: 20px 20% 20px 20%;
        height: 400px;
    }

    /*Tableblock*/
    .tableblock {
        font-family: 'Segoe UI';
        height: auto;
        margin: 0 20% 0 20%;
        padding: 0;
    }
    .tableblock h2 {
        font-stretch: normal;
        font-weight: 400;
        padding: 0;
    }
    
    .tableblock table {
            margin-top: 15px;
            font-size: 12px;
            color: #2A2A2A;
            border: 1px solid #BDBDBD;
            border-collapse: collapse;
            text-align: left
        }

        .tableblock th {
            background-color: #EDEDED;
        }

        .tableblock th, td, tr {
            border: 1px solid #BDBDBD;
            padding: 8px;
        }


    /*Newsblock*/
    .newsblock {
        display: flex;
        align-items: flex-start;
        font-family: 'Segoe UI';
        font-size: 16px;
        height: auto;
        margin: 0;
        padding: 10px;
    }

        .newsblock a {
            color: steelblue;
            font-weight: 400;
        }

            .newsblock a:hover {
                text-decoration: underline;
            }

    .newstext {
        flex: 1;
    }

        .newstext h2 {
            font-stretch: normal;
            font-weight: 400;
            padding: 0;
        }

    .newsblock-left {
        background-color: none;
    }

        .newsblock-left img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: left;
        }

    .newsblock-right {
        background-color: whitesmoke;
    }

        .newsblock-right img {
            padding: 10px;
            width: 50%;
            height: auto;
            float: right;
        }

    .newsblock-height {
        height: auto;
    }

    /*Impressum*/
    #impressum {
        margin: 80px 20% 0 20%;
        padding: 0 0 0 0;
    }

        #impressum h3 {
            font-weight: normal;
            padding: 2em 0 1.2em 0;
        }

        #impressum p {
            text-align: left;
            font-size: 0.75em;
            padding: 0 0 0 0;
        }

    /*AGB, Datenschutz*/
    #agb,
    #datenschutz {
        margin: 80px 20% 0 20%;
        color: rgb(80,80,80);
    }

        #agb h3,
        #datenschutz h3 {
            font-weight: normal;
            padding: 2em 0 0.8em 0;
        }

        #agb h4,
        #datenschutz h4 {
            font-weight: normal;
            padding: 0.5em 0 0.7em 0;
        }

        #agb p {
            font-size: 0.75em;
            padding: 0 0 0.4em 0;
            text-align: left;
        }

        #datenschutz p {
            font-size: 0.75em;
            padding: 0 0 0 0px;
            text-align: left;
        }

        #datenschutz ol {
            font-size: 0.75em;
            padding: 0 30px 0 30px;
            list-style-type: upper-roman;
        }

            #datenschutz ol p {
                font-size: 1.0em;
            }

            #datenschutz ol li {
                padding: 0 0 10px 0;
            }

        #datenschutz ul {
            padding-left: 15px;
            padding-top: 5px;
            padding-bottom: 10px;
        }

            #datenschutz ul li {
                font-size: 0.75em;
                line-height: 1.75;
                list-style: disc;
            }

 

    
    /*Third Parties =============================================== */
    /* Font Awesome Social Icons*/
    /* Style all font awesome icons */
    .fa {
        padding: 5px;
        font-size: 20px;
        width: 20px;
    }
}


@media print {

    @page{margin:30px 30px 30px 50px;}


    .id_kostra h1 {
        margin: 80px 0 0 0;
        font-size: 1.3em;
        color: rgb(80,80,80)
    }

    .id_kostra h2 {
        padding: 2px 0 10px 0;
        font-size: 1.0em;
        font-stretch: normal;
        color: rgb(80,80,80)
    }

    .cr {
        background-color: red;
        margin: 1px;
        padding: 0;
        height: auto;
        width: 100%;
        font-size: 0.6em;
    }

    .c0 {
        background-color: lightgray;
        margin: 0 0 1px 0;
        padding: 4px 4px 4px 0;
        width: 12%;
        float: left;
        text-align: left;
    }

    .cx {
        background-color: whitesmoke;
        margin: 0 0 1px 0;
        padding: 4px;
        width: 8%;
        float: left;
        text-align: right;
    }

    .accordion {
        background-color: white;
        color: #224B9A;
        font-size:1em;
        border: none;
        padding: 10px 0 5px 0;
    }



    header {
        height: 60px;
    }

    /*Logo*/
    .logo {
        background-color: #FFD700 !important;
        -webkit-print-color-adjust: exact;
        float: left;
        height: 20px;
        width: 12px;
        margin: 0.8em 0.2em 1em 0;
    }

    .logo-main-txt {
        font-size: 1.0em;
        padding: 1.2em 0 0 0;
    }

    .logo-sub-txt {
        display: block;
        font-size: 0.6em;
    }

}