:root {
    --white-color: #ffffff;
    --special-color: #e42313;
    --second-color: #e42313;
}

/* todo Common*/
.cms-home .pagebuilder-banner-button{
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 10px 30px !important;
    text-transform: none;
    font-weight: normal;
}
.cms-home .pagebuilder-button-primary{
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 10px 30px !important;
    text-transform: none;
    font-weight: normal;
}
.cms-home h2{
    color: #000000;
    font-weight: 700;
    text-transform: uppercase;
}
.cms-home .columns .column.main{
    padding-bottom: 0;
}
.cms-home footer .footer.content {
    padding-top: 0;
}
.cms-home.page-layout-1column .block.widget .products-grid .product-item {
    margin-left: 0 !important;
}

/* ---- todo .home-slider-category*/
.home-cat-slider{
    margin-top: 20px;
    padding-bottom: 40px;
}
.home-cat-slider p{
    color: var(--white-color);
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 0;
    text-shadow: 1px 1px 3px #4b4b4b;
}
.home-cat-slider .pagebuilder-column {
    padding: 10px 5px;
}
.home-cat-slider .pagebuilder-overlay{
    background-color: rgba(0, 0, 0, 0.2) !important;
}
.home-cat-slider .pagebuilder-poster-content > div{
    overflow: hidden;
}
.home-cat-slider .slick-prev:before,
.home-cat-slider .slick-next:before,
.home-cat-slider .slick-prev:after,
.home-cat-slider .slick-next:after {
    color: var(--white-color);
}
.home-cat-slider .slick-prev:not(.primary),
.home-cat-slider .slick-next:not(.primary) {
    background: #000000;
}
.home-cat-slider .slick-prev, .home-cat-slider .slick-next {
    height: 46px;
    width: 46px;
    padding: 0 !important;
    font-size: 0 !important;
}
.home-cat-slider .slick-dots li button {
    background: var(--second-color);
    border: 1px solid var(--second-color);
    border-radius: 50% !important;
}
.home-cat-slider .slick-dots li.slick-active button {
    background: var(--special-color);
}
.home-cat-slider .slick-dots li {
    height: 22px;
    width: 22px;
}
.home-cat-slider .slick-dots li.slick-active button {
    background: var(--special-color);
    border: 1px solid var(--special-color);
    width: 22px;
    height: 22px;
    margin-top: -4px;
}



/*---- todo  .home-slider-goods*/
.home-slider-goods ol.widget-product-grid{
    display: block;
    width: 100%;
}
.cms-home .home-slider-goods h2 {
    text-align: center;
}

.home-slider-goods .product-item-info{
    background: #ffffff;
}
.home-slider-goods .slick-prev,
.home-slider-goods .slick-next{
    width: 46px;
    height: 46px;
    padding: 0 !important;
    font-size: 0 !important;
}
.home-slider-goods .slick-prev:active,
.home-slider-goods .slick-next:active,
.home-slider-goods .slick-prev:focus,
.home-slider-goods .slick-next:focus,
.home-slider-goods .slick-prev:not(.primary),
.home-slider-goods .slick-next:not(.primary) {
    background: #000000;
}
.home-slider-goods .slick-prev:before,
.home-slider-goods .slick-next:before,
.home-slider-goods .slick-prev:after, .slick-next:after {
    color: #ffffff;
    font-size: 26px;
}

.cms-home .home-slider-goods .products-grid .product-item-name{
    font-weight: normal;
}
.cms-home .home-slider-goods .products-grid .product-item-info {
    padding: 10px 30px;
    margin: 0 6px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
}
.cms-home .home-slider-goods .products-grid .product-item-info:hover{
    margin: 0 6px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
}
.home-slider-goods .slick-list{
    padding: 24px;
}
.home-slider-goods .products-grid .product-item-info:before {
    background-color: #ffffff;
}

/* ---- todo .home-banner*/
.home-banner p{
    text-transform: uppercase;
}
.home-banner h2{
    font-weight: 700;
}
.cms-home .pagebuilder-slider .slick-dots li button{
    width: 10px;
    height: 10px;
    padding: 8px !important;
}


/* ---- todo .section-mobilitat*/
.section-mobilitat{
    margin-bottom: 10px;
}
.section-mobilitat .section-mobilitat-flex{
    display: flex;
    align-items: center;
}
.section-mobilitat .section-mobilitat-flex{
    margin-bottom: 14px;
}
.section-mobilitat .section-mobilitat-flex:nth-last-child{
    margin-bottom: 0;
}

.section-mobilitat .col-text{
    padding: 0 10px;
}
.cms-home .section-mobilitat h2 {
    margin: 0 0 14px 0;
}
.section-mobilitat-bg{
    margin-bottom: 19px;
}
.section-mobilitat-bg h3{
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 700;
}


/* ---- todo .rad-und-mehr*/
.rad-und-mehr{
    margin: 20px 0 25px;
}
.rad-und-mehr__left{
    margin-bottom: 4px;
}
.rad-und-mehr__left *{
    color: #ffffff;
}
.rad-und-mehr h3{
    text-transform: uppercase;
    margin-top: 20px;
}
.rad-und-mehr figure {
    margin: 0;
}


/*todo Tablet  min 768*/
@media screen and (min-width: 768px) {
    .cms-home .pagebuilder-button-primary,
    .cms-home .pagebuilder-banner-button{
        border: 1px solid #ffffff !important;
        color: #ffffff !important;
    }
    .cms-home .page-footer .pagebuilder-button-primary,
    .cms-home .page-footer .pagebuilder-banner-button{
        border: 1px solid #000000 !important;
        color: #000000 !important;
    }
    .cms-home h2{
        font-size: 20px;
        margin-left: 20px;
    }
    .cms-home h3{
        font-size: 22px;
    }
    .rad-und-mehr h3:first-child{
        margin-top: 0;
    }
    .rad-und-mehr .rad-und-mehr__left h3{
        font-size: 30px;
    }
    .rad-und-mehr .rad-und-mehr__right1{
        margin: 0 27px 0;
    }
    .rad-und-mehr .rad-und-mehr__right2{
        margin: 0;
    }

    /* ---- todo min 768  .home-slider-category*/
    .home-cat-slider p{
        font-size: 22px;
    }
    .home-cat-slider h2{
        margin: 20px 20px 50px 20px;
    }
    .home-cat-slider .products-grid .product-item-name{
        font-weight: 700;
    }
    .home-cat-slider .slick-prev, .home-cat-slider .slick-next{
        top: calc(50% - 10px);
    }
    .home-cat-slider .slick-prev:before, .home-cat-slider .slick-next:before, .home-cat-slider .slick-prev:after, .home-cat-slider .slick-next:after {
        font-size: 26px;
    }

    /* ---- todo min 768  .home-slider-goods*/

    .home-slider-goods .product-image-wrapper{
        padding-bottom: 100% !important;
    }



    /* ---- todo min 768 .section-mobilitat*/
    .section-mobilitat .col-img,
    .section-mobilitat .col-text{
        flex-basis: 50%;
        width: 50%;
    }
    .section-mobilitat-bg h3{
        font-size: 20px;
    }


    /* ---- todo min 768 .home-banner*/
    .home-banner{
        margin-bottom: 30px;
    }
    .home-banner p,
    .home-banner h2{
        color: var(--white-color);
        margin-bottom: 30px;
    }
    .home-banner h2{
        font-size: 30px;
        margin-left: 0;
    }
    .home-banner p{
        font-size: 20px;
        padding-left: 0;
    }
    .home-banner button.pagebuilder-button-primary{
        margin-left: 0;
    }
    .home-banner button{
        padding: 14px 30px;
        font-size: 14px;
        background: transparent;
        border-color: #ffffff;
    }

    .home-banner .pagebuilder-overlay.pagebuilder-poster-overlay{
        height: calc((100vw - 768px)/(1365 - 768)*(506 - 295) + 295px);
    }
    .home-cat-slider .pagebuilder-overlay.pagebuilder-poster-overlay{
        height: calc((100vw - 768px)/(1365 - 768)*(424 - 224) + 224px);
    }
    .home-banner .pagebuilder-poster-content{
        width: 50%;
    }
    .home-banner .pagebuilder-banner-wrapper .pagebuilder-overlay.pagebuilder-poster-overlay {
        justify-content: flex-start;
    }
}

/* todo Tablet  min 1366*/
@media screen and (min-width: 1366px) {
    .cms-home h2{
        font-size: 32px;
    }
    .cms-home h3{
        font-size: 32px;
    }
    .rad-und-mehr .rad-und-mehr__left h3{
        font-size: 40px;
    }
    /* ---- todo min 1366 .home-slider-category*/
    .home-cat-slider p{
        font-size: 32px;
    }
    .home-cat-slider .pagebuilder-column-group .slick-list.draggable{
        padding-left: 22%;
    }

    /* ---- todo min 1366 .home-slider-goods*/

    /* ---- todo min 1366 ..section-mobilitat*/
    .section-mobilitat .col-text{
        padding: 0 40px;
    }
    .cms-home .section-mobilitat h2 {
        margin-bottom: 4px;
    }
    .section-mobilitat-bg h3{
        font-size: 40px;
    }
    /* ---- todo min 1366 .home-banner*/
    .home-banner h2{
        font-size: 54px;
    }
    .home-banner p{
        font-size: 30px;
    }
    .home-banner button{
        padding: 26px 50px;
        font-size: 18px;
    }
    .home-banner .pagebuilder-overlay.pagebuilder-poster-overlay{
        height: 494px;
    }
    .home-cat-slider .pagebuilder-overlay.pagebuilder-poster-overlay{
        height: 329px;
    }


}


/*Todo Mobile max 767
// (for all mobile styles.)*/

@media screen and (max-width: 768px) {
    .cms-home .pagebuilder-button-primary,
    .cms-home .pagebuilder-banner-button{
        border: 1px solid #000000 !important;
        color: #000000 !important;
    }
    .cms-home main#maincontent {
        position: relative;
    }
    .cms-home h2{
        font-size: 22px;
        margin: 50px 20px 30px;
    }
    .cms-home .page-footer {
        margin-top: 0;
    }

    .cms-home .products-grid .product-item-details {
        padding-right: 0;
    }
    .cms-home .product-item .product-item-info .product-item-photo {
        text-align: center;
    }
    /* ---- todo max 767 .home-slider-mobile*/
    .home-slider-mobile .pagebuilder-poster-content{
        width: 50%;
        color: #ffffff;
        background: rgb(253 28 28 / 50%);
        padding: 4px 34px 4px 14px;
    }
    .home-slider-mobile  .pagebuilder-overlay.pagebuilder-poster-overlay {
        justify-content: flex-end !important;
    }

    /* ---- todo max 767 .home-slider-category*/
    .home-cat-slider .pagebuilder-overlay.pagebuilder-poster-overlay{
        height: calc((100vw - 320px)/(767 - 320)*(444 - 160) + 160px);
    }
    .home-cat-slider p{
        font-size: 22px;
    }
    /* ---- todo max 767 .home-slider-goods*/
    .cms-home .home-slider-goods .products-grid .product-item-info {
        padding: 10px;
    }
    .home-slider-goods {
        padding-bottom: 40px;
    }
    .home-slider-goods .product-image-wrapper{
        padding-bottom: 70% !important;
    }
    .cms-home .home-slider-goods .products-grid .product-item-name{
        min-height: 59px;
    }

    /* ---- todo max 767 .section-mobilitat*/
    .section-mobilitat .section-mobilitat-flex{
        flex-direction: column;
    }
    .section-mobilitat .col-text{
        padding: 20px 24px 10px;
    }
    .section-mobilitat-bg{
        height: calc((100vw - 320px)/(767 - 320)*(700 - 380) + 380px);
        margin-top: 20px;
    }
    .section-mobilitat-bg h3{
        font-size: 22px;
    }
    .cms-home .section-mobilitat h2 {
        font-size: 22px;
    }

    /* ---- todo max 767 .home-banner*/
    .home-banner .pagebuilder-overlay.pagebuilder-poster-overlay{
        height: calc((100vw - 320px)/(767 - 320)*(296 - 124) + 124px);
    }
    .home-banner{
        background: rgba(87, 87, 86, 0.13);
        padding-bottom: 30px;
    }
    .home-banner .pagebuilder-collage-content {
        width: 70%;
        padding: 14px;
        background: rgba(255, 255, 255, .55);
    }
    .home-banner .pagebuilder-overlay{
        width: 100%;
    }
    .home-banner .pagebuilder-banner-wrapper{
        display: flex;
        align-items: center;
    }
    .home-banner p,
    .home-banner h2{
        color: #000000;
    }
    .home-banner h2{
        font-size: 20px;
        margin: 0 0 14px;
    }
    .home-banner p{
        font-size: 14px;
        padding-left: 0;
        margin-bottom: 0;
    }
    .home-banner .pagebuilder-button-primary{
        margin-left: 0;
        width: 100%;
        max-width: 300px;
        text-align: center;
        font-size: 18px;
        padding: 10px 14px !important;
    }

    /* ---- todo max 767 .rad-und-mehr*/
    .rad-und-mehr .rad-und-mehr__right1{
        flex-basis: 50%;
        padding: 0 4px 0 0;
    }
    .rad-und-mehr__right2 h3{
        margin-top: 20px;
    }
    .rad-und-mehr h3{
        text-align: center;
        font-size: 22px;
    }
    .rad-und-mehr .rad-und-mehr__right2{
        flex-basis: 50%;
        padding: 0 0 0 4px;
    }
    .rad-und-mehr .rad-und-mehr__left{
        height: calc((100vw - 320px)/(767 - 320)*(706 - 395) + 395px);
    }




}