<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 — Not Found!</title>
{{FAVICONS}}
<link href="/main.css" rel="stylesheet">
<style>
#content {
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='500' height='537' viewBox='0 0 500 537' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3ClinearGradient x1='50%25' y1='0%25' x2='50%25' y2='100%25' id='b'%3E%3Cstop stop-color='%23FFDDF1' offset='0%25'/%3E%3Cstop stop-color='%23FBC8E5' offset='42%25'/%3E%3Cstop stop-color='%23DFA1C5' offset='42%25'/%3E%3Cstop stop-color='%23F08CC7' offset='100%25'/%3E%3C/linearGradient%3E%3ClinearGradient x1='50%25' y1='0%25' x2='50%25' y2='100%25' id='a'%3E%3Cstop stop-color='%23FDEAF5' offset='0%25'/%3E%3Cstop stop-color='%23FDEAF5' offset='42%25'/%3E%3Cstop stop-color='%23F5DEEC' offset='42%25'/%3E%3Cstop stop-color='%23FCE2F1' offset='100%25'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg opacity='0.13' fill='none' fill-rule='evenodd'%3E%3Cpath d='M388 101.5a80.25 80.25 0 0156.92 23.58A80.25 80.25 0 01468.5 182h0v320.5c0 7.93-4.81 18.31-12.4 23.68-7.66 5.4-18.03 5.82-18.85 5.82-7.86 0-16.75-5.23-25.49-10.76-2.52-1.59-5.02-3.17-7.49-4.58-18.53-10.57-27.79-16.02-34.23-19.8-4.27-2.52-7.28-4.3-10.96-6.36h0H111a80.25 80.25 0 01-56.92-23.58A80.25 80.25 0 0130.5 410h0V182a80.25 80.25 0 0123.58-56.92A80.25 80.25 0 01111 101.5h0zm-.02 34H111c-12.7 0-24.21 5.1-32.6 13.35a46.35 46.35 0 00-13.9 32.36V410c0 12.7 5.1 24.21 13.35 32.6a46.35 46.35 0 0032.36 13.9h257.24c43.7 25.2 47.68 27.5 67.1 38.36.04-10.81 0-26.42-.05-41.44v-1.35c-.07-17.82-.11-34.57 0-41.28V182c0-12.7-5.1-24.21-13.35-32.6a46.35 46.35 0 00-32.36-13.9h-.8z' stroke='url(%23a)' stroke-width='9' fill='url(%23b)' fill-rule='nonzero'/%3E%3Cpath d='M258 67v39h-15V67c3.22.92 5.72 1.38 7.5 1.38 1.78 0 4.28-.46 7.5-1.38zm-8-67a30 30 0 110 60 30 30 0 010-60zm0 15a15 15 0 100 30 15 15 0 000-30z' fill='%23FCA0D6'/%3E%3Cpath d='M29 207c.3 0 6-.02 6 0v149H24a21 21 0 01-21-21V228a21 21 0 0121-21h5zm0 15h-5a6 6 0 00-6 5.78V335a6 6 0 005.78 6H29a6 6 0 006-5.78V228a6 6 0 00-5.78-6H29zM470 207h-6v149h11a21 21 0 0021-21V228a21 21 0 00-21-21h-5zm0 15h5a6 6 0 016 5.78v107.23a6 6 0 01-5.77 6H470a6 6 0 01-6-5.78V228.01a6 6 0 015.78-6h.22z' fill='%23FCA0D6' fill-rule='nonzero' opacity='.9'/%3E%3Cpath d='M182.1 347.6c10.1-4.7 16.7-14 20.5-28.6 3-11.1 1.9-37.4-1.8-45.5-1.4-3.2-5.7-4.9-9-3.6-3.9 1.5-5.1 5.6-3.9 13.2 1.6 9.5 1.4 27.5-.4 34.4-3.2 12.3-10.5 18.5-22 18.5-11.1-.1-17.6-5.1-20.6-16-1.8-6.4-1.5-23.9.6-34.8 1.6-8.4 1.6-9.4.1-11.6-2.9-4.5-9.2-4.6-12-.3-3.9 5.8-6 36.8-3.5 48.9 2.1 9.9 8.3 19.4 15.5 23.9 6.3 3.8 11.3 4.9 21.4 4.6 7.8-.3 10.5-.9 15.1-3.1zm169.1.1c9.2-4.5 15.2-12.5 18.3-24.4 3-11.5 1-43.8-3.1-50-2.8-4.3-9.1-4.2-12 .2-1.4 2.2-1.4 3.3.2 12.2 2 11.5 2.2 27.9.5 34.3-3 10.9-9.5 15.9-20.6 16-11.5 0-18.8-6.2-22-18.5-1.8-6.9-2-24.9-.4-34.4 1.2-7.7.1-11.4-4-13.1-3.5-1.4-7.4.2-8.9 3.5-3.7 8.1-4.8 34.4-1.8 45.5 4.6 17.4 13.4 27.6 27 31.1 1.7.4 7.2.7 12.2.6 7.5-.2 10-.7 14.6-3z' fill='%23666472' fill-rule='nonzero'/%3E%3Cpath d='M243 396.1c1.4-1 3.6-3.5 5-5.5 2.2-3.4 2.6-3.6 3.5-2 .5 1 2.6 3.6 4.6 5.6 3.3 3.5 4.1 3.8 9 3.8 6.3 0 10.9-2.4 14-7.2 1.7-2.8 2-4.5 1.6-11.3-.4-8.3-3.6-17.8-6.3-18.9-1.9-.7-4.7 2.3-3.8 4.3 6.7 15.3 5.5 25-3.1 26.7-6.9 1.3-10.7-3.6-12.8-16.6-1.1-7-1.4-7.5-3.7-7.5-2.7 0-3.1.8-5 10.7-1.9 9.8-7.1 15-13.4 13.4-7-1.7-8.6-9.2-4.1-20.1 3-7.1 3.1-9.1.8-10-2.3-.8-4.6 2-7.3 9.3-2.7 7.1-3 15.6-.7 19.9 4 7.5 14.9 10.2 21.7 5.4z' fill='%23989AA1' fill-rule='nonzero'/%3E%3Cpath d='M152 379a1 1 0 011 1v10a1 1 0 11-2 0v-10a1 1 0 011-1zm5.5 0a1 1 0 011 1v10a1 1 0 11-2 0v-10a1 1 0 011-1zm5.5 0a1 1 0 011 1v10a1 1 0 11-2 0v-10a1 1 0 011-1zM338 379a1 1 0 011 1v10a1 1 0 11-2 0v-10a1 1 0 011-1zm5.5 0a1 1 0 011 1v10a1 1 0 11-2 0v-10a1 1 0 011-1zm5.5 0a1 1 0 011 1v10a1 1 0 11-2 0v-10a1 1 0 011-1z' fill='%23DFA1C5'/%3E%3C/g%3E%3C/svg%3E");
background-size: cover;
background-position: center;
}
.center {
color: var(--grey);
--font-height: 3em;
text-align: center;
}
.center h1 {
font-size: var(--font-height);
filter: drop-shadow(0px 2px 4px rgba(0,0,0,0.13));
}
.center h1 img {
height: calc(var(--font-height) / 1.8);
margin: 0 0.2em;
}
.center h1 .pink {
/* font-size: calc(var(--font-height) * 0.2); */
}
.bar {
display: inline-block;
height: 1.1em;
width: 0.3em;
border-radius: 3px;
background: var(--grey);
}
.grey {
color: var(--grey);
}
.pink {
color: var(--pink);
}
</style>
</head>
<body>
<div id="content">
<div class="center">
<h1>
<div class="bar"></div>
<span class="pink">404</span>
<span class="grey">– Where you tryna' go?</span>
<img
class="emoji"
alt="waitwhat"
src="https://cdn.discordapp.com/emojis/706641167760228442.png">
</h1>
</div>
</div>
<!-- GitLink -->
<style>
.gitlink {
position: fixed;
bottom: 1.8em;
right: 1.9em;
padding: 1em 1em 0.9em 1em;
background: #fff;
border: 1px solid #0001;
border-radius: 6px;
}
.gitlink img {
transition: all .1s ease-in-out;
opacity: 0.3;
}
.gitlink img:hover {
opacity: 1;
cursor: pointer;
}
.gitlink,
.gitlink img {
margin: 0;
}
.gitlink img {
padding: 0;
}
</style>
<a class="gitlink" target="_blank" href="https://github.com/Demonstrandum/Simp-O-Matic">
<img src="https://cdn.jsdelivr.net/npm/simple-icons@latest/icons/github.svg" height=22 alt="GitHub" />
</a>
</body>
</html>
