diff --git a/src/app/(main)/globals.css b/src/app/(main)/globals.css
index 7768b0a..3979b74 100644
--- a/src/app/(main)/globals.css
+++ b/src/app/(main)/globals.css
@@ -39,6 +39,8 @@
   --color-colorBtnPrimaryText: var(--color-colorExt20);
   --color-colorBtnSecondary: var(--color-colorExt50);
   --color-colorBtnSecondaryText: var(--color-colorExt20);
+  --color-colorLinkText1: var(--color-colorExt30);
+  --color-colorLinkText2: var(--color-colorext40);
 }
 
 @layer components {
diff --git a/src/components/layouts/Header.tsx b/src/components/layouts/Header.tsx
index a6d1081..9bc29a4 100644
--- a/src/components/layouts/Header.tsx
+++ b/src/components/layouts/Header.tsx
@@ -1,18 +1,7 @@
-import { headers } from "next/headers";
-import HeaderFeaturedHomes from "./HeaderFeaturedHomes";
 import { HeaderDropdown, HeaderDropdownGroup, HeaderDropdownMenu } from "./HeaderDropdown";
+import HeaderFeaturedHomes from "./HeaderFeaturedHomes";
 
-export default async function Header() {
-  const headerList = await headers();
-  const fullUrl = headerList.get("x-full-url");
-
-  const headerActive = (pathName: string) => {
-    if (!fullUrl) return "";
-    const splittedUrl = fullUrl.split("/");
-
-    return splittedUrl[3] === pathName ? "active" : "";
-  };
-
+export default function Header() {
   return (
     <header className="section page-header">
       <div className="rd-navbar-wrap">
@@ -113,6 +102,108 @@ export default async function Header() {
                     <a className="rd-nav-link rd-nav-link-custom" href="#">
                       Buying / Selling
                     </a>
+                    <HeaderDropdown>
+                      <HeaderDropdownGroup>
+                        <div className="pr-2">
+                          <form>
+                            <div className="form-wrap">
+                              <input type="text" id="search" className="form-input" />
+                              <label className="form-label" htmlFor="search">
+                                Search
+                              </label>
+                            </div>
+                          </form>
+                        </div>
+                        <div className="mt-2">
+                          <HeaderFeaturedHomes />
+                        </div>
+                      </HeaderDropdownGroup>
+                      <HeaderDropdownGroup title="Why Dynamic?">
+                        <HeaderDropdownMenu
+                          list={[
+                            {
+                              title:
+                                "Committed to providing a personalized structure to each client, with on-site management & a robust property management",
+                            },
+                            {
+                              title:
+                                "We strive to provide a service that meets the needs of all our customers & are proud to have been helping people with their real estate needs for the past 20 years",
+                            },
+                            {
+                              title:
+                                "We understand the real estate sector inside out & are committed to providing a professional service to our clients. We strive to make the process of reaching your real estate goals as easy & stress-free as possible",
+                            },
+                          ]}
+                        />
+                      </HeaderDropdownGroup>
+                      <HeaderDropdownGroup title="Future Owners">
+                        <HeaderDropdownMenu
+                          list={[
+                            {
+                              title: "Moving In",
+                              child: [
+                                {
+                                  title: "What To Be Done Prior",
+                                  href: "#",
+                                },
+                                {
+                                  title: "Next Steps (keys, utilities, etc)",
+                                  href: "#",
+                                },
+                                {
+                                  title: "Common Questions",
+                                  href: "#",
+                                },
+                              ],
+                            },
+                            {
+                              title: "Welcome home",
+                              child: [
+                                {
+                                  title: "Payment",
+                                  href: "#",
+                                },
+                                {
+                                  title: "Utilities",
+                                  href: "#",
+                                },
+                                {
+                                  title: "Maintenance",
+                                  href: "#",
+                                },
+                              ],
+                            },
+                            {
+                              title: "Moving Out",
+                              child: [
+                                {
+                                  title: "What To Be Done Prior",
+                                  href: "#",
+                                },
+                                {
+                                  title: "Next Steps (keys, utilities, etc)",
+                                  href: "#",
+                                },
+                                {
+                                  title: "Common Questions",
+                                  href: "#",
+                                },
+                              ],
+                            },
+                          ]}
+                        />
+                      </HeaderDropdownGroup>
+                      <HeaderDropdownGroup className="flex! pr-4!">
+                        <div className="flex flex-col self-end!">
+                          <a className="button button-secondary" href="/">
+                            FAQ
+                          </a>
+                          <a className="button button-primary mt-2!" href="/">
+                            LOOKING FOR SELL
+                          </a>
+                        </div>
+                      </HeaderDropdownGroup>
+                    </HeaderDropdown>
                   </li>
                   <li className="rd-nav-item">
                     <a className="rd-nav-link rd-nav-link-custom" href="#">
@@ -139,22 +230,22 @@ export default async function Header() {
                           list={[
                             {
                               title: "Our Rentals",
-                              href: "/#",
+                              href: "#",
                             },
                             {
                               title: "Application Process",
                               child: [
                                 {
                                   title: "Before You Apply",
-                                  href: "/#",
+                                  href: "#",
                                 },
                                 {
                                   title: "Rental Criteria",
-                                  href: "/#",
+                                  href: "#",
                                 },
                                 {
                                   title: "Before You Apply",
-                                  href: "/#",
+                                  href: "#",
                                 },
                               ],
                             },
@@ -169,15 +260,15 @@ export default async function Header() {
                               child: [
                                 {
                                   title: "What To Be Done Prior",
-                                  href: "/#",
+                                  href: "#",
                                 },
                                 {
                                   title: "Next Steps (keys, utilities, etc)",
-                                  href: "/#",
+                                  href: "#",
                                 },
                                 {
                                   title: "Common Questions",
-                                  href: "/#",
+                                  href: "#",
                                 },
                               ],
                             },
@@ -203,15 +294,15 @@ export default async function Header() {
                               child: [
                                 {
                                   title: "What To Be Done Prior",
-                                  href: "/#",
+                                  href: "#",
                                 },
                                 {
                                   title: "Next Steps (keys, utilities, etc)",
-                                  href: "/#",
+                                  href: "#",
                                 },
                                 {
                                   title: "Common Questions",
-                                  href: "/#",
+                                  href: "#",
                                 },
                               ],
                             },
@@ -220,10 +311,10 @@ export default async function Header() {
                       </HeaderDropdownGroup>
                       <HeaderDropdownGroup className="flex! pr-4!">
                         <div className="flex flex-col self-end!">
-                          <a className="button button-secondary" href="/">
+                          <a className="button button-secondary" href="#">
                             FAQ
                           </a>
-                          <a className="button button-primary mt-2!" href="/">
+                          <a className="button button-primary mt-2!" href="#">
                             APPLY NOW
                           </a>
                         </div>
@@ -237,181 +328,9 @@ export default async function Header() {
                   </li>
                   <li className="rd-nav-item block lg:hidden!">
                     <a className="rd-nav-link rd-nav-link-custom" href="/login">
-                      LOGIN
+                      Login
                     </a>
                   </li>
-                  {/* <li className="rd-nav-item">
-                    <a className="rd-nav-link" href="#">
-                      Properties
-                    </a>
-
-                    <ul className="rd-menu rd-navbar-dropdown">
-                      <li className="rd-dropdown-item">
-                        <a className="rd-dropdown-link" href="properties-grid.html">
-                          Properties Grid
-                        </a>
-                      </li>
-                      <li className="rd-dropdown-item">
-                        <a className="rd-dropdown-link" href="properties-grid-2.html">
-                          Properties Grid 2
-                        </a>
-                      </li>
-                      <li className="rd-dropdown-item">
-                        <a className="rd-dropdown-link" href="properties-list.html">
-                          Properties List
-                        </a>
-                      </li>
-                      <li className="rd-dropdown-item">
-                        <a className="rd-dropdown-link" href="submit-property.html">
-                          Submit property
-                        </a>
-                      </li>
-                      <li className="rd-dropdown-item">
-                        <a className="rd-dropdown-link" href="single-property.html">
-                          Single Property
-                        </a>
-                      </li>
-                    </ul>
-                  </li>
-                  <li className="rd-nav-item">
-                    <a className="rd-nav-link" href="about-us.html">
-                      About Us
-                    </a>
-                  </li>
-                  <li className="rd-nav-item">
-                    <a className="rd-nav-link" href="blog.html">
-                      Blog
-                    </a>
-
-                    <ul className="rd-menu rd-navbar-dropdown">
-                      <li className="rd-dropdown-item">
-                        <a className="rd-dropdown-link" href="blog-post.html">
-                          Blog post
-                        </a>
-                      </li>
-                    </ul>
-                  </li>
-                  <li className="rd-nav-item">
-                    <a className="rd-nav-link" href="#">
-                      Pages
-                    </a>
-                    <HeaderDropdown>
-                      <HeaderDropdownGroup>
-                        <div>
-                          <form>
-                            <div className="form-wrap">
-                              <input type="text" id="search" className="form-input" />
-                              <label className="form-label" htmlFor="search">
-                                Search
-                              </label>
-                            </div>
-                          </form>
-                        </div>
-                        <div className="mt-2">
-                          <HeaderFeaturedHomes />
-                        </div>
-                      </HeaderDropdownGroup>
-                      <HeaderDropdownGroup title="Future Residents">
-                        <HeaderDropdownMenu
-                          list={[
-                            {
-                              title: "Our Rentals",
-                              href: "/#",
-                            },
-                            {
-                              title: "Application Process",
-                              child: [
-                                {
-                                  title: "Before You Apply",
-                                  href: "/#",
-                                },
-                                {
-                                  title: "Rental Criteria",
-                                  href: "/#",
-                                },
-                                {
-                                  title: "Before You Apply",
-                                  href: "/#",
-                                },
-                              ],
-                            },
-                          ]}
-                        />
-                      </HeaderDropdownGroup>
-                      <HeaderDropdownGroup title="Current Residents">
-                        <HeaderDropdownMenu
-                          list={[
-                            {
-                              title: "Moving In",
-                              child: [
-                                {
-                                  title: "What To Be Done Prior",
-                                  href: "/#",
-                                },
-                                {
-                                  title: "Next Steps (keys, utilities, etc)",
-                                  href: "/#",
-                                },
-                                {
-                                  title: "Common Questions",
-                                  href: "/#",
-                                },
-                              ],
-                            },
-                            {
-                              title: "Welcome home",
-                              child: [
-                                {
-                                  title: "Payment",
-                                  href: "#",
-                                },
-                                {
-                                  title: "Utilities",
-                                  href: "#",
-                                },
-                                {
-                                  title: "Maintenance",
-                                  href: "#",
-                                },
-                              ],
-                            },
-                            {
-                              title: "Moving Out",
-                              child: [
-                                {
-                                  title: "What To Be Done Prior",
-                                  href: "/#",
-                                },
-                                {
-                                  title: "Next Steps (keys, utilities, etc)",
-                                  href: "/#",
-                                },
-                                {
-                                  title: "Common Questions",
-                                  href: "/#",
-                                },
-                              ],
-                            },
-                          ]}
-                        />
-                      </HeaderDropdownGroup>
-                      <HeaderDropdownGroup className="flex! pr-4!">
-                        <div className="flex flex-col self-end!">
-                          <a className="button button-secondary" href="/">
-                            FAQ
-                          </a>
-                          <a className="button button-primary mt-2!" href="/">
-                            APPLY NOW
-                          </a>
-                        </div>
-                      </HeaderDropdownGroup>
-                    </HeaderDropdown>
-                  </li>
-                  <li className="rd-nav-item">
-                    <a className="rd-nav-link" href="contact-us.html">
-                      Contact Us
-                    </a>
-                  </li> */}
                 </ul>
               </div>
             </div>
diff --git a/src/components/layouts/HeaderDropdown.tsx b/src/components/layouts/HeaderDropdown.tsx
index e29d103..32b3ff9 100644
--- a/src/components/layouts/HeaderDropdown.tsx
+++ b/src/components/layouts/HeaderDropdown.tsx
@@ -2,8 +2,12 @@ import { createSlug } from "@/utils/general";
 import { cn } from "@/utils/style";
 import { FC, Fragment, PropsWithChildren } from "react";
 
-export const HeaderDropdown: FC<PropsWithChildren> = ({ children }) => {
-  return <ul className="rd-menu rd-navbar-megamenu">{children}</ul>;
+type HeaderDropdownProps = {
+  className?: string;
+};
+
+export const HeaderDropdown: FC<PropsWithChildren<HeaderDropdownProps>> = ({ children, className }) => {
+  return <ul className={cn("rd-menu rd-navbar-megamenu", className)}>{children}</ul>;
 };
 
 type HeaderDropdownGroupProps = {
@@ -24,7 +28,7 @@ export const HeaderDropdownGroup: FC<PropsWithChildren<HeaderDropdownGroupProps>
   );
 };
 
-type HeaderDropdownMenuItem = { title: string; href: string };
+type HeaderDropdownMenuItem = { title: string; href?: string };
 type HeaderDropdownMenuItemWithChild = { title: string; child: HeaderDropdownMenuItem[] };
 
 type HeaderDropdownMenuProps = {
@@ -37,13 +41,14 @@ export const HeaderDropdownMenu: FC<HeaderDropdownMenuProps> = ({ list = [] }) =
       {list.map((item, idx) => {
         const collapseId = createSlug(`collapse-${item.title}-${idx}`);
         const hasChild = "child" in item;
+        const hrefClass = hasChild || !!item?.href ? "text-colorLinkText1! hover:text-colorLinkText2!" : "";
 
         return (
           <Fragment key={idx}>
             {hasChild && (
               <li className="rd-megamenu-list-item">
                 <a
-                  className="rd-megamenu-list-link cursor-pointer"
+                  className={`rd-megamenu-list-link cursor-pointer ${hrefClass}`}
                   data-toggle="collapse"
                   data-target={`#${collapseId}`}
                   aria-controls={collapseId}
@@ -53,7 +58,7 @@ export const HeaderDropdownMenu: FC<HeaderDropdownMenuProps> = ({ list = [] }) =
                 </a>
                 <div className="pl-3 mt-2 space-y-2 collapse visible!" id={collapseId}>
                   {item.child.map((itemChild, itemChildIdx) => (
-                    <a key={itemChildIdx} className="rd-megamenu-list-link" href={itemChild.href}>
+                    <a key={itemChildIdx} className={`rd-megamenu-list-link ${hrefClass}`} href={itemChild.href}>
                       - {itemChild.title}
                     </a>
                   ))}
@@ -63,7 +68,7 @@ export const HeaderDropdownMenu: FC<HeaderDropdownMenuProps> = ({ list = [] }) =
 
             {!hasChild && (
               <li className="rd-megamenu-list-item">
-                <a className="rd-megamenu-list-link" href={item.href}>
+                <a className={`rd-megamenu-list-link ${hrefClass}`} href={item.href}>
                   {item.title}
                 </a>
               </li>