diff --git a/Ticket-Booking-main1/about.css b/Ticket-Booking-main1/about.css
deleted file mode 100644
index e4c2739..0000000
--- a/Ticket-Booking-main1/about.css
+++ /dev/null
@@ -1,259 +0,0 @@
-* {
-    box-sizing: border-box;
-  }
-  .section__header{
-    text-align: center;
-  }
-  
-  .outer-box {
-    font-family: Verdana, Geneva, Tahoma, sans-serif;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    overflow: hidden;
-    margin: 0;
-    
-  }
-  
-  .container {
-    display: flex;
-    width: 60vw;
-    gap: 30px;
-    margin-top: 0;
-}
-  
-
-  .card {
-    background-color: #366675;
-    background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 2.5) 4%, rgba(255, 255, 255, 0) 30%);
-    height: 83vh;
-    border-radius: 35px 35px;
-    color: #fff;
-    cursor: pointer;
-    flex: 0.5;
-    margin: 5px;
-    position: relative;
-    transition: flex 0.3s ease-in;
-    display: flex;
-    flex-direction: column;
-    align-items: center; /* Center items horizontally */
-    justify-content: center; /* Center items vertically */
-    border: 2px solid rgb(87, 159, 147);
-}
-
-.card .pic {
-    width: 30%; /* Adjust this percentage as needed */
-    height: auto; /* Maintain aspect ratio */
-    visibility: hidden; /* Hide initially; show on active */
-    display: block; /* Ensure it's treated as a block element */
-    margin: 0 auto; /* Center horizontally */
-    transform: translateY(-50px); /* Move upwards (adjust the value as needed) */
-}
-
-
-  
-  
-  .info {
-    position: absolute;
-    bottom: 20px;
-    left: 20%;
-    visibility: hidden;
-    background: rgba(221, 206, 216, 0.462);
-    backdrop-filter:blur(4px);
-    width: 400px;
-    border: 2px solid goldenrod;
-    border-radius: 15px 15px;
-    padding-left: 15px;
-  }
-  
-  .card h3 {
-    font-size: 24px;
-    opacity: 0;
-    color: black !important;
-    font-family:Georgia, 'Times New Roman', Times, serif ;
-    font-weight: bolder;
-    
-  }
-  
-  .card p {
-    font-size: 16px;
-    opacity: 0;
-    color:black !important;
-    margin-top: 10px;
-    font-weight: 500;
-    
-  }
-  
-  .card.active {
-    flex: 6;
-    
-  }
-  
-  .card.active h3 {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-  }
-  
-  .card.active p {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-  }
-  
-  .card.active .info {
-    visibility: visible;
-  }
-  .card.active .pic{
-    visibility: visible;
-    
-  }
-  
-
-.hedd {
-    
-    font-size: 1.2rem;
-    font-weight: 600;
-    display: block;
-    writing-mode: vertical-rl;
-    text-orientation: upright;
-    position: absolute;
-    top: 50%;
-    left: 90%;
-    transform: translate(-98%, -50%);
-    white-space: nowrap;
-    visibility: visible;
-    
-    z-index: 1; /* Ensure it appears above the card */
-}
-
-
-h4{
-    /* color: whitesmoke !important; */
-    margin-left: 28px;
-    font-size: 18px;
-    max-width: 50px;
-}
-
-  .card.active .hedd{
-    visibility: hidden;
-  }
-
-
-
-
- /* Media Queries */
- @media (max-width: 1230px) {
-    .outer-box{
-        margin-top: 0;
-        padding-top: 0;
-        height: 150vh;
-    }
-    .container {
-        display: flex;
-        flex-direction: column; /* Stack cards vertically for medium screens */
-        height: 150px; /* Allow dynamic height */
-        gap: 20px; /* Adjusted gap */
-        margin-top: 0;
-    }
-.card{
-    height: 10vh ;
-    margin-top: 0;
-    padding-top: 0;
-}
-.card.active{
-    height: 30vh;
-}
-    .info {
-        left: 5%; /* Adjusted left positioning */
-        width: 50%; /* Adjust width for medium screens */
-    }
-
-    .card h3 {
-        font-size: 20px; /* Reduced font size for medium screens */
-        text-align: center;
-    }
-
-    .card p {
-        font-size: 14px; /* Reduced font size for medium screens */
-        text-align: center;
-    }
-    h4{
-        /* writing-mode: sideways-lr;
-        text-orientation: sideways-right;
-        rotate: -90deg;
-        text-align: center; */
-
-    }
-
-    
-}
-
-@media (max-width: 620px) {
-    .container {
-        height: 200px;
-        flex-direction: column; /* Align cards in a row for smaller screens */
-        justify-content: center; /* Center items */
-        
-    }
-
-    .card {
-        width: 90%; /* Make cards take full width on small screens */
-        height: auto; /* Allow dynamic height */
-    }
-
-    .card .pic {
-        width: 40%; /* Reduced image size for smaller screens */
-    }
-
-    .info {
-        width: 90%; /* Adjust info width for small screens */
-        height: 100%;
-        left: 5%; /* Adjust left positioning for smaller screens */
-        height: 90%;
-    }
-    .info p{
-        font-size: 10px;
-        margin-bottom: 5px;
-    }
-
-    h4 {
-        font-size: 1rem; 
-        writing-mode: sideways-lr;
-    }
-}
-
-@media (max-width: 480px) {
-    .container{
-        flex-direction: column;
-    }
-    .card {
-        
-        width: 70vw;
-    }
-
-    .info {
-        bottom: 10px; /* Adjusted bottom positioning */
-    }
-
-    .card h3 {
-        font-size: 16px; /* Further reduced font size */
-    }
-
-    .card p {
-        font-size: 8px; /* Further reduced font size */
-    }
-
-    .hedd {
-        font-size: 0.1rem; /* Adjusted size for very small screens */
-        top: 0; /* Align to the top */
-        writing-mode: sideways-lr;
-    }
-}
-
-@media (max-width: 280px) {
-    .info {
-        width: 80px; /* Adjusted width for very small screens */
-        left: 0px; /* Adjusted left positioning */
-    }
-}
-  
\ No newline at end of file
diff --git a/Ticket-Booking-main1/about.html b/Ticket-Booking-main1/about.html
deleted file mode 100644
index 87f803e..0000000
--- a/Ticket-Booking-main1/about.html
+++ /dev/null
@@ -1,95 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="shortcut icon" href="images/logoNw.png" type="image/x-icon">
-
-    <title>About Us</title>
-    <style>
-
-body {
-            font-family: 'Poppins', sans-serif;
-            margin: 0;
-            padding: 0;
-            background-color: #f0f4f8;
-        }
-
-        .feed {
-            max-width: 800px;
-            margin: 50px auto;
-            background-color: #fff;
-            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-            border-radius: 12px;
-            overflow: hidden;
-            padding: 20px;
-            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-
-        }
-
-        .feed h2 {
-            text-align: center;
-            color: #1f2937;
-            font-size: 35px;
-            text-decoration:underline;
-        }
-
-        .feed p {
-            font-size: 16px;
-            color: #555;
-            line-height: 1.6;
-        }
-
-        .feed p:last-child {
-            margin-bottom: 0;
-        }
-
-        .button-container {
-            text-align: center;
-            margin-top: -20px;
-        }
-
-        .button-container a {
-            margin-bottom: 20px;
-            display: inline-block;
-            padding: 10px 20px;
-            background-color: #00bfa6;
-            color: white;
-            text-decoration: none;
-            border-radius: 5px;
-            font-size: 16px;
-            transition: background-color 0.3s ease;
-        }
-
-        .button-container a:hover {
-            background-color: #00a690;
-        }
-
-        @media (max-width: 768px) {
-            .feed {
-                padding: 15px;
-            }
-        }
-    
-    </style>
-
-
-</head>
-<body>
-    <section class="feed">
-        <h2><img src="https://cdn-icons-png.flaticon.com/128/108/108153.png" alt="icon" style="width: 40px; height: 40px ;margin-bottom:-9px ; margin-right: 10px;">About Us</h2>
-
-        <p>Welcome to <strong>Ticket-Booking</strong>, your trusted partner for hassle-free experience ticket booking experiences. Seamlessly booking for Bus or Train we make it easy and convenient to book your tickets in just a few clicks.</p>
-        <p>Founded with ensolving the ambiguities and uncertainity everyone faces while a booking a Bus or Train. Our user-friendly interface, secure payment gateway, and real-time availability ensure a hassle-free experience every time.</p>
-        <p>At <strong>Ticket-Booking</strong>, we believe in making your journey from booking to enjoyment as smooth as possible. Our dedicated customer support team is always ready to assist you, ensuring that your ticketing experience is nothing short of exceptional.</p>
-        <p>Thank you for choosing <strong>Ticket-Booking</strong> we are always here to server before you. Let's make memories together one ticket at a time!</p>
-
-
-    </section>
-
-    <div class="button-container">
-        <a href="index.html">Back to Home</a>
-    </div>
-    
-</body>
-</html>
\ No newline at end of file
diff --git a/Ticket-Booking-main1/about.js b/Ticket-Booking-main1/about.js
deleted file mode 100644
index 0696b13..0000000
--- a/Ticket-Booking-main1/about.js
+++ /dev/null
@@ -1,11 +0,0 @@
-const cards = document.querySelectorAll('.card');
-
-cards.forEach(card => {
-    card.addEventListener('click', () => {
-        cards.forEach(c => {
-            c.classList.remove('active');
-        });
-      
-        card.classList.add('active');
-    });
-});
\ No newline at end of file
diff --git a/Ticket-Booking-main1/index.css b/Ticket-Booking-main1/index.css
index f94628c..d4f03ec 100644
--- a/Ticket-Booking-main1/index.css
+++ b/Ticket-Booking-main1/index.css
@@ -199,22 +199,6 @@ iframe {
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
 }
 
-.about h2,
-.contact h2 {
-  text-align: center;
-  color: #1f2937;
-  font-size: 2.5rem;
-  margin-bottom: 20px;
-}
-
-.about p,
-.contact p {
-  text-align: center;
-  color: #555;
-  font-size: 1.1rem;
-  line-height: 1.6;
-}
-
 footer {
   background-color: #1f2937;
   color: white;
diff --git a/Ticket-Booking-main1/styles.css b/Ticket-Booking-main1/styles.css
index cdc4488..fa8fcf4 100644
--- a/Ticket-Booking-main1/styles.css
+++ b/Ticket-Booking-main1/styles.css
@@ -835,31 +835,6 @@ iframe {
     gap: 2.5rem;
 }
 
-.about,
-.contact {
-    padding: 40px 20px;
-    background-color: #f9f9f9;
-    margin: 20px auto;
-    border-radius: 12px;
-    max-width: 1200px;
-    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-}
-
-.about h2,
-.contact h2 {
-    text-align: center;
-    color: #1f2937;
-    font-size: 2.5rem;
-    margin-bottom: 20px;
-}
-
-.about p,
-.contact p {
-    text-align: center;
-    color: #555;
-    font-size: 1.1rem;
-    line-height: 1.6;
-}
 
 
 footer {
diff --git a/about.css b/about.css
deleted file mode 100644
index 180b211..0000000
--- a/about.css
+++ /dev/null
@@ -1,281 +0,0 @@
-* {
-    box-sizing: border-box;
-}
-
-.section__header {
-    text-align: center;
-}
-
-.outer-box {
-    font-family: Verdana, Geneva, Tahoma, sans-serif;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    overflow: hidden;
-    margin: 0;
-}
-
-.card {
-    background-color: #366675;
-    background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 30%);
-    height: 50vh;
-    border-radius: 35px;
-    color: #fff;
-    cursor: pointer;
-    flex: 0.5;
-    margin: 10px;
-    position: relative;
-    transition: flex 0.7s ease-in;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    border: 2px solid rgb(87, 159, 147);
-}
-
-.card .pic {
-    width: 30%;
-    height: auto;
-    visibility: hidden; /* Hide initially; show on active */
-    display: block;
-    margin: 0 auto; /* Center horizontally */
-    transform: translateY(-50px); /* Move upwards (adjust the value as needed) */
-}
-
-.info {
-    position: absolute;
-    bottom: 20px;
-    left: 20%;
-    visibility: hidden;
-    background: rgba(221, 206, 216, 0.462);
-    backdrop-filter: blur(4px);
-    width: 400px;
-    border: 2px solid goldenrod;
-    border-radius: 15px;
-    padding-left: 15px;
-}
-
-.card h3 {
-    font-size: 24px;
-    opacity: 0;
-    color: black !important;
-    font-family: Georgia, 'Times New Roman', Times, serif;
-    font-weight: bolder;
-}
-
-.card p {
-    font-size: 16px;
-    opacity: 0;
-    color: black !important;
-    margin-top: 10px;
-    font-weight: 500;
-}
-
-.card.active {
-    flex: 6;
-}
-
-.card.active h3,
-.card.active p {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-}
-
-.card.active .info,
-.card.active .pic {
-    visibility: visible;
-}
-
-@media (min-width: 1240px) {
-    .hedd {
-        font-size: 1.2rem;
-        font-weight: 600;
-        display: block;
-        writing-mode: vertical-rl;
-        text-orientation: upright;
-        position: absolute;
-        top: 50%;
-        left: 90%;
-        transform: translate(-98%, -50%);
-        white-space: nowrap;
-        visibility: visible;
-        z-index: 1;
-    }
-}
-
-.card.active .hedd {
-    visibility: hidden;
-}
-
-/* Media Queries */
-@media (max-width: 1230px) {
-    .outer-box {
-        margin-top: 0;
-        padding-top: 0;
-        height: auto;
-    }
-
-    .container {
-        display: flex;
-        flex-direction: column;
-        gap: 20px;
-        margin-top: 0;
-    }
-
-    .card {
-        width: 80%;
-        height: 15vh;
-        margin: 10px auto;
-        padding: 10px;
-    }
-
-    .card.active {
-        height: 35vh;
-    }
-
-    .info {
-        left: 10%;
-        width: 80%;
-        bottom: 20px;
-    }
-
-    .card h3 {
-        font-size: 22px;
-        text-align: center;
-    }
-
-    .card p {
-        font-size: 14px;
-        text-align: center;
-    }
-
-    .hedd {
-        font-size: 1.2rem;
-        writing-mode: horizontal-tb;
-        margin-bottom: 10px;
-    }
-}
-
-@media (max-width: 620px) {
-    .container {
-        height: auto;
-        flex-direction: column;
-        justify-content: center;
-    }
-
-    .card {
-        width: 90%;
-        height: auto;
-        margin: 10px auto;
-    }
-
-    .card .pic {
-        width: 50%;
-    }
-
-    .info {
-        width: 90%;
-        left: 5%;
-        padding: 15px;
-    }
-
-    .info p {
-        font-size: 12px;
-    }
-
-    .hedd {
-        font-size: 1rem;
-        writing-mode: horizontal-tb;
-        text-align: center;
-        margin-bottom: 10px;
-    }
-}
-
-@media (max-width: 480px) {
-    .container {
-        flex-direction: column;
-        align-items: center;
-        width: 100vw;
-        padding: 0;
-    }
-
-    .card {
-        width: 90vw;
-        margin: 10px auto;
-        height: auto;
-        padding: 15px;
-        box-sizing: border-box;
-    }
-
-    .card.active {
-        height: auto;
-        padding: 20px;
-    }
-
-    .info {
-        width: 85vw;
-        padding: 15px;
-        bottom: 10px;
-        left: 0;
-        right: 0;
-        margin: 0 auto;
-        height: auto;
-        text-align: center;
-        overflow: hidden;
-    }
-
-    .info p {
-        font-size: 12px;
-        margin: 5px 0;
-    }
-
-    .card h3 {
-        font-size: 20px;
-        margin-bottom: 10px;
-    }
-
-    .card p {
-        font-size: 14px;
-    }
-
-    .hedd {
-        font-size: 1rem;
-        text-align: center;
-        margin: 10px 0;
-    }
-
-    .card .pic {
-        width: 50%;
-        margin: 10px auto;
-        display: block;
-    }
-
-    .outer-box {
-        width: 100vw;
-        overflow-x: hidden;
-    }
-}
-
-@media (max-width: 280px) {
-    .container {
-        width: 100%;
-        padding: 0;
-    }
-
-    .card {
-        width: 100%;
-        margin: 5px 0;
-    }
-
-    .info {
-        width: 100%;
-        left: 0;
-        padding: 5px;
-    }
-
-    .hedd {
-        font-size: 0.8rem;
-        writing-mode: horizontal-tb;
-    }
-}
diff --git a/about.html b/about.html
deleted file mode 100644
index 5fc7bdd..0000000
--- a/about.html
+++ /dev/null
@@ -1,123 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="shortcut icon" href="images/4.jpeg" type="image/x-icon">
-    <title>About Us</title>
-    <style>
-        body {
-            font-family: 'Poppins', sans-serif;
-            margin: 0;
-            padding: 0;
-            display: flex; /* Use flexbox for the body */
-            height: 100vh; /* Full viewport height */
-            color: #fff; /* Text color */
-        }
-
-        .background {
-            flex: 1; /* Left column takes 50% of the width */
-            background: url("images/4.jpeg") no-repeat center center; 
-            background-size: cover; /* Cover the left column */
-        }
-
-        .content {
-            flex: 1; /* Right column takes 50% of the width */
-            display: flex;
-            flex-direction: column;
-            justify-content: center; /* Center content vertically */
-            align-items: center; /* Center content horizontally */
-            background-color: rgba(18, 6, 61, 0.8); /* Darkened background */
-            padding: 60px; /* Padding around content */
-            border-radius: 12px; /* Rounded corners */
-            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5); /* Soft shadow */
-            transition: transform 0.3s ease; /* Hover effect */
-        }
-
-        .content:hover {
-            transform: translateY(-5px); /* Lift effect on hover */
-        }
-
-        .content h2 {
-            text-align: center;
-            color: #35e196; /* Header color */
-            font-size: 36px;
-            text-decoration: underline;
-            margin-bottom: 20px;
-        }
-
-        .content p {
-            font-size: 18px;
-            color: #f0f0f0; /* Light text color */
-            line-height: 1.8; /* Increased line height for readability */
-            margin-bottom: 15px;
-            padding: 0 20px; /* More padding for better spacing */
-            text-align: justify; /* Justify text for cleaner look */
-        }
-
-        .button-container {
-            text-align: center;
-            margin-top: 30px;
-        }
-
-        .button-container a {
-            margin: 10px;
-            display: inline-block;
-            padding: 12px 25px;
-            background-color: #35e196; /* Button color */
-            color: #333; /* Button text color */
-            text-decoration: none;
-            border-radius: 5px;
-            font-size: 18px;
-            transition: background-color 0.3s ease, transform 0.3s ease;
-            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); /* Soft shadow */
-        }
-
-        .button-container a:hover {
-            background-color: #35e196; /* Darken button on hover */
-            transform: scale(1.05);
-        }
-
-        @media (max-width: 768px) {
-            body {
-                flex-direction: column; /* Stack elements vertically */
-                height: auto; /* Adjust height for small screens */
-            }
-
-            .content {
-                padding: 20px; /* Adjust padding */
-            }
-
-            .content h2 {
-                font-size: 30px; /* Smaller header font */
-            }
-
-            .content p {
-                font-size: 16px; /* Smaller paragraph font */
-            }
-        }
-    </style>
-</head>
-
-<body>
-    <div class="background"></div>
-    <div class="content">
-    
-        <h2>About Us</h2>
-
-        <p>Welcome to <strong>Ticket-Booking</strong>, your trusted partner for hassle-free ticket booking experiences. Seamlessly book your Bus or Train tickets in just a few clicks.</p>
-
-        <p>Founded to resolve the ambiguities and uncertainties everyone faces while booking, our user-friendly interface, secure payment gateway, and real-time availability ensure a hassle-free experience every time.</p>
-        
-        <p>At <strong>Ticket-Booking</strong>, we believe in making your journey from booking to enjoyment as smooth as possible. Our dedicated customer support team is always ready to assist you, ensuring your ticketing experience is nothing short of exceptional.</p>
-        
-        <p>Thank you for choosing <strong>Ticket-Booking</strong>; we are always here to serve you. Let's make memories together, one ticket at a time!</p>
-
-        <div class="button-container">
-            <a href="index.html">Back to Home</a>
-        </div>
-    </div>
-</body>
-
-</html>
diff --git a/about.js b/about.js
deleted file mode 100644
index 0696b13..0000000
--- a/about.js
+++ /dev/null
@@ -1,11 +0,0 @@
-const cards = document.querySelectorAll('.card');
-
-cards.forEach(card => {
-    card.addEventListener('click', () => {
-        cards.forEach(c => {
-            c.classList.remove('active');
-        });
-      
-        card.classList.add('active');
-    });
-});
\ No newline at end of file
diff --git a/aboutNew.css b/aboutNew.css
deleted file mode 100644
index d2a3df2..0000000
--- a/aboutNew.css
+++ /dev/null
@@ -1,257 +0,0 @@
-* {
-    box-sizing: border-box;
-  }
-  .section__header{
-    text-align: center;
-  }
-  
-  .outer-box {
-    font-family: Verdana, Geneva, Tahoma, sans-serif;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    overflow: hidden;
-    margin: 0;
-    
-  }
-  
-  /* .container {
-    display: flex;
-    width: 60vw;
-    gap: 30px;
-    margin-top: 0;
-} */
-  
-
-  .card {
-    background-color: #366675;
-    background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 2.5) 4%, rgba(255, 255, 255, 0) 30%);
-    height: 83vh;
-    border-radius: 35px 35px;
-    color: #fff;
-    cursor: pointer;
-    flex: 0.5;
-    margin: 5px;
-    position: relative;
-    transition: flex 0.3s ease-in;
-    display: flex;
-    flex-direction: column;
-    align-items: center; /* Center items horizontally */
-    justify-content: center; /* Center items vertically */
-    border: 2px solid rgb(87, 159, 147);
-}
-
-.card .pic {
-    width: 30%; /* Adjust this percentage as needed */
-    height: auto; /* Maintain aspect ratio */
-    visibility: hidden; /* Hide initially; show on active */
-    display: block; /* Ensure it's treated as a block element */
-    margin: 0 auto; /* Center horizontally */
-    transform: translateY(-50px); /* Move upwards (adjust the value as needed) */
-}
-
-
-  
-  
-  .info {
-    position: absolute;
-    bottom: 20px;
-    left: 20%;
-    visibility: hidden;
-    background: rgba(221, 206, 216, 0.462);
-    backdrop-filter:blur(4px);
-    width: 400px;
-    border: 2px solid goldenrod;
-    border-radius: 15px 15px;
-    padding-left: 15px;
-  }
-  
-  .card h3 {
-    font-size: 24px;
-    opacity: 0;
-    color: black !important;
-    font-family:Georgia, 'Times New Roman', Times, serif ;
-    font-weight: bolder;
-    
-  }
-  
-  .card p {
-    font-size: 16px;
-    opacity: 0;
-    color:black !important;
-    margin-top: 10px;
-    font-weight: 500;
-    
-  }
-  
-  .card.active {
-    flex: 6;
-    
-  }
-  
-  .card.active h3 {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-  }
-  
-  .card.active p {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-  }
-  
-  .card.active .info {
-    visibility: visible;
-  }
-  .card.active .pic{
-    visibility: visible;
-    
-  }
-  
-
-.hedd {
-    
-    font-size: 1.2rem;
-    font-weight: 600;
-    display: block;
-    writing-mode: vertical-rl;
-    text-orientation: upright;
-    position: absolute;
-    top: 50%;
-    left: 90%;
-    transform: translate(-98%, -50%);
-    white-space: nowrap;
-    visibility: visible;
-    
-    z-index: 1; /* Ensure it appears above the card */
-}
-
-
-h4{
-    /* color: whitesmoke !important; */
-    margin-left: 28px;
-    font-size: 18px;
-    max-width: 50px;
-}
-
-  .card.active .hedd{
-    visibility: hidden;
-  }
-
-
-
-
- /* Media Queries */
- @media (max-width: 1230px) {
-    .outer-box{
-        margin-top: 0;
-        padding-top: 0;
-        height: 150vh;
-    }
-    .container {
-        /* display: flex; */
-        /* flex-direction: column; Stack cards vertically for medium screens */
-        /* height: 150px; Allow dynamic height */
-        /* gap: 20px; Adjusted gap */
-        /* margin-top: 0; */
-    }
-.card{
-    height: 10vh ;
-    margin-top: 0;
-    padding-top: 0;
-}
-.card.active{
-    height: 30vh;
-}
-    .info {
-        left: 5%; /* Adjusted left positioning */
-        width: 50%; /* Adjust width for medium screens */
-    }
-
-    .card h3 {
-        font-size: 20px; /* Reduced font size for medium screens */
-        text-align: center;
-    }
-
-    .card p {
-        font-size: 14px; /* Reduced font size for medium screens */
-        text-align: center;
-    }
-    h4{
-        /* writing-mode: sideways-lr;
-        text-orientation: sideways-right;
-        rotate: -90deg;
-        text-align: center; */
-
-    }
-
-    
-}
-
-@media (max-width: 620px) {
-    .container {
-        /* height: 200px; */
-        /* flex-direction: column; Align cards in a row for smaller screens */
-        /* justify-content: center; Center items */
-        
-    }
-
-    .card {
-        width: 90%; /* Make cards take full width on small screens */
-        height: auto; /* Allow dynamic height */
-    }
-
-    .card .pic {
-        width: 40%; /* Reduced image size for smaller screens */
-    }
-
-    .info {
-        width: 90%; /* Adjust info width for small screens */
-        height: 100%;
-        left: 5%; /* Adjust left positioning for smaller screens */
-        height: 90%;
-    }
-    .info p{
-        font-size: 10px;
-        margin-bottom: 5px;
-    }
-
-    h4 {
-        font-size: 1rem; 
-        writing-mode: sideways-lr;
-    }
-}
-
-@media (max-width: 480px) {
-   
-    .card {
-        
-        width: 70vw;
-    }
-
-    .info {
-        bottom: 10px; /* Adjusted bottom positioning */
-    }
-
-    .card h3 {
-        font-size: 16px; /* Further reduced font size */
-    }
-
-    .card p {
-        font-size: 8px; /* Further reduced font size */
-    }
-
-    .hedd {
-        font-size: 0.1rem; /* Adjusted size for very small screens */
-        top: 0; /* Align to the top */
-        writing-mode: sideways-lr;
-    }
-}
-
-@media (max-width: 280px) {
-    .info {
-        width: 80px; /* Adjusted width for very small screens */
-        left: 0px; /* Adjusted left positioning */
-    }
-}
-  
\ No newline at end of file
diff --git a/images/about-us.mp4 b/images/about-us.mp4
new file mode 100644
index 0000000..c154eff
Binary files /dev/null and b/images/about-us.mp4 differ
diff --git a/index.css b/index.css
index 3d2e944..e684a0c 100644
--- a/index.css
+++ b/index.css
@@ -20,6 +20,83 @@ p {
   margin-bottom: 20px;
 }
 
+/* -------------about section styles------------------- */
+.about {
+  text-align: center;
+  padding: 50px 20px;
+  font-size: bolder;
+}
+.about-box {
+  display: flex; /* Use Flexbox to position children in a row */
+  align-items: center; /* Vertically center the items */
+  margin-left: -25px;
+}
+
+.about .about-box .video-container {
+  position: relative;
+  flex: 1; /* Allow the video container to grow */
+  max-width: 800px; /* Limit the width of the video */
+  overflow: hidden;
+}
+
+.video-container video {
+  width: calc(100% + 150px); /* Increase the width to crop from the right */
+  height: auto; /* Maintain aspect ratio */
+  position: relative;
+  right: -50px; /* Move the video to the left to crop from the right */
+}
+
+.about .about-box .text {
+  flex: 1; /* Allow the text container to grow */
+  max-width: 640px; /* Optional: Limit the width of the text */
+  display: flex;
+  padding-left: 20px;
+  flex-direction: column;
+  justify-content: center; /* Center content vertically */
+  gap: 15px;
+}
+
+.about .about-box .text h1 {
+  font-size: 35px; /* Adjust font size as needed */
+  letter-spacing: 1.3px;
+  font-weight: 900; /* Increase this value to make it bolder */
+  color: var(--ternary-color);
+}
+
+.about .about-box .text p {
+  line-height: 25px;
+  max-width: 700px;
+  margin: 0 auto;
+  text-align: justify;
+  font-size: bolder;
+}
+
+.about .about-box .text ul li {
+  margin: 10px 0;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.about .about-box .text ul li .feature-icon {
+  height: 30px;
+  min-width: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: var(--main-color);
+  border-radius: 5px;
+}
+
+.about .about-box .text ul li i {
+  color: var(--body-color);
+}
+
+.about .about-box .text ul li span span {
+  color: var(--main-color);
+  font-weight: 600;
+}
+
 .navbar {
   background-color: #1f2937;
   color: white;
diff --git a/index.html b/index.html
index 960f08b..42f170a 100644
--- a/index.html
+++ b/index.html
@@ -893,7 +893,7 @@
             </div>
     
             <ul class="nav-links">
-                <li><a href="about.html"><i class="fas fa-info-circle"></i> About Us</a></li>
+                <li><a href="#about"><i class="fas fa-info-circle"></i> About Us</a></li>
                 <li><a href="buy.html"><i class="fas fa-shopping-cart"></i> Buy</a></li>
                 <li><a href="sell.html"><i class="fas fa-tag"></i> Sell</a></li>
                 <li><a href="#contact"><i class="fas fa-envelope"></i> Contact</a></li>
@@ -983,10 +983,23 @@ <h3>Sell Train Tickets</h3>
     </div>
 </div>
 
-
-
-<script src="about.js"></script>
-  </div>
+<!-- About -->
+<section class="about" id="about">
+    <h1><span>About</span> Us</h1>
+    <div class="box-container about-box">
+        <div class="video-container">
+            <video width="600" controls autoplay loop muted>
+                <source src="images/about-us.mp4" type="video/mp4">
+                Your browser does not support the video tag.
+            </video>
+        </div>
+        <div class="text">
+            <h1>Welcome to Ticket-Booking!</h1>
+            <p>We are your trusted partner for hassle-free ticket booking experiences. Seamlessly book your Bus or Train tickets in just a few clicks. Founded to resolve the ambiguities and uncertainties everyone faces while booking, our user-friendly interface, secure payment gateway, and real-time availability ensure a hassle-free experience every time.<br><br> At Ticket-Booking, we believe in making your journey from booking to enjoyment as smooth as possible. Our dedicated customer support team is always ready to assist you, ensuring your ticketing experience is nothing short of exceptional. Thank you for choosing Ticket-Booking; we are always here to serve you. Let's make memories together, one ticket at a time!</p>
+            
+        </div>
+    </div>
+</section>
 
   <div class="content-wrapper">
     <h1>Our Reviews</h1>
diff --git a/styles.css b/styles.css
index dbdd218..340cab9 100644
--- a/styles.css
+++ b/styles.css
@@ -772,32 +772,6 @@ iframe {
     gap: 2.5rem;
 }
 
-.about,
-.contact {
-    padding: 40px 20px;
-    background-color: #f9f9f9;
-    margin: 20px auto;
-    border-radius: 12px;
-    max-width: 1200px;
-    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-}
-
-.about h2,
-.contact h2 {
-    text-align: center;
-    color: #1f2937;
-    font-size: 2.5rem;
-    margin-bottom: 20px;
-}
-
-.about p,
-.contact p {
-    text-align: center;
-    color: #555;
-    font-size: 1.1rem;
-    line-height: 1.6;
-}
-
 
 /* footer {
     background-color: #1f2937;