_footer
This is the footer organism.
Footer
This is the footer organism. Following components are part of the header:
<footer class="o-footer ">
<section class="o-footer__advantages m-advantages">
<div class="m-advantages__container">
<h5 class="m-advantages__title">Waarom kiezen voor <span class="m-advantages__title--highlight">smartphoto</span>?</h5>
<div class="m-advantages__content">
<div class="m-advantages__item">
<a class="m-advantages__link" href="https://www.smartphoto.be/nl/waarom-smartphoto">
<img class="m-advantages__item-img" src="/assets/brandplatform/img/advantages/usp-smartphoto-grootste-keuze.png" alt="smartphoto's grootste keuze"></img>
<span class="m-advantages__item-title">De grootste keuze aan fotoproducten</span>
</a>
</div>
<div class="m-advantages__item">
<a class="m-advantages__link" href="https://www.smartphoto.be/nl/waarom-smartphoto">
<img class="m-advantages__item-img" src="/assets/brandplatform/img/advantages/usp-smartphoto-eenvoudig-te-maken.png" alt="eenvoudig te maken"></img>
<span class="m-advantages__item-title">Super eenvoudig om te maken</span>
</a>
</div>
<div class="m-advantages__item">
<a class="m-advantages__link" href="https://www.smartphoto.be/nl/waarom-smartphoto">
<img class="m-advantages__item-img" src="/assets/brandplatform/img/advantages/truck.png" alt="snelste levering"></img>
<span class="m-advantages__item-title">Snelste levering in België</span>
</a>
</div>
<div class="m-advantages__item">
<a class="m-advantages__link" href="https://www.smartphoto.be/nl/smartgarantie">
<img class="m-advantages__item-img" src="/assets/brandplatform/img/advantages/smartwarranty.png" alt="smartwarranty"></img>
<span class="m-advantages__item-title">Typefoutje gemaakt? Gratis herdruk!</span>
</a>
</div>
</div>
</div>
</section>
<section class="m-newsletter o-footer__newsletter">
<h3 class="m-newsletter__title">De beste promoties & inspiratie voor je foto's wekelijks in je mailbox!</h3>
<form id="form1" action="#" method="" class="m-newsletter__form">
<input type="email" name="prospectemail" class="prospectsubscribeemail m-newsletter__input" id="prospectemail" placeholder="Vul hier je e-mailadres in" required>
<button type="submit" id="pnlSubscribe" class="a-button m-newsletter__button">Schrijf me in</button>
</form>
<p class="m-newsletter__info">Door in te schrijven op onze nieuwsbrief blijf je op de hoogte van onze producten en speciale acties en ga je akkoord met onze <a href="https://www.smartphoto.be/nl/service_checkout" class="m-newsletter__gdpr-link">Algemene Privacyverklaring.</a><br>Je kan je steeds uitschrijven door te klikken op de uitschrijflink onderaan elke nieuwsbrief.</p>
<div class="m-newsletter__messages">
<span id="errorStub" class="m-newsletter__error">
<label for="prospectsubscribeemail" class="m-newsletter__error-label dummy">
<span class="m-newsletter__error-text icon-error-filled"></span>
</label>
</span>
<span id="valrequired" class="m-newsletter__validation-required" style="display: none;"></span>
<span id="valEmailFormat" class="m-newsletter__validation-email-format" style="display: none;"></span>
<span id="pnlSucces" class="m-newsletter__succes succes icon-succes"></span>
</div>
</section>
<section class="o-footer__external">
<div class="o-footer__container">
<div class="m-social-media ">
<h5 class="m-social-media__title">Blijf altijd op de hoogte!</h5>
<ul class="m-social-media__list">
<li class="m-social-media__list-item m-social-media--facebook">
<a href="#" class="m-social-media__link">
<span class="m-social-media__icon icon-facebook"></span>
</a>
</li>
<li class="m-social-media__list-item m-social-media--twitter">
<a href="#" class="m-social-media__link">
<span class="m-social-media__icon icon-twitter"></span>
</a>
</li>
<li class="m-social-media__list-item m-social-media--pinterest">
<a href="#" class="m-social-media__link">
<span class="m-social-media__icon icon-pinterest"></span>
</a>
</li>
<li class="m-social-media__list-item m-social-media--youtube">
<a href="#" class="m-social-media__link">
<span class="m-social-media__icon icon-youtube"></span>
</a>
</li>
<li class="m-social-media__list-item m-social-media--instagram">
<a href="#" class="m-social-media__link">
<span class="m-social-media__icon icon-instagram"></span>
</a>
</li>
</ul>
</div>
<div class="m-trust-icons ">
<div class="m-trust-icons__container">
<a href="#" class="m-trust-icons__link">
<img src="../../../../../assets/brandplatform/img/footer/trust-icons/logo-becommerce-transp_3.png" alt="be-ecommerce" class="m-trust-icons__img">
</a>
</div>
<div class="m-trust-icons__container">
<a href="#" class="m-trust-icons__link">
<img src="../../../../../assets/brandplatform/img/footer/trust-icons/safeshops_3.png" alt="safeshops" class="m-trust-icons__img">
</a>
</div>
<div class="m-trust-icons__container">
<a href="#" class="m-trust-icons__link">
<img src="../../../../../assets/brandplatform/img/footer/trust-icons/emota_3.png" alt="emota" class="m-trust-icons__img">
</a>
</div>
<div class="m-trust-icons__container">
<a href="#" class="m-trust-icons__link">
<img src="../../../../../assets/brandplatform/img/footer/trust-icons/logo-bpost-trans_4.png" alt="bpost" class="m-trust-icons__img">
</a>
</div>
</div>
</div>
</section>
<section class="o-footer__navigation">
<div class="o-footer__container">
<div class="o-footer__navigation-list m-collapsable">
<h3 class="o-footer__title icon-arrow-down m-collapsable__title">Onze producten</h3>
<div class="m-collapsable__content">
<ul class="a-list a-list--no-bullets">
<li class="a-list__item ">
<a class="a-link " href="#">
item1
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Fotoprints, Fotoposter & Fotoalbum met fotoprints
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item3
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item4
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Communie en Lentefeest
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item6
</a>
</li>
</ul>
</div>
</div>
<div class="o-footer__navigation-list m-collapsable">
<h3 class="o-footer__title icon-arrow-down m-collapsable__title">Over smartphoto</h3>
<div class="m-collapsable__content">
<ul class="a-list a-list--no-bullets">
<li class="a-list__item ">
<a class="a-link " href="#">
item1
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Fotoprints, Fotoposter & Fotoalbum met fotoprints
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item3
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item4
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Communie en Lentefeest
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item6
</a>
</li>
</ul>
</div>
</div>
<div class="o-footer__navigation-list m-collapsable">
<h3 class="o-footer__title icon-arrow-down m-collapsable__title">smartservice</h3>
<div class="m-collapsable__content">
<ul class="a-list a-list--no-bullets">
<li class="a-list__item ">
<a class="a-link " href="#">
item1
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Fotoprints, Fotoposter & Fotoalbum met fotoprints
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item3
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item4
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Communie en Lentefeest
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item6
</a>
</li>
</ul>
</div>
</div>
<div class="o-footer__navigation-list m-collapsable">
<h3 class="o-footer__title icon-arrow-down m-collapsable__title">Belangrijke gebeurtenissen</h3>
<div class="m-collapsable__content">
<ul class="a-list a-list--no-bullets">
<li class="a-list__item ">
<a class="a-link " href="#">
item1
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Fotoprints, Fotoposter & Fotoalbum met fotoprints
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item3
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item4
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
Communie en Lentefeest
</a>
</li>
<li class="a-list__item ">
<a class="a-link " href="#">
item6
</a>
</li>
</ul>
</div>
</div>
</div>
</section>
<section class="o-footer__seo">
<div class="o-footer__container">
<h3 class="o-footer__title">Het leukste foto-idee bij smartphoto.be! Goedkoop foto's afdrukken en originele foto cadeau's</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, ducimus soluta ratione adipisci repellat culpa sit laborum tempora quis necessitatibus animi eos sequi corrupti, earum nesciunt! Nihil, tempora maxime? Ut!</p>
</div>
</section>
<section class="o-footer__seo">
<div class="o-footer__container">
<h3 class="o-footer__title">Fotoproducten voor elke gelegenheid</h3>
<div class="o-footer__seo--space-around">
<a class="a-link " href="">
<span class="a-link__text">Lorem ipsum dolor sit amet consectetur </span>
</a>
<a class="a-link " href="">
<span class="a-link__text">Lorem , ducimus soluta ratione adipisci repellat culpa sit laborum tempora quis necessitatibus animi eos sequi corrupti, earum nesciunt! Nihil, tempora maxime? Ut!</span>
</a>
<a class="a-link " href="">
<span class="a-link__text">Lorem ipsum dolor sit amet consectetur soluta ratione adipisci repellat culpa sit laborum tempora quis necess</span>
</a>
</div>
</div>
</section>
<section class="o-footer__countries">
<div class="o-footer__container">
<h3 class="o-footer__title">smartphoto is aanwezig in alle Europese landen:</h3>
<div class="o-footer__countries-list">
<a class="a-link " href="">
<span class="a-link__text">item1</span>
</a>
<p> - </p>
<a class="a-link " href="">
<span class="a-link__text">Fotoprints, Fotoposter & Fotoalbum met fotoprints</span>
</a>
<p> - </p>
<a class="a-link " href="">
<span class="a-link__text">item3</span>
</a>
<p> - </p>
<a class="a-link " href="">
<span class="a-link__text">item4</span>
</a>
<p> - </p>
<a class="a-link " href="">
<span class="a-link__text">Communie en Lentefeest</span>
</a>
<p> - </p>
<a class="a-link " href="">
<span class="a-link__text">item6</span>
</a>
<p> - </p>
</div>
</div>
</section>
<section class="o-footer__bottom">
<div class="o-footer__container">
<div class="o-footer__copyright">
<p class="o-footer__bottom__text">© smartphoto group. Alle rechten voorbehouden</p>
</div>
<div class="o-footer__cookies">
<p class="o-footer__bottom__text">Deze website gebruikt cookies. Voor meer info klik
<a class="a-link a-list--no-bullets" href="">
<span class="a-link__text">hier</span>
</a>
.</p>
</div>
<div class="o-footer__payment-methods">
<ul class=" m-payment-methods">
<li class="m-payment-methods__list-item">
<a class="m-payment-methods__link m-payment-methods__link--visa" href="#">
<span class="m-payment-methods__description">visa</span>
</a>
</li>
<li class="m-payment-methods__list-item">
<a class="m-payment-methods__link m-payment-methods__link--mastercard" href="#">
<span class="m-payment-methods__description">mastercard</span>
</a>
</li>
<li class="m-payment-methods__list-item">
<a class="m-payment-methods__link m-payment-methods__link--maestro" href="#">
<span class="m-payment-methods__description">maestro</span>
</a>
</li>
<li class="m-payment-methods__list-item">
<a class="m-payment-methods__link m-payment-methods__link--bancontact" href="#">
<span class="m-payment-methods__description">bancontact</span>
</a>
</li>
<li class="m-payment-methods__list-item">
<a class="m-payment-methods__link m-payment-methods__link--paypal" href="#">
<span class="m-payment-methods__description">paypal</span>
</a>
</li>
<li class="m-payment-methods__list-item">
<a class="m-payment-methods__link m-payment-methods__link--overschrijving" href="#">
<span class="m-payment-methods__description">overschrijving</span>
</a>
</li>
</ul>
</div>
</div>
</section>
</div>
</footer>
This is a title
this is usage documentation is written in markdown