diff --git a/app/components/MeetUs.tsx b/app/components/MeetUs.tsx
index c4ee797..c620af6 100644
--- a/app/components/MeetUs.tsx
+++ b/app/components/MeetUs.tsx
@@ -2,7 +2,7 @@ import React, { forwardRef } from "react";
 
 const MeetUs = forwardRef<HTMLDivElement>((_, ref) => {
   return (
-    <section ref={ref} className="bg-black h-screen snap-start text-white">
+    <section ref={ref} className="bg-black h-[100dvh] snap-start text-white">
       <div className="w-full md:w-[80%] m-auto text-center flex flex-col justify-center h-full">
         <div className="center flex-col">
           <span className="font-extrabold text-main text-5xl">Meet</span>
diff --git a/app/components/ScrollBySection.tsx b/app/components/ScrollBySection.tsx
index 9c12358..636d3f7 100644
--- a/app/components/ScrollBySection.tsx
+++ b/app/components/ScrollBySection.tsx
@@ -72,7 +72,7 @@ const ScrollBySection: React.FC = () => {
   }, [activeIndex]);
 
   return (
-    <div className="h-screen w-full overflow-hidden">
+    <div className="h-[100dvh] w-full overflow-hidden">
       <Welcome
         ref={(el) => {
           if (el) sectionRefs.current[0] = el;
diff --git a/app/components/Welcome/Welcome.tsx b/app/components/Welcome/Welcome.tsx
index 5eb125d..60ad035 100644
--- a/app/components/Welcome/Welcome.tsx
+++ b/app/components/Welcome/Welcome.tsx
@@ -5,7 +5,7 @@ const Welcome = forwardRef<HTMLDivElement>((_, ref) => {
   return (
     <section
       ref={ref}
-      className="min-h-screen snap-start bg-black pt-10 gap-5 md:gap-12 flex flex-col justify-around text-white"
+      className="min-h-[100dvh] snap-start bg-black pt-10 gap-5 md:gap-12 flex flex-col justify-around text-white"
     >
       <div className="center flex-col mt-28">
         <h2 className="font-extrabold">Welcome To</h2>
diff --git a/app/components/nav.tsx b/app/components/nav.tsx
index 7c39e1a..fa568a8 100644
--- a/app/components/nav.tsx
+++ b/app/components/nav.tsx
@@ -138,7 +138,7 @@ const Nav = () => {
                     ${
                       visible ? "opacity-100" : "opacity-0 pointer-events-none"
                     } 
-                    ${!isHeaderVisible ? "h-screen top-0" : "top-24 "}`}
+                    ${!isHeaderVisible ? "h-[100dvh] top-0" : "top-24 "}`}
       >
         <ul
           className={`flex flex-col justify-center items-center transition-transform duration-500 ease-in-out