404.html

---
title: 'Not Found'
layout: default
permalink: /404.html
excludeFromSitemap: true
---

<style type="text/css" media="screen">
	.container {
		margin: 1rem auto;
		max-width: 40rem;
		text-align: center;
	}

	h1 {
		margin: 2rem 0;
		font-size: 4em;
		line-height: 1;
		letter-spacing: -1px;
	}

	.missing-page-graphic {
		display: block;
		margin: 1rem;

		img {
			border-radius: var(--border-radius);
		}
	}

	#archive-link {
		display: none;
		margin: 1rem;
	}
</style>

<div class="container">
	<h1>404</h1>

	<p>
		<strong>Page not found :(</strong>
	</p>
	<picture class="missing-page-graphic">
		<source srcset="/assets/img/owl-looking.webp" type="image/webp"/>
		<img alt="" src="/assets/img/owl-looking.gif"/>
	</picture>
	<a
		href="/"
		class="btn-link btn-secondary"
	>
		Go back to home
	</a>
	<a class="btn-link btn-alternate" href="/#connect">
		Contact Me
	</a>
	<a id="archive-link">Check the Internet Archive</a>
</div>

<script>
	const link = document.getElementById('archive-link');
	link.href = "https://web.archive.org/web/*/" + document.location;
	link.style.display = 'block';
</script>