.step {
    display: none;
}
.steps {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.steps p {
    display: flex;
    flex-direction: row;
    gap: 5px;
    font-family: "Open Sans", Sans-serif;
    font-size: 20px;
    line-height: 1.1em;
    align-items: center;
}
.steps svg {
    width: 40px;
}
.step.active {
    display: block;
}
.step-link.active .icon-text {
    color: #D6E03F;
}
.steps div {
    cursor: pointer;
    color: #FFFFFF;
    fill: #FFFFFF;
}
.spende-icon {
    display: inline-block;
    width: 46px;
    height: 46px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.step-link .spende-icon-herz {
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' width='46px' height='46px' viewBox='0 0 46 46'><path fill='%23FFFFFF' d='M23,46c12.7,0,23-10.3,23-23S35.7,0,23,0S0,10.3,0,23S10.3,46,23,46'/><path fill='%233a7865' d='M23,36.7c-0.3,0-0.5-0.1-0.7-0.3l-9.5-9.2c-0.1-0.1-0.2-0.2-0.4-0.4s-0.5-0.5-0.9-1c-0.4-0.5-0.7-1-1-1.5c-0.3-0.6-0.6-1.2-0.8-1.9c-0.2-0.7-0.4-1.4-0.4-2.1c-0.1-1.9,0.6-3.8,1.9-5.2c1.5-1.3,3.4-2,5.4-1.9c0.7,0,1.3,0.1,1.9,0.3c0.6,0.2,1.3,0.5,1.8,0.9c0.6,0.4,1,0.7,1.5,1c0.4,0.3,0.8,0.6,1.2,1c0.4-0.4,0.8-0.7,1.2-1c0.4-0.3,0.9-0.7,1.5-1c0.6-0.4,1.2-0.7,1.8-0.9c0.6-0.2,1.3-0.3,1.9-0.3c2-0.1,3.9,0.6,5.3,1.9c1.3,1.4,2,3.3,1.9,5.2c0,2.2-1.2,4.5-3.5,6.9l-9.5,9.1C23.5,36.6,23.3,36.7,23,36.7z'/></svg>");
}
.step-link.active .spende-icon-herz {
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' width='46px' height='46px' viewBox='0 0 46 46'><path fill='%23D6E03F' d='M23,46c12.7,0,23-10.3,23-23S35.7,0,23,0S0,10.3,0,23S10.3,46,23,46'/><path fill='%23FFFFFF' d='M23,36.7c-0.3,0-0.5-0.1-0.7-0.3l-9.5-9.2c-0.1-0.1-0.2-0.2-0.4-0.4s-0.5-0.5-0.9-1c-0.4-0.5-0.7-1-1-1.5c-0.3-0.6-0.6-1.2-0.8-1.9c-0.2-0.7-0.4-1.4-0.4-2.1c-0.1-1.9,0.6-3.8,1.9-5.2c1.5-1.3,3.4-2,5.4-1.9c0.7,0,1.3,0.1,1.9,0.3c0.6,0.2,1.3,0.5,1.8,0.9c0.6,0.4,1,0.7,1.5,1c0.4,0.3,0.8,0.6,1.2,1c0.4-0.4,0.8-0.7,1.2-1c0.4-0.3,0.9-0.7,1.5-1c0.6-0.4,1.2-0.7,1.8-0.9c0.6-0.2,1.3-0.3,1.9-0.3c2-0.1,3.9,0.6,5.3,1.9c1.3,1.4,2,3.3,1.9,5.2c0,2.2-1.2,4.5-3.5,6.9l-9.5,9.1C23.5,36.6,23.3,36.7,23,36.7z'/></svg>");
}
.step-link .spende-icon-mensch {
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='46px' height='46px' viewBox='0 0 46 46'><path fill='%23FFFFFF' d='M23,46c12.7,0,23-10.3,23-23S35.7,0,23,0S0,10.3,0,23S10.3,46,23,46'/><path fill='%233a7865' d='M23,11.1c-3.1,0-5.6,2.5-5.6,5.6c0,0,0,0,0,0c0,3.1,2.5,5.6,5.6,5.6c0,0,0,0,0,0c3.1,0,5.6-2.5,5.6-5.6c0,0,0,0,0,0C28.6,13.6,26.1,11.1,23,11.1C23,11.1,23,11.1,23,11.1 M33.3,28.3c0-0.5-0.1-1.1-0.2-1.6c-0.1-0.5-0.2-1.1-0.4-1.6c-0.2-0.5-0.4-1-0.6-1.4c-0.2-0.4-0.6-0.8-0.9-1.2c-0.4-0.3-0.8-0.6-1.3-0.8c-0.5-0.2-1.1-0.3-1.6-0.3c-0.2,0.1-0.4,0.2-0.6,0.3l-1.1,0.7c-0.5,0.3-1,0.5-1.6,0.7c-1.3,0.4-2.6,0.4-3.9,0c-0.6-0.2-1.1-0.4-1.6-0.7l-1.1-0.7c-0.2-0.1-0.4-0.3-0.6-0.3c-0.6,0-1.1,0.1-1.6,0.3c-0.5,0.2-0.9,0.4-1.3,0.8c-0.4,0.4-0.7,0.8-0.9,1.2c-0.3,0.5-0.5,0.9-0.6,1.4c-0.2,0.5-0.3,1.1-0.4,1.6c-0.1,0.5-0.2,1.1-0.2,1.6c0,0.5-0.1,1-0.1,1.5c-0.1,1,0.3,2,1.1,2.8c0.8,0.7,1.8,1.1,2.8,1h12.8c1,0.1,2.1-0.3,2.8-1c0.7-0.7,1.1-1.7,1.1-2.8C33.3,29.3,33.3,28.8,33.3,28.3'/></svg>");
}
.step-link.active .spende-icon-mensch {
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='46px' height='46px' viewBox='0 0 46 46'><path fill='%23D6E03F' d='M23,46c12.7,0,23-10.3,23-23S35.7,0,23,0S0,10.3,0,23S10.3,46,23,46'/><path fill='%23FFFFFF' d='M23,11.1c-3.1,0-5.6,2.5-5.6,5.6c0,0,0,0,0,0c0,3.1,2.5,5.6,5.6,5.6c0,0,0,0,0,0c3.1,0,5.6-2.5,5.6-5.6c0,0,0,0,0,0C28.6,13.6,26.1,11.1,23,11.1C23,11.1,23,11.1,23,11.1 M33.3,28.3c0-0.5-0.1-1.1-0.2-1.6c-0.1-0.5-0.2-1.1-0.4-1.6c-0.2-0.5-0.4-1-0.6-1.4c-0.2-0.4-0.6-0.8-0.9-1.2c-0.4-0.3-0.8-0.6-1.3-0.8c-0.5-0.2-1.1-0.3-1.6-0.3c-0.2,0.1-0.4,0.2-0.6,0.3l-1.1,0.7c-0.5,0.3-1,0.5-1.6,0.7c-1.3,0.4-2.6,0.4-3.9,0c-0.6-0.2-1.1-0.4-1.6-0.7l-1.1-0.7c-0.2-0.1-0.4-0.3-0.6-0.3c-0.6,0-1.1,0.1-1.6,0.3c-0.5,0.2-0.9,0.4-1.3,0.8c-0.4,0.4-0.7,0.8-0.9,1.2c-0.3,0.5-0.5,0.9-0.6,1.4c-0.2,0.5-0.3,1.1-0.4,1.6c-0.1,0.5-0.2,1.1-0.2,1.6c0,0.5-0.1,1-0.1,1.5c-0.1,1,0.3,2,1.1,2.8c0.8,0.7,1.8,1.1,2.8,1h12.8c1,0.1,2.1-0.3,2.8-1c0.7-0.7,1.1-1.7,1.1-2.8C33.3,29.3,33.3,28.8,33.3,28.3'/></svg>");
}
.step-link .spende-icon-euro {
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='46px' height='46px' viewBox='0 0 46 46'><path fill='%23FFFFFF' d='M23,46c12.7,0,23-10.3,23-23S35.7,0,23,0S0,10.3,0,23S10.3,46,23,46'/><path fill='%233a7865' d='M27.7,15.9c0.6,0.2,1.3,0.4,1.9,0.7l1.5-3.4c-1.6-0.8-3.4-1.2-5.2-1.2c-2.2-0.1-4.3,0.7-6,2.1c-1.6,1.5-2.7,3.5-2.9,5.6h-2v2.6h1.7v0.8c0,0.3,0,0.6,0.1,0.9H15v2.6h2c0.3,2.1,1.3,4,2.9,5.4c1.7,1.4,3.8,2.1,5.9,2c1.5,0.1,3-0.2,4.3-0.9v-3.8c-1.3,0.6-2.7,0.8-4,0.8c-2.7,0-4.2-1.2-4.7-3.6h5V24h-5.2v-0.5v-0.7v-0.5h6.2v-2.6h-5.9c0.1-1.1,0.7-2.2,1.5-3c0.8-0.7,1.9-1.1,3-1C26.5,15.7,27.1,15.8,27.7,15.9'/></svg>");
}
.step-link.active .spende-icon-euro {
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='46px' height='46px' viewBox='0 0 46 46'><path fill='%23D6E03F' d='M23,46c12.7,0,23-10.3,23-23S35.7,0,23,0S0,10.3,0,23S10.3,46,23,46'/><path fill='%23FFFFFF' d='M27.7,15.9c0.6,0.2,1.3,0.4,1.9,0.7l1.5-3.4c-1.6-0.8-3.4-1.2-5.2-1.2c-2.2-0.1-4.3,0.7-6,2.1c-1.6,1.5-2.7,3.5-2.9,5.6h-2v2.6h1.7v0.8c0,0.3,0,0.6,0.1,0.9H15v2.6h2c0.3,2.1,1.3,4,2.9,5.4c1.7,1.4,3.8,2.1,5.9,2c1.5,0.1,3-0.2,4.3-0.9v-3.8c-1.3,0.6-2.7,0.8-4,0.8c-2.7,0-4.2-1.2-4.7-3.6h5V24h-5.2v-0.5v-0.7v-0.5h6.2v-2.6h-5.9c0.1-1.1,0.7-2.2,1.5-3c0.8-0.7,1.9-1.1,3-1C26.5,15.7,27.1,15.8,27.7,15.9'/></svg>");
}
.steps div.active {
    color: #FFFFFF;
}
.step-link.active {
    font-weight: bold;
    color: #007BFF;
}
.error {
    border: 2px solid red;
}
.donation-form {
    font-family: "Open Sans", Sans-serif;
    color: #FFFFFF;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.donation-form p, .integrate-cf7-to-elementor p {
    margin-bottom: 10px !important;
}
.integrate-cf7-to-elementor-btn {
    margin-top: 1.5rem;
}
.integrate-cf7-to-elementor-btn > p {
    display: flex;
    flex-direction: row-reverse;
}
.wpcf7-not-valid-tip {
    color: #D6E03F !important;
}
.integrate-cf7-to-elementor-btn .wpcf7-form-control {
    padding: 12px 35px 12px 35px;
}
.error-tooltip {
    display: inline-block;
    margin-top: 0.5rem;
    background-color: #f44336;
    color: white;
    font-size: 15px;
    padding: 6px;
    border-radius: 4px;
    position: relative;
}

.error-tooltip::after {
    content: '';
    position: absolute;
    top: 50%;
    left: -6px;
    transform: translateY(-50%);
    border: 6px solid transparent;
    border-right-color: #f44336;
}

.donation-form, .integrate-cf7-to-elementor {
    color: #ffffff;
    font-family: "Open Sans", Sans-serif;
    font-size: 17px;
    font-weight: 400;
}

.donation-form select, .integrate-cf7-to-elementor select {
    height: 38px;
}
.donation-aside {
    background-color: #F3F4F3;
}
#spenden {
    margin: 2rem 0 2rem 0;
}
.donation-form .wpcf7-select, .integrate-cf7-to-elementor .wpcf7-select {
    border-radius: 25px;
    padding: 8px 16px;
    color: #1f2124;
    font-size: 15px;
    line-height: 1.4;
    min-height: 40px;
}
.donation-form-grid, .integrate-cf7-to-elementor-grid  {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

@media (max-width: 1200px) {
    .spende-icon {
        width: 30px;
        height: 30px;
    }
}

@media (min-width: 992px) {
    .donation-form-grid.two-cols, .integrate-cf7-to-elementor-grid.two-cols {
        grid-template-columns: 1fr 1fr;
    }
}
.donation-form .form-group, .integrate-cf7-to-elementor .form-group {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}

.donation-form .form-group label, .integrate-cf7-to-elementor .form-group label {
    margin-bottom: 10px;
}

.donation-form .form-group input[type=text],
.donation-form .form-group select,
.donation-form .form-group textarea,
.integrate-cf7-to-elementor .form-group input[type=text],
.integrate-cf7-to-elementor .form-group select,
.integrate-cf7-to-elementor .form-group textarea {
    width: 100%;
    padding: 8px 16px;
    box-sizing: border-box;
    height: 40px;
    border-radius: 25px;
}
.donation-form input[type=text],
.donation-form input[type=number],
.donation-form input[type=email],
.donation-form input[type=tel],
.integrate-cf7-to-elementor input[type=text],
.integrate-cf7-to-elementor input[type=number],
.integrate-cf7-to-elementor  input[type=email],
.integrate-cf7-to-elementor input[type=tel] {
    border-radius: 25px;
}
.donation-form .form-group input[type="radio"],
.integrate-cf7-to-elementor .form-group input[type="radio"] {
    width: 20px;
}

.donation-banner {
    position: relative;
    background-image: url('../assets/img/jetzt_spenden.jpg');
    background-size: cover;
    background-position: center;
    color: white;
    padding: 200px 80px;
    overflow: hidden;
}

.donation-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 101, 46, 0.5);
    z-index: 1;
}

.banner-content {
    position: relative;
    z-index: 2;
    max-width: 1250px;
    padding-right: 8%;
    margin-left: auto;
    margin-right: auto;
}
.banner-content-inner h2 {
    margin-bottom: 1.5rem;
}
.banner-content-inner h3 {
    margin-bottom: 1.3rem;
}

.payment-method .wpcf7-list-item {
    font-size: 0;
}
.payment-method {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-top: 1rem;
}

.payment-method .wpcf7-list-item-label {
    background: white;
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 50px;
    height: 50px;
}
.donation-form .payment-method.wpcf7-radio span.wpcf7-list-item input[type=radio]+span:before {
    border-radius: 100%;
    z-index: 10;
}


.donation-form input[type="radio"],
.integrate-cf7-to-elementor input[type="radio"] {
    display: none;
}

.donation-form .spende-radio-element .wpcf7-list-item label {
    position: relative;
    padding-left: 30px;
    cursor: pointer;
}

.donation-form .spende-radio-element .wpcf7-list-item label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    border: 2px solid #D6E03F;
    border-radius: 50%;
    background: #fff;
    box-sizing: border-box;
}

.donation-form .spende-radio-element input[type="radio"]:checked + span::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    background: #D6E03F;
    border-radius: 50%;
}


.donation-form .spende-radio-element .wpcf7-list-item label {
    position: relative;
}

.donation-form .spende-radio-element .wpcf7-list-item label span::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: transparent;
    border-radius: 50%;
}
.donation-form .spende-radio-element input[type="radio"]:checked + span::before {
    background: #26BA68;
}
.wpcf7 select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 2.5em;
    background: #fff url('data:image/svg+xml;utf8,<svg fill="black" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>') no-repeat right 0.75em center;
    background-size: 1.5em;
    border-radius: 999px;
}

.donation-form .wpcf7-list-item,
.integrate-cf7-to-elementor .wpcf7-list-item {
    margin: 0 2rem 0 0 !important;
}
.donation-form a,
.integrate-cf7-to-elementor a {
    color: #D6E03F !important;
}
.container-button-spenden {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
}
.container-button-spenden p {
    display: flex;
    justify-content: flex-end;
    flex-direction: row;
    gap: 10px;
}
.container-button-spenden p button, .wpcf7-submit,
.donation-form input[type=submit],
.integrate-cf7-to-elementor input[type=submit] {
    background-image: linear-gradient(90deg, #00652E 0%, #00AE4D 100%);
    padding: 12px 35px 12px 35px;
    min-height: 40px;
    line-height: 1;
    border: 1px solid #00652E;
}
.donation-form input[type=date]:focus,
.donation-form input[type=email]:focus,
.donation-form input[type=number]:focus,
.donation-form input[type=password]:focus,
.donation-form input[type=search]:focus,
.donation-form input[type=tel]:focus,
.donation-form input[type=text]:focus,
.donation-form input[type=url]:focus,
.donation-form select:focus,
.donation-form textarea:focus,
.integrate-cf7-to-elementor input[type=date]:focus,
.integrate-cf7-to-elementor input[type=email]:focus,
.integrate-cf7-to-elementor input[type=number]:focus,
.integrate-cf7-to-elementor input[type=password]:focus,
.integrate-cf7-to-elementor input[type=search]:focus,
.integrate-cf7-to-elementor input[type=tel]:focus,
.integrate-cf7-to-elementor input[type=text]:focus,
.integrate-cf7-to-elementor input[type=url]:focus,
.integrate-cf7-to-elementor select:focus,
.integrate-cf7-to-elementor textarea:focus {
    border: 1px solid #666;
    outline: none;
}
.icon-required {
    color: #D6E03F;
    padding-inline-start: .2em;
    font-size: 18px;
}
.donation-form p.mb-custom,
.integrate-cf7-to-elementor p.mb-custom {
    margin-bottom: 1.5rem !important;
}
.donation-form input[type=checkbox],
.integrate-cf7-to-elementor input[type=checkbox] {
    width: 30px;
    height: 15px;
}
.donation-form .wpcf7-acceptance,
.integrate-cf7-to-elementor .wpcf7-acceptance {
    margin-top: 1rem;
    display: inline-block;
}
.donation-form .wpcf7-acceptance label,
.integrate-cf7-to-elementor .wpcf7-acceptance label {
    line-height: 1.5rem;
}

.wpcf7 form .wpcf7-response-output {
    color: #FFFFFF !important;
}
.button-jetzt-spenden {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center ;
    width: fit-content;
    background-image: linear-gradient(-90deg, #FFBC00 0%, #CC9701 62%);
    padding: 10px 25px;
    border-radius: 25px;
    gap: 5px;
    font-family: "Open Sans", Sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
}
.button-jetzt-spenden svg {
    height: 18px;
    width: auto;
}
.button-jetzt-spenden svg path {
    fill: #FFFFFF;
}
.button-jetzt-spenden {
    color: #FFFFFF !important;
    text-decoration: none !important;
}
.button-jetzt-spenden:hover {
    color: #FFFFFF !important;
    background-image: linear-gradient(-90deg, #CC9701 10%, #FFBC00 90%);
    text-decoration: none !important;
}

@media (max-width: 900px) {
    .steps {
        flex-direction: column;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}
@media (max-width: 1200px) {
    .banner-content-inner {
        max-width: 100%;
    }
}
.integrate-cf7-to-elementor {
    max-width: 65%;
}
.cf7-field {
    padding-bottom: 10px;
    display: inline-block;
}
@media (max-width: 991px) {
    .integrate-cf7-to-elementor {
        max-width: 100%;
    }
    .donation-form-grid,
    .integrate-cf7-to-elementor-grid {
        gap: 0;
    }
    .banner-content {
        padding: 0;
    }
    .donation-banner {
        padding: 100px 8% 200px 8%
    }
    .donation-banner {
        background-image: url('../assets/img/jetzt_spenden_mobile.jpg');
    }
    .payment-method {
        flex-direction: column;
        justify-content: flex-start;
        flex-wrap: wrap;
        align-items: start;
    }
    .donation-form .form-group,
    .integrate-cf7-to-elementor .form-group {
        flex-wrap: wrap;
        justify-content: start;
        gap: 0;
    }
    .donation-form .form-group.container-button-spenden p,
    .integrate-cf7-to-elementor .form-group.container-button-spenden p {
        display: flex;
        flex-direction: column;
        gap: 0;
        justify-content: start;
        flex-wrap: wrap;
    }
}