diff --git a/assets/css/chapter.css b/assets/css/chapter.css
index fa36f188..e81456d3 100644
--- a/assets/css/chapter.css
+++ b/assets/css/chapter.css
@@ -1,92 +1,133 @@
 #hero {
-  background-image: linear-gradient(rgba(4, 9, 30, 0.5), rgba(4, 9, 30, 0.2)),
-    url("/assets/img/background/peopleImg.jpg");
-  padding: 0;
-  height: 400px;
-  padding-top: 100px;
-  padding-bottom: 50px;
-  justify-content: center;
-  /* margin-top: 5.4%; */
+    background-image: linear-gradient(rgba(4, 9, 30, 0.5), rgba(4, 9, 30, 0.2)),
+        url("/assets/img/background/peopleImg.jpg");
+    padding: 0;
+    height: 400px;
+    padding-top: 100px;
+    padding-bottom: 50px;
+    justify-content: center;
+    /* margin-top: 5.4%; */
 }
 
 #about {
-  background-image: url("/assets/img/background/s3.png");
+    background-image: url("/assets/img/background/s3.png");
+    background-size: cover;
 }
+
 .row {
-  margin-top: 20px;
+    margin-top: 20px;
+}
+
+.hidden {
+    opacity: 0;
+    transform: scale(0.2);
+    transition: all 1s ease-in-out;
+}
+
+.show {
+    opacity: 1;
+    transform: scale(1);
+    animation: slide 1.5s ease-in-out;
+}
+
+@keyframes slide {
+    0% {
+        transform: translateX(-100%);
+        opacity: 0;
+    }
+
+    50% {
+        opacity: 0.25;
+    }
+
+    100% {
+        transform: translateX(0);
+        opacity: 1;
+    }
 }
+
 .us {
-  margin: 0;
-  padding: 0;
-  text-transform: uppercase;
-  position: relative;
-  color: #c8c3d1;
-}
-.us:before {
-  content: "College_Chapters";
-  position: absolute;
-  color: #262626;
-  top: 0;
-  left: 0;
-  width: 0%;
-  overflow: hidden;
-  transition: all 01s;
-}
-.us:hover:before {
-  width: 100%;
-}
-
-@media only screen and (max-width: 800px) {
-  .us {
-    word-break: break-all;
-  }
-  .us:before {
-    width: 100%;
-    transition: none;
-  }
-  .us:hover:before {
-    width: 0;
-  }
+    margin: 0;
+    padding: 0;
+    text-transform: uppercase;
+    position: relative;
+    color: #3a1383;
+    text-align: center;
+    align-items: center;
 }
+
+/* .us:before {
+    content: "College Chapters";
+    position: absolute;
+    color: #262626;
+    top: 0;
+    left: 0;
+    width: 0%;
+    overflow: hidden;
+    transition: all 01s;
+} */
+
+/* .us:hover:before {
+    width: 100%;
+} */
+
+/* @media only screen and (max-width: 800px) {
+    .us {
+        word-break: break-all;
+    }
+
+    .us:before {
+        width: 100%;
+        transition: none;
+    }
+
+    .us:hover:before {
+        width: 0;
+    }
+} */
+
 #faq {
-  background-image: none;
-  /* margin-left: 50px; */
+    background-image: none;
+    /* margin-left: 50px; */
 }
 
 .text-clg {
-  margin-left: 60px;
+    margin-left: 60px;
 }
 
 .faq .faq-list a {
-  font-weight: bold;
-  color: #000;
-  font-size: 25px;
-
-  background-image: linear-gradient(to right, #54b3d6, #54b3d6 50%, #000 50%);
-  background-size: 200% 100%;
-  background-position: -100%;
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  transition: all 0.3s ease-in-out;
-  background-color: #2a2a72;
-  background-image: linear-gradient(315deg, #2a2a72 0%, #009ffd 74%);
+    font-weight: bold;
+    color: #000;
+    font-size: 25px;
+
+    background-image: linear-gradient(to right, #54b3d6, #54b3d6 50%, #000 50%);
+    background-size: 200% 100%;
+    background-position: -100%;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    transition: all 0.3s ease-in-out;
+    background-color: #2a2a72;
+    background-image: linear-gradient(315deg, #2a2a72 0%, #009ffd 74%);
 }
+
 .faq .faq-list a:before {
-  content: "";
-  background: #54b3d6;
-  display: block;
-  position: absolute;
-  bottom: -3px;
-  left: 0;
-  width: 0;
-  height: 3px;
-  background-color: #2a2a72;
-  background-image: linear-gradient(315deg, #2a2a72 0%, #009ffd 74%);
+    content: "";
+    background: #54b3d6;
+    display: block;
+    position: absolute;
+    bottom: -3px;
+    left: 0;
+    width: 0;
+    height: 3px;
+    background-color: #2a2a72;
+    background-image: linear-gradient(315deg, #2a2a72 0%, #009ffd 74%);
 }
+
 .faq .faq-list a:hover {
-  background-position: 0;
-  /* font-size:28px; */
+    background-position: 0;
+    /* font-size:28px; */
 }
+
 /* #search-bar {
           padding: 10px;
           font-size: 16px;
@@ -96,82 +137,82 @@
       } */
 
 .input {
-  width: 250px;
-  padding: 10px 0px 10px 40px;
-  border-radius: 9999px;
-  border: solid 1px #333;
-  background-image: url("/assets/img/search.png");
-  background-repeat: no-repeat;
-  background-size: 25px;
-  background-position: 3% 50%;
-  background-color: white;
-  outline: none;
-  opacity: 0.8;
-  transition: all 0.2s ease-in-out;
+    width: 250px;
+    padding: 10px 0px 10px 40px;
+    border-radius: 9999px;
+    border: solid 1px #333;
+    background-image: url("/assets/img/search.png");
+    background-repeat: no-repeat;
+    background-size: 25px;
+    background-position: 3% 50%;
+    background-color: white;
+    outline: none;
+    opacity: 0.8;
+    transition: all 0.2s ease-in-out;
 }
 
 .input:focus {
-  opacity: 0.9;
-  width: 350px;
+    opacity: 0.9;
+    width: 350px;
 }
 
 #results.input:focus {
-  display: none;
+    display: none;
 }
 
 #results {
-  list-style-type: none;
-  padding: 0;
-  margin-top: 10px;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  max-height: 193px;
-  overflow-y: auto;
-  max-width: 400px;
-  margin-left: 230px;
+    list-style-type: none;
+    padding: 0;
+    margin-top: 10px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    max-height: 193px;
+    overflow-y: auto;
+    max-width: 400px;
+    margin-left: 230px;
 }
 
 #results li {
-  padding: 10px;
-  cursor: pointer;
+    padding: 10px;
+    cursor: pointer;
 
-  background-color: #eee;
-  transition: background-color 0.2s;
+    background-color: #eee;
+    transition: background-color 0.2s;
 
-  backdrop-filter: blur(4px);
+    backdrop-filter: blur(4px);
 }
 
 a,
 a:hover {
-  color: #8919e4;
+    color: #8919e4;
 }
 
 #results li:hover {
-  background-color: #9b999c;
-  font-weight: bolder;
+    background-color: #9b999c;
+    font-weight: bolder;
 }
 
 #results li.active {
-  background-color: #78a4f1;
+    background-color: #78a4f1;
 }
 
 #results li a {
-  color: #333;
-  font-size: 16px;
-  font-weight: bold;
+    color: #333;
+    font-size: 16px;
+    font-weight: bold;
 }
 
 #results li a:hover {
-  color: #eee;
+    color: #eee;
 }
 
 #results::-webkit-scrollbar-track {
-  background-color: rgba(204, 204, 204, 0.4);
-  backdrop-filter: blur(4px);
+    background-color: rgba(204, 204, 204, 0.4);
+    backdrop-filter: blur(4px);
 }
 
 #results::-webkit-scrollbar-thumb {
-  background-color: rgba(131, 128, 128, 0.7);
+    background-color: rgba(131, 128, 128, 0.7);
 }
 
 /* input {
@@ -185,7 +226,7 @@ a:hover {
     } */
 
 @media screen and (max-width: 600px) {
-  /* input {
+    /* input {
         width: 250px;
         height: 30px;
       }
@@ -195,9 +236,49 @@ a:hover {
         width: 30px;
       } */
 
-  #results {
-    margin-left: 10px;
-    max-width: 350px;
-    max-height: 200px;
-  }
+    #results {
+        margin-left: 10px;
+        max-width: 350px;
+        max-height: 200px;
+    }
+}
+
+body {
+    font-family: Varela Round, sans-serif;
+    padding: 0;
+    text-align: center;
 }
+
+.education .school {
+    text-align: left;
+    padding: 5% 12%;
+    box-sizing: border-box;
+}
+
+.education .school .card-title {
+    color: rgb(35, 35, 119);
+    font-weight: bold;
+    font-size: 25px;
+    box-sizing: border-box;
+    text-align: left;
+
+
+}
+
+#image-for-card {
+    width: 100%;
+    height: 100%;
+    border-top-left-radius: 16px;
+    border-top-right-radius: 16px;
+}
+
+.img-fluid {
+    width: 100%;
+    height: 180px;
+    box-sizing: border-box;
+}
+
+.row {
+    position: relative;
+    justify-content: center;
+}
\ No newline at end of file
diff --git a/assets/img/background/s3.png b/assets/img/background/s3.png
index 2eb9e221..6ad70cd8 100644
Binary files a/assets/img/background/s3.png and b/assets/img/background/s3.png differ
diff --git a/chapters/chapter.html b/chapters/chapter.html
index bdc0f0b0..aa487785 100644
--- a/chapters/chapter.html
+++ b/chapters/chapter.html
@@ -2,64 +2,64 @@
 <html lang="en">
 
 <head>
-  <meta charset="utf-8" />
-  <meta content="width=device-width, initial-scale=1.0" name="viewport" />
-
-  <title>OS-CODE | Chapters</title>
-  <meta name="description"
-    content="Multi-College Tech Community empowering students to Learn in Public. Join us to connect with like-minded individuals and foster campus learning culture." />
-  <link rel="canonical" href="../index.html" />
-
-  <!-- Favicons -->
-  <link href="../assets/img/logo.jpeg" rel="icon" />
-
-  <!-- Google Fonts -->
-  <link rel="preconnect" href="https://fonts.googleapis.com" />
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-  <link
-    href="https://fonts.googleapis.com/css2?family=Kanit:wght@500&family=Montserrat&family=Noto+Serif&family=Prompt:wght@500&family=Rajdhani:wght@500&display=swap"
-    rel="stylesheet" />
-
-  <!-- Vendor CSS Files -->
-  <link href="../vendor/aos/aos.css" rel="stylesheet" />
-  <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
-  <link href="../vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet" />
-  <link href="../vendor/boxicons/css/boxicons.min.css" rel="stylesheet" />
-  <link href="../vendor/glightbox/css/glightbox.min.css" rel="stylesheet" />
-  <link href="../vendor/remixicon/remixicon.css" rel="stylesheet" />
-  <link href="../vendor/swiper/swiper-bundle.min.css" rel="stylesheet" />
-
-  <!-- Bootstrap Script -->
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"
-    integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous" />
-  <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
-    integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
-    crossorigin="anonymous"></script>
-  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"
-    integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct"
-    crossorigin="anonymous"></script>
-
-  <!-- Template Main CSS File -->
-  <link rel="stylesheet" href="/assets/css/style.css" />
-  <link rel="stylesheet" href="/assets/css/chapter.css" />
-
-  <!-- Font Awesome -->
-  <script src="https://kit.fontawesome.com/37377042d1.js" crossorigin="anonymous"></script>
-
-  <!-- for overriding the nav css -->
-  <link rel="stylesheet" href="/assets/css/override.css" />
+    <meta charset="utf-8" />
+    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
+
+    <title>OS-CODE | Chapters</title>
+    <meta name="description"
+        content="Multi-College Tech Community empowering students to Learn in Public. Join us to connect with like-minded individuals and foster campus learning culture." />
+    <link rel="canonical" href="../index.html" />
+
+    <!-- Favicons -->
+    <link href="../assets/img/logo.jpeg" rel="icon" />
+
+    <!-- Google Fonts -->
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+        href="https://fonts.googleapis.com/css2?family=Kanit:wght@500&family=Montserrat&family=Noto+Serif&family=Prompt:wght@500&family=Rajdhani:wght@500&display=swap"
+        rel="stylesheet" />
+
+    <!-- Vendor CSS Files -->
+    <link href="../vendor/aos/aos.css" rel="stylesheet" />
+    <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
+    <link href="../vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet" />
+    <link href="../vendor/boxicons/css/boxicons.min.css" rel="stylesheet" />
+    <link href="../vendor/glightbox/css/glightbox.min.css" rel="stylesheet" />
+    <link href="../vendor/remixicon/remixicon.css" rel="stylesheet" />
+    <link href="../vendor/swiper/swiper-bundle.min.css" rel="stylesheet" />
+
+    <!-- Bootstrap Script -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"
+        integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous" />
+    <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
+        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
+        crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct"
+        crossorigin="anonymous"></script>
+
+    <!-- Template Main CSS File -->
+    <link rel="stylesheet" href="/assets/css/style.css" />
+    <link rel="stylesheet" href="/assets/css/chapter.css" />
+
+    <!-- Font Awesome -->
+    <script src="https://kit.fontawesome.com/37377042d1.js" crossorigin="anonymous"></script>
+
+    <!-- for overriding the nav css -->
+    <link rel="stylesheet" href="/assets/css/override.css" />
 
 </head>
 
 <body>
-  <header id="header" class="glassmorphic fixed-top d-flex align-items-center newFlex">
-    <div class=" mainContainer container d-flex align-items-center">
+    <header id="header" class="glassmorphic fixed-top d-flex align-items-center newFlex">
+        <div class=" mainContainer container d-flex align-items-center">
 
-      <!-- logo and name together -->
+            <!-- logo and name together -->
 
-      <div class="logoAndName">
+            <div class="logoAndName">
 
-        <!-- <svg xmlns="http://www.w3.org/2000/svg" version="1.0" width="50pt" viewBox="0 0 1600.000000 1600.000000"
+                <!-- <svg xmlns="http://www.w3.org/2000/svg" version="1.0" width="50pt" viewBox="0 0 1600.000000 1600.000000"
           preserveAspectRatio="xMidYMid meet">
           <g transform="translate(0.000000,1600.000000) scale(0.100000,-0.100000)" fill="#00c3ff" stroke="none">
             <path
@@ -67,16 +67,17 @@
           </g>
         </svg> -->
 
-        <img class="logo1" src="/assets/img/logo.jpeg" width="60px" height="60px" alt="logo" />
+                <img class="logo1" src="/assets/img/logo.jpeg" width="60px" height="60px" alt="logo" />
 
-        <!-- company name -->
+                <!-- company name -->
 
-        <h1 class="logo me-auto" id="landingPage"><a href="#">OS-CODE</a></h1>
+                <h1 class="logo me-auto" id="landingPage"><a href="#">OS-CODE</a></h1>
 
-      </div>
-      <!-- removed image and replaced with a svg -->
+            </div>
+            <!-- removed image and replaced with a svg -->
+
+            <!-- navbar list excluding contact part -->
 
-      <!-- navbar list excluding contact part -->
 
 
     </div>
@@ -108,27 +109,61 @@ <h1 class="logo me-auto" id="landingPage"><a href="#">OS-CODE</a></h1>
       <div class="col-xl-12 top-nav">
         <div class="container-input">
           <input type="text" placeholder="Search..." name="text" class="input" id="search-bar" />
+
         </div>
-        <ul id="results"></ul>
-      </div>
-    </div>
-  </section>
-  <div></div>
-  <div></div>
-  <!-- End Hero -->
-
-  <main id="main">
-    <!-- ======= About Section ======= -->
-    <section id="about" class="clients">
-      <div class="container" data-aos="fade-up">
-        <div class="row" data-aos="fade-up" data-aos-delay="100">
-          <div class="col-lg-6">
-            <h1 class="us">College_Chapters</h1>
-            <hr class="line" />
-          </div>
+        <i class="bi bi-list mobile-nav-toggle"></i>
+        <div id="navbar" class="navbar order-last order-lg-0 me-4">
+            <ul class="nav-list">
+                <li><a class="nav-link scrollto" style="text-decoration: none;"
+                        href="https://www.oscode.co.in/">HOME</a></li>
+                <li><a class="nav-link scrollto" style="text-decoration: none;" href="#mainabout">ABOUT</a></li>
+                <li><a class="nav-link scrollto active" style="text-decoration: none;"
+                        href="chapters/chapter.html">CHAPTERS</a></li>
+                <li><a class="nav-link scrollto" style="text-decoration: none;"
+                        href="https://blog.oscode.co.in/">BLOGS</a></li>
+                <li><a class="nav-link scrollto" href="events/events.html" style="text-decoration: none;">EVENTS</a>
+                </li>
+                <li><a class="nav-link scrollto" href="#contact" style="text-decoration: none;">CONTACT</a></li>
+                <li>
+                    <a href="/login/login.html">
+                        <div class="get-started-btn-1 scrollto cntctBtn">
+                            <i class="fa-regular fa-user"></i>
+                        </div>
+                    </a>
+                </li>
+            </ul>
+            <!-- navbar list ends here -->
         </div>
 
-        <section id="faq" class="faq">
+    </header>
+    <!-- End Header -->
+    <!-- ======= Hero Section ======= -->
+    <section id="hero" class="d-flex align-items-center">
+        <div class="hero">
+            <div class="col-xl-12 top-nav">
+                <div class="container-input">
+                    <input type="text" placeholder="Search..." name="text" class="input" id="search-bar" />
+                </div>
+                <ul id="results"></ul>
+            </div>
+        </div>
+    </section>
+    <div></div>
+    <div></div>
+    <!-- End Hero -->
+
+    <main id="main">
+        <!-- ======= About Section ======= -->
+        <section id="about" class="clients">
+            <div class="container" data-aos="fade-up">
+                <div class="row" data-aos="fade-up" data-aos-delay="100">
+                    <div class="col-lg-6">
+                        <h1 class="us">College Chapters</h1>
+                        <hr class="line" />
+                    </div>
+                </div>
+
+                <!-- <section id="faq" class="faq">
           <div class="container" data-aos="fade-up">
             <div class="faq-list accordion" data-aos="fade-up">
               <ol>
@@ -154,218 +189,355 @@ <h1 class="us">College_Chapters</h1>
               </ol>
             </div>
           </div>
+        </section> -->
+
+                <!-- changes -->
+
+                <section id="education">
+                    <div class="education">
+                        <div class="hidden">
+                            <h5><q> Learning is a treasure that will follow its owner everywhere.</q></h5>
+                        </div>
+
+                        <div class="container school justify-content-center ">
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRBy4wQqUOxjnGBhC-iXdzh1CNmAE5CSkPtxzeVn5gvPkjGKaqeu8pRuG0c6PwtDFveqto&usqp=CAU"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="bit.html" target="_blank">Bangalore
+                                                    Institute of Technology</a>
+                                            </h5>
+                                            <p class="card-text"><strong>College in Bengaluru, Karnataka </strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://media.licdn.com/dms/image/D4E03AQHuu7c5_omZAg/profile-displayphoto-shrink_800_800/0/1683883992399?e=2147483647&v=beta&t=3VlRufbvv5d_mrCZ8hvd5mS2lFSyRcHDw-3coFJIumQ"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="https://www.dsu.edu.in/"
+                                                    target="_blank">Dayananda Sagar University</a>
+                                            </h5>
+                                            <p class="card-text"><strong>Bangalore, Karnataka </strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://images.shiksha.com/mediadata/images/1492686515phpAJymFo_g.jpg"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="https://sjcit.ac.in/" target="_blank">SJC
+                                                    institute of technology</a>
+                                            </h5>
+                                            <p class="card-text"><strong>College in Kothanoor, Karnataka</strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://images.shiksha.com/mediadata/images/1552902664php6IZLcB.jpeg"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="https://sambhramit.com/"
+                                                    target="_blank">Sambhram Institute of Technology</a></h5>
+                                            <p class="card-text"><strong>Bangalore, Karnataka</strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://cache.careers360.mobi/media/presets/720X480/colleges/social-media/media-gallery/2536/2018/7/30/Sir-M-Visvesvaraya-Institute-of-Technology-Bangalore-(3).jpg"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="https://www.sirmvit.edu/"
+                                                    target="_blank">Sir M Vishwesariya Institute of Technology</a></h5>
+                                            <p class="card-text"><strong>Institute of technology in Bengaluru,
+                                                    Karnataka</strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSXv2yHnfNc22GvfwaSX75IyCkhTF-FGR-1a5u4he7ILlSpqwtLEGSIfyXdXC-Y-96yDRc&usqp=CAU"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="https://www.skit.org.in/"
+                                                    target="_blank">Sri Krishna Institute of Technology</a></h5>
+                                            <p class="card-text"><strong>Bangalore, Karnataka</strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="card mb-3 school-animation hidden">
+                                <div class="row g-0">
+                                    <div class="col-md-3">
+                                        <img src="https://www.collegebatch.com/static/clg-gallery/vemana-institute-of-technology-bangalore-214131.jpg"
+                                            class="img-fluid rounded-start" alt="...">
+                                    </div>
+                                    <div class="col-md-9">
+                                        <div class="card-body">
+                                            <h5 class="card-title"><a href="https://vemanait.edu.in/"
+                                                    target="_blank">Vemana institute of technology</a></h5>
+                                            <p class="card-text"><strong>College in Bengaluru, Karnataka</strong></p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+
+
+                <!-- End Frequently Asked Questions Section -->
+            </div>
         </section>
-
-
-        <!-- End Frequently Asked Questions Section -->
-      </div>
-    </section>
-    <!-- End About Section -->
-  </main>
-  <!-- End #main -->
-
-  <!-- ======= Footer ======= -->
-  <footer id="footer">
-    <div class="footer-top">
-      <div class="container modifiedFooterTop footer-padding">
-        <div class="row modifyRow">
-          <div class="col-lg-3 col-md-6 footer-contact">
-            <h3>OS-Code</h3>
-            <p>
-              OS-CODE headquarter, Shanbough<br>
-              Krinshappa Ln Mavalli, <br>
-              Bengaluru, Karnataka 560004<br>
-              <strong>Phone:</strong> +91-7667109405<br />
-            </p>
-          </div>
-
-          <div class="col-lg-3 col-md-6 footer-links">
-            <h4>Useful Links</h4>
-            <ul>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="../index.html">Home</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="#">Services</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i>
-                <a href="/policy/policy.html">Terms of service</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i>
-                <a href="/policy/policy.html">Privacy policy</a>
-              </li>
-            </ul>
-          </div>
-
-          <div class="col-lg-3 col-md-6 footer-links">
-            <h4>Our Services</h4>
-            <ul>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="#">Web Design</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i><a href="#">Web Development</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="#">App Development</a>
-              </li>
-            </ul>
-          </div>
-
-          <div class="col-lg-3 col-md-6 footer-links">
-            <h4>Community</h4>
-            <!-- <form action="mailto:oscode.community@gmail.com" method="post" enctype="text/plain">
+        <!-- End About Section -->
+    </main>
+    <!-- End #main -->
+
+    <!-- ======= Footer ======= -->
+    <footer id="footer">
+        <div class="footer-top">
+            <div class="container modifiedFooterTop footer-padding">
+                <div class="row modifyRow">
+                    <div class="col-lg-3 col-md-6 footer-contact">
+                        <h3>OS-Code</h3>
+                        <p>
+                            OS-CODE headquarter, Shanbough<br>
+                            Krinshappa Ln Mavalli, <br>
+                            Bengaluru, Karnataka 560004<br>
+                            <strong>Phone:</strong> +91-7667109405<br />
+                        </p>
+                    </div>
+
+                    <div class="col-lg-3 col-md-6 footer-links">
+                        <h4>Useful Links</h4>
+                        <ul>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a href="../index.html">Home</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a href="#">Services</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i>
+                                <a href="/policy/policy.html">Terms of service</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i>
+                                <a href="/policy/policy.html">Privacy policy</a>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <div class="col-lg-3 col-md-6 footer-links">
+                        <h4>Our Services</h4>
+                        <ul>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a href="#">Web Design</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i><a href="#">Web Development</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a href="#">App Development</a>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <div class="col-lg-3 col-md-6 footer-links">
+                        <h4>Community</h4>
+                        <!-- <form action="mailto:oscode.community@gmail.com" method="post" enctype="text/plain">
               <input type="email" name="email" /><input type="submit" value="Subscribe" />
             </form> -->
-            <ul>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="https://www.oscode.co.in/#mainabout">About us</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="https://www.oscode.co.in/#benefits">Benefits</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i><a href="https://www.oscode.co.in/#achievement">Accomplishments</a>
-              </li>
-              <li>
-                <i class="bx bx-chevron-right"></i> <a href="https://www.oscode.co.in/#faq">FAQ</a>
-              </li>
-            </ul>
-          </div>
+                        <ul>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a href="https://www.oscode.co.in/#mainabout">About
+                                    us</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a
+                                    href="https://www.oscode.co.in/#benefits">Benefits</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i><a
+                                    href="https://www.oscode.co.in/#achievement">Accomplishments</a>
+                            </li>
+                            <li>
+                                <i class="bx bx-chevron-right"></i> <a href="https://www.oscode.co.in/#faq">FAQ</a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
         </div>
-      </div>
-    </div>
 
-    <div class="container py-4 modifiedFooter">
-      <div class="social-links text-md-end pt-3 pt-md-0 socialLinkMod">
-        <div class="textSocials">Stay in the loop?</div>
-        <a href="https://twitter.com/oscodecommunity" target="_blank" class="twitter"><i class="bx bxl-twitter"></i></a>
-        <a href="https://www.facebook.com/profile.php?id=100090940131222&mibextid=ZbWKwL" target="_blank"
-          class="facebook"><i class="bx bxl-facebook"></i></a>
-        <a href="https://www.instagram.com/os_code_community/" target="_blank" class="instagram"><i
-            class="bx bxl-instagram"></i></a>
-        <a href="https://www.youtube.com/@oscodecommunity" target="_blank" class="youtube"><i
-            class="fab fa-youtube"></i></a>
-        <a href="https://www.linkedin.com/company/oscode/" target="_blank" class="linkedin"><i
-            class="bx bxl-linkedin"></i></a>
-
-        <a href="https://discord.com/channels/945676223101698060" target="_blank" class="discord"><i
-            class="bi bi-discord"></i></a>
-
-            <a href="https://github.com/OSCode-Community/OSCodeCommunitySite" target="_blank" class="github"><i
-              class="bi bi-github"></i></a>
-
-      </div>
-
-      <div class="me-md-auto text-md-start crMod">
-        <div class="copyright">
-          &copy; Copyright <strong><span>OS-Code</span></strong>. All Rights Reserved
+        <div class="container py-4 modifiedFooter">
+            <div class="social-links text-md-end pt-3 pt-md-0 socialLinkMod">
+                <div class="textSocials">Stay in the loop?</div>
+                <a href="https://twitter.com/oscodecommunity" target="_blank" class="twitter"><i
+                        class="bx bxl-twitter"></i></a>
+                <a href="https://www.facebook.com/profile.php?id=100090940131222&mibextid=ZbWKwL" target="_blank"
+                    class="facebook"><i class="bx bxl-facebook"></i></a>
+                <a href="https://www.instagram.com/os_code_community/" target="_blank" class="instagram"><i
+                        class="bx bxl-instagram"></i></a>
+                <a href="https://www.youtube.com/@oscodecommunity" target="_blank" class="youtube"><i
+                        class="fab fa-youtube"></i></a>
+                <a href="https://www.linkedin.com/company/oscode/" target="_blank" class="linkedin"><i
+                        class="bx bxl-linkedin"></i></a>
+
+                <a href="https://discord.com/channels/945676223101698060" target="_blank" class="discord"><i
+                        class="bi bi-discord"></i></a>
+
+            </div>
+
+            <div class="me-md-auto text-md-start crMod">
+                <div class="copyright">
+                    &copy; Copyright <strong><span>OS-Code</span></strong>. All Rights Reserved
+                </div>
+                <div class="credits">Designed by <a href="#">OS-Code</a></div>
+            </div>
+
         </div>
-        <div class="credits">Designed by <a href="#">OS-Code</a></div>
-      </div>
-    </div>
-  </footer>
-  <!-- End Footer -->
-
-  <a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i
-      class="bi bi-arrow-up-short"></i></a>
-
-  <!-- Vendor JS Files -->
-  <script src="../vendor/purecounter/purecounter_vanilla.js"></script>
-  <script src="../vendor/aos/aos.js"></script>
-  <script src="../vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
-  <script src="../vendor/glightbox/js/glightbox.min.js"></script>
-  <script src="../vendor/isotope-layout/isotope.pkgd.min.js"></script>
-  <script src="../vendor/swiper/swiper-bundle.min.js"></script>
-  <script src="../vendor/php-email-form/validate.js"></script>
-
-  <!-- Auto-Typing -->
-  <script src="https://unpkg.com/typed.js@2.0.14/dist/typed.umd.js"></script>
-
-  <!-- Setup and start animation! -->
-  <script>
-    var typed = new Typed("#auto-type", {
-      strings: ["Transforming EDUCATION with TECHNOLOGY"],
-      typeSpeed: 50,
-      loop: true,
-    });
-  </script>
-
-  <!-- Template Main JS File -->
-
-  <script src="../assets/js/main.js"></script>
-  <script src="https://pagead2.googlesyndication.com/pagead/managed/js/adsense/m202304250101/show_ads_impl_fy2021.js"
-    id="google_shimpl"></script>
-  <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
-  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
-    integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
-    crossorigin="anonymous"></script>
-  <script>
-    const searchBar = document.getElementById("search-bar");
-    const results = document.getElementById("results");
-
-    const institutes = [
-      {
-        name: "Bangalore Institute of Technology",
-        url: "bit.html",
-      },
-      { name: "Dayananda Sagar University", url: "https://www.dsu.edu.in/" },
-      {
-        name: "S J C institute of technology",
-        url: "https://www.sjcit.ac.in/",
-      },
-      {
-        name: "Sambhram Institute of Technology",
-        url: "https://www.sambhram.org/",
-      },
-      {
-        name: "Sir M Vishwesariya Institute of Technology",
-        url: "https://www.sirmvit.edu/",
-      },
-      {
-        name: "Sri Krishna Institute of Technology",
-        url: "https://www.skit.ac.in/",
-      },
-      { name: "Vemana institute of technology", url: "https://vitb.ac.in/" },
-    ];
-
-    function searchInstitutes(searchTerm) {
-      results.innerHTML = "";
-
-      const filteredInstitutes = institutes.filter((institute) =>
-        institute.name.toLowerCase().includes(searchTerm.toLowerCase())
-      );
-
-      filteredInstitutes.forEach((institute) => {
-        const li = document.createElement("li");
-        const link = document.createElement("a");
-        link.textContent = institute.name;
-        link.href = institute.url;
-        li.appendChild(link);
-        results.appendChild(li);
-      });
-
-      if (filteredInstitutes.length === 0) {
-        const li = document.createElement("li");
-        li.textContent = "No institutes found.";
-        results.appendChild(li);
-      }
-    }
-
-    searchBar.addEventListener("input", () => {
-      console.log(searchBar.value.length);
-
-      if (searchBar.value.length === 0) {
-        results.innerHTML = "";
-      } else {
-        searchInstitutes(searchBar.value);
-      }
-    });
-
-
-  </script>
+    </footer>
+    <!-- End Footer -->
+
+    <a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i
+            class="bi bi-arrow-up-short"></i></a>
+
+    <!-- Vendor JS Files -->
+    <script src="../vendor/purecounter/purecounter_vanilla.js"></script>
+    <script src="../vendor/aos/aos.js"></script>
+    <script src="../vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <script src="../vendor/glightbox/js/glightbox.min.js"></script>
+    <script src="../vendor/isotope-layout/isotope.pkgd.min.js"></script>
+    <script src="../vendor/swiper/swiper-bundle.min.js"></script>
+    <script src="../vendor/php-email-form/validate.js"></script>
+
+    <!-- Auto-Typing -->
+    <script src="https://unpkg.com/typed.js@2.0.14/dist/typed.umd.js"></script>
+
+    <!-- Setup and start animation! -->
+    <script>
+        var typed = new Typed("#auto-type", {
+            strings: ["Transforming EDUCATION with TECHNOLOGY"],
+            typeSpeed: 50,
+            loop: true,
+        });
+    </script>
+
+    <!-- Template Main JS File -->
+
+    <script src="../assets/js/main.js"></script>
+    <script src="https://pagead2.googlesyndication.com/pagead/managed/js/adsense/m202304250101/show_ads_impl_fy2021.js"
+        id="google_shimpl"></script>
+    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
+        integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
+        crossorigin="anonymous"></script>
+    <script>
+        const searchBar = document.getElementById("search-bar");
+        const results = document.getElementById("results");
+
+        const institutes = [
+            {
+                name: "Bangalore Institute of Technology",
+                url: "bit.html",
+            },
+            { name: "Dayananda Sagar University", url: "https://www.dsu.edu.in/" },
+            {
+                name: "S J C institute of technology",
+                url: "https://www.sjcit.ac.in/",
+            },
+            {
+                name: "Sambhram Institute of Technology",
+                url: "https://www.sambhram.org/",
+            },
+            {
+                name: "Sir M Vishwesariya Institute of Technology",
+                url: "https://www.sirmvit.edu/",
+            },
+            {
+                name: "Sri Krishna Institute of Technology",
+                url: "https://www.skit.ac.in/",
+            },
+            { name: "Vemana institute of technology", url: "https://vitb.ac.in/" },
+        ];
+
+        function searchInstitutes(searchTerm) {
+            results.innerHTML = "";
+
+            const filteredInstitutes = institutes.filter((institute) =>
+                institute.name.toLowerCase().includes(searchTerm.toLowerCase())
+            );
+
+            filteredInstitutes.forEach((institute) => {
+                const li = document.createElement("li");
+                const link = document.createElement("a");
+                link.textContent = institute.name;
+                link.href = institute.url;
+                li.appendChild(link);
+                results.appendChild(li);
+            });
+
+            if (filteredInstitutes.length === 0) {
+                const li = document.createElement("li");
+                li.textContent = "No institutes found.";
+                results.appendChild(li);
+            }
+        }
+
+        searchBar.addEventListener("input", () => {
+            console.log(searchBar.value.length);
+
+            if (searchBar.value.length === 0) {
+                results.innerHTML = "";
+            } else {
+                searchInstitutes(searchBar.value);
+            }
+        });
+
+        window.addEventListener('scroll', () => {
+            let content = document.querySelectorAll('.hidden');
+            content.forEach(hidden => {
+                let contentPosition = hidden.getBoundingClientRect().top;
+                let screenPosition = window.innerHeight / 1.3;
+                if (contentPosition < screenPosition) {
+                    hidden.classList.add('show');
+                } else {
+                    hidden.classList.remove('show');
+                }
+            })
+        });
+
+    </script>
 </body>
 
 </html>
\ No newline at end of file