diff --git a/frontend/src/assets/styles/small_components.css b/frontend/src/assets/styles/small_components.css
index 0df6bb9a..f5a6bdde 100644
--- a/frontend/src/assets/styles/small_components.css
+++ b/frontend/src/assets/styles/small_components.css
@@ -1,5 +1,5 @@
 .popup {
-    position: absolute;
+    position: absolute !important;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
diff --git a/frontend/src/components/Settings.tsx b/frontend/src/components/Settings.tsx
index 5c022894..f669a085 100644
--- a/frontend/src/components/Settings.tsx
+++ b/frontend/src/components/Settings.tsx
@@ -6,7 +6,7 @@ import {JSX} from "react";
 export default function Settings(): JSX.Element  {
     return (
         <>
-            <div className={"popup px-5 py-5 card"}>
+            <div className={"card popup px-5 py-5"}>
                 <p className={"title is-flex is-justify-content-center"}>Settings</p>
                 <img src={"/delphi_full.png"} alt={"image"}/>
                 <div className={"is-flex px-5 py-1 is-align-items-center"}>