/*Hier dürfen in Style-Informationen die wir immer wieder verwenden oder Standard sind.*/

*, a {
    padding: 0px;
    margin: 0px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-overflow: ellipsis;
}

.boxShadow {
    -moz-box-shadow: black 0px 0px 10px 1px;
    -webkit-box-shadow: black 0px 0px 10px 1px;
    box-shadow: black 0px 0px 10px 1px;
}

    .boxShadow.hover {
        -moz-transition: box-shadow ease-in-out .3s;
        -o-transition: box-shadow ease-in-out .3s;
        -webkit-transition: box-shadow ease-in-out .3s;
        transition: box-shadow ease-in-out .3s;
    }

        .boxShadow.hover:hover {
            -moz-box-shadow: black 2px 2px 10px 3px;
            -webkit-box-shadow: black 2px 2px 10px 3px;
            box-shadow: black 2px 2px 10px 3px;
        }


h1, h2, h3, h4, h5, h6, p, span, label {
    overflow: hidden;
    padding: 2.5px 5px;
}

input[type=submit], input[type=button], button {
    padding: 2px 5px;
}

.article-detail-infotext h1, .article-detail-infotext h2, .article-detail-infotext h3, .article-detail-infotext h4, .article-detail-infotext h5, .article-detail-infotext h6, .article-detail-infotext p, .article-detail-infotext span, .article-detail-infotext label {
    overflow: hidden;
    padding: 0px;
}

.article-detail-producerinfo, .article-detail-producerinfo > p {
    display: flex;
    -ms-flex-flow: column nowrap;
    -webkit-flex-flow: column nowrap;
    flex-flow: column nowrap;
}

    .article-detail-producerinfo > *, .article-detail-producerinfo > p > * {
        -ms-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    .article-detail-producerinfo > p > span {
        padding:0px;
    }

    .article-detail-producerinfo *:empty {
        display: none;
    }

    .pager {
        display: flex;
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-justify-content: center;
        justify-content: center;
    }

    .pager img {
        height: 32px;
        width: 32px;
    }

    .pager a {
        padding: 2.5px;
        color: black;
        display: block;
        line-height: 32px;
    }

        .pager a:hover {
            color: darkgrey;
        }

        .pager a.selected {
            color: white;
        }





/*Artikel-Detail Ansicht*/

.article-detail {
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
}

    .article-detail > * {
        -ms-flex: 2 100%;
        -webkit-flex: 2 100%;
        flex: 2 100%;
    }

    .article-detail > section {
        padding: 10px;
        border-top: 1px solid black;
    }

    .article-detail > *:nth-child(1) {
        order: 1;
    }

    .article-detail > *:nth-child(2) {
        order: 1;
    }

    .article-detail-images-wrapper, .article-detail > section:nth-child(3) {
        /*-ms-flex: 1 50%;
        -webkit-flex: 1 50%;
        flex: 1 50%;*/
        -ms-flex: 1 auto;
        -webkit-flex: 1 auto;
        flex: 1 auto;
        order: 2;
    }

    .article-detail > *:nth-child(4) {
        order: 4;
    }

    .article-detail > *:nth-child(5) {
        order: 5;
    }

    .article-detail > * {
        order: 999;
    }

    .article-detail > hgroup > h1 {
        font-size: 1.5em;
    }

.article-detail-description h2 {
    font-size: 1.17em;
}

.article-detail-infos {
    list-style: none;
}

.article-detail-retailprice {
    color: red;
    text-decoration: line-through;
}

.article-detail-storage {
    padding: 2.5px 5px;
}

    .article-detail-storage:empty {
        display: none;
    }

.article-detail-images {
    display: block;
    /*max-width: 50vw;*/
    min-width: 300px;
    min-height: 50vh;
    overflow: hidden;
    position: relative;
}

    .article-detail-images li {
        /*display: block;*/
        display: flex;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-align-items: center;
        align-items: center;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        /*display: none;*/
        opacity: 0;
        -moz-transition: opacity ease-in-out 1s;
        -o-transition: opacity ease-in-out 1s;
        -webkit-transition: opacity ease-in-out 1s;
        transition: opacity ease-in-out 1s;
        z-index: 0;
    }

        .article-detail-images li.selected {
            /*display: block;*/
            opacity: 1;
            z-index: 10;
        }

    .article-detail-images img {
        max-width: 100%;
        max-height: 100%;
        min-height: 1px;
        min-width: 1px;
        display: block;
        /*margin: 0px auto;*/
    }




.article-detail-nummer::before {
    content: 'Artikel-Nr.: ';
}

.article-detail-images-go-right, .article-detail-images-go-left {
    display: block;
    cursor: pointer;
    background-color: white;
    width: 32px;
    height: 32px;
    border-radius: 16px;
    position: absolute;
    top: 45%;
    -moz-box-shadow: black 1px 1px 10px 1px;
    -webkit-box-shadow: black 1px 1px 10px 1px;
    box-shadow: black 1px 1px 10px 1px;
    z-index: 100;
    -moz-transition: box-shadow ease-in-out .2s,opacity ease-in-out .2s;
    -o-transition: box-shadow ease-in-out .2s,opacity ease-in-out .2s;
    -webkit-transition: box-shadow ease-in-out .2s,opacity ease-in-out .2s;
    transition: box-shadow ease-in-out .2s,opacity ease-in-out .2s;
    border: 1px solid black;
    opacity: 0.6;
}

    .article-detail-images-go-right:hover, .article-detail-images-go-left:hover {
        -moz-box-shadow: black 3px 3px 15px 1px;
        -webkit-box-shadow: black 3px 3px 15px 1px;
        box-shadow: black 3px 3px 15px 1px;
        opacity: 1;
    }

    .article-detail-images-go-right:active, .article-detail-images-go-left:active {
        -moz-box-shadow: black 0px 0px 10px 0px inset;
        -webkit-box-shadow: black 0px 0px 10px 0px inset;
        box-shadow: black 0px 0px 10px 0px inset;
        opacity: 1;
    }


.article-detail-images-go-left {
    left: 15px;
}

.article-detail-images-go-right {
    right: 15px;
}

.article-detail-images-wrapper {
    position: relative;
}


/*.article-detail-addtoshoppingcart {
    padding: 5px 5px;
    border: 1px solid black;
    line-height: 1em;
}*/

.article-detail-addtoshoppingcart {
    padding: 10px !important;
    /*background-color: black;
    color: white;*/
    text-transform: uppercase;
    -moz-box-shadow: black 1px 1px 10px 1px;
    -webkit-box-shadow: black 1px 1px 10px 1px;
    box-shadow: black 1px 1px 10px 1px;
    z-index: 100;
    -moz-transition: box-shadow ease-in-out .2s;
    -o-transition: box-shadow ease-in-out .2s;
    -webkit-transition: box-shadow ease-in-out .2s;
    transition: box-shadow ease-in-out .2s;
    border: 1px solid white;
    outline: none;
}

    .article-detail-addtoshoppingcart:hover {
        -moz-box-shadow: black 3px 3px 15px 1px;
        -webkit-box-shadow: black 3px 3px 15px 1px;
        box-shadow: black 3px 3px 15px 1px;
    }

    .article-detail-addtoshoppingcart:active {
        -moz-box-shadow: white 0px 0px 15px 1px inset;
        -webkit-box-shadow: white 0px 0px 15px 1px inset;
        box-shadow: white 0px 0px 15px 1px inset;
    }


.article-detail-attributes {
    list-style: none;
    display: flex;
    flex-flow: row wrap;
}

    .article-detail-attributes li:not(:last-child)::after {
        content: '/';
        padding: 0px 2px;
    }

    .article-detail-attributes li {
        display: block;
    }


.article-list-attributes {
    list-style: none;
}

    /*.article-list-attributes li:not(:last-child)::after {

    }*/

    .article-list-attributes li {
        display: block;
    }

input.amount {
    font-size: 1em;
    padding: 5px 10px;
    width: 100%;
    max-width: 100px;
    border: 1px solid black;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    border-radius: 16px;
    /*-moz-box-shadow: black 0px 0px 5px 1px inset;
    -webkit-box-shadow: black 0px 0px 5px 1px inset;
    box-shadow: black 0px 0px 5px 1px inset;*/
    line-height: 1em;
    outline: none;
}

    input.amount:focus {
        -moz-box-shadow: gray 0px 0px 2.5px 1px inset;
        -webkit-box-shadow: gray 0px 0px 2.5px 1px inset;
        box-shadow: gray 0px 0px 2.5px 1px inset;
    }


/*Messagebox*/
.divMessagePlaceholder {
    z-index: 100;
    top: 0px;
    left: 0px;
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
}

.divMessage {
    margin: 20px auto;
    max-width: calc(100% - 40px);
    max-height: calc(100vh - 40px);
    width: 400px;
    min-height: 200px;
    background-color: white;
    -moz-box-shadow: black 0px 0px 10px 1px;
    -webkit-box-shadow: black 0px 0px 10px 1px;
    box-shadow: black 0px 0px 10px 1px;
    position: relative;
    padding: 5px 5px 50px;
}

    .divMessage p {
        max-height: calc(100vh - 130px);
        min-height: 100px;
        overflow-y: auto;
    }

    .divMessage div {
        position: absolute;
        bottom: 0px;
        left: 0px;
        right: 0px;
        padding: 10px;
        background-color: white;
    }

        .divMessage div button {
            padding: 5px 10px;
            float: right;
        }


/*Loading-Screen*/

.shoppingcart-overview .loading-image > div {
    width: 80px;
    height: 80px;
}


.loading-image {
    text-align: center;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: 100;
    background-color: rgba(0,0,0,0.7);
    padding: 20px;
}

body > .loading-image {
    position: fixed;
}

.loading-image > img {
    max-height: 100%;
    max-width: 100%;
    background-color: white;
    border-radius: 100px;
    padding: 10px;
    align-self: center;
}

.loading-image > div > img {
    max-height: 100%;
    max-width: 100%;
    align-self: center;
}

.loading-image > div {
    max-height: calc(100% - 10px);
    max-width: calc(100% - 10px);
    background-color: white;
    border-radius: 100px;
    padding: 10px;
    display: inline-block;
    /*align-self: center;*/
}


.loading-image img {
    -moz-animation-name: loadingRotate;
    -o-animation-name: loadingRotate;
    -webkit-animation-name: loadingRotate;
    animation-name: loadingRotate;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

@keyframes loadingRotate {
    from {
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}



.userinfo-list {
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
}

    .userinfo-list > h2 {
        width: 100%;
    }

    .userinfo-list > article {
        min-width: 300px;
        width: 400px;
        cursor: pointer;
        padding: 5px;
        margin: 15px;
        border: 1px solid black;
        -moz-box-shadow: black 2px 2px 10px 1px;
        -webkit-box-shadow: black 2px 2px 10px 1px;
        box-shadow: black 2px 2px 10px 1px;
        -moz-transition: box-shadow ease-in-out .3s;
        -o-transition: box-shadow ease-in-out .3s;
        -webkit-transition: box-shadow ease-in-out .3s;
        transition: box-shadow ease-in-out .3s;
    }

        .userinfo-list > article:hover {
            -moz-box-shadow: black 4px 4px 10px 3px;
            -webkit-box-shadow: black 4px 4px 10px 3px;
            box-shadow: black 4px 4px 10px 3px;
        }

        .userinfo-list > article div {
            display: flex;
            -ms-flex-flow: row nowrap;
            -webkit-flex-flow: row nowrap;
            flex-flow: row nowrap;
        }



            .userinfo-list > article div > span {
                -ms-flex: 1 100%;
                -webkit-flex: 1 100%;
                flex: 1 100%;
            }

                .userinfo-list > article div > span:first-child {
                    width: 150px;
                    -ms-flex: 1 auto;
                    -webkit-flex: 1 auto;
                    flex: 1 auto;
                }


.secDocs, .userinfo-list {
    padding: 10px;
}

    .secDocs table tr th {
        background-color: black;
        color: white;
        text-align: left;
    }

    .secDocs table tr:nth-child(odd) td {
        background-color: lightgray;
    }

    .secDocs table tr:nth-child(even) td {
        background-color: darkgray;
    }

    .secDocs table tr td, .secDocs table tr th {
        /*border: 1px solid black;*/
        padding: 2px 5px;
    }

    .secDocs table {
        width: 100%;
        border-collapse: collapse;
        border: 1px solid black;
    }

@media (max-width:800px) {
    .secDocs table tr td:nth-child(4), .secDocs table tr th:nth-child(4), .secDocs table tr td:nth-child(5), .secDocs table tr th:nth-child(5) {
        display: none;
    }
}

@media (max-width:500px) {
    .secDocs table tr td:nth-child(2), .secDocs table tr th:nth-child(2) {
        display: none;
    }


    .groupDiv > * {
        width: 100% !important;
    }

    .container-buttons .button, .container-buttons .link-button {
        width: 100% !important;
        -ms-flex: 1 1 100% !important;
        -webkit-flex: 1 1 100% !important;
        flex: 1 1 100% !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }


    .shoppingcart-popup-article-list {
        /*Muss verändert werden da die Buttons in den Container-Buttons sich mnit 100% Breite nicht mehr nebeneinander, sonder untereinander sortieren.*/
        height: calc(100% - 100px);
    }
}




input[type=submit], input[type=button], button {
    padding: 2px 5px;
}


.order-confirm {
    padding: 10px;
}

.container-buttons {
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 5px;
    z-index: 0;
}

    .container-buttons > .button, .container-buttons > .link-button {
        margin: 0px 10px;
    }

.button-without-shadow, .button, .link-button {
    cursor: pointer;
    display: block;
    padding: 10px;
    font-size: 1em;
    line-height: 1em;
    font-weight: bold;
    color: white;
    background: linear-gradient(#6d6d6d,#212121);
    z-index: 100;
    outline: none;
}

    .button-without-shadow[disabled], .button[disabled], .link-button[disabled] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .button-without-shadow:active, .button:active, .link-button:active {
        background: linear-gradient(#212121, #6d6d6d);
    }

.button, .link-button {
    -moz-box-shadow: black 1px 1px 10px 1px;
    -webkit-box-shadow: black 1px 1px 10px 1px;
    box-shadow: black 1px 1px 10px 1px;
    -moz-transition: box-shadow ease-in-out .2s;
    -o-transition: box-shadow ease-in-out .2s;
    -webkit-transition: box-shadow ease-in-out .2s;
    transition: box-shadow ease-in-out .2s;
    border: 1px solid white;
}

    .button:not([disabled]):active, .link-button:not([disabled]):active {
        -moz-box-shadow: white 0px 0px 15px 1px inset;
        -webkit-box-shadow: white 0px 0px 15px 1px inset;
        box-shadow: white 0px 0px 15px 1px inset;
    }


    .button:not([disabled]):hover, .link-button:not([disabled]):hover {
        -moz-box-shadow: black 3px 3px 15px 1px;
        -webkit-box-shadow: black 3px 3px 15px 1px;
        box-shadow: black 3px 3px 15px 1px;
    }

.order-confirm-button, .order-cancel-button {
    padding: 10px !important;
    width: 100%;
    margin-bottom: 10px;
}


.order-addon {
    padding: 10px;
}

    .order-addon > * {
        width: 100%;
    }

    .order-addon textarea {
        height: 150px;
        max-width: 100%;
        max-height: 150px;
    }



.section-regist {
    display: flex;
    flex-flow: column wrap;
    margin: 10px auto 70px;
    padding: 10px;
    border: 1px solid black;
    max-width: 800px;
}

    .section-regist > * {
        /*flex: 1 100%;*/
        flex: 1 1 auto;
        padding: 5px;
    }

        .section-regist > * > label, .groupDiv > * > label {
            display: block;
        }



.divSalesType {
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

    .divSalutation > label, .divSalesType > label {
        width: 40%;
        -ms-flex: 1 auto;
        -webkit-flex: 1 auto;
        flex: 1 auto;
        padding: 2px 5px;
    }


.divSalutation {
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

    .divSalutation > label:first-child {
        width: 100%;
    }

.groupDiv {
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
}

    .groupDiv > *:not(:last-child) {
        padding-right: 5px;
    }

    .groupDiv > * {
        width: 33.3333%;
    }

        .groupDiv > * > * {
            width: 100%;
        }

.divStreet {
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-align-items: stretch;
    align-items: stretch;
}

input[type=password], input[type=text], select {
    padding: 2px 5px;
}

.divStreet label {
    width: 100%;
}



.divStreet input:nth-child(2) {
    -ms-flex: 1 auto;
    -webkit-flex: 1 auto;
    flex: 1 auto;
    margin-right: 2.5px;
}

.divStreet input:nth-child(3) {
    width: 150px;
    margin-right: 2.5px;
    margin-left: 2.5px;
}

.divStreet input:nth-child(4) {
    width: 80px;
    margin-left: 2.5px;
}

.onlyCompany.hidden {
    display: none;
}

#divNewsletter.disable, #divPassword.disable {
    display: none;
}


.userinfo-list > article.activ h2::after {
    content: 'aktiv';
    position: absolute;
    right: 10px;
    top: 10px;
}

.userinfo-list > article.with-container-buttons {
    position: relative;
    padding-bottom: 60px;
}

.userinfo-list > article > .container-buttons {
    position: absolute;
    bottom: 5px;
    left: 5px;
    right: 5px;
    height: 50px;
    z-index: 0;
}


.section-creater > article h2 {
    display: none;
}


/*Artikel-Listung*/
#divList, .section-article-list {
    display: flex; /* or inline-flex */
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
}

    #divList article, .section-article-list article {
        /*height: 400px;*/
        min-height: 400px;
        width: 300px;
        max-width: 300px;
        -webkit-flex-grow: 1;
        flex-grow: 1;
        margin: 20px;
        -moz-box-shadow: #2f4952 0px 0px 10px 1px;
        -webkit-box-shadow: #2f4952 0px 0px 10px 1px;
        box-shadow: #2f4952 0px 0px 10px 1px;
        -moz-transition: -moz-box-shadow ease-in-out .2s;
        -o-transition: box-shadow ease-in-out .2s;
        -webkit-transition: -webkit-box-shadow ease-in-out .2s;
        transition: box-shadow ease-in-out .2s;
        color: black;
    }

        #divList article a:visited, .section-article-list article a:visited, #divList article a, .section-article-list article a {
            color: black;
        }

            #divList article a:hover, .section-article-list article a:hover {
                color: red;
            }

        #divList article:hover, .section-article-list article:hover {
            -moz-box-shadow: #2f4952 2px 2px 15px 2px;
            -webkit-box-shadow: #2f4952 2px 2px 15px 2px;
            box-shadow: #2f4952 2px 2px 15px 2px;
        }

        #divList article a, .section-article-list article a {
            text-decoration: none;
        }

    #divList .article-info, .section-article-list .article-inio {
        padding: 5px;
        /*display: flex;*/
        color: black;
        text-decoration: none;
        display: flex;
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
    }

        #divList .article-info > *, .section-article-list .article-info > * {
            text-align: left;
            text-decoration: none;
            -webkit-flex-grow: 1;
            flex-grow: 1;
            -ms-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            flex: 1 1 auto;
            overflow: visible;
        }

            #divList .article-info > h3, .section-article-list .article-info > h3 {
                -ms-flex: 2 1 100%;
                -webkit-flex: 2 1 100%;
                flex: 2 1 100%;
            }

    #divList .article-image, .section-article-list .article-image {
        background-color: white;
        display: flex;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-align-items: center;
        align-items: center;
    }

    #divList .article-image, #divList .article-info, .section-article-list .article-image, .section-article-list .article-info {
        height: 50%;
        width: 100%;
    }

    #divList article img, .section-article-list article img {
        max-width: 100%;
        max-height: 100%;
        min-width: 1px;
        min-height: 1px;
        /*margin: 0px auto;*/
        display: block;
    }

*[data-requiredfield="1"]::after {
    content: '*';
    color: red;
    font-weight: bold;
    padding: 2.5px 5px;
}


.regist-required-field-info {
    font-weight: bold;
    color: red;
}


.category li[data-submenu="1"] > img {
    cursor: pointer;
}


/*Nur Internet Explorer, maximale Breite da sonst über den Rand hinaus geht, Hotfix über Media Queries, nicht schön gelöst - gegebenenfalls nochmal anpassen*/
@media only screen and (min-width: 901px) and (-ms-high-contrast: active), only screen and (min-width: 901px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 68vw;
    }
}

@media only screen and (min-width: 1280px) and (-ms-high-contrast: active), only screen and (min-width: 1280px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 75vw;
    }
}

@media only screen and (min-width: 1790px) and (-ms-high-contrast: active), only screen and (min-width: 1790px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 65vw;
    }
}

@media only screen and (min-width: 2070px) and (-ms-high-contrast: active), only screen and (min-width: 2070px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 55vw;
    }
}

@media only screen and (min-width: 2450px) and (-ms-high-contrast: active), only screen and (min-width: 2450px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 45vw;
    }
}

@media only screen and (min-width: 3000px) and (-ms-high-contrast: active), only screen and (min-width: 3000px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 35vw;
    }
}

@media only screen and (min-width: 3850px) and (-ms-high-contrast: active), only screen and (min-width: 3850px) and (-ms-high-contrast: none) {
    .article-listing {
        max-width: 28vw;
    }
}

/*Nur Internet-Explorer, Setzung der Navigation auf 300px Breite, da die Navigation auf der linken Seite sonst überlappt und Content verschwindet (Kasse / Adressen etc). Klappt bei anderen Browsern nur nicht bei IE*/
/*Zusätzlich Setzen der Breite auf 100% für betroffene Elemente, haben sich ebenfalls nach rechts aus dem Bild verschoben*/
@media only screen and (-ms-high-contrast: active), only screen and (-ms-high-contrast: none) {
    #navCategory > ul {
        max-width: 300px;
    }

    .section-content {
        width: 100%;
    }

    #cph_ContentContent_ulImages {
        width: 100%;
    }

    .article-detail-description {
        width: 50%;
    }
}

/*Setzung einer maximalen breite, da bei vielen langen Überschriften (h3 Artikelansicht) der Text unter dem Bild stand und die Zoom Einstellung somit nicht möglich war // alle Browser außer IE; Zerschiesst sonst Darstellung, hier klappts auch ohne die CSS Erweiterung*/
@supports not (-ms-high-contrast: none) {
    @media only screen and (min-width: 901px) {
        .article-detail-description {
            max-width: 50%;
        }
    }
}

/*Werbe-Text*/
.section-promotionaltext:empty {
    display: none;
}

.section-promotionaltext {
    display: block;
    background: #2f4952;
    padding: 10px;
    color: white;
}

.info.important {
    font-weight: bold;
    color: red;
    background-color: white;
}