/* DD bimdlach-rathaus  */

body.home {
    background-color: #F6F6F6;

    #area-2 .container{
        flex-direction: row-reverse;
    }

    

    div#content {
        margin-top: -227px;
        z-index: 8;
        padding: var(--p-700);

        @media (max-width: 768px) {
            padding: 0px;
            margin-top:-150px;
        }
    }
 
    #area-2 {
        padding: 0px var(--p-700) var(--p-700);  
        @media (max-width: 768px) {
            padding: 0px var(--p-200) 0;
        }
        .container {
            @media (max-width: 1200px) {
                flex-wrap: wrap;
            }
            .col__block-left{
                padding: 0px var(--p-300);
                @media (max-width: 768px) {
                    padding: 0px;
                }
                .news_k_groupe{
                    border-radius: var(--br-primary);
                    padding: var(--p-450);
                    
                }
                
            }

            .col__block-right{
                .col-wellcome_text{
                    width: 100%;
                    padding: 0px;
                    cursor: default;
                    .collection_container{
                        transition: none;
                        transform: none;
                    }
                    .collection_container:hover{
                        transform: none;
                        transition: none;
                    }
                    .collection_container {
                        background-color: #ffffff;
                        padding: var(--p-500);
                        border-radius: var(--br-primary);
                        /* box-shadow: var(--shadow); */


                        .wellcome_text_title{
                            font-size: var(--fs-700);
                            font-weight: var(--fw-semibold);
                            padding: 0px 0px var(--p-450) 0px;

                        }

                        .wellcome_text_subtitle {
                            font-size: var(--fs-600);
                            text-align: left;
                        }
                        
                        .wellcome_img_bottom{
                            display: flex;
                            align-items: center;
                            padding: var(--p-500) 0px 0px 0px;

                            .wellcome_text_img {
                                flex-shrink: 0;
                                width: 130px;
                                height: 130px;
                                border-radius: 50%;
                                overflow: hidden;
                                display: flex;
                                background-color: #eee;
                            }

                            .wellcome_img_right {
                                display: flex;
                                flex-direction: column;
                                justify-content: center;
                                margin-left: 20px;
                                gap: 10px;

                                .wellcome_text_name {
                                    font-size: var(--fs-700);
                                    font-weight: var(--fw-semibold);
                                    
                                }

                                .wellcome_text_position {
                                    font-size: var(--fs-600);
                                    
                                }

                                .wellcome_text_link {
                                    width: 140px;
                                    height: 30px;
                                    display: flex;
                                    align-items: center;
                                    gap: 10px;
                                    cursor: pointer;
                                    transition: all 0.2s ease;
                                    cursor: pointer;
                                        a {
                                            color: var(--br-primary);
                                            text-decoration: none !important;
                                            white-space: nowrap;
                                            width: 100%;
                                            height: 100%;
                                            border: 1px solid;
                                            border-radius: 13px;
                                            padding: 6px 12px;
                                            align-items: center;
                                            display: flex;
                                            justify-content: center;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
                .col-wellcome_info {
                    width: 100%;
                    padding: var(--p-600) 0px;
                    .collection_container{
                        transition: none;
                        transform: none;
                    }
                    .collection_container:hover{
                        transform: none;
                        transition: none;
                    }
                    .collection_container {
                        padding: var(--p-450);
                        border-radius: var(--br-primary);
                        /* box-shadow: var(--shadow); */
                        background-color: #ffffff;
                        cursor: default;
                        .wellcome_info_top {
                            display: flex;
                            align-items: center;
                            justify-content: space-between;
                            padding: 0px 0px var(--p-400) ;
                            flex-direction: row-reverse;

                            .wellcome_info_title {
                                font-size: var(--fs-850);
                                font-weight: var(--fw-semibold);
                                color: var(--primary-accent);

                                .textcontent {
                                    .header-style{
                                        font-size: var(--fs-850) !important;
                                        color: var(--primary-accent);
                                    }
                                }
                            }

                            .wellcome_info_img {
                                flex-shrink: 0;
                                width: 100px;
                                height: 100px;
                                border-radius: 50%;
                                overflow: hidden;
                                display: flex;
                                /* background-color: #eee; */

                                img {
                                    width: 100%;
                                    height: 100%;
                                    object-fit: cover;
                                }
                            }
                        }

                        .wellcome_info_subtitle {
                            font-size: var(--fs-600);
                            text-align: left;
                            line-height: unset;
                        }
                    }
                }
            }
        }
    }

    div#area-1_5 {
        margin: 0px;
        padding: 0px var(--p-700);
        .col-xs-12 {
            display: flex;
            justify-content: center;

            .collection_list.col-events_home {
                width: 100%;
                padding: 0px;

                .collection_container{
                    width: 100%;
                    display: flex;
                    align-items: center;

                    /* justify-content: center; */

                    .col-events_home_title{
                        border-radius: 10px;
                        /* box-shadow: var(--shadow); */

                        padding: 10px;
                        font-size: 18px;
                        font-weight: var(--fw-bold);
                        /* color: var(--primary-accent); */
                        text-align: center;
                        background-color: #ffffff;
                        display: block;
                        z-index: 2;
                        position: relative;
                        width: 100%;
                        margin-top: auto;
                    }

                    .col-events_home_link a {
                        position: absolute;
                        bottom: 13px;
                        right: 110px;
                        width: 18px;
                        height: 18px;
                        background-image: url(/userdata/02_Kollektionen/arrow.svg);
                        background-size: contain;
                        background-repeat: no-repeat;
                        display: inline-block;
                        text-indent: -9999px;
                        z-index: 3;
                    }
                    @media (max-width: 1500px) {
                        .col-events_home_link a{
                            right: 10px;
                        }
                    }
                }
            }
        }
    }
    
    
    @media (max-width: 1200px) {
        #main-content #slider-wrapper {
            height: 600px;
        }
    }
    
    @media (max-width: 1024px) {
        body.home div#content {
            margin-top: -150px;
            padding: var(--p-500) var(--p-700);
        }

        #area-2 {
            /* padding: var(--p-500); */

            .container {
                .col__block-left {
                    padding: 0px var(--p-300);

                    .news_k_groupe {
                        padding: var(--p-300);
                    }
                }

                .col__block-right {
                    
                    .col-wellcome_text {
                        .collection_container {
                            padding: var(--p-400);

                            .wellcome_text_title {
                                font-size: var(--fs-600);
                            }

                            .wellcome_img_bottom {
                                .wellcome_text_img {
                                    width: 100px;
                                    height: 100px;
                                }

                                .wellcome_img_right {
                                    .wellcome_text_name {
                                        font-size: var(--fs-600);
                                    }
                                }
                            }
                        }
                    }

                    .col-wellcome_info {
                        .collection_container {
                            .wellcome_info_top {
                                .wellcome_info_img {
                                    width: 80px;
                                    height: 80px;
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    @media (max-width: 992px){
        #area-2 .container {
            display: flex;
            flex-wrap: wrap;
        }
    
        #area-1_5 .container{

            .col-events_home_link a {
                right: 5px !important;
            }
        }

       
    }

    @media (max-width: 820px){
        .slider-title .slider-title-content-subtitle {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 15px;
        }

        #area-1_5 .container{
  
            .col-events_home_link a {
                right: 25px !important;
            }
        }
        .slider-title .slider-title-content-subtitle .header-text {
            flex: 0 0 100%;
        }

        .slider-title-content-subtitle .app-download-button {
            margin-left: 5px; 
            margin-right: 5px;
        }
    }

    @media (max-width: 768px) {
        #area-1_5 {
            padding: 0px var(--p-200) !important;

            .container{
            .col-events_home_link a {
                right: 5px !important;
            }
            }
        }
        

        

        body.home div#content {
            margin-top: -150px;
            padding: var(--p-400);
        }

        #area-2 {
            padding: var(--p-600);

            .container {
                flex-direction: column !important;

                .col__block-left {
                    padding: 0px;
                    width: 100%;

                    .news_k_groupe {
                        padding: var(--p-300);
                    }
                }

                .col__block-right {
                    width: 100%;
                    padding: 0px;
                    .col-wellcome_text {
                        .collection_container {
                            padding: var(--p-300);

                            .wellcome_text_title {
                                font-size: var(--fs-500);
                                padding: 0px 0px var(--p-300) 0px;
                            }

                            .wellcome_text_subtitle {
                                font-size: var(--fs-500);
                            }

                            .wellcome_img_bottom {
                                padding: var(--p-400) 0px 0px 0px;

                                .wellcome_text_img {
                                    width: 90px;
                                    height: 90px;
                                }

                                .wellcome_img_right {
                                    margin-left: 15px;

                                    .wellcome_text_name {
                                        font-size: var(--fs-500);
                                    }

                                    .wellcome_text_position {
                                        font-size: var(--fs-500);
                                    }
                                }
                            }
                        }
                    }

                    .col-wellcome_info {
                        padding: var(--p-400) 0px;

                        .collection_container {
                            padding: var(--p-300);

                            .wellcome_info_top {
                                padding: 0px 0px var(--p-300);

                                .wellcome_info_title {
                                    font-size: var(--fs-600);
                                }

                                .wellcome_info_img {
                                    width: 70px;
                                    height: 70px;
                                }
                            }

                            .wellcome_info_subtitle {
                                font-size: var(--fs-500);
                            }
                        }
                    }
                }
            }
        }

        div#area-1_5 {
            .col-xs-12 {
                .collection_list.col-events_home {
                    .collection_container {
                        
                        .col-events_home_title {
                            font-size: 16px;
                            padding: 8px;
                        }

                        .col-events_home_link a {
                            right: 100px;
                            bottom: 10px;
                        }
                    }
                }
            }
        }
    }



    /* Mobile Devices */
    @media (max-width: 668px) {
        .col-events_home_link a {
            right: 25px !important;
            bottom: 10px;
        }
    }

    @media (max-width: 576px) {
        .collection_list.col-events_home {
                width: 100%;
                /* padding: var(--p-100) !important; */
            }

        #main-content #slider-wrapper {
            height: 250px;
        }

        body.home div#content {
            margin-top: -70px !important;
            padding: 0px;
            
            .col_hauptmenu_wrapper {
                padding: 0px;
            }
        }

        #area-1_5{
            padding: 5px !important;
        }

        #area-2 {
            padding: var(--p-200);

            .container {
                .col__block-left {
                    .news_k_groupe {
                        padding: var(--p-200);
                    }
                }

                .col__block-right {
                    padding: unset;
                    .col-wellcome_text {
                        .collection_container {
                            padding: var(--p-400);

                            .wellcome_text_title {
                                font-size: var(--fs-450);
                                padding: 0px 0px var(--p-200) 0px;
                            }

                            .wellcome_text_subtitle {
                                font-size: var(--fs-400);
                            }

                            .wellcome_img_bottom {
                                flex-direction: column;
                                align-items: flex-start;
                                padding: var(--p-300) 0px 0px 0px;

                                .wellcome_text_img {
                                    width: 80px;
                                    height: 80px;
                                }

                                .wellcome_img_right {
                                    margin-left: 0;
                                    margin-top: 15px;

                                    .wellcome_text_name {
                                        font-size: var(--fs-450);
                                    }

                                    .wellcome_text_position {
                                        font-size: var(--fs-400);
                                    }
                                }
                            }
                        }
                    }

                    .col-wellcome_info {
                        padding: var(--p-400) 0px;

                        .collection_container {
                            padding: var(--p-300);

                            .wellcome_info_top {
                                flex-direction: column-reverse;
                                align-items: flex-start;
                                gap: 15px;
                                padding: 0px 0px var(--p-200);

                                .wellcome_info_title {
                                    font-size: var(--fs-500);
                                }

                                .wellcome_info_img {
                                    width: 60px;
                                    height: 60px;
                                }
                            }

                            .wellcome_info_subtitle {
                                font-size: var(--fs-400);
                            }
                        }
                    }
                }
            }
        }

        div#area-1_5 {
            .col-xs-12 {
                .collection_list.col-events_home {
                    .collection_container {
                        flex-direction: column;

                        .col-events_home_title {
                            font-size: 14px;
                            padding: 10px 8px;
                        }

                        .col-events_home_link a {
                            right: 10px;
                            bottom: 10px;
                            width: 16px;
                            height: 16px;
                        }
                    }
                }
            }
        }
    }

    @media (max-width: 500px) {
        body.home div#content {
            margin-top: -70px !important;
        }
    }

    @media (max-width: 435px) {
        /* body.home div#content {
            margin-top: -70px !important;
        } */

        #content .collection_list {
            height: 170px !important;
        }
    }

    @media (max-width: 400px) {
        .slider-title-content-subtitle .app-download-button {
            margin-left: 3px;
            margin-right: 0px;
        }
    }

    /* ── Slider mobile: Schriften + App-Buttons ────────────── */
    @media (max-width: 576px) {
        #slider-wrapper {
            min-height: 400px;
        }

        .seasonal-bg-layer {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
        }

        .home .header-title h1 {
            font-size: 32px !important;
        }

        .home .header-style h1 {
            font-size: 36px !important;
            margin-top: -10px;
        }

        .home #slider-title {
            width: 100%;
            padding: 16px 12px;
            box-sizing: border-box;
        }

        .home .slider-title-content-subtitle {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 10px;
        }

        /* App-Badges: nebeneinander aber kleiner, bei sehr klein übereinander */
        .home .slider-title-content-subtitle .app-download-button {
            margin: 0;
        }

        .home #slider .link-to-store img {
            height: 38px !important;
            width: 120px !important;
        }
    }

    @media (max-width: 400px) {
        

        .home .header-title h1 {
            font-size: 26px !important;
        }

        .home .header-style h1 {
            font-size: 30px !important;
        }

        /* App-Badges untereinander auf sehr kleinen Screens */
        .home .slider-title-content-subtitle .app-download-button {
            flex: 0 0 auto;
        }

        .home #slider .link-to-store img {
            height: 34px !important;
            width: 110px !important;
        }
    }

    /* @media (max-width: 380px) {
        body.home div#content {
            margin-top: -30px !important;
        }
    } */


body.home.high-contrast{
    .news_k-title {
        padding-left: 5px !important;
    } 

    .news_k-title {
        padding-left: 10px !important;
    }

    #area-2 {
        .container .col__block-left .news_k_groupe{
            color: #000000 !important;
            border: 2px solid #000000 !important;
            border-radius: 8px;   
            padding-bottom: 40px;          
        }
        .news_k-title::after {
            right: 5px;    
        }
    }  
} 

/* DD bimdlach-rathaus  END*/