diff --git a/src/app/components/offers-received/offers-received.component.html b/src/app/components/offers-received/offers-received.component.html
index 3f625f1..7601ceb 100644
--- a/src/app/components/offers-received/offers-received.component.html
+++ b/src/app/components/offers-received/offers-received.component.html
@@ -1,3 +1,7 @@
+<div *ngIf="showCount==true" class="flex hdt">
+    <ion-label class="bold_text">You have {{total_offers}} Offer(s)</ion-label>
+</div>
+
 <div *ngFor="let item of offerDataReduced">
   <div class="offerBanner">
     <div style="padding: 5px 0 5px 10px; color: red; font-weight: bolder; font-size: 16px;"> New Offer Expires : {{item.expire | date}}</div>
diff --git a/src/app/components/offers-received/offers-received.component.scss b/src/app/components/offers-received/offers-received.component.scss
index 5c88dde..13ce603 100644
--- a/src/app/components/offers-received/offers-received.component.scss
+++ b/src/app/components/offers-received/offers-received.component.scss
@@ -1,6 +1,11 @@
+.bold_text {
+  font-size: 16px;
+  font-weight: bolder;
+}
 .offerBanner{
   box-shadow: 3px 2px 2px #bbadad;
-  background-color: aliceblue;
+ //background-color: #e8f1e8;
+  background: linear-gradient(to top, #f0f8ff 0%, #f0f9fd 100%);
   border-radius: 10px;
   border-color: #383a3e;
   margin-top: 10px;
diff --git a/src/app/components/offers-received/offers-received.component.ts b/src/app/components/offers-received/offers-received.component.ts
index 74081ec..75c8901 100644
--- a/src/app/components/offers-received/offers-received.component.ts
+++ b/src/app/components/offers-received/offers-received.component.ts
@@ -1,9 +1,10 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {Component, Input, OnInit, ViewChild} from '@angular/core';
 import {AlertController, LoadingController, NavController} from "@ionic/angular";
 import {Router} from "@angular/router";
 import {SessionDataProviderService} from "../../store/session-data-provider.service";
 import {WrenchService} from "../../services/wrench.service";
 import { BannersDataService } from "../../store/banners-data.service";
+//import {input} from "@capacitor/assets/dist/colors";
 
 @Component({
   selector: 'app-offers-received',
@@ -12,9 +13,11 @@ import { BannersDataService } from "../../store/banners-data.service";
 })
 export class OffersReceivedComponent implements OnInit {
 //@ViewChild('offerData') offerData: [];
- @ViewChild('noLimit') noLimit: boolean;
-
-  offerData: [];
+ //@ViewChild('noLimit') noLimit: boolean;
+  @Input('noLimit') noLimit:boolean;
+  @Input('showCount') showCount: boolean;
+  total_offers:number = 0;
+  offerData: any;
   //noLimit: boolean=false;
   offerDataReduced: any;
   constructor(
@@ -143,6 +146,7 @@ if ( this.currOpenOffer != '' && this.currOpenOffer == item.offer_uid){
     else{
       this.offerDataReduced = this.offerData;
     }
+    this.total_offers = this.offerData.length;
   }
 
   responseData: {
diff --git a/src/app/pages/home/home.module.ts b/src/app/pages/home/home.module.ts
index 41f97fe..a3f8acd 100644
--- a/src/app/pages/home/home.module.ts
+++ b/src/app/pages/home/home.module.ts
@@ -39,7 +39,7 @@ import { OffersReceivedComponent } from "../../components/offers-received/offers
     HomePageRoutingModule
   ],
   declarations: [
-    HomePage,SuggestedlistComponent,
+    HomePage, SuggestedlistComponent,
     FamilypendingComponent,
     TrackingComponent,
     FastrewardComponent,
@@ -59,6 +59,9 @@ import { OffersReceivedComponent } from "../../components/offers-received/offers
     OffersReceivedComponent
 
   ],
+  exports: [
+    OffersReceivedComponent
+  ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })
 export class HomePageModule { }
diff --git a/src/app/pages/joboffers/joboffers.module.ts b/src/app/pages/joboffers/joboffers.module.ts
index 1bd6a15..8e9c074 100644
--- a/src/app/pages/joboffers/joboffers.module.ts
+++ b/src/app/pages/joboffers/joboffers.module.ts
@@ -7,7 +7,8 @@ import { IonicModule } from '@ionic/angular';
 import { JoboffersPageRoutingModule } from './joboffers-routing.module';
 
 import { JoboffersPage } from './joboffers.page';
-import { OffersReceivedComponent } from "../../components/offers-received/offers-received.component";
+import {HomePageModule} from "../home/home.module";
+//import { OffersReceivedComponent } from "../../components/offers-received/offers-received.component";
 
 @NgModule({
   imports: [
@@ -15,7 +16,8 @@ import { OffersReceivedComponent } from "../../components/offers-received/offers
     FormsModule,
     IonicModule,
     JoboffersPageRoutingModule,
+    HomePageModule,
   ],
-  declarations: [JoboffersPage,OffersReceivedComponent]
+  declarations: [JoboffersPage]
 })
 export class JoboffersPageModule {}
diff --git a/src/app/pages/joboffers/joboffers.page.html b/src/app/pages/joboffers/joboffers.page.html
index ef85067..82be90f 100644
--- a/src/app/pages/joboffers/joboffers.page.html
+++ b/src/app/pages/joboffers/joboffers.page.html
@@ -13,11 +13,14 @@
 <ion-content>
     <div class="boxed_contents">
         <div class="ion-padding">
-            <div class="flex hdt">
-                <ion-label class="bold_text">You have {{total_offers}} Offer(s)</ion-label>
-            </div>
+<!--            <div class="flex hdt">-->
+<!--                <ion-label class="bold_text">You have {{total_offers}} Offer(s)</ion-label>-->
+<!--            </div>-->
 
-            <app-offers-received [noLimit]="noLimit" ></app-offers-received>
+            <app-offers-received
+                    [showCount]="showCount"
+                    [noLimit]="noLimit" >
+            </app-offers-received>
 
 
 <!--            <div *ngIf="total_offers>3;">-->
diff --git a/src/app/pages/joboffers/joboffers.page.scss b/src/app/pages/joboffers/joboffers.page.scss
index 632b38b..6bca693 100644
--- a/src/app/pages/joboffers/joboffers.page.scss
+++ b/src/app/pages/joboffers/joboffers.page.scss
@@ -210,7 +210,7 @@ ion-content {
 
       .bold_text {
         font-size: 16px;
-        font-family: 'bold';
+        font-weight: bolder;
       }
 
       .grey_text {
diff --git a/src/app/pages/joboffers/joboffers.page.ts b/src/app/pages/joboffers/joboffers.page.ts
index 9d4b5ec..67ed306 100644
--- a/src/app/pages/joboffers/joboffers.page.ts
+++ b/src/app/pages/joboffers/joboffers.page.ts
@@ -11,6 +11,7 @@ import {SessionDataProviderService} from "../../store/session-data-provider.serv
 export class JoboffersPage implements OnInit {
 
   noLimit:boolean=true;
+  showCount:boolean=true;
 
   tabs = 'about';