<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>404</title>

    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato&display=swap">
    <link rel="icon" href="favicon.ico">

    <style>
        body {
            font-family: Lato, sans-serif;
            font-display: swap;
            background-color: rgb(49, 101, 43);
        }

        .content {
            color: white;
            position: absolute;
            text-align: center;
            left: 50%;
            top: 40%;
            transform: translate(-50%, -60%);
        }

        .disclaimer {
            position: absolute;
            bottom: 10px;
            right: 10px;
            color: darkgray;
        }

        a {
            color: #8db3f4;
            text-decoration: none;
        }

        .email {
            color: gray;
        }

        .go-home {
            margin-top: 25px;
        }

    </style>
</head>

<body>
    <div class="content">
        <h1>🏡 Four Oh Four</h1>
        <p>
            A <em>tiny</em> error occurred: We can't find this page.
        </p>
        <p>
            <em style="color: darkgray;">Get it?</em>
        </p>
        <p class="go-home">
            <a href="https://tinylifegame.com">Go home</a>
        </p>
    </div>
    <div class="disclaimer">
        <em>If you think there should be something here, please notify us at <a class="email" href="mailto:games@ellpeck.de">games@ellpeck.de</a>.</em>
    </div>
</body>

</html>