161 lines
6.1 KiB
HTML
161 lines
6.1 KiB
HTML
HTTP/1.1 200 OK
|
|
Date: Fri, 20 Jan 2023 20:58:05 GMT
|
|
Server: Apache/2.4.25 (Debian)
|
|
Vary: Accept-Encoding
|
|
Content-Length: 6051
|
|
Content-Type: text/html; charset=UTF-8
|
|
|
|
<!DOCTYPE HTML>
|
|
<!--
|
|
Multiverse by HTML5 UP
|
|
html5up.net | @ajlkn
|
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
|
-->
|
|
<html>
|
|
<head>
|
|
<title>Admirer</title>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
|
<link rel="stylesheet" href="assets/css/main.css" />
|
|
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
|
|
</head>
|
|
<body class="is-preload">
|
|
|
|
<!-- Wrapper -->
|
|
<div id="wrapper">
|
|
|
|
<!-- Header -->
|
|
<header id="header">
|
|
<h1><a href="index.html"><strong>Admirer</strong> of skills and visuals</a></h1>
|
|
<nav>
|
|
<ul>
|
|
<li><a href="#footer" class="icon solid fa-info-circle">About</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
|
|
<!-- Main -->
|
|
<div id="main">
|
|
<article class='thumb'>
|
|
<a href='images/fulls/art01.jpg' class='image'><img src='images/thumbs/thmb_art01.jpg' alt='' /></a>
|
|
<h2>Visual Art</h2>
|
|
<p>A pure showcase of skill and emotion.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/eng02.jpg' class='image'><img src='images/thumbs/thmb_eng02.jpg' alt='' /></a>
|
|
<h2>The Beauty and the Beast</h2>
|
|
<p>Besides the technology, there is also the eye candy...</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/nat01.jpg' class='image'><img src='images/thumbs/thmb_nat01.jpg' alt='' /></a>
|
|
<h2>The uncontrollable lightshow</h2>
|
|
<p>When the sun decides to play at night.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/arch02.jpg' class='image'><img src='images/thumbs/thmb_arch02.jpg' alt='' /></a>
|
|
<h2>Nearly Monochromatic</h2>
|
|
<p>One could simply spend hours looking at this indoor square.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/mind01.jpg' class='image'><img src='images/thumbs/thmb_mind01.jpg' alt='' /></a>
|
|
<h2>Way ahead of his time</h2>
|
|
<p>You probably still use some of his inventions... 500yrs later.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/mus02.jpg' class='image'><img src='images/thumbs/thmb_mus02.jpg' alt='' /></a>
|
|
<h2>The outcomes of complexity</h2>
|
|
<p>Seriously, listen to Dust in Interstellar's OST. Thank me later.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/arch01.jpg' class='image'><img src='images/thumbs/thmb_arch01.jpg' alt='' /></a>
|
|
<h2>Back to basics</h2>
|
|
<p>And centuries later, we want to go back and live in nature... Sort of.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/mind02.jpg' class='image'><img src='images/thumbs/thmb_mind02.jpg' alt='' /></a>
|
|
<h2>We need him back</h2>
|
|
<p>He might have been a loner who allegedly slept with a pigeon, but that brain...</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/eng01.jpg' class='image'><img src='images/thumbs/thmb_eng01.jpg' alt='' /></a>
|
|
<h2>In the name of Science</h2>
|
|
<p>Some theories need to be proven.</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/mus01.jpg' class='image'><img src='images/thumbs/thmb_mus01.jpg' alt='' /></a>
|
|
<h2>Equal Temperament</h2>
|
|
<p>Because without him, music would not exist (as we know it today).</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/nat02.jpg' class='image'><img src='images/thumbs/thmb_nat02.jpg' alt='' /></a>
|
|
<h2>Playful wind and water</h2>
|
|
<p>A colourful wave in the middle of the desert... Isn't Nature amazing?</p>
|
|
</article>
|
|
<article class='thumb'>
|
|
<a href='images/fulls/art02.jpg' class='image'><img src='images/thumbs/thmb_art02.jpg' alt='' /></a>
|
|
<h2>Attitude</h2>
|
|
<p>Art can provoke feelings... or convey powerful messages</p>
|
|
</article>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer id="footer" class="panel">
|
|
<div class="inner split">
|
|
<div>
|
|
<section>
|
|
<h2>Allow yourself to be amazed</h2>
|
|
<p>Skills are not to be envied, but to feel inspired by.<br>
|
|
Visual arts and music are there to take care of your soul.<br><br>
|
|
Let your senses soak up these wonders...<br><br><br><br>
|
|
</p>
|
|
</section>
|
|
<section>
|
|
<h2>Follow me on ...</h2>
|
|
<ul class="icons">
|
|
<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
|
|
<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
|
|
<li><a href="#" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
|
|
<li><a href="#" class="icon brands fa-github"><span class="label">GitHub</span></a></li>
|
|
<li><a href="#" class="icon brands fa-dribbble"><span class="label">Dribbble</span></a></li>
|
|
<li><a href="#" class="icon brands fa-linkedin-in"><span class="label">LinkedIn</span></a></li>
|
|
</ul>
|
|
</section>
|
|
</div>
|
|
<div>
|
|
<section>
|
|
<h2>Get in touch</h2>
|
|
<form method="post" action="#"><!-- Still under development... This does not send anything yet, but it looks nice! -->
|
|
<div class="fields">
|
|
<div class="field half">
|
|
<input type="text" name="name" id="name" placeholder="Name" />
|
|
</div>
|
|
<div class="field half">
|
|
<input type="text" name="email" id="email" placeholder="Email" />
|
|
</div>
|
|
<div class="field">
|
|
<textarea name="message" id="message" rows="4" placeholder="Message"></textarea>
|
|
</div>
|
|
</div>
|
|
<ul class="actions">
|
|
<li><input type="submit" value="Send" class="primary" /></li>
|
|
<li><input type="reset" value="Reset" /></li>
|
|
</ul>
|
|
</form>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</div>
|
|
|
|
<!-- Scripts -->
|
|
<script src="assets/js/jquery.min.js"></script>
|
|
<script src="assets/js/jquery.poptrox.min.js"></script>
|
|
<script src="assets/js/browser.min.js"></script>
|
|
<script src="assets/js/breakpoints.min.js"></script>
|
|
<script src="assets/js/util.js"></script>
|
|
<script src="assets/js/main.js"></script>
|
|
|
|
</body>
|
|
</html>
|