diff --git a/community/lms/doctype/chapter/chapter.json b/community/lms/doctype/chapter/chapter.json
index 36ab38f5..6a985a80 100644
--- a/community/lms/doctype/chapter/chapter.json
+++ b/community/lms/doctype/chapter/chapter.json
@@ -18,7 +18,8 @@
    "fieldname": "title",
    "fieldtype": "Data",
    "in_list_view": 1,
-   "label": "Title"
+   "label": "Title",
+   "reqd": 1
   },
   {
    "fieldname": "description",
@@ -30,7 +31,8 @@
    "fieldtype": "Link",
    "in_list_view": 1,
    "label": "Course",
-   "options": "LMS Course"
+   "options": "LMS Course",
+   "reqd": 1
   },
   {
    "fieldname": "lessons",
@@ -55,7 +57,7 @@
    "link_fieldname": "chapter"
   }
  ],
- "modified": "2021-08-19 13:43:51.025072",
+ "modified": "2021-08-31 10:43:45.866864",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "Chapter",
diff --git a/community/lms/doctype/lesson/lesson.json b/community/lms/doctype/lesson/lesson.json
index 5971085d..e8267c4f 100644
--- a/community/lms/doctype/lesson/lesson.json
+++ b/community/lms/doctype/lesson/lesson.json
@@ -22,18 +22,21 @@
    "fieldtype": "Link",
    "in_list_view": 1,
    "label": "Chapter",
-   "options": "Chapter"
+   "options": "Chapter",
+   "reqd": 1
   },
   {
    "fieldname": "title",
    "fieldtype": "Data",
    "in_list_view": 1,
-   "label": "Title"
+   "label": "Title",
+   "reqd": 1
   },
   {
    "fieldname": "body",
    "fieldtype": "Markdown Editor",
-   "label": "Body"
+   "label": "Body",
+   "reqd": 1
   },
   {
    "fieldname": "index_label",
@@ -67,7 +70,7 @@
  ],
  "index_web_pages_for_search": 1,
  "links": [],
- "modified": "2021-07-27 16:28:29.203624",
+ "modified": "2021-08-31 10:44:14.168257",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "Lesson",
diff --git a/community/lms/doctype/lessons/lessons.json b/community/lms/doctype/lessons/lessons.json
index d4dfddd2..b05f5b13 100644
--- a/community/lms/doctype/lessons/lessons.json
+++ b/community/lms/doctype/lessons/lessons.json
@@ -13,13 +13,14 @@
    "fieldtype": "Link",
    "in_list_view": 1,
    "label": "Lesson",
-   "options": "Lesson"
+   "options": "Lesson",
+   "reqd": 1
   }
  ],
  "index_web_pages_for_search": 1,
  "istable": 1,
  "links": [],
- "modified": "2021-07-27 16:53:52.732191",
+ "modified": "2021-08-31 10:44:42.048232",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "Lessons",
diff --git a/community/lms/widgets/CourseCard.html b/community/lms/widgets/CourseCard.html
index 15501f5d..8fe82fb4 100644
--- a/community/lms/widgets/CourseCard.html
+++ b/community/lms/widgets/CourseCard.html
@@ -70,7 +70,7 @@
     <a class="stretched-link" href="{{ course.get_learn_url(lesson_index) }}{{ query_parameter }}"></a>
 
     {% else %}
-    <div class="view-course-link">
+    <div class="view-course-link is-default">
       View Course <img class="ml-3" src="/assets/community/icons/black-arrow.svg" />
     </div>
     <a class="stretched-link" href="/courses/{{ course.name }}"></a>
diff --git a/community/lms/widgets/Reviews.html b/community/lms/widgets/Reviews.html
index b5302ca3..f9ba6524 100644
--- a/community/lms/widgets/Reviews.html
+++ b/community/lms/widgets/Reviews.html
@@ -1,3 +1,4 @@
+{% if not course.upcoming %}
 <div class="reviews-parent">
   {% set reviews = course.get_reviews() %}
   {% if reviews | length or course.is_eligible_to_review(membership) %}
@@ -35,6 +36,10 @@
     </div>
     {% endfor %}
   </div>
+  {% else %}
+  <div class="common-card-style thread-card">
+    <span class="text-center"> No Reviews <img src="/assets/community/icons/slash.svg"></span>
+  </div>
   {% endif %}
 </div>
 
@@ -89,3 +94,4 @@
     </div>
   </div>
 </div>
+{% endif %}
diff --git a/community/lms/workspace/lms/lms.json b/community/lms/workspace/lms/lms.json
index 6b109a52..3bbe5663 100644
--- a/community/lms/workspace/lms/lms.json
+++ b/community/lms/workspace/lms/lms.json
@@ -49,6 +49,15 @@
    "onboard": 0,
    "type": "Link"
   },
+  {
+   "hidden": 0,
+   "is_query_report": 0,
+   "label": "LMS Course Interest",
+   "link_to": "LMS Course Interest",
+   "link_type": "DocType",
+   "onboard": 0,
+   "type": "Link"
+  },
   {
    "hidden": 0,
    "is_query_report": 0,
@@ -121,7 +130,7 @@
    "type": "Link"
   }
  ],
- "modified": "2021-06-29 15:11:07.324651",
+ "modified": "2021-08-31 10:33:39.838535",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "LMS",
diff --git a/community/public/css/style.css b/community/public/css/style.css
index b6efb7ab..c650300e 100644
--- a/community/public/css/style.css
+++ b/community/public/css/style.css
@@ -32,107 +32,10 @@
   --text-3xl: 22px;
 }
 
-body {
-  padding: 0px;
-  margin: 0px;
-}
-
-.chapter-plan {
-  border-radius: 10px;
-  margin: 20px 0px;
-  padding: 20px;
-  border: 1px solid #ddc;
-  background: white;
-}
-
-.chapter-plan h3 {
-  font-size: 1.1em;
-  font-weight: bold;
-}
-
-.batch {
-  border-radius: 10px;
-  margin: 10px 0px;
-  background: white;
-  box-shadow: 0px 5px 10px rgb(0 0 0 / 10%);
-  border: 1px solid #ddc;
-}
-
-.batch-details {
-  padding: 20px;
-}
-
-.batch .cta {
-  margin-top: 10px;
-  padding: 10px;
-  min-height: 28px;
-  text-align: right;
-  border-top: 1px solid #ddc;
-}
-
-.batch .right {
-  float: right;
-}
-
-img.profile-photo {
-  width: 24px;
-  height: 24px;
-  border-radius: 50%;
-}
-
-.lesson-type {
-  padding-right: 5px;
-}
-
-section {
-  padding: 5rem 0 5rem 0;
-}
-
-.batch-header {
-  background: #eee;
-  border: 2px solid #ddd;
-}
-
-.page-card {
-  max-width: 360px;
-  padding: 15px;
-  margin: 70px auto;
-  border: 1px solid #d1d8dd;
-  border-radius: 8px;
-  background-color: #fff;
-  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
-}
-
-.page-card .page-card-head {
-  padding: 10px 15px;
-  margin: -15px;
-  margin-bottom: 15px;
-  border-bottom: 1px solid #d1d8dd;
-}
-
-.page-card .page-card-head .indicator {
-  color: #36414C;
-  font-size: 14px;
-}
-
-.page-card .page-card-head .indicator::before {
-  margin: 0 6px 0.5px 0px;
-}
-
-.page-card .btn {
-  margin-top: 30px;
-}
-
 input[type=checkbox] {
   appearance: auto;
 }
 
-.progress-image {
-  margin-right: 3px;
-  border-radius: 50px;
-  padding: 5px;
-}
-
 .course-image {
   height: 168px;
   width: 100%;
@@ -272,13 +175,11 @@ input[type=checkbox] {
 
 .view-course-link {
   height: 32px;
-  background: var(--button-background);
   border-radius: 4px;
   font-size: 12px;
   padding: 8px 0px 8px;
   text-align: center;
   line-height: 135%;
-  color: var(--text-color);
 }
 
 .cards-parent {
@@ -578,8 +479,8 @@ input[type=checkbox] {
 }
 
 .is-default {
-  background: #98A1A9;
-  color: #ffffff;
+  background: #F4F5F6;
+  color: #1F272E;
 }
 
 @media (max-width: 600px) {
diff --git a/community/public/icons/slash.svg b/community/public/icons/slash.svg
new file mode 100644
index 00000000..c69604e2
--- /dev/null
+++ b/community/public/icons/slash.svg
@@ -0,0 +1,4 @@
+<svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 22C17.5228 22 22 17.5229 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5229 6.47715 22 12 22Z" stroke="#4C5A67" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5 4.93005L19.14 19.0701" stroke="#4C5A67" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/community/www/courses/course.html b/community/www/courses/course.html
index 5c7298e1..c22f0d52 100644
--- a/community/www/courses/course.html
+++ b/community/www/courses/course.html
@@ -22,8 +22,8 @@
 
 {% macro CourseCardWide(course) %}
 <div class="common-card-style course-card-wide">
-  <div class="course-image-wide {% if not course.image %} default-image {% endif %}"
-    {% if course.image %}style="background-image: url({{ course.image }});"{% endif %}>
+  <div class="course-image-wide {% if not course.image %} default-image {% endif %}" {% if course.image
+    %}style="background-image: url({{ course.image }});" {% endif %}>
     <div class="course-tags">
       {% for tag in course.get_tags() %}
       <div class="course-card-pills">{{ tag }}</div>
@@ -59,8 +59,8 @@
       </a>
       {% endif %}
       {% if course.upcoming %}
-      <button class="button wide-button is-default" id="notify-me" data-course="{{course.name | urlencode}}"
-      {% if is_user_interested %} disabled="disabled" title="Your interest has already been noted." {% endif %} >
+      <button class="button wide-button is-default" id="notify-me" data-course="{{course.name | urlencode}}" {% if
+        is_user_interested %} disabled="disabled" title="Your interest has already been noted." {% endif %}>
         Notify me when available
       </button>
       {% endif %}
@@ -70,10 +70,6 @@
         <img class="ml-2" src="/assets/community/images/play.png" />
       </div>
       {% endif %}
-      {% set certificate = course.is_certified() %}
-      {% if certificate %}
-      <a class="button wide-button is-secondary dark-links" href="/courses/{{ course.name }}/{{ certificate }}">Get Certificate</a>
-      {% endif %}
     </div>
   </div>
 </div>
@@ -101,6 +97,7 @@
 <!-- Course Outline and Creator -->
 
 {% macro CourseOutlineAndCreator(course) %}
+{% set certificate = course.is_certified() %}
 <div class="course-outline-instructor-parent">
   <div class="course-home-outline">
     {{ widgets.CourseOutline(course=course, membership=membership) }}
@@ -137,9 +134,13 @@
           {{ frappe.utils.rounded(progress) }}%
         </div>
         <div class="progress">
-          <div class="progress-bar" role="progressbar" style="width: {{ progress }}%"
-            aria-valuenow="{{ progress }}" aria-valuemin="0" aria-valuemax="100"></div>
+          <div class="progress-bar" role="progressbar" style="width: {{ progress }}%" aria-valuenow="{{ progress }}"
+            aria-valuemin="0" aria-valuemax="100"></div>
         </div>
+        {% if certificate %}
+        <a class="muted-text dark-links mt-5 text-center" href="/courses/{{ course.name }}/{{ certificate }}">Get
+          Certificate</a>
+        {% endif %}
       </div>
     </div>
     {% endif %}
diff --git a/mockups/README.md b/mockups/README.md
deleted file mode 100644
index 40c55bfe..00000000
--- a/mockups/README.md
+++ /dev/null
@@ -1,39 +0,0 @@
-# Mockups
-
-HTML Mockups using [Mockdown][].
-
-[Mockdown]: https://github.com/anandology/mockdown
-
-## How to use
-
-**Step 1:** Get into `mockups` directory
-
-```
-$ cd mockups
-```
-
-**Step 2:** Instal `mockdown`
-
-```
-$ pip install mockdown
-```
-
-**Step 3:** Start mockdown server
-
-```
-$ mockdown
-...
- * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
-...
-```
-
-**Step 4:** See the mockups at <http://localhost:5000/>.
-
-## How does it work?
-
-Mockdown uses [Jinja][] templates for writing HTML.
-
-[Jinja]: https://jinja.palletsprojects.com/
-
-To make is easy to provide test data, Mockdown looks for YAML file with the same name as the template. For example, `home.html` template uses the data from `home.yml`.
-
diff --git a/mockups/base.html b/mockups/base.html
deleted file mode 100644
index 4a48a7ed..00000000
--- a/mockups/base.html
+++ /dev/null
@@ -1,43 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-
-    <!-- Bootstrap CSS -->
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
-    <link href="/static/style.css" rel="stylesheet">
-
-    <title>{% block title %}FOSS United{% endblock %}</title>
-
-  </head>
-  <body>
-    <nav class="navbar navbar-light navbar-expand-lg">
-      <div class="container">
-        <a class="navbar-brand" href="/"><span>Home</span></a>
-        <button aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation" class="navbar-toggler" data-target="#navbarSupportedContent" data-toggle="collapse" type="button">
-        <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbarSupportedContent">
-          <ul class="mr-auto navbar-nav">
-            <li class="nav-item">
-            <a class="nav-link" href="/sketches.html">
-                Sketches
-              </a>
-            </li>
-          </ul>
-          <ul class="ml-auto navbar-nav">
-            <!-- post login tools -->
-            <li class="nav-item">
-            <a class="nav-link btn-login-area" href="/login.html">Login</a>
-            </li>
-          </ul>
-        </div>
-      </div>
-    </nav>
-    {% block content %}
-      <h1>Lorem ipsum...</h1>
-    {% endblock %}
-  </body>
-</html>
diff --git a/mockups/course.html b/mockups/course.html
deleted file mode 100644
index e152d2e9..00000000
--- a/mockups/course.html
+++ /dev/null
@@ -1,114 +0,0 @@
-{% extends "base.html" %}
-
-{% block content %}
-  <div class="container">
-    <div class="course-header">
-      <div class="course-type">course</div>
-      <h1>{{title}}</h1>
-    </div>
-
-    <div class="row">
-      <div class="col-lg-9 col-md-12">
-        <div  class="course-details">
-
-          <h2>Course Description</h2>
-
-          <div class="course-description">
-            {{ description }}
-          </div>
-
-          <div class="preview-video">
-            <iframe
-              width="560"
-              height="315"
-              src="{{youtube_embed_url}}"
-              title="YouTube video player"
-              frameborder="0"
-              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-              allowfullscreen></iframe>
-          </div>
-
-          <h2>Upcoming Batches</h2>
-
-          <div class="row">
-          {% for batch in batches %}
-            <div class="col-lg-4 col-md-6">
-              <div class="batch">
-                <div class="batch-details">
-                <div>Session every {{batch.weekdays}}</div>
-                <div>{{batch.timeslot}}</div>
-                <div>Starting from {{batch.start_date}}</div>
-
-                <div class="course-type" style="color: #888; padding: 10px 0px;">mentors</div>
-
-                {% for m in batch.mentors %}
-                  <div>
-                    <img class="profile-photo" src="{{m.photo_url}}">
-                    <span class="instructor-title">{{m.name}}</span>
-                  </div>
-                {% endfor %}
-                </div>
-                <div class="cta">
-                  <div class="">
-                    <button type="button">Join this Batch</button>
-                  </div>
-                </div>
-              </div>
-            </div>
-          {% endfor %}
-        </div>
-
-
-          <h2>Course Outline</h2>
-
-          {% for chapter in chapters %}
-            <div class="chapter-plan">
-              <h3><span class="chapter-number">{{loop.index}}</span> {{chapter.title}}</h3>
-              <div class="chapter-description">
-                {{chapter.description}}
-              </div>
-
-              <div class="lessons">
-                {% for lesson in chapter.lessons %}
-                  <div class="lesson">
-                    <span class="lesson-type"><i class="{{lesson.icon}}"></i></span>
-                    <span class="lesson-title">{{lesson.title}}</span>
-                  </div>
-                {% endfor %}
-              </div>
-            </div>
-          {% endfor %}
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-md-12">
-        <div class="sidebar">
-          <h3>Instructor</h3>
-          <div class="instructor">
-            <div class="instructor-title">{{instructor.name}}</div>
-            <div class="instructor-subtitle">Created {{instructor.num_courses}} courses</div>
-          </div>
-        </div>
-
-        <div class="sidebar">
-          <h3>Mentors</h3>
-          {% for m in mentors %}
-            <div class="instructor">
-              <div class="instructor-title">{{m.name}}</div>
-              <div class="instructor-subtitle">Mentored {{m.num_courses}} batches</div>
-            </div>
-          {% endfor %}
-
-          <div class="notice">
-            Interested to become a mentor?
-
-            <div><a href="#">Apply Now!</a></div>
-          </div>
-        </div>
-      </div>
-
-      </div>
-    </div>
-  </div>
-
-{% endblock %}
diff --git a/mockups/course.yml b/mockups/course.yml
deleted file mode 100644
index a88dc34c..00000000
--- a/mockups/course.yml
+++ /dev/null
@@ -1,89 +0,0 @@
-title: The Joy of Programming
-description: |
-  Learn the joy of programming by turning the computer into a canvas.
-youtube_embed_url: "https://www.youtube.com/embed/IFWAYnUeHR8?start=149"
-stats:
-  chapters: 4
-  lessons: 25
-  videos: 6
-  completed: 287
-
-instructor:
-  name: Anand Chitipothu
-  num_courses: 4
-
-mentors:
-  - name: Anand Chitipothu
-    num_courses: 4
-  - name: Rushabh Mehta
-    num_courses: 3
-  - name: Jannat Patel
-    num_courses: 3
-
-batches:
-  - id: jp01
-    status: scheduled
-    mentors:
-      - name: Anand Chitipothu
-        photo_url: https://pbs.twimg.com/profile_images/2599066714/igu5hx4wlg3mxucodinl.jpeg
-        num_batches: 4
-    start_date: May 3, 2021
-    weekdays: Mon, Thu
-    timeslot: 5:00-6:00 PM
-
-  - id: jp02
-    status: scheduled
-    mentors:
-      - name: Anand Chitipothu
-        photo_url: https://pbs.twimg.com/profile_images/2599066714/igu5hx4wlg3mxucodinl.jpeg
-        num_batches: 4
-    start_date: May 4, 2021
-    weekdays: Tue, Fri
-    timeslot: 5:00-6:00 PM
-
-  - id: jp03
-    status: scheduled
-    mentors:
-      - name: Rusbhabh Mehta
-        photo_url: https://pbs.twimg.com/profile_images/2599066714/igu5hx4wlg3mxucodinl.jpeg
-        num_batches: 4
-    start_date: May 15, 2021
-    weekdays: Sat
-    timeslot: 5:00-6:00 PM
-
-
-chapters:
-  - title: Getting Started
-    description: |
-      Getting started with programming by turning the computer into a canvas.
-    lessons:
-      - index: 1
-        type: video
-        icon: bi bi-play-circle
-        title: Introduction to Programming
-      - index: 2
-        type: practice
-        icon: bi bi-code-square
-        title: Drawing Shapes
-
-  - title: Repeating Things
-    description: |
-      Isn't it very boring to do the same thing again and again?
-      Well, that is for humans. Computers love to do the same thing again and again.
-      Learn how to tell the computer to repeat multiple times the same task, or
-      with slight change every time.
-
-    lessons:
-      - index: 1
-        type: video
-        icon: bi bi-play-circle
-        title: Rinse and Repeat
-      - index: 2
-        type: practice
-        title: many circles
-        icon: bi bi-check2-circle
-      - index: 3
-        type: practice
-        icon: bi bi-code-square
-        title: print, print, print!
-
diff --git a/mockups/sketches.html b/mockups/sketches.html
deleted file mode 100644
index fee44171..00000000
--- a/mockups/sketches.html
+++ /dev/null
@@ -1,33 +0,0 @@
-{% extends "base.html" %}
-
-{% block content %}
-  <div class="container">
-    <div class="course-header">
-      <h1>Sketches</h1>
-    </div>
-
-    <div class="row sketches-gallery">
-      {% for s in sketches %}
-        <div class="col-md-3">
-          <div class="sketch-card">
-            <div class="sketch-image">
-              <a href="#">
-                <svg width="300" height="300" viewBox="0 0 300 300" fill="none" stroke="black" xmlns="http://www.w3.org/2000/svg">
-                  <circle cx="150" cy="150" r="150.0"></circle>
-                </svg>
-              </a>
-            </div>
-            <div class="sketch-footer">
-              <div class="sketch-title">
-                <a href="#">{{s.title}}</a>
-              </div>
-              <div class="sketch-author">
-                by {{s.author}}
-              </div>
-            </div>
-          </div>
-        </div>
-      {% endfor %}
-    </div>
-  </div>
-{% endblock %}
diff --git a/mockups/sketches.yml b/mockups/sketches.yml
deleted file mode 100644
index ad274f13..00000000
--- a/mockups/sketches.yml
+++ /dev/null
@@ -1,38 +0,0 @@
-sketches:
-  - id: 20
-    title: Big Circle
-    author: Anand Chitipothu
-  - id: 19
-    title: Small Circle
-    author: Anand Chitipothu
-  - id: 18
-    title: Circles in Queue
-    author: Chaitanya
-  - id: 17
-    title: Random Bottom Circles
-    author: Anand Chitipothu
-  - id: 16
-    title: Pipes
-    author: Vishal
-  - id: 15
-    title: New Sketch
-    author: Malleshwari
-
-  - id: 20
-    title: Big Circle
-    author: Anand Chitipothu
-  - id: 19
-    title: Small Circle
-    author: Anand Chitipothu
-  - id: 18
-    title: Circles in Queue
-    author: Chaitanya
-  - id: 17
-    title: Random Bottom Circles
-    author: Anand Chitipothu
-  - id: 16
-    title: Pipes
-    author: Vishal
-  - id: 15
-    title: New Sketch
-    author: Malleshwari
diff --git a/mockups/static/style.css b/mockups/static/style.css
deleted file mode 100644
index f2178eae..00000000
--- a/mockups/static/style.css
+++ /dev/null
@@ -1,221 +0,0 @@
-@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css");
-
-:root {
-  --c1: #fefae0;
-  --c2: #264653;
-  --c3: #e9c46a;
-  --c4: #2a9d8f;
-  --c5: #f4a261;
-  --c6: #e76f51;
-
-  --c7: #ccd5ae;
-
-  --bg: var(--c1);
-  --header-bg: var(--c2);
-  --header-color: var(--c3);
-  --tag-color: var(--c7);
-  --sidebar-bg: var(--c7);
-
-  --h-color: var(--c2);
-
-  --text-color: #333;
-  --text-color-light: #ccc;
-
-  --cta-color: var(--c4);
-}
-
-body {
-  padding: 0px;
-  margin: 0px;
-  background: var(--bg);
-}
-
-.navbar-light {
-  border-bottom: 1px solid #E2E6E9;
-}
-
-.page-header {
-  margin-top: 20px;
-  padding: 20px;
-  border-radius: 10px;
-}
-
-.page-header .page-header{
-  margin-top: 20px;
-  padding: 20px;
-  border-radius: 10px;
-}
-
-.course-header {
-  margin-top: 20px;
-  padding: 20px;
-  background: var(--header-bg);
-  color: var(--header-color);
-  border-radius: 10px;
-}
-
-.course-header h1 {
-  color: inherit;
-}
-
-.course-type {
-  text-transform: uppercase;
-  font-size: 1.0em;
-  color: var(--tag-color);
-}
-
-.sidebar {
-  background: var(--sidebar-bg);
-  margin: 20px 0px;
-  border-radius: 10px;
-  padding: 1px 20px 20px 20px;
-  color: var(--text-color);
-}
-
-.sidebar h3 {
-  margin-top: 20px;
-  color: var(--c2);
-}
-
-.instructor {
-  padding: 10px;
-}
-
-.instructor-title {
-  font-weight: bold;
-}
-
-.instructor-subtitle {
-  font-size: 0.8em;
-  color: var(--text-color);
-}
-
-.sidebar .notice {
-  padding: 10px;
-  border-radius: 10px;
-  border: 1px dashed var(--text-color);
-}
-
-.sidebar .notice a {
-  color: inherit;
-  text-decoration: underline;
-}
-
-.course-details {
-  margin: 20px 0px;
-}
-
-.course-details h2 {
-  color: var(--h-color);
-  font-size: 1.4em;
-  font-weight: bold;
-  margin: 20px 0px 10px 0px;
-}
-
-.chapter-plan {
-  border-radius: 10px;
-  margin: 20px 0px;
-  padding: 20px;
-  border: 1px solid #ddc;
-  background: white;
-}
-
-.chapter-plan h3 {
-  font-size: 1.1em;
-  font-weight: bold;
-}
-
-.chapter-number {
-  background: var(--text-color);
-  color: white;
-  border-radius: 50%;
-  height: 24px;
-  min-width: 24px;
-  align-items: center;
-  padding: 2px 8px 2px 8px;
-  margin-right: 5px;
-}
-
-.chapter-description {
-  margin: 20px 0px;
-}
-
-.lessons {
-  padding-left: 20px;
-}
-.lesson {
-  margin: 5px 0px;
-  font-weight: bold;
-}
-
-.batch {
-  border-radius: 10px;
-  margin: 10px 0px;
-  background: white;
-  border: 1px solid #ddc;
-}
-
-.batch-details {
-  padding: 20px;
-}
-
-.batch .cta {
-  margin-top: 10px;
-  padding: 10px;
-  min-height: 28px;
-  text-align: right;
-  border-top: 1px solid #ddc;
-}
-
-.batch .cta button {
-  background: var(--cta-color);
-  color: white;
-  border: none;
-  border-radius: 5px;
-  padding: 5px 10px;
-}
-
-.batch .right {
-  float: right;
-}
-
-img.profile-photo {
-  width: 24px;
-  height: 24px;
-  border-radius: 50%;
-}
-
-.lesson-type {
-  padding-right: 5px;
-}
-
-.preview-video {
-  text-align: center;
-  margin: 20px 0px;
-}
-
-.preview-video iframe {
-  max-width: 100%
-}
-
-.sketches-gallery svg {
-  width: 200px;
-  height: 200px;
-}
-
-.sketch-card {
-  background: white;
-  border-radius: 10px;
-  border: 1px solid #ddd;
-
-  margin: 10px;
-}
-
-.sketch-card .sketch-image {
-  padding: 10px;
-}
-
-.sketch-footer {
-  padding: 10px;
-  background: #eee;
-}