diff --git a/erpnext/public/js/education/lms/components/CardList.vue b/erpnext/public/js/education/lms/components/CardList.vue
index 8f6f7c79aea..d19b7f554de 100644
--- a/erpnext/public/js/education/lms/components/CardList.vue
+++ b/erpnext/public/js/education/lms/components/CardList.vue
@@ -1,5 +1,5 @@
 <template>
-	<section class='section-padding section-bg'>
+	<section :class='sectionType'>
 	<div class='container'>
 		<h3 class='text-center' v-html="title"></h3>
 		<p class='lead text-center' v-html="description"></p>
@@ -12,7 +12,7 @@
 </template>
 <script>
 export default {
-    props:['title', 'description'],
+    props:['title', 'description', 'sectionType'],
     name: "CardList",
 };
 </script>
\ No newline at end of file
diff --git a/erpnext/public/js/education/lms/pages/Home.vue b/erpnext/public/js/education/lms/pages/Home.vue
index a554312f81d..de4415f20e5 100644
--- a/erpnext/public/js/education/lms/pages/Home.vue
+++ b/erpnext/public/js/education/lms/pages/Home.vue
@@ -3,7 +3,7 @@
 	<TopSection :title="portal.title" :description="portal.description">
         <TopSectionButton/>
     </TopSection>
-	<CardList :title="'Featured Programs'" :description="'Master ERPNext'">
+	<CardList :title="'Featured Programs'" :description="'Master ERPNext'" :sectionType="'section-padding section-bg'">
         <ProgramCard slot="card-list-slot" v-for="item in featuredPrograms" :key="item.program.name" :program="item.program" :enrolled="item.is_enrolled"/>
         <AButton slot="list-bottom" :type="'primary'" :size="'lg'" :route="'List/Program'">View All</AButton>
     </CardList>
diff --git a/erpnext/public/js/education/lms/pages/ListPage.vue b/erpnext/public/js/education/lms/pages/ListPage.vue
index 8227383811d..c807f690a03 100644
--- a/erpnext/public/js/education/lms/pages/ListPage.vue
+++ b/erpnext/public/js/education/lms/pages/ListPage.vue
@@ -3,7 +3,7 @@
 		<TopSection :title="portal.title" :description="portal.description">
         	<AButton v-if="isLogin" :type="'primary'" :size="'lg'" :route="{ name: 'signup'}">Sign Up</AButton>
     	</TopSection>
-		<CardList :title="'All Programs'" :description="''">
+		<CardList :title="'All Programs'" :description="''" :sectionType="'section-padding section-bg'">
 			<ProgramCard slot="card-list-slot" v-for="item in masterData" :key="item.program.name" :program="item.program" :enrolled="item.is_enrolled"/>
 		</CardList>
 	</div>
diff --git a/erpnext/public/js/education/lms/pages/ProfilePage.vue b/erpnext/public/js/education/lms/pages/ProfilePage.vue
index 6d303c78377..0177df833cd 100644
--- a/erpnext/public/js/education/lms/pages/ProfilePage.vue
+++ b/erpnext/public/js/education/lms/pages/ProfilePage.vue
@@ -1,9 +1,13 @@
 <template>
 <div>
 	<ProfileInfo :enrolledPrograms="enrolledPrograms"></ProfileInfo>
-	<CardList :title="'Your Progress'" :description="''">
+	<CardList :title="'Your Progress'" :description="''" :sectionType="'section-padding section-bg'">
         <ProgressCard slot="card-list-slot" v-for="program in enrolledPrograms" :program="program" :key="program"/>
     </CardList>
+	<CardList :title="'Quiz Attempts'" :description="''" :sectionType="'section-padding section'">
+        <ScoreCard slot="card-list-slot"/>
+    </CardList>
+	
 </div>
 </template>
 <script>
@@ -12,7 +16,7 @@ import TopSection from "../components/TopSection.vue"
 import CardList from "../components/CardList.vue"
 import ProgressCard from "../components/ProgressCard.vue"
 import ProfileInfo from "../components/ProfileInfo.vue"
-
+import ScoreCard from "../components/ScoreCard.vue"
 
 export default {
     name: "ProfilePage",
@@ -21,7 +25,8 @@ export default {
 		TopSection,
 		CardList,
 		ProfileInfo,		
-		ProgressCard		
+		ProgressCard,
+		ScoreCard		
 	},
 	data() {
 		return {
diff --git a/erpnext/public/js/education/lms/pages/ProgramPage.vue b/erpnext/public/js/education/lms/pages/ProgramPage.vue
index 65bb9a6ddf6..fd216ea17de 100644
--- a/erpnext/public/js/education/lms/pages/ProgramPage.vue
+++ b/erpnext/public/js/education/lms/pages/ProgramPage.vue
@@ -2,7 +2,7 @@
 <div>
 	<TopSection v-bind:title="program.program_name" v-bind:description="program.description">
     </TopSection>
-	<CardList :title="'Courses'" :description="''">
+	<CardList :title="'Courses'" :description="''" :sectionType="'section-padding section-bg'">
         <CourseCard slot="card-list-slot" v-for="course in courseData" :course="course" :program_name="program_name" :key="course.name"/>
     </CardList>
 </div>