.multi-step-form a {
    color: #2d71a1;
    text-decoration: underline;
}

.multi-step-form div {
    color:#000;
}
.multi-step-form p {
    color:#000;
    text-align: start;
}

div.invalid-feedback {
    color:#dc3545;
    font-weight:bold;
}

.multi-step-form a.cta-btn {
    color:#fff;
    text-decoration: none;
}
.multi-step-form a.cta-btn:hover {
    color:#E08D79;
}

.multi-step-form .progress-bar {
    background-color: #E08D79 !important;
}

.modal.modal-static .modal-dialog {
     transform: scale(1.0);
}

.form-control:disabled {
    border: 0;
    background-color: #fff;
}
.cta-btn {
    font-size:1rem;
}
.my-btn-info {
    border-color: darkgrey;
    background-color: lightgrey;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding: 7px !important;
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-padding-y: 0.375rem;
}

.form-label {
    margin-bottom: .1rem;
    color:#000;
}
.form-check-label {
    color:#000;
}

.my-info {
    font-size: 0.875em;
}

.form-check-input:disabled~.form-check-label,
.form-check-input[disabled]~.form-check-label {
    opacity: 1;
}

.multi-step-form .my-btn-previous {
    --bs-btn-color: #000;
    --bs-btn-bg: #d3d4d5;
    --bs-btn-border-color: #f8f9fa;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #f8f9fa;
    --bs-btn-hover-border-color: #c6c7c8;
    --bs-btn-focus-shadow-rgb: 211, 212, 213;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #c6c7c8;
    --bs-btn-active-border-color: #babbbc;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #f8f9fa;
    --bs-btn-disabled-border-color: #f8f9fa;
    color: #000;
    text-decoration: none;
}

#formModal .form-check {
    padding-left: 0;
}

#formModal .form-check-input[type=radio] {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

#formModal .form-check-input:checked+label {
    background: #2d71a1;
    background: linear-gradient(-45deg, #1391a5, #274685);
    color: #fff;
    box-shadow: 0 10px 30px 0 rgb(0 0 0 / 15%);
}

#formModal .form-check-label {
    width: 100%;
}


/*Fortschritt*/

#formModal .list-inline {
    margin-bottom: 0;
}

#formModal li.list-inline-item {
    font-size: .95em;
}

fieldset legend {
    font-size: unset;
}

@media (min-width:768px) {
    #formModal li.list-inline-item {
        padding: 0 1.25em;
        font-size: 1em;
    }
}

/* HTML: <div class="loader"></div> */
.loader {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 8px solid #0d6efd;
    animation:
        l20-1 0.8s infinite linear alternate,
        l20-2 1.6s infinite linear;
}

@keyframes l20-1 {
    0% {
        clip-path: polygon(50% 50%, 0 0, 50% 0%, 50% 0%, 50% 0%, 50% 0%, 50% 0%)
    }

    12.5% {
        clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%)
    }

    25% {
        clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 100% 100%, 100% 100%)
    }

    50% {
        clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 50% 100%, 0% 100%)
    }

    62.5% {
        clip-path: polygon(50% 50%, 100% 0, 100% 0%, 100% 0%, 100% 100%, 50% 100%, 0% 100%)
    }

    75% {
        clip-path: polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 50% 100%, 0% 100%)
    }

    100% {
        clip-path: polygon(50% 50%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 0% 100%)
    }
}

@keyframes l20-2 {
    0% {
        transform: scaleY(1) rotate(0deg)
    }

    49.99% {
        transform: scaleY(1) rotate(135deg)
    }

    50% {
        transform: scaleY(-1) rotate(0deg)
    }

    100% {
        transform: scaleY(-1) rotate(-135deg)
    }
}

img#webid {
    max-width: 170px;
}