diff --git a/src/Pages/Pathway/Pathway.jsx b/src/Pages/Pathway/Pathway.jsx
index 7e8f108d9..72a0e6838 100644
--- a/src/Pages/Pathway/Pathway.jsx
+++ b/src/Pages/Pathway/Pathway.jsx
@@ -1,21 +1,23 @@
 import React from 'react'
-import styles from "./Pathway.module.css"
-import Navbar from './components/menuBar/menubar'
-import Mainpage from './components/mainpage/mainpage'
-import Whatispathway from './components/what_is_pathway/what_is_pathway'
+import styles from './Pathway.module.css'
+import Navbar from './components/Navbar/menubar'
+import Mainpage from './components/HeroSection/mainpage'
+import Whatispathway from './components/About/About'
 import CourseOverview from './components/course Overview/CourseOverview'
 import Whoshouldattend from './components/WhoShouldAttend/WhoShouldAttend'
 import Contact from './components/contact/Contact'
 
 export default function Pathway() {
     return (
-        <div className={styles.pathway}>
+        <>
             <Navbar />
             <Mainpage />
-            <CourseOverview />
-            <Whoshouldattend />
-            <Whatispathway />
+            <div className={styles.pathway}>
+                <CourseOverview />
+                <Whoshouldattend />
+                <Whatispathway />
+            </div>
             <Contact />
-        </div>
+        </>
     )
 }
diff --git a/src/Pages/Pathway/Pathway.module.css b/src/Pages/Pathway/Pathway.module.css
index e69de29bb..f5d9e5e9c 100644
--- a/src/Pages/Pathway/Pathway.module.css
+++ b/src/Pages/Pathway/Pathway.module.css
@@ -0,0 +1,10 @@
+.pathway {
+    padding: 0 4rem;
+    background-color: #F5F5F5;
+}
+
+@media(width<=820px) {
+    .pathway {
+        padding: 0 1rem;
+    }
+}
\ No newline at end of file
diff --git a/src/Pages/Pathway/components/course Overview/assets/S1.png b/src/Pages/Pathway/assets/S1.png
similarity index 100%
rename from src/Pages/Pathway/components/course Overview/assets/S1.png
rename to src/Pages/Pathway/assets/S1.png
diff --git a/src/Pages/Pathway/components/course Overview/assets/arrow.png b/src/Pages/Pathway/assets/arrow.png
similarity index 100%
rename from src/Pages/Pathway/components/course Overview/assets/arrow.png
rename to src/Pages/Pathway/assets/arrow.png
diff --git a/src/Pages/Pathway/components/mainpage/assets/img2.webp b/src/Pages/Pathway/assets/img2.webp
similarity index 100%
rename from src/Pages/Pathway/components/mainpage/assets/img2.webp
rename to src/Pages/Pathway/assets/img2.webp
diff --git a/src/Pages/Pathway/components/what_is_pathway/assets/img3.webp b/src/Pages/Pathway/assets/img3.webp
similarity index 100%
rename from src/Pages/Pathway/components/what_is_pathway/assets/img3.webp
rename to src/Pages/Pathway/assets/img3.webp
diff --git a/src/Pages/Pathway/components/contact/assets/img4.webp b/src/Pages/Pathway/assets/img4.webp
similarity index 100%
rename from src/Pages/Pathway/components/contact/assets/img4.webp
rename to src/Pages/Pathway/assets/img4.webp
diff --git a/src/Pages/Pathway/components/WhoShouldAttend/assets/line.webp b/src/Pages/Pathway/assets/line.webp
similarity index 100%
rename from src/Pages/Pathway/components/WhoShouldAttend/assets/line.webp
rename to src/Pages/Pathway/assets/line.webp
diff --git a/src/Pages/Pathway/components/contact/assets/logo.png b/src/Pages/Pathway/assets/logo.png
similarity index 100%
rename from src/Pages/Pathway/components/contact/assets/logo.png
rename to src/Pages/Pathway/assets/logo.png
diff --git a/src/Pages/Pathway/components/menuBar/assets/logo.webp b/src/Pages/Pathway/assets/logo.webp
similarity index 100%
rename from src/Pages/Pathway/components/menuBar/assets/logo.webp
rename to src/Pages/Pathway/assets/logo.webp
diff --git a/src/Pages/Pathway/components/menuBar/assets/pre.png b/src/Pages/Pathway/assets/pre.png
similarity index 100%
rename from src/Pages/Pathway/components/menuBar/assets/pre.png
rename to src/Pages/Pathway/assets/pre.png
diff --git a/src/Pages/Pathway/components/course Overview/assets/s2.png b/src/Pages/Pathway/assets/s2.png
similarity index 100%
rename from src/Pages/Pathway/components/course Overview/assets/s2.png
rename to src/Pages/Pathway/assets/s2.png
diff --git a/src/Pages/Pathway/components/course Overview/assets/s3.png b/src/Pages/Pathway/assets/s3.png
similarity index 100%
rename from src/Pages/Pathway/components/course Overview/assets/s3.png
rename to src/Pages/Pathway/assets/s3.png
diff --git a/src/Pages/Pathway/components/course Overview/assets/s4.png b/src/Pages/Pathway/assets/s4.png
similarity index 100%
rename from src/Pages/Pathway/components/course Overview/assets/s4.png
rename to src/Pages/Pathway/assets/s4.png
diff --git a/src/Pages/Pathway/components/course Overview/assets/s5.png b/src/Pages/Pathway/assets/s5.png
similarity index 100%
rename from src/Pages/Pathway/components/course Overview/assets/s5.png
rename to src/Pages/Pathway/assets/s5.png
diff --git a/src/Pages/Pathway/components/what_is_pathway/what_is_pathway.jsx b/src/Pages/Pathway/components/About/About.jsx
similarity index 87%
rename from src/Pages/Pathway/components/what_is_pathway/what_is_pathway.jsx
rename to src/Pages/Pathway/components/About/About.jsx
index c455a581c..2f86864a8 100644
--- a/src/Pages/Pathway/components/what_is_pathway/what_is_pathway.jsx
+++ b/src/Pages/Pathway/components/About/About.jsx
@@ -1,18 +1,17 @@
 import React from "react"
-import styles from './whatIsPathway.module.css'
-import img3 from "./assets/img3.webp";
+import styles from './About.module.css'
+import img3 from "../../assets/img3.webp";
 
-export default function what_is_pathway() {
+export default function About() {
     return (
-        <div>
+        <div id="about" className={styles.About}>
             <div class={styles.Overview_container_head}>
                 <hr />
                 <p>What is Pathway</p>
-                <hr />
             </div>
             <div class={styles.WhatIsPathway_main}>
                 <div class={styles.WhatIsPathway_img}>
-                    <img src={img3} />
+                    <img src={img3} alt="" />
                 </div>
                 <div class={styles.WhatIsPathway_desc}>
                     <p>
diff --git a/src/Pages/Pathway/components/what_is_pathway/whatIsPathway.module.css b/src/Pages/Pathway/components/About/About.module.css
similarity index 50%
rename from src/Pages/Pathway/components/what_is_pathway/whatIsPathway.module.css
rename to src/Pages/Pathway/components/About/About.module.css
index fdbd1ca79..c38d6ea7f 100644
--- a/src/Pages/Pathway/components/what_is_pathway/whatIsPathway.module.css
+++ b/src/Pages/Pathway/components/About/About.module.css
@@ -1,20 +1,30 @@
+.About{
+    padding: 1rem 0;
+}
+
 .Overview_container_head {
     display: flex;
     justify-content: center;
     align-items: center;
-    padding: 3rem;
+    padding: 5rem;
     gap: 2rem;
+    position: relative;
 }
 
 .Overview_container_head hr {
-    width: 25%;
-    color: blue;
+    width: 100%;
+    background-color: #1C1CF0;
+    height: .25rem;
 }
 
 .Overview_container_head p {
+    position: absolute;
+    background-color: #F5F5F5;
+    padding: 0 1.5rem;
     color: #000;
     font-size: 3rem;
-    font-weight: 700;
+    font-weight: 900;
+    width: max-content;
 }
 
 .WhatIsPathway_main {
@@ -24,7 +34,6 @@
     padding-left: 3rem;
     padding-right: 8rem;
     margin: 3rem;
-
 }
 
 .WhatIsPathway_img img {
@@ -45,37 +54,3 @@
 .WhatIsPathway_desc span {
     font-weight: 800;
 }
-
-@media (width<1000px) {
-    .Overview_container_head p {
-        font-size: 1rem;
-    }
-
-    /* .Overview_container_head hr{
-        width: 7rem;
-    }*/
-    .Overview_container_head {
-        padding: 1rem;
-        gap: 1rem;
-
-    }
-
-    .WhatIsPathway_main {
-        font-size: .8rem;
-        gap: 2rem;
-        padding: 1.5rem;
-        margin: 0;
-        padding-left: 1rem;
-        padding-right: .6rem;
-        flex-direction: column;
-
-    }
-
-    .WhatIsPathway_desc {
-        width: 100%;
-    }
-
-    .WhatIsPathway_img {
-        margin-left: -2rem;
-    }
-}
\ No newline at end of file
diff --git a/src/Pages/Pathway/components/mainpage/mainpage.jsx b/src/Pages/Pathway/components/HeroSection/mainpage.jsx
similarity index 51%
rename from src/Pages/Pathway/components/mainpage/mainpage.jsx
rename to src/Pages/Pathway/components/HeroSection/mainpage.jsx
index 43d29d55f..eb82a2ff3 100644
--- a/src/Pages/Pathway/components/mainpage/mainpage.jsx
+++ b/src/Pages/Pathway/components/HeroSection/mainpage.jsx
@@ -1,38 +1,36 @@
 import React from "react"
 import styles from "./mainpage.module.css"
-import img2 from "./assets/img2.webp";
-import pre from "./assets/pre.png";
+import img2 from "../../assets/img2.webp";
+import pre from "../../assets/pre.png";
 
 export default function mainpage() {
     return (
-        <div className={styles.mainpage}>
-            <section class={styles.First}>
-                <div class={styles.Container}>
+        <div id="heroSection" className={styles.mainpage}>
+            <section className={styles.First}>
+                <div className={styles.Container}>
                     <div className={styles.Container_image_one}>
                         <img src={img2} />
                     </div>
-                    <div class={styles.Container_desc}>
-                        <div class={styles.Container_head}>
+                    <div className={styles.Container_desc}>
+                        <div className={styles.Container_head}>
                             Breaking into <br />
                             <span className={styles.Head_two}>Artificial<br />Intelligence</span>
                         </div>
-                        <div class={styles.Container_img_two}>
+                        <div className={styles.Container_img_two}>
                             A µLearn x <span style={{ color: "#39D3F4", backgroundColor: "transparent" }}>Pathway</span> Initiative.
                         </div>
-                        <div class={styles.Container_button}>
-                            <button class={styles.Container_button_one}>
+                        <div className={styles.Container_button}>
+                            <button className={styles.Container_button_one}>
                                 <img src={pre} alt="" /> Pre apply
                             </button>
-                            <button class={styles.Container_button_two}>Explore Beta</button>
+                            <button className={styles.Container_button_two}>Explore Beta</button>
                         </div>
                     </div>
                 </div>
-                <div class={styles.Lower_desc}>
-                    <p class={styles.desc}>
-                        Join us on an exciting adventure into the world of <b>Artificial Intelligence (AI)</b> through our collaborative <br />
-                        initiative with Pathway. In this comprehensive course.
-                    </p>
-                </div>
+                <p className={styles.desc}>
+                    Join us on an exciting adventure into the world of <b>Artificial Intelligence (AI)</b> through our collaborative <br />
+                    initiative with Pathway. In this comprehensive course.
+                </p>
             </section>
             <p className={styles.Lower_red}>
                 Only <b> 20 individuals </b> will be selected for the <b> beta cohort,</b> while the remaining applicants will be placed on a waiting list.
diff --git a/src/Pages/Pathway/components/mainpage/mainpage.module.css b/src/Pages/Pathway/components/HeroSection/mainpage.module.css
similarity index 84%
rename from src/Pages/Pathway/components/mainpage/mainpage.module.css
rename to src/Pages/Pathway/components/HeroSection/mainpage.module.css
index 5867c5aa8..4c32e22ec 100644
--- a/src/Pages/Pathway/components/mainpage/mainpage.module.css
+++ b/src/Pages/Pathway/components/HeroSection/mainpage.module.css
@@ -15,6 +15,7 @@
     justify-content: center;
     align-items: center;
     flex-direction: column;
+    gap: 1rem;
 }
 
 .Container {
@@ -23,6 +24,7 @@
     align-items: center;
     flex-direction: row;
     padding: 0 4rem;
+    gap: 1rem;
 }
 
 .Container_image_one {
@@ -102,11 +104,8 @@
     gap: 2rem;
 }
 
-.Lower_desc {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
+.desc {
+    width: 100%;
     text-align: center;
     font-size: 1.2rem;
 }
@@ -126,4 +125,31 @@
 .Lower_red b {
     background-color: #DC280B;
     padding: 0 .3rem;
+}
+
+@media(width<=820px) {
+    .Container {
+        flex-direction: column;
+    }
+
+    .Container_image_one {
+        width: 100%;
+    }
+
+    .Container_desc {
+        width: 100%;
+    }
+
+    .Container_head {
+        font-size: 4rem;
+        line-height: 4rem;
+    }
+
+    .desc {
+        font-size: 1rem;
+    }
+
+    .Lower_red {
+        font-size: .8rem;
+    }
 }
\ No newline at end of file
diff --git a/src/Pages/Pathway/components/Navbar/menubar.jsx b/src/Pages/Pathway/components/Navbar/menubar.jsx
new file mode 100644
index 000000000..dcef0eab5
--- /dev/null
+++ b/src/Pages/Pathway/components/Navbar/menubar.jsx
@@ -0,0 +1,41 @@
+import React from "react";
+import styles from './menubar.module.css';
+import img4 from "../../assets/logo.webp";
+import pre from '../../assets/pre.png';
+
+export default function Menubar() {
+    const navbar = React.useRef(null)
+
+    React.useEffect(() => {
+        var prevScrollpos = window.pageYOffset;
+        window.onscroll = function () {
+            var currentScrollPos = window.pageYOffset;
+            if (prevScrollpos > currentScrollPos) {
+                navbar.current.style.top = "0";
+            } else {
+                navbar.current.style.top = "-150px";
+            }
+            prevScrollpos = currentScrollPos;
+        }
+    }, [])
+
+    return (
+        <div ref={navbar} className={styles.menu_bar}>
+            <div className={styles.logo}>
+                <a href=""><img src={img4} alt="Logo" /></a>
+            </div>
+            <div className={styles.menu}>
+                <a href="#heroSection">Home</a>
+                <a href="#Course">Course Overview</a>
+                <a href="#who">Who Should Attend?</a>
+                <a href="#about">About Pathway</a>
+            </div>
+            <div className={styles.pre_rg}>
+                <a href="">
+                    <img src={pre} alt="Pre-register" />
+                    Pre-register
+                </a>
+            </div>
+        </div>
+    );
+}
diff --git a/src/Pages/Pathway/components/menuBar/menubar.module.css b/src/Pages/Pathway/components/Navbar/menubar.module.css
similarity index 68%
rename from src/Pages/Pathway/components/menuBar/menubar.module.css
rename to src/Pages/Pathway/components/Navbar/menubar.module.css
index 21a3276d8..92110c802 100644
--- a/src/Pages/Pathway/components/menuBar/menubar.module.css
+++ b/src/Pages/Pathway/components/Navbar/menubar.module.css
@@ -3,12 +3,13 @@
     top: 0;
     display: flex;
     width: 100%;
-    padding: 2rem 0;
-    justify-content: space-around;
+    padding: 2rem;
+    justify-content: space-between;
     align-items: center;
     background-color: #fff;
     box-shadow: 0px 0px 10px rgba(0, 0, 0, .25);
     z-index: 1;
+    transition: all .5s ease-in-out;
 }
 
 .menu_bar a {
@@ -43,4 +44,23 @@
 
 .pre_rg a img {
     background-color: #DC280B;
+}
+
+@media(width<=820px) {
+    .menu_bar {
+        padding: 1rem;
+    }
+
+    .logo img {
+        height: 1rem;
+    }
+
+    .menu {
+        display: none;
+    }
+
+    .pre_rg a {
+        border-radius: .4rem;
+        padding: .5rem 1rem;
+    }
 }
\ No newline at end of file
diff --git a/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.jsx b/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.jsx
index 43f1dfc84..9c72cc65b 100644
--- a/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.jsx
+++ b/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.jsx
@@ -1,74 +1,58 @@
 import React from "react"
 import styles from './WhoShouldAttend.module.css'
-import line from './assets/line.webp';
+import line from '../../assets/line.webp';
+
+const content = [
+    {
+        id: 1,
+        title: "Students interested in AI and machine learning.",
+        desc: "I need latency to be milliseconds or seconds, but my batch job is taking minutes or hours to run each time."
+    },
+    {
+        id: 2,
+        title: "Professionals seeking to upskill in AI.",
+        desc: "I need latency to be milliseconds or seconds, but my batch job is taking minutes or hours to run each time."
+    },
+    {
+        id: 3,
+        title: "Enthusiasts eager to explore LLMs and AI frameworks.",
+        desc: "I need latency to be milliseconds or seconds, but my batch job is taking minutes or hours to run each time."
+    },
+    {
+        id: 4,
+        title: "Anyone looking to break into the exciting world of AI",
+        desc: "I need latency to be milliseconds or seconds, but my batch job is taking minutes or hours to run each time."
+    }
+]
 
 export default function WhoShouldAttend() {
     return (
-        <div>
-            <section className={styles.third}>
-                <div className={styles.Overview_container_head}>
-                    <hr />
-                    <p>Who should Attend?</p>
-                    <hr />
-                </div>
-                <div className={styles.sec}>
-                    <div className={styles.sec_one}>
-                        <div className={styles.sec_two}>
-                            <div className={styles.section_top}>
-                                <p>Students interested in AI and machine learning.</p>
-                            </div>
-                            <div className={styles.section_mid}>
-                                <img src={line} />
-                            </div>
-                        </div>
-                        <div className={styles.section_bottom}>
-                            <p>I need latency to be <br />milliseconds or seconds, but my<br />batch job is taking minutes or<br />hours to run each time.</p>
-                        </div>
-                    </div>
-                    <div className={styles.sec_one}>
-                        <div className={styles.sec_two}>
-                            <div className={styles.section_top}>
-                                <p>Students interested in AI and machine learning.</p>
-                            </div>
-                            <div className={styles.section_mid}>
-                                <img src={line} alt="" />
-                            </div>
-                        </div>
-                        <div className={styles.section_bottom}>
-                            <p>I need latency to be <br />milliseconds or seconds, but my<br />batch job is taking minutes or<br />hours to run each time.</p>
-                        </div>
-                    </div>
-                    <div className={styles.sec_one}>
-                        <div className={styles.sec_two}>
-                            <div className={styles.section_top}>
-                                <p>Students interested in AI and machine learning.</p>
-                            </div>
-                            <div className={styles.section_mid}>
-                                <img src={line} alt="" srcset="" />
-                            </div>
-                        </div>
-                        <div className={styles.section_bottom}>
-                            <p>
-                                I need latency to be <br />milliseconds or seconds, but my<br />batch job is taking minutes or<br />hours to run each time.
-                            </p>
-                        </div>
-                    </div>
-                    <div className={styles.sec_one}>
-                        <div className={styles.sec_two}>
-                            <div className={styles.section_top}>
-                                <p>Students interested in AI and machine learning.</p>
-                            </div>
-                            <div className={styles.section_mid}>
-                                <img src={line} alt="" />
-                            </div>
-                        </div>
-                        <div className={styles.section_bottom}>
-                            <p>I need latency to be <br />milliseconds or seconds, but my<br />batch job is taking minutes or<br />hours to run each time.</p>
-                        </div>
-                    </div>
-                </div>
-            </section>
-
-        </div>
+        <section id="who" className={styles.WhoShouldAttend}>
+            <div className={styles.Overview_container_head}>
+                <hr />
+                <p>Who should Attend?</p>
+            </div>
+            <div className={styles.section}>
+                {
+                    content.map((item, index) => {
+                        return (
+                            <div key={index} className={styles.container}>
+                                <div className={styles.box}>
+                                    <b className={styles.box_top}>
+                                        {item.title}
+                                    </b>
+                                    <div className={styles.box_mid}>
+                                        <img src={line} alt="line"/>
+                                    </div>
+                                </div>
+                                <div className={styles.box_bottom}>
+                                    <p>{item.desc}</p>
+                                </div>
+                            </div>
+                        )
+                    })
+                }
+            </div>
+        </section>
     )
 }
diff --git a/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.module.css b/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.module.css
index 6b8ce90db..e26dc4823 100644
--- a/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.module.css
+++ b/src/Pages/Pathway/components/WhoShouldAttend/WhoShouldAttend.module.css
@@ -1,4 +1,4 @@
-.third {
+.WhoShouldAttend {
     background: #F5F5F5;
 }
 
@@ -6,72 +6,70 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    padding: 3rem;
+    padding: 5rem;
     gap: 2rem;
+    position: relative;
 }
 
 .Overview_container_head hr {
-    width: 25%;
-    color: blue;
+    width: 100%;
+    background-color: #1C1CF0;
+    height: .25rem;
 }
 
 .Overview_container_head p {
+    position: absolute;
     color: #000;
+    background-color: #F5F5F5;
+    padding: 0 1.5rem;
     font-size: 3rem;
-    font-weight: 700;
+    font-weight: 900;
+    width: max-content;
 }
 
-.sec {
+.section{
     display: flex;
     justify-content: center;
     align-items: center;
-    flex-direction: row;
-    padding: 3rem;
-}
-
-.section_top {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 60%;
-    height: 6rem;
-    background-color: blue;
-    padding: 1rem;
-    border-radius: 8px;
-    color: white;
+    gap: 2rem;
+    padding: 1rem 2rem; 
 }
 
-.sec_one {
+.container {
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
+    text-align: center;
 }
 
-.sec_two {
+.container .box{
     display: flex;
-    justify-content: center;
-    align-items: center;
     flex-direction: column;
-}
-
-.section_mid {
-    display: flex;
-    justify-content: center;
     align-items: center;
-    width: 20%;
+    margin-bottom: 1rem;
 }
 
-.section_mid img {
-    width: 20%;
+.container .box_bottom {
+    width: 70%;
 }
 
-.section_bottom {
+.container .box_top {
+    background-color: #1C1CF0;
+    padding: 1rem;
+    height: 5rem;
+    color: #fff;
     display: flex;
     justify-content: center;
     align-items: center;
+    border-bottom-right-radius: 1rem;
+    border-top-left-radius: 1rem;
 }
 
+.container .box_mid img{
+    height: 8rem;
+} 
+
 @media (width<1000px) {
     .Overview_container_head p {
         font-size: 1rem;
diff --git a/src/Pages/Pathway/components/contact/Contact.jsx b/src/Pages/Pathway/components/contact/Contact.jsx
index 54846fe4a..59bf16ab9 100644
--- a/src/Pages/Pathway/components/contact/Contact.jsx
+++ b/src/Pages/Pathway/components/contact/Contact.jsx
@@ -1,9 +1,46 @@
 import React from "react"
 import styles from "./Contact.module.css"
-import img4 from "./assets/img4.webp";
-import logo from "./assets/logo.png";
+import img4 from "../../assets/img4.webp";
 
-const Contact = () => {
+const links = [
+    {
+        id: 1,
+        title: "Company",
+        l1: "Features",
+        l2: "Success Stories",
+        l3: "Our Story",
+        l4: "Careers",
+        l5: "Events",
+    },
+    {
+        id: 2,
+        title: "Developers",
+        l1: "Documentation",
+        l2: "Tutorials",
+        l3: "Showcases",
+    },
+    {
+        id: 3,
+        title: "About",
+        l1: "Legal & GDPR",
+        l2: "Equal opportunity employer",
+        l3: "Privacy policy",
+        l4: "Licensing",
+        l5: "Glossary",
+    },
+    {
+        id: 4,
+        title: "Contact",
+        l1: "Pathway",
+        l2: "96bis Boulevard Raspail",
+        l3: "Agoranov",
+        l4: "75006 Paris",
+        l5: "France",
+        l6: "contact@pathway.com"
+    }
+]
+
+export default function Contact() {
     return (
         <>
             <div className={styles.ContactUs}>
@@ -11,57 +48,25 @@ const Contact = () => {
                     <img src={img4} />
                 </div>
                 <div className={styles.ContactList}>
-                    <div className={styles.ContactHead}>
-                        <div className={styles.Company}>Company</div>
-                        <div className={styles.Developers}>Developers</div>
-                        <div className={styles.About}>About</div>
-                        <div className={styles.Contact}>Contact</div>
-
-                    </div>
-                    <hr/>
-                        <div className={styles.contactLists}>
-                            <div>
-                                <ul>
-                                    <li>Features</li>
-                                    <li>Success Stories</li>
-                                    <li>Our Story</li>
-                                    <li>Careers</li>
-                                    <li>Events</li>
-                                </ul>
-                            </div>
-                            <div>
-                                <ul>
-                                    <li>Documentation</li>
-                                    <li>Tutorials</li>
-                                    <li>Showcases</li>
-                                </ul>
-                            </div>
-                            <div>
-                                <ul>
-                                    <li>Legal & GDPR</li>
-                                    <li>Equal opportunity employer</li>
-                                    <li>Privacy policy</li>
-                                    <li>Licensing</li>
-                                    <li>Glossary</li>
-                                </ul>
-                            </div>
-                            <div>
-                                <ul>
-                                    <li>Pathway</li>
-                                    <li>96bis Boulevard Raspail</li>
-                                    <li>Agoranov</li>
-                                    <li>75006 Paris</li>
-                                    <li>France</li>
-                                    <li>contact@pathway.com</li>
-                                </ul>
-                            </div>
-
-                        </div>
+                    {
+                        links.map((link) => {
+                            return (
+                                <div className={styles.list}>
+                                    <p className={styles.ContactHead}>{link.title}</p>
+                                    <ul>
+                                        {link.l1 ? <li><a href="#">{link.l1}</a></li> : null}
+                                        {link.l2 ? <li><a href="#">{link.l2}</a></li> : null}
+                                        {link.l3 ? <li><a href="#">{link.l3}</a></li> : null}
+                                        {link.l4 ? <li><a href="#">{link.l4}</a></li> : null}
+                                        {link.l5 ? <li><a href="#">{link.l5}</a></li> : null}
+                                        {link.l6 ? <li style={{ textDecoration: "underline", color: "#1C1CF0" }}> <a href="#">{link.l6}</a> </li> : null}
+                                    </ul>
+                                </div>
+                            )
+                        })
+                    }
                 </div>
             </div>
-
         </>
     )
 }
-
-export default Contact
diff --git a/src/Pages/Pathway/components/contact/Contact.module.css b/src/Pages/Pathway/components/contact/Contact.module.css
index 3538a05b3..6f8caf71c 100644
--- a/src/Pages/Pathway/components/contact/Contact.module.css
+++ b/src/Pages/Pathway/components/contact/Contact.module.css
@@ -1,43 +1,39 @@
-@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&display=swap');
-
-*{
-    margin: 0;
-    padding: 0;
-    box-sizing: border-box;
-    font-family: 'Plus Jakarta Sans', sans-serif;
-    background: #F5F5F5;
-
-}
-.ContactUs{
+.ContactUs {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 3rem;
-    padding: 4rem;
+    margin-top: -1rem;
+    padding: 3rem;
+    background-color: #f5f5f5;
 }
-.Contact img{
-    width: 50%;
 
+.Contact img {
+    height: 3rem;
 }
-.ContactHead{
+
+.ContactList {
+    width: 70%;
     display: flex;
-    justify-content: space-evenly;
-    gap: 10rem;
-    align-items: center;
-    color: blue;
-    font-weight: 600;
 }
-.contactLists{
-    display: flex;
-    justify-content: space-evenly;
-    align-items: center;
-    font-size: .8rem;
-    gap: 2rem;
+
+.list {
+    width: 100%;
+}
+
+.ContactHead {
+    color: #1C1CF0;
+    font-weight: 700;
+    border-bottom: 1px solid #1C1CF0;
 }
-.contactLists ul{
+
+.ContactList ul {
     list-style: none;
     width: 100%;
 }
-.contactLists div{
-    width: 40%;
+
+.ContactList ul li {
+    font-size: .9rem;
+    color: #3F3F46;
+    line-height: 1.1rem;
 }
\ No newline at end of file
diff --git a/src/Pages/Pathway/components/course Overview/CourseOverview.jsx b/src/Pages/Pathway/components/course Overview/CourseOverview.jsx
index 7fa82483f..8ea2e8dac 100644
--- a/src/Pages/Pathway/components/course Overview/CourseOverview.jsx	
+++ b/src/Pages/Pathway/components/course Overview/CourseOverview.jsx	
@@ -1,71 +1,83 @@
 import React from "react"
 import styles from "./CourseOverview.module.css"
-import s1 from './assets/S1.png'
-import arrow from './assets/arrow.png'
+import arrow from '../../assets/arrow.png'
+import s1 from '../../assets/S1.png'
+import s2 from '../../assets/s2.png'
+import s3 from '../../assets/s3.png'
+import s4 from '../../assets/s4.png'
+import s5 from '../../assets/s5.png'
 
 const content = [
     {
         id: 1,
         title: "Stage 1",
-        desc: "Dive deep into the foundations of AI with a focus on Large Language Models (LLMs).",
-        icon: "./assets/S1.png"
+        desc: "Dive deep into the foundations of AI with a focus on",
+        bold: "Large Language Models (LLMs).",
+        icon: s1
     },
     {
         id: 2,
         title: "Stage 2",
-        desc: "Master LLMs and their real-world applications.",
-        icon: "./assets/S2.png"
+        desc: "Master LLMs and their",
+        bold: "real-world applications.",
+        icon: s2
     },
     {
         id: 3,
         title: "Stage 3",
-        desc: "Explore the magic of word vectors and their role in understanding language.",
-        icon: "./assets/S3.png"
+        desc: "Explore the magic of",
+        bold: "word vectors",
+        desc2: "and their role in understanding language.",
+        icon: s3
     },
     {
         id: 4,
         title: "Stage 4",
-        desc: "Harness the potential of LLM data pipelines for AI-driven insights.",
-        icon: "./assets/S4.png"
+        desc: "Harness the potential of",
+        bold: "LLM data pipelines",
+        desc2: "for AI-driven insights.",
+        icon: s4
     },
     {
         id: 5,
         title: "Stage 5",
-        desc: "Embark on a hands-on journey to build your own LLM-powered app using the cutting-edge Pathway framework.",
-        icon: "./assets/S5.png"
+        desc: "Embark on a hands-on journey to",
+        bold: "build your own LLM-powered app",
+        desc2: "using the cutting-edge Pathway framework.",
+        icon: s5
     },
 ]
 
-const CourseOverview = () => {
+export default function CourseOverview() {
     return (
-        <section className={styles.Two}>
+        <section id="Course" className={styles.Two}>
             <div className={styles.Overview_container}>
                 <div className={styles.Overview_container_head}>
                     <hr />
                     <p>Course Overview</p>
-                    <hr />
                 </div>
                 <div className={styles.Overview_desc}>
                     {
-                        content.map((item) => {
+                        content.map((item, key) => {
                             return (
-                                <div className={styles.course}>
+                                <div key={key} className={styles.course}>
                                     <div className={styles.Course_desc}>
-                                        <img src={s1} alt="" />
-                                        <p>{item.desc}</p>
+                                        <img src={item.icon} alt="" />
+                                        <p>
+                                            {item.desc}
+                                            <b> {item.bold} </b>
+                                            {item.desc2 ? item.desc2 : null}
+                                        </p>
                                     </div>
                                     <div className={styles.stage}>
                                         {item.title} <img src={arrow} alt="" />
                                     </div>
                                 </div>
                             )
-                        }
-                        )
+                        })
                     }
                 </div>
             </div>
         </section>
     )
 }
-
-export default CourseOverview
diff --git a/src/Pages/Pathway/components/course Overview/CourseOverview.module.css b/src/Pages/Pathway/components/course Overview/CourseOverview.module.css
index bfdb1fdc3..b61a5076e 100644
--- a/src/Pages/Pathway/components/course Overview/CourseOverview.module.css	
+++ b/src/Pages/Pathway/components/course Overview/CourseOverview.module.css	
@@ -2,20 +2,24 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    padding: 3rem;
+    padding: 5rem;
     gap: 2rem;
+    position: relative;
 }
 
 .Overview_container_head hr {
-    width: 25%;
+    width: 100%;
     background-color: #1C1CF0;
     height: .25rem;
 }
 
 .Overview_container_head p {
+    position: absolute;
+    background-color: #F5F5F5;
+    padding: 0 1.5rem;
     color: #000;
     font-size: 3rem;
-    font-weight: 700;
+    font-weight: 900;
     width: max-content;
 }
 
@@ -23,44 +27,37 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    flex-direction: row;
-    gap: 1rem;
+    gap: 2rem;
     padding: 1rem;
-    width: 50%;
 }
 
 .Overview_desc .course {
     box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
     padding: 1.5rem;
     border-radius: .5rem;
+    width: 50%;
+    height: 16rem;
+    font-weight: 500;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    gap: .5rem;
 }
 
-.Course_desc {
+.Overview_desc .course .Course_desc {
     display: flex;
     gap: .5rem;
 }
 
-.stage {
+.Overview_desc .course .Course_desc img {
+    width: 2.5rem;
+    height: 2.5rem;
+}
+
+.Overview_desc .course .stage {
     color: #E4311C;
     font-weight: 900;
     display: flex;
     align-items: center;
     gap: .5rem;
 }
-
-@media (width<1000px) {
-    .Overview_container_head p {
-        font-size: 1rem;
-    }
-
-    .Overview_container_head {
-        padding: 1rem;
-        gap: 1rem;
-    }
-
-    .Overview_desc {
-        width: 100%;
-        flex-direction: column;
-    }
-
-}
\ No newline at end of file
diff --git a/src/Pages/Pathway/components/mainpage/assets/img1.webp b/src/Pages/Pathway/components/mainpage/assets/img1.webp
deleted file mode 100644
index 7c5f54004..000000000
Binary files a/src/Pages/Pathway/components/mainpage/assets/img1.webp and /dev/null differ
diff --git a/src/Pages/Pathway/components/mainpage/assets/pre.png b/src/Pages/Pathway/components/mainpage/assets/pre.png
deleted file mode 100644
index a3573470f..000000000
Binary files a/src/Pages/Pathway/components/mainpage/assets/pre.png and /dev/null differ
diff --git a/src/Pages/Pathway/components/menuBar/menubar.jsx b/src/Pages/Pathway/components/menuBar/menubar.jsx
deleted file mode 100644
index d67c38d03..000000000
--- a/src/Pages/Pathway/components/menuBar/menubar.jsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React from "react"
-import styles from './menubar.module.css'
-import img4 from "./assets/logo.webp";
-import pre from './assets/pre.png'
-
-export default function menubar() {
-    return (
-        <div class={styles.menu_bar}>
-            <div class={styles.logo}>
-                <a href="#"><img src={img4} /></a>
-            </div>
-            <div class={styles.menu}>
-                <a href="#">Home</a>
-                <a href="#">Course Overview</a>
-                <a href="#">Who Should Attend?</a>
-                <a href="#">About Pathway</a>
-            </div>
-            <div class={styles.pre_rg}>
-                <a href="#">
-                    <img src={pre} alt="" />
-                    Pre-register
-                </a>
-            </div>
-        </div>
-    )
-}
-