2024-10-23 22:22:40 -04:00

116 lines
2.5 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
<title>Not Found (404)</title>
<style>
:root {
--color-bg: #eee;
--color-highlight: #000000;
--color-text: #404040;
--color-border:#bbbbbb;
}
@media (prefers-color-scheme: dark) {
:root {
--color-bg:#1f242b;
--color-highlight: #ffffff;
--color-text: #bbb;
--color-border:#2b323b;
}
* {
scrollbar-color:#313137 #171b20;
}
}
*,
*::after,
*::before {
box-sizing: border-box;
}
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-weight: 400;
color: #666;
color: var(--color-text);
background-color:#fff;
background-color: var(--color-bg);
font-size: 15px;
}
h1 {
margin-top: 0;
font-size: 36px;
font-weight: normal;
color: var(--color-highlight);
font-weight:300;
}
.emoj {
font-size: 70px;
margin-right: 25px;
}
p {
font-size: 18px;
color: var(--color-text);
line-height: 1.2em;
font-weight:300;
}
h3 {
color: var(--color-text);
font-size: 22px;
font-weight: normal;
line-height: 28px;
font-weight:300;
}
hr {
max-width: 800px;
margin: 18px auto;
border: 0;
border-bottom: 1px solid var(--color-border);
}
.container {
margin: auto;
text-align: center;
display: flex;
flex-wrap: wrap;
height: 100vh;
width: 100%;
align-items: center;
}
.content {
margin: auto;
width: 100%;
padding: 10px;
max-width: 400px;
text-align: left;
}
</style>
</head>
<body>
<div class="container">
<div class="content">
<h1> <span class="emoj">:(</span>404 Not Found</h1>
<h3>The page you're looking for could not be found.</h3>
<hr/>
<p>Make sure the address is correct and that the page hasn't moved.</p>
</div>
</div>
</body>
</html>