diff --git a/src/app/pages/blogdetail/blogdetail.page.html b/src/app/pages/blogdetail/blogdetail.page.html
index 463c312..abdf921 100644
--- a/src/app/pages/blogdetail/blogdetail.page.html
+++ b/src/app/pages/blogdetail/blogdetail.page.html
@@ -57,10 +57,10 @@
           <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/wrench.jpg)'"></div>
           <div style="margin-left: 10px; margin-top: 10px">
 <!--            <ion-label class="bold">Jonathon Williams</ion-label>-->
-            <ion-label class="grey">{{blogData.post_date}}</ion-label>
+            <ion-label class="grey">{{blogData.post_date | date}}</ion-label>
           </div>
         </div>
-        <ion-icon name="chatbubble-ellipses-outline" color="primary"></ion-icon>
+<!--        <ion-icon name="chatbubble-ellipses-outline" color="primary"></ion-icon>-->
       </div>
 
 <!--      <ion-label class="head_text">About Course</ion-label>-->
diff --git a/src/app/pages/family/family.page.html b/src/app/pages/family/family.page.html
index 38e4ae3..8fbd605 100644
--- a/src/app/pages/family/family.page.html
+++ b/src/app/pages/family/family.page.html
@@ -38,7 +38,7 @@
         <!--      </div>-->
       </div>
 
-      <ion-segment [(ngModel)]="tabs">
+      <ion-segment class="common_segment" [(ngModel)]="tabs">
         <ion-segment-button value="members">
           <ion-label>Members ({{total_family}})</ion-label>
         </ion-segment-button>
@@ -46,14 +46,15 @@
           <ion-label>Tasks ({{family_active}})</ion-label>
         </ion-segment-button>
         <ion-segment-button value="pending">
-          <ion-label>Pending {{suggestion_total}} </ion-label>
+          <ion-label>Pending ({{suggestion_total}}) </ion-label>
         </ion-segment-button>
       </ion-segment>
 
       <div *ngIf="tabs =='members'" class="lesson">
+
         <div class="video" *ngFor="let item of familyData" (click)="familyMemebr(item)">
           <div class="left">
-            <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/familymember.svg)'"></div>
+            <div class="bg_image men_image" [style.backgroundImage]="'url('+item.profile_picture+')'"></div>
 
             <div class="text">
               <ion-label class="bold_text">{{item.firstname}} {{item.lastname}} ({{item.age}})</ion-label>
@@ -64,6 +65,7 @@
             <ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
           </div>
         </div>
+
       </div>
 
       <div *ngIf="tabs =='lesson'" class="lesson">
@@ -94,7 +96,7 @@
 
       </div>
 
-      <div *ngIf="tabs =='pending'" class="review_tab">
+      <div *ngIf="tabs =='pending'" class="lesson">
 
         <div *ngIf="suggestion_total == 0">
           <ion-card>
@@ -120,31 +122,48 @@
             <!--        <ion-label class="color">See all</ion-label>-->
           </div>
 
-          <div class="reviw_list" *ngFor="let item of familyPendingData">
-            <div class="profile">
-              <div class="left">
-                <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
-                <div style="margin-left: 10px;">
-                  <ion-label class="bold">{{item.title}}</ion-label>
-                </div>
-              </div>
-              <div class="right">
-                <div class="select">
-                  <!--              <ion-icon slot="start" name="star" color="primary" class="star_icon"></ion-icon>-->
-                  <ion-label class="rate_num">{{item.status_text}}</ion-label>
-                </div>
-                <!--            <ion-icon name="ellipsis-horizontal-circle-outline"></ion-icon>-->
+          <div class="video" *ngFor="let item of familyPendingData" >
+            <div class="left">
+              <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
+
+              <div class="text">
+                <ion-label class="bold_text name_bg_text">{{item.firstname}} </ion-label>
+                <ion-label class="bold_text">{{item.title}}</ion-label>
+                <ion-label class="grey_text">{{item.description}}</ion-label>
+                <ion-label class="extra_text"><span class="title">Added:</span> {{item.added}}</ion-label>
+                <ion-label class="extra_text"><span class="title">Status:</span> {{item.status_text}}</ion-label>
               </div>
             </div>
-            <ion-label>{{item.description}}
-            </ion-label>
-
-            <div class="like">
-              <!--          <ion-icon slot="start" name="heart" color="danger" class="heart"></ion-icon>-->
-              <ion-label class="name_bg_text">{{item.firstname}} </ion-label>
-              <ion-label class="time">{{item.added}}</ion-label>
+            <div class="right">
+              <ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
             </div>
           </div>
+
+<!--          <div class="reviw_list" *ngFor="let item of familyPendingData">-->
+<!--            <div class="profile">-->
+<!--              <div class="left">-->
+<!--                <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>-->
+<!--                <div style="margin-left: 10px;">-->
+<!--                  <ion-label class="bold">{{item.title}}</ion-label>-->
+<!--                </div>-->
+<!--              </div>-->
+<!--              <div class="right">-->
+<!--                <div class="select">-->
+<!--                  &lt;!&ndash;              <ion-icon slot="start" name="star" color="primary" class="star_icon"></ion-icon>&ndash;&gt;-->
+<!--                  <ion-label class="rate_num">{{item.status_text}}</ion-label>-->
+<!--                </div>-->
+<!--                &lt;!&ndash;            <ion-icon name="ellipsis-horizontal-circle-outline"></ion-icon>&ndash;&gt;-->
+<!--              </div>-->
+<!--            </div>-->
+<!--            <ion-label>{{item.description}}-->
+<!--            </ion-label>-->
+
+<!--            <div class="like">-->
+<!--              &lt;!&ndash;          <ion-icon slot="start" name="heart" color="danger" class="heart"></ion-icon>&ndash;&gt;-->
+<!--              <ion-label class="name_bg_text">{{item.firstname}} </ion-label>-->
+<!--              <ion-label class="time">{{item.added}}</ion-label>-->
+<!--            </div>-->
+<!--          </div>-->
         </div>
 
         <!--      <div class="story-item">-->
diff --git a/src/app/pages/family/family.page.scss b/src/app/pages/family/family.page.scss
index c42354b..91ae28b 100644
--- a/src/app/pages/family/family.page.scss
+++ b/src/app/pages/family/family.page.scss
@@ -1,14 +1,13 @@
 
 ion-content {
   .name_bg_text{
-    background-color:aliceblue;;
-    font-size: 10px;
-    padding-right: 5px;
+    color: #8b198e;
     font-weight: bolder;
   }
   .back_image {
+    margin-top: 10px;
     width: 100%;
-    height: 230px;
+    height: 200px;
 
     .back {
       font-size: 25px;
@@ -16,6 +15,16 @@ ion-content {
     }
   }
 
+
+.extra_text{
+  font-size: 11px;
+
+  margin-left: 20px;
+  .title{
+    font-weight: bolder;
+    color: #030728;
+  }
+}
   .due_date{
     color: red;
     font-size: 12px;
diff --git a/src/app/pages/familymember/familymember.page.html b/src/app/pages/familymember/familymember.page.html
index 3014503..309e2fe 100644
--- a/src/app/pages/familymember/familymember.page.html
+++ b/src/app/pages/familymember/familymember.page.html
@@ -40,7 +40,7 @@
 <!--      </div>-->
     </div>
 
-    <ion-segment [(ngModel)]="tabs">
+    <ion-segment class="common_segment" [(ngModel)]="tabs">
       <ion-segment-button value="about">
         <ion-label>Task</ion-label>
       </ion-segment-button>
@@ -86,7 +86,7 @@
                 <ion-row>
                     <ion-col>
                         <div class="left">
-                            <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/task-list.svg)'"></div>
+                            <div class="bg_image men_image"  [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/currency/'+item.description.toLowerCase()+'.svg)'"></div>
                             <div class="text">
                                 <ion-label class="bold_text"> {{item.amount*0.01 | number : '1.2-2'}} {{item.description}}</ion-label>
                             </div>
@@ -187,12 +187,13 @@
                 <ion-label class="dark_text">{{member_pin}}</ion-label>
             </div>
             <div class="flex">
-                <qrcode
-                        [qrdata]="member_qr_string"
-                        [width]="256"
-                        [errorCorrectionLevel]="'M'">
-                </qrcode>
-
+                <div class="qr-div">
+                    <qrcode
+                            [qrdata]="member_qr_string"
+                            [width]="256"
+                            [errorCorrectionLevel]="'M'">
+                    </qrcode>
+                </div>
             </div>
 
         </div>
diff --git a/src/app/pages/familymember/familymember.page.scss b/src/app/pages/familymember/familymember.page.scss
index cd8a5b0..a4232ef 100644
--- a/src/app/pages/familymember/familymember.page.scss
+++ b/src/app/pages/familymember/familymember.page.scss
@@ -45,6 +45,11 @@ ion-content {
     ion-icon {
       font-size: 22px;
     }
+    qr-div{
+      width: 100%;
+      text-align: center;
+      margin: 0px auto 0px auto;
+    }
   }
 
   .row {
@@ -122,6 +127,7 @@ ion-content {
           height: 50px;
           width: 50px;
           border-radius: 100%;
+          color: #3dc2ff;
         }
 
         .bold {
diff --git a/src/app/pages/home/home.page.scss b/src/app/pages/home/home.page.scss
index d6464b3..0120ece 100644
--- a/src/app/pages/home/home.page.scss
+++ b/src/app/pages/home/home.page.scss
@@ -39,7 +39,7 @@ ion-header {
   }
 }
 .top-tool{
-  --background: #f1eeeb;
+  --background: #eceae9;
   border-radius: 10px;
   ion-buttons{
     ion-button{
@@ -383,6 +383,7 @@ ion-content {
           text-align: center;
           height: 38px;
           width: 100%;
+          overflow: hidden;
           .ovf{
              overflow: hidden;
           }
diff --git a/src/app/pages/marketdetail/marketdetail.page.html b/src/app/pages/marketdetail/marketdetail.page.html
index 0abac39..1f7302f 100644
--- a/src/app/pages/marketdetail/marketdetail.page.html
+++ b/src/app/pages/marketdetail/marketdetail.page.html
@@ -34,7 +34,7 @@
         <!--      </div>-->
       </div>
 
-      <ion-segment [(ngModel)]="tabs">
+      <ion-segment class="common_segment" [(ngModel)]="tabs">
         <ion-segment-button value="about">
           <ion-label>Details</ion-label>
         </ion-segment-button>
diff --git a/src/app/pages/my-course/my-course.page.html b/src/app/pages/my-course/my-course.page.html
index a11680d..4422bd6 100644
--- a/src/app/pages/my-course/my-course.page.html
+++ b/src/app/pages/my-course/my-course.page.html
@@ -12,7 +12,7 @@
 <ion-content class="ion-padding">
   <div class="boxed_contents">
 
-    <ion-segment [(ngModel)]="tabs">
+    <ion-segment class="common_segment" [(ngModel)]="tabs">
       <ion-segment-button value="on">
         <ion-label>Available</ion-label>
       </ion-segment-button>
diff --git a/src/app/pages/mycoupons/mycoupons.page.html b/src/app/pages/mycoupons/mycoupons.page.html
index ac50141..7835b5f 100644
--- a/src/app/pages/mycoupons/mycoupons.page.html
+++ b/src/app/pages/mycoupons/mycoupons.page.html
@@ -39,7 +39,7 @@
                 <!--      </div>-->
             </div>
 
-            <ion-segment [(ngModel)]="tabs">
+            <ion-segment class="common_segment" [(ngModel)]="tabs">
                 <ion-segment-button value="about">
                     <ion-label>Pending</ion-label>
                 </ion-segment-button>
diff --git a/src/app/pages/mytasks/mytasks.page.html b/src/app/pages/mytasks/mytasks.page.html
index 871800d..fbda92c 100644
--- a/src/app/pages/mytasks/mytasks.page.html
+++ b/src/app/pages/mytasks/mytasks.page.html
@@ -13,7 +13,7 @@
 
 <ion-content class="ion-padding">
   <div class="boxed_contents">
-    <ion-segment [(ngModel)]="tabs">
+    <ion-segment class="common_segment" [(ngModel)]="tabs">
       <ion-segment-button value="tasks">
         <ion-label>Active</ion-label>
       </ion-segment-button>
diff --git a/src/app/pages/redeem/redeem.page.html b/src/app/pages/redeem/redeem.page.html
index 3bb25f6..f08ac70 100644
--- a/src/app/pages/redeem/redeem.page.html
+++ b/src/app/pages/redeem/redeem.page.html
@@ -13,7 +13,7 @@
           <ion-label class="color_text">Balance: {{curr_balance| number : '1.2-2'}} {{currency_description}}</ion-label>
 
 
-          <ion-segment [(ngModel)]="tabs">
+          <ion-segment class="common_segment" [(ngModel)]="tabs">
               <ion-segment-button value="bank_redeem">
                   <ion-label>To Bank</ion-label>
               </ion-segment-button>
diff --git a/src/app/pages/transaction/transaction.page.html b/src/app/pages/transaction/transaction.page.html
index e887e6e..da10f71 100644
--- a/src/app/pages/transaction/transaction.page.html
+++ b/src/app/pages/transaction/transaction.page.html
@@ -48,7 +48,7 @@
                 <div class="video wallets" *ngFor="let item of walletData">
                     <div class="left">
 
-                        <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/money-cycle.svg)'"></div>
+                        <div class="bg_image men_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/currency/'+item.code.toLowerCase()+'.svg)'"></div>
                     </div>
                         <div class="text">
                             <ion-label class="bold_text">{{item.description}}</ion-label>
diff --git a/src/app/store/session-data-provider.service.ts b/src/app/store/session-data-provider.service.ts
index 6237841..889da8a 100644
--- a/src/app/store/session-data-provider.service.ts
+++ b/src/app/store/session-data-provider.service.ts
@@ -65,6 +65,7 @@ export class SessionDataProviderService {
   isPedningJob: number = 0;
   isOfferJob: number = 0;
   profile_pic:string='';
+  profile_pic_url:string='';
   member_uid:string;
   user_state:string;
   city:string;
@@ -98,6 +99,7 @@ export class SessionDataProviderService {
       this.balance = loginResult.balance;
       this.ccard=loginResult.ccard;  
       this.profile_pic=loginResult.profile_pic;
+      this.profile_pic_url =  loginResult.profile_pic_url;
       this.isPedningJob = loginResult.pedningjob;
       this.isOfferJob = loginResult.offerjob;
       this.user_state=loginResult.state;
@@ -186,8 +188,9 @@ export class SessionDataProviderService {
   profilePicture(){
     var defualtProfilePicture = "https://www.wrenchboard.com/assets/images/profile.jpg";
     var profile_p = '';
-    if (this.profile_pic !=''){
-      profile_p="https://www.wrenchboard.com/smedia/LIVE/profile/"+this.profile_pic;
+    if (this.profile_pic_url !=''){
+      //profile_p="https://www.wrenchboard.com/smedia/LIVE/profile/"+this.profile_pic;
+      profile_p = this.profile_pic_url;
     }
     else{
       profile_p = defualtProfilePicture;
diff --git a/src/global.scss b/src/global.scss
index a8d9b5d..ff315d2 100644
--- a/src/global.scss
+++ b/src/global.scss
@@ -233,4 +233,14 @@ ion-content{
 .scan_login_button{
   font-size: 16px;
   font-weight: bolder;
-}
\ No newline at end of file
+}
+.common_segment{
+  background-color: #3dc2ff;
+  font-weight: bolder;
+  ion-segment-button{
+    ion-label{
+      font-weight: bolder;
+    }
+  }
+}
+