diff --git a/frontend/src/App.scss b/frontend/src/App.scss
index d89981f..89d9d50 100644
--- a/frontend/src/App.scss
+++ b/frontend/src/App.scss
@@ -312,7 +312,7 @@ footer {
   }
 }
 #bg {
-  min-height: 88vh;
+  height: 100vh;
   background-image: url("./assets/potionclassroom.png");
   background-size: cover;
   background-repeat: no-repeat;
@@ -324,7 +324,7 @@ footer {
 #bgTrue {
   text-align: center;
   width: 100%;
-  height: 25vw;
+  height: 130%;
   background-image: url("./assets/potionclassroom-animation-ok.gif");
   background-size: contain;
   background-position: center;
@@ -337,7 +337,7 @@ footer {
 #bgFalse {
   text-align: center;
   width: 100%;
-  height: 25vw;
+  height: 130%;
   background-image: url("./assets/potionclassroom-animation-false.gif");
   background-size: contain;
   background-position: center;
diff --git a/frontend/src/components/Footer.jsx b/frontend/src/components/Footer.jsx
index 365e554..73480ee 100644
--- a/frontend/src/components/Footer.jsx
+++ b/frontend/src/components/Footer.jsx
@@ -30,7 +30,7 @@ function Footer() {
         </button>
       </div>
       {openContact && (
-        <div className="blur-background">
+        <div className="blur-background flex items-center justify-center">
           <Contact closeModal={setOpenContact} />
         </div>
       )}