/*!
 * Virtual Select v1.0.36
 * https://sa-si-dev.github.io/virtual-select
 * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE)
 */
 @-webkit-keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2;box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);margin-top: 4px;}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{-webkit-animation:vscomp-animation-spin .8s infinite linear;animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px}

 * {
    box-sizing: border-box;
}

html {
    margin: 0 !important;
    height: 100%;
    scroll-behavior: smooth;
}

#wpadminbar {
    opacity: 0.15;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", sans-serif;
    position: relative;
    height: 100%;
}

img {
    max-width: 100%;
    height: auto;
    pointer-events: none;
}

h1, h2, h3, h4 {
    margin: 0;
}

a {
    text-decoration: none;
    color: #fff;
}

#wrapper, main {
    height: 100%;
}

main {
    display: flex;
    flex-direction: column;
    overflow: auto;
    padding-top: 20px;
    background: linear-gradient(0,rgb(19 79 97) 0%,rgb(29 125 147) 100%);
    position: relative;
}

.calculator {
    margin: 10px;
}

.footer {
    padding-top: 8px;
    padding-bottom: 25px;
    margin-top: auto;
}

.footer > .container {
    display: flex;
    justify-content: center;
}

.footer a {
    padding: 0 7px;
    position: relative;
    color: #418a9b;
}

@media (max-width: 768px) {
    .footer a {
        font-size: 0.8em;
    }
}

@media (max-width: 576px) {
    .footer {
        padding-bottom: 15px;
    }

    .footer > .container {
        flex-wrap: wrap;
    }
}

@media (min-height: 850px) {
    .calculator {
        margin-top: 15px;
    }
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 25px;
}

.calculator > .container {
    max-width: 840px;
    /* background-color: #ffffff0f; */
    padding-top: 44px;
    padding-bottom: 60px;
    border-radius: 25px;
    /* box-shadow: -5px 5px 18px #15355155; */
}

@media (max-width: 768px) {
    .calculator > .container {
        width: 100%;
        padding: 0px 10px;
    }

    main {
        height: auto;
        min-height: 100%;
        padding-top: 14px;
    }
}
/* Virtual Select Overrides */
.vscomp-wrapper {
    font-family: inherit;
    font-size: 13.5px;
    display: flex;
}

.vscomp-dropbox {
    font-size: 12.5px;
}

.vscomp-search-input {
    font-size: 13px;
}
.vscomp-wrapper .vscomp-search-input::placeholder {
    color: #aab6c7;
}

.vscomp-toggle-button {
    background: #19426c;
    border: none;
    color: #fff;
    border-radius: 8px;
    padding: 7px 30px 7px 12px;
}

.vscomp-arrow::after {
    border-bottom-color: #fff;
    border-right-color: #fff;
}

.vscomp-dropbox-container {
    background: #1d3e60;
    color: #fff;
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.2s, opacity 0.2s, visibility 0.2s;
    position: absolute;
    top: 100%;
    z-index: 20;
}

.vscomp-wrapper.closed .vscomp-dropbox-container {
    transform: translateY(-5px);
    opacity: 0;
    display: initial;
    visibility: hidden;
}

.vscomp-dropbox {
    background: none;
}

.vscomp-option {
    transition: background 0.1s;
}

.vscomp-option.focused {
    background-color: #3d67a3;
}

.vscomp-option:hover {
    background: #2e466a;
}

.vscomp-option.selected {
    background: #3d67a3;
}

.vscomp-wrapper.focused .vscomp-toggle-button, .vscomp-wrapper:focus .vscomp-toggle-button {
    box-shadow: none;
}

.vscomp-value {
    font-size: 0.95em;
}

.vscomp-wrapper:not(.has-value) .vscomp-value {
    opacity: 1;
}

.vscomp-wrapper .checkbox-icon::after {
    border-color: #6d83a3;
}

.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after {
    border-right-color: #ffffff;
    border-bottom-color: #ffffff;
}

.vscomp-clear-icon::before, .vscomp-clear-icon::after {
    background-color: #899ebd;
}

.vscomp-clear-button:hover .vscomp-clear-icon::before, .vscomp-clear-button:hover .vscomp-clear-icon::after {
    background-color: #b3c2da;
}

.vscomp-clear-button:hover {
    background: none;
}

/*******************************************??*/
.navbar {
    padding-top: 25px;
}

.navbar > .container {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 768px) {
    .navbar {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .navbar > .container {
        justify-content: center;
    }
}

.logo {
    height: 35px;
}

@media (max-width: 576px) {
    .logo {
        height: 34px;
    }
}

#top_title {
    text-align: center;
    font-weight: lighter;
    color: #dfe7eb;
    font-size: 1.5em;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 4px;
    transition: opacity 0.3s;
}

#progress {
    max-width: 700px;
    height: 6px;
    margin: 25px auto;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.05);
    background-color: rgba(255, 255, 255, 0.12);
    transition: opacity 0.3s;
    display: none;
}

@media (max-width: 768px) {
    #top_title {
        font-size: 1.4em;
        letter-spacing: 3px;
    }

    #progress {
        margin: 20px 0;
    }
}

@media (max-width: 576px) {
    #top_title {
        font-size: 1.1em;
        letter-spacing: 2px;
    }
}

#progressBar {
    width: 4%;
    height: 100%;
    background-color: white;
    transition: width 0.7s;
}

.title_container {
    display: flex;
    align-items: flex-start;
    position: relative;
    display: none;
}

#dynamic_title {
    text-align: center;
    color: white;
    font-size: 1.7em;
    letter-spacing: 1px;
    position: relative;
    transition: opacity 0.3s, transform 0.4s;
    margin: 4px 64px 0;
    width: 100%;
    margin-bottom: 40px;
}

@media (max-width: 768px) {
    #dynamic_title {
        font-size: 1.5em;
    }
}

@media (max-width: 576px) {
    #dynamic_title {
        font-size: 1.2em;
        margin: 0 43px 23px;
    }
}

@media (max-width: 400px) {
    #dynamic_title {
        font-size: 1.05em;
    }
}

@media (max-width: 340px) {
    #dynamic_title {
        font-size: 1.02em;
    }

    #top_title {
        font-size: 1em;
        letter-spacing: 1.5px;
    }
}

#prevBtn {
    width: 60px;
    height: 60px;
    position: relative;
    cursor: pointer;
    border-radius: 7px;
    transition: opacity 0.3s;
    flex-shrink: 0;
    position: absolute;
    transform: translateY(-5px);
}

@media (hover: hover) and (pointer: fine) {
    #prevBtn:hover {
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.03);
        background-color: rgba(255, 255, 255, 0.05);
    }
}

#prevBtn::before {
    content: "";
    width: 20px;
    height: 20px;
    transform: rotate(45deg) translate(31px, -4px);
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    z-index: 1;
    transition: transform 0.25s;
    position: absolute;
}

@media (max-width: 576px) {
    #prevBtn {
        width: 46px;
        height: 46px;
        margin-left: -10px;
    }

    #prevBtn::before {
        width: 15px;
        height: 15px;
        transform: rotate(45deg) translate(25px, -3px);
        border-left: 1px solid #fff;
        border-bottom: 1px solid #fff;
        z-index: 1;
        transition: transform 0.25s;
        position: absolute;
    }
}


.location-options {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    justify-content: center;
}
.location-card {
    flex: 1;
    min-width: 250px;
    max-width: 320px;
    padding: 1rem;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    background: #fff2;
    border: 1px solid transparent;
}
.location-card:hover {
    border-color: #7190ae;
    box-shadow: 0 4px 12px rgba(37, 105, 168, 0.15);
    transform: translateY(-2px);
}
.location-card.selected {
    border-color: #ffffff;
    box-shadow: 0 4px 16px rgba(37, 105, 168, 0.2);
    transform: translateY(-4px);
}
.location-card img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 0.75rem;
}
.location-card h5 {
    margin: 0 0 0.5rem 0;
    font-size: 1.1rem;
}
.location-card span {
    font-size: 0.85rem;
    color: #afc4c9;
}
.location-card .small {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: #afc4c9;
}
#weiterBtn_intro.disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

#userForm {
    position: relative;
    transition: opacity 0.3s, transform 0.4s;
    flex-direction: column;
    margin-top: 45px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;

    --icon_avatar_url: url("../images/icon_avatar.svg");
    --icon_email_url: url("../images/icon_email.svg");
}

@media (max-width: 576px) {
    #userForm {
        margin-top: 30px;
    }
    .location-options {
        display: flex;
        flex-direction: column;
    }
    .location-card {
        display: flex;
        max-width: none;
    }
    .location-card>img {
        width: 40%;
        margin: 0;
    }
    .location-card-content {
        padding: 10px 0 0 18px;
        text-align: left;
    }
}

@media (max-width: 480px) {
    #userForm {
        padding: 0 25px;
    }
}


.anredeGroup {
    margin-top: 10px;
    margin-bottom: 26px;
}

.anredeTitle {
    font-size: 0.82em;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #a2cace;
    margin-bottom: 8px;
}

.anredeRadios {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.anredeRadios label {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 7px 14px 8px;
    background: rgba(255, 255, 255, 0.06);
    transition: background 0.15s, box-shadow 0.15s, transform 0.15s;
}

.anredeRadios label:hover {
    background: rgba(255, 255, 255, 0.12);
}

.anredeRadios input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.anredeRadios label span {
    position: relative;
    padding-left: 22px;
    font-size: 0.9em;
    color: #dfe7eb;
}

.anredeRadios label span::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.anredeRadios label span::after {
    content: "";
    position: absolute;
    left: 3px;
    top: 50%;
    transform: translateY(-50%) scale(0);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #00c3bc;
    transition: transform 0.18s ease-out;
}

.anredeRadios input:checked + span {
    color: #ffffff;
}

.anredeRadios input:checked + span::before {
    border-color: #00c3bc;
}

.anredeRadios input:checked + span::after {
    transform: translateY(-50%) scale(1);
}


.i_row {
    position: relative;
    margin-bottom: 28px;
}

.i_row input {
    width: 100%;
    padding: 12px 44px 10px;
    background: none;
    transition: border-color 0.2s;
    color: #fff;
    outline: none;
    border: none;
    border-bottom: 1px solid rgb(255 255 255 / 40%);
    font-size: 1em;
    border-radius: 0;
}

.i_row input.success {
    border-bottom-color: rgb(49 194 67);
}

.i_row input.error {
    border-bottom-color: rgb(255 103 103);
}.icon_user::after {
    content: "";
    background-image: var(--icon_avatar_url);
    position: absolute;
    z-index: 90;
    left: 0px;
    top: 0px;
    display: block;
    width: 38px;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    cursor: text;
    filter: brightness(1.5);
}

.icon_email::after {
    content: "";
    background-image: var(--icon_email_url);
    position: absolute;
    z-index: 90;
    left: 1px;
    top: 0px;
    display: block;
    width: 38px;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    cursor: text;
    filter: brightness(1.5);
}

.inp_icon > img {
    position: absolute;
    z-index: 90;
    right: 6px;
    top: 7px;
    display: block;
    width: 22px;
    height: 22px;
    background-size: cover;
    background-position: center;
    cursor: text;
    opacity: 0;
    transition: opacity 0.3s;
}

.inp_icon.success > .check {
    opacity: 1;
}

.inp_icon.error > .cross {
    opacity: 1;
}

.i_row input::placeholder {
    color: #b2c8d7;
}

.i_row input:focus {
    border-color: rgb(255 255 255 / 90%);
}

#telefon_row {
    display: flex;
}

#telefon_row::after {
    content: none;
}

#telefon_row > select {
    background: none;
    color: #b2c8d7;
    border: none;
    border-bottom: 1px solid rgb(255 255 255 / 40%);
    outline: none;
}

#telefon_row option, #telefon_row optgroup {
    color: black;
}

#telefon_row > input {
    padding-left: 8px;
    margin-left: 12px;
}

.privacy {
    font-size: 0.8em;
    color: rgb(255 255 255 / 64%);
    display: flex;
    position: relative;
}

.privacy > span {
    margin-right: 16px;
}

.privacy > input {
    margin: 3px 6px 0 0;
}

@media (max-width: 768px) {
    .privacy > input {
        min-height: 17px;
        min-width: 17px;
        margin: 2px 10px 0 0;
    }
}

.privacy .inp_icon {
    display: flex;
    align-items: center;
    padding-left: 5px;
}

.privacy .inp_icon > img {
    top: auto;
}

.lds-dual-ring {
    opacity: 0;
    transition: opacity 0.3s;
    transition-delay: 0.3s;
    position: absolute;
    top: calc(50% - 16px);
    left: calc(50% - 16px);
}

#sendBtn.sending .lds-dual-ring {
    opacity: 1;
}

.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 3px solid #3668b4;
    border-color: #3668b4 transparent #3668b4 transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

#thank-you {
    position: relative;
    transition: opacity 0.3s, transform 0.4s;
    color: #fff;
    font-weight: lighter;
    line-height: 1.5;
    background-color: rgba(0, 0, 0, 0.25);
    box-shadow: -6px 10px 18px 0 rgba(0, 0, 0, 0.12);
    border-radius: 12px;
    overflow: hidden;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 50px;
}

#thank-you .columns {
    display: flex;
}

#thank-you .columns > * {
    width: 50%;
}

#thank-you .texts {
    padding: 35px 0 22px 32px;
    flex-shrink: 0;
}

#thank-you h3 {
    font-size: 1.4em;
}

#thank-you .image {
    margin-left: 20px;
    object-fit: cover;
}

@media (max-width: 768px) {
    #thank-you .columns {
        flex-direction: column-reverse;
        padding: 20px 22px 10px;
    }

    #thank-you .columns > * {
        width: 100%;
    }

    #thank-you .texts {
        padding: 0;
        margin: 19px 0 0;
        font-size: 0.91em;
    }

    #thank-you .image {
        margin: 0;
        border-radius: 15px;
    }
}

.insta_box {
    display: flex;
    padding: 30px 30px;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    color: #165a8a;
    font-weight: 500;
    width: 100%;
}

#terminBtn {
    background-color: #165a8a;
    padding: 15px 30px;
    flex-shrink: 0;
    border-radius: 12px;
    transition: transform 0.35s, box-shadow 0.35s;
    text-align: center;
    outline: none;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 0.95em;
    font-family: inherit;
    font-weight: 500;
}

#terminBtn:hover {
    transform: translate(1px, -4px);
    box-shadow: -2px 4px 10px 0 rgba(0, 0, 0, 0.24);
}

.insta_box > .before_after {
    padding: 0 45px 0 30px;
    font-size: 1.1em;
}

.insta_box > img {
    width: 50px;
}

@media (max-width: 768px) {
    .insta_box > .before_after {
        padding: 0 25px 0 25px;
        font-size: 1em;
    }
}

@media (max-width: 650px) {
    .insta_box {
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
    }

    .insta_box > img {
        width: 11%;
    }

    .insta_box > .before_after {
        width: 89%;
        font-size: 1.1em;
    }

    #terminBtn {
        width: 100%;
        margin-top: 18px;
        padding-left: 0;
        padding-right: 0;
    }
}

#termin {
    transition: opacity 0.3s;
    /* background: #fff; */
    /* box-shadow: -6px 10px 18px 0 rgba(0, 0, 0, 0.12); */
    padding: 22px 28px;
    max-width: 530px;
    margin: 0 auto;
    border-radius: 15px;
}

#termin h3 {
    color: #ffffff;
    font-size: 1.1em;
    margin: 0 0 9px;
}

.termin_info {
    font-size: 0.85em;
    color: #a2cace;
    display: flex;
    align-items: center;
    line-height: 1;
    margin-bottom: 6px;
}

#text_duration {
    margin-right: 3px;
}

.termin_info > img {
    height: 12px;
    margin-right: 5px;
}

@media (max-width: 576px) {
    #termin {
        border-radius: 0;
    }
}

@media (max-width: 480px) {
    #termin {
        padding: 12px 0;
    }

    #termin h3 {
        margin: 0 21px 9px;
    }
}

#terminApp {
    margin-top: 12px;
    transition: opacity 0.25s;
}

#terminApp .navigation {
    font-size: 0.88em;
    color: #a2ccce;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

#terminApp .navigation .dayYear b {
    color: #ffffff;
    font-weight: 500;
}

#terminApp .navigation .switches {
    display: flex;
    align-items: center;
    transition: opacity 0.25s, visibility 0.25s;
}

#terminApp .navigation .switches > span, #hoursBackBtn {
    background: #6fd7ff12;
    border: 1px solid #4d949b;
    width: 41px;
    height: 41px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background 0.1s;
    cursor: pointer;
    position: relative;
}

#terminApp .navigation .switches > span:hover, #hoursBackBtn:hover {
    background: #2ef5ff40;
}

#termin_left::after, #termin_right::after, #hoursBackBtn::after {
    content: "";
    width: 7px;
    height: 7px;
    transform: translate(1px, 0) rotate(45deg);
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    z-index: 1;
    transition: transform 0.3s, opacity 0.3s;
    position: absolute;
}

#terminApp #termin_left {
    margin-right: 7px;
}

#terminApp #termin_right::after {
    transform: translate(-1px, 0) rotate(225deg);
}

#terminApp .weekDays {
    margin-top: 11px;
    margin-bottom: 10px;
    border-top: 1px solid #5198a5;
    border-bottom: 1px solid #5198a5;
    color: #70c1c6;
    font-size: 0.88em;
    padding: 9px 0 10px;
    display: flex;
    transition: opacity 0.25s, visibility 0.25s;
    text-transform: uppercase;
}

#terminApp .weekDays > span {
    width: 14.28%;
    text-align: center;
}

#terminApp #calendar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 2%;
    transition: opacity 0.25s, visibility 0.25s;
}

#terminApp #calendar > span {
    width: 12.68%;
    height: 50px;
    margin: 0.8%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0;
    border-radius: 7px;
    color: #ffffff;
}

@media (max-width: 480px) {
    #terminApp .navigation, #terminApp .hours {
        margin: 0 21px;
    }

    #terminApp .hours > div {
        flex-wrap: wrap;
        row-gap: 6px;
        column-gap: 8px;
    }

    #terminApp .hours > div > span {
        width: 100%;
    }

    #terminApp #calendar > span {
        height: 12.68vw;
    }
}

#terminApp #calendar > span.available {
    background: #89efff1f;
    cursor: pointer;
    transition: background 0.1s;
}

#terminApp #calendar > span.available:hover {
    background: #89f1ff47;
}

#terminApp #calendar > span.blocked {
    color: #5a95a3;
}

#terminApp #calendar > span.selected {
    background: #00c3bc;
    color: #fff;
    font-weight: 500;
}

#terminApp #calendar > span.today_bookable {
    cursor: pointer;
    transition: background 0.1s;
}

#terminApp #calendar > span.today_bookable:hover {
    background: #55f3ffcc;
}

#terminApp .hours, #terminApp #details {
    border-top: 1px solid #5195a5;
    margin-top: 18px;
    padding: 18px 10px 0;
    display: flex;
    flex-direction: column;
}

.hours > div {
    display: flex;
    color: #7897b9;
    gap: 12px;
    margin-bottom: 10px;
    align-items: center;
}

.hours > div > span {
    margin-right: 5px;
}

.hours > div > div {
    background: rgba(255, 255, 255, 0.05);
    color: white;
    padding: 15px 18px;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.3s, box-shadow 0.3s, background-color 0.3s;
    position: relative;
    flex-grow: 1;
    text-align: center;
}

.hours > div > div:not(.empty):hover {
    transform: translate(1px, -3px);
    box-shadow: -1px 5px 12px 0 rgba(24, 46, 75, 0.23);
    background-color: rgba(255, 255, 255, 0.12);
}

.hours > div > div.empty {
    cursor: default;
    opacity: 0.3;
    color: #c6eef1;
}

#details {
    color: white;
}

#details>h4 {
    font-size: 1.26em;
    margin-bottom: 20px;
}

#details .detail {
    display: flex;
    line-height: 1.3;
    border: 1px solid #689aa2;
    padding: 8px 10px;
    font-size: 0.92em;
}

#details .detail>span:last-child {
    font-weight: 500;
}

#details .detail:not(:first-of-type) {
    border-top: none;
}

#details .label {
    width: 70px;
    color: #93c0c4;
}

#details .contactPer {
    margin-top: 20px;
    margin-bottom: 10px;
}

#details .radios {
    display: flex;
    gap: 12px;
}

#details .radios input {
    cursor: pointer;
}

#details label {
    background: #2a8492;
    transition: background 0.15s;
    cursor: pointer;
    padding: 13px 8px 15px;
    width: 140px;
    border-radius: 8px;
    display: flex;
}

#details label>span {
    font-size: 0.92em;
    margin-left: 1px;
}

#details label:hover {
    background: #328c9a;
}

#details .btnContainer {
    display: flex;
    gap: 24px;
    margin-top: 24px;
}
#details .btnContainer>button,
#cancelConfirmBtn {
    flex-grow: 1;
    padding: 15px 32px;
    background: none;
    border: none;
    color: #fff;
    font-family: "Segoe UI";
    font-weight: 500;
    border-radius: 6px;
    transition: background 0.1s, color 0.1s;
    cursor: pointer;
}
#details #editBtn {
    background: #379bff;
}
#details #cancelBtn,
#cancelConfirmBtn {
    background: #cf4e4e;
}
#details #editBtn:hover {
    background: #59abff;
}
#details #cancelBtn:hover,
#cancelConfirmBtn:hover {
    background: #e05656;
}
html.overlay::before {
    content: "";
    width: 100%;
    height: 100%;
    background: #0006;
    position: fixed;
    z-index: 5000;
    top: 0;
    left: 0;
    opacity: 1;
    transition: opacity 0.15s;
}
.cancelConfirmation {
    display: flex;
    flex-direction: column;
    color: rgba(25, 65, 104, 1);
    position: fixed;
    font-weight: 500;
    text-align: center;
    padding: 50px 40px;
    width: 90%;
    max-width: 500px;
    background: #ffff;
    border-radius: 10px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
}
.cancelConfirmation>p {
    margin: 0 0 28px 0;
}
.cancelConfirmation>.cross::after {
    position: absolute;
    content: "\002b";
    cursor: pointer;
    font-size: 45px;
    font-weight: 200;
    transform: rotateZ(45deg);
    top: -5px;
    right: 1px;
    line-height: 1;
    color: #a3b3d2;
}
.cancelConfirmation>.cross:hover::after {
    color: #bcc9e2;
}

#buchenBtn,
#weiterBtn {
    margin-top: 30px;
    border: none;
    outline: none;
    cursor: pointer;
    background: #00bdb1;
    transition: background 0.15s;
    color: #fff;
    padding: 17px 30px 20px;
    border-radius: 10px;
    font-weight: 500;
    font-family: inherit;
    line-height: 1;
    font-size: 1em;
}

#buchenBtn:hover,
#weiterBtn:hover{
    background: #00aa9f;
}

#gebucht {
    display: none;
    align-items: center;
    margin-top: 64px;
    margin-bottom: 60px;
    flex-direction: column;
}

#gebucht h4 {
    font-size: 1.3em;
    color: white;
}

#gebucht.success {
    display: flex;
}

h4.thankyou {
    padding: 15px 25px;
    color: #fff;
    font-weight: 600;
    font-size: 1.05em;
    line-height: 1.6;
    text-align: center;
}

.termin_date {
    margin-bottom: 4px;
}

#timezone {
    font-size: 0.85em;
    cursor: pointer;
    user-select: none;
}
#timezone:hover {
    text-decoration: underline;
}
#timeZoneList {
    width: 160px;
    position: absolute;
}
#timeZoneList.active {
    display: block;
}

.success-check polyline {
    animation: checkmark 0.25s ease-in-out 0.7s backwards
}

.success-check circle {
    animation: checkmark-circle 0.6s ease-in-out backwards;
}

.success-check circle#colored {
    animation: colored-circle 0.6s ease-in-out 0.7s backwards;
}




@keyframes checkmark {
    0% {
        stroke-dashoffset: 100px
    }

    100% {
        stroke-dashoffset: 0px
    }
}

@keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 258px
    }

    100% {
        stroke-dashoffset: 512px
    }
}

@keyframes colored-circle {
    0% {
        opacity: 0
    }

    100% {
        opacity: 100
    }
}

#terminLoading {
    opacity: 0;
    visibility: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.2s, visibility 0.2s;
    position: fixed;
    background: #07162866;
    height: 100%;
    width: 100%;
    z-index: 999999;
    top: 0;
    left: 0;
}

#terminLoading::after {
    content: " ";
    display: block;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 3px solid #ffffff;
    border-color: #ffffff transparent #ffffff transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}

#terminLoading.active {
    opacity: 1;
    visibility: visible;
}


#intro {
    background: #0003;
    padding: 15px;
    color: #fff;
    transition: opacity 0.15s;
    border-radius: 12px;
    width: 600px;
    margin: 15px auto;
    max-width: 94%;
}
#intro>img {
    border-radius: 12px;
}
#intro>h5 {
    margin: 10px 0 0 5px;
    font-size: 1.05em;
}
#intro>span {
    margin-left: 5px;
    font-size: 0.9em;
    opacity: 0.5;
}
#intro>.center {
    display: flex;
    align-items: center;
    margin: 17px 0 25px 5px;
    justify-content: center;
}
#intro>.center>img {
    width: 20px;
    transform: translateY(1px);
}
#intro h4 {
    font-weight: 500;
    margin-left: 7px;
}
#intro .small {
    color: #fff;
    padding-top: 10px;
    border-top: 1px solid #5f838e;
}
#intro .available {
    color: #a8e1e1;
    font-weight: 500;
}
#intro>.btn {
    background-color: #008a88;
    padding: 15px 30px;
    flex-shrink: 0;
    border-radius: 12px;
    transition: transform 0.35s, box-shadow 0.35s;
    text-align: center;
    outline: none;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 0.95em;
    font-family: inherit;
    font-weight: 500;
}

@media(max-width: 576px) {
    #intro {
        margin: 15px 0 0;
        width: 100%;
        max-width: none;
        border-radius: 0;
    }
}





.hidden {
    opacity: 0 !important;
}