diff --git a/dedicated-destinations/Dubai/start.html b/dedicated-destinations/Dubai/start.html
index 8f0b3d8b..7ea92607 100644
--- a/dedicated-destinations/Dubai/start.html
+++ b/dedicated-destinations/Dubai/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/Goa/start.html b/dedicated-destinations/Goa/start.html
index 8b77422f..81bb838e 100644
--- a/dedicated-destinations/Goa/start.html
+++ b/dedicated-destinations/Goa/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/London/start.html b/dedicated-destinations/London/start.html
index 6ea2d20d..9ddc9c7c 100644
--- a/dedicated-destinations/London/start.html
+++ b/dedicated-destinations/London/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html">Home</a></li>
diff --git a/dedicated-destinations/Maldives/start.html b/dedicated-destinations/Maldives/start.html
index 684ced0c..ac393662 100644
--- a/dedicated-destinations/Maldives/start.html
+++ b/dedicated-destinations/Maldives/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/Paris/start.html b/dedicated-destinations/Paris/start.html
index 74f4c236..ea329b80 100644
--- a/dedicated-destinations/Paris/start.html
+++ b/dedicated-destinations/Paris/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/bali/start.html b/dedicated-destinations/bali/start.html
index d0e933fb..e768263b 100644
--- a/dedicated-destinations/bali/start.html
+++ b/dedicated-destinations/bali/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/brazil/start.html b/dedicated-destinations/brazil/start.html
index 0dfec03f..fe88f8fd 100644
--- a/dedicated-destinations/brazil/start.html
+++ b/dedicated-destinations/brazil/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/grand-canyon-national-park-arizona/Grand_start.html b/dedicated-destinations/grand-canyon-national-park-arizona/Grand_start.html
index 56cc8fe6..f050d75d 100644
--- a/dedicated-destinations/grand-canyon-national-park-arizona/Grand_start.html
+++ b/dedicated-destinations/grand-canyon-national-park-arizona/Grand_start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/kashmir/start.html b/dedicated-destinations/kashmir/start.html
index a6dc9cdc..b3ffd722 100644
--- a/dedicated-destinations/kashmir/start.html
+++ b/dedicated-destinations/kashmir/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html">Home</a></li>
diff --git a/dedicated-destinations/machu-picchu-peru/Machu_start.html b/dedicated-destinations/machu-picchu-peru/Machu_start.html
index bdb25219..b8a21029 100644
--- a/dedicated-destinations/machu-picchu-peru/Machu_start.html
+++ b/dedicated-destinations/machu-picchu-peru/Machu_start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html">Home</a></li>
diff --git a/dedicated-destinations/new-york/start.html b/dedicated-destinations/new-york/start.html
index e1f849d4..6d082f73 100644
--- a/dedicated-destinations/new-york/start.html
+++ b/dedicated-destinations/new-york/start.html
@@ -30,7 +30,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/dedicated-destinations/santorini-aegean-sea/start.html b/dedicated-destinations/santorini-aegean-sea/start.html
index 17a28162..ebd10b69 100644
--- a/dedicated-destinations/santorini-aegean-sea/start.html
+++ b/dedicated-destinations/santorini-aegean-sea/start.html
@@ -29,7 +29,7 @@
     --->
   <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="text-decoration: none;">Tourguide<span>.</span></a>
 
       <ul class="navLinks">
         <li class="link home" data-aos="fade-down"><a href="../../index.html#Home">Home</a></li>
diff --git a/feedback.html b/feedback.html
index 2aa4a28b..d39afd72 100644
--- a/feedback.html
+++ b/feedback.html
@@ -40,7 +40,7 @@
 
         </ul>
         <a href="newLogin.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
-            data-aos="fade-down">Login</button></a>
+          data-aos="fade-down">Login/SignUp</button></a>
         <div class="toggle-container" data-aos="fade-down">
           <input id="themeToggle" class="toggle" type="checkbox">
         </div>
diff --git a/imstyle.css b/imstyle.css
new file mode 100644
index 00000000..909c7e00
--- /dev/null
+++ b/imstyle.css
@@ -0,0 +1,25 @@
+.hero{
+    width:100%;
+    height:90vh;
+    background: white;
+    overflow: hidden;
+}
+.hero .carousel{
+    width:300px;
+    margin:100px auto 0;
+    overflow:visible;
+}
+.carousel img{
+    -webkit-box-reflect: below 20px linear-gradient(rgba(255,255,255,0.1),rgba(255,255,255,0.3));
+    width:600px;
+    height:400px;
+}
+.dark-theme .hero{
+    background:#0e1525;
+}
+@media screen and (max-width:500px) {
+    .carousel img{
+        width:250px;
+        height: 200px;
+    }
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 3cf261b5..2678fffe 100644
--- a/index.html
+++ b/index.html
@@ -50,7 +50,6 @@
     //}
     // menuButton.forEach((button) => (button.onclick = () => closeNav()));
 
-
   </script>
 
 
@@ -96,8 +95,41 @@
         width: 190%;
       }
     }
+    .gallery-rotate-image .image-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px; /* Adjust the gap between images */
+}
+
+.gallery-rotate-image .image-container span {
+  display: inline-block;
+}
+
+.trip-gallery-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px; /* Adjust the gap between images */
+}
+
+.trip-gallery-container .image-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.trip-gallery-container .image-container img {
+  max-width: 100%;
+  height: auto;
+}
+
+.btn-container {
+  display: flex;
+  justify-content: center;
+  gap: 8px; /* Adjust the gap between buttons */
+}
   </style>
-
+<link rel="stylesheet" href="imstyle.css">
+<link rel="stylesheet" href="jquery.flipster.min.css">
 
 </head>
 
@@ -147,16 +179,17 @@ <h1>TourGuide . . .</h1>
           <li class="link" data-aos=""><a href="#ReviewGallery">Trip Gallery</a></li>
           <li class="link" data-aos=""><a href="#testimonials">Testimonials</a></li>
           <li class="link" data-aos=""><a href="feedback.html">Rate Us?</a></li>
-          <li class="link" data-aos=""><a href="#contact">Contact Us</a></li>
+          <li class="link" data-aos=""><a href="#cnt-form">Contact Us</a></li>
 
 
         </ul>
 
 
-        <a href="loginPage.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
-            data-aos="fade-down">Login</button></a>
-
+        <a href="newLogin.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
+            data-aos="fade-down">Login/SignUp</button></a>
 
+        <a href="loginPage.html" class="contact-btn"><button class="btn" id="logout-btn" style="margin: 0; display: none;"
+              data-aos="fade-down" disabled>Log Out</button></a>
 
         <!-- <a href="login-modified.html" class="contact-btn"><button class="btn" id="btn-style"
             style="margin: 0; box-shadow:1.5px 1.5px 6px red;" data-aos="fade-down">Login</button></a> -->
@@ -400,95 +433,87 @@ <h2 class="section__title" data-aos="fade-in">Explore top destinations</h2>
     </div>
 
     <!-- slideshow -->
-    <!-- <div class="slideshow-container" data-aos="fade-up"> -->
-
-    <!-- Next and previous buttons -->
-    <!-- <div class="destination__nav">
-          <span onclick="pullSlide(-1)"><i class="ri-arrow-left-s-line"></i></span>
-          <span onclick="pullSlide(1)"><i class="ri-arrow-right-s-line"></i></span>
-        </div> -->
-
-    <!-- Full-width images with number and caption text -->
-    <!-- <div class="mySlides">
-          <img src="./img/eiffelTower.webp" style="width:100%">
-        </div>
-
-        <div class="mySlides">
-          <img src="./img/london.jpg" style="width:100%">
-        </div>
-
-        <div class="mySlides">
-          <img src="./img/goa.jpg" style="width:100%">
-        </div>
-
-        <div class="mySlides">
-          <img src="./img/maldives.jpg" style="width:100%">
-        </div>
-        <div class="imageDots">
-          <span class="active"></span>
-          <span></span>
-          <span></span>
-          <span></span>
-        </div>
-      </div> -->
-    <div class="outer-box">
-      <div class="containers">
+<!-- <div class="slideshow-container" data-aos="fade-up"> -->
 
-        <div class="card active" style="
-            background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-              url('/img/paris.jpg')
-          ">
-          <div class="info">
-
-            <p>
-              ||Eiffel Tower||
-            </p>
-            <h3>PARIS</h3>
-          </div>
-        </div>
+<!-- Next and previous buttons -->
+<!-- <div class="destination__nav">
+      <span onclick="pullSlide(-1)"><i class="ri-arrow-left-s-line"></i></span>
+      <span onclick="pullSlide(1)"><i class="ri-arrow-right-s-line"></i></span>
+    </div> -->
 
-        <div class="card" style="
-              background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-                url('/img/london.jpg')
-            ">
-          <div class="info">
-
-            <p>
-              ||Giant Wheel||
-            </p>
-            <h3>LONDON</h3>
-          </div>
-        </div>
-
-        <div class="card" style="
-              background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-                url('/img/goa.jpg')
-            ">
-          <div class="info">
+<!-- Full-width images with number and caption text -->
+<!-- <div class="mySlides">
+      <img src="./img/eiffelTower.webp" style="width:100%">
+    </div>
 
-            <p>
-              ||Goa Beach||
-            </p>
-            <h3>GOA</h3>
-          </div>
-        </div>
+    <div class="mySlides">
+      <img src="./img/london.jpg" style="width:100%">
+    </div>
 
-        <div class="card" style="
-              background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-                url('/img/maldives.jpg')">
-          <div class="info">
+    <div class="mySlides">
+      <img src="./img/goa.jpg" style="width:100%">
+    </div>
 
-            <p>
-              ||Male Beach||
-            </p>
-            <h3>MALDIVES</h3>
-          </div>
-        </div>
+    <div class="mySlides">
+      <img src="./img/maldives.jpg" style="width:100%">
+    </div>
+    <div class="imageDots">
+      <span class="active"></span>
+      <span></span>
+      <span></span>
+      <span></span>
+    </div>
+  </div> -->
+<div class="outer-box">
+  <div class="containers">
+    
+    <div class="card active" style="
+      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+        url('./img/eiffelTower.webp')
+    ">
+      <div class="info">
+        <img src="./img/eiffelTower.webp" alt="Eiffel Tower" style="width:100%">
+        <p>||Eiffel Tower||</p>
+        <h3>PARIS</h3>
+      </div>
+    </div>
 
+    <div class="card" style="
+      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+        url('./img/london.jpg')
+    ">
+      <div class="info">
+        <img src="./img/london.jpg" alt="Giant Wheel" style="width:100%">
+        <p>||Giant Wheel||</p>
+        <h3>LONDON</h3>
+      </div>
+    </div>
 
+    <div class="card" style="
+      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+        url('./img/goa.jpg')
+    ">
+      <div class="info">
+        <img src="./img/goa.jpg" alt="Goa Beach" style="width:100%">
+        <p>||Goa Beach||</p>
+        <h3>GOA</h3>
+      </div>
+    </div>
 
+    <div class="card" style="
+      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+        url('./img/maldives.jpg')
+    ">
+      <div class="info">
+        <img src="./img/maldives.jpg" alt="Male Beach" style="width:100%">
+        <p>||Male Beach||</p>
+        <h3>MALDIVES</h3>
       </div>
     </div>
+
+  </div>
+</div>
+
     <script src="explore.js"></script>
     </section>
 
@@ -545,35 +570,56 @@ <h2 class="section__title">Best trip packages</h2>
         </div>
       </div>
     </section>
+    <div class="hero">
+      <div class="carousel">
+        <ul>
+            <li><img src="https://i.ibb.co/ZYDJ6vv/pexels-spencer-davis-4356144.jpg"></li>
+            <li><img src="https://i.ibb.co/W3HTbYG/pexels-zakaria-boumliha-2827374.jpg"></li>
+            <li><img src="https://i.ibb.co/KwHd8PQ/pexels-stijn-dijkstra-2499699.jpg"></li>
+            <li><img src="https://www.shutterstock.com/image-photo/attractive-young-female-tourist-exploring-260nw-2206967581.jpg"></li>
+            <li><img src="https://thumbs.dreamstime.com/b/young-man-tourist-sail-long-tail-thailand-boat-ocean-sea-vacation-travel-trip-beautiful-nature-87331931.jpg"></li>
+            <li><img src="https://www.tourmyindia.com/blog//wp-content/uploads/2020/11/Feature-Akshardham-Temple.jpg"></li>
+            <li><img src="https://etimg.etb2bimg.com/photo/106124800.cms"></li>
+            <li><img src="https://i.insider.com/5dcc2f02e94e860aff271137?width=700"></li>
+            <li><img src="https://static01.nyt.com/images/2022/03/23/multimedia/23-virus-briefing-capitol/23-virus-briefing-capitol-articleLarge.jpg?quality=75&auto=webp&disable=upscale"></li>
+            <li><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTWh9aGHycWhRya4V6ZiJFL26LyIHheiu-EoQ&s"></li>
+        
+        </ul>
+      </div>
+    
+     
 
+</div>
 
-    <section class="gallary" id="ReviewGallery">
-      <div class="section__container gallary__container">
-        <div class="section__container gallary__container" id="originalDiv">
-          <div class="image__gallary">
-            <div class="gallary__col" data-aos="zoom-in">
-              <img src="https://i.ibb.co/ZYDJ6vv/pexels-spencer-davis-4356144.jpg" alt="gallary" />
-            </div>
-            <div class="gallary__col" data-aos="zoom-in">
-              <img src="https://i.ibb.co/W3HTbYG/pexels-zakaria-boumliha-2827374.jpg" alt="gallary" />
-              <img src="https://i.ibb.co/KwHd8PQ/pexels-stijn-dijkstra-2499699.jpg" alt="gallary" />
-            </div>
-          </div>
-          <div class="gallary__content">
-            <div>
-              <h2 class="section__title" data-aos="zoom-in">
-                Our trip gallery that will inspire you
-              </h2>
-              <p class="section__subtitle" data-aos="zoom-in">
-                Explore your suitable and dream places around the world. Here you
-                can find your right destination.
-              </p>
-              <button class="btn btn-style" id="btn-page" onclick="replaceDivs()" data-aos="zoom-in"
-                style="box-shadow: 2px 2px 8px rgb(0, 191, 255);">View All</button>
-            </div>
-          </div>
+    <script
+    src="https://code.jquery.com/jquery-3.7.1.min.js"
+    integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo="
+    crossorigin="anonymous"></script>
+    <script src="jquery.flipster.min.js"></script>
+<script>
+$('.carousel').flipster({
+    style:'carousel',
+    spacing: -0.3,
+});
+</script>
+<section class="gallary" id="ReviewGallery">
+  <div class="section__container gallary__container">
+    <div class="section__container gallary__container" id="originalDiv">
+      <div class="gallary__content">
+        <div>
+          <h2 class="section__title" data-aos="zoom-in">
+            Our trip gallery that will inspire you
+          </h2>
+          <p class="section__subtitle" data-aos="zoom-in">
+            Explore your suitable and dream places around the world. Here you
+            can find your right destination.
+          </p>
+          <button class="btn btn-style" id="btn-page" onclick="replaceDivs()" data-aos="zoom-in"
+            style="box-shadow: 2px 2px 8px rgb(0, 191, 255);">View All</button>
         </div>
       </div>
+    </div>
+  </div>
       <br><br>
       <!-- New div components (hidden initially) -->
       <div id="newDiv" style="display: none;" data-aos="zoom-in">
@@ -682,6 +728,13 @@ <h2 class="section__title" data-aos="zoom-in">
         </div>
       </div>
     </section>
+    <script>
+      function replaceDivs() {
+    document.querySelector('.hero').style.display = 'none';
+    document.getElementById('originalDiv').style.display = 'none';
+    document.getElementById('newDiv').style.display = 'block';
+  }
+    </script>
     <br /><br /><br /><br /><br /><br />
 
     <!-- Testimonials Section -->
@@ -850,7 +903,7 @@ <h2 class="section__title" align-items="center" data-aos="slide-right">Contact U
 
     <section>
       <div class="container" id="cnt-form">
-        <div class="items">
+        <div class="items" style="box-shadow:rgba(50,50,93,0.25) 0px 50px 100px -20px,rgba(0,0,0,0.3) 0px 30px 60px -30px,rgba(10,37,64,0.35) 0px -2px 6px 0px inset;">
           <div class="contact" data-aos="slide-right">
             <div>
               <h1 class="section__title" style="height: 90px;">Contact Us</h1>
@@ -861,11 +914,20 @@ <h1 class="section__title" style="height: 90px;">Contact Us</h1>
           <div class="contact-form" data-aos="fade-in">
             <h1>Contact Us</h1>
             <form id="contact-form" name="CalcDiverse Contact" autocomplete="off">
-              <input type="text" id="Name" placeholder="Name" required>
-              <input type="email" id="email" placeholder="Email" required>
-              <textarea id="message" placeholder="Type your message here.." required></textarea><br>
+              <div class="one" style="position: relative;">
+                <i class="icon1 fa-solid fa-user"></i>
+                <input type="text" id="Name" placeholder="Name"  style="padding-left: 6%;">
+              </div>
+              <div style="position: relative;">
+                <i class="icon2 fa-solid fa-envelope" ></i>
+                <input type="email" id="email" placeholder="Email"style="padding-left:6%;" required>
+              </div>
+              <div style="position: relative;">
+                <i class="icon3 fa-solid fa-message"></i>
+                <textarea id="message" placeholder="Type your message here.." style="padding-left:6%;" required></textarea><br>
+              </div>
               <button type="submit" class="btn btn-style" data-aos="fade-in" id="btn-style"
-                style="margin-right: 40px;box-shadow: 2px 2px 8px red;">Send</button>
+              style="margin-right: 40px;box-shadow: 2px 2px 8px red;">Send</button>
               <button onclick="window.location.href='feed.html'" class="btn  btn-style" data-aos="fade-in"
                 id="btn-style" style="box-shadow: 2px 2px 8px red;">Feedback</button>
             </form>
@@ -910,7 +972,7 @@ <h4 class="footer__subtitle">Support</h4>
           <p><a href="./faq.html" class="footer__link">FAQs</a></p>
           <p><a href="./tnc.html" class="footer__link">Terms & Conditions</a></p>
           <p><a href="./privacy.html" class="footer__link">Privacy Policy</a></p>
-          <p><a href="#cnt-form" class="footer__link">Contact</a></p>
+          <p><a href="#cnt-form" class="footer__link">Contact Us</a></p>
           </div>
         </div>
         <div class="footer__col">
@@ -948,9 +1010,11 @@ <h4>Address</h4>
           </div>
         </div>
         <div class="footer__col">
+          <div class="footer__area">
           <h4>Reach Out To Us</h4>
-          <p><span>Email:</span> tour@tourguide.com</p>
-          <p><span>Phone:</span> +91 8562145852</p>
+          <p><span>Email:</span><a href="mailto:tour@tourguide.com">tour@tourguide.com</a></p>
+          <p><span>Phone:</span><a href="tel:8562145852">+91 8562145852</a></p>
+        </div>
         </div>
         <div class="footer__col">
           <div id="google_element"></div>
@@ -1469,6 +1533,31 @@ <h4>Reach Out To Us</h4>
     document.getElementById("year").innerHTML = new Date().getFullYear();
   </script>
 
+  <script>
+        // Logout Button
+
+      document.addEventListener('DOMContentLoaded', function () {
+      var isLoggedIn = localStorage.getItem('isLoggedIn');
+      var loginButton = document.getElementById('btn-style');
+      var logoutButton = document.getElementById('logout-btn');
+
+      if (isLoggedIn === 'true') {
+          loginButton.style.display = 'none';
+          logoutButton.style.display = 'block';
+          loginButton.disabled = true ;
+          logoutButton.disabled = false;
+          logoutButton.style.cursor = 'pointer';
+          logoutButton.addEventListener('click', function() {
+              localStorage.setItem('isLoggedIn', 'false');
+              window.location.href = './index.html';
+          });
+      } else {
+          loginButton.style.display = 'block';
+          logoutButton.disabled = true;
+      }
+  });
+  </script>
+
 
 </html><!-- New bubble background start -->
 
diff --git a/jquery.flipster.min.css b/jquery.flipster.min.css
new file mode 100644
index 00000000..4037e019
--- /dev/null
+++ b/jquery.flipster.min.css
@@ -0,0 +1 @@
+/*! jQuery.Flipster, v1.1.6 (built 2024-01-17) */.flipster{display:block;overflow-x:hidden;overflow-y:visible;position:relative}.flipster:focus{outline:none}.flipster__container,.flipster__item{margin:0;padding:0;list-style-type:none;position:relative}.flipster__container{display:block;white-space:nowrap;word-spacing:-0.25em;-ms-transform-origin:50% 50%;transform-origin:50% 50%;backface-visibility:hidden}.flipster__item{display:inline-block;white-space:normal;word-spacing:normal;vertical-align:bottom}.flipster--click .flipster__item--past,.flipster--click .flipster__item--future{cursor:pointer}.flipster__item img{max-width:100%}.flipster__button{position:absolute;top:50%;display:block;appearance:none;background:none;border:none;padding:0;z-index:999;cursor:pointer;font-size:15px;opacity:.5;transition:opacity 500ms ease;margin:-1em 2em}.flipster__button svg{width:2em;stroke:currentColor;fill:transparent;stroke-width:3;stroke-linecap:round}.flipster__button:hover,.flipster__button:focus{opacity:1}.flipster__button--prev{left:0}.flipster__button--next{right:0}.flipster__nav,.flipster__nav__item{list-style-type:none;margin:0;padding:0}.flipster__nav{display:block;margin:0 0 4em;text-align:center;position:relative}.flipster__nav__item{display:inline-block;margin:0 .25em}.flipster__nav__link{display:block;color:inherit;padding:.5em 1em;position:relative;overflow:hidden;transition:all 250ms ease-out;transition-timing-function:cubic-bezier(.56, .12, .12, .98)}.flipster__nav__link::after{content:'';display:block;background:#232221;position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;-ms-transform:translateY(100%) translateY(-0.25em);transform:translateY(100%) translateY(-0.25em);transition:inherit}.flipster__nav__item--current>.flipster__nav__link,.flipster__nav__link:hover,.flipster__nav__link:focus{color:#FFF}.flipster__nav__item--current>.flipster__nav__link::after,.flipster__nav__link:hover::after,.flipster__nav__link:focus::after{-ms-transform:translateY(0);transform:translateY(0)}.flipster__nav__child{display:none;position:absolute;top:100%;left:0;right:0;margin-top:-1px;padding:.5em;background:#4e4441;z-index:1}.flipster__nav__child .flipster__nav__link{color:#FFF}.flipster__nav__child .flipster__nav__link::after{background:#FFF}.flipster__nav__child .flipster__nav__item--current>.flipster__nav__link,.flipster__nav__child .flipster__nav__link:hover,.flipster__nav__child .flipster__nav__link:focus{color:#232221}.flipster__nav__item--current .flipster__nav__child{display:block}.flipster--carousel .flipster__container,.flipster--carousel .flipster__item,.flipster--carousel .flipster__item__content{transition:all 350ms ease-in-out;transition-timing-function:cubic-bezier(.56, .12, .12, .98)}.flipster--carousel .flipster__item{perspective:800px}.flipster--carousel .flipster__item--past,.flipster--carousel .flipster__item--future{opacity:0;transition-delay:115ms}.flipster--carousel .flipster__item--past-2,.flipster--carousel .flipster__item--future-2{opacity:.6;transition-delay:90ms}.flipster--carousel .flipster__item--past-1,.flipster--carousel .flipster__item--future-1{opacity:.8;transition-delay:60ms}.flipster--carousel .flipster__item--past .flipster__item__content{transform:translateX(100%) rotateY(-20deg) scale(.5)}.flipster--carousel .flipster__item--past-2 .flipster__item__content{transform:translateX(25%) rotateY(40deg) scale(.65)}.flipster--carousel .flipster__item--past-1 .flipster__item__content{transform:rotateY(45deg) scale(.8)}.flipster--carousel .flipster__item--future .flipster__item__content{transform:translateX(-100%) rotateY(20deg) scale(.5)}.flipster--carousel .flipster__item--future-2 .flipster__item__content{transform:translateX(-25%) rotateY(-40deg) scale(.65)}.flipster--carousel .flipster__item--future-1 .flipster__item__content{transform:rotateY(-45deg) scale(.8)}.flipster--carousel.no-rotate .flipster__item--past .flipster__item__content{-ms-transform:translateX(175%) scale(.5);transform:translateX(175%) scale(.5)}.flipster--carousel.no-rotate .flipster__item--past-2 .flipster__item__content{-ms-transform:translateX(25%) scale(.65);transform:translateX(25%) scale(.65)}.flipster--carousel.no-rotate .flipster__item--past-1 .flipster__item__content{-ms-transform:translateX(0%) scale(.8);transform:translateX(0%) scale(.8)}.flipster--carousel.no-rotate .flipster__item--future .flipster__item__content{-ms-transform:translateX(-175%) scale(.5);transform:translateX(-175%) scale(.5)}.flipster--carousel.no-rotate .flipster__item--future-2 .flipster__item__content{-ms-transform:translateX(-25%) scale(.65);transform:translateX(-25%) scale(.65)}.flipster--carousel.no-rotate .flipster__item--future-1 .flipster__item__content{-ms-transform:translateX(0%) scale(.8);transform:translateX(0%) scale(.8)}.flipster--carousel .flipster__item--current .flipster__item__content{transform:translateX(0) rotateY(0deg) scale(1);transition-delay:60ms}.flipster--coverflow .flipster__container,.flipster--coverflow .flipster__item,.flipster--coverflow .flipster__item__content{transition:all 350ms ease-in-out;transition-timing-function:cubic-bezier(.56, .12, .12, .98)}.flipster--coverflow .flipster__item{perspective:800px}.flipster--coverflow .flipster__container{padding-bottom:5%}.flipster--coverflow .flipster__item__content{-ms-transform-origin:50% 100%;transform-origin:50% 100%;box-reflect:below 0 -webkit-gradient(linear, left bottom, left top, color-stop(.05, rgba(255,255,255,0.12)), color-stop(.2, transparent));-webkit-box-reflect:below 0 -webkit-gradient(linear, left bottom, left top, color-stop(.05, rgba(255,255,255,0.12)), color-stop(.2, transparent))}.flipster--coverflow .flipster__item__content img:only-child{display:block}.flipster--coverflow .flipster__item--past .flipster__item__content{-ms-transform-origin:0% 50%;transform-origin:0% 50%;transform:scale(.75) rotateY(55deg)}.flipster--coverflow .flipster__item--future .flipster__item__content{-ms-transform-origin:100% 50%;transform-origin:100% 50%;transform:scale(.75) rotateY(-55deg)}.flipster--coverflow .flip-current .flipster__item__content{transform:rotateY(0deg)}.flipster--flat .flipster__container,.flipster--flat .flipster__item,.flipster--flat .flipster__item__content{transition:all 400ms ease-in-out}.flipster--flat .flipster__item--past,.flipster--flat .flipster__item--future{opacity:.5}.flipster--flat .flipster__item--past .flipster__item__content{-ms-transform:scale(.75);transform:scale(.75)}.flipster--flat .flipster__item--future .flipster__item__content{-ms-transform:scale(.75);transform:scale(.75)}.flipster--wheel{overflow:hidden}.flipster--wheel .flipster__container,.flipster--wheel .flipster__item__content{transition:all 400ms ease-in-out;transition-timing-function:cubic-bezier(.56, .12, .12, .98)}.flipster--wheel .flipster__container{padding-bottom:20%}.flipster--wheel .flipster__item__content{-ms-transform-origin:50% 100%;transform-origin:50% 100%}.flipster--wheel .flipster__item--past .flipster__item__content{-ms-transform-origin:100% 100%;transform-origin:100% 100%}.flipster--wheel .flipster__item--future .flipster__item__content{-ms-transform-origin:0% 100%;transform-origin:0% 100%}.flipster--wheel .flipster__item__content img:only-child{display:block}.flipster--wheel .flipster__item--past .flipster__item__content{opacity:0;transform:rotateZ(-80deg) translate(-170%, 110%)}.flipster--wheel .flipster__item--future .flipster__item__content{opacity:0;transform:rotateZ(80deg) translate(170%, 110%)}.flipster--wheel .flipster__item--past-3 .flipster__item__content{opacity:1;transform:rotateZ(-60deg) translate(-70%, 75%)}.flipster--wheel .flipster__item--future-3 .flipster__item__content{opacity:1;transform:rotateZ(60deg) translate(70%, 75%)}.flipster--wheel .flipster__item--past-2 .flipster__item__content{opacity:1;transform:rotateZ(-40deg) translate(-17%, 30%)}.flipster--wheel .flipster__item--future-2 .flipster__item__content{opacity:1;transform:rotateZ(40deg) translate(17%, 30%)}.flipster--wheel .flipster__item--past-1 .flipster__item__content{opacity:1;transform:rotateZ(-20deg)}.flipster--wheel .flipster__item--future-1 .flipster__item__content{opacity:1;transform:rotateZ(20deg)}.flipster--wheel .flip-current .flipster__item__content{transform:rotateX(0deg)}
\ No newline at end of file
diff --git a/jquery.flipster.min.js b/jquery.flipster.min.js
new file mode 100644
index 00000000..7ea1b582
--- /dev/null
+++ b/jquery.flipster.min.js
@@ -0,0 +1,3 @@
+/*! jQuery.Flipster, v1.1.6 (built 2024-01-17) */
+
+!function(P,t,D){"use strict";function L(n,i){var a=null;return function(){var t=this,e=arguments;null===a&&(a=setTimeout(function(){n.apply(t,e),a=null},i))}}var r,e=(r={},function(t){if(r[t]!==D)return r[t];var e=document.createElement("div").style,n=t.charAt(0).toUpperCase()+t.slice(1),i=(t+" "+["webkit","moz","ms","o"].join(n+" ")+n).split(" ");for(var a in i)if(i[a]in e)return r[t]=i[a];return r[t]=!1}),a="http://www.w3.org/2000/svg",E=P(t),M=e("transform"),i={itemContainer:"ul",itemSelector:"li",start:"center",fadeIn:400,loop:!1,autoplay:!1,pauseOnHover:!0,style:"coverflow",spacing:-.6,click:!0,keyboard:!0,scrollwheel:!0,touch:!0,nav:!1,buttons:!1,buttonPrev:"Previous",buttonNext:"Next",onItemSwitch:!1},T={main:"flipster",active:"flipster--active",container:"flipster__container",nav:"flipster__nav",navChild:"flipster__nav__child",navItem:"flipster__nav__item",navLink:"flipster__nav__link",navCurrent:"flipster__nav__item--current",navCategory:"flipster__nav__item--category",navCategoryLink:"flipster__nav__link--category",button:"flipster__button",buttonPrev:"flipster__button--prev",buttonNext:"flipster__button--next",item:"flipster__item",itemCurrent:"flipster__item--current",itemPast:"flipster__item--past",itemFuture:"flipster__item--future",itemContent:"flipster__item__content"},X=new RegExp("\\b("+T.itemCurrent+"|"+T.itemPast+"|"+T.itemFuture+")(.*?)(\\s|$)","g"),j=new RegExp("\\s\\s+","g");P.fn.flipster=function(e){if("string"==typeof e){var n=Array.prototype.slice.call(arguments,1);return this.each(function(){var t=P(this).data("methods");return t[e]?t[e].apply(this,n):this})}var I=P.extend({},i,e);return this.each(function(){var t,f,r,n,p,s,l,c,u,v=P(this),o=[],h=0,d=!1,e=!1;function i(e){return e=e||"next",P('<button class="'+T.button+" "+("next"===e?T.buttonNext:T.buttonPrev)+'" role="button" />').html((n="next"===(t=e)?I.buttonNext:I.buttonPrev,"custom"===I.buttons?n:'<svg viewBox="0 0 13 20" xmlns="'+a+'" aria-labelledby="title"><title>'+n+'</title><polyline points="10,3 3,10 10,17"'+("next"===t?' transform="rotate(180 6.5,10)"':"")+"/></svg>")).on("click",function(t){y(e),t.preventDefault()});var t,n}function m(){v.css("transition",""),f.css("transition",""),p.css("transition","")}function g(a){var t,e;a&&(v.css("transition","none"),f.css("transition","none"),p.css("transition","none")),r=f.width(),f.height((e=0,p.each(function(){t=P(this).height(),e<t&&(e=t)}),e)),r?(n&&(clearInterval(n),n=!1),p.each(function(t){var e,n,i=P(this);i.attr("class",function(t,e){return e&&e.replace(X,"").replace(j," ")}),e=i.outerWidth(),0!==I.spacing&&i.css("margin-right",e*I.spacing+"px"),n=i.position().left,o[t]=-1*(n+e/2-r/2),t===p.length-1&&(_(),a&&setTimeout(m,1))})):n=n||setInterval(function(){g(a)},500)}function _(){var e,n,i,a=p.length;p.each(function(t){e=P(this),n=" ",i=t===h?(n+=T.itemCurrent,a+1):t<h?(n+=T.itemPast+" "+T.itemPast+"-"+(h-t),a-(h-t)):(n+=T.itemFuture+" "+T.itemFuture+"-"+(t-h),a-(t-h)),e.css("z-index",i).attr("class",function(t,e){return e&&e.replace(X,"").replace(j," ")+n})}),0<=h&&(r&&o[h]!==D||g(!0),M?f.css("transform","translateX("+o[h]+"px)"):f.css({left:o[h]+"px"})),function(){if(I.nav){var t=s.data("flip-category");c.removeClass(T.navCurrent),u.filter(function(){return P(this).data("index")===h||t&&P(this).data("category")===t}).parent().addClass(T.navCurrent)}}()}function y(t){var e=h;if(!(p.length<=1))return"prev"===t?0<h?h--:I.loop&&(h=p.length-1):"next"===t?h<p.length-1?h++:I.loop&&(h=0):"number"==typeof t?h=t:t!==D&&(h=p.index(t),I.loop&&e!=h&&(e==p.length-1&&h!=p.length-2&&(h=0),0==e&&1!=h&&(h=p.length-1))),s=p.eq(h),h!==e&&I.onItemSwitch&&I.onItemSwitch.call(v,p[h],p[e]),_(),v}function b(t){return I.autoplay=t||I.autoplay,clearInterval(d),d=setInterval(function(){var t=h;y("next"),t!==h||I.loop||clearInterval(d)},I.autoplay),v}function x(){return clearInterval(d),d=0,v}function w(t){return x(),I.autoplay&&t&&(d=-1),v}function C(){g(!0),v.hide().css("visibility","").addClass(T.active).fadeIn(I.fadeIn)}function k(){var o;if(f=v.find(I.itemContainer).addClass(T.container),!((p=f.find(I.itemSelector)).length<=1))return p.addClass(T.item).each(function(){var t=P(this);t.children("."+T.itemContent).length||t.wrapInner('<div class="'+T.itemContent+'" />')}),I.click&&p.on("click.flipster touchend.flipster",function(t){e||(P(this).hasClass(T.itemCurrent)||t.preventDefault(),y(this))}),I.buttons&&1<p.length&&(v.find("."+T.button).remove(),v.append(i("prev"),i("next"))),o={},!I.nav||p.length<=1||(l&&l.remove(),l=P('<ul class="'+T.nav+'" role="navigation" />'),u=P(""),p.each(function(t){var e=P(this),n=e.data("flip-category"),i=e.data("flip-title")||e.attr("title")||t,a=P('<a href="#" class="'+T.navLink+'">'+i+"</a>").data("index",t);if(u=u.add(a),n){if(!o[n]){var r=P('<li class="'+T.navItem+" "+T.navCategory+'">'),s=P('<a href="#" class="'+T.navLink+" "+T.navCategoryLink+'" data-flip-category="'+n+'">'+n+"</a>").data("category",n).data("index",t);o[n]=P('<ul class="'+T.navChild+'" />'),u=u.add(s),r.append(s,o[n]).appendTo(l)}o[n].append(a)}else l.append(a);a.wrap('<li class="'+T.navItem+'">')}),l.on("click","a",function(t){var e=P(this).data("index");0<=e&&(y(e),t.preventDefault())}),"after"===I.nav?v.append(l):v.prepend(l),c=l.find("."+T.navItem)),0<=h&&y(h),v}t={jump:y,next:function(){return y("next")},prev:function(){return y("prev")},play:b,stop:x,pause:w,index:k},v.data("methods",t),v.hasClass(T.active)||function(){var t;if(v.css("visibility","hidden"),k(),p.length<=1)v.css("visibility","");else{t=!!I.style&&"flipster--"+I.style.split(" ").join(" flipster--"),v.addClass([T.main,M?"flipster--transform":" flipster--no-transform",t,I.click?"flipster--click":""].join(" ")),I.start&&(h="center"===I.start?Math.floor(p.length/2):I.start),y(h);var e,n,i,a,r,s,o,l,c=v.find("img");if(c.length){var u=0;c.on("load",function(){++u>=c.length&&C()}),setTimeout(C,750)}else C();E.on("resize.flipster",L(g,400)),I.autoplay&&b(),I.pauseOnHover&&f.on("mouseenter.flipster",function(){d?w(!0):x()}).on("mouseleave.flipster",function(){-1===d&&b()}),e=v,I.keyboard&&(e[0].tabIndex=0,e.on("keydown.flipster",L(function(t){var e=t.which;37!==e&&39!==e||(y(37===e?"prev":"next"),t.preventDefault())},250))),function(t){if(I.scrollwheel){var e,n,i=!1,a=0,r=0,s=0,o=/mozilla/.test(navigator.userAgent.toLowerCase())&&!/webkit/.test(navigator.userAgent.toLowerCase());t.on("mousewheel.flipster wheel.flipster",function(){i=!0}).on("mousewheel.flipster wheel.flipster",L(function(t){clearTimeout(r),r=setTimeout(function(){s=a=0},300),t=t.originalEvent,s+=t.wheelDelta||-1*(t.deltaY+t.deltaX),Math.abs(s)<25&&!o||(a++,n!==(e=0<s?"prev":"next")&&(a=0),n=e,(a<6||a%3==0)&&y(e),s=0)},50)),t.on("mousewheel.flipster wheel.flipster",function(t){i&&(t.preventDefault(),i=!1)})}}(f),n=f,I.touch&&n.on({"touchstart.flipster":function(t){t=t.originalEvent,i=t.touches?t.touches[0].clientX:t.clientX,a=t.touches?t.touches[0].clientY:t.clientY},"touchmove.flipster":function(t){t=t.originalEvent,r=t.touches?t.touches[0].clientX:t.clientX,s=t.touches?t.touches[0].clientY:t.clientY,l=r-i,o=s-a,30<Math.abs(l)&&Math.abs(o)<100&&t.preventDefault()},"touchend.flipster touchcancel.flipster ":function(){l=r-i,o=s-a,30<Math.abs(l)&&Math.abs(o)<100&&y(0<l?"prev":"next")}})}}()})}}(jQuery,window);
\ No newline at end of file
diff --git a/login/Aboe.gif b/login/Aboe.gif
new file mode 100644
index 00000000..f8bb41ee
Binary files /dev/null and b/login/Aboe.gif differ
diff --git a/login/login.css b/login/login.css
new file mode 100644
index 00000000..a2a8385e
--- /dev/null
+++ b/login/login.css
@@ -0,0 +1,321 @@
+@import url("https://fonts.googleapis.com/css2?family=Poppins");
+
+ * {
+   box-sizing: border-box;
+ }
+
+ body {
+   display: flex;
+   background-color: #f6f5f7;
+   justify-content: center;
+   align-items: center;
+   flex-direction: column;
+   font-family: "Poppins", sans-serif;
+   overflow: hidden;
+   height: 100vh;
+   /* width: 100vh; */
+   background: url("Aboe.gif");
+   background-size: cover;
+   /* opacity: 1; */
+   opacity: 1.2;
+
+ }
+
+ h1 {
+   font-weight: 700;
+   letter-spacing: -1.5px;
+   margin: 0;
+   margin-bottom: 15px;
+ }
+
+ h1.title {
+   font-size: 45px;
+   line-height: 45px;
+   margin: 0;
+   text-shadow: 0 0 10px rgba(16, 64, 74, 0.5);
+ }
+
+ p {
+   font-size: 14px;
+   font-weight: 100;
+   line-height: 20px;
+   letter-spacing: 0.5px;
+   margin: 20px 0 30px;
+   text-shadow: 0 0 10px rgba(16, 64, 74, 0.5);
+ }
+
+ span {
+   font-size: 14px;
+   margin-top: 25px;
+ }
+
+ a {
+   color: #333;
+   font-size: 14px;
+   text-decoration: none;
+   margin: 15px 0;
+   transition: 0.3s ease-in-out;
+ }
+
+ a:hover {
+   color: #296543;
+ }
+
+ .content {
+   display: flex;
+   width: 100%;
+   height: 50px;
+   align-items: center;
+   justify-content: space-around;
+ }
+
+ .content .checkbox {
+   display: flex;
+   align-items: center;
+   justify-content: center;
+ }
+
+ .content input {
+   accent-color: #333;
+   width: 12px;
+   height: 12px;
+ }
+
+ .content label {
+   font-size: 14px;
+   user-select: none;
+   padding-left: 5px;
+ }
+
+ button {
+   position: relative;
+   border-radius: 20px;
+   border: 1px solid #296543;
+   background-color: #296543;
+   color: #fff;
+   font-size: 15px;
+   font-weight: 700;
+   margin: 10px;
+   padding: 12px 80px;
+   letter-spacing: 1px;
+   text-transform: capitalize;
+   transition: 0.3s ease-in-out;
+ }
+
+ button:hover {
+   letter-spacing: 3px;
+ }
+
+ button:active {
+   transform: scale(0.95);
+ }
+
+ button:focus {
+   outline: none;
+ }
+
+ button.ghost {
+   background-color: rgba(225, 225, 225, 0.2);
+   border: 2px solid #fff;
+   color: #fff;
+ }
+
+ button.ghost i{
+   position: absolute;
+   opacity: 0;
+   transition: 0.3s ease-in-out;
+ }
+
+ button.ghost i.register{
+   right: 70px;
+ }
+
+ button.ghost i.login{
+   left: 70px;
+ }
+
+ button.ghost:hover i.register{
+   right: 40px;
+   opacity: 1;
+ }
+
+ button.ghost:hover i.login{
+   left: 40px;
+   opacity: 1;
+ }
+
+ form {
+   background-color: #fff;
+   display: flex;
+   align-items: center;
+   justify-content: center;
+   flex-direction: column;
+   padding: 0 50px;
+   height: 100%;
+   text-align: center;
+ }
+
+ input {
+   background-color: #eee;
+   border-radius: 10px;
+   border: none;
+   padding: 12px 15px;
+   margin: 8px 0;
+   width: 100%;
+ }
+
+ .container {
+   background-color: #fff;
+   border-radius: 25px;
+   box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
+   position: relative;
+   overflow: hidden;
+   width: 768px;
+   max-width: 100%;
+   min-height: 500px;
+ }
+
+ .form-container {
+   position: absolute;
+   top: 0;
+   height: 100%;
+   transition: all 0.6s ease-in-out;
+ }
+
+ .login-container {
+   left: 0;
+   width: 50%;
+   z-index: 2;
+ }
+
+ .container.right-panel-active .login-container {
+   transform: translateX(100%);
+ }
+
+ .register-container {
+   left: 0;
+   width: 50%;
+   opacity: 0;
+   z-index: 1;
+ }
+
+ .container.right-panel-active .register-container {
+   transform: translateX(100%);
+   opacity: 1;
+   z-index: 5;
+   animation: show 0.6s;
+ }
+
+ @keyframes show {
+   0%,
+   49.99% {
+     opacity: 0;
+     z-index: 1;
+   }
+
+   50%,
+   100% {
+     opacity: 1;
+     z-index: 5;
+   }
+ }
+
+ .overlay-container {
+   position: absolute;
+   top: 0;
+   left: 50%;
+   width: 50%;
+   height: 100%;
+   overflow: hidden;
+   transition: transform 0.6s ease-in-out;
+   z-index: 100;
+ }
+
+ .container.right-panel-active .overlay-container {
+   transform: translate(-100%);
+ }
+
+ .overlay {
+   background-image: url('Aboe.gif');
+
+   background-repeat: no-repeat;
+   background-size: cover;
+   background-position: 0 0;
+   color: #fff;
+   position: relative;
+   left: -100%;
+   height: 100%;
+   width: 200%;
+   transform: translateX(0);
+   transition: transform 0.6s ease-in-out;
+ }
+
+ .overlay::before {
+   content: "";
+   position: absolute;
+   left: 0;
+   right: 0;
+   top: 0;
+   bottom: 0;
+   background: linear-gradient(
+     to top,
+     rgba(46, 94, 109, 0.4) 40%,
+     rgba(46, 94, 109, 0)
+   );
+ }
+
+ .container.right-panel-active .overlay {
+   transform: translateX(50%);
+ }
+
+ .overlay-panel {
+   position: absolute;
+   display: flex;
+   align-items: center;
+   justify-content: center;
+   flex-direction: column;
+   padding: 0 40px;
+   text-align: center;
+   top: 0;
+   height: 100%;
+   width: 50%;
+   transform: translateX(0);
+   transition: transform 0.6s ease-in-out;
+ }
+
+ .overlay-left {
+   transform: translateX(-20%);
+ }
+
+ .container.right-panel-active .overlay-left {
+   transform: translateX(0);
+ }
+
+ .overlay-right {
+   right: 0;
+   transform: translateX(0);
+ }
+
+ .container.right-panel-active .overlay-right {
+   transform: translateX(20%);
+ }
+
+ .social-container {
+   margin: 20px 0;
+ }
+
+ .social-container a {
+   border: 1px solid #dddddd;
+   border-radius: 50%;
+   display: inline-flex;
+   justify-content: center;
+   align-items: center;
+   margin: 0 5px;
+   height: 40px;
+   width: 40px;
+   transition: 0.3s ease-in-out;
+ }
+
+ .social-container a:hover {
+   border: 1px solid #296543;
+ }
\ No newline at end of file
diff --git a/login/script.js b/login/script.js
new file mode 100644
index 00000000..b4859504
--- /dev/null
+++ b/login/script.js
@@ -0,0 +1,11 @@
+const registerButton = document.getElementById("register");
+ const loginButton = document.getElementById("login");
+ const container = document.getElementById("container");
+
+ registerButton.addEventListener("click", () => {
+   container.classList.add("right-panel-active");
+ });
+
+ loginButton.addEventListener("click", () => {
+   container.classList.remove("right-panel-active");
+ });
\ No newline at end of file
diff --git a/loginPage.html b/loginPage.html
index 741b6e1e..d9542c98 100644
--- a/loginPage.html
+++ b/loginPage.html
@@ -17,9 +17,9 @@
             <div class="content">
                 <h1>Welcome Back !</h1>
                 <p>Login with your personal information.</p>
-                 <form action="">
-                   <input type="email" name="" id="" placeholder="Email">
-                    <input type="password" name="" id="" placeholder="Password">
+                 <form action="" id="loginForm">
+                   <input type="email" name="email" id="email" placeholder="Email" >
+                    <input type="password" name="password" id="password" placeholder="Password">
                     <button type="submit" >Login</button>
                 </form>
                  <div class="passForget">Forgot your password?</div>
@@ -29,5 +29,31 @@ <h1>Welcome Back !</h1>
            </div>
 
      </div>
+
+     <script>
+
+        document.getElementById('loginForm').addEventListener('submit', function(event) {
+            event.preventDefault();
+
+            var email = document.getElementById('email').value;
+            var password = document.getElementById('password').value;
+            
+            if (email.trim() === '' || password.trim() === '') {
+                localStorage.setItem('isLoggedIn', 'true'); 
+                alert('Please fill out all fields.');
+            } else {
+                var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
+                if (!emailPattern.test(email)) {
+                    localStorage.setItem('isLoggedIn', 'true'); 
+                    alert('Please enter a valid email!');
+                } else {
+                    localStorage.setItem('isLoggedIn', 'true'); 
+                    alert('Login successful!');
+                    window.location.href = './index.html';
+                }
+            }
+        });
+
+     </script>
 </body>
 </html>
\ No newline at end of file
diff --git a/newLogin.html b/newLogin.html
index afbdfdff..4f730cc1 100644
--- a/newLogin.html
+++ b/newLogin.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!-- <!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
@@ -253,4 +253,96 @@ <h1>Create Account</h1>
         });
     </script>
   </body>
-</html>
+</html> -->
+
+
+
+<!DOCTYPE html>
+ <html lang="en">
+ <head>
+   <meta charset="UTF-8">
+   <meta http-equiv="X-UA-Compatible" content="IE=edge">
+   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+   <title>TOUR GUIDE</title>
+   <link rel="icon" type="image/x-icon" href="log/favicon.ico">
+   <link href="https://cdn.lineicons.com/4.0/lineicons.css" rel="stylesheet" />
+   <link rel="stylesheet" href="/login/login.css">
+ </head>
+ <body>
+   <div class="container" id="container">
+
+     <div class="form-container register-container">
+       <form action="#">
+         <h1>TOUR GUIDE </h1>
+         <input type="text" placeholder="Name">
+         <input type="email" placeholder="Email">
+         <input type="password" placeholder="Password">
+         <input type="password" placeholder="Confirm Password">
+         <button onclick="refreshPage()">Register</button>
+         <script>
+           function refreshPage() {
+             location.reload();
+           }
+         </script>
+         <span>or use your account</span>
+         <div class="social-container">
+           <a href="" class="social"><i class="lni lni-facebook-fill"></i></a>
+           <a href="https://accounts.google.com/v3/signin/identifier?ifkv=ASKXGp3o7JbWY-Xl_hjXMSHncDJR5Bg1tJjR-AcPnUkBcdPTNTLi-oYd-rV3dgIaufZcXA-T1n6HuQ&flowName=GlifWebSignIn&flowEntry=ServiceLogin&dsh=S604814220%3A1705302051981588&theme=glif" target="_blank"><i class="lni lni-google"></i></a>
+           <a href="" class="social"><i class="lni lni-linkedin-original"></i></a>
+           <a href="" class="social">
+             <i class="lni lni-github"></i></a>
+         </div>
+       </form>
+     </div>
+
+     <div class="form-container login-container">
+       <form action="#">
+         <h1>TOUR GUIDE</h1>
+         <input type="email" placeholder="Email">
+         <input type="password" placeholder="Password">
+         <div class="content">
+           <div class="checkbox">
+             <input type="checkbox" name="checkbox" id="checkbox">
+             <label>Remember me</label>
+           </div>
+           <div class="pass-link">
+             <a href="#">Forgot password?</a>
+           </div>
+         </div>
+         <a href="index.html"><button>Login</button></a>
+         <span>or use your account</span>
+         <div class="social-container">
+           <a href="" class="social"><i class="lni lni-facebook-fill"></i></a>
+             <a href="https://accounts.google.com/v3/signin/identifier?ifkv=ASKXGp3o7JbWY-Xl_hjXMSHncDJR5Bg1tJjR-AcPnUkBcdPTNTLi-oYd-rV3dgIaufZcXA-T1n6HuQ&flowName=GlifWebSignIn&flowEntry=ServiceLogin&dsh=S604814220%3A1705302051981588&theme=glif" target="_blank"><i class="lni lni-google"></i></a>
+           <a href="" class="social"><i class="lni lni-linkedin-original"></i></a>
+           <a href="" class="social">
+             <i class="lni lni-github"></i></a>
+         </div>
+       </form>
+     </div>
+
+     <div class="overlay-container">
+       <div class="overlay">
+         <div class="overlay-panel overlay-left">
+           <h1 class="title">Welcome <br> Back!</h1>
+           <p>if Yout have an account, login here and have fun</p>
+           <button class="ghost" id="login">Login
+             <i class="lni lni-arrow-left login"></i>
+           </button>
+         </div>
+         <div class="overlay-panel overlay-right">
+           <h1 class="title">Start your <br> journy now</h1>
+           <p>if you don't have an account yet, join us and start your journey.</p>
+           <button class="ghost" id="register">Register
+             <i class="lni lni-arrow-right register"></i>
+           </button>
+         </div>
+       </div>
+     </div>
+
+   </div>
+
+   <script src="login/script.js"></script>
+
+ </body>
+ </html>
\ No newline at end of file
diff --git a/payment.html b/payment.html
index 88427c3b..f64cea81 100644
--- a/payment.html
+++ b/payment.html
@@ -14,27 +14,12 @@
 <body>
   <div class="nav-container" id="top">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <a href="#" class="nav__logo" data-aos="fade-right" style="margin-left: -200px">Tourguide<span>.</span></a>
 
-      <ul class="navLinks">
-
-
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#Home">Home</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#AboutUs"> AboutUs</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#Destinations">Destinations</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#trip">Pricing</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#ReviewGallery">Trip Gallery</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#testimonials">Testimonials</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="feedback.html">Rate Us?</a></li>
-        <li onclick="closeNav()" class="link" data-aos=""><a href="#contact">Contact Us</a></li>
-
-
-      </ul>
-      <a href="newLogin.html" class="contact-btn"><button class="btn" id="btn-style"
-          style="margin: 0; box-shadow:1.5px 1.5px 6px red;" data-aos="fade-down">Login</button></a>
-      <div class="toggle-container" data-aos="fade-down">
-        <input id="themeToggle" class="toggle" type="checkbox">
-      </div>
+    
+      <a href="index.html" class="contact-btn" style="margin-right: -170px;"><button class="btn" id="btn-style"
+          style="margin:0; box-shadow:1.5px 1.5px 6px red;" data-aos="fade-down">Go to Home</button></a>
+      
       <div class="hamburger" data-aos="fade-down">
         <div class="line"></div>
         <div class="line"></div>
@@ -47,7 +32,7 @@
     <main>
       <div class="py-5 text-center">
         
-        <h2>Checkout form</h2>
+        <h2>Checkout</h2>
       </div>
 
       <div class="row g-5">
diff --git a/story.html b/story.html
index 73404690..64670405 100644
--- a/story.html
+++ b/story.html
@@ -105,12 +105,14 @@ <h4>Support</h4>
           </div>
         </div>
         <div class="footer__col">
+          <div class="footer__area">
           <h4>Address</h4>
           <p>
             <span>Address:</span> 3/2 Wellington Street, Kolkata , West Bengal , India 
           </p>
-          <p><span>Email:</span> tour@tourguide.com</p>
-          <p><span>Phone:</span> +91 8562145852</p>
+          <p><span>Email:</span><a href="mailto:tour@tourguide.com">tour@tourguide.com</a></p>
+          <p><span>Phone:</span><a href="tel:8562145852">+91 8562145852</a></p>
+        </div>
         </div>
       </div>
       <div class="footer__bar">
diff --git a/styles.css b/styles.css
index f1922165..8da19b47 100644
--- a/styles.css
+++ b/styles.css
@@ -1049,15 +1049,10 @@ header {
   background-color: var(--primary-color);
 }
 
-.gallary {
-  /* border: 2px solid green; */
-  width: var(--max-width);
-}
-
 .gallary__container {
   display: flex;
   background-color: var(--secondary-color);
-  width: var(--max-width);
+  width: 80%;
   justify-content: center;
   align-items: center;
   gap: 4rem;
@@ -1201,17 +1196,18 @@ body.dark-theme #emailInput {
 
 .footer__container {
   display: flex;
+  flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-evenly;
   align-items: flex-start;
-
-  /* /grid-template-columns: repeat(3, 1fr);/ gap: 24px; */
-
+  grid-template-columns: repeat(3, 1fr);
+  gap: 24px;
   color: var(--secondary-color);
 }
 
 .footer__col {
   flex: 1;
+  display: flex ;
   max-width: 200px;
   margin: 10px;
   text-align: center;
@@ -1222,6 +1218,7 @@ body.dark-theme #emailInput {
   padding: 10px;
 }
 
+
 .social-icon a:hover {
   transform: scale(1.1);
   color: white; 
@@ -1229,9 +1226,9 @@ body.dark-theme #emailInput {
 .footer:hover{
   background: linear-gradient(135deg, #654ea3, #eaafc8);
 }
-.footer__col:nth-child(2) {
-  margin-top: 10px;
-}
+
+
+
 
 .footer__col h3 {
   font-size: 1.5rem;
@@ -1243,13 +1240,22 @@ body.dark-theme #emailInput {
   color: var(--primary-color);
 }
 
-.footer__col p {
+/*.footer__col p {
   font-size: 0.8rem;
   cursor: pointer;
   transition: 0.3s;
 }
+*/
 
-.footer__col p:hover {
+.footer__link{
+  font-size: 1rem;
+  cursor: pointer;
+  transition: 0.3s;
+  color: white;
+}
+
+
+.footer__link:hover {
   color: #ff0000;
   font-size: 13px;
   overflow: hidden;
@@ -1260,9 +1266,9 @@ body.dark-theme #emailInput {
 }
 
 .footer__col h4 {
-  font-size: 1rem;
+  font-size: 1.5rem;
   font-weight: 600;
-  margin-bottom: 10px;
+  margin-bottom: 15px;
 }
 
 .footer__bar {
@@ -1544,6 +1550,26 @@ body.dark-theme #emailInput {
   width: 50%;
 }
 
+
+.icon1{
+  position:absolute;
+  top:calc(65%);           
+  left:26.4%;
+  color:grey;
+  }
+  .icon2{
+  position:absolute;
+  top:calc(33%);
+  left:26.4%;
+  color:grey;
+  }
+  .icon3{
+  position:absolute;
+  top:calc(30%);
+  left:26.4%;
+  color:grey;
+  }
+
 textarea::-webkit-scrollbar {
   width: 1em;
 }
@@ -1604,8 +1630,18 @@ textarea::-webkit-scrollbar {
   .contact-form textarea {
     width: 75%;
   }
+  .icon1{
+    left:14.8%;
+  }
+  .icon2{
+    left:14.8%;
+  }
+  .icon3{
+    left:14.8%;
+  }
 }
 
+
 @media (max-width: 700px) {
   .items {
     display: flex;
@@ -1628,6 +1664,15 @@ textarea::-webkit-scrollbar {
   .contact-form h1 {
     display: none;
   }
+  .icon1{
+    left:14.8%;
+  }
+  .icon2{
+    left:14.8%;
+  }
+  .icon3{
+    left:14.8%;
+  }
 }
 
 .contact-form input,
@@ -1659,6 +1704,15 @@ textarea::-webkit-scrollbar {
     width: 75%;
     color: var(--text-dark);
   }
+  .icon1{
+    left:14.8%;
+  }
+  .icon2{
+    left:14.8%;
+  }
+  .icon3{
+    left:14.8%;
+  }
 }
 
 @media (max-width: 700px) {
@@ -1668,6 +1722,15 @@ textarea::-webkit-scrollbar {
     width: 75%;
     color: var(--text-dark);
   }
+  .icon1{
+    left:14.8%;
+  }
+  .icon2{
+    left:14.8%;
+  }
+  .icon3{
+    left:14.8%;
+  }
 }
 
 /* Custom scrollbar for WebKit browsers */