107 lines
5.4 KiB
HTML
107 lines
5.4 KiB
HTML
<!DOCTYPE html>
|
|
<html 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">
|
|
|
|
<link href='https://fonts.googleapis.com/css?family=Lobster' rel='stylesheet'>
|
|
<link rel="stylesheet" href="/css/style.css">
|
|
<link rel="stylesheet" href="/css/homeStyle.css">
|
|
<link rel="stylesheet" href="/css/fancyStyle.css">
|
|
<!-- <script src="/js/langHandler.js"></script> -->
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=8">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="Unlock the full potential of your online presence with my hand crafted custom websites. Your new website is tailored to your exact needs and built from scratch. Stand out from the crowd and leave a lasting impression with a website that truly represents your business.">
|
|
<meta name="keywords" content="custom website design, custom web development, custom website solutions, personalised websites, custom websites, websites built from scratch, affordable custom websites">
|
|
|
|
<title>Home :: Development - janishutz.com</title>
|
|
</head>
|
|
<body>
|
|
<div id="nav"></div>
|
|
|
|
<div class="scroll-indicator" id="scroll-hint">
|
|
<div class="scroll-wrapper">
|
|
<div class="scroll-container">
|
|
Scroll to discover more
|
|
<img class="scroll-symbol" src="/assets/doubleArrowDown.svg">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="progress" id="progress">
|
|
<div class="progress-wrapper">
|
|
<img class="progress-item" id="step1" src="/assets/radio_button_checked.svg">
|
|
<img class="progress-item" id="step2" src="/assets/radio_button_unchecked.svg">
|
|
<img class="progress-item" id="step3" src="/assets/radio_button_unchecked.svg">
|
|
<img class="progress-item" id="step4" src="/assets/radio_button_unchecked.svg">
|
|
<img class="progress-item" id="step5" src="/assets/radio_button_unchecked.svg">
|
|
<img class="progress-item" id="step6" src="/assets/radio_button_unchecked.svg">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="background-images" id="images">
|
|
<img src="/assets/screenshotJapan.jpg" id="img1" style="z-index: -6; opacity: 1;">
|
|
<img src="/assets/screenshotBooking.jpg" id="img2" class="hidables" style="z-index: -5;">
|
|
<img src="/assets/screenshotLibreevent.jpg" id="img3" class="hidables" style="z-index: -4;">
|
|
<img src="/assets/screenshotLogin.jpg" id="img4" class="hidables" style="z-index: -3;">
|
|
<img src="/assets/screenshotMainPage.jpg" id="img5" class="hidables" style="z-index: -2;">
|
|
<img src="/assets/screenshotImpress.jpg" id="img6" class="hidables" style="z-index: -1;">
|
|
</div>
|
|
|
|
<div class="step" id="step-1">
|
|
<div class="step-content">
|
|
<h1 class="gradient huge small-margin">Web­sites</h1>
|
|
<h3 class="gradient bigger">Get your new online presence</h3>
|
|
<p class="very-small half-width">This website is designed to be as fancy as possible. Yours can be more like a conventional website, if you wish.</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="step reveal" id="step-2">
|
|
<div class="step-content">
|
|
<h1 class="gradient biggest small-margin">Con­tempo­rary</h1>
|
|
<p class="white half-width">Get a website of any style you want</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="step reveal" id="step-3">
|
|
<div class="step-content">
|
|
<h1 class="gradient biggest small-margin">Cus­tom</h1>
|
|
<p class="white half-width">Built with the technologies used by frameworks, but without the downsides that come with them</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="step reveal" id="step-4">
|
|
<div class="step-content">
|
|
<h1 class="gradient biggest small-margin">Static</h1>
|
|
<p class="white half-width">Websites that display your content in a stylish, beautiful manner, like this website</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="step reveal" id="step-5">
|
|
<div class="step-content">
|
|
<h1 class="gradient biggest small-margin">Dynamic</h1>
|
|
<p class="white half-width">Websites that include blogs, contact forms, registration forms and many more dynamic features, like the contact page</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="step reveal" id="step-6">
|
|
<div class="step-content">
|
|
<h1 class="gradient small-huge small-margin">In­te­res­ted?</h1>
|
|
<h3 class="gradient bigger"><a href="/contact" class="link-invisible">contact me for an offer</a></h3>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
|
|
<script defer src="/js/scrolling.js"></script>
|
|
<script defer src="/js/index.js"></script>
|
|
|
|
<script>
|
|
$( '#nav' ).load( '/nav.html' );
|
|
</script>
|
|
</body>
|
|
</html> |