diff --git a/src/app/components/family-connect/family-connect.component.html b/src/app/components/family-connect/family-connect.component.html
new file mode 100644
index 0000000..325f27f
--- /dev/null
+++ b/src/app/components/family-connect/family-connect.component.html
@@ -0,0 +1,32 @@
+
+  <ion-card class="connect-invite">
+    <ion-card-header>
+      <ion-card-subtitle><div>You have an invitation waiting</div></ion-card-subtitle>
+    </ion-card-header>
+
+    <ion-card-content>
+      <ion-item lines="none" style="background-color: transparent; border-radius: 10px;">
+        <ion-icon name="megaphone-outline" slot="start" color="danger"></ion-icon>
+        <ion-label>Faith is waiting...</ion-label>
+        <ion-icon name="chevron-forward-outline" slot="end" color="secondary"></ion-icon>
+      </ion-item>
+    </ion-card-content>
+  </ion-card>
+  <p></p>
+  <ion-card class="connect-card">
+    <ion-card-header>
+      <ion-card-title>Family Connect</ion-card-title>
+<!--      <ion-card-subtitle>Card Subtitle</ion-card-subtitle>-->
+    </ion-card-header>
+
+    <ion-card-content>
+      Share, play games, or create challenges with rewards
+      <ion-button
+              expand="block"
+              size="small"
+              fill="outline">
+        Start Connect
+      </ion-button>
+    </ion-card-content>
+  </ion-card>
+
diff --git a/src/app/components/family-connect/family-connect.component.scss b/src/app/components/family-connect/family-connect.component.scss
new file mode 100644
index 0000000..5f8508f
--- /dev/null
+++ b/src/app/components/family-connect/family-connect.component.scss
@@ -0,0 +1,10 @@
+.connect-card{
+  margin: 0px;
+  background: rgb(240,248,255);
+  background: linear-gradient(90deg, rgba(240,248,255,1) 0%, rgba(255,240,248,1) 35%, rgba(255,240,248,1) 100%);
+}
+.connect-invite{
+  margin: 0px;
+  background: rgb(240,248,255);
+  background: linear-gradient(90deg, rgba(240,248,255,1) 0%, rgba(255,240,248,1) 35%, rgba(255,240,248,1) 100%);
+}
\ No newline at end of file
diff --git a/src/app/components/family-connect/family-connect.component.spec.ts b/src/app/components/family-connect/family-connect.component.spec.ts
new file mode 100644
index 0000000..197a500
--- /dev/null
+++ b/src/app/components/family-connect/family-connect.component.spec.ts
@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { FamilyConnectComponent } from './family-connect.component';
+
+describe('FamilyConnectComponent', () => {
+  let component: FamilyConnectComponent;
+  let fixture: ComponentFixture<FamilyConnectComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ FamilyConnectComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(FamilyConnectComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/components/family-connect/family-connect.component.ts b/src/app/components/family-connect/family-connect.component.ts
new file mode 100644
index 0000000..0952028
--- /dev/null
+++ b/src/app/components/family-connect/family-connect.component.ts
@@ -0,0 +1,14 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-family-connect',
+  templateUrl: './family-connect.component.html',
+  styleUrls: ['./family-connect.component.scss'],
+})
+export class FamilyConnectComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {}
+
+}
diff --git a/src/app/pages/home/home-routing.module.ts b/src/app/pages/home/home-routing.module.ts
index e15459f..5e3212f 100644
--- a/src/app/pages/home/home-routing.module.ts
+++ b/src/app/pages/home/home-routing.module.ts
@@ -1,11 +1,3 @@
-/*
-  Authors : initappz (Rahul Jograna)
-  Website : https://initappz.com/
-  App Name : E-Learning App Template
-  This App Template Source code is licensed as per the
-  terms found in the Website https://initappz.com/license
-  Copyright and Good Faith Purchasers © 2021-present initappz.
-*/
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
diff --git a/src/app/pages/home/home.module.ts b/src/app/pages/home/home.module.ts
index 4f10c18..306fde8 100644
--- a/src/app/pages/home/home.module.ts
+++ b/src/app/pages/home/home.module.ts
@@ -23,6 +23,7 @@ import {DashToptoolComponent} from "../../components/dash-toptool/dash-toptool.c
 import {JobownerDashComponent} from "../../components/jobowner-dash/jobowner-dash.component";
 import {WorkersDashComponent} from "../../components/workers-dash/workers-dash.component";
 import {FamilyhomeComponent} from "../../components/familyhome/familyhome.component";
+import { FamilyConnectComponent } from "../../components/family-connect/family-connect.component";
 // @NgModule({
 //   schemas: [CUSTOM_ELEMENTS_SCHEMA]
 // })
@@ -44,7 +45,8 @@ import {FamilyhomeComponent} from "../../components/familyhome/familyhome.compon
     DashToptoolComponent,
     JobownerDashComponent,
     WorkersDashComponent,
-    FamilyhomeComponent
+    FamilyhomeComponent,
+    FamilyConnectComponent
   ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })
diff --git a/src/app/pages/home/home.page.html b/src/app/pages/home/home.page.html
index bb544a1..6c667a4 100644
--- a/src/app/pages/home/home.page.html
+++ b/src/app/pages/home/home.page.html
@@ -56,10 +56,11 @@
       <app-dash-toptool></app-dash-toptool>
     </div>
     <div *ngIf="accountType == 'FAMILY'; else elseFulltag">
+      <app-family-connect></app-family-connect>
       <app-familyhome></app-familyhome>
       <app-familypending></app-familypending>
 <!--      <app-suggestedlist></app-suggestedlist>-->
-      <ion-grid class="fam1">
+      <ion-grid class="fam1" style="box-shadow: 3px 3px #d3d3d3; padding: 0px;">
         <ion-row class="pend-row">
           <ion-col
             class="famleft"
diff --git a/src/app/pages/my-course/my-course.page.html b/src/app/pages/my-course/my-course.page.html
index 2b2bbe6..0c5a97b 100644
--- a/src/app/pages/my-course/my-course.page.html
+++ b/src/app/pages/my-course/my-course.page.html
@@ -22,6 +22,9 @@
         <div class="flex">
           <ion-label class="bold">Available Task(s)</ion-label>
         </div>
+        <div>
+          <ion-searchbar placeholder="Filter by name"></ion-searchbar>
+        </div>
         <div class="video" *ngFor="let item of jobsData;" (click)="viewMarketItem( item )">
           <div class="left">
             <div class="bg_image icon_image" [style.backgroundImage]="'url('+session_image_server+''+curr_session+'/job/'+item.job_uid+')'"></div>