Added a message if there is no stream and changed font

index.css

@@ -1,8 +1,13 @@
 html {
     background: #F7A8B8;
-    font-family: "Lucida Console", "Courier New", monospace;
+    font-family: "Linotte", "Lucida Console", monospace;
 }
 
+@font-face {
+    font-family: Linotte;
+    src: url(LinotteRegular.otf);
+  }
+
 a {
     color: black;
     font-weight: bold;
@@ -25,6 +30,8 @@ a {
     margin-left: -40%;
     margin-top: auto;
     margin-bottom: 20%;
+    font-size: 250%;
+    text-align: center;
 }
 
 #streamframe {

index.html

@@ -35,13 +35,30 @@
 
     </nav>
 
+    <script>
+        // Checking if the stream is down and displays a message if it is. 
+        async function isStreamDown() {
+
+            const response = await fetch(`https://cdn.chaos.stream/hls/src/maya.m3u8`);
+
+            if (response.status === 404) {
+                document.getElementById("streamframe").style.display = "none";
+                document.getElementById("stream").style.border = 'double'
+                document.getElementById("stream").innerHTML = 'Currently not streaming.'
+            }
+        }
+
+        window.onload = isStreamDown()
+    </script>
+
     <main>
 
         <section>
 
             <div id="streamchat">
                 <div id="stream">
-                    <iframe id="streamframe" src="https://live.on.chaos.stream/maya" title="mayas stream" scrolling="no"></iframe>
+                    <iframe id="streamframe" src="https://live.on.chaos.stream/maya" title="mayas stream"
+                        scrolling="no"></iframe>
                 </div>
 
                 <iframe id="chatbox" src="chat.html" title="chat box" scrolling="no"></iframe>