:root {
    --footer_max-width: var(--max-with90);
    --footer_bg1: var(--color_f1f1f1);
    --footer_bg2: var(--color_333);
    --footer_color1: rgb(var(--color_base_color));
    --footer_color2: rgb(var(--color_weiss));
    --footer_no_size: clamp(35px, calc(29.545px + 1.705vw), 50px); /* min: 35px -> 320px, max: 50px -> 1200px */
    --footer_padding10: clamp(5px, calc(3.182px + 0.568vw), 10px); /* min: 5px -> 320px, max: 10px -> 1200px */
    --footer_logo_width: 200px;
    --footer_logo_width250: 250px;
    --footer_width_resp300: 300px;
    --footer_abstand: clamp(0, 0.5966rem + 1.7045vw, 1.875rem);
    --footer_margin100: clamp(25px, calc(-2.273px + 8.523vw), 100px);
    --footer_ql_border_color: var(--color_dedede);
    --footer_socialmedia: clamp(20px, calc(12.727px + 2.273vw), 40px);
    --footer_sm_opi: 0.8; 
    --footer_sm_filter: brightness(0);
}

/* -- Footer -- */
#footer {
    display: block;
    width: 100%;
    float: left;
    clear: both;
    position: relative;
    color: var(--footer_color1);
    font-family: var(--hl_fontfamily_2);
    font-size: var(--font-size_18);
    line-height: var(--font_lineheigt);
    margin-top: var(--footer_margin100);
}

#footer a {
    color: var(--footer_color1);
}

#footer a:not(.nachoben):hover {
    --color_base_hightlight_1: var(--footer_color1);
}

#footer .frame > .rahmen {
    width: 100%;
    max-width: none;
    margin: 0;
}

/* -- Nach oben-Button -- */
.nachoben {
    position: absolute;
    top: calc(var(--footer_no_size) / 2 * -1);
    right: calc(calc(100% - var(--footer_max-width)) / 2);
    background-color: var(--color_base_hightlight_1);
    width: var(--footer_no_size);
    height: var(--footer_no_size);
    cursor: pointer;
    display: block;
    text-decoration: none;
}

.nachoben::before {
    content: '';
    display: block;
    background-color: var(--footer_color2);
    mask-image: url(../../../images/totop.svg);
    mask-repeat: no-repeat;
    mask-size: 100% auto;
    mask-position: center;
    position: absolute;
    width: calc(var(--footer_no_size) / 2);
    height: calc(var(--footer_no_size) / 2);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-decoration: none;
}

.footer_oben > .rahmen,
.footer_unten > .rahmen {
    width: var(--footer_max-width);
    margin: 0 auto;
}

/* -- Footer Oben -- */
.footer_oben {
    width: 100%;
    float: left;
    clear: both;   
    background: var(--footer_bg1);
    padding: calc(var(--footer_padding10) * 5) 0;
}

.footer_oben_box {
    width: 100%;
    float: left;
    clear: both;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--footer_width_resp300) * 2)), 1fr));
    column-gap: clamp(25px, calc(-2.273px + 8.523vw), 100px);
    row-gap: calc(var(--footer_padding10) * 2.5);
}

/* -- Footer Anschrift -- */
.footer_anschrift {
    width: 100%;
    float: left;
    clear: both;
}

.footer_anschrift strong  {
    padding-left: var(--hl_linie_width_4_pos);
    position: relative;
}

.footer_anschrift strong::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;  
    width: var(--hl_linie_width_4);
    bottom: 0;
    background: var(--hl_color_3);       
}

.footer_anschrift .ce-bodytext {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--footer_width_resp300), 1fr));
    gap: var(--footer_abstand);
}

/* -- Footer Zusatztext -- */
.footer_textzusatz {
    width: 100%;
    float: left;
    clear: both;  
    margin-top: calc(var(--footer_padding10) * 2.5);
}

/* -- Footer Quicklinks -- */
.footer_quicklink {
    width: 100%;
    float: left;
    clear: both;
    font-family: var(--hl_fontfamily_1);
    font-weight: var(--hl_fontweigt_700);
}

.footer_quicklink ul {
    margin: 0;
    padding: 0;
    list-style: none;    
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--footer_logo_width250), 1fr));
    gap: calc(var(--footer_padding10) * 2);    
}

.footer_quicklink ul li {
    display: flex;
    justify-content: center;
    justify-content: left;
    align-items: flex-start;
    text-align: left;
}

.footer_quicklink ul li a,
.footer_quicklink ul li.footer_ql_cookie button {
    text-decoration: none;
    color: inherit;
    padding: var(--footer_padding10) calc(var(--footer_padding10) * 2);
    display: block;
    box-shadow: inset 0 0 0 2px var(--footer_ql_border_color);
    width: 100%;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    text-align: left;
}

.footer_quicklink ul li a:hover,
.footer_quicklink ul li.footer_ql_cookie button:hover {
    box-shadow: inset 0 0 0 2px var(--footer_color1);
}

.footer_quicklink ul li.footer_ql_cookie button {
    border: 0;
    border-radius: 0;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    line-height: inherit;

}

.footer_quicklink ul li a::before {
    display: none;
}

/* -- SocialMedia -- */
.footer_socialmedia {
    width: 100%;
    float: left;
    clear: both;
    margin-top: calc(var(--footer_padding10) * 5);
}

.footer_socialmedia p {
    margin: 0;
}

.footer_socialmedia .ce-gallery {
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
    clear: both;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    column-gap: calc(var(--footer_padding10) * 4);
    row-gap: calc(var(--footer_padding10) * 2);
}

.footer_socialmedia .ce-gallery .ce-row {
    margin: 0;
}

.footer_socialmedia .ce-gallery .ce-column,
.footer_socialmedia .ce-gallery .image {
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
    clear: both; 
    display: block;  
}

.footer_socialmedia .ce-gallery a {
    text-decoration: none;
    display: block;
}

.footer_socialmedia .ce-gallery a::before {
    display: none;
}

.footer_socialmedia .ce-gallery .image img {
    display: block;
    height: var(--footer_socialmedia);
    width: auto;
    max-width: unset;
    filter: var(--footer_sm_filter);
    opacity: var(--footer_sm_opi);
}

/* -- Footer Unten -- */
.footer_unten {
    width: 100%;
    float: left;
    clear: both;   
    background: var(--footer_bg2);   
    color: rgb(var(--color_weiss));
    padding: calc(var(--footer_padding10) * 2.5) 0 calc(var(--footer_padding10) * 2) 0;
}

.footer_unten_box {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--footer_padding10) * 2);
    align-items: center;
    container-type: inline-size;
    container-name: footer;
}

/* -- Footer Logo -- */
.footer_logo {
    flex: 0 1 var(--footer_logo_width);
    max-width: 200px;
    float: left;
    clear: both;
}

.footer_logo .ce-gallery,
.footer_logo .ce-gallery .ce-row,
.footer_logo .ce-gallery .ce-column,
.footer_logo .ce-gallery .image {
    width: 100%;
    float: left;
    clear: both;
    margin: 0;
    display: block;
}

.footer_logo .ce-gallery a {
    text-decoration: none;
}

.footer_logo .ce-gallery a::before {
    display: none;
}

/* -- Footer Copyright -- */
.footer_copyright {
    flex: 1 1 calc(100% - var(--footer_logo_width) - calc(var(--footer_padding10) * 2)) ;
    text-align: right;
    float: left;
    clear: both;
}

.footer_copyright span {
    white-space: nowrap;
}

/* -- Responsive -- */
@container footer (max-width: 700px) {
    .footer_logo,
    .footer_copyright {
        flex: 0 0 100%;
    }

    .footer_copyright {
        text-align: left;
    }

    .footer_copyright span {
        white-space: normal;
    }
}