Add Footer in Terms of use page done ! #1076

terms.html

@@ -8,6 +8,113 @@
     <link rel="stylesheet" href="styles.css">
     <link rel="stylesheet" href="footer.css"> 
     <style>
+
+        /* General Footer Styling */
+  .footer-container {
+    background-color: #1f2937;
+    color: #ffffff;
+    padding: 40px 0;
+    font-family: Arial, sans-serif;
+  }
+
+  /* Logo and Tagline */
+  .footer-logo-section {
+    text-align: center;
+    margin-bottom: 30px;
+  }
+  .footer-logo {
+    max-width: 150px;
+    margin-bottom: 10px;
+    border-radius: 50px;
+  }
+  .footer-logo-section p {
+    margin: 5px 0;
+    font-size: 0.95rem;
+  }
+  .follow-us {
+    margin-top: 10px;
+    font-weight: bold;
+  }
+
+  /* Social Media Icons */
+  .social-icons a {
+    display: inline-block;
+    margin: 0 10px;
+    color: #12e9cc;
+    font-size: 1.5rem;
+    text-decoration: none;
+  }
+  .social-icons a:hover {
+    color: #76b2ab;
+  }
+
+  /* Footer Link Sections */
+  .footer-links {
+    display: flex;
+    justify-content: space-around;
+    flex-wrap: wrap;
+    margin: 20px 100px;
+  }
+  .footer-column {
+    flex-basis: 20%;
+    margin-bottom: 10px;
+  }
+  .footer-column h4 {
+    font-size: 1rem;
+    margin-bottom: 10px;
+    color: #12e9cc;
+  }
+  .footer-column ul {
+    list-style: none;
+    padding: 0;
+  }
+  .footer-column ul li {
+    margin-bottom: 8px;
+  }
+  .footer-column ul li a {
+    color: #ffffff;
+    text-decoration: none;
+    font-size: 0.95rem;
+  }
+  .footer-column ul li a:hover {
+    text-decoration: underline;
+  }
+
+  /* Footer Bottom Links */
+  .footer-bottom {
+    text-align: center;
+    border-top: 1px solid #ddd;
+    padding-top: 20px;
+  }
+  .footer-bottom ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+  }
+  .footer-bottom ul li {
+    display: inline-block;
+    margin: 0 15px;
+  }
+  .footer-bottom ul li a {
+    color: #12e9cc;
+    text-decoration: none;
+    font-size: 0.95rem;
+  }
+  .footer-bottom ul li a:hover {
+    text-decoration: underline;
+  }
+
+  /* Responsive Adjustments */
+  @media (max-width: 768px) {
+    .footer-links {
+      flex-direction: column;
+      align-items: center;
+    }
+    .footer-column {
+      flex-basis: 100%;
+      text-align: center;
+    }
+  }
         /* General styling */
         * { margin: 0; padding: 0; box-sizing: border-box; }
         body {
@@ -201,5 +308,79 @@ <h2 id="section11">10. Contact Us</h2>
             <p>For any questions or concerns regarding these Terms of Use or any other aspect of Ticket Booking, please contact our support team at [email protected]. We are here to address your concerns and ensure that you have a positive experience with our platform.</p>
         </div>
     </div>
+
+<footer class="footer-container">
+      <div class="footer-top">
+
+        <div class="footer-logo-section">
+          <a href="#"> <img src="./images/3.jpeg" alt="easyJet holidays logo" class="footer-logo"></a>
+          <p style="color: #b5fdf4;" >Affordable adventures, unforgettable memories—explore with ease.</p>
+          <p style="color: #dcfffa;" class="follow-us">FOLLOW US ON HERE:</p>
+          <div class="social-icons">
+            <a href="https://www.facebook.com"><i class="fab fa-facebook"></i></a>
+            <a href="https://www.instagram.com"><i class="fab fa-instagram"></i></a>
+            <a href="https://www.twitter.com" ><i class="fab fa-twitter"></i></a>
+            <a href="https://www.linkedin.com"><i class="fab fa-linkedin"></i></a>
+            <a href="https://www.youtube.com"><i class="fab fa-youtube"></i></a>
+          </div>
+        </div>
+
+
+        <div class="footer-links">
+          <div class="footer-column">
+            <h4>HELPFUL LINKS</h4>
+            <ul>
+              <li><a href="help.html">Help Centre</a></li>
+              <li><a href="#">Special Assistance</a></li>
+              <li><a href="#">Download The App</a></li>
+              <li><a href="book_condition.html">Booking Conditions</a></li>
+            </ul>
+          </div>
+
+          <div class="footer-column">
+            <h4>ABOUT US</h4>
+            <ul>
+              <li><a href="#">Media Center</a></li>
+              <li><a href="#">Investors</a></li>
+              <li><a href="ModernSlaveryAct.html">Modern Slavery Act</a></li>
+
+              <li><a href="terms.html">Terms Of Use</a></li>
+            </ul>
+          </div>
+
+          <div class="footer-column">
+            <h4>KEEPING SAFE</h4>
+            <ul>
+              <li><a href="#">ATOL Protected</a></li>
+              <li><a href="travelAware.html">Travel Aware</a></li>
+              <li><a href="fcdoTravel.html">FCDO Travel Advice</a></li>
+              <li><a href="#">ABTA</a></li>
+            </ul>
+          </div>
+
+          <div class="footer-column">
+            <h4>FIND US</h4>
+            <ul>
+              <li><a href="contact.html">Contact Us</a></li>
+              <li><a href="GroupCookieNotice.html">Group Cookie Notice</a></li>
+              <li><a href="privacy.html">Privacy And Policy</a></li>
+              <li><a href="sitemap.html">Sitemap</a></li>
+            </ul>
+          </div>
+        </div>
+      </div>
+
+
+      <div class="footer-bottom">
+        <ul>
+          <li><a href="#">Holiday Type</a></li>
+          <li><a href="#">Holiday Deals</a></li>
+          <li><a href="#">Popular Counters</a></li>
+          <!-- <li><a href="#">Flight Only</a></li> -->
+          <li><a href="#">Top Hotels</a></li>
+        </ul>
+      </div>
+    </footer>
+
 </body>
 </html>