Update stuff

diff --git a/index.html b/index.html
index 2585b3cbecc44dcce90dc262d645909607f7e4ba..ef4f0d9f0f5a48259dbebbff2c72154c895cc524 100644 (file)
--- a/index.html
+++ b/index.html
@@ -6,13 +6,26 @@
   </head>
   <body>
     <div id="main">
-      <h2>Autumn on Tangled</h2>
+      <h2>Autumn on <i>Tangled</i></h2>
       <hr>
       <p>Hello, and welcome to my Tangled homepage.<br>You've probably already seen my main homepage, hosted on GitHub. However, in search of better alternatives, I'm hosting my own knot on Tangled, and porting a website through their infrastructure.</p>
     </div>
     <style>
+      @font-face {
+        font-family: "Maple Mono";
+        src: url("https://cdn.amazingca.dev/assets/fonts/maple-mono/MapleMono-Medium.ttf.woff2") format("woff2");
+        font-style: normal;
+      }
+      @font-face {
+        font-family: "Maple Mono";
+        src: url("https://cdn.amazingca.dev/assets/fonts/maple-mono/MapleMono-MediumItalic.ttf.woff2") format("woff2");
+        font-style: italic;
+      }
       body {
-        font-family: sans-serif !important;
+        background-color: whitesmoke;
+        display: flex;
+        font-family: "Maple Mono", sans-serif !important;
+        justify-content: center;
         margin: 1em;
       }
       #main {
@@ -20,19 +33,30 @@
         border: 4px solid purple;
         max-width: 500px;
         padding: 1em;
+        position: absolute;
+        top: 30vh;
+        
+        > h2, > p {
+          margin: 0;
+        }
       }
-      #main > h2, #main > p {
-        margin: 0;
+      hr {
+        border: 1px solid black;
       }
-      @media screen and (max-width: 350px) {
+      @media screen and (max-width: 450px) {
         body {
           background-color: lavender;
         }
         #main {
           border: unset;
           padding: unset;
+          top: unset;
+
+          > h2 {
+            text-align: center;
+          }
         }
       }
-    </style
-  </body
-</html
+    </style>
+  </body>
+</html>