From 5bed5197aa89b087872b39fbfcff3f0f23630a13 Mon Sep 17 00:00:00 2001
From: Vansh Malhotra <vansh.malhotra439@gmail.com>
Date: Sun, 28 Sep 2025 17:06:18 +0530
Subject: [PATCH] Fix 404 page styling responsiveness (#3575)

---
 server/views/404Page.js | 25 ++++++++++++++++---------
 1 file changed, 16 insertions(+), 9 deletions(-)

diff --git a/server/views/404Page.js b/server/views/404Page.js
index 7c864f4009..9f0046da00 100644
--- a/server/views/404Page.js
+++ b/server/views/404Page.js
@@ -14,31 +14,38 @@ const insertErrorMessage = (htmlFile) => {
     <style>
       .header {
         position: fixed;
-        height: 200px;
-        width: 100%;
-        z-index: 1;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        left: 50%;
+        width: 600px; /* keeps it neat on larger screens */
         background: white;
         color: #ed225d;
         font-family: Montserrat, sans-serif;
         text-align: center;
-        display: table;
+        padding: 20px;
+        box-sizing: border-box;
+        border-radius: 8px;
+        max-width: 90%;
       }
+
       .message-container {
-        display: table-cell;
-        vertical-align: middle;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        display: flex;
       }
       .message {
+        margin: 10px 0;
         color: #6b6b6b;
-        margin: 10px;
       }
       .home-link {
-        color: #b5b5b5;
         text-decoration: none;
+        color: #b5b5b5;
       }
       canvas {
-        position: fixed;
         width: 100% !important;
         height: 100% !important;
+        position: fixed;
       }
     </style>
     <link href='https://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>