diff --git a/src/components/Email-Form.astro b/src/components/Email-Form.astro
index 0ce69d5..a1bdee6 100644
--- a/src/components/Email-Form.astro
+++ b/src/components/Email-Form.astro
@@ -1,4 +1,4 @@
-<div id="email-form">
+<div id="email-form" class="emailform">
   <div class="signup-container">
     <div class="signup-container1">
       <div class="signup-container2">
@@ -67,23 +67,18 @@
 </div>
 
 <style>
-@media (max-width: 600px) {
- form {
- width: 100%;
- position: fixed;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- }
-}
+  .emailform {
+    transform: translateY(33em);
+    visibility: hidden;
+    position: absolute;
+  }
 
-#email-form {
- visibility: hidden;
- position: fixed;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
-}
+  @media (max-width: 825px) {
+    .emailform {
+      position: absolute;
+      transform: translateY(-7em);
+    }
+  }
 
   form {
     display: flex;
@@ -99,6 +94,12 @@
     border: 1px solid var(--dl-color-gray-white); /* added white border */
   }
 
+  @media (max-width: 825px) {
+    form {
+      width: 95%;
+    }
+  }
+
   input[type="text"],
   input[type="email"] {
     width: 100%;