File: /var/www/vhosts/creativefellows.nl/test.creativefellows.nl/scrambled-ads/views/view.page copy.php
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Scrambled Ads</title>
<link rel="stylesheet" href="https://use.typekit.net/orm8sfw.css">
<link rel="stylesheet" href="/css/app.css">
</head>
<body>
<header>
<div class="top-bar">
<div class="top-bar-left">
<a href="/" class="logo"><img src="http://www.scrambledads.nl/images/logo_scrambledads.svg"></a>
<span class="toggle-menu" data-responsive-toggle="responsive-menu" data-hide-for="%s"><button class="toggle-navigation" type="button" data-toggle="responsive-menu"><span></span><span></span><span></span><span></span></button></span>
</div>
<div class="top-bar-right">
<div id="responsive-menu" data-animate="fade-in fade-out">
<ul class="vertical menu nec-logo" data-responsive-menu="accordion">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">Portfolio</a>
<!--<ul class="menu vertical">
<li><a href="#">Vastgoed</a></li>
<li><a href="#">Duurzaamheid</a></li>
<li><a href="#">Overig</a></li>
</ul>-->
</li>
<li><a href="#">Wat we doen</a></li>
<li><a href="#">Wie wij zijn</a></li>
<li><a href="#">Nieuws</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
</header>
<div class="page-section page_section__hero">
<div class="grid-container">
<div class="grid-y grid-padding-x align-middle">
<div class="cell small-12" style="height:100vh">
<div class="grid-x grid-padding-x align-middle" style="height:100%">
<div class="small-12 medium-8 cell align-middle">
<div class="column-wrapper">
<h1>Wij zijn een creative agency voor design, strategie en campagnes.</h1>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="page-section page_section__intro-items">
<div class="grid-container">
<div class="grid-x grid-padding-x">
<div class="large-4 medium-4 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom"><div class="lazy" data-src="https://picsum.photos/400?random=1"></div></a>
<h2>Aenean vulputate eleifend tellus</h2>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
<div class="large-4 medium-4 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom"><div class="lazy" data-src="https://picsum.photos/400?random=1"></div></a>
<h2>Aenean vulputate eleifend tellus</h2>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
<div class="large-4 medium-4 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom"><div class="lazy" data-src="https://picsum.photos/400?random=1"></div></a>
<h2>Aenean vulputate eleifend tellus</h2>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="page-section">
<div class="grid-container">
<div class="grid-x grid-padding-x align-middle">
<div class="small-12 medium-6 cell">
<h2>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu</h2>
<p>Scrambled Ads is een klein team van ontwerpers en conceptdenkers met een breed en rijk gevuld portfolio. Samen met onze opdrachtgevers gaan we uitdagingen aan en bouwen en versterken we merken. Zo zorgen we voor krachtige communicatie. Online en offline en altijd helder en pragmatisch. </p>
<p><a href="#" class="button primary hollow header-font"><strong>Bekijk portfolio</strong></a></p>
</div>
<div class="small-12 medium-6 cell">
<a class="image"><div class="lazy lazy__light-gray" data-src="https://picsum.photos/800"></div></a>
</div>
</div>
</div>
</div>
<div class="page-section page_section__background-light">
<div class="grid-container">
<div class="grid-x grid-padding-x">
<div class="small-12 cell text-center">
<div class="column-wrapper">
<h2>Follow our journey</h2>
</div>
</div>
<div class="small-12 medium-3 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom image__space-top lazy" data-src="https://picsum.photos/400"> </a>
<h4>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</h4>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
<div class="small-12 medium-3 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom image__space-top lazy" data-src="https://picsum.photos/400"> </a>
<h4>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</h4>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
<div class="small-12 medium-3 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom image__space-top lazy" data-src="https://picsum.photos/400"> </a>
<h4>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</h4>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
<div class="small-12 medium-3 cell">
<div class="column-wrapper">
<a class="image image__hover-scale image__space-bottom image__space-top lazy" data-src="https://picsum.photos/400"> </a>
<h4>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</h4>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<p><a href="#" class="header-font">Bekijk in portfolio</a></p>
</div>
</div>
</div>
</div>
</div>
<footer class="page-section page_section__background-black">
<div class="grid-container">
<div class="grid-x grid-padding-x">
<div class="small-12 medium-8 cell">
<ul class="no-bullet">
<li>SCRAMBLED ADS</li>
<li>RAADHUISSTRAAT 247</li>
<li>2406 AD ALPHEN AAN DEN RIJN</li>
<li>0172 74 42 74</li>
</ul>
</div>
<div class="small-12 medium-4 cell">
<ul class="no-bullet">
<li>Portfolio</li>
<li>Contact</li>
<li>Wat we doen</li>
<li>Wie we zijn</li>
</ul>
</div>
</div>
</div>
</footer>
<script src="node_modules/jquery/dist/jquery.js"></script>
<script src="node_modules/what-input/dist/what-input.js"></script>
<script src="node_modules/foundation-sites/dist/js/foundation.js"></script>
<script src="node_modules/jquery-lazy/jquery.lazy.min.js"></script>
<script src="js/app.js"></script>
</body>
</html>