diff --git a/Css-files/content.css b/Css-files/content.css
index b46dad7b..9f113ef7 100644
--- a/Css-files/content.css
+++ b/Css-files/content.css
@@ -145,6 +145,29 @@ body {
   padding-bottom: 10px;
 }
 
+.search-bar{
+width:150px;
+margin:12px;
+}
+.search-input{
+  background-color:transparent;
+  margin-top:5px;
+  color:white;
+  border-style:none;
+}
+.search-input:active{
+  border-style:none;
+  outline:none;
+}
+.search-button{
+  outline:none;
+  background-color:transparent;
+  border-style: none;
+}
+.searchImg{
+  width:23px;
+  height:23px;
+}
 /* .mainhead p {
   font-size: 1.2rem;
   color: brown;
diff --git a/Css-files/services1.css b/Css-files/services1.css
new file mode 100644
index 00000000..22fff31f
--- /dev/null
+++ b/Css-files/services1.css
@@ -0,0 +1,93 @@
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: 'Poppins', sans-serif;
+}
+.container{
+    position: relative;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 100px 50px;
+    padding: 100px 50px;
+}
+/* background cards size and rounding */
+.container .card
+{
+    position: relative;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
+    width: 350px;
+    height: 300px;
+    background: #fff;
+    border-radius: 20px;
+    box-shadow: 0 35px 80px rgba(0,0,0,0.15);
+    transition: 0.5s;
+}
+.container .card:hover
+{
+    height: 350px;
+}
+.container .card .imgbx
+{
+    position: absolute;
+    top: 20px;
+    width: 300px;
+    height: 220px;
+    background: #333;
+    border-radius: 12px;
+    transition: 0.5s;
+    overflow: hidden;
+}
+.container .card:hover .imgbx
+{
+    top: -100px;
+    scale: 0.75;
+    box-shadow: 0 15px 45px rgba(0,0,0,0.15);
+}
+.container .card .imgbx img{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+.container .card .content
+{
+    position: absolute;
+    top: 252px;
+    width: 100%;
+    padding: 0 30px;
+    height: 35px;
+    overflow: hidden;
+    text-align: center;
+    transition: 0.5s;
+}
+.container .card:hover .content
+{
+    top: 150px;
+    height: 250px;
+}
+.container .card .content h2{
+    font-size: 1.33em;
+    font-weight: 700;
+    color: var(--clr);
+}
+.container .card .content p{
+    color: #233;
+}
+.container .card .content a{
+    position: relative;
+    top: 15px;
+    display: inline-block;
+    padding: 12px 25px;
+    background: var(--clr);
+    color: #fff;
+    font-weight: 500;
+    text-decoration: 8px;
+    border-radius: 8px;
+}
\ No newline at end of file
diff --git a/Html-files/assets/search.png b/Html-files/assets/search.png
new file mode 100644
index 00000000..1b2de8ad
Binary files /dev/null and b/Html-files/assets/search.png differ
diff --git a/Html-files/login.html b/Html-files/login.html
index 459f8712..07584872 100644
--- a/Html-files/login.html
+++ b/Html-files/login.html
@@ -5,7 +5,9 @@
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <script src="scriptlogin.js" defer type="module"></script>
+  <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-app-compat.js"></script>
+  <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-auth-compat.js"></script>
+  <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-database-compat.js"></script>
   <link rel="stylesheet" href="../Css-files/login1.css">
   <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
@@ -27,11 +29,11 @@ <h1>Login Here<br>Delicious food is waiting for You</h1>
         <h1>LOGIN</h1>
         <br>
         <div class="textfield">
-          <label for="usuario">Email</label>
+          <label for="email">Email</label>
           <input type="email" name="email" id="email" placeholder="Enter Email">
         </div>
         <div class="textfield">
-          <label for="usuario">Username</label>
+          <label for="username">Username</label>
           <input type="text" name="Username" id="username" placeholder="Username">
         </div>
         <div class="textfield">
@@ -45,7 +47,7 @@ <h1>LOGIN</h1>
         <h3>
           <center>OR</center>
         </h3>
-        <button id="google-login">Login with google</button>
+        <button id="google-login">Login with Google</button>
       </div>
     </div>
   </div>
@@ -57,44 +59,94 @@ <h3>
       easing: 'ease',
       once: false,
     });
-  </script>
-</body>
 
-<script>
-  const passwordinput = document.getElementById("password");
-  const hidelogo = document.getElementById("login-hide");
-  hidelogo.addEventListener("click", function () {
-    const passwordfield = this.querySelector("i");
-    if (passwordinput.getAttribute("type") == "text") {
-      passwordinput.setAttribute("type", "password");
-      passwordfield.classList.replace("bxs-show", "bxs-hide");
-    } else {
-      passwordinput.setAttribute("type", "text");
-      passwordfield.classList.replace("bxs-hide", "bxs-show");
-    }
-  });
+    // Firebase configuration
+    const firebaseConfig = {
+        //Add your Config File
+    };
 
-  const closeBtn = document.querySelector('.close-btn');
-  closeBtn.addEventListener('click', function () {
-    window.location.href = '../index.html';
-  });
+    // Initialize Firebase
+    firebase.initializeApp(firebaseConfig);
+    const database = firebase.database();
+    const auth = firebase.auth();
 
-  function validateLogin() {
-    const email = document.getElementById("email").value;
-    const username = document.getElementById("username").value;
-    const password = document.getElementById("password").value;
+    // Password visibility toggle
+    const passwordInput = document.getElementById("password");
+    const hideLogo = document.getElementById("login-hide");
+    hideLogo.addEventListener("click", function () {
+      const passwordField = this.querySelector("i");
+      if (passwordInput.getAttribute("type") == "text") {
+        passwordInput.setAttribute("type", "password");
+        passwordField.classList.replace("bxs-show", "bxs-hide");
+      } else {
+        passwordInput.setAttribute("type", "text");
+        passwordField.classList.replace("bxs-hide", "bxs-show");
+      }
+    });
+
+    // Close button redirect
+    const closeBtn = document.querySelector('.close-btn');
+    closeBtn.addEventListener('click', function () {
+      window.location.href = '../index.html';
+    });
 
-    if (email === "") {
-      alert("Please Enter Email");
-    } else if (username === "") {
-      alert("Please Enter Username");
-    } else if (password === "") {
-      alert("Please Enter Password");
-    } else {
-      // add login logic
-      alert("Form submitted successfully!");
+    // Login validation
+    function validateLogin() {
+      const email = document.getElementById("email").value;
+      const username = document.getElementById("username").value;
+      const password = document.getElementById("password").value;
+
+      if (email === "") {
+        alert("Please Enter Email");
+      } else if (username === "") {
+        alert("Please Enter Username");
+      } else if (password === "") {
+        alert("Please Enter Password");
+      } else {
+        auth.signInWithEmailAndPassword(email, password)
+          .then((userCredential) => {
+            const user = userCredential.user;
+            database.ref('users/' + user.uid).set({
+              username: username,
+              email: email
+            }).then(() => {
+              alert("Login successful");
+              window.location.href = '../index.html';
+            }).catch((error) => {
+              alert("Data could not be saved: " + error.message);
+            });
+          })
+          .catch((error) => {
+            alert("Login failed: " + error.message);
+          });
+      }
     }
-  }
-</script>
+     // Google Sign-In
+     document.getElementById('google-login').addEventListener('click', () => {
+      const provider = new firebase.auth.GoogleAuthProvider();
+      auth.signInWithPopup(provider)
+        .then((result) => {
+          const user = result.user;
+
+          // Save user info to Realtime Database if new user
+          if (result.additionalUserInfo.isNewUser) {
+            return database.ref('users/' + user.uid).set({
+              name: user.displayName,
+              email: user.email,
+              username: user.email.split('@')[0]
+            });
+          }
+        })
+        .then(() => {
+          alert('Logged in with Google!');
+          window.location.href = '../index.html'; // Redirect to homepage or dashboard
+        })
+        .catch((error) => {
+          console.error('Error logging in with Google:', error);
+          alert(error.message);
+        });
+    });
+  </script>
+</body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/Html-files/menu.html b/Html-files/menu.html
index a277c1e1..0a76033a 100644
--- a/Html-files/menu.html
+++ b/Html-files/menu.html
@@ -51,6 +51,10 @@
                         </li>
                     </ul>
                 </div>
+                <div class="search-bar">
+                    <input class="search-input" type="text" placeholder="Search your food item.." name="search">
+                </div>
+                <button class="search-button" type="submit"><img class="searchImg" src="./assets/search.png"></button>
             </div>
         </nav>
         <!-- </header> -->
diff --git a/Html-files/services.html b/Html-files/services.html
index f92e0b2e..95b7822d 100644
--- a/Html-files/services.html
+++ b/Html-files/services.html
@@ -16,6 +16,7 @@
     <link rel="stylesheet" href="../Css-files/content.css">
     <link rel="stylesheet" href="../Css-files/services.css">
     <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
+    <link rel="stylesheet" type="text/css" href="../Css-files/services1.css">
     <link rel="stylesheet" href="../Css-files/scroll-top-button.css">
 </head>
 
@@ -60,57 +61,38 @@
         <div class="mainhead">
             <h1>S E R V I C E S</h1>
         </div>
-
-        <div class="first_cont" data-aos="zoom-out" data-aos-duration="1000" data-aos-offset="170"
-            data-aos-easing="ease-in-out">
-            <div class="items">
-                <img
-                    src="https://destinationlesstravel.com/wp-content/uploads/2023/09/A-selection-of-local-cuisine-as-seen-on-a-food-tour-in-Lima-Peru-that-we-got-to-try.jpg.webp">
-                <h3>Food Tour and Experiences</h3>
-                <!-- <p>$10.20</p> -->
-                <button class="but">Take Experience</button>
-                <!-- <button class="butt">Order Now</button> -->
+        
+        <div class="container">
+            <div class="card" style="--clr: #009688;">
+            <div class="imgbx">
+                <img src="https://destinationlesstravel.com/wp-content/uploads/2023/09/A-selection-of-local-cuisine-as-seen-on-a-food-tour-in-Lima-Peru-that-we-got-to-try.jpg.webp">
+            </div>
+            <div class="content">
+                <h2>Food Tour and Experiences</h2>
+                <a href="#">Take Experience</a>
             </div>
-            <div class="items">
-                <img
-                    src="https://www.kitchenmantra.com/blog/wp-content/uploads/2020/11/Best-corporate-caterers-in-Noida.jpg">
-                <h3>Catering Services for Events</h3>
-                <!-- <p>$10.20</p> -->
-                <button class="but">Book Catering</button>
-                <!-- <button class="butt">Order Now</button> -->
-
-                <div class="service-img">
-                    <div class="mainhead">
-                        <h1>S E R V I C E S</h1>
-                    </div>
-                    <div class="first_cont">
-                        <div class="items">
-                            <img
-                                src="https://destinationlesstravel.com/wp-content/uploads/2023/09/A-selection-of-local-cuisine-as-seen-on-a-food-tour-in-Lima-Peru-that-we-got-to-try.jpg.webp">
-                            <h3>Food Tour and Experiences</h3>
-                            <!-- <p>$10.20</p> -->
-                            <button class="but">Take Experience</button>
-                            <!-- <button class="butt">Order Now</button> -->
-                        </div>
-                        <div class="items">
-                            <img
-                                src="https://www.kitchenmantra.com/blog/wp-content/uploads/2020/11/Best-corporate-caterers-in-Noida.jpg">
-                            <h3>Catering Services for Events</h3>
-                            <!-- <p>$10.20</p> -->
-                            <button class="but">Book Catering</button>
-                            <!-- <button class="butt">Order Now</button> -->
-                        </div>
-                        <div class="items">
-                            <img
-                                src="https://hips.hearstapps.com/hmg-prod/images/best-meal-delivery-services-territory-foods-1630350085.jpg?crop=0.999866844207723xw:1xh;center,top&resize=980:*">
-                            <h3>Meal Delivery Subscription</h3>
-                            <!-- <p>$10.20</p> -->
-                            <a href="subscription.html"><button class="but">Take Subscription</button></a>
-                            <!-- <button class="butt">Order Now</button> -->
-                        </div>
-                    </div>
-                </div>
             </div>
+            <div class="card" style="--clr: #ff3e7f;">
+            <div class="imgbx">
+                <img src="https://www.kitchenmantra.com/blog/wp-content/uploads/2020/11/Best-corporate-caterers-in-Noida.jpg">
+            </div>
+            <div class="content">
+                <h2>Catering Services for Events</h2>
+                <a href="#">Book Catering</a>
+            </div>
+            </div>
+            <div class="card" style="--clr: #03a9f4;">
+            <div class="imgbx">
+                <img src="https://hips.hearstapps.com/hmg-prod/images/best-meal-delivery-services-territory-foods-1630350085.jpg?crop=0.999866844207723xw:1xh;center,top&resize=980:*">
+            </div>
+            <div class="content">
+                <h2>Meal Delivery Subscription</h2>
+                <a href="subscription.html">Take Subscription</a>
+            </div>
+            </div>
+        </div>
+
+
 
             <section class="service_container">
 
@@ -352,4 +334,4 @@ <h4>Follow Us</h4>
 
 </body>
 
-</html>
\ No newline at end of file
+</html>
diff --git a/Html-files/signup.html b/Html-files/signup.html
index 4e1d1e99..3a837b3d 100644
--- a/Html-files/signup.html
+++ b/Html-files/signup.html
@@ -5,13 +5,15 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Sign up</title>
-  <script src="scriptsignup.js" defer type="module"></script>
+  <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-app-compat.js"></script>
+  <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-auth-compat.js"></script>
+  <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-database-compat.js"></script>
   <link rel="stylesheet" href="../Css-files/signup1.css">
   <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
     integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
     crossorigin="anonymous" referrerpolicy="no-referrer" />
-    <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
+  <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
 </head>
 
 <body>
@@ -36,7 +38,7 @@ <h1>SIGN UP</h1>
           </div>
           <div class="textfield">
             <label for="Username">Username</label>
-            <input type="Username" id="Username" name="Username" placeholder="Enter Username" required>
+            <input type="text" id="Username" name="Username" placeholder="Enter Username" required>
           </div>
           <div class="textfield">
             <label for="password">Password</label>
@@ -52,37 +54,104 @@ <h3><center>OR</center></h3>
       </div>
     </div>
   </div>
+
   <script src="https://unpkg.com/aos@next/dist/aos.js"></script>
-    <script>
-      AOS.init(
-        {
-          duration: 1000, 
-          easing: 'ease', 
-          once: false, 
-        }
-      );
-    </script>
-</body>
-<script>
-  const pswinput = document.getElementById('password');
-  const toggle = document.getElementById('signup-hide');
-  toggle.addEventListener("click", function () {
-    const pswfield = this.querySelector('i');
-    if (pswinput.getAttribute("type") == "password") {
-      pswinput.setAttribute('type', 'text');
-      pswfield.classList.replace("bxs-hide", "bxs-show");
-    }
-    else {
-      pswinput.setAttribute('type', 'password');
-      pswfield.classList.replace("bxs-show", "bxs-hide");
-    }
-  });
+  <script>
+    AOS.init({
+      duration: 1000,
+      easing: 'ease',
+      once: false,
+    });
+  </script>
+  <script>
+    // Your web app's Firebase configuration
+  
+    const firebaseConfig = {
+ //Add your Config File
+};
+
+    // Initialize Firebase
+    firebase.initializeApp(firebaseConfig);
+    const auth = firebase.auth();
+    const db = firebase.database();
 
-  const closeBtn = document.querySelector('.close-btn');
+    // Sign up with email and password
+    document.getElementById('signup-form').addEventListener('submit', (e) => {
+      e.preventDefault();
+
+      const name = document.getElementById('name').value;
+      const email = document.getElementById('email').value;
+      const username = document.getElementById('Username').value;
+      const password = document.getElementById('password').value;
+
+      auth.createUserWithEmailAndPassword(email, password)
+        .then((userCredential) => {
+          const user = userCredential.user;
+
+          // Save user info to Realtime Database
+          return db.ref('users/' + user.uid).set({
+            name: name,
+            username: username,
+            email: email,
+            password:password
+          });
+        })
+        .then(() => {
+          alert('User registered successfully!');
+          window.location.href = '../index.html'; // Redirect to homepage or login page
+        })
+        .catch((error) => {
+          console.error('Error signing up:', error);
+          alert(error.message);
+        });
+    });
+
+    // Google Sign-In
+    document.getElementById('google-login').addEventListener('click', () => {
+      const provider = new firebase.auth.GoogleAuthProvider();
+      auth.signInWithPopup(provider)
+        .then((result) => {
+          const user = result.user;
+
+          // Save user info to Realtime Database if new user
+          if (result.additionalUserInfo.isNewUser) {
+            return db.ref('users/' + user.uid).set({
+              name: user.displayName,
+              email: user.email,
+              username: user.email.split('@')[0]
+            });
+          }
+        })
+        .then(() => {
+          alert('Logged in with Google!');
+          window.location.href = '../index.html'; // Redirect to homepage or dashboard
+        })
+        .catch((error) => {
+          console.error('Error logging in with Google:', error);
+          alert(error.message);
+        });
+    });
+
+    // Toggle password visibility
+    const pswinput = document.getElementById('password');
+    const toggle = document.getElementById('signup-hide');
+    toggle.addEventListener("click", function () {
+      const pswfield = this.querySelector('i');
+      if (pswinput.getAttribute("type") == "password") {
+        pswinput.setAttribute('type', 'text');
+        pswfield.classList.replace("bxs-hide", "bxs-show");
+      } else {
+        pswinput.setAttribute('type', 'password');
+        pswfield.classList.replace("bxs-show", "bxs-hide");
+      }
+    });
+
+    // Close button functionality
+    const closeBtn = document.querySelector('.close-btn');
     closeBtn.addEventListener('click', function () {
-      // document.querySelector('.card-login').style.display = 'none';
-      window.location.href='../index.html';
+      window.location.href = '../index.html';
     });
-</script>
+  </script>
+</body>
 
-</html>
\ No newline at end of file
+</html>
diff --git a/index.html b/index.html
index de27a00b..ba291158 100644
--- a/index.html
+++ b/index.html
@@ -94,10 +94,10 @@
                     <li>
                         <a class="" href="Html-files/cart.html"><i class="fa-solid fa-cart-shopping"></i></a>
                     </li>
-                    <div class="search-bar">
+                    <!--<div class="search-bar">
                         <input type="text" placeholder="Search your food item.." name="search">
                         <button type="submit">Search</button>
-                    </div>
+                    </div>-->
                 </ul>
             </div>
         </div>
@@ -150,19 +150,19 @@ <h1 class="display-1 hero-title slider-reveal">
                 <div class="slider-bg">
                     <img src="hero-slider-3.jpg" width="1880" height="950" class="img-cover">
                 </div>
-                <p class="label-2 section-subtitle slider-reveal">amazing & delicious</p>
-                <h1 class="display-1 hero-title slider-reveal">
+                <p class="label-2 section-subtitle slider-reveal" style="font-style:italic;">amazing & delicious</p>
+                <h1 class="display-1 hero-title slider-reveal" style="font-style:italic;">
                     Where every flavour <br>
                     tells a story
                 </h1>
 
-                <p class="body-2 hero-text slider-reveal">
+                <p class="body-2 hero-text slider-reveal" style="font-style:italic;">
                     come with family & feel the joy of mouthwatering food
                 </p>
 
                 <a href="Html-files/menu.html" class="btn btn-primary slider-reveal">
-                    <span class="text text-1">View Our Menu</span>
-                    <span class="text text-2" aria-hidden="true">View Our Menu</span>
+                    <span class="text text-1" style="font-style:italic;">View Our Menu</span>
+                    <span class="text text-2" aria-hidden="true" style="font-style:italic;">View Our Menu</span>
                 </a>
             </li>
         </ul>
@@ -181,36 +181,36 @@ <h1 class="display-1 hero-title slider-reveal">
     <section class="about_us">
         <div class="move">
             <div id="marque">
-                <h1 class="poppins-light">Get <span> 30% OFF </span> on your first order!</h1>
-                <h1 class="poppins-light">Get <span> 30% OFF </span> on your first order!</h1>
-                <h1 class="poppins-light">Get <span> 30% OFF </span> on your first order!</h1>
+                <h1 class="poppins-light" style="font-style:italic;">Get <span> 30% OFF </span> on your first order!</h1>
+                <h1 class="poppins-light" style="font-style:italic;">Get <span> 30% OFF </span> on your first order!</h1>
+                <h1 class="poppins-light" style="font-style:italic;">Get <span> 30% OFF </span> on your first order!</h1>
             </div>
         </div>
 
-        <h1 class="h-primary center" data-aos="zoom-out-up" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">"Savor the Flavors: Discover What Sets Our Restaurant's Cuisine Apart!"</h1>
+        <h1 class="h-primary center" style="font-style:italic;" data-aos="zoom-out-up" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">"Savor the Flavors: Discover What Sets Our Restaurant's Cuisine Apart!"</h1>
 
         <!-- changes -->
         <div id="about" data-aos="zoom-out" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
             <div class="box">
                 <img src="https://shahidining.com.au/wp-content/uploads/2020/05/secret-to-indian-flavour-1536x864.jpg"
                     alt="">
-                <h2 class="h-secondary center text-black">Authentic Indian Flavors</h2>
-                <p class="center">From aromatic curries to flavorful biryanis, our menu showcases the diversity and
+                <h2 class="h-secondary center text-black" style="font-style:italic;">Authentic Indian Flavors</h2>
+                <p class="center" style="font-style:italic;">From aromatic curries to flavorful biryanis, our menu showcases the diversity and
                     deliciousness of Indian cuisine.
                 </p>
             </div>
             <div class="box">
                 <img src="https://saavi.com.au/wp-content/uploads/2016/02/image0023-1.jpg" alt="">
-                <h2 class="h-secondary center text-black">Tech-Infused Dining Experience</h2>
-                <p class="center">
+                <h2 class="h-secondary center text-black" style="font-style:italic;">Tech-Infused Dining Experience</h2>
+                <p class="center" style="font-style:italic;">
                     Customers can use apps to place orders, customize their dishes, and even provide feedback, making
                     their visit more convenient and interactive.
                 </p>
             </div>
             <div class="box">
                 <img src="https://i.ndtvimg.com/i/2015-06/fusion-food_625x350_81434107799.jpg" alt="">
-                <h2 class="h-secondary center text-black">Innovative Fusion Dishes</h2>
-                <p class="center">The combinations of Indian and international cuisines not only tantalize taste buds
+                <h2 class="h-secondary center text-black" style="font-style:italic;">Innovative Fusion Dishes</h2>
+                <p class="center" style="font-style:italic;">The combinations of Indian and international cuisines not only tantalize taste buds
                     but also provide unique experience.
                 </p>
             </div>
@@ -220,25 +220,25 @@ <h2 class="h-secondary center text-black">Innovative Fusion Dishes</h2>
     <section class="service_container">
         <div class="service">
             <div class="box_main" data-aos="zoom-out-right" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
-                <h1>Bringing <br>happiness<br> to you</h1>
-                <p>Food is more than sustenance; it's a source of pure<br> happiness. From the first bite of a favorite
+                <h1 style="font-style:italic;">Bringing <br>happiness<br> to you</h1>
+                <p style="font-style:italic;">Food is more than sustenance; it's a source of pure<br> happiness. From the first bite of a favorite
                     childhood dish<br> to the thrill of discovering new flavors, food has a unique<br> way of filling
                     our hearts with joy.</p>
             </div>
             <div class="box" data-aos="zoom-out-left" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
-                <h1>Online Delivery</h1><br>
-                <a href="#" class="btn">Order Online</a>
+                <h1 style="font-style:italic;">Online Delivery</h1><br>
+                <a href="#" class="btn" style="font-style:italic;">Order Online</a>
 
             </div>
             <div class="box" data-aos="zoom-out-left" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
-                <h1>Click & Collect</h1><br>
-                <a href="#" class="btn">Take out Order</a>
+                <h1 style="font-style:italic;">Click & Collect</h1><br>
+                <a href="#" class="btn" style="font-style:italic;">Take out Order</a>
 
             </div>
             <div class="box" data-aos="zoom-out-left" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
-                <h1>Restaurant Dining</h1><br>
+                <h1 style="font-style:italic;">Restaurant Dining</h1><br>
 
-                <a href="./Html-files/book-table.html" class="btn">Book Table</a>
+                <a href="./Html-files/book-table.html" class="btn" style="font-style:italic;">Book Table</a>
 
             </div>
         </div>
@@ -246,8 +246,8 @@ <h1>Restaurant Dining</h1><br>
 
     <section class="menu_container">
         <div class="mainhead" data-aos="zoom-out-up" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
-            <h1>"Get ready to explore our delicious range of dishes!"</h1>
-            <p>"Welcome to a world of culinary delights where every bite tells a flavorful story. Explore our diverse
+            <h1 style="font-style:italic;">"Get ready to explore our delicious range of dishes!"</h1>
+            <p style="font-style:italic;">"Welcome to a world of culinary delights where every bite tells a flavorful story. Explore our diverse
                 menu and savor the essence of exquisite dining." </p>
 
             <button class="butt" onclick="window.location.href='Html-files/menu.html'">View Menu</button>
@@ -257,25 +257,25 @@ <h1>"Get ready to explore our delicious range of dishes!"</h1>
         <div class="menu_items" data-aos="zoom-out-up" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
             <div class="items">
                 <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTjSkmP0glNOmYbWZWwz_BRxgwrA5HdZadphw&s">
-                <h3>Indian Thali</h3>
-                <p>Enjoy a thali full of traditional flavours and memotries</p>
+                <h3 style="font-style:italic;">Indian Thali</h3>
+                <p style="font-style:italic;">Enjoy a thali full of traditional flavours and memotries</p>
             </div>
             <div class="items">
                 <img
                     src="https://imgmediagumlet.lbb.in/media/2018/04/5acf822418a23c0efc21496b_1523548708582.jpg?fm=webp&w=750&h=500&dpr=1">
-                <h3>Dessert</h3>
-                <p>Complete your meal with mouth watering delicacies</p>
+                <h3 style="font-style:italic;">Dessert</h3>
+                <p style="font-style:italic;">Complete your meal with mouth watering delicacies</p>
             </div>
             <div class="items">
                 <img
                     src="https://imgmediagumlet.lbb.in/media/2019/07/5d27585dc18a2b0ed5739eb5_1562859613517.jpg?fm=webp&w=750&h=500&dpr=1">
-                <h3>Snacks</h3>
-                <p>Have a lighter version with deliciouis flavours</p>
+                <h3 style="font-style:italic;">Snacks</h3>
+                <p style="font-style:italic;">Have a lighter version with deliciouis flavours</p>
             </div>
             <div class="items">
                 <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSaqAsoDyO5HBOSLupaimFGCkiE_zPbLYyYog&s">
-                <h3>Juices</h3>
-                <p>Boost yourself up with fruit extracts</p>
+                <h3 style="font-style:italic;">Juices</h3>
+                <p style="font-style:italic;">Boost yourself up with fruit extracts</p>
             </div>
            
         </div>
@@ -294,8 +294,8 @@ <h3>Juices</h3>
     </div> -->
     <div class="fix"></div>
     <div class="container" data-aos="zoom-in" data-aos-duration="1000" data-aos-offset="170" data-aos-easing="ease-in-out">
-        <h2> Our Happy Clients </h2>
-        <p class="description">
+        <h2 style="font-style:italic;"> Our Happy Clients </h2>
+        <p class="description" style="font-style:italic;">
             At Foodie, we pride ourselves on delivering delicious meals & exceptional service. Don’t just take our word
             for it—hear what our satisfied customers have to say!</p>
 
@@ -307,7 +307,7 @@ <h2> Our Happy Clients </h2>
                 <div class="top">
                     <div class="clientImage">
                         <img src="./Images/client1.jpg" alt="">
-                        <span>Matt Gilbert</span>
+                        <span style="font-style:italic;">Matt Gilbert</span>
                     </div>
                     <ul>
                         <li><i class="fa-solid fa-star"></i></li>
@@ -318,9 +318,9 @@ <h2> Our Happy Clients </h2>
                     </ul>
                 </div>
                 <article>
-                    <p class="review">Foodie never disappoints! The food is always fresh, delicious, and delivered right
+                    <p class="review" style="font-style:italic;">Foodie never disappoints! The food is always fresh, delicious, and delivered right
                         on time. My go-to for all my meals!</p>
-                    <p>Jan 01, 2024</p>
+                    <p style="font-style:italic;">Jan 01, 2024</p>
                 </article>
             </div>
 
@@ -329,7 +329,7 @@ <h2> Our Happy Clients </h2>
                 <div class="top">
                     <div class="clientImage">
                         <img src="./Images/client2.jpg" alt="">
-                        <span>John Doe</span>
+                        <span style="font-style:italic;">John Doe</span>
                     </div>
                     <ul>
                         <li><i class="fa-solid fa-star"></i></li>
@@ -340,9 +340,9 @@ <h2> Our Happy Clients </h2>
                     </ul>
                 </div>
                 <article>
-                    <p class="review">I love the variety on Foodie! There's something for everyone, and the delivery
+                    <p class="review" style="font-style:italic;">I love the variety on Foodie! There's something for everyone, and the delivery
                         service is incredibly reliable</p>
-                    <p>April 16, 2024</p>
+                    <p style="font-style:italic;">April 16, 2024</p>
                 </article>
             </div>
 
@@ -351,7 +351,7 @@ <h2> Our Happy Clients </h2>
                 <div class="top">
                     <div class="clientImage">
                         <img src="./Images/client3.jpg" alt="">
-                        <span>Laren Green</span>
+                        <span style="font-style:italic;">Laren Green</span>
                     </div>
                     <ul>
                         <li><i class="fa-solid fa-star"></i></li>
@@ -362,9 +362,9 @@ <h2> Our Happy Clients </h2>
                     </ul>
                 </div>
                 <article>
-                    <p class="review">Fantastic service and mouth-watering dishes! Foodie has made my dining experience
+                    <p class="review" style="font-style:italic;">Fantastic service and mouth-watering dishes! Foodie has made my dining experience
                         so much more convenient.</p>
-                    <p>May 15, 2024</p>
+                    <p style="font-style:italic;">May 15, 2024</p>
                 </article>
             </div>
         </div>
@@ -420,9 +420,10 @@ <h2> Our Happy Clients </h2>
     </section>
 
     <div class="app_download">
-        <h4>Free Delivery!</h4>
-        <h2>Download the App now!</h2>
+        <h4 style="font-style:italic;">Free Delivery!</h4>
+        <h2 style="font-style:italic;">Download the App now!</h2>
         <br>
+
         <p>For best discounts and free delivery download the app now from your Google Play Store or App Store.</p>
 
         <button class="btn" href="#">Google Play Store</button>
@@ -432,6 +433,9 @@ <h2>Download the App now!</h2>
 
    
 
+
+        <p style="font-style:italic;">For best discounts and free delivery download the app now from your Google Play Store or App Store.</p>
+
         <a href="#"><img src="./Images/get_it_on_google_play_store.png" class="app-download-img"
                 alt="Get it on Google Play Store"></a>
         <a href="#"><img src="./Images/download-on-the-app-store.png" class="app-download-img"
@@ -461,7 +465,7 @@ <h2>Download the App now!</h2>
 
         <footer>
             <div class="foot-panel2">
-                <ul>
+                <ul style="font-style:italic;">
                     <p>Our Pages</p>
                     <a href="#">Home</a>
                     <a href="/Html-files/menu.html">Menu</a>
@@ -470,7 +474,7 @@ <h2>Download the App now!</h2>
                     <a href="/Html-files/cart.html">Cart</a>
                 </ul>
 
-                <ul>
+                <ul style="font-style:italic;">
                     <p> Exclusive Offers</p>
                     <a href="#">Foodie Discounts</a>
                     <a href="#">Limited-Time Promotions</a>
@@ -481,7 +485,7 @@ <h2>Download the App now!</h2>
                     <a href="#">Personalized Culinary Experiences</a>
                 </ul>
 
-                <ul>
+                <ul style="font-style:italic;">
                     <p>Payment Products</p>
                     <a href="#">Secure Checkout</a>
                     <a href="#">Credit/Debit Cards</a>
@@ -491,22 +495,22 @@ <h2>Download the App now!</h2>
                 </ul>
 
                 <form id="contactForm" action="https://formsubmit.co/xyz@gmail.com" method="POST">
-                    <h3>Contact Us!</h3>
+                    <h3 style="font-style:italic;">Contact Us!</h3>
                     <!-- <label for="name">Name:</label> -->
                     <!-- <input type="text" id="name" name="name" placeholder="Your Name" required>-->
                     <!-- <label for="email">Email:</label> -->
-                    <input type="email" id="email" name="email" placeholder="Your Email" required>
+                    <input type="email" id="email" name="email" placeholder="Your Email" style="font-style:italic;" required>
 
                     <!-- <label for="message">Message:</label> -->
-                    <textarea id="message" name="message" placeholder="Your Message" required></textarea>
+                    <textarea id="message" name="message" placeholder="Your Message"  style="font-style:italic;"required></textarea>
 
-                    <button id="butt" type="submit">Send Message</button>
+                    <button id="butt" type="submit" style="font-style:italic;">Send Message</button>
                 </form>
             </div>
 
             <div class="foot_panel4">
                 <div class="pages">
-                    <h4>Follow Us</h4>
+                    <h4 style="font-style:italic;">Follow Us</h4>
                     <div class="social-icons">
                         <a class="fa-brands fa-facebook" href="https://facebook.com" target="_blank"></a>
                         <a class="fa-brands fa-instagram" href="https://instagram.com" target="_blank"></a>
@@ -516,11 +520,11 @@ <h4>Follow Us</h4>
                             target="_blank"></a>
                         <a class="fa-brands fa-discord" href="https://discord.com/invite/sybYafYA" target="_blank"></a>
                     </div>
-                    <p>Stay connected with us on social media for the latest updates, recipes, and foodie adventures.
+                    <p style="font-style:italic;">Stay connected with us on social media for the latest updates, recipes, and foodie adventures.
                     </p>
                     <div>
                         <p class="copyright"> ©
-                            <script>
+                            <script >
                                 document.write(new Date().getFullYear());
                             </script> Foodies - All Rights Reserved | 
                             <a href="https://www.linkedin.com/in/khushi-joshi-95a587256/" target="_blank">
diff --git a/style.css b/style.css
index 78072cbd..a71e9de5 100644
--- a/style.css
+++ b/style.css
@@ -33,6 +33,7 @@ body {
 
 .transparent-image {
   opacity: 0.8;
+  margin-top: 5px;
 }
 
 /* Navbar link hover effect */
@@ -101,16 +102,20 @@ body {
     max-height: 0.1%;
   }
 }
-.search-bar {
+/**.search-bar {
   position: relative;
   display: flex; 
+  margin-top: 10px; 
 }
 .search-bar input[type="text"] {
   width: 100%; 
   padding: 10px; 
   border: 1px solid #ccc; 
   border-radius: 5px;
-  margin-top: 10px; 
+}
+
+.ul2 li{
+  cursor: pointer;
 }
 
 .search-bar button {
@@ -120,13 +125,12 @@ body {
   border-radius: 5px; 
   cursor: pointer; 
   margin-left: 5px;
-  margin-top: 10px;
+  /* margin-top: 5px; */
 }
 
 .search-bar button:hover {
-  background-color: #ccc; /* Changes button color on hover */
-}
-
+  background-color: #ccc; 
+}**/
 
 .intro_container {
   display: flex;
@@ -758,7 +762,7 @@ label {
 input,
 textarea {
   height: 30px;
-  width: max-content;
+  width: auto;
   padding: 3px;
   box-sizing: border-box;
   border-radius: 4px;
@@ -1311,6 +1315,101 @@ nav {
   transform: translateY(-8px) rotate(-45deg);
 }
 
+@media (max-width: 999px){
+  .navbar a{
+    font-size: 0.8rem;
+  }
+  .transparent-image{
+    max-width: 90%;
+    max-height: 40%;
+    margin-top: 5px;
+    margin-left: -10px;
+  }
+  .navigbar{
+    margin-left: 4px;
+  }
+  
+}
+
+@media(max-width:950px){
+  .transparent-image{
+    margin-left: -25px;
+    max-width: 100%;
+  }
+  .navbar a{
+    font: 0.6rem;
+  }
+  .ul2 li{
+    margin-top: 3px;
+    gap: 15px;
+  }
+  .search-bar{
+    margin-top: 13px;
+    margin-right: -50px;
+  }
+
+  .search-bar input{
+    max-width: 70%;
+  }
+}
+
+@media(max-width:890px){
+  .transparent-image{
+    /* margin-left: -25px; */
+    transition: all 0.4s;
+    max-width: 100%;
+  }
+  .ul1{
+    margin-left: -10px;
+    gap: 15px;
+  }
+  .ul2 li{
+    margin-right: -15px;
+  }
+  .ul2{
+    gap: 25px;
+  }
+  .search-bar{
+    margin-right: -95px;
+  }
+  .search-bar input{
+    /* max-height: 60%; */
+    max-width: 50%;
+  }
+}
+
+@media(max-width: 780px){
+  .transparent-image{
+    max-height: 40%;
+    max-width: 100%;
+  }
+  .search-bar{
+    margin-right: -90px;
+  }
+  .search-bar input{
+    margin-right: -2px;
+    max-height: 80%;
+
+  }
+  .search-bar button{
+    margin-right: -20px;
+    max-width: 40%;
+    max-height: 70%;
+    margin-top: 4px;
+  }
+  .ul1{
+    gap: 10px;
+  }
+  .ul2 li{
+    margin-top: 7px;
+  }
+}
+
+@media(max-width:768px){
+  .transparent-image{
+  margin-left: 5px;
+  }
+}
 /* Hide hamburger menu by default */
 .hamburger-menu {
   display: none;
@@ -1342,6 +1441,7 @@ nav {
   color: white;
   text-decoration: none;
   font-size: 16px;
+  text-align: center;
 }
 
 /* Additional styling for active state of hamburger menu */