/* 4k MEDIA */

@media screen and (min-width: 3000px){
    /*.container-account {
        font-size: 1.5rem !important;
        margin-top: 100px;
    }

    .container-account .cs-myAccount .cs-myAccountButtons a, .cs-myAccount {
        font-size: 1.5rem !important;
    }
  */

    .startpage_banner_custom {
        height: 850px;
        background-size: 61% !important;
    }
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 1900px) {
    :root {
      
        /*--container-max-width: 123rem;*/
         --container-max-width: 1320px;
        --big-container-font-size: 1rem;
        --category-product-font-size: 1.5rem;
        
    }

    .startpage_banner_custom .nivo-caption .caption-wrapper {
        position: relative;
        /*max-width: 51%;*/
    }

    .cs-main {
        /* first option -79px */
        margin-top: -131px;
    }

    header .cs-container {
        max-width: var(--container-max-width);
        width: 100%;
    }

    footer .cs-container {
        max-width: var(--container-max-width);
        width: 100%;
    }

    .cs-container {
        max-width: var(--container-max-width);
        width: 100%;
    }

    .cs-startText.cs-container {
        width: 100%;
        max-width: 100%;
    }

    .block_startpage .grid-columns-2 {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: var(--container-max-width);
        margin: auto;
        height: 100%;
        position: relative;
    }

    .block_startpage.first_block .grid-columns-2 .column-left {

        margin: auto 0;
        padding: unset !important;
        padding-right: 60px !important;

    }

    .block_startpage.second_block .grid-columns-2 .column-left {

        margin: auto 0;
        padding: unset !important;
        /*margin-right: 180px;*/

    }

    .block_startpage.first_block .grid-columns-2 .column-right {
        padding: unset !important;
        margin: auto 0;
       /* margin-top: 145px; */

    }

    .block_startpage {
        height: 700px;
        display: flex;
        justify-content: center;
    }

    .block_startpage.second_block {
        height: 1400px;
    }

    .cs-start .cs-categoryList {
        justify-content: unset;
        width: 100% !important;
    }

    article.cs-categoryPreview {
        width: calc(100% / 2 - 2em) !important;
    }

    .text-in-banner.header {
        font-size: 2rem;
    }

    .text-in-banner.content {
        font-size: 3.3rem;
    }

    header .cs-categoriesBox .cs-megaMenu > ul > li > a, header .cs-categoriesBox .cs-categoriesTop .cs-container .cs-largeMenu > ul > li > .cs-menuItem > a {

        font-size: var(--big-container-font-size) !important;
    }

    header .cs-topPages > ul > li a, a.selector_lang_link {
        font-size: var(--big-container-font-size);
    }

    .cs-button3.button-in-banner, .block_startpage .cs-button3, .btn-secondary, .btn-primary, .btn.btn-primary {
        font-size: var(--big-container-font-size);
        padding: 12px !important;
        line-height: 20px !important;
        display: inline-block;
    }

    .btn-secondary {
        font-size: var(--big-container-font-size);
        width: auto;
        max-width: unset;
    }

    .btn.btn-primary, .btn-primary {
        font-size: var(--big-container-font-size) !important;
        padding: 1em !important;
        width: unset;
        min-width: 240px;
        max-width: unset;
    }

    .block_startpage .cs-button3 {
        width: auto;
        max-width: unset;
    }

    .block_startpage h2, .block_startpage.first_block h2 {
        font-size: 3rem !important;
    }

    .block_startpage p {
        font-size: var(--big-container-font-size);
    }

    .cs-header-category {
        font-size: 2rem !important;
    }


    .category-startpage-container .cs-subtitle {
        font-size: 1rem;
    }

    .cs-categoryPreview .cs-categoryName, .cs-categoryPreview .cs-categoryName a {
        font-size: 1.5rem;
    }

    .cs-categoryPreview .categoryCount {
        font-size: 1.2rem;
    }

    .cs-footerBoxHeader {
        font-size: 1.5rem !important;
    }

    .checkout-header .cs-logo img {
              height: 75px;

        /*height: 220px;*/
        width: auto;
        max-width: unset;
    }

    .cs-logo img {
      height: 126px;  
        width: auto;
        max-width: unset;
    }

    .cs-category .cs-box {
        max-width: var(--container-max-width);
    }

    .cs-detail .cs-box {
        margin-top: 170px;
    }

    .cs-box {
        max-width: var(--container-max-width);
        *margin-top: 70px;

    }
    /*
    .artnamBox a {
        font-size: 1.7rem;
    }
  */

    .priceBox .priceRow .price span {
        font-size: 1.3rem !important;
    }

    .info-art-box-details, .cs-lagerBox {
        font-size: 1.6rem;
    }

    .info-art-box {
        /*margin-top: 43px;*/
        align-items: baseline;
    }

    .cs-articlePreview {
        max-height: unset;
    }

    .info-art-box-details .cs-actionButton, article.cs-articlePreviewSmall .cs-actionButton {
        font-size: 1.1rem;
        margin-top: 30px;
    }


    .info-art-box-details .cs-actionButton a:after, article.cs-articlePreviewSmall .cs-actionButton a:after {
        width: 0.6rem;
        height: 0.6rem;
    }

    article.cs-articlePreview .pictureContainer {
        height: unset !important;
        min-height: unset;
    }


    article.cs-articlePreview .pictureContainer a img {
        height: 400px;
    }

    .cs-badgesBox .singleBadge {
        font-size: 1.2rem;
    }


    header .cs-miniButtons .cs-svgIcon {
        /*margin: 1em;*/
    }

    .cs-miniwk span {
        font-size: 1.3rem;
    }

    .cs-siteHeading.header_latest_artickel span {
        margin: 1em 0 !important;
        font-size: 2rem !important;
    }

    article.cs-articlePreviewSmall .cs-articlePreviewSmallDescriptionBox a {
        font-size: 1.3rem;;
    }

    .cs-category .cs-main {
        margin-top: -64px;
    }

    .cs-category .categoryHeader {
        font-size: 2rem !important;
    }

    .cs-category header .cs-headerContent:after {
        height: 240px;
        top: -47px;
    }

    .cs-topPages .cs-svgIcon {
        width: 1rem;
        height: 1rem;
    }

    .cs-checkout .cs-checkoutMenu a {
        font-size: var(--big-container-font-size);
    }

    .cs-checkout .logo img {
        max-height: 200px;
    }

    .cs-checkout #infoblock, .cs-wkStep {
        font-size: var(--big-container-font-size);
    }

    h1 {
        font-size: 3rem;
    }

    h2 {
        font-size: 2.5rem;
    }

    h3, h3.cs-wkHeading {
        font-size: 2rem;
    }

    h4 {
        font-size: 1.6rem;
    }

    h5 {
        font-size: 1.4rem;
    }

    .cs-checkout .cs-container.cs-addSites a {
        font-size: 1rem;
    }

    .cs-footerRow.bottom {
        height: 90px;
    }

    .cs-searchBar .cs-searchBlock {
        width: 600px;
        font-size: 1rem;
    }

    #suchleiste_form select option {
        font-size: 1rem;
    }

    .cs-myAccount {
        font-size: 1rem;
    }

    .cs-topPages .cs-informationsHeader, .cs-topPages .cs-mobileInfosites ul li a {
        font-size: 1rem;
    }

    .cs-overlay {
        width: 420px !important;
    }

    .cs-detail .cs-articleDetail .cs-articleName {
        font-size: 1.5rem;
    }

    .cs-articleRightBox .cs-detailArtnum.cs-detailItems,
    .cs-articleRightBox .articlePriceBox,
    .cs-articleRightBox .cs-articlePriceInfo,
    .cs-articleRightBox .availability,
    .cs-articleRightBox .cs-inStock,
    .cs-articleRightBox span {
        font-size: 1rem;
    }

    .cs-articleDetail .basketBlock .cs-articleAmount .cs-articleAmountInput {
        font-size: 1rem !important;
    }

    .cs-articleDetail .basketBlock .cs-articleAmount .cs-amountIcon {
        max-width: unset;
    }

    .cs-imageBox {
        text-align: center;
    }

    .cs-detail .tabContainer .tabs span {
        font-size: 1rem;
    }

    .cs-detail .contentContainer .tabcontent {
        font-size: 1rem;
    }

    .cs-articlePictureBox .cs-addPicBox .cs-galleryImageBox {
        max-height: 250px;
    }

    .pagiIcons {
        font-size: 1rem;
    }

    .cs-errorBox {
        font-size: 1rem;
    }

    #cookieAlertWrapper {
        font-size: 1rem;
        max-width: 360px;
    }

    #cookieAlertWrapper .rightside a {
        font-size: 1rem;
    }

    header .cs-categoriesBox, header .cs-miniButtons {
        top: -32px;
    }
  
  /*

    .cs-checkout .cs-container {
        max-width: var(--container-max-width);
    }

    .cs-checkout .cs-form, .cs-checkout .cs-cartBoxArticleId a {
        font-size: 1.5rem;
    }

    .cs-checkout .cs-articleName {
        font-size: 2rem;
    }
  
  .cs-checkout .cs-prices{
       font-size: 1rem; 
  }

    .cs-checkout .cs-grundpreis {
        font-size: 1.3rem;
    }

    .cs-checkout .cs-button3 {
        font-size: 1.3rem;
    }

    .cs-checkout .cs-backToShopping a.btn-secondary {
        font-size: 1.3rem;
        max-width: unset;

    }

    .cs-checkout .cs-button1 {
        width: auto;
        padding: 0 20px !important;
    }

    .cs-checkout .ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-dialog-buttons {
        width: auto !important;
        min-width: 300px !important;
    }

    .cs-checkout .ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-dialog-buttons span {
        font-size: 1.5rem !important;
    }

    .cs-checkout .ui-widget .ui-widget {
        font-size: 1.5rem;
    }
    */
    .ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close .ui-button-icon.ui-icon.ui-icon-closethick {
        display: none;
    }

    .ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close:before, .ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close:after {
        content: " g";
        background-color: #fff;
        display: block;
        width: 3px;
        position: absolute;

        transform: rotate(45deg);
        top: -2px;
        left: 5px;
        right: 5px;
    }

    .ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close:after {
        transform: rotate(-45deg);
    }

    .datenschutz-container, .impressum-container, .agb-container {
        font-size: var(--big-container-font-size);
        letter-spacing: 1px;
    }

    .datenschutz-container h2, .datenschutz-container h3, .datenschutz-container h4, .datenschutz-container h5,
    .impressum-container h2, .impressum-container h3, .impressum-container h4, .impressum-container h5,
    .agb-container h2, .agb-container h3, .agb-container h4, .agb-container h5 {
        margin-bottom: 2rem;
    }

    .cs-addSitesBox {
        margin-top: 110px;
    }

    .cs-addSitesBox h1, .cs-addSitesBox h2, .cs-addSitesBox h3, .cs-addSitesBox h4, .cs-addSitesBox h5 {
        margin-bottom: 20px;
    }

    .cs-articleDetail #bestandsbenachrichtigung {
        font-size: var(--big-container-font-size);
    }

    .startpage_banner_custom {
        background-size: 61% !important;
    }
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 1200px) and (max-width: 1900px) {
    /*
    h2 {
        font-size: 2.25rem !important;

    }
    h3 {
      font-size: 1.5rem !important;
    }
    */
    .cs-categoryList h2 {
        font-size: 0.9rem !important;
    }

    .cs-start .cs-categoriesBox {
        top: -30px;
        width: 100%;
        justify-content: flex-start;
    }

    header .cs-miniButtons {
        top: -34px;
    }

    .cs-start .cs-main {
        margin-top: -127px;
    }

    .cs-main {
        /* first option -79px */
        margin-top: -66px;
    }

    .cs-detail .cs-main {
        margin-top: -94px;
    }

    .cs-categoriesTop ul {
        justify-content: flex-start;
    }
  
  .cs-megaMenu .cs-megaMenuContainer{
   min-width: 800px;  
  }
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width: 1670px) {
  article.cs-articlePreview .pictureContainer a img{
     object-fit: cover; 
  }
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width: 1270px) {
    .block_startpage {
        height: auto;
        display: block;
        position: relative;
    }

    
  
    .block_startpage .grid-columns-2 .column-left {
        margin: auto 0  !important;
        padding: unset  !important;
    }
  
  .block_startpage.second_block .grid-columns-2 .column-left  {
      margin: auto 0 !important;
  }
  
  

    .block_startpage.first_block .grid-columns-2 .column-left {
        padding: unset !important;
    }

    .block_startpage.first_block .grid-columns-2 .column-right {
        padding: unset !important;
        margin: unset !important;
    }


    .cs-categoryPreview .cs-categoryPicture img {
        min-height: unset !important;
    }

}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 1199.98px) {
    .cs-categoriesBox .cs-overlayButton {
        display: none;
    }
  
  .cs-megaMenu .cs-megaMenuContainer{
     min-width: 800px;
  
  }
  
  .cs-miniButtons.cs-flex{
    top: -27px;
  }
  
  .cs-categoriesMegaMenu.cs-container.cs-largeMenu{
      margin: 0;
  }

    .cs-categoriesBox .cs-categoriesTop,
    .cs-categoriesBox .cs-categoriesMegaMenu {
        display: inline-block;
    }

    .cs-mainContent {
        margin-top: 10px;
    }

    .cs-logo img {
        transition: all .25s ease-in-out;
    }
  
  .cs-start .cs-categoriesBox {
    top: 0;
        width: 100%;
  }

    header .cs-categoriesBox {
        padding-left: 0;
        width: 100% !important;
        justify-content: flex-start;
        display: flex;
    }

    header .cs-headerContent {
        padding: 0;
        margin-bottom: 0;
    }

    header .cs-headerContent .cs-container {
        justify-content: space-between;
    }

    .cs-mobileCategorys > ul li a {
        color: #103366;
    }

    .cs-overlayButton.cs-overlayMenuButton.cs-hidden {
        right: 10px;
        position: fixed;
        width: 47px;
    }

    .cs-topPagesBurger.cs-overlayButton.cs-hidden svg {
        display: none;
    }

    .cs-topPagesBurger.cs-overlayButton.cs-hidden {
        color: #fff;

    }

    .cs-categoriesTop ul {
        justify-content: flex-start;
    }

    .nivo-caption .cs-captionWrapper {
        margin-left: 20px !important;
    }
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 1010px) {


    .mobile-info-link{
        display: block;
    }

    .startpage_banner_custom {
        position: relative;
        height: 636px;
        background-size: cover;
        background-position: center center;
    }

    .startpage_banner_custom .grid-container {
        width: auto;
        grid-template-columns: 1fr;
    }

    .startpage_banner_custom .banner-wrapper{
        clip-path: polygon(0% 0%, 100% 0%, 100% 65%, 50% 100%, 0 67%);
        justify-content: center;
        text-align: center;
        width: 100%;
        position: absolute;
        height: 100%;
        background-color: rgba(var(--dat-color-grey-rgb), .75);
    }
  
  
  a.navigation_link:hover, .cs-megaMenuContainer a:hover{
    text-decoration: none;
    color: unset !important;
  }
  
  .mobileCategorys > ul li:hover a.navigation_link{
     text-decoration: underline !important; 
  }
  .cs-mobileCategorys .cs-miniButtons ul {
        justify-content: flex-start;
    }

    .cs-mobileCategorys .cs-miniButtons ul li{
        font-size: .875rem;
        line-height: 1.25rem;
        padding: 5px;
    }

    .cs-mobileCategorys .cs-miniButtons ul li a{
        padding: 0;
    }
        .cs-mobileCategorys > ul li{
        padding: 10px 0;
    }
 .cs-mobileCategorysHeader .cs-mobileCategorys .cs-megaMenuContainer .cs-miniButtons .cs-miniwk a:hover {
    text-decoration: none !important;

 }
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 710px) {
    .cs-mobileCategorys{
        width: 100% !important;
    }


    .cs-mobileCategorys .cs-miniButtons ul {
        justify-content: flex-start;
    }

    .cs-mobileCategorys .cs-miniButtons ul li{
        font-size: .875rem;
        line-height: 1.25rem;
        padding: 5px;
    }

    .cs-mobileCategorys .cs-miniButtons ul li a{
        padding: 0;
    }

    .cs-mobileCategorys .cs-miniButtons ul li .cs-svgIcon{
        /*
        width: 1em;
        height: 1em;
        */
    }
    .cs-overlayButton.cs-overlayMenuButton.cs-hidden {
        right: 10px;
        position: fixed;
    }
    .cs-category header .cs-headerContent:after{
        display: none;
    }

    body.cs-body.cs-loginpagebody {
        justify-content: unset !important;
    }

    body .cs-login {
        min-width: 360px;
    }

    .block_startpage.second_block img{
        display: none;
    }
    .block_startpage.second_block {
        background-image: url("/user_html/1721140897/pix/user_img/images/AdobeStock_956337537.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
    }

    .block_startpage.second_block .grid-columns-2 .column-left {
        background: rgba(255,255,255,0.7);
        padding: 20px !important;
    }

    .cs-categoryPreview .cs-categoryPicture img {
        min-height: auto !important;
    }

    .cs-articlePreview {
        max-height: 500px;
    }

    article.cs-articlePreview  .artnamBox {
        width: 65%;
        margin-bottom: 10px;
    }

    .info-art-box a{
        font-size: 0.8rem;
    }

    .cs-badgesBox  {
        top: 2%;
    }

    .basketMobileNavi{
        display: inline-flex;
        width: 100%;
        justify-content: flex-end;
    }

    .cs-shortnav{
        display: none;
    }

    .cs-checkout .cs-container:has(.cs-statusbar){
        margin-top: 100px;
    }

    .cs-headerContent.checkout-header .cs-container{
        height: 100px;
    }

    .basketMobileNavi select{
        width: 70%;
    }

    header .cs-miniButtons .cs-svgIcon{
        width: 1.5rem;
        height: 1.5rem;
    }
  
  

    .block_startpage .grid-columns-2 {
        grid-template-columns: 100% !important;
        max-width: 43rem;
        margin-left: 11px;
    }


    .block_startpage.first_block, .block_startpage.second_block {
        display: flex;
        justify-content: center;
        text-align: center;
    }


    .block_startpage.second_block {
        max-height: 500px;
    }

    .block_startpage.second_block .grid-columns-2 .column-left {
        background: rgba(255, 255, 255, 0.7);
        padding: 20px !important;
        margin: unset;
    }
  
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 574px){
    .cs-container.cs-flexSpaceBetween{
        display:flex !important;
    }
    .cs-container.cs-flex{
        width: 100%;
    }
    .cs-miniButtons a {
        text-wrap: nowrap;
    }

    header .cs-categoriesBox {
        padding-left: 0;
        width: 100% !important;
        justify-content: flex-start;


    }
    header .cs-headerContent{
        padding: 0 !important;
        margin-bottom: 0;
    }

    header .cs-headerContent .cs-container{
        /*display: flex !important; */
    }


    .cs-categoriesTop.cs-container.cs-largeMenu{
        display: none !important;
    }

    /*
    .text-in-banner.header{
       font-size: 14px;
    }


    .text-in-banner.content{
       font-size: 18px;
    }
      */

    article.cs-categoryPreview{
        width: 100% !important;
    }

    footer .cs-footerTop{
        padding: unset;
        padding-bottom: 10px !important;

    }

    footer .cs-footerInner.cs-container{
        max-width: 24em;
    }

    .cs-startTextBox{
        text-align: center;
    }

    .block_startpage .grid-columns-2{
        margin-left: unset;
        padding: 39px 20px;
    }
  
  .block_startpage.first_block .grid-columns-2 {
     align-content: unset; 
  }
  
  .info-art-box-details .cs-actionButton, article.cs-articlePreviewSmall .cs-actionButton{
     margin-top: unset; 
  }
}

/* MAX WIDTH 764px old variant*/

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 484px){

    header .cs-categoriesBox {
        width: 50% !important;
    }

    header .cs-categoriesBox .cs-overlayButton {
        display: inline-block !important;
    }


    .cs-categoriesBox .cs-categoriesTop, .cs-categoriesBox .cs-categoriesMegaMenu, .cs-miniButtons{
        display: none !important;
    }


    .cs-overlayButton.cs-overlayMenuButton {
        width: auto;
    }

    .cs-overlayButton.cs-overlayMenuButton span {
        top: 0;
    }
    .cs-overlay{
        width: 100% !important;
    }

    .cs-topBar{
        display: none;
    }

    .cs-headerContent{
        position: fixed;
        top: 0;
        left: 0;
        box-shadow: 0 1px .75rem 0 rgba(0, 0, 0, 0);
        transition: all 0.2s ease-in-out;
        z-index: 1030;
        width: 100%;
        background: #fff;
        padding:0 10px !important;
    }

    .cs-headerContent::before{
        content: '';
        height: 80px;

    }

    .cs-headerContent .cs-container{
        position: relative;
        height: 3.125rem;
    }

    .cs-logo img{
        height: 65px;
        top: 15px;
        transition: all .10s ease-in-out;
    }

    header{
        min-height: 50px;
    }

    .cs-overlayButton.cs-overlayMenuButton.cs-hidden {
        right: 10px;
        position: fixed;
        top: 16px;
    }

    .cs-mobileCategorys > ul li{
        padding: 10px 0;
    }

    .cs-mobileCategorys > ul li a {
        color: #103366;
    }

    .cs-statusbar{
        flex-direction: row;
        flex-wrap: nowrap;

    }

    .cs-statusbar li.cs-basketSteps{
        text-align: left;
    }

    .cs-basketSteps{
        clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
        display: flex;
        align-items: center;
    }

    .cs-cartBoxAmount {
        width: calc(100%/4);
    }

    .cs-cartBoxAmount .cs-articleRefresh {
        width: 1.3em;
        height: 1.3em;
    }

    .cartTableRow{
        align-items: center;
    }

    .startpage_banner_custom{
        height: 400px;
        background-size: cover;
    }


    .startpage_banner_custom .grid-container {
        width: auto;
    }

    .text-in-banner.content{
        font-size: 2.5rem;
    }

    .block_startpage.second_block{
        max-height: unset;
    }

}