Vertical form

<form class="stack w-100" style="max-width: 480px" data-validate data-success="Customer added." novalidate>
<div class="field">
<label class="label required" for="vf-n">Name</label>
<div class="input">
<input id="vf-n" name="vf-n" required autocomplete="name" type="text">
</div>
</div>
<div class="field">
<label class="label" for="vf-e">Email</label>
<div class="input">
<input id="vf-e" name="vf-e" autocomplete="email" type="email">
</div>
</div>
<div class="field">
<label class="label" for="vf-p">Phone</label>
<div class="input">
<input data-mask="phone" id="vf-p" name="vf-p" autocomplete="tel" type="tel" inputmode="tel">
</div>
</div>
<label class="setting" for="vf-l">
<span>Join the loyalty club</span>
<span class="choice">
<input type="checkbox" id="vf-l" name="vf-l" checked>
<span class="switch">
</span>
</span>
</label>
<div class="cluster">
<button type="submit" class="btn btn-primary">
<i class="ti ti-user-plus">
</i>Add customer</button>
</div>
</form>