added generic html website

error.html

@@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" />
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@500&display=swap" rel="stylesheet">
+    <title>alex! - page not found</title>
+    <style>
+        body {
+            background-color:black;
+            font-family: 'DM Sans', sans-serif;
+
+        }
+
+        #header {
+            margin-bottom: 0;
+            transform: translateY(100%);
+            animation-delay:5s;
+            animation: move-up 1s forwards 1s;
+        }
+
+        a {
+            color:white;
+            text-decoration:none;
+        }
+
+        a:hover {
+            color:gray;
+        }
+
+        .error-message {
+            margin-top: 0;
+            opacity: 0;
+            animation-delay:6s;
+            animation: fade-in 1s forwards 1.5s;
+        }
+
+        .ital {
+            font-size:10px;
+            color:darkgray;
+        }
+
+        @keyframes move-up {
+            from {
+                transform: translateY(100%);
+            }
+            to {
+                transform: translateY(0%);
+            }
+        }
+
+        @keyframes fade-in {
+            from {
+                opacity: 0;
+            }
+            to {
+                opacity: 1;
+            }
+        }
+
+        #container {
+            color:white;
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            -webkit-transform: translate(-50%, -50%);
+            transform: translate(-50%, -50%);
+        }
+
+        #socials {
+            display:inline-block;
+            font-size:20px;
+        }
+    </style>
+</head>
+<body>
+    <div id="container">
+        <h1 id="header">something's not quite right..</h1>
+        <p class="error-message">that page doesn't exist. how'd you get here?<br />
+        <a href="#" onclick="history.back()">lets head back now.</a></p>
+        <div id="socials" class="error-message">
+            <a href="https://twitter.com/zstreamss" target="_blank" rel="noreferrer">
+                <i class="fa-brands fa-twitter"></i>
+            </a>
+            <a href="https://linkedin.com/in/thatalex" target="_blank" rel="noreferrer">
+                <i class="fa-brands fa-linkedin"></i>
+            </a>
+            <a href="mailto:hello@thatalex.dev" target="_blank" rel="noreferrer">
+                <i class="fa-solid fa-envelope"></i>
+            </a>
+        </div>
+        <p class="error-message ital"><i>meanwhile, reach me here if this page should exist</i></p>
+    </div>
+</body>
+</html>