diff --git a/app/users/[id]/page.tsx b/app/users/[id]/page.tsx
index 7dec062..3ad6885 100644
--- a/app/users/[id]/page.tsx
+++ b/app/users/[id]/page.tsx
@@ -165,23 +165,22 @@ function UserPage({ params }: { params: { id: string } }) {
             <h1 className='text-center'>CallFi Profile</h1>
           </div>
 
-          <div className='rounded-3xl'>
+          <div className='rounded-3xl lg:hidden'>
             <div className='grid grid-cols-3 flex-row p-2'>
               <img
                 src={userData.img_url}
-                className="rounded-full w-full w-36 p-5"
+                className="rounded-full w-36 p-5"
               />
               <div className='flex flex-col p-6 px-2'>
                 <div>
-                  <p className='font-bold mb-2'>{userData.tag}</p>
-                  <p className='text-sm'>{userData.gains.toFixed(2)}x Gains</p>
-                  <p className='text-sm'>{(userData.points * 100).toFixed(2)} Points</p> 
-                  <p className='text-sm'>{userData.followerCount} Followers</p>
+                <p className='text-sm'>{userData.gains.toFixed(2)}x Gains</p>
+                <p className='text-sm'>{(userData.points * 100).toFixed(2)} Points</p> 
+                <p className='text-sm'>{userData.followerCount} Followers</p>
                 </div>
                 <div className={expandedInfo ? "" : "hidden"}>
-                  <p className='text-sm'>{userData.calloutCount} Callouts</p>
-                  <p className='text-sm'>{parseFloat(userData.accuracy).toFixed(1)}% Accuracy</p>
-                  <p className='text-sm'>{userData.daysSinceJoined} Days</p>
+                <p className='text-sm'>{userData.calloutCount} Callouts</p>
+                <p className='text-sm'>{parseFloat(userData.accuracy).toFixed(1)}% Accuracy</p>
+                <p className='text-sm'>{userData.daysSinceJoined} Days</p>
                 </div>
               </div>
               <div className='flex col-span-1 justify-end m-3 mb-6 items-end'>
@@ -203,7 +202,42 @@ function UserPage({ params }: { params: { id: string } }) {
               <button onClick={handleShareClick} className='glassmorphism p-1 flex items-center justify-center rounded-xl hover:bg-blue-900'><FaShare /></button>
             </div>
             {loginAlert && <p className="text-red-500 text-center">{loginAlert}</p>}
-            <div className='grid grid-cols-2 mt-4'>
+            
+          </div>
+
+          <div className='rounded-3xl grid grid-cols-3 flex flex-row max-lg:hidden'>
+             <div className='grid grid-cols-3'>
+              <img
+                src={userData.img_url}
+                className="rounded-full h-full p-5"
+              />
+              <p className='font-bold flex justify-start items-center text-xl font-bold'>{userData.tag}</p>
+
+              </div>
+
+            <div className='items-center flex justify-center grid grid-cols-3'>
+                <p className='text-sm'>{userData.gains.toFixed(2)}x Gains</p>
+                <p className='text-sm'>{(userData.points * 100).toFixed(2)} Points</p> 
+                <p className='text-sm'>{userData.followerCount} Followers</p>
+                <p className='text-sm'>{userData.calloutCount} Callouts</p>
+                <p className='text-sm'>{parseFloat(userData.accuracy).toFixed(1)}% Accuracy</p>
+                <p className='text-sm'>{userData.daysSinceJoined} Days</p>
+              
+            </div>
+            <div className='flex justify-end grid grid-rows-2 items-end mr-5'>
+              
+            <button 
+                onClick={currentUser == id ? ()=>{} : handleFollowClick} 
+                className={`glassmorphism p-1 w-96 h-10 rounded-xl ${isFollowing ? "hover:bg-red-900" : "hover:bg-blue-900"}`}
+                disabled={currentUser === id}
+              >
+                {currentUser == id ? 'My Account' : (isFollowing ? 'Unfollow' : 'Follow')}
+              </button>
+              <button onClick={handleShareClick} className='glassmorphism h-10 ml-20 flex items-center justify-center rounded-xl hover:bg-blue-900'> Share <FaShare className='ml-5' /></button>
+            </div>
+          </div>
+
+          <div className='grid grid-cols-2 mt-4'>
               <button className={`justify-center text-center ${activeSelected ? "text-blue-300 bg-opacity-20 bg-black" : " text-sm text-gray-300"}`} onClick={() => { setActiveSelected(true) }}>
                 <p>Active</p>
               </button>
@@ -211,7 +245,6 @@ function UserPage({ params }: { params: { id: string } }) {
                 <p>History</p>
               </button>
             </div>
-          </div>
         </section>
 
         <section className={`flex w-full ${activeSelected ? "" : "hidden"}`}>