diff --git a/.github/workflows/comment-goodfirstissue.yml b/.github/workflows/comment-goodfirstissue.yml
new file mode 100644
index 00000000000..97c001be75f
--- /dev/null
+++ b/.github/workflows/comment-goodfirstissue.yml
@@ -0,0 +1,30 @@
+name: Comment on Good First Issue
+
+on:
+  issues:
+    types:
+      - labeled
+
+jobs:
+  comment:
+    if: github.event.label.name == 'good first issue'
+    runs-on: ubuntu-latest
+    
+    steps:
+      - name: Add comment
+        uses: actions/github-script@v6
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            let body = `**Good First Issue - Notes for Contributors**
+              This issue is for **first-time contributors only**. If you are new to TEAMMATES, feel free to submit a PR for this issue.\n\n`
+            body += "*Please note that we allow only one `good first issue` per contributor.* If you have already made a prior contribution to TEAMMATES, you may wish to take a look at issues with the `help wanted` tag instead.\n\n"
+            body += "**We do not assign issues to contributors**. If you would like to pick up this issue, do post a comment below to express your interest and check if there is anyone else who is already working on the issue. We will do our best to reply and give you the go-ahead, but if we don't, feel free to submit a PR as long as there is no one else working on it.\n\n"
+            body += "**To get started**, do read through our [contributing guidelines](https://teammates.github.io/teammates/contributing-doc.html) carefully, and [set up a development environment on your local machine](https://teammates.github.io/teammates/setting-up.html) before making a PR.\n\n"
+            body += "If you need any clarifications on our [developer guide](https://teammates.github.io/teammates/index.html), or are facing issues that are not found in our [troubleshooting guide](https://teammates.github.io/teammates/troubleshooting-guide.html), please [post a message in our discussion forum](https://github.com/TEAMMATES/teammates/discussions)."
+            await github.rest.issues.createComment({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body,
+            })
diff --git a/src/web/app/components/panel-chevron/panel-chevron.component.html b/src/web/app/components/panel-chevron/panel-chevron.component.html
index 9a924686122..48594557a11 100644
--- a/src/web/app/components/panel-chevron/panel-chevron.component.html
+++ b/src/web/app/components/panel-chevron/panel-chevron.component.html
@@ -1,4 +1,4 @@
-<div class="chevron">
+<button type="button" class="chevron btn-course btn btn-primary btn-sm" aria-label="Expand panel" [attr.aria-expanded]=isExpanded>
   <i class="fas fa-chevron-down" *ngIf="!isExpanded"></i>
   <i class="fas fa-chevron-up" *ngIf="isExpanded"></i>
-</div>
+</button>
diff --git a/src/web/app/components/panel-chevron/panel-chevron.component.scss b/src/web/app/components/panel-chevron/panel-chevron.component.scss
index ee53858661d..a00f6edd589 100644
--- a/src/web/app/components/panel-chevron/panel-chevron.component.scss
+++ b/src/web/app/components/panel-chevron/panel-chevron.component.scss
@@ -1,4 +1,10 @@
-.chevron {
+button.chevron {
   display: inline-flex;
   vertical-align: middle;
+  background-color: inherit;
+  border-width: 0;
+}
+
+button.chevron:active {
+  background-color: inherit;
 }
diff --git a/src/web/app/components/question-edit-form/__snapshots__/question-edit-form.component.spec.ts.snap b/src/web/app/components/question-edit-form/__snapshots__/question-edit-form.component.spec.ts.snap
index ff17dc5d3f7..22d1fe0b703 100644
--- a/src/web/app/components/question-edit-form/__snapshots__/question-edit-form.component.spec.ts.snap
+++ b/src/web/app/components/question-edit-form/__snapshots__/question-edit-form.component.spec.ts.snap
@@ -39,13 +39,16 @@ exports[`QuestionEditFormComponent should snap with default view 1`] = `
         class="collapse-caret"
       >
         <tm-panel-chevron>
-          <div
-            class="chevron"
+          <button
+            aria-expanded="true"
+            aria-label="Expand panel"
+            class="chevron btn-course btn btn-primary btn-sm"
+            type="button"
           >
             <i
               class="fas fa-chevron-up"
             />
-          </div>
+          </button>
         </tm-panel-chevron>
       </div>
       <div
@@ -407,6 +410,10 @@ exports[`QuestionEditFormComponent should snap with default view 1`] = `
                 </li>
               </ul>
             </div>
+            <div
+              class="table-responsive"
+            >
+            </div>
             <div
               class="margin-top-15px visibility-message"
             >
diff --git a/src/web/app/components/question-response-panel/question-response-panel.component.ts b/src/web/app/components/question-response-panel/question-response-panel.component.ts
index e1b3a9d6e4c..e44f8a56f55 100644
--- a/src/web/app/components/question-response-panel/question-response-panel.component.ts
+++ b/src/web/app/components/question-response-panel/question-response-panel.component.ts
@@ -96,6 +96,7 @@ export class QuestionResponsePanelComponent {
       next: (sessionResults: SessionResults) => {
         const responses: QuestionOutput = sessionResults.questions[0];
         if (responses) {
+          question.hasResponse = true;
           question.feedbackQuestion = responses.feedbackQuestion;
           question.allResponses = responses.allResponses;
           question.otherResponses = responses.otherResponses;
@@ -104,7 +105,7 @@ export class QuestionResponsePanelComponent {
           question.responsesToSelf = responses.responsesToSelf;
           question.hasResponseButNotVisibleForPreview = responses.hasResponseButNotVisibleForPreview;
           question.hasCommentNotVisibleForPreview = responses.hasCommentNotVisibleForPreview;
-        } else {
+      } else {
           question.hasResponse = false;
           if (question.errorMessage) {
             this.statusMessageService.showSuccessToast('Question '
diff --git a/src/web/app/components/question-submission-form/question-submission-form.component.html b/src/web/app/components/question-submission-form/question-submission-form.component.html
index 069c63a0899..2602f43f081 100644
--- a/src/web/app/components/question-submission-form/question-submission-form.component.html
+++ b/src/web/app/components/question-submission-form/question-submission-form.component.html
@@ -1,12 +1,12 @@
 <div id="question-submission-form-qn-{{ model.questionNumber }}" class="card">
-  <button class="card-header bg-primary text-white question-header cursor-pointer border-0" (click)="toggleQuestionTab();"
-    [ngClass]="isSaved ? 'bg-success' : 'bg-primary'" [attr.aria-expanded]="this.model.isTabExpanded">
+  <div class="card-header bg-primary text-white question-header cursor-pointer border-0" (click)="toggleQuestionTab();"
+    [ngClass]="isSaved ? 'bg-success' : 'bg-primary'">
     <div class="collapse-caret">
-      <tm-panel-chevron [isExpanded]="model.isTabExpanded" aria-hidden="true"></tm-panel-chevron>
+      <tm-panel-chevron [isExpanded]="model.isTabExpanded"></tm-panel-chevron>
     </div>
     <i class="fas fa-check me-2" *ngIf="isSaved" aria-hidden="true"></i>
     <h2 class="question-details"><b>Question {{ model.questionNumber }}: </b>{{ model.questionBrief }}</h2>
-  </button>
+  </div>
 
   <div *ngIf="model.isTabExpanded" @collapseAnim>
     <div class="card-body" *tmIsLoading="model.isLoading">
@@ -214,7 +214,8 @@ <h2 class="question-details"><b>Question {{ model.questionNumber }}: </b>{{ mode
         <div class="col-12 text-center">
           <button id="btn-submit-qn-{{ model.questionNumber }}" type="submit" class="btn btn-success"
                   ngbTooltip="You can save your responses for this question at any time and come back later to continue."
-                  (click)="saveFeedbackResponses()" [disabled]="isSavingResponses || isSubmissionDisabled">
+                  #tooltip="ngbTooltip" (mouseenter)="tooltip.open()"
+                  (click)="saveFeedbackResponses(); tooltip.close();"[disabled]="isSavingResponses || isSubmissionDisabled">
             <tm-ajax-loading *ngIf="isSavingResponses"></tm-ajax-loading>
             <span>{{ isQuestionCountOne ? "Submit Response" : "Submit Response for Question " + model.questionNumber }}</span>
           </button>
diff --git a/src/web/app/components/question-types/question-edit-answer-form/text-question-edit-answer-form.component.html b/src/web/app/components/question-types/question-edit-answer-form/text-question-edit-answer-form.component.html
index 3214e968a25..bc9a583b9bf 100644
--- a/src/web/app/components/question-types/question-edit-answer-form/text-question-edit-answer-form.component.html
+++ b/src/web/app/components/question-types/question-edit-answer-form/text-question-edit-answer-form.component.html
@@ -1,7 +1,7 @@
 <div class="plain-text-area" *ngIf="!questionDetails.shouldAllowRichText">
   <textarea [ngModel]="responseDetails.answer" (ngModelChange)="triggerResponseDetailsChange('answer', $event)" [attr.aria-label]="getAriaLabel()" [disabled]="isDisabled"></textarea>
 </div>
-<tm-rich-text-editor *ngIf="questionDetails.shouldAllowRichText" [attr.aria-label]="getAriaLabel()" [richText]="responseDetails.answer" (richTextChange)="triggerResponseDetailsChange('answer', $event)" [isDisabled]="isDisabled"></tm-rich-text-editor>
+<tm-rich-text-editor *ngIf="questionDetails.shouldAllowRichText" role="textbox" [attr.aria-label]="getAriaLabel()" [richText]="responseDetails.answer" (richTextChange)="triggerResponseDetailsChange('answer', $event)" [isDisabled]="isDisabled"></tm-rich-text-editor>
 <div class="margin-top-7px text-secondary text-end">
   <div id="recommended-length" *ngIf="questionDetails.recommendedLength">
     Recommended length for the answer: {{ questionDetails.recommendedLength }} words
diff --git a/src/web/app/components/user-notifications-list/__snapshots__/user-notifications-list.component.spec.ts.snap b/src/web/app/components/user-notifications-list/__snapshots__/user-notifications-list.component.spec.ts.snap
index 03387d2e0e8..c447e136a41 100644
--- a/src/web/app/components/user-notifications-list/__snapshots__/user-notifications-list.component.spec.ts.snap
+++ b/src/web/app/components/user-notifications-list/__snapshots__/user-notifications-list.component.spec.ts.snap
@@ -80,13 +80,16 @@ exports[`UserNotificationsListComponent should snap when all loaded notification
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="false"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-down"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -109,13 +112,16 @@ exports[`UserNotificationsListComponent should snap when all loaded notification
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="false"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-down"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -253,13 +259,16 @@ exports[`UserNotificationsListComponent should snap when it loads the provided n
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -307,13 +316,16 @@ exports[`UserNotificationsListComponent should snap when it loads the provided n
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -430,13 +442,16 @@ exports[`UserNotificationsListComponent should snap when it sorts the notificati
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -484,13 +499,16 @@ exports[`UserNotificationsListComponent should snap when it sorts the notificati
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -607,13 +625,16 @@ exports[`UserNotificationsListComponent should snap when it sorts the notificati
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -661,13 +682,16 @@ exports[`UserNotificationsListComponent should snap when it sorts the notificati
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
diff --git a/src/web/app/components/visibility-panel/visibility-panel.component.html b/src/web/app/components/visibility-panel/visibility-panel.component.html
index 82957f78264..425928a1cad 100644
--- a/src/web/app/components/visibility-panel/visibility-panel.component.html
+++ b/src/web/app/components/visibility-panel/visibility-panel.component.html
@@ -24,28 +24,30 @@
       </li>
     </ul>
   </div>
-  <table class="table margin-top-15px background-color-white table-striped" *ngIf="model.isUsingOtherVisibilitySetting" aria-label="Custom Visibility Options Table">
-    <thead>
-    <tr>
-      <th scope="col" class="text-start">User/Group</th>
-      <th scope="col" class="text-center" *ngFor="let visibilityControl of VisibilityControl | enumToArray">{{ visibilityControl | visibilityControlName }}</th>
-    </tr>
-    </thead>
-    <tbody id="custom-visibility-table">
-    <ng-container *ngFor="let visibilityType of FeedbackVisibilityType | enumToArray">
-      <tr *ngIf="visibilityStateMachine.isVisibilityTypeApplicable(visibilityType)">
-        <td><span class="ngb-tooltip-class" [ngbTooltip]="visibilityType | visibilityTypeDescription" container="body">{{ visibilityType | visibilityTypeName }}</span></td>
-        <td *ngFor="let visibilityControl of VisibilityControl | enumToArray" class="text-center">
-          <input type="checkbox"
-                 (click)="modifyVisibilityControl($event.target.checked, visibilityType, visibilityControl)"
-                 [checked]="visibilityStateMachine.isVisible(visibilityType, visibilityControl)"
-                 [disabled]="!visibilityStateMachine.isCellEditable(visibilityType, visibilityControl) || !model.isEditable"
-                 [attr.aria-label]="getCheckboxAriaLabel(visibilityType, visibilityControl)">
-        </td>
+  <div class="table-responsive">
+    <table class="table margin-top-15px background-color-white table-striped" *ngIf="model.isUsingOtherVisibilitySetting" aria-label="Custom Visibility Options Table">
+      <thead>
+      <tr>
+        <th scope="col" class="text-start">User/Group</th>
+        <th scope="col" class="text-center" *ngFor="let visibilityControl of VisibilityControl | enumToArray">{{ visibilityControl | visibilityControlName }}</th>
       </tr>
-    </ng-container>
-    </tbody>
-  </table>
+      </thead>
+      <tbody id="custom-visibility-table">
+      <ng-container *ngFor="let visibilityType of FeedbackVisibilityType | enumToArray">
+        <tr *ngIf="visibilityStateMachine.isVisibilityTypeApplicable(visibilityType)">
+          <td><span class="ngb-tooltip-class" [ngbTooltip]="visibilityType | visibilityTypeDescription" container="body">{{ visibilityType | visibilityTypeName }}</span></td>
+          <td *ngFor="let visibilityControl of VisibilityControl | enumToArray" class="text-center">
+            <input type="checkbox"
+                   (click)="modifyVisibilityControl($event.target.checked, visibilityType, visibilityControl)"
+                   [checked]="visibilityStateMachine.isVisible(visibilityType, visibilityControl)"
+                   [disabled]="!visibilityStateMachine.isCellEditable(visibilityType, visibilityControl) || !model.isEditable"
+                   [attr.aria-label]="getCheckboxAriaLabel(visibilityType, visibilityControl)">
+          </td>
+        </tr>
+      </ng-container>
+      </tbody>
+    </table>
+  </div>
   <div class="margin-top-15px visibility-message">
     This is the visibility hint as seen by the feedback giver:
     <ul class="text-muted background-color-warning">
diff --git a/src/web/app/pages-instructor/instructor-course-edit-page/copy-instructors-from-other-courses-modal/__snapshots__/copy-instructors-from-other-courses-modal.component.spec.ts.snap b/src/web/app/pages-instructor/instructor-course-edit-page/copy-instructors-from-other-courses-modal/__snapshots__/copy-instructors-from-other-courses-modal.component.spec.ts.snap
index cda762a9dbe..f05954210be 100644
--- a/src/web/app/pages-instructor/instructor-course-edit-page/copy-instructors-from-other-courses-modal/__snapshots__/copy-instructors-from-other-courses-modal.component.spec.ts.snap
+++ b/src/web/app/pages-instructor/instructor-course-edit-page/copy-instructors-from-other-courses-modal/__snapshots__/copy-instructors-from-other-courses-modal.component.spec.ts.snap
@@ -81,13 +81,16 @@ exports[`CopyInstructorsFromOtherCoursesModalComponent should snap when feedback
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -218,13 +221,16 @@ exports[`CopyInstructorsFromOtherCoursesModalComponent should snap when instruct
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -478,13 +484,16 @@ exports[`CopyInstructorsFromOtherCoursesModalComponent should snap when instruct
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -612,13 +621,16 @@ exports[`CopyInstructorsFromOtherCoursesModalComponent should snap with courses
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="false"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-down"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -640,13 +652,16 @@ exports[`CopyInstructorsFromOtherCoursesModalComponent should snap with courses
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="false"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-down"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
diff --git a/src/web/app/pages-instructor/instructor-home-page/__snapshots__/instructor-home-page.component.spec.ts.snap b/src/web/app/pages-instructor/instructor-home-page/__snapshots__/instructor-home-page.component.spec.ts.snap
index e003acc07c9..0329d14dff8 100644
--- a/src/web/app/pages-instructor/instructor-home-page/__snapshots__/instructor-home-page.component.spec.ts.snap
+++ b/src/web/app/pages-instructor/instructor-home-page/__snapshots__/instructor-home-page.component.spec.ts.snap
@@ -269,15 +269,6 @@ exports[`InstructorHomePageComponent should snap with one course with error load
             >
               [CS3281]: Thematic Systems I
             </b>
-            <tm-panel-chevron>
-              <div
-                class="chevron"
-              >
-                <i
-                  class="fas fa-chevron-up"
-                />
-              </div>
-            </tm-panel-chevron>
           </div>
           <div
             class="card-body padding-0 table-responsive ng-trigger ng-trigger-collapseAnim ng-animating"
@@ -434,6 +425,7 @@ exports[`InstructorHomePageComponent should snap with one course with one feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Students 
                 </button>
@@ -465,6 +457,7 @@ exports[`InstructorHomePageComponent should snap with one course with one feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Instructors 
                 </button>
@@ -489,6 +482,7 @@ exports[`InstructorHomePageComponent should snap with one course with one feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Sessions 
                 </button>
@@ -513,6 +507,7 @@ exports[`InstructorHomePageComponent should snap with one course with one feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn-course btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Course 
                 </button>
@@ -553,16 +548,19 @@ exports[`InstructorHomePageComponent should snap with one course with one feedba
                   </a>
                 </div>
               </span>
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
+                >
+                  <i
+                    class="fas fa-chevron-up"
+                  />
+                </button>
+              </tm-panel-chevron>
             </div>
-            <tm-panel-chevron>
-              <div
-                class="chevron"
-              >
-                <i
-                  class="fas fa-chevron-up"
-                />
-              </div>
-            </tm-panel-chevron>
           </div>
           <div
             class="card-body padding-0 table-responsive ng-trigger ng-trigger-collapseAnim ng-animating"
@@ -1024,6 +1022,7 @@ exports[`InstructorHomePageComponent should snap with one course with two feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Students 
                 </button>
@@ -1048,6 +1047,7 @@ exports[`InstructorHomePageComponent should snap with one course with two feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Instructors 
                 </button>
@@ -1072,6 +1072,7 @@ exports[`InstructorHomePageComponent should snap with one course with two feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Sessions 
                 </button>
@@ -1096,6 +1097,7 @@ exports[`InstructorHomePageComponent should snap with one course with two feedba
                   aria-expanded="false"
                   class="dropdown-toggle btn-course btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Course 
                 </button>
@@ -1120,16 +1122,19 @@ exports[`InstructorHomePageComponent should snap with one course with two feedba
                   </a>
                 </div>
               </span>
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
+                >
+                  <i
+                    class="fas fa-chevron-up"
+                  />
+                </button>
+              </tm-panel-chevron>
             </div>
-            <tm-panel-chevron>
-              <div
-                class="chevron"
-              >
-                <i
-                  class="fas fa-chevron-up"
-                />
-              </div>
-            </tm-panel-chevron>
           </div>
           <div
             class="card-body padding-0 table-responsive ng-trigger ng-trigger-collapseAnim ng-animating"
@@ -1771,6 +1776,7 @@ exports[`InstructorHomePageComponent should snap with one course with unexpanded
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Students 
                 </button>
@@ -1802,6 +1808,7 @@ exports[`InstructorHomePageComponent should snap with one course with unexpanded
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Instructors 
                 </button>
@@ -1826,6 +1833,7 @@ exports[`InstructorHomePageComponent should snap with one course with unexpanded
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Sessions 
                 </button>
@@ -1850,6 +1858,7 @@ exports[`InstructorHomePageComponent should snap with one course with unexpanded
                   aria-expanded="false"
                   class="dropdown-toggle btn-course btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Course 
                 </button>
@@ -1890,16 +1899,19 @@ exports[`InstructorHomePageComponent should snap with one course with unexpanded
                   </a>
                 </div>
               </span>
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="false"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
+                >
+                  <i
+                    class="fas fa-chevron-down"
+                  />
+                </button>
+              </tm-panel-chevron>
             </div>
-            <tm-panel-chevron>
-              <div
-                class="chevron"
-              >
-                <i
-                  class="fas fa-chevron-down"
-                />
-              </div>
-            </tm-panel-chevron>
           </div>
         </div>
       </div>
@@ -2032,6 +2044,7 @@ exports[`InstructorHomePageComponent should snap with one course with unpopulate
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Students 
                 </button>
@@ -2063,6 +2076,7 @@ exports[`InstructorHomePageComponent should snap with one course with unpopulate
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Instructors 
                 </button>
@@ -2087,6 +2101,7 @@ exports[`InstructorHomePageComponent should snap with one course with unpopulate
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Sessions 
                 </button>
@@ -2111,6 +2126,7 @@ exports[`InstructorHomePageComponent should snap with one course with unpopulate
                   aria-expanded="false"
                   class="dropdown-toggle btn-course btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Course 
                 </button>
@@ -2151,16 +2167,19 @@ exports[`InstructorHomePageComponent should snap with one course with unpopulate
                   </a>
                 </div>
               </span>
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
+                >
+                  <i
+                    class="fas fa-chevron-up"
+                  />
+                </button>
+              </tm-panel-chevron>
             </div>
-            <tm-panel-chevron>
-              <div
-                class="chevron"
-              >
-                <i
-                  class="fas fa-chevron-up"
-                />
-              </div>
-            </tm-panel-chevron>
           </div>
           <div
             class="card-body padding-0 table-responsive ng-trigger ng-trigger-collapseAnim ng-animating"
@@ -2317,6 +2336,7 @@ exports[`InstructorHomePageComponent should snap with one course without feedbac
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Students 
                 </button>
@@ -2348,6 +2368,7 @@ exports[`InstructorHomePageComponent should snap with one course without feedbac
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Instructors 
                 </button>
@@ -2372,6 +2393,7 @@ exports[`InstructorHomePageComponent should snap with one course without feedbac
                   aria-expanded="false"
                   class="dropdown-toggle btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Sessions 
                 </button>
@@ -2396,6 +2418,7 @@ exports[`InstructorHomePageComponent should snap with one course without feedbac
                   aria-expanded="false"
                   class="dropdown-toggle btn-course btn btn-primary btn-sm"
                   ngbdropdowntoggle=""
+                  type="button"
                 >
                    Course 
                 </button>
@@ -2436,16 +2459,19 @@ exports[`InstructorHomePageComponent should snap with one course without feedbac
                   </a>
                 </div>
               </span>
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
+                >
+                  <i
+                    class="fas fa-chevron-up"
+                  />
+                </button>
+              </tm-panel-chevron>
             </div>
-            <tm-panel-chevron>
-              <div
-                class="chevron"
-              >
-                <i
-                  class="fas fa-chevron-up"
-                />
-              </div>
-            </tm-panel-chevron>
           </div>
           <div
             class="card-body padding-0 table-responsive ng-trigger ng-trigger-collapseAnim ng-animating"
diff --git a/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.html b/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.html
index 0010254a818..ef138c4b800 100644
--- a/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.html
+++ b/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.html
@@ -45,7 +45,7 @@ <h1>Home</h1>
             courseTabModel.course.courseName }}</b>
           <div class="card-header-btn-toolbar flex-lg-shrink-0" *ngIf="courseTabModel.isAjaxSuccess">
             <span ngbDropdown>
-              <button class="btn btn-primary btn-sm" ngbDropdownToggle> Students </button>
+              <button type="button" class="btn btn-primary btn-sm" ngbDropdownToggle> Students </button>
               <div ngbDropdownMenu (click)="$event.stopPropagation()">
                 <ng-container *ngIf="courseTabModel.instructorPrivilege.canModifyStudent">
                   <a class="btn btn-info btn-sm dropdown-item" tmRouterLink="/web/instructor/courses/enroll"
@@ -58,7 +58,7 @@ <h1>Home</h1>
               </div>
             </span>
             <span ngbDropdown>
-              <button class="btn btn-primary btn-sm" ngbDropdownToggle> Instructors </button>
+              <button type="button" class="btn btn-primary btn-sm" ngbDropdownToggle> Instructors </button>
               <div ngbDropdownMenu (click)="$event.stopPropagation()">
                 <a class="btn btn-light btn-sm dropdown-item" tmRouterLink="/web/instructor/courses/edit"
                   [queryParams]="{courseid: courseTabModel.course.courseId}"> View / Edit
@@ -66,7 +66,7 @@ <h1>Home</h1>
               </div>
             </span>
             <span ngbDropdown>
-              <button class="btn btn-primary btn-sm" ngbDropdownToggle> Sessions </button>
+              <button type="button" class="btn btn-primary btn-sm" ngbDropdownToggle> Sessions </button>
               <div ngbDropdownMenu (click)="$event.stopPropagation()">
                 <a class="btn btn-light btn-sm dropdown-item" tmRouterLink="/web/instructor/sessions"
                   [queryParams]="{courseid: courseTabModel.course.courseId}"> Add
@@ -74,7 +74,7 @@ <h1>Home</h1>
               </div>
             </span>
             <span ngbDropdown>
-              <button class="btn-course btn btn-primary btn-sm" ngbDropdownToggle> Course </button>
+              <button type="button" class="btn-course btn btn-primary btn-sm" ngbDropdownToggle> Course </button>
               <div ngbDropdownMenu (click)="$event.stopPropagation()">
                 <a class="btn-archive-course btn btn-light btn-sm dropdown-item"
                   ngbTooltip="Archive the course so that it will not be shown in the home page any more (you can still access it from the 'Courses' tab)"
@@ -100,8 +100,8 @@ <h1>Home</h1>
                 </ng-container>
               </div>
             </span>
+            <tm-panel-chevron [isExpanded]="courseTabModel.isTabExpanded"></tm-panel-chevron>
           </div>
-          <tm-panel-chevron [isExpanded]="courseTabModel.isTabExpanded"></tm-panel-chevron>
         </div>
         <div class="card-body padding-0 table-responsive" *ngIf="courseTabModel.isTabExpanded" @collapseAnim>
           <tm-loading-retry [shouldShowRetry]="courseTabModel.hasLoadingFailed"
diff --git a/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.scss b/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.scss
index 9dfb8f9e6e0..2b17ba4d9bb 100644
--- a/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.scss
+++ b/src/web/app/pages-instructor/instructor-home-page/instructor-home-page.component.scss
@@ -27,3 +27,21 @@
 .text-color-lightgray {
   color: lightgray;
 }
+
+@media (max-width: 450px) {
+  .card-header {
+    display: block;
+  }
+
+  .card-header-btn-toolbar {
+    text-align: right;
+    display: inline-flex;
+    align-items: center;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+  }
+
+  tm-panel-chevron {
+    margin-left: auto;
+  }
+}
diff --git a/src/web/app/pages-instructor/instructor-session-edit-page/__snapshots__/instructor-session-edit-page.component.spec.ts.snap b/src/web/app/pages-instructor/instructor-session-edit-page/__snapshots__/instructor-session-edit-page.component.spec.ts.snap
index 4a556b097b5..2c1e794cd42 100644
--- a/src/web/app/pages-instructor/instructor-session-edit-page/__snapshots__/instructor-session-edit-page.component.spec.ts.snap
+++ b/src/web/app/pages-instructor/instructor-session-edit-page/__snapshots__/instructor-session-edit-page.component.spec.ts.snap
@@ -1298,13 +1298,16 @@ exports[`InstructorSessionEditPageComponent should snap with feedback session qu
                 class="collapse-caret"
               >
                 <tm-panel-chevron>
-                  <div
-                    class="chevron"
+                  <button
+                    aria-expanded="true"
+                    aria-label="Expand panel"
+                    class="chevron btn-course btn btn-primary btn-sm"
+                    type="button"
                   >
                     <i
                       class="fas fa-chevron-up"
                     />
-                  </div>
+                  </button>
                 </tm-panel-chevron>
               </div>
               <div
@@ -1779,181 +1782,185 @@ exports[`InstructorSessionEditPageComponent should snap with feedback session qu
                         </li>
                       </ul>
                     </div>
-                    <table
-                      aria-label="Custom Visibility Options Table"
-                      class="table margin-top-15px background-color-white table-striped"
-                      style=""
+                    <div
+                      class="table-responsive"
                     >
-                      <thead>
-                        <tr>
-                          <th
-                            class="text-start"
-                            scope="col"
-                          >
-                            User/Group
-                          </th>
-                          <th
-                            class="text-center"
-                            scope="col"
-                          >
-                            Can see answer
-                          </th>
-                          <th
-                            class="text-center"
-                            scope="col"
-                          >
-                            Can see giver's name
-                          </th>
-                          <th
-                            class="text-center"
-                            scope="col"
-                          >
-                            Can see recipient's name
-                          </th>
-                        </tr>
-                      </thead>
-                      <tbody
-                        id="custom-visibility-table"
+                      <table
+                        aria-label="Custom Visibility Options Table"
+                        class="table margin-top-15px background-color-white table-striped"
+                        style=""
                       >
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                        <thead>
+                          <tr>
+                            <th
+                              class="text-start"
+                              scope="col"
                             >
-                              Recipient(s)
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Recipient(s) can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Recipient(s) can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Recipient(s) can see Recipient's Name"
-                              disabled=""
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                              User/Group
+                            </th>
+                            <th
+                              class="text-center"
+                              scope="col"
                             >
-                              Giver's Team Members
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Giver's Team Members can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Giver's Team Members can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Giver's Team Members can see Recipient's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                              Can see answer
+                            </th>
+                            <th
+                              class="text-center"
+                              scope="col"
                             >
-                              Other students
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Other Students can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Other Students can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Other Students can see Recipient's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                              Can see giver's name
+                            </th>
+                            <th
+                              class="text-center"
+                              scope="col"
                             >
-                              Instructors
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Instructors can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Instructors can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Instructors can see Recipient's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                      </tbody>
-                    </table>
+                              Can see recipient's name
+                            </th>
+                          </tr>
+                        </thead>
+                        <tbody
+                          id="custom-visibility-table"
+                        >
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Recipient(s)
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Recipient(s) can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Recipient(s) can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Recipient(s) can see Recipient's Name"
+                                disabled=""
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Giver's Team Members
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Giver's Team Members can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Giver's Team Members can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Giver's Team Members can see Recipient's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Other students
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Other Students can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Other Students can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Other Students can see Recipient's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Instructors
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Instructors can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Instructors can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Instructors can see Recipient's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </div>
                     <div
                       class="margin-top-15px visibility-message"
                     >
@@ -2021,13 +2028,16 @@ exports[`InstructorSessionEditPageComponent should snap with feedback session qu
                 class="collapse-caret"
               >
                 <tm-panel-chevron>
-                  <div
-                    class="chevron"
+                  <button
+                    aria-expanded="true"
+                    aria-label="Expand panel"
+                    class="chevron btn-course btn btn-primary btn-sm"
+                    type="button"
                   >
                     <i
                       class="fas fa-chevron-up"
                     />
-                  </div>
+                  </button>
                 </tm-panel-chevron>
               </div>
               <div
@@ -2502,181 +2512,185 @@ exports[`InstructorSessionEditPageComponent should snap with feedback session qu
                         </li>
                       </ul>
                     </div>
-                    <table
-                      aria-label="Custom Visibility Options Table"
-                      class="table margin-top-15px background-color-white table-striped"
-                      style=""
+                    <div
+                      class="table-responsive"
                     >
-                      <thead>
-                        <tr>
-                          <th
-                            class="text-start"
-                            scope="col"
-                          >
-                            User/Group
-                          </th>
-                          <th
-                            class="text-center"
-                            scope="col"
-                          >
-                            Can see answer
-                          </th>
-                          <th
-                            class="text-center"
-                            scope="col"
-                          >
-                            Can see giver's name
-                          </th>
-                          <th
-                            class="text-center"
-                            scope="col"
-                          >
-                            Can see recipient's name
-                          </th>
-                        </tr>
-                      </thead>
-                      <tbody
-                        id="custom-visibility-table"
+                      <table
+                        aria-label="Custom Visibility Options Table"
+                        class="table margin-top-15px background-color-white table-striped"
+                        style=""
                       >
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                        <thead>
+                          <tr>
+                            <th
+                              class="text-start"
+                              scope="col"
                             >
-                              Recipient(s)
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Recipient(s) can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Recipient(s) can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Recipient(s) can see Recipient's Name"
-                              disabled=""
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                              User/Group
+                            </th>
+                            <th
+                              class="text-center"
+                              scope="col"
                             >
-                              Giver's Team Members
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Giver's Team Members can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Giver's Team Members can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Giver's Team Members can see Recipient's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                              Can see answer
+                            </th>
+                            <th
+                              class="text-center"
+                              scope="col"
                             >
-                              Other students
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Other Students can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Other Students can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Other Students can see Recipient's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                        <tr>
-                          <td>
-                            <span
-                              class="ngb-tooltip-class"
-                              container="body"
+                              Can see giver's name
+                            </th>
+                            <th
+                              class="text-center"
+                              scope="col"
                             >
-                              Instructors
-                            </span>
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Instructors can see Answer"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Instructors can see Giver's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                          <td
-                            class="text-center"
-                          >
-                            <input
-                              aria-label="Instructors can see Recipient's Name"
-                              type="checkbox"
-                            />
-                          </td>
-                        </tr>
-                      </tbody>
-                    </table>
+                              Can see recipient's name
+                            </th>
+                          </tr>
+                        </thead>
+                        <tbody
+                          id="custom-visibility-table"
+                        >
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Recipient(s)
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Recipient(s) can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Recipient(s) can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Recipient(s) can see Recipient's Name"
+                                disabled=""
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Giver's Team Members
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Giver's Team Members can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Giver's Team Members can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Giver's Team Members can see Recipient's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Other students
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Other Students can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Other Students can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Other Students can see Recipient's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                          <tr>
+                            <td>
+                              <span
+                                class="ngb-tooltip-class"
+                                container="body"
+                              >
+                                Instructors
+                              </span>
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Instructors can see Answer"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Instructors can see Giver's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                            <td
+                              class="text-center"
+                            >
+                              <input
+                                aria-label="Instructors can see Recipient's Name"
+                                type="checkbox"
+                              />
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </div>
                     <div
                       class="margin-top-15px visibility-message"
                     >
@@ -3956,13 +3970,16 @@ exports[`InstructorSessionEditPageComponent should snap with new question added
             class="collapse-caret"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
           <div
@@ -4546,215 +4563,219 @@ exports[`InstructorSessionEditPageComponent should snap with new question added
                     </li>
                   </ul>
                 </div>
-                <table
-                  aria-label="Custom Visibility Options Table"
-                  class="table margin-top-15px background-color-white table-striped"
-                  style=""
+                <div
+                  class="table-responsive"
                 >
-                  <thead>
-                    <tr>
-                      <th
-                        class="text-start"
-                        scope="col"
-                      >
-                        User/Group
-                      </th>
-                      <th
-                        class="text-center"
-                        scope="col"
-                      >
-                        Can see answer
-                      </th>
-                      <th
-                        class="text-center"
-                        scope="col"
-                      >
-                        Can see giver's name
-                      </th>
-                      <th
-                        class="text-center"
-                        scope="col"
-                      >
-                        Can see recipient's name
-                      </th>
-                    </tr>
-                  </thead>
-                  <tbody
-                    id="custom-visibility-table"
+                  <table
+                    aria-label="Custom Visibility Options Table"
+                    class="table margin-top-15px background-color-white table-striped"
+                    style=""
                   >
-                    <tr>
-                      <td>
-                        <span
-                          class="ngb-tooltip-class"
-                          container="body"
+                    <thead>
+                      <tr>
+                        <th
+                          class="text-start"
+                          scope="col"
                         >
-                          Recipient(s)
-                        </span>
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Recipient(s) can see Answer"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Recipient(s) can see Giver's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Recipient(s) can see Recipient's Name"
-                          disabled=""
-                          type="checkbox"
-                        />
-                      </td>
-                    </tr>
-                    <tr>
-                      <td>
-                        <span
-                          class="ngb-tooltip-class"
-                          container="body"
+                          User/Group
+                        </th>
+                        <th
+                          class="text-center"
+                          scope="col"
                         >
-                          Giver's Team Members
-                        </span>
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Giver's Team Members can see Answer"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Giver's Team Members can see Giver's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Giver's Team Members can see Recipient's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                    </tr>
-                    <tr>
-                      <td>
-                        <span
-                          class="ngb-tooltip-class"
-                          container="body"
+                          Can see answer
+                        </th>
+                        <th
+                          class="text-center"
+                          scope="col"
                         >
-                          Recipient's Team Members
-                        </span>
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Recipient's Team Members can see Answer"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Recipient's Team Members can see Giver's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Recipient's Team Members can see Recipient's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                    </tr>
-                    <tr>
-                      <td>
-                        <span
-                          class="ngb-tooltip-class"
-                          container="body"
+                          Can see giver's name
+                        </th>
+                        <th
+                          class="text-center"
+                          scope="col"
                         >
-                          Other students
-                        </span>
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Other Students can see Answer"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Other Students can see Giver's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Other Students can see Recipient's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                    </tr>
-                    <tr>
-                      <td>
-                        <span
-                          class="ngb-tooltip-class"
-                          container="body"
+                          Can see recipient's name
+                        </th>
+                      </tr>
+                    </thead>
+                    <tbody
+                      id="custom-visibility-table"
+                    >
+                      <tr>
+                        <td>
+                          <span
+                            class="ngb-tooltip-class"
+                            container="body"
+                          >
+                            Recipient(s)
+                          </span>
+                        </td>
+                        <td
+                          class="text-center"
                         >
-                          Instructors
-                        </span>
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Instructors can see Answer"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Instructors can see Giver's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                      <td
-                        class="text-center"
-                      >
-                        <input
-                          aria-label="Instructors can see Recipient's Name"
-                          type="checkbox"
-                        />
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
+                          <input
+                            aria-label="Recipient(s) can see Answer"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Recipient(s) can see Giver's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Recipient(s) can see Recipient's Name"
+                            disabled=""
+                            type="checkbox"
+                          />
+                        </td>
+                      </tr>
+                      <tr>
+                        <td>
+                          <span
+                            class="ngb-tooltip-class"
+                            container="body"
+                          >
+                            Giver's Team Members
+                          </span>
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Giver's Team Members can see Answer"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Giver's Team Members can see Giver's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Giver's Team Members can see Recipient's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                      </tr>
+                      <tr>
+                        <td>
+                          <span
+                            class="ngb-tooltip-class"
+                            container="body"
+                          >
+                            Recipient's Team Members
+                          </span>
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Recipient's Team Members can see Answer"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Recipient's Team Members can see Giver's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Recipient's Team Members can see Recipient's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                      </tr>
+                      <tr>
+                        <td>
+                          <span
+                            class="ngb-tooltip-class"
+                            container="body"
+                          >
+                            Other students
+                          </span>
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Other Students can see Answer"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Other Students can see Giver's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Other Students can see Recipient's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                      </tr>
+                      <tr>
+                        <td>
+                          <span
+                            class="ngb-tooltip-class"
+                            container="body"
+                          >
+                            Instructors
+                          </span>
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Instructors can see Answer"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Instructors can see Giver's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                        <td
+                          class="text-center"
+                        >
+                          <input
+                            aria-label="Instructors can see Recipient's Name"
+                            type="checkbox"
+                          />
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </div>
                 <div
                   class="margin-top-15px visibility-message"
                 >
diff --git a/src/web/app/pages-instructor/instructor-session-edit-page/copy-questions-from-other-sessions-modal/__snapshots__/copy-questions-from-other-sessions-modal.component.spec.ts.snap b/src/web/app/pages-instructor/instructor-session-edit-page/copy-questions-from-other-sessions-modal/__snapshots__/copy-questions-from-other-sessions-modal.component.spec.ts.snap
index 2bfa2d770dd..495af9d2180 100644
--- a/src/web/app/pages-instructor/instructor-session-edit-page/copy-questions-from-other-sessions-modal/__snapshots__/copy-questions-from-other-sessions-modal.component.spec.ts.snap
+++ b/src/web/app/pages-instructor/instructor-session-edit-page/copy-questions-from-other-sessions-modal/__snapshots__/copy-questions-from-other-sessions-modal.component.spec.ts.snap
@@ -80,13 +80,16 @@ exports[`CopyQuestionsFromOtherSessionsModalComponent should snap when feedback
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -288,13 +291,16 @@ exports[`CopyQuestionsFromOtherSessionsModalComponent should snap when feedback
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -420,13 +426,16 @@ exports[`CopyQuestionsFromOtherSessionsModalComponent should snap when feedback
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -638,13 +647,16 @@ exports[`CopyQuestionsFromOtherSessionsModalComponent should snap with feedback
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="false"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-down"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
@@ -668,13 +680,16 @@ exports[`CopyQuestionsFromOtherSessionsModalComponent should snap with feedback
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="false"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-down"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
diff --git a/src/web/app/pages-instructor/instructor-student-activity-logs/__snapshots__/instructor-student-activity-logs.component.spec.ts.snap b/src/web/app/pages-instructor/instructor-student-activity-logs/__snapshots__/instructor-student-activity-logs.component.spec.ts.snap
index 8fb22eed5b3..2c2f0ec0b7e 100644
--- a/src/web/app/pages-instructor/instructor-student-activity-logs/__snapshots__/instructor-student-activity-logs.component.spec.ts.snap
+++ b/src/web/app/pages-instructor/instructor-student-activity-logs/__snapshots__/instructor-student-activity-logs.component.spec.ts.snap
@@ -1249,13 +1249,16 @@ exports[`InstructorStudentActivityLogsComponent should snap with results of a se
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
@@ -1431,13 +1434,16 @@ exports[`InstructorStudentActivityLogsComponent should snap with results of a se
               class="card-header-btn-toolbar"
             >
               <tm-panel-chevron>
-                <div
-                  class="chevron"
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
           </div>
diff --git a/src/web/app/pages-instructor/instructor-student-list-page/__snapshots__/instructor-student-list-page.component.spec.ts.snap b/src/web/app/pages-instructor/instructor-student-list-page/__snapshots__/instructor-student-list-page.component.spec.ts.snap
index 1af0749d7cb..fbb9e7a35d7 100644
--- a/src/web/app/pages-instructor/instructor-student-list-page/__snapshots__/instructor-student-list-page.component.spec.ts.snap
+++ b/src/web/app/pages-instructor/instructor-student-list-page/__snapshots__/instructor-student-list-page.component.spec.ts.snap
@@ -86,13 +86,16 @@ exports[`InstructorStudentListPageComponent should snap with a course with stude
             class="card-header-btn-toolbar"
           >
             <tm-panel-chevron>
-              <div
-                class="chevron"
+              <button
+                aria-expanded="true"
+                aria-label="Expand panel"
+                class="chevron btn-course btn btn-primary btn-sm"
+                type="button"
               >
                 <i
                   class="fas fa-chevron-up"
                 />
-              </div>
+              </button>
             </tm-panel-chevron>
           </div>
         </div>
diff --git a/src/web/app/pages-session/session-result-page/session-result-page.component.spec.ts b/src/web/app/pages-session/session-result-page/session-result-page.component.spec.ts
index 9cffde1612e..48c6b131a2b 100644
--- a/src/web/app/pages-session/session-result-page/session-result-page.component.spec.ts
+++ b/src/web/app/pages-session/session-result-page/session-result-page.component.spec.ts
@@ -391,7 +391,7 @@ describe('SessionResultPageComponent', () => {
       otherResponses: [],
       isLoading: false,
       isLoaded: false,
-      hasResponse: true,
+      hasResponse: false,
       hasResponseButNotVisibleForPreview: false,
       hasCommentNotVisibleForPreview: false,
     };
diff --git a/src/web/app/pages-session/session-result-page/session-result-page.component.ts b/src/web/app/pages-session/session-result-page/session-result-page.component.ts
index 4ad7fd4566b..9dcbeb6563a 100644
--- a/src/web/app/pages-session/session-result-page/session-result-page.component.ts
+++ b/src/web/app/pages-session/session-result-page/session-result-page.component.ts
@@ -327,7 +327,7 @@ export class SessionResultPageComponent implements OnInit {
                     otherResponses: [],
                     isLoading: false,
                     isLoaded: false,
-                    hasResponse: true,
+                    hasResponse: false,
                     hasResponseButNotVisibleForPreview: false,
                     hasCommentNotVisibleForPreview: false,
                   });
diff --git a/src/web/app/pages-session/session-submission-page/__snapshots__/session-submission-page.component.spec.ts.snap b/src/web/app/pages-session/session-submission-page/__snapshots__/session-submission-page.component.spec.ts.snap
index 5c5e4ac3433..c298b13ebfe 100644
--- a/src/web/app/pages-session/session-submission-page/__snapshots__/session-submission-page.component.spec.ts.snap
+++ b/src/web/app/pages-session/session-submission-page/__snapshots__/session-submission-page.component.spec.ts.snap
@@ -891,23 +891,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-1"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -922,7 +922,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -1157,23 +1157,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-3"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -1188,7 +1188,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -1375,23 +1375,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-2"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <h2
@@ -1402,7 +1402,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -1482,23 +1482,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-4"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -1513,7 +1513,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               MSQ question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -1782,23 +1782,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-5"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -1813,7 +1813,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               numerical scale question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -1992,23 +1992,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-6"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -2023,7 +2023,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               constant sum question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -2216,23 +2216,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-7"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -2247,7 +2247,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               contribution question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -2670,23 +2670,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-8"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -2701,7 +2701,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -3009,23 +3009,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-9"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -3040,7 +3040,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -3286,23 +3286,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-10"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -3317,7 +3317,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -3727,23 +3727,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-1"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -3758,7 +3758,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -3998,23 +3998,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-3"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -4029,7 +4029,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -4217,23 +4217,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-2"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <h2
@@ -4244,7 +4244,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -4324,23 +4324,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-4"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -4355,7 +4355,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               MSQ question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -4630,23 +4630,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-5"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -4661,7 +4661,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               numerical scale question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -4842,23 +4842,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-6"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -4873,7 +4873,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               constant sum question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -5068,23 +5068,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-7"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -5099,7 +5099,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               contribution question
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -5524,23 +5524,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-8"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -5555,7 +5555,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -5873,23 +5873,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-9"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -5904,7 +5904,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""
@@ -6152,23 +6152,23 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
           class="card"
           id="question-submission-form-qn-10"
         >
-          <button
-            aria-expanded="true"
+          <div
             class="card-header bg-primary text-white question-header cursor-pointer border-0 bg-success"
           >
             <div
               class="collapse-caret"
             >
-              <tm-panel-chevron
-                aria-hidden="true"
-              >
-                <div
-                  class="chevron"
+              <tm-panel-chevron>
+                <button
+                  aria-expanded="true"
+                  aria-label="Expand panel"
+                  class="chevron btn-course btn btn-primary btn-sm"
+                  type="button"
                 >
                   <i
                     class="fas fa-chevron-up"
                   />
-                </div>
+                </button>
               </tm-panel-chevron>
             </div>
             <i
@@ -6183,7 +6183,7 @@ exports[`SessionSubmissionPageComponent should snap with feedback session questi
               </b>
               question brief
             </h2>
-          </button>
+          </div>
           <div
             class="ng-trigger ng-trigger-collapseAnim ng-animating"
             style=""