Usp list

			
				<div class="c-usp-list l-section l-section--large l-section--background-pink l-section--with-curve">
	<div class="c-usp-list__container l-container">
		<ul class="c-usp-list__content l-grid l-grid--with-spacing l-grid--align-center">
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp ">
					<div class="c-usp__content">
						<span class="fal fa-cookie c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben bescheiden</h4>
						<p class="c-usp__text">In slechts enkele stappen helpt Lot jou met het opzetten
							van jouw nieuwe hypotheek</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp ">
					<div class="c-usp__content">
						<span class="fal fa-cocktail c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben eerlijk</h4>
						<p class="c-usp__text">Bereken eenvoudig en snel jouw maximale hypotheek bij
							Lot voor 2019.</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp ">
					<div class="c-usp__content">
						<span class="fal fa-leaf c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben milieubewust</h4>
						<p class="c-usp__text">Ontdek de lot verduurzaam hypotheek en ontdek onze
							energiebesparende maatregelen.</p>
					</div>
				</article>
			</li>
		</ul>
		<button class="c-button c-usp-list__button c-button--inverted ">
			<span class="c-button__text">vergelijk de rentes van lot</span>
		</button>
	</div>
</div>
			

		

			
				<div class="c-usp-list l-section l-section--large l-section--background-pink">
	<div class="c-usp-list__container l-container">
		<ul class="c-usp-list__content l-grid l-grid--with-spacing l-grid--align-center">
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp ">
					<div class="c-usp__content">
						<span class="fal fa-cookie c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben bescheiden</h4>
						<p class="c-usp__text">In slechts enkele stappen helpt Lot jou met het opzetten
							van jouw nieuwe hypotheek</p>
					</div>
					<button class="c-button c-button--inverted c-usp__button ">
						<span class="c-button__text">ons process</span>
					</button>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp ">
					<div class="c-usp__content">
						<span class="fal fa-cocktail c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben eerlijk</h4>
						<p class="c-usp__text">Bereken eenvoudig en snel jouw maximale hypotheek bij
							Lot voor 2019.</p>
					</div>
					<button class="c-button c-button--inverted c-usp__button ">
						<span class="c-button__text">onze rentes</span>
					</button>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp ">
					<div class="c-usp__content">
						<span class="fal fa-leaf c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben milieubewust</h4>
						<p class="c-usp__text">Ontdek de lot verduurzaam hypotheek en ontdek onze
							energiebesparende maatregelen.</p>
					</div>
					<button class="c-button c-button--inverted c-usp__button ">
						<span class="c-button__text">duurzaamheid</span>
					</button>
				</article>
			</li>
		</ul>
	</div>
</div>
			

		

			
				<div class="c-usp-list c-usp-list--interactive l-section l-section--large js-usp-list l-section--background-pink">
	<div class="c-usp-list__container l-container">
		<ul class="c-usp-list__content">
			<li class="c-usp-list__item">
				<button class="c-usp-list__button" data-usp-id="0">
					<article class="c-usp ">
						<div class="c-usp__content">
							<span class="fal fa-sparkles c-usp__icon"></span>
							<h4 class="c-usp__title">Annuïtair</h4>
							<p class="c-usp__text">In slechts enkele stappen helpt Lot jou met het opzetten
								van jouw nieuwe hypotheek</p>
						</div>
					</article>
				</button>
			</li>
			<li class="c-usp-list__item">
				<button class="c-usp-list__button" data-usp-id="1">
					<article class="c-usp ">
						<div class="c-usp__content">
							<span class="fal fa-coins c-usp__icon"></span>
							<h4 class="c-usp__title">Lineair</h4>
							<p class="c-usp__text">Bereken eenvoudig en snel jouw maximale hypotheek bij
								Lot voor 2019.</p>
						</div>
					</article>
				</button>
			</li>
			<li class="c-usp-list__item">
				<button class="c-usp-list__button" data-usp-id="2">
					<article class="c-usp ">
						<div class="c-usp__content">
							<span class="fal fa-leaf c-usp__icon"></span>
							<h4 class="c-usp__title">Aflosvrij</h4>
							<p class="c-usp__text">Ontdek de lot verduurzaam hypotheek en ontdek onze
								energiebesparende maatregelen.</p>
						</div>
					</article>
				</button>
			</li>
		</ul>
	</div>
</div>
			

		

			
				<div class="c-usp-list l-section l-section--large l-section--background-green l-section--with-shapes">
	<div class="c-usp-list__container l-container">
		<ul class="c-usp-list__content l-grid l-grid--with-spacing l-grid--align-center">
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-purple">
					<div class="c-usp__content">
						<span class="fal fa-cookie c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben bescheiden</h4>
						<p class="c-usp__text">In slechts enkele stappen helpt Lot jou met het opzetten
							van jouw nieuwe hypotheek</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-purple">
					<div class="c-usp__content">
						<span class="fal fa-cocktail c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben eerlijk</h4>
						<p class="c-usp__text">Bereken eenvoudig en snel jouw maximale hypotheek bij
							Lot voor 2019.</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-purple">
					<div class="c-usp__content">
						<span class="fal fa-kiwi-bird c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben milieubewust</h4>
						<p class="c-usp__text">Ontdek de lot verduurzaam hypotheek en ontdek onze
							energiebesparende maatregelen.</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-purple">
					<div class="c-usp__content">
						<span class="fal fa-kiwi-bird c-usp__icon"></span>
						<h4 class="c-usp__title">Ik ben milieubewust</h4>
						<p class="c-usp__text">Ontdek de lot verduurzaam hypotheek en ontdek onze
							energiebesparende maatregelen.</p>
					</div>
				</article>
			</li>
		</ul>
	</div>
</div>
			

		

			
				<div class="c-usp-list l-section l-section--large ">
	<div class="c-usp-list__container l-container">
		<ul class="c-usp-list__content l-grid l-grid--with-spacing l-grid--align-center">
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-white">
					<div class="c-usp__content">
						<span class="fal fa-sparkles c-usp__icon"></span>
						<h4 class="c-usp__title">Lot is modern</h4>
						<p class="c-usp__text">We maken slim gebruik van nieuwe technologieen waardoor
							we jou sneller en nog beter van dienst kunnen zijn. Geen onnodig
							en ingewikkeld gedoe bij Lot.</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-white">
					<div class="c-usp__content">
						<span class="fal fa-coins c-usp__icon"></span>
						<h4 class="c-usp__title">Lot is goedkoop</h4>
						<p class="c-usp__text">Lot&#39;s hypotheken hebben goede voorwaarden en een scherpe
							rente. En met de duurzaamheidshypotheek kun je tegen een nog
							lagere rente tot 35.000 extra lenen voor energiebesparende
							maatregelen.</p>
					</div>
				</article>
			</li>
			<li class="c-usp-list__item l-grid__col l-grid__col--4@desktop l-grid__col--6@tablet u-padding-left-3x@desktop u-padding-right-3x@desktop">
				<article class="c-usp c-usp--theme-white">
					<div class="c-usp__content">
						<span class="fal fa-leaf c-usp__icon"></span>
						<h4 class="c-usp__title">Lot cares</h4>
						<p class="c-usp__text">Lot vindt duurzaamheid belangrijk. Dat zie je terug in
							onze diensten en productoplossingen maar ook in onze manier van
							werken. We voorkomen onnodig papierwerk door hoofdzakelijk
							digitaal met onze klanten en andere relaties te communiceren.
							We kijken net iets verder dan alleen hypotheken en helpen je
							graag met het verkennen van de mogelijkheden om jouw woning te
							verduurzamen.</p>
					</div>
				</article>
			</li>
		</ul>
	</div>
</div>