<!DOCTYPE html>
<html>

<head>
    <title>Burgernotes</title>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>

<body>
    <div class="mainDiv">
    <h1>Burgernotes is down</h1>
    <p>We're down for maintenance, please try again later!</p>

    <!-- please don't mind the spaghetti code :3 -->
    <img class="grid" src="/grid.svg">
    <img class="grid grid2" src="/grid.svg">
    <img class="grid grid3" src="/grid.svg">
    <img class="grid grid4" src="/grid.svg">
    <img class="grid grid5" src="/grid.svg">
    <img class="grid grid6" src="/grid.svg">
    <img class="grid grid7" src="/grid.svg">
    <img class="grid grid8" src="/grid.svg">
    <img class="grid grid9" src="/grid.svg">
    <img class="grid grid10" src="/grid.svg">
    <img class="grid grid11" src="/grid.svg">
    <img class="grid grid12" src="/grid.svg">
    <img class="grid grid13" src="/grid.svg">
    <img class="grid grid14" src="/grid.svg">
    <img class="grid grid15" src="/grid.svg">
    <img class="grid grid16" src="/grid.svg">
    <img class="grid grid17" src="/grid.svg">
    <img class="grid grid18" src="/grid.svg">
    <img class="grid grid19" src="/grid.svg">
    <img class="grid grid20" src="/grid.svg">
    <img class="grid grid21" src="/grid.svg">
    <img class="grid grid22" src="/grid.svg">
    </div>
</body>

<style>
    @import url("/static/fonts/inter.css");
    body {
        position: absolute;
        margin-left: 25px;
        left: 0;
        bottom: 50%;
        font-family: "Inter", sans-serif;
        background-color: #202020;
        color: white;
    }

    .grid {
        position: fixed;
        left: 0;
        bottom: 0;
    }

    .grid2 {
        left: 100px;
    }
    .grid3 {
        left: 200px;
    }
    .grid4 {
        left: 300px;
    }
    .grid5 {
        left: 400px;
    }
    .grid6 {
        left: 500px;
    }
    .grid7 {
        left: 600px;
    }
    .grid8 {
        left: 700px;
    }
    .grid9 {
        left: 800px;
    }
    .grid10 {
        left: 900px;
    }
    .grid11 {
        left: 1000px;
    }
    .grid12 {
        left: 1100px;
    }
    .grid13 {
        left: 1200px;
    }
    .grid14 {
        left: 1300px;
    }
    .grid15 {
        left: 1400px;
    }
    .grid16 {
        left: 1500px;
    }
    .grid17 {
        left: 1600px;
    }
    .grid18 {
        left: 1700px;
    }
    .grid19 {
        left: 1800px;
    }
    .grid20 {
        left: 1900px;
    }
    .grid21 {
        left: 2000px;
    }
    .grid22 {
        left: 2100px;
    }
</style>

</html>
