diff --git a/frontend/public/images/contactUS.png b/frontend/public/images/contactUS.png
new file mode 100644
index 0000000..40901a1
--- /dev/null
+++ b/frontend/public/images/contactUS.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:64ee2caf9f3a6eab5ed438c847bac44c0573e1bf66595a7f584160a06f066c82
+size 38109
diff --git a/frontend/src/pages/Contact/Contact.css b/frontend/src/pages/Contact/Contact.css
index a95fff9..d784eec 100644
--- a/frontend/src/pages/Contact/Contact.css
+++ b/frontend/src/pages/Contact/Contact.css
@@ -1,95 +1,83 @@
-.inner-container {
-    border: 2px solid #ccc; /* Added solid border style */
-    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
+.inner-container{
+   border:2px;
+   box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;   
+   display: flex;
+   flex-direction: row-reverse;
+   align-items: center;
+   margin-block: 20px;;
+}
+.img-container img{
+   width:30vw; 
+}
+.contact-container{
     display: flex;
-    flex-direction: row-reverse;
+    justify-content: center;
     align-items: center;
-    margin-block: 20px;
-}
+  
 
-.img-container img {
-    width: 30vw;
 }
 
-.contact-container {
-    display: flex;
-    justify-content: center;
-    align-items: center;
+form input{
+     box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
 }
 
-form input,
-form textarea {
+form textarea{
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
-    transition: transform 0.3s ease; /* Smooth transition for size change */
 }
 
-form input:hover,
-form textarea:hover {
-    transform: scale(1.05); /* Grow in size on hover */
-}
 
-form input {
-    padding: 10px; /* Added padding for better appearance */
-}
+.form{
+    
 
-.form {
-    width: 30vw;
+    width:30vw;
     padding-block: 10px;
     padding-inline: 20px;
-    background-color: #FFE7D1;
-    height: 80vh;
+    background-color: #9eccea7b;
+    height:80vh;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }
-
-.btn {
+.btn{
     background-color: #1665C0;
-    width: 10vw;
+    width:10vw;
     text-align: center;
     color: #fff;
-    padding: 10px; /* Added padding for better appearance */
-    border: none; /* Remove default border */
-    transition: transform 0.3s ease; /* Smooth transition for size change */
-}
 
-.btn:hover {
+}
+.btn:hover{
     background-color: #1665C0;
     opacity: 0.8;
     color: #fff;
-    transform: scale(1.1); /* Grow in size on hover */
 }
-
-.form h1 {
+.form h1{
     font-size: 32px;
-    font-weight: bold;
-    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-}
+    font-weight:bold;
+    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
 
-.button-container {
-    display: flex;
-    justify-content: center;
-    margin-block: 10px;
-    height: 10vh;
-    align-items: end;
 }
+.button-container{
+ display: flex;
+ justify-content: center;
+ margin-block: 10px;
+ height: 10vh;
 
-.form label {
-    font-weight: bold;
+ align-items: end;
+}
+.form label{
+    font-weight:bold;
     margin-bottom: 2px;
 }
-
-.msg-label {
-    margin-left: 2px;
+.msg-label{
+    margin-left: 2px;;
 }
-
-.h1-div {
-    height: 10vh;
+.h1-div{
+   
+    height:10vh;
     display: flex;
     align-items: end;
 }
-
 .black-line {
     display: inline-block;
     width: 100px;
@@ -97,23 +85,21 @@ form input {
     background-color: black;
 }
 
-@media screen and (max-width: 768px) {
-    .inner-container {
+@media screen and (max-width: 768px){
+    .inner-container{
         flex-direction: column;
     }
-    .form {
-        width: 90vw;
+    .form{
+        width:90vw;
         height: fit-content;
         padding-block: 20px;
     }
-    .img-container {
-        display: none;
-    }
-    .button-container {
-        height: fit-content;
+    .img-container{
+        display:none
+     }
+     .button-container{
+        height:fit-content;
         margin-block: 20px;
-    }
-   .btn{
-        width:20vw;
-    }
+     }
+    
 }
diff --git a/frontend/src/pages/Contact/Contact.js b/frontend/src/pages/Contact/Contact.js
index e26da85..72f2362 100644
--- a/frontend/src/pages/Contact/Contact.js
+++ b/frontend/src/pages/Contact/Contact.js
@@ -15,7 +15,7 @@ function Contact() {
   return (
     <div className="contact-container" style={{marginTop: "100px", marginBottom: "80px", padding:"10px"}}>
      <div class="inner-container">
-     <div class="img-container "><img src="/images/contact.jpg" alt="Contact" /></div>
+     <div class="img-container "><img src="/images/contactUs.png" alt="Contact" /></div>
  <div className="form " style={{ maxWidth: "600px" }}>
       <div class="h1-div">
       <h1>We'd love to help</h1>