injoy-pottfit.tenolo.cloud
Open in
urlscan Pro
128.140.81.111
Public Scan
URL:
https://injoy-pottfit.tenolo.cloud/
Submission: On February 14 via api from US — Scanned from US
Submission: On February 14 via api from US — Scanned from US
Form analysis
7 forms found in the DOM<form class="">
<style data-mantine-styles="inline">
.__m__-R6rarmrdbdmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 2;
}
</style>
<div class="m-2415a157 mantine-SimpleGrid-root __m__-R6rarmrdbdmrffbla">
<div class=""><label style="margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label">Mindestlaufzeit</label>
<div class="m-80d6d844 mantine-ButtonGroup-group" data-orientation="horizontal" role="group"><button
style="--button-height:var(--button-height-md);--button-padding-x:var(--button-padding-x-md);--button-fz:var(--mantine-font-size-md);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-dark-blue-filled);--button-hover:var(--mantine-color-brand-dark-blue-filled-hover);--button-color:var(--mantine-color-white);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-right:var(--mantine-spacing-sm);padding-left:var(--mantine-spacing-sm)"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-variant="filled" data-size="md" data-block="true" type="button"><span
class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span
class="m-80f1301b mantine-Button-inner"><span class="m-811560b9 mantine-Button-label">24 Monate</span></span></button><button
style="--button-height:var(--button-height-md);--button-padding-x:var(--button-padding-x-md);--button-fz:var(--mantine-font-size-md);--button-radius:var(--mantine-radius-xl);--button-bg:transparent;--button-hover:var(--mantine-color-brand-dark-blue-outline-hover);--button-color:var(--mantine-color-brand-dark-blue-outline);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-brand-dark-blue-outline);padding-right:var(--mantine-spacing-sm);padding-left:var(--mantine-spacing-sm)"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-variant="outline" data-size="md" data-block="true" type="button"><span
class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span
class="m-80f1301b mantine-Button-inner"><span class="m-811560b9 mantine-Button-label">12 Monate</span></span></button><button
style="--button-height:var(--button-height-md);--button-padding-x:var(--button-padding-x-md);--button-fz:var(--mantine-font-size-md);--button-radius:var(--mantine-radius-xl);--button-bg:transparent;--button-hover:var(--mantine-color-brand-dark-blue-outline-hover);--button-color:var(--mantine-color-brand-dark-blue-outline);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-brand-dark-blue-outline);padding-right:var(--mantine-spacing-sm);padding-left:var(--mantine-spacing-sm)"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-variant="outline" data-size="md" data-block="true" type="button"><span
class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span
class="m-80f1301b mantine-Button-inner"><span class="m-811560b9 mantine-Button-label">1 Monat</span></span></button></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-DatePickerInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-DatePickerInput-label"
data-size="md" for="mantine-je42n6t85" id="mantine-je42n6t85-label">Vertragsbeginn</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-DatePickerInput-wrapper" data-variant="default" data-size="md" data-multiline="true"
data-with-right-section="true"><button class="Input_input__HKLMz m-6fa5e2aa m-8fb7ebe7 mantine-Input-input mantine-DatePickerInput-input" data-variant="default" aria-label="February 15, 2024" data-dates-input="true" type="button"
aria-haspopup="dialog" aria-expanded="false" aria-controls="mantine-w653l9219-dropdown" aria-invalid="false" id="mantine-je42n6t85">February 15, 2024</button>
<div data-position="right" class="m-82577fc2 mantine-Input-section mantine-DatePickerInput-section"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar-month">
<path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z"></path>
<path d="M16 3v4"></path>
<path d="M8 3v4"></path>
<path d="M4 11h16"></path>
<path d="M7 14h.013"></path>
<path d="M10.01 14h.005"></path>
<path d="M13.01 14h.005"></path>
<path d="M16.015 14h.005"></path>
<path d="M13.015 17h.005"></path>
<path d="M7.01 17h.005"></path>
<path d="M10.01 17h.005"></path>
</svg></div>
</div>
</div><input type="hidden" value="2024-02-15T10:00:00.000Z">
</div>
<div style="margin-top:calc(2.5rem * var(--mantine-scale))" class="m-46b77525 mantine-InputWrapper-root mantine-RadioGroup-root">
<div role="radiogroup" aria-labelledby="mantine-z39dnrai2-label">
<style data-mantine-styles="inline">
.__m__-R1rqrarmrdbdmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 2;
}
</style>
<div class="m-2415a157 mantine-SimpleGrid-root __m__-R1rqrarmrdbdmrffbla"><label class="relative cursor-pointer m-e615b15f mantine-Card-root m-1b7284a3 mantine-Paper-root"
style="--paper-radius: var(--mantine-radius-lg); --paper-shadow: var(--mantine-shadow-xl); padding: var(--mantine-spacing-lg);"><span class="absolute top-4 right-4">
<div class="m-f3f1af94 mantine-Radio-root m-5f75b09e mantine-Radio-root" data-size="xl" data-label-position="right"
style="--radio-size: var(--radio-size-xl); --radio-radius: var(--mantine-radius-xl); --radio-color: var(--mantine-color-black); --radio-icon-size: var(--radio-icon-size-xl); --radio-size-xl: 34px; --label-fz: var(--mantine-font-size-xl); --label-lh: var(--label-lh-xl);">
<div class="m-5f6e695e mantine-Radio-body">
<div class="m-89c4f5e4 mantine-Radio-inner" data-label-position="right"><input class="mantine-focus-auto m-8a3dbb89 mantine-Radio-radio" id="mantine-h8434fr2n" type="radio" value="65ca0bebac97b5e298fc4734" name="mantine-g6prz3y4c"
style="border-color: black;">
<div class="absolute inset-0 m-4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="tabler-icon tabler-icon-check">
<path d="M5 12l5 5l10 -10"></path>
</svg></div>
</div>
<div class="m-d3ea56bb mantine-Radio-labelWrapper"></div>
</div>
</div>
</span>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="color: var(--mantine-color-dimmed);">Premium YOU</p>
<div class="m-8a5d1357 mantine-Title-root" data-order="6"
style="--title-fw: var(--mantine-h6-font-weight); --title-lh: var(--mantine-h6-line-height); --title-fz: var(--mantine-h6-font-size); margin-top: var(--mantine-spacing-lg); font-size: var(--mantine-font-size-lg);">Schüler/Studenten/Azubis
Abo</div>
<div class="m-4081bf90 mantine-Group-root" style="--group-gap: var(--mantine-spacing-xs); --group-align: baseline; --group-justify: flex-start; --group-wrap: wrap;">
<h5 class="m-8a5d1357 mantine-Title-root" data-order="5"
style="--title-fw: var(--mantine-h5-font-weight); --title-lh: var(--mantine-h5-line-height); --title-fz: var(--mantine-h5-font-size); margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-brand-light-blue-text);">45 €/Monat
</h5>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" data-size="sm" style="--text-fz: var(--mantine-font-size-sm); --text-lh: var(--mantine-line-height-sm); color: var(--mantine-color-dimmed);">anstatt 65 €</p>
</div>
</label><label class="relative cursor-pointer m-e615b15f mantine-Card-root m-1b7284a3 mantine-Paper-root" style="--paper-radius: var(--mantine-radius-lg); --paper-shadow: var(--mantine-shadow-xl); padding: var(--mantine-spacing-lg);"><span
class="absolute top-4 right-4">
<div class="m-f3f1af94 mantine-Radio-root m-5f75b09e mantine-Radio-root" data-size="xl" data-label-position="right"
style="--radio-size: var(--radio-size-xl); --radio-radius: var(--mantine-radius-xl); --radio-color: var(--mantine-color-black); --radio-icon-size: var(--radio-icon-size-xl); --radio-size-xl: 34px; --label-fz: var(--mantine-font-size-xl); --label-lh: var(--label-lh-xl);">
<div class="m-5f6e695e mantine-Radio-body">
<div class="m-89c4f5e4 mantine-Radio-inner" data-label-position="right"><input class="mantine-focus-auto m-8a3dbb89 mantine-Radio-radio" id="mantine-nyzh5nnmn" type="radio" value="65ca0be5ac97b5e298fc4724" name="mantine-g6prz3y4c"
style="border-color: black;">
<div class="absolute inset-0 m-4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="tabler-icon tabler-icon-check">
<path d="M5 12l5 5l10 -10"></path>
</svg></div>
</div>
<div class="m-d3ea56bb mantine-Radio-labelWrapper"></div>
</div>
</div>
</span>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="color: var(--mantine-color-dimmed);">Premium</p>
<div class="m-8a5d1357 mantine-Title-root" data-order="6"
style="--title-fw: var(--mantine-h6-font-weight); --title-lh: var(--mantine-h6-line-height); --title-fz: var(--mantine-h6-font-size); margin-top: var(--mantine-spacing-lg); font-size: var(--mantine-font-size-lg);">Klassisches Abo</div>
<div class="m-4081bf90 mantine-Group-root" style="--group-gap: var(--mantine-spacing-xs); --group-align: baseline; --group-justify: flex-start; --group-wrap: wrap;">
<h5 class="m-8a5d1357 mantine-Title-root" data-order="5"
style="--title-fw: var(--mantine-h5-font-weight); --title-lh: var(--mantine-h5-line-height); --title-fz: var(--mantine-h5-font-size); margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-brand-light-blue-text);">65 €/Monat
</h5>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" data-size="sm" style="--text-fz: var(--mantine-font-size-sm); --text-lh: var(--mantine-line-height-sm); color: var(--mantine-color-dimmed);">anstatt 85 €</p>
</div>
</label></div>
</div>
</div><button
style="--button-height:var(--button-height-lg);--button-padding-x:var(--button-padding-x-lg);--button-fz:var(--mantine-font-size-lg);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-yellow-filled);--button-hover:var(--mantine-color-brand-yellow-filled-hover);--button-color:var(--mantine-color-black);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-top:calc(2.5rem * var(--mantine-scale))"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-size="lg" type="submit"><span class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span
style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-80f1301b mantine-Button-inner"><span
class="m-811560b9 mantine-Button-label">Weiter</span></span></button>
</form>
<form class="">
<div class="m-46b77525 mantine-InputWrapper-root mantine-CheckboxGroup-root">
<div role="group" aria-labelledby="mantine-jxlv5hvcg-label">
<style data-mantine-styles="inline">
.__m__-Rtmrbbmrdbdmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 1;
}
@media(min-width: 75em) {
.__m__-Rtmrbbmrdbdmrffbla {
--sg-cols: 2;
}
}
@media(min-width: 100em) {
.__m__-Rtmrbbmrdbdmrffbla {
--sg-cols: 3;
}
}
</style>
<div class="m-2415a157 mantine-SimpleGrid-root __m__-Rtmrbbmrdbdmrffbla"><label class="relative cursor-pointer m-e615b15f mantine-Card-root m-1b7284a3 mantine-Paper-root"
style="--paper-radius: var(--mantine-radius-lg); --paper-shadow: var(--mantine-shadow-xl); padding: var(--mantine-spacing-lg);">
<div class="m-4081bf90 mantine-Group-root" style="--group-gap: var(--mantine-spacing-lg); --group-align: center; --group-justify: space-between; --group-wrap: wrap;">
<h6 class="m-8a5d1357 mantine-Title-root" data-order="6" style="--title-fw: var(--mantine-h6-font-weight); --title-lh: var(--mantine-h6-line-height); --title-fz: var(--mantine-h6-font-size); font-size: var(--mantine-font-size-lg);">Spar
Abo</h6>
<div class="m-bf2d988c mantine-Checkbox-root m-5f75b09e mantine-Checkbox-root" data-size="xl" data-label-position="right"
style="--checkbox-size: var(--checkbox-size-xl); --checkbox-radius: var(--mantine-radius-xl); --checkbox-color: var(--mantine-color-black); --checkbox-size-xl: 34px; --label-fz: var(--mantine-font-size-xl); --label-lh: var(--label-lh-xl);">
<div class="m-5f6e695e mantine-Checkbox-body">
<div class="m-26062bec mantine-Checkbox-inner" data-label-position="right"><input class="mantine-focus-auto m-26063560 mantine-Checkbox-input" id="mantine-y1mnypmb9" type="checkbox" value="65ca0e32ac97b5e298fc47af"
style="border-color: black;">
<div class="absolute inset-0 m-4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="tabler-icon tabler-icon-check">
<path d="M5 12l5 5l10 -10"></path>
</svg></div>
</div>
<div class="m-d3ea56bb mantine-Checkbox-labelWrapper"></div>
</div>
</div>
</div>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-brand-light-blue-text); font-size: calc(1.5rem * var(--mantine-scale)); font-weight: bold;">10 €/Monat</p>
<div class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-dimmed);">Jeder Eiweißshake für 50 Prozent Rabatt </div>
</label><label class="relative cursor-pointer m-e615b15f mantine-Card-root m-1b7284a3 mantine-Paper-root" style="--paper-radius: var(--mantine-radius-lg); --paper-shadow: var(--mantine-shadow-xl); padding: var(--mantine-spacing-lg);">
<div class="m-4081bf90 mantine-Group-root" style="--group-gap: var(--mantine-spacing-lg); --group-align: center; --group-justify: space-between; --group-wrap: wrap;">
<h6 class="m-8a5d1357 mantine-Title-root" data-order="6" style="--title-fw: var(--mantine-h6-font-weight); --title-lh: var(--mantine-h6-line-height); --title-fz: var(--mantine-h6-font-size); font-size: var(--mantine-font-size-lg);">Kaffee
Flat</h6>
<div class="m-bf2d988c mantine-Checkbox-root m-5f75b09e mantine-Checkbox-root" data-size="xl" data-label-position="right"
style="--checkbox-size: var(--checkbox-size-xl); --checkbox-radius: var(--mantine-radius-xl); --checkbox-color: var(--mantine-color-black); --checkbox-size-xl: 34px; --label-fz: var(--mantine-font-size-xl); --label-lh: var(--label-lh-xl);">
<div class="m-5f6e695e mantine-Checkbox-body">
<div class="m-26062bec mantine-Checkbox-inner" data-label-position="right"><input class="mantine-focus-auto m-26063560 mantine-Checkbox-input" id="mantine-uucucbvzg" type="checkbox" value="65ca0e23ac97b5e298fc4795"
style="border-color: black;">
<div class="absolute inset-0 m-4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="tabler-icon tabler-icon-check">
<path d="M5 12l5 5l10 -10"></path>
</svg></div>
</div>
<div class="m-d3ea56bb mantine-Checkbox-labelWrapper"></div>
</div>
</div>
</div>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-brand-light-blue-text); font-size: calc(1.5rem * var(--mantine-scale)); font-weight: bold;">10 €/Monat</p>
<div class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-dimmed);">Trinke so viel Kaffee, wie du möchtest</div>
</label><label class="relative cursor-pointer m-e615b15f mantine-Card-root m-1b7284a3 mantine-Paper-root" style="--paper-radius: var(--mantine-radius-lg); --paper-shadow: var(--mantine-shadow-xl); padding: var(--mantine-spacing-lg);">
<div class="m-4081bf90 mantine-Group-root" style="--group-gap: var(--mantine-spacing-lg); --group-align: center; --group-justify: space-between; --group-wrap: wrap;">
<h6 class="m-8a5d1357 mantine-Title-root" data-order="6" style="--title-fw: var(--mantine-h6-font-weight); --title-lh: var(--mantine-h6-line-height); --title-fz: var(--mantine-h6-font-size); font-size: var(--mantine-font-size-lg);">Sauna
Flat</h6>
<div class="m-bf2d988c mantine-Checkbox-root m-5f75b09e mantine-Checkbox-root" data-size="xl" data-label-position="right"
style="--checkbox-size: var(--checkbox-size-xl); --checkbox-radius: var(--mantine-radius-xl); --checkbox-color: var(--mantine-color-black); --checkbox-size-xl: 34px; --label-fz: var(--mantine-font-size-xl); --label-lh: var(--label-lh-xl);">
<div class="m-5f6e695e mantine-Checkbox-body">
<div class="m-26062bec mantine-Checkbox-inner" data-label-position="right"><input class="mantine-focus-auto m-26063560 mantine-Checkbox-input" id="mantine-w1jjbodce" type="checkbox" value="65ca0e1bac97b5e298fc477b"
style="border-color: black;">
<div class="absolute inset-0 m-4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="tabler-icon tabler-icon-check">
<path d="M5 12l5 5l10 -10"></path>
</svg></div>
</div>
<div class="m-d3ea56bb mantine-Checkbox-labelWrapper"></div>
</div>
</div>
</div>
<p class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-brand-light-blue-text); font-size: calc(1.5rem * var(--mantine-scale)); font-weight: bold;">15 €/Monat</p>
<div class="mantine-focus-auto m-b6d8b162 mantine-Text-root" style="margin-top: var(--mantine-spacing-sm); color: var(--mantine-color-dimmed);">Täglich nutzbar zu den Sauna Öffnungszeiten</div>
</label></div>
</div>
</div><button
style="--button-height:var(--button-height-lg);--button-padding-x:var(--button-padding-x-lg);--button-fz:var(--mantine-font-size-lg);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-yellow-filled);--button-hover:var(--mantine-color-brand-yellow-filled-hover);--button-color:var(--mantine-color-black);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-top:calc(2.5rem * var(--mantine-scale))"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-size="lg" type="submit"><span class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span
style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-80f1301b mantine-Button-inner"><span
class="m-811560b9 mantine-Button-label">Nächster Schritt</span></span></button>
</form>
<form class="">
<style data-mantine-styles="inline">
.__m__-R6rarmrdddmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 1;
}
@media(min-width: 36em) {
.__m__-R6rarmrdddmrffbla {
--sg-cols: 2;
}
}
</style>
<div class="m-2415a157 mantine-SimpleGrid-root __m__-R6rarmrdddmrffbla">
<div class=""><label style="margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label">Geschlecht</label>
<div class="m-80d6d844 mantine-ButtonGroup-group" data-orientation="horizontal" role="group"><button
style="--button-height:var(--button-height-md);--button-padding-x:var(--button-padding-x-md);--button-fz:var(--mantine-font-size-md);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-dark-blue-filled);--button-hover:var(--mantine-color-brand-dark-blue-filled-hover);--button-color:var(--mantine-color-white);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-right:var(--mantine-spacing-sm);padding-left:var(--mantine-spacing-sm)"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-variant="filled" data-size="md" data-block="true" type="button"><span
class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span
class="m-80f1301b mantine-Button-inner"><span class="m-811560b9 mantine-Button-label">Männlich</span></span></button><button
style="--button-height:var(--button-height-md);--button-padding-x:var(--button-padding-x-md);--button-fz:var(--mantine-font-size-md);--button-radius:var(--mantine-radius-xl);--button-bg:transparent;--button-hover:var(--mantine-color-brand-dark-blue-outline-hover);--button-color:var(--mantine-color-brand-dark-blue-outline);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-brand-dark-blue-outline);padding-right:var(--mantine-spacing-sm);padding-left:var(--mantine-spacing-sm)"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-variant="outline" data-size="md" data-block="true" type="button"><span
class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span
class="m-80f1301b mantine-Button-inner"><span class="m-811560b9 mantine-Button-label">Weiblich</span></span></button><button
style="--button-height:var(--button-height-md);--button-padding-x:var(--button-padding-x-md);--button-fz:var(--mantine-font-size-md);--button-radius:var(--mantine-radius-xl);--button-bg:transparent;--button-hover:var(--mantine-color-brand-dark-blue-outline-hover);--button-color:var(--mantine-color-brand-dark-blue-outline);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-brand-dark-blue-outline);padding-right:var(--mantine-spacing-sm);padding-left:var(--mantine-spacing-sm)"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-variant="outline" data-size="md" data-block="true" type="button"><span
class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span
class="m-80f1301b mantine-Button-inner"><span class="m-811560b9 mantine-Button-label">Divers</span></span></button></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-DatePickerInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-DatePickerInput-label"
data-size="md" for="mantine-ad2rwwitg" id="mantine-ad2rwwitg-label">Geburtsdataum</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-DatePickerInput-wrapper" data-variant="default" data-size="md" data-multiline="true">
<button class="Input_input__HKLMz m-6fa5e2aa m-8fb7ebe7 mantine-Input-input mantine-DatePickerInput-input" data-variant="default" aria-label="February 14, 2006" data-dates-input="true" type="button" aria-haspopup="dialog"
aria-expanded="false" aria-controls="mantine-zxwgrghz0-dropdown" aria-invalid="false" id="mantine-ad2rwwitg">February 14, 2006</button></div>
</div><input type="hidden" value="2006-02-14T10:00:00.000Z">
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-3rwlsiwwo" id="mantine-3rwlsiwwo-label">Vorname</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: Max" aria-invalid="false" id="mantine-3rwlsiwwo" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-77ugarx74" id="mantine-77ugarx74-label">Nachname</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: Mustermann" aria-invalid="false" id="mantine-77ugarx74" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-9ao5a55t9" id="mantine-9ao5a55t9-label">E-Mail-Adresse</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: max@mustermann.de" aria-invalid="false" id="mantine-9ao5a55t9" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-w49yh8n5q" id="mantine-w49yh8n5q-label">Telefonnummer</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: 0123456789 (optional)" aria-invalid="false" id="mantine-w49yh8n5q" value=""></div>
</div>
</div><button
style="--button-height:var(--button-height-lg);--button-padding-x:var(--button-padding-x-lg);--button-fz:var(--mantine-font-size-lg);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-yellow-filled);--button-hover:var(--mantine-color-brand-yellow-filled-hover);--button-color:var(--mantine-color-black);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-top:calc(2.5rem * var(--mantine-scale))"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-size="lg" type="submit"><span class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span
style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-80f1301b mantine-Button-inner"><span
class="m-811560b9 mantine-Button-label">Weiter</span></span></button>
</form>
<form class="">
<style data-mantine-styles="inline">
.__m__-R6rbbmrdddmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 1;
}
@media(min-width: 36em) {
.__m__-R6rbbmrdddmrffbla {
--sg-cols: 2;
}
}
</style>
<div class="m-2415a157 mantine-SimpleGrid-root __m__-R6rbbmrdddmrffbla">
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-81p3kznhw" id="mantine-81p3kznhw-label">Strasse</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: Muster Straße" aria-invalid="false" id="mantine-81p3kznhw" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-37i16u8um" id="mantine-37i16u8um-label">Hausnummer</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: 1" aria-invalid="false" id="mantine-37i16u8um" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-tdle44owx" id="mantine-tdle44owx-label">Postleitzahl</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: 12345" aria-invalid="false" id="mantine-tdle44owx" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-l7mmoie0u" id="mantine-l7mmoie0u-label">Stadt</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="z.B.: Musterstadt" aria-invalid="false" id="mantine-l7mmoie0u" value=""></div>
</div>
</div><button
style="--button-height:var(--button-height-lg);--button-padding-x:var(--button-padding-x-lg);--button-fz:var(--mantine-font-size-lg);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-yellow-filled);--button-hover:var(--mantine-color-brand-yellow-filled-hover);--button-color:var(--mantine-color-black);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-top:calc(2.5rem * var(--mantine-scale))"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-size="lg" type="submit"><span class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span
style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-80f1301b mantine-Button-inner"><span
class="m-811560b9 mantine-Button-label">Weiter</span></span></button>
</form>
<form class="">
<p style="color:var(--mantine-color-dimmed)" class="mantine-focus-auto m-b6d8b162 mantine-Text-root">Wenn du dich registrieren möchtest, kannst du hier dein Passwort festlegen.</p>
<style data-mantine-styles="inline">
.__m__-Rarbrmrdddmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 1;
}
@media(min-width: 36em) {
.__m__-Rarbrmrdddmrffbla {
--sg-cols: 2;
}
}
</style>
<div style="margin-top:var(--mantine-spacing-lg)" class="m-2415a157 mantine-SimpleGrid-root __m__-Rarbrmrdddmrffbla">
<div style="--psi-icon-size:var(--psi-icon-size-md);--psi-button-size:var(--psi-button-size-md)" class="m-f61ca620 mantine-PasswordInput-root m-46b77525 mantine-InputWrapper-root mantine-PasswordInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-PasswordInput-label"
data-size="md" for="mantine-oo58sw7gt" id="mantine-oo58sw7gt-label">Passwort</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem;--input-left-section-pointer-events:none;--input-right-section-pointer-events:all"
class="m-6c018570 mantine-Input-wrapper mantine-PasswordInput-wrapper" data-variant="default" data-size="md" data-with-right-section="true">
<div class="Input_input__HKLMz m-ccf8da4c m-8fb7ebe7 mantine-Input-input mantine-PasswordInput-input" data-variant="default"><input class="m-f2d85dd2 mantine-PasswordInput-innerInput" id="mantine-oo58sw7gt" placeholder="Passwort"
autocomplete="off" type="password" value=""></div>
<div data-position="right" class="m-82577fc2 mantine-Input-section mantine-PasswordInput-section"><button
style="--ai-radius:0rem;--ai-bg:transparent;--ai-hover:var(--mantine-color-gray-light-hover);--ai-color:var(--mantine-color-gray-light-color);--ai-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent"
class="mantine-focus-auto mantine-active m-b1072d44 mantine-PasswordInput-visibilityToggle m-8d3f4000 mantine-ActionIcon-root m-87cf2631 mantine-UnstyledButton-root" data-variant="subtle" type="button" aria-hidden="true"
tabindex="-1"><span class="m-302b9fb1 mantine-ActionIcon-loader" aria-hidden="true"><span style="--loader-size:calc(var(--ai-size) * 0.55);--loader-color:var(--ai-color)"
class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-8d3afb97 mantine-ActionIcon-icon"><svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"
style="width:var(--psi-icon-size);height:var(--psi-icon-size)">
<path
d="M7.5 11C4.80285 11 2.52952 9.62184 1.09622 7.50001C2.52952 5.37816 4.80285 4 7.5 4C10.1971 4 12.4705 5.37816 13.9038 7.50001C12.4705 9.62183 10.1971 11 7.5 11ZM7.5 3C4.30786 3 1.65639 4.70638 0.0760002 7.23501C-0.0253338 7.39715 -0.0253334 7.60288 0.0760014 7.76501C1.65639 10.2936 4.30786 12 7.5 12C10.6921 12 13.3436 10.2936 14.924 7.76501C15.0253 7.60288 15.0253 7.39715 14.924 7.23501C13.3436 4.70638 10.6921 3 7.5 3ZM7.5 9.5C8.60457 9.5 9.5 8.60457 9.5 7.5C9.5 6.39543 8.60457 5.5 7.5 5.5C6.39543 5.5 5.5 6.39543 5.5 7.5C5.5 8.60457 6.39543 9.5 7.5 9.5Z"
fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
</svg></span></button></div>
</div>
</div>
<div style="--psi-icon-size:var(--psi-icon-size-md);--psi-button-size:var(--psi-button-size-md)" class="m-f61ca620 mantine-PasswordInput-root m-46b77525 mantine-InputWrapper-root mantine-PasswordInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-PasswordInput-label"
data-size="md" for="mantine-ocltbo5zp" id="mantine-ocltbo5zp-label">Passwort bestätigen</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem;--input-left-section-pointer-events:none;--input-right-section-pointer-events:all"
class="m-6c018570 mantine-Input-wrapper mantine-PasswordInput-wrapper" data-variant="default" data-size="md" data-with-right-section="true">
<div class="Input_input__HKLMz m-ccf8da4c m-8fb7ebe7 mantine-Input-input mantine-PasswordInput-input" data-variant="default"><input class="m-f2d85dd2 mantine-PasswordInput-innerInput" id="mantine-ocltbo5zp" placeholder="Passwort"
autocomplete="off" type="password" value=""></div>
<div data-position="right" class="m-82577fc2 mantine-Input-section mantine-PasswordInput-section"><button
style="--ai-radius:0rem;--ai-bg:transparent;--ai-hover:var(--mantine-color-gray-light-hover);--ai-color:var(--mantine-color-gray-light-color);--ai-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent"
class="mantine-focus-auto mantine-active m-b1072d44 mantine-PasswordInput-visibilityToggle m-8d3f4000 mantine-ActionIcon-root m-87cf2631 mantine-UnstyledButton-root" data-variant="subtle" type="button" aria-hidden="true"
tabindex="-1"><span class="m-302b9fb1 mantine-ActionIcon-loader" aria-hidden="true"><span style="--loader-size:calc(var(--ai-size) * 0.55);--loader-color:var(--ai-color)"
class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-8d3afb97 mantine-ActionIcon-icon"><svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"
style="width:var(--psi-icon-size);height:var(--psi-icon-size)">
<path
d="M7.5 11C4.80285 11 2.52952 9.62184 1.09622 7.50001C2.52952 5.37816 4.80285 4 7.5 4C10.1971 4 12.4705 5.37816 13.9038 7.50001C12.4705 9.62183 10.1971 11 7.5 11ZM7.5 3C4.30786 3 1.65639 4.70638 0.0760002 7.23501C-0.0253338 7.39715 -0.0253334 7.60288 0.0760014 7.76501C1.65639 10.2936 4.30786 12 7.5 12C10.6921 12 13.3436 10.2936 14.924 7.76501C15.0253 7.60288 15.0253 7.39715 14.924 7.23501C13.3436 4.70638 10.6921 3 7.5 3ZM7.5 9.5C8.60457 9.5 9.5 8.60457 9.5 7.5C9.5 6.39543 8.60457 5.5 7.5 5.5C6.39543 5.5 5.5 6.39543 5.5 7.5C5.5 8.60457 6.39543 9.5 7.5 9.5Z"
fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
</svg></span></button></div>
</div>
</div>
</div><button
style="--button-height:var(--button-height-lg);--button-padding-x:var(--button-padding-x-lg);--button-fz:var(--mantine-font-size-lg);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-yellow-filled);--button-hover:var(--mantine-color-brand-yellow-filled-hover);--button-color:var(--mantine-color-black);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-top:calc(2.5rem * var(--mantine-scale))"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-size="lg" type="submit"><span class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span
style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-80f1301b mantine-Button-inner"><span
class="m-811560b9 mantine-Button-label">Nächster Schritt</span></span></button>
</form>
<form style="margin-top:calc(2.5rem * var(--mantine-scale))" class="">
<p style="color:var(--mantine-color-dimmed)" class="mantine-focus-auto m-b6d8b162 mantine-Text-root">Dein monatlicher Beitrag wird zum ersten jeden Monats eingezogen für die Dauer der Laufzeit. Die Aktivierungsgebühr ziehen wir zu Beginn deiner
Mitgliedschaft zusammen mit dem monatlichen Beitrag ein.</p>
<style data-mantine-styles="inline">
.__m__-Rlmrdfdmrffbla {
--sg-spacing-x: calc(2.5rem * var(--mantine-scale));
--sg-spacing-y: var(--mantine-spacing-lg);
--sg-cols: 1;
}
@media(min-width: 36em) {
.__m__-Rlmrdfdmrffbla {
--sg-cols: 2;
}
}
</style>
<div style="margin-top:var(--mantine-spacing-lg)" class="m-2415a157 mantine-SimpleGrid-root __m__-Rlmrdfdmrffbla">
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-4auvcrop1" id="mantine-4auvcrop1-label">Kontoinhaber</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="Höchstens 70 Zeichen" aria-invalid="false" id="mantine-4auvcrop1" value=""></div>
</div>
<div class="m-46b77525 mantine-InputWrapper-root mantine-TextInput-root" data-size="md"><label
style="--input-label-size:var(--mantine-font-size-md);margin-bottom:calc(0.375rem * var(--mantine-scale));font-size:var(--mantine-font-size-lg);font-weight:normal" class="m-8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
data-size="md" for="mantine-51jwh2jup" id="mantine-51jwh2jup-label">IBAN</label>
<div style="--input-height:var(--input-height-md);--input-fz:var(--mantine-font-size-md);--input-radius:0rem" class="m-6c018570 mantine-Input-wrapper mantine-TextInput-wrapper" data-variant="default" data-size="md"><input
class="Input_input__HKLMz m-8fb7ebe7 mantine-Input-input mantine-TextInput-input" data-variant="default" placeholder="Höchstens 34 Zeichen" aria-invalid="false" id="mantine-51jwh2jup" value=""></div>
</div>
</div>
<div
style="--checkbox-size:var(--checkbox-size-lg);--checkbox-radius:var(--mantine-radius-xl);--checkbox-color:var(--mantine-color-black);--label-fz:var(--mantine-font-size-lg);--label-lh:var(--label-lh-lg);margin-top:calc(2.5rem * var(--mantine-scale));color:var(--mantine-color-dimmed)"
class="m-bf2d988c mantine-Checkbox-root m-5f75b09e mantine-Checkbox-root" data-size="lg" data-label-position="right">
<div class="m-5f6e695e mantine-Checkbox-body">
<div class="m-26062bec mantine-Checkbox-inner" data-label-position="right"><input style="border-color:black" class="mantine-focus-auto m-26063560 mantine-Checkbox-input" id="mantine-b6frqspvk" type="checkbox">
<div class="absolute inset-0 m-4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="tabler-icon tabler-icon-check">
<path d="M5 12l5 5l10 -10"></path>
</svg></div>
</div>
<div class="m-d3ea56bb mantine-Checkbox-labelWrapper"><label class="m-8ee546b8 mantine-Checkbox-label" style="font-size:16px" for="mantine-b6frqspvk">Ich ermächtige Injoy von meinem Konto mittels Lastschrift einzuziehen. Recusandae saepe
dolorem iusto dolores illo laboriosam. Id quis optio earum praesentium hic non. Consequatur consequatur id molestiae aut id distinctio minima reprehenderit cupiditate.</label></div>
</div>
</div><button
style="--button-height:var(--button-height-lg);--button-padding-x:var(--button-padding-x-lg);--button-fz:var(--mantine-font-size-lg);--button-radius:var(--mantine-radius-xl);--button-bg:var(--mantine-color-brand-yellow-filled);--button-hover:var(--mantine-color-brand-yellow-filled-hover);--button-color:var(--mantine-color-black);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-top:calc(2.5rem * var(--mantine-scale))"
class="mantine-focus-auto mantine-active Button_root__gQO6G m-77c9d27d mantine-Button-root m-87cf2631 mantine-UnstyledButton-root" data-size="lg" type="submit"><span class="m-a25b86ee mantine-Button-loader" aria-hidden="true"><span
style="--loader-size:calc(var(--button-height) / 1.8);--loader-color:var(--button-color)" class="m-b34414df m-5ae2e3c mantine-Loader-root"></span></span><span class="m-80f1301b mantine-Button-inner"><span
class="m-811560b9 mantine-Button-label">Speichern</span></span></button>
</form>
<form class="col-span-5">
<h2 style="--title-fw:var(--mantine-h2-font-weight);--title-lh:var(--mantine-h2-line-height);--title-fz:var(--mantine-h2-font-size);color:var(--mantine-color-brand-dark-blue-text)" class="m-8a5d1357 mantine-Title-root" data-order="2">Übersicht</h2>
<p style="--text-fz:var(--mantine-font-size-lg);--text-lh:var(--mantine-line-height-lg);color:var(--mantine-color-dimmed)" class="mantine-focus-auto m-b6d8b162 mantine-Text-root" data-size="lg">Bitte wähle ein Abo aus</p>
</form>
Text Content
1 DEIN VERTRAG Hauptvertrag Mindestlaufzeit 24 Monate12 Monate1 Monat Vertragsbeginn February 15, 2024 Premium YOU Schüler/Studenten/Azubis Abo 45 €/MONAT anstatt 65 € Premium Klassisches Abo 65 €/MONAT anstatt 85 € Weiter Zusatzleistungen SPAR ABO 10 €/Monat Jeder Eiweißshake für 50 Prozent Rabatt KAFFEE FLAT 10 €/Monat Trinke so viel Kaffee, wie du möchtest SAUNA FLAT 15 €/Monat Täglich nutzbar zu den Sauna Öffnungszeiten Nächster Schritt 2 DEINE DATEN Persönliche Daten Geschlecht MännlichWeiblichDivers Geburtsdataum February 14, 2006 Vorname Nachname E-Mail-Adresse Telefonnummer Weiter Adressdaten Strasse Hausnummer Postleitzahl Stadt Weiter Optionale Registrierung Wenn du dich registrieren möchtest, kannst du hier dein Passwort festlegen. Passwort Passwort bestätigen Nächster Schritt 3 ZAHLUNGSDATEN Dein monatlicher Beitrag wird zum ersten jeden Monats eingezogen für die Dauer der Laufzeit. Die Aktivierungsgebühr ziehen wir zu Beginn deiner Mitgliedschaft zusammen mit dem monatlichen Beitrag ein. Kontoinhaber IBAN Ich ermächtige Injoy von meinem Konto mittels Lastschrift einzuziehen. Recusandae saepe dolorem iusto dolores illo laboriosam. Id quis optio earum praesentium hic non. Consequatur consequatur id molestiae aut id distinctio minima reprehenderit cupiditate. Speichern ÜBERSICHT Bitte wähle ein Abo aus