<h1>Header 1</h1> <h2>Header 2</h2> <h3>Header 3</h3> <a href="#" target="_blank">Hyperlink</a> <p>Paragraph</p>
Lorem ipsum dolor sit amet, test link adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.
Lorem ipsum dolor sit amet, emphasis consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.
<a class="button button-primary" href="#">button primary</a>
<a class="button button-default button-angle-right" href="#">button default</a>
<a class="button button-success button-angle-right" href="#">button success</a>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi porta erat a convallis rhoncus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi porta erat a convallis rhoncus. Phasellus laoreet ipsum est, id rhoncus diam rutrum quis. Cras vitae ex rutrum, faucibus urna ac, ultricies felis. Etiam quis mi dolor. Donec egestas laoreet mattis. Donec elementum urna in aliquam volutpat. Pellentesque vestibulum nibh in arcu congue mattis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi porta erat a convallis rhoncus.
<div class="banner display-none display-sm-block">
<div class="container">
<div class="card my-5">
<img class="card-img" src="/media/Header_homepage.png"/>
<div class="logo-wrapper">
<img class="logo-img" src="/media/Stempel.png"/>
</div>
<div class="cols">
<div class="xs-12 sm-6">
<div class="card-content">
<div class="display-none display-md-block">
<h1>Header h1 <i>cursive text</i>.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi porta erat a convallis
rhoncus.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi porta erat a convallis
rhoncus. Phasellus laoreet ipsum est, id rhoncus diam rutrum quis. Cras vitae ex
rutrum,
faucibus urna ac, ultricies felis. Etiam quis mi dolor. Donec egestas laoreet
mattis.
Donec elementum urna in aliquam volutpat. Pellentesque vestibulum nibh in arcu
congue
mattis.</p>
</div>
<div class="display-none display-sm-inline-block display-md-none">
<h1>Header h1 tablet</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi porta erat a convallis
rhoncus.</p>
</div>
<a class="button button-default lg-button button-angle-right my-4" href="#">
<span class="display-none display-sm-inline-block">Button</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
<div class="cols">
<div class="xs-12 sm-6">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
<div class="xs-12 sm-6">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
<div class="cols">
<div class="xs-12 sm-4">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
<div class="xs-12 sm-4">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
<div class="xs-12 sm-4">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
<div class="cols">
<div class="xs-12 sm-6">
<a href="#"><img alt="" class="img-responsive" src="/media/Posters.jpg"/></a>
</div>
<div class="xs-12 sm-6">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis pretium.
<div class="cols">
<div class="xs-12 sm-6">
<h3>H3 header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa. Sed dignissim lorem sed nunc scelerisque placerat. In ullamcorper id mauris vel congue. Quisque
rutrum justo neque, a aliquet quam laoreet sed. Nam sed consequat magna. Donec sodales ipsum et sagittis
pretium.</p>
</div>
<div class="xs-12 sm-6">
<a href="#"><img class="img-responsive" src="/media/Posters.jpg"/></a>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus.
Button
<div class="cols">
<div class="xs-12 sm-6">
<img class="img-responsive img-center" src="/media/Willemijn.JPG"/>
</div>
<div class="xs-12 sm-5 display-none display-sm-block">
<h1>Header h1</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p>Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<a class="button button-success button-angle-right" href="#">Button</a>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus.
Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus.
Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor urna. Pellentesque cursus sem non tempor dapibus.
Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et massa.
<div class="container">
<div class="cols my-sm-5">
<div class="xs-12 sm-4">
<div class="card">
<a class="card-thumbnail" href="#">
<img class="card-img" src="/media/Geboortekaartje_abstract.png"/>
</a>
<div class="card-content">
<h2>Header h2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus.</p>
<p>Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa.</p>
</div>
<div class="card-button-group">
<a class="button button-default button-angle-right" href="#">Button</a>
</div>
</div>
</div>
<div class="xs-12 sm-4">
<div class="card">
<a class="card-thumbnail" href="#">
<img class="card-img" src="/media/Geboortekaartje_abstract.png"/>
</a>
<div class="card-content">
<h2>Header h2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus.</p>
<p>Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa.</p>
</div>
<div class="card-button-group">
<a class="button button-default button-angle-right" href="#">Button</a>
</div>
</div>
</div>
<div class="xs-12 sm-4">
<div class="card">
<a class="card-thumbnail" href="#">
<img class="card-img" src="/media/Geboortekaartje_abstract.png"/>
</a>
<div class="card-content">
<h2>Header h2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a efficitur velit. Aenean iaculis auctor
urna. Pellentesque cursus sem non tempor dapibus.</p>
<p>Pellentesque cursus sem non tempor dapibus. Duis diam orci, tempor non venenatis a, ultrices et
massa.</p>
</div>
<div class="card-button-group">
<a class="button button-default button-angle-right" href="#">Button</a>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="cols">
<div class="xs-12 sm-6 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Geboortekaartje_olifantjes.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
</div>
</div>
<div class="container">
<div class="cols">
<div class="xs-12 sm-6 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Geboortekaartje_olifantjes.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
<div class="xs-12 sm-6 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Geboortekaartje_olifantjes.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
</div>
</div>
<div class="container">
<div class="cols">
<div class="xs-12 sm-6 md-4 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Posters.jpg"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
<div class="xs-12 sm-6 md-4 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Posters.jpg"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
<div class="xs-12 sm-6 md-4 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Posters.jpg"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
</div>
</div>
<div class="container">
<div class="cols">
<div class="xs-12 sm-6 md-3 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Portret_familie.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
<div class="xs-12 sm-6 md-3 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Portret_familie.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
<div class="xs-12 sm-6 md-3 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Portret_familie.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
<div class="xs-12 sm-6 md-3 mb-5">
<a class="card" href="#">
<img class="card-img" src="/media/Portret_familie.png"/>
<span class="card-btn button button-default button-angle-right">Label</span>
</a>
</div>
</div>
</div>
<div class="container">
<div class="cols sm-cols-spacing">
<div class="xs-6 sm-3">
<a class="card" href="#">
<img class="card-img" src="/media/Instagram_post_1.png"/>
</a>
</div>
<div class="xs-6 sm-3">
<a class="card" href="#">
<img class="card-img" src="/media/Instagram_post_1.png"/>
</a>
</div>
<div class="xs-6 sm-3">
<a class="card" href="#">
<img class="card-img" src="/media/Instagram_post_1.png"/>
</a>
</div>
<div class="xs-6 sm-3">
<a class="card" href="#">
<img class="card-img" src="/media/Instagram_post_1.png"/>
</a>
</div>
</div>
</div>
