diff --git a/src/components/GetLoan.jsx b/src/components/GetLoan.jsx
index 8ca1cbc..82afbbe 100644
--- a/src/components/GetLoan.jsx
+++ b/src/components/GetLoan.jsx
@@ -1,5 +1,7 @@
 import React, { useEffect, useState } from 'react'
 import { useLocation, useNavigate } from 'react-router-dom'
+import { IoIosArrowBack } from "react-icons/io";
+
 import myLinks from '../myLinks'
 import Label from './Label'
 import InputText from './InputText'
@@ -18,9 +20,14 @@ export default function LoginCom() {
   return (
     <div className={`h-screen bg-sky-300 flex flex-col items-center justify-center bg-[url('./assets/first-background.jpg')] bg-cover bg-center bg-no-repeat`}>
         <div className='flex flex-col gap-4 w-[80%] sm:w-[400px] min-h-[500px] bg-white rounded-xl p-4 sm:p-8 shadow'>
-            <div className="pb-3 card-title w-full text-center border-b-2">
+            <div className="relative pb-3 card-title w-full border-b-2 flex gap-4 items-center">
+              <div className='absolute left-2 top-1/2 -translate-y-1/2 p-1 cursor-pointer' onClick={()=>navigate(myLinks.home, {state:{proceed:'true'}})}>
+                <IoIosArrowBack className='text-3xl sm:text-5xl font-bold text-red-500' />
+              </div>
+              <div className='w-full text-center'>
                 <h1 className="mb-[1px] text-2xl font-bold">{state?.user.name}</h1>
                 <span className={`text-base font-bold p-1 rounded`}>BVN: {state?.user.bvn}</span>
+              </div>
             </div>
 
             <div className='mt-3 flex justify-center items-center'>
diff --git a/src/components/HomeCom.jsx b/src/components/HomeCom.jsx
index 41535ad..39fe5d1 100644
--- a/src/components/HomeCom.jsx
+++ b/src/components/HomeCom.jsx
@@ -40,7 +40,7 @@ export default function HomeCom() {
                 <p className='text-red-500'>{error.message}</p>
               </div>
               :
-              <TableWrapper data={demoUsers} itemsPerPage={8}>
+              <TableWrapper data={demoUsers} itemsPerPage={16}>
               {({ data }) => (
               <div className="grid gap-5 sm:gap-[40px] grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
                 {data.map((user, index) => {
diff --git a/src/components/TableWrapper.jsx b/src/components/TableWrapper.jsx
index ebcd158..4aac601 100644
--- a/src/components/TableWrapper.jsx
+++ b/src/components/TableWrapper.jsx
@@ -53,6 +53,7 @@ export default function TableWrapper({
       );
       setIsLoading(false)
     },1000)
+
   }, [currentPage, filteredData]);
 
   useEffect(()=>{
diff --git a/src/index.css b/src/index.css
index eb4dd04..aa352e1 100644
--- a/src/index.css
+++ b/src/index.css
@@ -2,6 +2,10 @@
 @tailwind components;
 @tailwind utilities;
 
+html{
+  scroll-behavior: smooth;
+}
+
 *{
   transition: all .3s;
 }