mobile fix

static/css/404.css

@@ -1,8 +1,12 @@
+#snakeContainer {
+    padding: 15px;
+}
+
 canvas#snakeCanvas {
-    margin: 15px;
     box-sizing: border-box;
     border: 2px solid var(--secondary-background-color);
     border-radius: 10px;
+    width: 100%;
 }
 
 form {
@@ -110,4 +114,42 @@ dialog h2 {
 dialog p {
     margin: 0;
     font-size: 1rem;
+}
+
+@media screen and (max-width: 850px) {
+    .flex-row {
+        flex-direction: column;
+    }
+
+    form {
+        align-items: center;
+        width: 100%;
+    }
+
+    .min-width {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+}
+
+@media screen and (max-width: 650px) {
+    .mobileOnly {
+        display: flex;
+    }
+    
+    .pcOnly {
+        display: none;
+    }
+}
+
+@media screen and (min-width: 651px) {
+    .mobileOnly {
+        display: none !important;
+    }
+    
+    .pcOnly {
+        display: flex;
+    }
 }