No notes defined.
<section class="sds-section -sectionSunken">
<div class="sds-section__innerWrapper">
<div class="sds-section__inner">
<div class="container">
<div class="">
<div class="row flex-lg-row-reverse">
<div class="col-12 offset-lg-1 col-lg-4">
<div class="sds-box -insetLg -boxSunken sds-stackMd">
<h2 class="h2">
Jeep
<span class="sds-headingLight">Avenger Longitude BEV</span>
</h2>
<div class="sds-stackMd -stackBorder">
<img class="img-fluid d-block mx-auto" src="https://cdn.imagin.studio/getImage?&=&customer=spuerkeess&make=opel&modelFamily=mokka-e&modelRange=mokka-e&modelVariant=od&modelYear=2021&powerTrain=fossil&transmission=0&bodySize=5&trim=0&paintId=pspc0068&angle=23&width=800&zoomType=fullscreen" alt="">
<div>
<table class="sds-infoTable table -noBorder">
<tbody>
<tr>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-label">
Kilométrage annuel
</div>
</div>
</td>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-textSemiBold">
10.000km/an
</div>
</div>
</td>
</tr>
<tr>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-label">
Durée du leasing
</div>
</div>
</td>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-textSemiBold">
60 mois
</div>
</div>
</td>
</tr>
<tr>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-label">
mensuellement TTC
</div>
</div>
</td>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-textSemiBold">
535,00€
</div>
</div>
</td>
</tr>
<tr>
<td class="">
<div class="sds-infoTable__cellContent">
<div class="sds-label">
Pays
</div>
</div>
</td>
<td class="">
<div class="sds-infoTable__cellContent">
<div>
Luxembourg
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="col-12 col-lg-7">
<div class="sds-box -insetLg sds-stackLg">
<fieldset>
<div class="form-group-xl">
<label for="agence-pref-select" class="sds-label -labelForm -large">
Agence préférentielle
</label>
<div class="sds-select">
<select id="agence-pref-select" class="sds-select form-control">
<option value="opt-0">Option 1</option>
<option value="opt-1">Option 2</option>
<option value="opt-2">Option 3</option>
</select>
<span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>
</div>
</div>
<div class="form-group-xl">
<label for="lease-plus-form-firstname" class="sds-label -labelForm -large">
Prénom
</label>
<div class="sds-input">
<input id="lease-plus-form-firstname" class="sds-input form-control" type="text" placeholder="Entrez une communication" value="">
</div>
</div>
<div class="form-group-xl">
<label for="lease-plus-form-lastname" class="sds-label -labelForm -large">
Nom
</label>
<div class="sds-input">
<input id="lease-plus-form-lastname" class="sds-input form-control" type="text" placeholder="Entrez une communication" value="">
</div>
</div>
<div class="form-group-xl">
<fieldset class="sds-input -phone">
<label for="phone-number" class="sds-label -labelForm -large">
Numéro
</label>
<div class="sds-input__phoneWrapper">
<div class="sds-input__phonePrefixWrapper">
<label for="phonePrefixSelect" class="sds-label sr-only">
Phone Prefix Selection
</label>
<div class="sds-select sds-input__phoneSelect">
<select id="phonePrefixSelect" class="sds-select form-control">
<option value="opt-0">+352</option>
<option value="opt-1">+33</option>
<option value="opt-2">+32</option>
</select>
<span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>
</div>
<label for="phonePrefixCustomInput" class="sds-label sr-only">
Phone Prefix Input
</label>
<div class="sds-input__phoneCustomPrefixWrapper">
<span class="sds-input__phoneNumberPrefix">+</span>
<input class="sds-input__phoneCustomPrefix form-control" id="phonePrefixCustomInput" type="tel" placeholder="" value="">
</div>
</div>
<input class="form-control" id="phone-number" type="tel" placeholder="Téléphone" value="">
</div>
</fieldset>
</div>
<div class="form-group-xl">
<label for="lease-plus-form-mail" class="sds-label -labelForm -large">
E-mail
</label>
<div class="sds-input">
<input id="lease-plus-form-mail" class="sds-input form-control" type="email" placeholder="Entrez une communication" value="">
</div>
</div>
<div class="form-group-xl">
<div class="sds-checkbox custom-control custom-checkbox -alert">
<input value="checkbox-value" type="checkbox" name="" class="sr-only custom-control-input " id="checkbox-alert-link"><span class="sds-checkboxDot sds-checkbox__shape" aria-hidden="true"></span>
<label class="custom-control-label" for="checkbox-alert-link">Les données à caractère personnel collectées sont traitées dans le strict respect de la législation relative à la protection des personnes physiques à l'égard du traitement des données à caractère personnel. Vous disposez notamment d'un droit d'accès et de rectification de ces données en envoyant votre demande par message S-Net, e-mail ou courrier à l'<a href='https://www.spuerkeess.lu'>adresse suivante</a>.<br> Pour plus d'informations : <a href='https://www.spuerkeess.lu'>Data Protection Policy</a></label>
<div class="sds-checkbox__error invalid-feedback">Error message</div>
</div>
</div>
</fieldset>
<a href="" class="sds-btn -btnPrimary">
<span class="sds-btn__text">Envoyer ma demande</span>
<span class="sds-icon sds-icon-arrownext"></span>
</a>
<div class="form-group-xl d-none d-lg-block">
<p class="sds-formDisclaimer -small">
*Devises des pays membres de l’Union européenne + CHF + ISK + NOK
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="{{ namespace }}section -sectionSunken">
<div class="{{ namespace }}section__innerWrapper">
<div class="{{ namespace }}section__inner">
<div class="container">
<div class="{% for mod in modifiers %} {{ mod }}{% endfor %}{% for mod in classes %} {{ mod }}{% endfor %}">
<div class="row flex-lg-row-reverse">
<div class="col-12 offset-lg-1 col-lg-4">
<div class="{{ namespace }}box -insetLg -boxSunken {{ namespace }}stackMd">
{% render "@heading--h2-subtext",{
text: "Jeep",
subText: "Avenger Longitude BEV"
},true %}
<div class="{{ namespace }}stackMd -stackBorder">
<img class="img-fluid d-block mx-auto" src="https://cdn.imagin.studio/getImage?&=&customer=spuerkeess&make=opel&modelFamily=mokka-e&modelRange=mokka-e&modelVariant=od&modelYear=2021&powerTrain=fossil&transmission=0&bodySize=5&trim=0&paintId=pspc0068&angle=23&width=800&zoomType=fullscreen" alt="">
<div>
{% render '@snet-info-table',{
classes: ["-noBorder"],
tableItems: tableItems
}, true %}
</div>
</div>
</div>
</div>
<div class="col-12 col-lg-7">
<div class="{{ namespace }}box -insetLg {{ namespace }}stackLg">
<fieldset>
<div class="form-group-xl">
{% render "@label--form",{
classes: ["-large"],
text: "Agence préférentielle",
labelFor: "agence-pref-select"
},true %}
{% render "@select",{
options: selectOptions,
id: "agence-pref-select"
},true %}
</div>
<div class="form-group-xl">
{% render "@label--form",{
classes: ["-large"],
text: "Prénom",
labelFor: "lease-plus-form-firstname"
},true %}
{% render "@input",{
id: "lease-plus-form-firstname"
},true %}
</div>
<div class="form-group-xl">
{% render "@label--form",{
classes: ["-large"],
text: "Nom",
labelFor: "lease-plus-form-lastname"
},true %}
{% render "@input",{
id: "lease-plus-form-lastname"
},true %}
</div>
<div class="form-group-xl">
{% render "@input--phone",{
labelClasses: ["-large"],
labelFor: "phone-number"
},true %}
</div>
<div class="form-group-xl">
{% render "@label--form",{
classes: ["-large"],
text: "E-mail",
labelFor: "lease-plus-form-mail"
},true %}
{% render "@input",{
type: "email",
id: "lease-plus-form-mail"
},true %}
</div>
<div class="form-group-xl">
{% render "@checkbox--alert-link" %}
</div>
</fieldset>
{% render '@btn-primary--icon-right',{
eltType: "a",
icon: "icon-arrownext",
text: "Envoyer ma demande"
}, true %}
<div class="form-group-xl d-none d-lg-block">
{% render "@form-disclaimer--small",{
text: "*Devises des pays membres de l’Union européenne + CHF + ISK + NOK"
},true %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>