diff --git a/bitsat_branch_predictor/src/About.jsx b/bitsat_branch_predictor/src/About.jsx
index 60abe4e..5e4e965 100644
--- a/bitsat_branch_predictor/src/About.jsx
+++ b/bitsat_branch_predictor/src/About.jsx
@@ -9,9 +9,10 @@ const Team = () => {
     });
 
     return (
-        <main>
-            <div className="h-screen text-white pt-24">
-                <div className="flex flex-wrap gap-3 justify-center">
+        <main className="min-h-screen bg-gray-950">
+            <div className="text-white pt-24 px-8">
+                <h1 className="text-3xl font-bold text-center mb-8">Our Team</h1>
+                <div className="max-w-7xl mx-auto flex flex-wrap gap-6 justify-center">
                     {TEAM_MEMBERS.map((member) => (
                         <TeamMember
                             key={member.name}
diff --git a/bitsat_branch_predictor/src/components/ui/ProfileCard.tsx b/bitsat_branch_predictor/src/components/ui/ProfileCard.tsx
index b1a8b48..174a9cb 100644
--- a/bitsat_branch_predictor/src/components/ui/ProfileCard.tsx
+++ b/bitsat_branch_predictor/src/components/ui/ProfileCard.tsx
@@ -7,23 +7,23 @@ const TeamMember = ({ image, name, role, githubLink, description }: TeamMemberPr
     };
 
     return (
-        <div className='cardbase'>
+        <div className='cardbase w-[512px] h-[580px] flex flex-col'>
             <img
                 src={image}
                 alt={`${name}'s profile image`}
                 onContextMenu={preventContextMenu}
                 draggable={false}
-                className="relative inset-0 w-full h-92 rounded-[46px] p-2 object-cover"
+                className="relative inset-0 w-full h-96 rounded-[46px] p-2 object-cover flex-shrink-0"
             />
 
-            <div className='relative flex items-center mx-5 my-2 font-satoshi'>
+            <div className='relative flex items-center mx-5 my-2 font-satoshi flex-shrink-0'>
                 <div className=''>
                     <p className="text-xl font-semibold text-accent">{name}</p>
                     <p className="text-accent/60 font-geist-mono text-sm">{role}</p>
                 </div>
                 <button
                     onClick={() => window.open(githubLink, '_blank')}
-                    className="flex justify-center items-center cursor-pointer ml-auto w-18 bg-primary/70 rounded-lg h-11"
+                    className="flex justify-center items-center cursor-pointer ml-auto w-16 bg-primary/70 rounded-lg h-12"
                     aria-label="Open GitHub profile"
                 >
                     <img
@@ -35,11 +35,11 @@ const TeamMember = ({ image, name, role, githubLink, description }: TeamMemberPr
                     />
                 </button>
             </div>
-            <p className='text-white/70 text-[14px] px-5 tracking-tight pt-3 font-outfit'>
+            <p className='text-white/70 text-[14px] px-5 tracking-tight pt-2 pb-4 font-outfit flex-grow overflow-y-auto'>
                 {description}
             </p>
         </div>
     );
 }
 
-export default TeamMember;
\ No newline at end of file
+export default TeamMember;