diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.html
index aebcd79b4..a394aee70 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.html
@@ -1,5 +1,5 @@
 <!--<pre> {{ m_group | json}}</pre>-->
-<mat-card style="padding: 12px;">
+<mat-card style="padding: 12px;">  
   <p>Supplier Details</p>
   <form *ngIf="apiLoadFinish" [formGroup]="_supplierQuesFrom" (submit)="onSubmit()" novalidate>
     <div fxLayout="row" fxLayoutAlign="start none">
@@ -12,8 +12,7 @@
     </div>
     <div fxLayout="row" fxLayoutAlign="start none">
       <div formArrayName="supplier_details" fxFill>
-        
-              <div *ngFor="let sup of _supplierQuesFrom.controls.supplier_details['controls']; let i=index">
+           <div *ngFor="let sup of _supplierQuesFrom.controls.supplier_details['controls']; let i=index">
                   <mat-card>
                       <mat-card-content> 
                 <div [formGroupName]="i">
@@ -39,7 +38,7 @@
                     </div>
                     <div fxLayout="row wrap" fxLayoutGap="14px" fxLayoutAlign="start none">
                       <div fxFlex="30">
-                        <mat-form-field style="width:260px !important;">
+                        <mat-form-field style="width:100%">
                           <mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode">
                             <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
                           </mat-select>
@@ -60,7 +59,7 @@
                     </div>
                     <div fxLayout="row" fxLayoutGap="14px" fxLayoutAlign="start none">
                       <div fxFlex="30">
-                        <mat-form-field style="width:260px !important;">
+                        <mat-form-field style="width:100%">
                           <mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Frequency of Purchase" formControlName="frequency_of_purchase">
                             <mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.frequency_id">{{ feq.name }}</mat-option>
                           </mat-select>
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/view-pd/view-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/view-pd/view-pd.component.html
index 60a7d8168..1bd277ce8 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/view-pd/view-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/view-pd/view-pd.component.html
@@ -1,32 +1,36 @@
 <mat-card>
   <mat-card-content>
    <div class="mb-2" > 
-     <div fxLayout="row"  fxLayoutAlign="start center" class="filter-header">
-         <div  *ngFor="let master of pdMasterData" class="ml-xs mr-xs" fxFlex="30">
-           <h4>{{master.lender_full_name}} <span *ngIf="master.lender_applicant_id"> - </span>  {{master.lender_applicant_id}}</h4>
-           {{master.pd_date_of_initiation}}
-         </div> 
-          <div *ngFor="let master of pdMasterData" class="ml-xs mr-xs pt-1"   fxFlex="70" style="text-align:right;" >
-            
-           <button  *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.COMPLETED && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button  mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Allocate" matTooltipPosition="above" (click)="pdAllocationTo(master)"><mat-icon>verified_user</mat-icon></button>
-                 <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.COMPLETED && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Schedule" matTooltipPosition="above" (click)="scheduleDetails(master)"><mat-icon>schedule</mat-icon></button>
-                 <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.TRIGGERED && currentPDStatus!=pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Discussion" matTooltipPosition="above" (click)="getPDStart(viewID)"><mat-icon>question_answer</mat-icon></button>
-             <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon"  type="button" matTooltip="Close" matTooltipPosition="above" (click)="loadPdListCompoent()"><mat-icon>close</mat-icon></button>  
-             <br>
-             <!-- <span *ngIf="master.pd_allocated_to" style="color:red;text-align:left" class="fa-1x fa fa-user-secret" matTooltip="PD Officer" 
-             matTooltipPosition="above"></span>       -->
-              
-             <span *ngIf="master.pd_allocated_to && master.fk_pd_type==1" style="color:red;text-align:left"><mat-icon color="primary" class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.pd_allocated_to | titlecase}}</span>
-             <span *ngIf="master.executive_name && master.centralofficer && master.fk_pd_type==2" style="color:red;text-align:left"><mat-icon color="primary" class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.executive_name | titlecase}}/{{master.centralofficer | titlecase}}</span> 
-             <span *ngIf="master.centralofficer && master.fk_pd_type==3" style="color:red;text-align:left"><mat-icon color="primary" class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.centralofficer | titlecase}}</span> 
-
-             &nbsp;&nbsp;
-             <span *ngIf="master.pd_status==pdStatusCheck.SCHEDULED" style="color:red;text-align:left">{{master.pd_status | titlecase}} &nbsp;On&nbsp;{{master.scheduled_on}}</span>
-             <span *ngIf="master.pd_status!=pdStatusCheck.SCHEDULED && master.pd_status!=pdStatusCheck.QC_COMPLETED " style="color:red;text-align:left">{{master.pd_status | titlecase}}</span>
-             <span *ngIf="master.pd_status==pdStatusCheck.QC_COMPLETED " style="color:red;text-align:left">QC Completed</span>
-           </div>
-   
-          </div>  
+     <mat-card>
+      <mat-card-content style="background:#e00201;">
+          <div fxLayout="row"  fxLayoutAlign="start center" class="filter-header">
+              <div  *ngFor="let master of pdMasterData" class="ml-xs mr-xs" fxFlex="35" style="color:#fff;">
+                <h4>{{master.lender_full_name}} </h4>
+                <span *ngIf="master.lender_applicant_id"> {{master.lender_applicant_id}}  -  </span>  {{master.pd_date_of_initiation}}
+              </div> 
+               <div *ngFor="let master of pdMasterData" class="ml-xs mr-xs pt-1"   fxFlex="65" style="text-align:right;" >
+                  <button  *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.COMPLETED && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button  mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Allocate" matTooltipPosition="above" (click)="pdAllocationTo(master)"><mat-icon>verified_user</mat-icon></button>
+                      <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.COMPLETED && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Schedule" matTooltipPosition="above" (click)="scheduleDetails(master)"><mat-icon>schedule</mat-icon></button>
+                      <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.TRIGGERED && currentPDStatus!=pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Discussion" matTooltipPosition="above" (click)="getPDStart(viewID)"><mat-icon>question_answer</mat-icon></button>
+                  <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon"  type="button" matTooltip="Close" matTooltipPosition="above" (click)="loadPdListCompoent()"><mat-icon>close</mat-icon></button>  
+                  <br>
+                  <!-- <span *ngIf="master.pd_allocated_to" style="color:red;text-align:left" class="fa-1x fa fa-user-secret" matTooltip="PD Officer" 
+                  matTooltipPosition="above"></span>       -->
+                   
+                  <span *ngIf="master.pd_allocated_to && master.fk_pd_type==1" style="color:#fff;text-align:left"><mat-icon  class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.pd_allocated_to | titlecase}}</span>
+                  <span *ngIf="master.executive_name && master.centralofficer && master.fk_pd_type==2" style="color:#fff;text-align:left"><mat-icon   class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.executive_name | titlecase}}/{{master.centralofficer | titlecase}}</span> 
+                  <span *ngIf="master.centralofficer && master.fk_pd_type==3" style="color:#fff;text-align:left"><mat-icon  class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.centralofficer | titlecase}}</span> 
+     
+                  &nbsp;&nbsp;
+                  <span *ngIf="master.pd_status==pdStatusCheck.SCHEDULED" style="color:#fff;text-align:left">{{master.pd_status | titlecase}} &nbsp;On&nbsp;{{master.scheduled_on}}</span>
+                  <span *ngIf="master.pd_status!=pdStatusCheck.SCHEDULED && master.pd_status!=pdStatusCheck.QC_COMPLETED " style="color:#fff;text-align:left">{{master.pd_status | titlecase}}</span>
+                  <span *ngIf="master.pd_status==pdStatusCheck.QC_COMPLETED " style="color:#fff;text-align:left">QC Completed</span>
+                </div>
+        
+               </div>
+      </mat-card-content>
+     </mat-card>
+      
  <mat-card-content>
      <div fxLayout="row wrap">
 
@@ -38,15 +42,13 @@
                  <button *ngIf="master.pd_type_name" mat-raised-button mat-button-sm mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="scheduleDetails(master)"><mat-icon>schedule</mat-icon></button>
                -->
                  <button mat-raised-button mat-button-sm mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="editPdMaster(master)"><mat-icon>edit</mat-icon></button>
-                 
-               </div>
+                 </div>
              <mat-card-header>
                 <!--  <img mat-card-avatar src="assets/images/avatar.jpg">
                  <mat-card-title>{{master.lender_full_name}} -  {{master.lender_applicant_id}}
                  </mat-card-title>-->
                  <mat-card-subtitle *ngIf="master.city_name" class="hover-icon"><i class="fa-1x fa fa-map-marker"> </i> &nbsp;<span>{{master.city_name}} / {{master.state_name}}-{{master.pincode}}</span></mat-card-subtitle>
-                 
-               </mat-card-header>
+                </mat-card-header>
              <mat-card-content>
                
                <p *ngIf="master.pd_contact_person || master.pd_contact_mobileno "><span *ngIf="master.pd_contact_person"> <i class="fa-1x fa fa-user-o"></i> {{master.pd_contact_person}}</span>&nbsp;&nbsp; <span *ngIf="master.pd_contact_mobileno"> <i class="fa-1x fa fa-phone"></i> {{master.pd_contact_mobileno}}</span><span style="font-size:13px;"> (Lender Contact Details) </span> </p>
diff --git a/ng6-seed/src/app/quality-check/qc-list/qc-view/qc-view.component.html b/ng6-seed/src/app/quality-check/qc-list/qc-view/qc-view.component.html
index f31e1a45f..5fcdf9e66 100644
--- a/ng6-seed/src/app/quality-check/qc-list/qc-view/qc-view.component.html
+++ b/ng6-seed/src/app/quality-check/qc-list/qc-view/qc-view.component.html
@@ -1,28 +1,31 @@
 <mat-card>
     <mat-card-content>
      <div class="mb-2" > 
-       <div fxLayout="row"  fxLayoutAlign="start center" class="filter-header">
-           <div  *ngFor="let master of pdMasterData" class="ml-xs mr-xs" fxFlex="30">
-             <h4>{{master.lender_full_name}} -  {{master.lender_applicant_id}}</h4>
-             {{master.pd_date_of_initiation}}
-           </div>
-            <div *ngFor="let master of pdMasterData" class="ml-xs mr-xs pt-1"   fxFlex="70" style="text-align:right;" >
-             <button  *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button  mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Allocate" matTooltipPosition="above" (click)="pdAllocationTo(master)"><mat-icon>verified_user</mat-icon></button>
-                   <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Schedule" matTooltipPosition="above" (click)="scheduleDetails(master)"><mat-icon>schedule</mat-icon></button>
-                   <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.TRIGGERED && currentPDStatus!=pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Discussion" matTooltipPosition="above" (click)="getPDStart(viewID)"><mat-icon>question_answer</mat-icon></button>
-               <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon"  type="button" matTooltip="Close" matTooltipPosition="above" (click)="loadPdListCompoent()"><mat-icon>close</mat-icon></button>        
-               <br>      
-                  <span *ngIf="master.pd_allocated_to" style="color:red;text-align:left">{{master.pd_allocated_to | titlecase}}</span> &nbsp;&nbsp;
-                  <span *ngIf="master.pd_status==pdStatusCheck.SCHEDULED" style="color:red;text-align:left">{{master.pd_status | titlecase}} &nbsp;On&nbsp;{{master.scheduled_on}}</span>
-                  <span *ngIf="master.pd_status!=pdStatusCheck.SCHEDULED && master.pd_status!=pdStatusCheck.QC_COMPLETED " style="color:red;text-align:left">{{master.pd_status | titlecase}}</span>
-                  <span *ngIf="master.pd_status==pdStatusCheck.QC_COMPLETED " style="color:red;text-align:left">QC Completed</span>
-               </div>
-     
-            </div>  
-   <mat-card-content>
+       <mat-card>
+         <mat-card-content  style="background:#e00201;">
+            <div fxLayout="row"  fxLayoutAlign="start center" class="filter-header">
+                <div  *ngFor="let master of pdMasterData" class="ml-xs mr-xs" fxFlex="35" style="color:#fff;">
+                  <h4>{{master.lender_full_name}} </h4>
+                  <span *ngIf="master.lender_applicant_id"> {{master.lender_applicant_id}}  -  </span>  {{master.pd_date_of_initiation}}
+                </div>
+                 <div *ngFor="let master of pdMasterData" class="ml-xs mr-xs pt-1"   fxFlex="65" style="text-align:right;" >
+                  <button  *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button  mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Allocate" matTooltipPosition="above" (click)="pdAllocationTo(master)"><mat-icon>verified_user</mat-icon></button>
+                        <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.QC_COMPLETED" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Schedule" matTooltipPosition="above" (click)="scheduleDetails(master)"><mat-icon>schedule</mat-icon></button>
+                        <button *ngIf="master.pd_type_name && currentPDStatus!=pdStatusCheck.DRAFT && currentPDStatus!=pdStatusCheck.TRIGGERED && currentPDStatus!=pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Discussion" matTooltipPosition="above" (click)="getPDStart(viewID)"><mat-icon>question_answer</mat-icon></button>
+                    <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon"  type="button" matTooltip="Close" matTooltipPosition="above" (click)="loadPdListCompoent()"><mat-icon>close</mat-icon></button>        
+                    <br>         
+                       <span *ngIf="master.pd_allocated_to" style="color:#fff;text-align:left"><mat-icon  class="hover-icon" matTooltip="PD Officer" matTooltipPosition="above">person</mat-icon>{{master.pd_allocated_to | titlecase}}</span> &nbsp;&nbsp;
+                       <span *ngIf="master.pd_status==pdStatusCheck.SCHEDULED" style="color:#fff;text-align:left">{{master.pd_status | titlecase}} &nbsp;On&nbsp;{{master.scheduled_on}}</span>
+                       <span *ngIf="master.pd_status!=pdStatusCheck.SCHEDULED && master.pd_status!=pdStatusCheck.QC_COMPLETED " style="color:#fff;text-align:left">{{master.pd_status | titlecase}}</span>
+                       <span *ngIf="master.pd_status==pdStatusCheck.QC_COMPLETED " style="color:#fff;text-align:left">QC Completed</span>
+                    </div>
+          
+                 </div>  
+         </mat-card-content>
+       </mat-card>
+     <mat-card-content>
        <div fxLayout="row wrap">
-
-       <div class="m-gap p-gap" fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50">
+          <div class="m-gap p-gap" fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50">
            <!--pd master  -->
          <mat-card *ngFor="let master of pdMasterData"  class="minheight">
                <div *ngIf="currentPDStatus==pdStatusCheck.DRAFT">