diff --git a/index.html b/index.html
index 070b93f..70ef3a1 100644
--- a/index.html
+++ b/index.html
@@ -3,14 +3,12 @@
 
 <head>
     <meta charset="utf-8">
-    <meta name="description"
-        content="CodeChamp is the Community of Coding Enthusiasts,Where we Share Resources, Roadmaps and Opportunities Updates to explore technologies,Together we aim to explore the untouched world of technologies.">
+    <meta name="description" content="CodeChamp is the Community of Coding Enthusiasts,Where we Share Resources, Roadmaps and Opportunities Updates to explore technologies,Together we aim to explore the untouched world of technologies.">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>CodeChamp</title>
     <link rel="icon" type="image/png" href="./images/logo.png">
     <!--bootstrap Css-->
-    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"
-        integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
     <!--external css-->
     <link href="./style.css" rel="stylesheet">
     <!--bootstrap icons cdn-->
@@ -23,31 +21,35 @@
 <script async src="https://www.googletagmanager.com/gtag/js?id=G-3EL4753RH2"></script>
 <script>
     window.dataLayer = window.dataLayer || [];
-    function gtag() { dataLayer.push(arguments); }
+
+
+    function gtag() {
+
+        dataLayer.push(arguments);
+
+    }
     gtag('js', new Date());
     gtag('config', 'G-3EL4753RH2');
 </script>
 
 <!--Google ads-->
-<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1210592339079044"
-    crossorigin="anonymous"></script>
+<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1210592339079044" crossorigin="anonymous"></script>
 
 
 <body>
     <!--navbar starts-->
     <nav class="navbar navbar-expand-lg sticky-top bg-white" id="Navbar">
         <div class="container-fluid">
-            <a class="navbar-brand ml-0 logo" href="#"><img src="./images/logo.png"
-                    style="height: 40px; width:80px; filter:brightness(120%)"></a>
+            <a class="navbar-brand" href="#">
+                <img src="./images/logo.png" style="height: 60px; margin-left: 1rem;">
+            </a>
             <!--hamburger button for mobile view starts-->
-            <button class="navbar-toggler hamburger" type="button" data-bs-toggle="collapse"
-                data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
-                aria-label="Toggle navigation">
+            <button class="navbar-toggler hamburger" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                 <span class="navbar-toggler-icon"></span>
             </button>
             <!--hamburger button for mobile view ends-->
-            <div class="collapse navbar-collapse " id="navbarSupportedContent">
-                <ul class="navbar-nav me-auto mb-2 mb-lg-0 nav-ul">
+            <div class="collapse navbar-collapse" id="navbarSupportedContent" style="flex-basis:none;">
+                <ul class="navbar-nav ms-auto">
                     <li class="nav-item">
                         <a class="nav-link dark-anchor" aria-current="page" href="#">Home</a>
                     </li>
@@ -72,7 +74,7 @@
                     <li class="nav-item">
                         <a class="nav-link dark-anchor" href="#tenth">Contact Us</a>
                     </li>
-                    <div class="form-check form-switch d-flex align-items-center mx-2">
+                    <div class="form-check form-switch d-flex align-items-center">
                         <input type="checkbox" class="checkbox" id="checkbox" onclick="darkModeToggler()">
                         <label for="checkbox" class="label" id="toggle-switch">
                             <i class="bi bi-sun fs-6" style="font-size: 0.6rem !important;"></i>
@@ -89,10 +91,8 @@
     <div class="container" id="first">
         <div class="discription">
             <h2 class="heading">CodeChamp</h2>
-            <p class="content">CodeChamp is the Community of Coding Enthusiasts,
-                Where we Share Resources, Roadmaps and Opportunities Updates to explore technologies also,
-                We organize various Workshops, Sessions for our folks to learn new things.
-                Together we aim to explore the untouched world of technologies.
+            <p class="content">CodeChamp is the Community of Coding Enthusiasts, Where we Share Resources, Roadmaps and Opportunities Updates to explore technologies also, We organize various Workshops, Sessions for our folks to learn new things. Together we aim to explore
+                the untouched world of technologies.
             </p>
             </br>
             <!--<a href="https://lu.ma/opensource"><button class="common-button register" type="button"
@@ -121,26 +121,21 @@ <h1 class="heading text-center">
         <hr />
         <div class="event-cards container">
             <div class="card event common-card" style="width: 20rem; margin-top: 20px;">
-                <img src="./images/Cyber Security Event.png" class="card-img-top" style="border-radius:15px;"
-                    alt="Fullstack Banner">
+                <img src="./images/Cyber Security Event.png" class="card-img-top" style="border-radius:15px;" alt="Fullstack Banner">
                 <div class="card-body home-card">
 
-                    <a href="https://youtu.be/IRcG4fAc_gU" class="btn btn-primary rec-button common-button"
-                        target="_blank">WATCH RECORDING</a>
+                    <a href="https://youtu.be/IRcG4fAc_gU" class="btn btn-primary rec-button common-button" target="_blank">WATCH RECORDING</a>
                 </div>
             </div>
             <div class="card event common-card" style="width: 20rem; margin-top: 20px;">
-                <img src="./images/Cp Event.jpeg" class="card-img-top" style="border-radius:15px;"
-                    alt="Fullstack Banner">
+                <img src="./images/Cp Event.jpeg" class="card-img-top" style="border-radius:15px;" alt="Fullstack Banner">
                 <div class="card-body home-card">
 
-                    <a href="https://youtu.be/phH3FrpGYjg" class="btn btn-primary rec-button common-button"
-                        target="_blank">WATCH RECORDING</a>
+                    <a href="https://youtu.be/phH3FrpGYjg" class="btn btn-primary rec-button common-button" target="_blank">WATCH RECORDING</a>
                 </div>
             </div>
             <div class="card event common-card" style="width: 20rem; margin-top: 20px;">
-                <img src="./images/Android Session.jpeg" class="card-img-top" style="border-radius:15px;"
-                    alt="Fullstack Banner">
+                <img src="./images/Android Session.jpeg" class="card-img-top" style="border-radius:15px;" alt="Fullstack Banner">
                 <div class="card-body home-card">
 
                     <a href="https://youtu.be/_DnGURYqkDE" class="btn btn-primary rec-button 
@@ -158,14 +153,12 @@ <h1 class="heading text-center">
         </h1>
         <hr />
         <div class="container joinus-cards">
-            <a href="https://www.linkedin.com/company/codechamp03/" target="_blank" rel="noreferrer"
-                class="joinus-anchor">
+            <a href="https://www.linkedin.com/company/codechamp03/" target="_blank" rel="noreferrer" class="joinus-anchor">
                 <div class="card joinus-card common-card" style="width: 18rem;" target="_blank">
                     <i class="bi bi-linkedin joinus-icons" style="color: #0077b5;"></i>
                     <div class="card-body home-card">
                         <h3 class="card-title text-center">LinkedIn Page</h3>
-                        <p class="card-text content">Follow our LinkedIn page where we post some tech stuff and get
-                            updated about our upcomng sessions.</p>
+                        <p class="card-text content">Follow our LinkedIn page where we post some tech stuff and get updated about our upcomng sessions.</p>
                     </div>
                 </div>
             </a>
@@ -175,8 +168,7 @@ <h3 class="card-title text-center">LinkedIn Page</h3>
                     <i class="bi bi-discord joinus-icons " style="color:#5865F2;"></i>
                     <div class="card-body home-card">
                         <h3 class="card-title text-center">Discord Server</h3>
-                        <p class="card-text content">Join our Discord server to interact with the students around the
-                            globe also, ask your doubts with our mentors. </p>
+                        <p class="card-text content">Join our Discord server to interact with the students around the globe also, ask your doubts with our mentors. </p>
                     </div>
                 </div>
             </a>
@@ -186,8 +178,7 @@ <h3 class="card-title text-center">Discord Server</h3>
                     <i class="bi bi-telegram joinus-icons" style="color:#0088CC;"></i>
                     <div class="card-body home-card">
                         <h3 class="card-title text-center">Telegram Channel</h3>
-                        <p class="card-text content">Join our telegram channel and get information about best resources
-                            and stay updated about opportunities.</p>
+                        <p class="card-text content">Join our telegram channel and get information about best resources and stay updated about opportunities.</p>
                     </div>
                 </div>
             </a>
@@ -197,32 +188,27 @@ <h3 class="card-title text-center">Telegram Channel</h3>
                     <i class="bi bi-instagram joinus-icons" style="color: #DD2A7B;"></i>
                     <div class="card-body home-card">
                         <h3 class="card-title text-center">Instagram Page</h3>
-                        <p class="card-text content">Follow us on Instagram to get programming memes, technical stuffs
-                            and short resources.</p>
+                        <p class="card-text content">Follow us on Instagram to get programming memes, technical stuffs and short resources.</p>
                     </div>
                 </div>
             </a>
 
-            <a href="https://github.com/DeveloperAshish8/CodeChamp-s-Website" target="_blank" rel="noreferrer"
-                class="joinus-anchor">
+            <a href="https://github.com/DeveloperAshish8/CodeChamp-s-Website" target="_blank" rel="noreferrer" class="joinus-anchor">
                 <div class="card joinus-card common-card" style="width: 18rem;" target="_blank">
                     <i class="bi bi-github joinus-icons" style="color: black;"></i>
                     <div class="card-body home-card">
                         <h3 class="card-title text-center">Github </h3>
-                        <p class="card-text content">Want to contribute to our website, folk the repository from here
-                            and start contributing.</p>
+                        <p class="card-text content">Want to contribute to our website, folk the repository from here and start contributing.</p>
                     </div>
                 </div>
             </a>
 
-            <a href="https://www.youtube.com/channel/UCw39myIHyYoICgsTh3cdYMQ" target="_blank" rel="noreferrer"
-                class="joinus-anchor">
+            <a href="https://www.youtube.com/channel/UCw39myIHyYoICgsTh3cdYMQ" target="_blank" rel="noreferrer" class="joinus-anchor">
                 <div class="card joinus-card common-card" style="width: 18rem;" target="_blank">
                     <i class="bi bi-youtube joinus-icons" style="color: red;"></i>
                     <div class="card-body home-card">
                         <h3 class="card-title text-center">YouTube Channel</h3>
-                        <p class="card-text content">Subscribe our Channel on YouTube and get recorded sessions if you
-                            missed them.</p>
+                        <p class="card-text content">Subscribe our Channel on YouTube and get recorded sessions if you missed them.</p>
                     </div>
                 </div>
             </a>
@@ -243,104 +229,88 @@ <h1 class="heading text-center">
         <br>
         <div class="team-members carousel slide" data-bs-interval="2000" data-bs-ride="carousel">
             <div class="carousel-item card active common-card-2" style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/ashish bw.jpeg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Ashish Kumar</h4>
                         <p class="content text-center">Founder</p>
-                        <a href="https://www.linkedin.com/in/ashish-kumar-he-him-4566211a3/"> <i class="bi bi-linkedin"
-                                style="font-size: 1.5rem;"></i></a>
+                        <a href="https://www.linkedin.com/in/ashish-kumar-he-him-4566211a3/"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
 
                     </div>
                 </div>
             </div>
             <div class="carousel-item card common-card-2" style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/user image.jpg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Abhishek Anand</h4>
                         <p class="content text-center">Co-founder</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/abhi-anand-b484b11a0"> <i
-                                class="bi bi-linkedin" style="font-size: 1.5rem;" target="_blank"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/abhi-anand-b484b11a0"> <i class="bi bi-linkedin" style="font-size: 1.5rem;" target="_blank"></i></a>
                     </div>
                 </div>
             </div>
             <div class="carousel-item card common-card-2" style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/Subham image.jpeg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Subham Kumar Jha</h4>
                         <p class="content text-center">Community Manager</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/subham-kumar-355a63225"
-                            target="_blank"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/subham-kumar-355a63225" target="_blank"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
                     </div>
                 </div>
             </div>
             <div class="carousel-item card common-card-2 " style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/Ayush image.jpg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Ayush raj</h4>
                         <p class="content text-center">Content Manager</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/ayush-raj-8bb362213"
-                            target="_blank"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/ayush-raj-8bb362213" target="_blank"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
                     </div>
                 </div>
             </div>
 
             <div class="carousel-item card common-card-2 " style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/Shruti Image.jpeg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Shruti Agrawal</h4>
                         <p class="content text-center">Event Manager</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/shruti-agrawal-7bb416243"
-                            target="_blank"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/shruti-agrawal-7bb416243" target="_blank"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
                     </div>
                 </div>
             </div>
 
             <div class="carousel-item card common-card-2 " style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/Sandesh image.jpeg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Sandesh Kumar</h4>
                         <p class="content text-center">Web Development Team</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/sandesh-kumar-0a7224234"> <i
-                                class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/sandesh-kumar-0a7224234"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
 
                     </div>
                 </div>
             </div>
 
             <div class="carousel-item card common-card-2 " style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/user image.jpg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Himanshu Kumar</h4>
                         <p class="content text-center">Web Development Team</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/i-himanshu"> <i
-                                class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/i-himanshu"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
                     </div>
                 </div>
             </div>
 
             <div class="carousel-item card common-card-2 " style="padding: 20px;">
-                <div class="card ml-4 common-card"
-                    style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
+                <div class="card ml-4 common-card" style="width: 20rem; border-radius: 15px; display: inline-block; margin-right: 80px;">
                     <img class="card-img-top team-image" src="./images/Anjali image.jpeg" alt="Card image cap">
                     <div class="card-body home-card">
                         <h4 class="card-title text-center">Anjali Singh</h4>
                         <p class="content text-center">Graphics Designer</p>
-                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/anjali-singh-2a5109231/"> <i
-                                class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
+                        <a style="margin-left: 10px;" href="https://www.linkedin.com/in/anjali-singh-2a5109231/"> <i class="bi bi-linkedin" style="font-size: 1.5rem;"></i></a>
                     </div>
                 </div>
             </div>
@@ -383,26 +353,21 @@ <h1 class="heading text-center">
         <hr />
         <div class="opportunities container">
             <div class="card event common-card" style="width: 20rem; margin-top: 20px;">
-                <img src="./images/Join us as Mentor.jpeg" class="card-img-top" style="border-radius:15px;"
-                    alt="Fullstack Banner">
+                <img src="./images/Join us as Mentor.jpeg" class="card-img-top" style="border-radius:15px;" alt="Fullstack Banner">
                 <div class="card-body home-card">
                     <h5 class="card-title text-center">Join Us As Mentor</h5>
-                    <a href="https://docs.google.com/forms/d/e/1FAIpQLSc35m_65K3moo82K5it55Cae0zUtJVjpIaOK66ProF6UDaGtw/viewform?usp=sf_link"
-                        class="btn btn-primary Intrested common-button">INTRESTED</a>
+                    <a href="https://docs.google.com/forms/d/e/1FAIpQLSc35m_65K3moo82K5it55Cae0zUtJVjpIaOK66ProF6UDaGtw/viewform?usp=sf_link" class="btn btn-primary Intrested common-button">INTRESTED</a>
                 </div>
             </div>
             <div class="card event common-card" style="width: 20rem; margin-top: 20px;">
-                <img src="./images/Join our core Team.jpeg" class="card-img-top" style="border-radius:15px;"
-                    alt="Fullstack Banner">
+                <img src="./images/Join our core Team.jpeg" class="card-img-top" style="border-radius:15px;" alt="Fullstack Banner">
                 <div class="card-body home-card">
                     <h5 class="card-title text-center">Join Our Core Team</h5>
-                    <a href="https://docs.google.com/forms/d/e/1FAIpQLSds0RlPkF6oz7q5lmpeeC3D-UiRjhM0DwlW-zvRAKSz4kZu5w/viewform?usp=sf_link"
-                        class="btn btn-primary Intrested common-button">INTRESTED</a>
+                    <a href="https://docs.google.com/forms/d/e/1FAIpQLSds0RlPkF6oz7q5lmpeeC3D-UiRjhM0DwlW-zvRAKSz4kZu5w/viewform?usp=sf_link" class="btn btn-primary Intrested common-button">INTRESTED</a>
                 </div>
             </div>
             <div class="card event common-card" style="width: 20rem; margin-top: 20px;">
-                <img src="./images/Volunteer banner.jpeg" class="card-img-top" style="border-radius:15px;"
-                    alt="Fullstack Banner">
+                <img src="./images/Volunteer banner.jpeg" class="card-img-top" style="border-radius:15px;" alt="Fullstack Banner">
                 <div class="card-body home-card">
                     <h5 class="card-title text-center">Volunteer Us</h5>
                     <a href="" class="btn btn-primary Intrested common-button">HIRING SOON</a>
@@ -428,16 +393,14 @@ <h1 class="heading text-center">
                 <img class="card-img-top feedback-image" src="./images/Ayush kumar image.jpg" alt="Card image cap">
                 <div class="card-body home-card">
                     <h4 class="card-title text-center">Ayush Kumar</h4>
-                    <p class="content text-center"> "A community is always helpful for the new learners, CodeChamp keeps
-                        me updated about best learning resources, opportunities etc."</p>
+                    <p class="content text-center"> "A community is always helpful for the new learners, CodeChamp keeps me updated about best learning resources, opportunities etc."</p>
                 </div>
             </div>
             <div class="card common-card" style="width: 19rem; border-radius: 15px;padding: 10px;">
                 <img class="card-img-top feedback-image" src="./images/user image.jpg" alt="Card image cap">
                 <div class="card-body home-card">
                     <h4 class="card-title text-center">You</h4>
-                    <p class="content text-center">You can also be featured in our website, share about your experience
-                        with CodeChamp at codechampcommunity@gmail.com</p>
+                    <p class="content text-center">You can also be featured in our website, share about your experience with CodeChamp at codechampcommunity@gmail.com</p>
                 </div>
             </div>
         </div>
@@ -455,18 +418,15 @@ <h1 class="heading text-center">
         <br />
         <div class="feedbacks">
             <div class="partner-logo">
-                <img src="./images/Bepractical logo.webp" alt="Bepractical" width="200px" height="80px"
-                    style="margin-top: 40px;">
+                <img src="./images/Bepractical logo.webp" alt="Bepractical" width="200px" height="80px" style="margin-top: 40px;">
             </div>
 
             <div class="partner-logo">
-                <img src="./images/Coding Blocks.png" alt="Coding Blocks" width="250px" height="100px"
-                    style="margin-top: 40px;">
+                <img src="./images/Coding Blocks.png" alt="Coding Blocks" width="250px" height="100px" style="margin-top: 40px;">
             </div>
 
             <div class="partner-logo">
-                <img src="./images/GDSC Gaya College of Engineering vertical color (3).png" alt="Coding Blocks"
-                    width="250px" height="150px" style="margin-top: 25px;">
+                <img src="./images/GDSC Gaya College of Engineering vertical color (3).png" alt="Coding Blocks" width="250px" height="150px" style="margin-top: 25px;">
             </div>
         </div>
     </div>
@@ -484,44 +444,35 @@ <h1 class="heading text-center">
         <div class="accordion" id="accordionExample" style="width: 70%; margin:auto;">
             <div class="accordion-item faq" style="margin-top: 2rem;">
                 <h2 class="accordion-header" id="headingOne">
-                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse"
-                        data-bs-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
+                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
                         What is CodeChamp?
                     </button>
                 </h2>
-                <div id="collapseOne" class="accordion-collapse collapse " aria-labelledby="headingOne"
-                    data-bs-parent="#accordionExample">
+                <div id="collapseOne" class="accordion-collapse collapse " aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                     <div class="accordion-body content">
-                        CodeChamp is the Community of Coding Enthusiasts, Where we Share Resources, Roadmaps and
-                        Opportunities Updates to explore technologies also, We organize various Workshops, Sessions
-                        for our folks to learn new things.
+                        CodeChamp is the Community of Coding Enthusiasts, Where we Share Resources, Roadmaps and Opportunities Updates to explore technologies also, We organize various Workshops, Sessions for our folks to learn new things.
                     </div>
                 </div>
             </div>
             <div class="accordion-item faq" style="margin-top: 3rem;">
                 <h2 class="accordion-header" id="headingTwo">
-                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse"
-                        data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
+                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                         Why you should join CodeChamp?
                     </button>
                 </h2>
-                <div id="collapseTwo" class="accordion-collapse collapse " aria-labelledby="headingTwo"
-                    data-bs-parent="#accordionExample">
+                <div id="collapseTwo" class="accordion-collapse collapse " aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                     <div class="accordion-body content">
-                        Joining our community gives you exposure to the like minded peoples, you can ask your doubts
-                        with our mentors one to one on our discord server.
+                        Joining our community gives you exposure to the like minded peoples, you can ask your doubts with our mentors one to one on our discord server.
                     </div>
                 </div>
             </div>
             <div class="accordion-item faq" style="margin-top: 3rem;">
                 <h2 class="accordion-header" id="headingThree">
-                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse"
-                        data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
+                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                         How to be our beloved member?
                     </button>
                 </h2>
-                <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree"
-                    data-bs-parent="#accordionExample">
+                <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                     <div class="accordion-body content">
                         You can join us on our discord server by <a href="https://discord.gg/vVM4hBKnHt">clicking
                             Here</a> also you can follow our LinkedIn page and stay updated about our new sessions.
@@ -531,16 +482,13 @@ <h2 class="accordion-header" id="headingThree">
 
             <div class="accordion-item faq" style="margin-top: 3rem;">
                 <h2 class="accordion-header" id="headingFour">
-                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse"
-                        data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
+                    <button class="accordion-button collapsed faq-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
                         How to join our Team?
                     </button>
                 </h2>
-                <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour"
-                    data-bs-parent="#accordionExample">
+                <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionExample">
                     <div class="accordion-body content">
-                        You can join our core team or can volunteer us by <a href="#sixth">clicking Here</a> . Joining
-                        our team means you are willing to work for our community members.
+                        You can join our core team or can volunteer us by <a href="#sixth">clicking Here</a> . Joining our team means you are willing to work for our community members.
                     </div>
                 </div>
             </div>
@@ -561,15 +509,12 @@ <h1 class="heading text-center">
         <div class="contact container">
             <div class="form-container">
                 <form action="https://formspree.io/f/xbjbrgpv" method="POST">
-                    <input class="form-control" type="email" name="email" placeholder="mail@example.com"
-                        style="margin-top: 20px;">
+                    <input class="form-control" type="email" name="email" placeholder="mail@example.com" style="margin-top: 20px;">
 
-                    <input class="form-control" type="text" name="name" placeholder="Your Name"
-                        style="margin-top: 20px;" required>
+                    <input class="form-control" type="text" name="name" placeholder="Your Name" style="margin-top: 20px;" required>
 
                     <input type="text" class="form-control" placeholder="Subject" required>
-                    <textarea class="form-control" name="message" placeholder="Write Your message here"
-                        style="margin-top: 20px;"></textarea>
+                    <textarea class="form-control" name="message" placeholder="Write Your message here" style="margin-top: 20px;"></textarea>
                     <input class="common-button" type="submit" style="margin-top: 20px; margin-left: 20%;">
                 </form>
             </div>
@@ -587,8 +532,7 @@ <h1 class="heading text-center">
             <div class="about" style="margin-top: 20px;">
                 <h4 class="heading footer-content text-center">CodeChamp</h4>
                 <br />
-                <p class="footer-content text">CodeChamp is the Community of Coding Enthusiasts, Where we Share
-                    Resources, Roadmaps and Opportunities Updates to explore technologies.</p>
+                <p class="footer-content text">CodeChamp is the Community of Coding Enthusiasts, Where we Share Resources, Roadmaps and Opportunities Updates to explore technologies.</p>
             </div>
 
             <div class="quick-links footer-content" style="margin-top: 20px;">
@@ -614,14 +558,17 @@ <h4 class="heading text-center">Contact</h4>
         </div>
         <br />
     </footer>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/js/bootstrap.bundle.min.js"
-        integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2"
-        crossorigin="anonymous"></script>
-    <script src="https://web.jscdn.repl.co/AOS/aos.js"></script>
+    <<<<<<< HEAD <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2" crossorigin="anonymous">
+        </script>
+        =======
+        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
+        >>>>>>> 7d641d8 (Modified the Navbar Section)
+        <script src="https://web.jscdn.repl.co/AOS/aos.js"></script>
 
 </body>
 <script>
     let mode = 'light';
+
     function darkModeToggler() {
         if (mode === 'light') {
             mode = 'dark';
@@ -643,8 +590,7 @@ <h4 class="heading text-center">Contact</h4>
                 elementCard2[i].classList.toggle('dark-card-2');
             }
 
-        }
-        else {
+        } else {
             mode = 'light';
             document.getElementById('Navbar').classList.toggle('dark-nav');
             document.getElementById('Content').style.color = '#696969';
diff --git a/style.css b/style.css
index 979c590..8fcf726 100644
--- a/style.css
+++ b/style.css
@@ -1,427 +1,479 @@
 @import url("https://fonts.googleapis.com/css2?family=Fira+Sans&family=Open+Sans:wght@500&family=Oswald:wght@500&family=Roboto:wght@300;400;700&display=swap");
-
 * {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-  font-family: "Open Sans", sans-serif;
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: "Open Sans", sans-serif;
 }
 
+
 /** navbar styling starts**/
+
 .logo {
-  margin-left: 12vw;
+    margin-left: 12vw;
+}
+
+nav .container-fluid {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
 }
 
 .nav-ul {
-  margin: auto;
+    margin: auto;
 }
 
-.nav-ul > li > a {
-  margin-left: 30px;
+.nav-ul>li>a {
+    margin-left: 30px;
 }
 
 .hamburger {
-  border-color: #fd7014;
+    border-color: #fd7014;
 }
 
 .hamburger:hover {
-  border: none;
-  background-color: #fd711494;
- transition: all 0.2s ease-in-out;
+    border: none;
+    background-color: #fd711494;
+    transition: all 0.2s ease-in-out;
+}
+
+.navbar-toggler:focus,
+.navbar-toggler:active,
+.navbar-toggler-icon:focus {
+    outline: none;
+    box-shadow: none;
+}
+
+.form-switch {
+    margin: 0 1rem 0 1rem;
 }
 
 .active {
-  color: #fd7014 !important;
+    color: #fd7014 !important;
 }
 
-.nav-link{
-  display: inline-block;
-  position: relative;
+.nav-link {
+    display: inline-block;
+    position: relative;
 }
 
-.nav-link:after{
-  content: '';
-  position: absolute;
-  width: 100%;
-  transform: scaleX(0);
-  height: 2px;
-  bottom: 0;
-  left: 0;
-  background-color: #fd7014;
-  transform-origin: bottom center;
-  transition: transform 0.25s ease-in-out;
+.nav-link:after {
+    content: '';
+    position: absolute;
+    width: 100%;
+    transform: scaleX(0);
+    height: 2px;
+    bottom: 0;
+    left: 0;
+    background-color: #fd7014;
+    transform-origin: bottom center;
+    transition: transform 0.25s ease-in-out;
 }
 
-.nav-link:hover:after{
-  transform: scaleX(1);
-  transform-origin: bottom left;
+.nav-link:hover:after {
+    transform: scaleX(1);
+    transform-origin: bottom left;
 }
 
 
 /**navbar styling ends**/
 
+
 /**first container area styling starts**/
+
 .container {
-  display: flex;
-  margin-top: 5vh;
-  justify-content: space-around;
-  flex-direction: row;
-  flex-wrap: wrap;
+    display: flex;
+    margin-top: 5vh;
+    justify-content: space-around;
+    flex-direction: row;
+    flex-wrap: wrap;
 }
 
 .discription {
-  width: 600px;
+    width: 600px;
 }
 
 .heading {
-  font-family: "Oswald", sans-serif;
+    font-family: "Oswald", sans-serif;
 }
 
 .content {
-  font-family: "Fira Sans", sans-serif;
-  color: #696969;
-  line-height: 25px;
+    font-family: "Fira Sans", sans-serif;
+    color: #696969;
+    line-height: 25px;
 }
 
 .common-button {
-  padding: 10px 20px;
-  border-radius: 30px;
-  background-color: #fd7014;
-  color: white;
-  border: none;
-  transition: all 0.3s linear;
+    padding: 10px 20px;
+    border-radius: 30px;
+    background-color: #fd7014;
+    color: white;
+    border: none;
+    transition: all 0.3s linear;
 }
 
 .common-button:hover {
-  background-color: transparent !important;
-  color: #fd7014 !important;
-  box-shadow: 0 0.5px 1px rgb(92, 92, 92) !important;
+    background-color: transparent !important;
+    color: #fd7014 !important;
+    box-shadow: 0 0.5px 1px rgb(92, 92, 92) !important;
 }
 
-.register{
-  animation-name: register;
-  animation-duration: 1s;
-  animation-iteration-count: 30;
-} 
+.register {
+    animation-name: register;
+    animation-duration: 1s;
+    animation-iteration-count: 30;
+}
 
 @keyframes register {
-       0%{background-color: #fd7014;}
-       50%{background-color: transparent; color: #fd7014;}
+    0% {
+        background-color: #fd7014;
+    }
+    50% {
+        background-color: transparent;
+        color: #fd7014;
+    }
 }
 
 .intro-image {
-  max-width: 100%;
-  min-height: 40vh;
-  vertical-align: middle;
-  justify-content: right;
+    max-width: 100%;
+    min-height: 40vh;
+    vertical-align: middle;
+    justify-content: right;
 }
 
+
 /**first container area styling ends**/
 
 hr {
-  background-color: #fd7014;
-  width: 100px;
-  opacity: 1;
-  border: none;
-  height: 2px;
-  margin: auto;
+    background-color: #fd7014;
+    width: 100px;
+    opacity: 1;
+    border: none;
+    height: 2px;
+    margin: auto;
 }
 
-.home-card{
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
+.home-card {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
 }
 
 .event {
-  box-shadow: 0 1px 2px rgb(65, 64, 64);
-  border-radius: 15px;
+    box-shadow: 0 1px 2px rgb(65, 64, 64);
+    border-radius: 15px;
 }
 
 .event:hover {
-  box-shadow: 0 0px 10px rgb(250, 135, 4);
-  transition: all 0.3s linear;
+    box-shadow: 0 0px 10px rgb(250, 135, 4);
+    transition: all 0.3s linear;
 }
 
+
 /**Joinus container styling starts**/
 
 .joinus-anchor {
-  margin-left: 5%;
-  margin-top: 5vh;
+    margin-left: 5%;
+    margin-top: 5vh;
 }
 
-.joinus-cards > a {
-  text-decoration: none;
+.joinus-cards>a {
+    text-decoration: none;
 }
 
 .joinus-icons {
-  display: inline-block;
-  margin: 5% 40%;
-  font-size: 4rem;
-  color: #696969;
+    display: inline-block;
+    margin: 5% 40%;
+    font-size: 4rem;
+    color: #696969;
 }
 
 .joinus-card,
 .internships-card {
-  border-radius: 20px !important;
+    border-radius: 20px !important;
 }
 
 .joinus-cards h3 {
-  color: #fd7014;
-  font-family: "Roboto", sans-serif;
-  font-weight: 900;
+    color: #fd7014;
+    font-family: "Roboto", sans-serif;
+    font-weight: 900;
 }
 
 .joinus-card:hover {
-  box-shadow: 0 0px 6px rgb(250, 135, 4);
-  transition: all 0.3s linear;
-  transform: scale(1.05);
+    box-shadow: 0 0px 6px rgb(250, 135, 4);
+    transition: all 0.3s linear;
+    transform: scale(1.05);
 }
 
-.joinus-cards > a:hover .joinus-icons {
-  color: #fd7014;
+.joinus-cards>a:hover .joinus-icons {
+    color: #fd7014;
 }
+
+
 /**Joinus Styling ends**/
 
 .team-image {
-  border-radius: 50%;
-  max-width: 70%;
-  margin: 20px 40px;
-  border: #fd7014;
-  border-style: solid;
+    border-radius: 50%;
+    max-width: 70%;
+    margin: 20px 40px;
+    border: #fd7014;
+    border-style: solid;
 }
 
 .team-members {
-  height: 440px;
-  width: 98vw;
-  background-color: #d3d3d3;
-  text-align: center;
-  overflow: hidden;
-  margin: auto;
-  border: none !important;
+    height: 440px;
+    width: 98vw;
+    background-color: #d3d3d3;
+    text-align: center;
+    overflow: hidden;
+    margin: auto;
+    border: none !important;
 }
 
 .WeOffers ul {
-  list-style-type: disc;
-  line-height: 60px !important;
+    list-style-type: disc;
+    line-height: 60px !important;
 }
 
-.WeOffers > ul > li {
-  margin-left: 10%;
+.WeOffers>ul>li {
+    margin-left: 10%;
 }
 
 .Intrested {
-  margin-left: 25%;
+    margin-left: 25%;
 }
 
 .feedbacks {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-evenly;
-  flex-direction: row;
-  margin: auto;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-evenly;
+    flex-direction: row;
+    margin: auto;
 }
 
-.feedbacks > .card {
-  margin-top: 5vh;
+.feedbacks>.card {
+    margin-top: 5vh;
 }
 
 .feedback-image {
-  border-radius: 50%;
-  max-width: 50%;
-  margin: 20px 25%;
-  border: #fd7014;
-  border-style: solid;
+    border-radius: 50%;
+    max-width: 50%;
+    margin: 20px 25%;
+    border: #fd7014;
+    border-style: solid;
 }
 
 .faq-button {
-  background-color: #ffba8c;
+    background-color: #ffba8c;
 }
 
 .faq:hover {
-  box-shadow: 0 0px 3px rgb(250, 135, 4);
+    box-shadow: 0 0px 3px rgb(250, 135, 4);
 }
 
 form {
-  padding: 10px;
+    padding: 10px;
 }
 
 .form-container {
-  width: 600px;
-  height: auto;
-  padding: 10px;
-  background-image: url(./images/mail\ gif.gif);
-  background-size: cover;
-  border-radius: 15px;
+    width: 600px;
+    height: auto;
+    padding: 10px;
+    background-image: url(./images/mail\ gif.gif);
+    background-size: cover;
+    border-radius: 15px;
 }
 
-.form-container > form > input {
-  margin-top: 20px;
+.form-container>form>input {
+    margin-top: 20px;
 }
 
 .contact-us-image {
-  max-width: 45%;
+    max-width: 45%;
 }
 
 footer {
-  background-color: black;
-  bottom: 0;
+    background-color: black;
+    bottom: 0;
 }
 
 .footer-content {
-  color: white;
+    color: white;
 }
 
 .main-content {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-around;
-  padding: 20px;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    padding: 20px;
 }
 
 .about {
-  max-width: 30%;
+    max-width: 30%;
 }
 
-.quick-links > li,
-.contact-details > li {
-  list-style-type: none;
-  font-family: "Fira Sans", sans-serif;
-  line-height: 30px;
+.quick-links>li,
+.contact-details>li {
+    list-style-type: none;
+    font-family: "Fira Sans", sans-serif;
+    line-height: 30px;
 }
 
 .text {
-  color: #b3b3b3;
+    color: #b3b3b3;
 }
 
-.quick-links > li > a {
-  text-decoration: none;
-  color: #b3b3b3;
+.quick-links>li>a {
+    text-decoration: none;
+    color: #b3b3b3;
 }
 
-.quick-links > li > a:hover {
-  color: #fd7014;
+.quick-links>li>a:hover {
+    color: #fd7014;
 }
 
 .copyright-content {
-  margin-top: 50px;
-  text-align: center;
+    margin-top: 50px;
+    text-align: center;
 }
 
-.copyright-content > p > a {
-  color: #fd7014;
-  text-decoration: none;
+.copyright-content>p>a {
+    color: #fd7014;
+    text-decoration: none;
 }
+
+
 /* Toggle Switch styling starts here */
+
 .checkbox {
-  opacity: 0;
-  position: absolute;
+    opacity: 0;
+    position: absolute;
 }
 
 .label {
-  width: 44px;
-  height: 20px;
-  background-color:white;
-  border: 0.8px solid #4C4C4C;
-  display: flex;
-  border-radius:50px;
-  align-items: center;
-  justify-content: space-between;
-  padding: 5px;
-  position: relative;
-  transform: scale(1.5);
+    width: 44px;
+    height: 20px;
+    background-color: white;
+    border: 0.8px solid #4C4C4C;
+    display: flex;
+    border-radius: 50px;
+    align-items: center;
+    justify-content: space-between;
+    padding: 5px;
+    position: relative;
+    transform: scale(1.5);
 }
 
 .ball {
-  width: 14px;
-  height: 14px;
-  background-color: white;
-  position: absolute;
-  top: 2px;
-  left: 2px;
-  border: 1px solid #4C4C4C;
-  border-radius: 50%;
-  transition: transform 0.2s linear;
+    width: 14px;
+    height: 14px;
+    background-color: white;
+    position: absolute;
+    top: 2px;
+    left: 2px;
+    border: 1px solid #4C4C4C;
+    border-radius: 50%;
+    transition: transform 0.2s linear;
 }
 
+
 /*  target the elemenent after the label*/
-.checkbox:checked + .label .ball{
-  transform: translateX(24px);
+
+.checkbox:checked+.label .ball {
+    transform: translateX(24px);
 }
 
 .bi-moon {
-  color: black;
+    color: black;
 }
 
 .bi-sun {
-  color: white;
+    color: white;
 }
+
+
 /* Toggle Switch styling ends here */
 
+
 /* dark mode styling starts here */
-.dark-mode{
-  background-color: black;
-  color: white;
-}
-.dark-nav{
-  background-color: black;
-}
-.dark-anchor-tag{
-  color: white;
+
+.dark-mode {
+    background-color: black;
+    color: white;
 }
-.dark-anchor-tag:hover{
-  color: white;
+
+.dark-nav {
+    background-color: black;
 }
-.dark-card{
-  background-color: #121212;
+
+.dark-anchor-tag {
+    color: white;
 }
-.dark-card-2{
-  background-color: black;
+
+.dark-anchor-tag:hover {
+    color: white;
 }
-/* dark mode styling ends here */
 
-.WhyToJoin{
-  display: flex;
-  flex-direction: row;
-  justify-content: space-evenly;
+.dark-card {
+    background-color: #121212;
 }
 
-@media screen and (min-width: 601px) and (max-width: 604px){
-  .WeOffers ul {
-    font-size: 15px;
-  }
+.dark-card-2 {
+    background-color: black;
 }
 
-@media screen and (max-width: 600px) {
-  .WhyToJoin{
+
+/* dark mode styling ends here */
+
+.WhyToJoin {
     display: flex;
     flex-direction: row;
-    justify-content: center;
-  }
-
-  .WhyToJoin > .image {
-    display: none;
-  }
+    justify-content: space-evenly;
+}
 
-  .mobile-view > li {
-    font-size: small;
-    line-height: 15px;
-    margin-top: 18px;
-  }
 
-  .accordion {
-    width: 90% !important;
-    margin: auto;
-  }
+/* 992px is the breakpoint for large screens for bootstrap */
 
-  .contact-us-image {
-    max-width: 100%;
-    margin-top: 20px;
-  }
+@media screen and (max-width: 992px) {
+    .nav-item {
+        padding-left: 1.5rem;
+    }
+    .form-switch {
+        margin: 0.5rem 0.5rem 0.5rem -0.5rem;
+    }
+}
 
-  .about {
-    max-width: 80%;
-  }
+@media screen and (min-width: 601px) and (max-width: 604px) {
+    .WeOffers ul {
+        font-size: 15px;
+    }
 }
 
+@media screen and (max-width: 600px) {
+    .WhyToJoin {
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+    }
+    .WhyToJoin>.image {
+        display: none;
+    }
+    .mobile-view>li {
+        font-size: small;
+        line-height: 15px;
+        margin-top: 18px;
+    }
+    .accordion {
+        width: 90% !important;
+        margin: auto;
+    }
+    .contact-us-image {
+        max-width: 100%;
+        margin-top: 20px;
+    }
+    .about {
+        max-width: 80%;
+    }
+}
\ No newline at end of file
