diff --git a/src/components/History/JobsCompleted.jsx b/src/components/History/JobsCompleted.jsx
index 3da3f18..2418ed7 100644
--- a/src/components/History/JobsCompleted.jsx
+++ b/src/components/History/JobsCompleted.jsx
@@ -50,7 +50,7 @@ function JobsCompleted() {
       }, [])
 
   return (
-    <div className='flex flex-col justify-between min-h-[500px]'>
+    <div className='p-4 flex flex-col justify-between min-h-[500px]'>
     {jobHistory.loading ? 
     <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
     : jobHistory?.data?.length ?
diff --git a/src/components/History/RewardsTable.jsx b/src/components/History/RewardsTable.jsx
index 973c882..dc9f55c 100644
--- a/src/components/History/RewardsTable.jsx
+++ b/src/components/History/RewardsTable.jsx
@@ -47,7 +47,7 @@ export const RewardsTable = memo(() => {
       }, [])
 
   return (
-    <div className='flex flex-col justify-between min-h-[500px]'>
+    <div className='p-4 flex flex-col justify-between min-h-[500px]'>
     {familyRewardHistory.loading ? 
     <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
     : familyRewardHistory.data.length ?
diff --git a/src/components/MyWallet/WalletComponent/PurchasesTable.jsx b/src/components/MyWallet/WalletComponent/PurchasesTable.jsx
index 6377cb5..4f49df8 100644
--- a/src/components/MyWallet/WalletComponent/PurchasesTable.jsx
+++ b/src/components/MyWallet/WalletComponent/PurchasesTable.jsx
@@ -15,7 +15,7 @@ function PurchasesTable({purchase}) {
     }
 
   return (
-    <div className='flex flex-col justify-between min-h-[500px]'>
+    <div className='p-4 flex flex-col justify-between min-h-[500px]'>
         {purchase.data.length ?
         <table className="wallet-activity w-full table-auto border-collapse text-left">
             <thead className='w-full'>
diff --git a/src/components/MyWallet/WalletComponent/RecentActivityTable.jsx b/src/components/MyWallet/WalletComponent/RecentActivityTable.jsx
index ded5bf1..631b282 100644
--- a/src/components/MyWallet/WalletComponent/RecentActivityTable.jsx
+++ b/src/components/MyWallet/WalletComponent/RecentActivityTable.jsx
@@ -18,7 +18,7 @@ function RecentActivityTable({ payment }) {
   };
 
   return (
-    <div className="flex flex-col justify-between min-h-[500px]">
+    <div className="p-4 flex flex-col justify-between min-h-[500px]">
       {payment?.data?.length > 0 ? 
         <table className="wallet-activity w-full table-auto border-collapse text-left">
           <thead className="w-full">
diff --git a/src/components/customTabs/TabButton.jsx b/src/components/customTabs/TabButton.jsx
index da3b7eb..95ee3a0 100644
--- a/src/components/customTabs/TabButton.jsx
+++ b/src/components/customTabs/TabButton.jsx
@@ -3,7 +3,7 @@ import React from 'react'
 export default function TabButton({ item='', selectedTab='', setSelectedTab=()=>{} }) {
   return (
     <button
-      className={`flex lg:space-x-4 space-x-2 hover:text-purple transition-all duration-300 ease-in-out items-center cursor-pointer lg:mb-11 mb-2 mr-6 lg:mr-0 float-left lg:float-none overflow-hidden ${
+      className={`text-18 tracking-wide flex lg:space-x-4 space-x-2 hover:text-purple transition-all duration-300 ease-in-out items-center cursor-pointer lg:mb-11 mb-2 mr-6 lg:mr-0 float-left lg:float-none overflow-hidden ${
         selectedTab === item ? "text-purple" : " text-thin-light-gray"
       }`}
       value={item}