diff --git a/css/style.css b/css/style.css
index bf193bf..eb4b49d 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1653,3 +1653,96 @@ h5,
 .navbar.fixed-top.navbar-light .navbar-nav .nav-link:hover {
   color: purple;
 }
+
+/* Style for placeholder text */
+::placeholder {
+  color: white; /* Color of the placeholder text */
+  opacity: 1; /* Fully opaque text */
+}
+
+/* Style for input fields with purple background placeholder */
+.custom-placeholder::placeholder {
+  color: black; /* Placeholder text color */
+}
+
+.custom-placeholder {
+  background-color: #e8d2ee; /* Background color for input */
+  color: white; /* Text color for input */
+}
+
+#contact button {
+  background: #8a2be2;
+  border: none;
+}
+
+#contact button:hover {
+  background: rgb(199, 35, 199);
+}
+
+.sub-title {
+  font-size: 1.5rem;
+  font-weight: 900;
+}
+
+@media (min-width: 300px) {
+  .accordion__question,
+  .accordion__answer {
+    font-size: 0.8rem;
+  }
+
+  .accordion__icon {
+    width: 1.6rem;
+    height: 1.6rem;
+  }
+}
+
+@media (min-width: 576px) {
+  .sub-title {
+    font-size: 2rem;
+  }
+
+  .accordion__question,
+  .accordion__answer {
+    font-size: 1rem;
+  }
+  .accordion__icon {
+    width: 1.7rem;
+    height: 1.7rem;
+  }
+}
+
+@media (min-width: 768px) {
+  .sub-title {
+    font-size: 2.5rem;
+  }
+  .accordion__question,
+  .accordion__answer {
+    font-size: 1.5rem;
+  }
+
+  .accordion__icon {
+    width: 1.8rem;
+    height: 1.8rem;
+  }
+}
+
+@media (min-width: 992px) {
+  .sub-title {
+    font-size: 3rem;
+  }
+  .accordion__question,
+  .accordion__answer {
+    font-size: 2rem;
+  }
+
+  .accordion__icon {
+    width: 2rem;
+    height: 2rem;
+  }
+}
+
+@media (min-width: 1200px) {
+  .sub-title {
+    font-size: 3.5rem;
+  }
+}
diff --git a/images/logo-no-background.png b/images/logo-no-background.png
new file mode 100644
index 0000000..1facf9a
Binary files /dev/null and b/images/logo-no-background.png differ
diff --git a/images/logo.png b/images/logo.png
new file mode 100644
index 0000000..ebca650
Binary files /dev/null and b/images/logo.png differ
diff --git a/images/sort-bg.png b/images/sort-bg.png
new file mode 100644
index 0000000..420a464
Binary files /dev/null and b/images/sort-bg.png differ
diff --git a/images/vs-high-resolution-logo.png b/images/vs-high-resolution-logo.png
new file mode 100644
index 0000000..d1aa1c8
Binary files /dev/null and b/images/vs-high-resolution-logo.png differ
diff --git a/index.html b/index.html
index d8dedf5..263427e 100644
--- a/index.html
+++ b/index.html
@@ -116,7 +116,7 @@
     </nav> -->
 
     <nav class="navbar navbar-expand-lg fixed-top" style="background-color: #303842;">
-       <!-- <nav class="site-navbar py-4 js-sticky-header site-navbar-target" role="banner"> -->
+      <!-- <nav class="site-navbar py-4 js-sticky-header site-navbar-target" role="banner"> -->
       <div class="container-fluid">
           <a class="navbar-brand" style="font-weight: 900 ; color: white;" href="#">Visual Sort</a>
           <button class="navbar-toggler" style="border-color: white;" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
@@ -159,8 +159,7 @@
               </ul>
           </div>
       </div>
-  </nav>
-
+      </nav>
  
 
     <div class="intro-section" id="home-section">
@@ -822,36 +821,44 @@ <h2 class="accordion__question">Do I need any prior knowledge to use Visual Sort
       </div>
     </section>
     
-    <section class="contact us" id="contact us">
-
-      <div id="contact">
-          <div class="container">
-              <div class="row">
-                  <div class="contact-left">
-                      <h1 class="sub-title">Contact Me</h1>
-
-                      <div class="social-icon">
-                          <a href="#" target="_blank"><i class="fa-brands fa-facebook"></i></a>
-                          <a href="#" target="_blank"><i class="fa-brands fa-twitter-square"></i></a>
-                          <a href="#" target="_blank"><i class="fa-brands fa-instagram"></i></a>
-                          <a href="#" target="_blank"><i class="fa-brands fa-linkedin"></i></a>
-                      </div>
 
-                  </div>
-                  <div class="contact-right">
-                      <form name="submit-to-google-sheet">
-                          <input type="text" name="Name" placeholder="Your Name" required>
-                          <input type="email" name="Email" placeholder="Your Email" required>
-                          <textarea name="Message" rows="6" placeholder="Your Message"></textarea>
-                          <button type="submit" class="btn btn2">Submit</button>
-                      </form>
-                      <span id="msg"></span>
-                  </div>
+
+    <section class="contact-us" id="contact-us">
+      <div id="contact" class="py-5">
+        <div class="container">
+          <div class="row">
+            <div class="col-lg-6 mb-4">
+              <h1 class="sub-title">Contact Us</h1>
+              <div class="social-icon d-flex">
+                <a href="#" target="_blank" class="me-3"><i class="fa-brands fa-facebook"></i></a>
+                <a href="#" target="_blank" class="me-3"><i class="fa-brands fa-twitter-square"></i></a>
+                <a href="#" target="_blank" class="me-3"><i class="fa-brands fa-instagram"></i></a>
+                <a href="#" target="_blank" class="me-3"><i class="fa-brands fa-linkedin"></i></a>
               </div>
+            </div>
+            <div class="col-lg-6">
+              <form name="submit-to-google-sheet">
+                <div class="mb-3">
+                  <input type="text" name="Name" class="form-control custom-placeholder" placeholder="Your Name" required>
+                </div>
+                <div class="mb-3">
+                  <input type="email" name="Email" class="form-control custom-placeholder" placeholder="Your Email" required>
+                </div>
+                <div class="mb-3">
+                  <textarea name="Message" class="form-control custom-placeholder" rows="6" placeholder="Your Message"></textarea>
+                </div>
+                <button type="submit" class="btn btn-primary">Submit</button>
+              </form>
+              <span id="msg"></span>
+            </div>
           </div>
+        </div>
+      </div>
+    </section>
+    
+
 
 
-  </section>
 
  <footer class="container py-4 py-md-5 px-4 px-md-3">
     <div class="row d-flex justify-content-center align-items-center text-center">