diff --git a/Html-files/cart.html b/Html-files/cart.html
index b0f76487..fd909d76 100644
--- a/Html-files/cart.html
+++ b/Html-files/cart.html
@@ -24,82 +24,84 @@
     rel="stylesheet">
   <style>
     /*Preloader CSS*/
-#preloader {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: hsl(20, 43%, 93%); /* Light background color */
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    transition: opacity 2s ease-out, visibility 2s ease-out;
-    opacity: 1;
-    visibility: visible;
-    z-index: 9999; /* Ensure the preloader is above all other content */
-}
-
-
-/* When hidden, preloader transitions out */
-#preloader.hidden {
-    opacity: 0;
-    visibility: hidden;
-}
-
-#loader {
-    display: block;
-    position: relative;
-    width: 150px;
-    height: 150px;
-    border-radius: 50%;
-    border: 3px solid transparent;
-    border-top-color: hsl(304, 14%, 46%);
-    animation: spin 3s linear infinite;
-}
-
-#loader:before {
-    content: "";
-    position: absolute;
-    top: 5px;
-    left: 5px;
-    right: 5px;
-    bottom: 5px;
-    border-radius: 50%;
-    border: 3px solid transparent;
-    border-top-color: hsl(357, 37%, 62%);
-    animation: spin 2s linear infinite;
-}
-
-#loader:after {
-    content: "";
-    position: absolute;
-    top: 15px;
-    left: 15px;
-    right: 15px;
-    bottom: 15px;
-    border-radius: 50%;
-    border: 3px solid transparent;
-    border-top-color: hsl(357, 93%, 84%);
-    animation: spin 1.5s linear infinite;
-}
-
-#badgeCount {
-  position: relative;
-  top: -7px;
-  right: 1px;
-  background-color: red;
-  color: white;
-  border-radius: 50%;
-  padding: 5px 8px;
-  font-size: 12px;
-}
-
-@keyframes spin {
-    0% {
-        transform: rotate(0deg);
+    #preloader {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: hsl(20, 43%, 93%);
+      /* Light background color */
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      transition: opacity 2s ease-out, visibility 2s ease-out;
+      opacity: 1;
+      visibility: visible;
+      z-index: 9999;
+      /* Ensure the preloader is above all other content */
+    }
+
+
+    /* When hidden, preloader transitions out */
+    #preloader.hidden {
+      opacity: 0;
+      visibility: hidden;
+    }
+
+    #loader {
+      display: block;
+      position: relative;
+      width: 150px;
+      height: 150px;
+      border-radius: 50%;
+      border: 3px solid transparent;
+      border-top-color: hsl(304, 14%, 46%);
+      animation: spin 3s linear infinite;
+    }
+
+    #loader:before {
+      content: "";
+      position: absolute;
+      top: 5px;
+      left: 5px;
+      right: 5px;
+      bottom: 5px;
+      border-radius: 50%;
+      border: 3px solid transparent;
+      border-top-color: hsl(357, 37%, 62%);
+      animation: spin 2s linear infinite;
+    }
+
+    #loader:after {
+      content: "";
+      position: absolute;
+      top: 15px;
+      left: 15px;
+      right: 15px;
+      bottom: 15px;
+      border-radius: 50%;
+      border: 3px solid transparent;
+      border-top-color: hsl(357, 93%, 84%);
+      animation: spin 1.5s linear infinite;
+    }
+
+    #badgeCount {
+      position: relative;
+      top: -7px;
+      right: 1px;
+      background-color: red;
+      color: white;
+      border-radius: 50%;
+      padding: 5px 8px;
+      font-size: 12px;
     }
 
+    @keyframes spin {
+      0% {
+        transform: rotate(0deg);
+      }
+
       100% {
         transform: rotate(360deg);
       }
@@ -254,9 +256,11 @@
 </head>
 
 <body>
+
   <div id="preloader">
     <div id="loader"></div>
   </div>
+
   <div class="circle-container">
     <div class="circle" style="background-color: rgb(255, 181, 107); left: 504px; top: 59px; scale: 1;"></div>
     <div class="circle" style="background-color: rgb(253, 175, 105); left: 504px; top: 59px; scale: 0.95;"></div>
@@ -279,61 +283,47 @@
     <div class="circle" style="background-color: rgb(104, 0, 96); left: 504px; top: 59px; scale: 0.1;"></div>
     <div class="circle" style="background-color: rgb(96, 0, 95); left: 504px; top: 59px; scale: 0.05;"></div>
   </div>
+
   <div class="head_container" style="background-color: transparent;font-family: Georgia;">
     <header>
       <nav class="navbar">
         <ul id="header-items">
-          <li><a href="../Home.html" style="color: black;font-family: var(--ff-philosopher);">Home</a></li>
+          <li><a href="../index.html" style="color: black;font-family: var(--ff-philosopher);">Home</a></li>
           <li><a href="menu.html" style="color: black;font-family: var(--ff-philosopher);">Collections</a></li>
           <li><a href="about.html" style="color: black;font-family: var(--ff-philosopher);">About</a></li>
           <li><a href="services.html" style="color: black;font-family: var(--ff-philosopher);">Services</a></li>
           <li><a href="contact.html" style="color: black;font-family: var(--ff-philosopher);">Contact us</a></li>
-          <li><a href="cart.html" style="color: black;font-family: var(--ff-philosopher);">Cart</a></li>
+          <li><a href="cart.html" style="color: black;font-family: var(--ff-philosopher);">Cart <span
+                class="badge-count" id="badgeCount"></span></a></li>
         </ul>
       </nav>
     </header>
 
     <div class="mainhead">
       <h1 style="color: black;font-family: var(--ff-philosopher);">C A R T</h1>
-</div>
-    <div class="circle-container">
-        <div class="circle" style="background-color: rgb(255, 181, 107); left: 504px; top: 59px; scale: 1;"></div>
-        <div class="circle" style="background-color: rgb(253, 175, 105); left: 504px; top: 59px; scale: 0.95;"></div>
-        <div class="circle" style="background-color: rgb(248, 157, 99); left: 504px; top: 59px; scale: 0.9;"></div>
-        <div class="circle" style="background-color: rgb(245, 151, 97); left: 504px; top: 59px; scale: 0.85;"></div>
-        <div class="circle" style="background-color: rgb(239, 134, 94); left: 504px; top: 59px; scale: 0.8;"></div>
-        <div class="circle" style="background-color: rgb(236, 128, 93); left: 504px; top: 59px; scale: 0.75;"></div>
-        <div class="circle" style="background-color: rgb(227, 110, 92); left: 504px; top: 59px; scale: 0.7;"></div>
-        <div class="circle" style="background-color: rgb(223, 104, 92); left: 504px; top: 59px; scale: 0.65;"></div>
-        <div class="circle" style="background-color: rgb(213, 88, 92); left: 504px; top: 59px; scale: 0.6;"></div>
-        <div class="circle" style="background-color: rgb(209, 82, 92); left: 504px; top: 59px; scale: 0.55;"></div>
-        <div class="circle" style="background-color: rgb(197, 65, 93); left: 504px; top: 59px; scale: 0.5;"></div>
-        <div class="circle" style="background-color: rgb(192, 59, 93); left: 504px; top: 59px; scale: 0.45;"></div>
-        <div class="circle" style="background-color: rgb(178, 44, 94); left: 504px; top: 59px; scale: 0.4;"></div>
-        <div class="circle" style="background-color: rgb(172, 38, 94); left: 504px; top: 59px; scale: 0.35;"></div>
-        <div class="circle" style="background-color: rgb(156, 21, 95); left: 504px; top: 59px; scale: 0.3;"></div>
-        <div class="circle" style="background-color: rgb(149, 15, 95); left: 504px; top: 59px; scale: 0.25;"></div>
-        <div class="circle" style="background-color: rgb(131, 0, 96); left: 504px; top: 59px; scale: 0.2;"></div>
-        <div class="circle" style="background-color: rgb(124, 0, 96); left: 504px; top: 59px; scale: 0.15;"></div>
-        <div class="circle" style="background-color: rgb(104, 0, 96); left: 504px; top: 59px; scale: 0.1;"></div>
-        <div class="circle" style="background-color: rgb(96, 0, 95); left: 504px; top: 59px; scale: 0.05;"></div>
     </div>
-    <div class="head_container" style="background-color: transparent;font-family: Georgia;">
-        <header>
-            <nav class="navbar">
-                <ul id="header-items">
-                    <li><a href="../index.html" style="color: black;font-family: var(--ff-philosopher);">Home</a></li>
-                    <li><a href="menu.html" style="color: black;font-family: var(--ff-philosopher);">About</a></li>
-                    <li><a href="services.html" style="color: black;font-family: var(--ff-philosopher);">Services</a></li>
-                    <li><a href="contact.html" style="color: black;font-family: var(--ff-philosopher);">Contact us</a></li>
-                    <li><a href="cart.html" style="color: black;font-family: var(--ff-philosopher);">Cart <span class="badge-count" id="badgeCount"></span></a></li>
-                </ul>
-            </nav>
-        </header>
-
-        <div class="mainhead">
-            <h1 style="color: black;font-family: var(--ff-philosopher);">C A R T</h1>
-        </div>
+
+    <div class="circle-container">
+      <div class="circle" style="background-color: rgb(255, 181, 107); left: 504px; top: 59px; scale: 1;"></div>
+      <div class="circle" style="background-color: rgb(253, 175, 105); left: 504px; top: 59px; scale: 0.95;"></div>
+      <div class="circle" style="background-color: rgb(248, 157, 99); left: 504px; top: 59px; scale: 0.9;"></div>
+      <div class="circle" style="background-color: rgb(245, 151, 97); left: 504px; top: 59px; scale: 0.85;"></div>
+      <div class="circle" style="background-color: rgb(239, 134, 94); left: 504px; top: 59px; scale: 0.8;"></div>
+      <div class="circle" style="background-color: rgb(236, 128, 93); left: 504px; top: 59px; scale: 0.75;"></div>
+      <div class="circle" style="background-color: rgb(227, 110, 92); left: 504px; top: 59px; scale: 0.7;"></div>
+      <div class="circle" style="background-color: rgb(223, 104, 92); left: 504px; top: 59px; scale: 0.65;"></div>
+      <div class="circle" style="background-color: rgb(213, 88, 92); left: 504px; top: 59px; scale: 0.6;"></div>
+      <div class="circle" style="background-color: rgb(209, 82, 92); left: 504px; top: 59px; scale: 0.55;"></div>
+      <div class="circle" style="background-color: rgb(197, 65, 93); left: 504px; top: 59px; scale: 0.5;"></div>
+      <div class="circle" style="background-color: rgb(192, 59, 93); left: 504px; top: 59px; scale: 0.45;"></div>
+      <div class="circle" style="background-color: rgb(178, 44, 94); left: 504px; top: 59px; scale: 0.4;"></div>
+      <div class="circle" style="background-color: rgb(172, 38, 94); left: 504px; top: 59px; scale: 0.35;"></div>
+      <div class="circle" style="background-color: rgb(156, 21, 95); left: 504px; top: 59px; scale: 0.3;"></div>
+      <div class="circle" style="background-color: rgb(149, 15, 95); left: 504px; top: 59px; scale: 0.25;"></div>
+      <div class="circle" style="background-color: rgb(131, 0, 96); left: 504px; top: 59px; scale: 0.2;"></div>
+      <div class="circle" style="background-color: rgb(124, 0, 96); left: 504px; top: 59px; scale: 0.15;"></div>
+      <div class="circle" style="background-color: rgb(104, 0, 96); left: 504px; top: 59px; scale: 0.1;"></div>
+      <div class="circle" style="background-color: rgb(96, 0, 95); left: 504px; top: 59px; scale: 0.05;"></div>
     </div>
   </div>
 
@@ -370,9 +360,7 @@ <h1 style="color: black;font-family: var(--ff-philosopher);">C A R T</h1>
             </td>
           </tr>
         </tfoot>
-
       </table>
-
     </div>
 
     <button type="submit" onclick="applyFirstTimeDiscount()" class="butt"
@@ -390,7 +378,6 @@ <h1 style="color: black;font-family: var(--ff-philosopher);">C A R T</h1>
         <a href="cart.html" style="text-decoration: none;color: black;font-family: var(--ff-poppins);">Cart</a>
       </ul>
 
-
       <ul class="footer-colums">
         <p style="font-family: var(--ff-philosopher);">Exclusive Offers</p>
         <a style="color: black;font-family: var(--ff-poppins);">Retro Discounts</a>
@@ -400,11 +387,8 @@ <h1 style="color: black;font-family: var(--ff-philosopher);">C A R T</h1>
         <a style="color: black;font-family: var(--ff-poppins);">Early Access to New Collections</a>
         <a style="color: black;font-family: var(--ff-poppins);">VIP Retro Events</a>
         <a style="color: black;font-family: var(--ff-poppins);">Personalized Culinary Experiences</a>
-
-
       </ul>
 
-
       <ul class="footer-colums">
         <p style="font-family: var(--ff-philosopher);">Payment Products</p>
         <a style="color: black;font-family: var(--ff-poppins);">Secure Checkout</a>
@@ -415,8 +399,6 @@ <h1 style="color: black;font-family: var(--ff-philosopher);">C A R T</h1>
       </ul>
 
 
-
-
       <form id="contactForm">
         <h3 style="font-family: var(--ff-philosopher);">Contact Us!</h3>
         <input type="email" id="email" name="email" placeholder="Your Email" required=""
@@ -424,7 +406,6 @@ <h3 style="font-family: var(--ff-philosopher);">Contact Us!</h3>
         <textarea id="message" name="message" placeholder="Your Message" required=""
           style="font-family: var(--ff-poppins);"></textarea>
 
-
         <button id="butt" type="submit" style="font-family: var(--ff-poppins);">Send Message</button>
       </form>
     </div>
@@ -434,14 +415,10 @@ <h3 style="font-family: var(--ff-philosopher);">Contact Us!</h3>
         <h4 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">Follow Us</h4>
         <div class="social-icons">
           <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>
-            <a class="fa-brands fa-x-twitter"
-                href="https://twitter.com" target="_blank"></a>
-        </div>
+            <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>
+            <a class="fa-brands fa-x-twitter" href="https://twitter.com" target="_blank"></a>
+          </div>
         </div>
         <p style="margin-bottom:0;font-family: var(--ff-philosopher);">Stay connected with us on social media for the
           latest updates, latest collection, and vintage adventures.
@@ -467,7 +444,7 @@ <h4 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">Follow
       </div>
     </div>
   </footer>
-    <script src="cart.js"></script>
+  <script src="cart.js"></script>
 
   </script>
 
@@ -580,4 +557,4 @@ <h4 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">Follow
   </script>
 </body>
 
-</html>
+</html>
\ No newline at end of file
