diff --git a/src/components/jobPopout/OfferJobPopout.jsx b/src/components/jobPopout/OfferJobPopout.jsx
index d285cc9..0e0bacc 100644
--- a/src/components/jobPopout/OfferJobPopout.jsx
+++ b/src/components/jobPopout/OfferJobPopout.jsx
@@ -147,33 +147,46 @@ function OfferJobPopout({ details, onClose, situation }) {
             {/* INPUT SECTION */}
             <div className='grid md:grid-cols-2'>
               <div className="my-2 md:flex">
-                <Detail
-                  label="Date"
+                {/* <Detail
+                  label="Date :"
                   value={
                     (details.offer_added && details.offer_added?.split(" ")[0]) ||
                     "default"
                   }
-                />
+                /> */}
+                <label className='job-label w-full md:w-[150px] md:text-right'>Date :</label>
+                <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white`}>
+                  {
+                    (details.offer_added && details.offer_added?.split(" ")[0]) ||
+                    "default"
+                  }
+                </p>
               </div>
 
               <div className="my-2 md:flex">
-                <Detail
-                  label="Offer Expire"
+                {/* <Detail
+                  label="Offer Expire :"
                   value={details.expire && details.expire.split(" ")[0]}
-                />
+                /> */}
+                <label className='job-label w-full md:w-[150px] md:text-right'>Expire :</label>
+                <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white`}>{details.expire && details.expire.split(" ")[0]}</p>
               </div>
             </div>
 
             <div className='grid md:grid-cols-2'>
               <div className="my-2 md:flex">
-                <Detail label="Reward" value={thePrice} />
+                {/* <Detail label="Reward :" value={thePrice} /> */}
+                <label className='job-label w-full md:w-[150px] md:text-right'>Reward :</label>
+                <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white`}>{thePrice}</p>
               </div>
 
               <div className="my-2 md:flex">
-                <Detail
-                  label="Duration"
+                {/* <Detail
+                  label="Duration :"
                   value={`${details.timeline_days} day(s)`}
-                />
+                /> */}
+                <label className='job-label w-full md:w-[150px] md:text-right'>Duration :</label>
+                <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white`}>{`${details.timeline_days} day(s)`}</p>
               </div>
             </div>
 
@@ -182,7 +195,7 @@ function OfferJobPopout({ details, onClose, situation }) {
             </p>
 
             <div className="my-2 md:flex">
-              <label className='job-label w-full md:w-[150px]'>Description</label>
+              <label className='job-label w-full md:w-[150px]'>Description :</label>
               <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white max-h-[200px] overflow-y-auto`}>{details.description}</p>
               {/* <Detail label="Description" value={details.description} /> */}
             </div>
@@ -193,7 +206,7 @@ function OfferJobPopout({ details, onClose, situation }) {
               {/* <label className='job-label w-full md:w-[150px]'>Detail</label>
               <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white min-h-[100px] max-h-[200px] overflow-y-auto border-2 rounded-md`}>{details.job_description || details.job_detail}</p> */}
               <label className="w-full text-slate-900 dark:text-white tracking-wide font-semibold">
-                Delivery Detail
+                Delivery Detail :
               </label>
               <textarea
                 className={`p-2 w-full text-sm text-slate-900 dark:text-white bg-transparent outline-none border border-slate-300 rounded-md`}