index.html

<!DOCTYPE html>
<html>
  <head>
    <title>Jim's Diversified Holdings</title>
    <style>
     * {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
     }

     html, body {
       height: 100vh;
     }

     html {
       background-image: linear-gradient(to bottom, #59d 0%, #2673bf 100%);
     }

     body {
       background-image: linear-gradient(rgba(255,255,255,.3) 2px, transparent 2px),
         linear-gradient(90deg, rgba(255,255,255,.3) 2px, transparent 2px),
         linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
         linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
       background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
       background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px
     }

     h1, h2 {
       text-align: center;
       font-family: noto sans mono, mono;
       letter-spacing: 3px;
       text-shadow: 2px 2px 2px rgba(100, 100, 100, 0.5);
       font-variant-ligatures: none;
       padding: 20px;
     }

     h1 {
       font-size: 24pt;
       font-style: italic;
       color: white;
     }

     body {
       padding-top: 100px;
     }

     div#links {
       padding-top: 60px;
       font-family: noto sans mono, mono;
       text-align: center;
     }

     a {
       color: orange;
       font-weight: bold;
     }
     a:visited {
       color: orange;
     }
     a:hover {
       color: red;
     }
    </style>
  </head>
  <body>
    <h1>
      Jim's Diversified Holdings
    </h1>
    <div id="links">
      ⛵ | <a href="http://blog.jimmo.id.au/">Blog</a> | <a href="https://github.com/jimmo">GitHub</a> | <a rel="me" href="https://mastodon.social/@jimmo">Mastodon</a> | <a href="https://twitter.com/jim_mussared">Twitter</a> | 🌴
    </div>
  </body>
</html>