diff --git a/01-frontend/src/pages/NoPage.tsx b/01-frontend/src/pages/NoPage.tsx
index 7d1bd6c..c5264a7 100644
--- a/01-frontend/src/pages/NoPage.tsx
+++ b/01-frontend/src/pages/NoPage.tsx
@@ -1,10 +1,11 @@
-import { Box, Typography, Button } from "@mui/material";
+import {Box, Typography, Button, useTheme} from "@mui/material";
 import { useNavigate } from "react-router-dom";
 import "./pages.css";
 import {useTranslation} from "react-i18next";
 
 export default function NoPage() {
 
+    const theme = useTheme();
     const { t } = useTranslation();
     const navigate = useNavigate();
 
@@ -13,7 +14,10 @@ export default function NoPage() {
     };
 
     return (
-        <Box className="no-page-container">
+        <Box
+            className="no-page-container"
+            sx={{ color: theme.palette.text.primary }}
+        >
             <Typography variant="h1" className="no-page-title">
                 404
             </Typography>
diff --git a/01-frontend/src/pages/pages.css b/01-frontend/src/pages/pages.css
index 54e49e0..c1ed087 100644
--- a/01-frontend/src/pages/pages.css
+++ b/01-frontend/src/pages/pages.css
@@ -5,28 +5,23 @@
     justify-content: center;
     height: 100vh;
     text-align: center;
-    background-color: var(--background-color);
-    color: var(--text-color);
     gap: 2%;
 }
 
 .no-page-title {
     font-size: 8rem;
     font-weight: bold;
-    color: var(--text-color);
     margin-bottom: 16px;
 }
 
 .no-page-subtitle {
     font-size: 1.5rem;
     margin-bottom: 8px;
-    color: var(--text-color);
 }
 
 .no-page-description {
     font-size: 1rem;
     margin-bottom: 24px;
-    color: var(--text-color);
 }
 
 .no-page-button {