diff --git a/common/lib/xmodule/xmodule/css/video/display.scss b/common/lib/xmodule/xmodule/css/video/display.scss
index fe73fb12ae..7b3d12b2ba 100644
--- a/common/lib/xmodule/xmodule/css/video/display.scss
+++ b/common/lib/xmodule/xmodule/css/video/display.scss
@@ -595,7 +595,7 @@ div.video {
 
     li {
       border: 0;
-      color: #666;
+      color: rgb(29,157,217);
       cursor: pointer;
       margin-bottom: 8px;
       padding: 0;
@@ -613,7 +613,7 @@ div.video {
       }
 
       &:hover {
-        color: $blue;
+        text-decoration: underline;
       }
 
       &:empty {
diff --git a/common/lib/xmodule/xmodule/templates/about/overview.yaml b/common/lib/xmodule/xmodule/templates/about/overview.yaml
index 9b2e895526..a41fd50d76 100644
--- a/common/lib/xmodule/xmodule/templates/about/overview.yaml
+++ b/common/lib/xmodule/xmodule/templates/about/overview.yaml
@@ -19,7 +19,7 @@ data: |
       <h2>Course Staff</h2>
       <article class="teacher">
         <div class="teacher-image">
-          <img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0">
+          <img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0" alt="Course Staff Image #1">
         </div>
 
         <h3>Staff Member #1</h3>
@@ -28,7 +28,7 @@ data: |
 
       <article class="teacher">
         <div class="teacher-image">
-          <img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0">
+          <img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0" alt="Course Staff Image #2">
         </div>
 
         <h3>Staff Member #2</h3>
diff --git a/lms/static/sass/_discussion.scss b/lms/static/sass/_discussion.scss
index d526b5b94e..8f55f6c5fd 100644
--- a/lms/static/sass/_discussion.scss
+++ b/lms/static/sass/_discussion.scss
@@ -2619,7 +2619,7 @@ body.discussion {
   width: 10px;
   height: 14px;
   padding-right: 3px;
-  color: #666;
+  color: #333;
 }
 
 .pinned .icon {
@@ -2640,7 +2640,7 @@ body.discussion {
 }
 
 .notpinned span {
-  color: #666;
+  color: #333;
   font-style: italic;
 }
 
@@ -2665,7 +2665,7 @@ display:none;
     
 .notflagged .icon {
   display: block;
-  color: #666;
+  color: #333;
   float: left;
   margin: 3px;
   width: 10px;
@@ -2690,6 +2690,6 @@ display:none;
 }
 
 .notflagged span {
-  color: #666;
+  color: #333;
   font-style: italic;
 }
diff --git a/lms/static/sass/_shame.scss b/lms/static/sass/_shame.scss
index 64beba6723..af98520bd2 100644
--- a/lms/static/sass/_shame.scss
+++ b/lms/static/sass/_shame.scss
@@ -48,7 +48,7 @@
   &.disabled, &[disabled], &.is-disabled {
     background: $action-primary-disabled-bg;
 
-    &:hover {
+    &:hover, &:focus {
       background: $action-primary-disabled-bg !important; // needed for IE currently
     }
   }
@@ -61,7 +61,7 @@
   background: $action-primary-bg;
   color: $action-primary-fg;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     background: $action-primary-focused-bg;
   }
 
@@ -70,7 +70,7 @@
     background: $action-primary-active-bg;
     color: $action-primary-active-fg;
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       box-shadow: inset 0 2px 1px 1px $action-primary-active-focused-shadow;
       color: $action-primary-active-focused-fg;
     }
@@ -89,7 +89,7 @@
   background: $action-secondary-bg;
   color: $action-secondary-fg;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     background: $action-secondary-focused-bg;
   }
 
@@ -98,7 +98,7 @@
     background: $action-secondary-active-bg;
     color: $action-secondary-active-fg;
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       box-shadow: inset 0 2px 1px 1px $action-secondary-active-focused-shadow;
       color: $action-secondary-active-focused-fg;
     }
@@ -172,7 +172,7 @@
         opacity: 0.6;
       }
 
-      &:hover .track {
+      &:hover .track, &:focus .track {
         opacity: 1.0;
       }
 
@@ -205,13 +205,13 @@
 
   header.global {
 
-    .logo a:hover, .logo:active {
+    .logo a:hover, .logo:active, .logo a:focus {
       border: none;
       text-decoration: none;
       padding-bottom: 0;
     }
 
-    .nav-global a:hover, .nav-global a:active {
+    .nav-global a:hover, .nav-global a:active, .nav-global a:focus {
       border: none;
     }
   }
diff --git a/lms/static/sass/base/_base.scss b/lms/static/sass/base/_base.scss
index 66b5e00405..6c32fb39b5 100644
--- a/lms/static/sass/base/_base.scss
+++ b/lms/static/sass/base/_base.scss
@@ -66,7 +66,7 @@ p {
     text-decoration: none;
     @include transition(all 0.1s linear 0s);
 
-    &:hover {
+    &:hover, &:focus {
       color: $link-color;
       text-decoration: underline;
     }
@@ -79,7 +79,7 @@ a:link, a:visited {
   text-decoration: none;
   @include transition(all 0.1s linear 0s);
 
-  &:hover {
+  &:hover, &:focus {
     text-decoration: underline;
   }
 
@@ -246,7 +246,7 @@ mark {
     padding: 6px 22px 11px;
     display: inline-block;
 
-    &:hover {
+    &:hover, &:focus {
       color: #fff;
       background: #1D9DD9;
     }
@@ -275,7 +275,7 @@ mark {
       border-radius: 0px 0px 10px 10px;
     }
 
-    &:hover {
+    &:hover, &:focus {
       color: #fff;
       background: #1D9DD9;
     }
diff --git a/lms/static/sass/base/_reset.scss b/lms/static/sass/base/_reset.scss
index 879f805689..eac3ed9512 100644
--- a/lms/static/sass/base/_reset.scss
+++ b/lms/static/sass/base/_reset.scss
@@ -11,7 +11,7 @@ body { margin: 0; font-size: 1em; line-height: 1.4; }
 
 a { color: #00e; }
 a:visited { color: #551a8b; }
-a:hover { color: #06e; }
+a:hover, a:focus { color: #06e; }
 a:focus { outline: thin dotted; }
 a:hover, a:active { outline: 0; }
 abbr[title] { border-bottom: 1px dotted; }
diff --git a/lms/static/sass/course/_discussions-inline.scss b/lms/static/sass/course/_discussions-inline.scss
index bd4142c2d2..fc9e73990b 100644
--- a/lms/static/sass/course/_discussions-inline.scss
+++ b/lms/static/sass/course/_discussions-inline.scss
@@ -275,7 +275,7 @@
         padding-bottom: 2px;
         border-color: #333;
 
-        &:hover {
+        &:hover, &:focus {
           border-color: #222;
         }
       }
diff --git a/lms/static/sass/course/_gradebook.scss b/lms/static/sass/course/_gradebook.scss
index 3355f96260..a7a6ec85d1 100644
--- a/lms/static/sass/course/_gradebook.scss
+++ b/lms/static/sass/course/_gradebook.scss
@@ -195,6 +195,8 @@ div.gradebook-wrapper {
 
 	.student-table tr:hover td,
 	.grade-table tr:hover td,
+    .student-table tr:focus td,
+	.grade-table tr:focus td,
 	.student-table tr.highlight td,
 	.grade-table tr.highlight td {
 		border-color: #74b7d6;
diff --git a/lms/static/sass/course/_info.scss b/lms/static/sass/course/_info.scss
index ce6358c33f..b668241a15 100644
--- a/lms/static/sass/course/_info.scss
+++ b/lms/static/sass/course/_info.scss
@@ -105,7 +105,7 @@ div.info-wrapper {
           display: block;
           padding: 0;
 
-          &:hover {
+          &:hover, &:focus {
             background: transparent;
           }
         }
@@ -140,7 +140,7 @@ div.info-wrapper {
             @include inline-block;
             padding: 0;
 
-            &:hover {
+            &:hover, &:focus {
               background: transparent;
             }
           }
@@ -161,7 +161,7 @@ div.info-wrapper {
               @include inline-block;
               padding: 0;
 
-              &:hover {
+              &:hover, &:focus {
                 background: transparent;
               }
             }
@@ -177,7 +177,7 @@ div.info-wrapper {
           position: absolute;
           width: 100%;
 
-          &:hover {
+          &:hover, &:focus {
             opacity: 0.6;
             filter: alpha(opacity=60);
 
diff --git a/lms/static/sass/course/_open_ended_grading.scss b/lms/static/sass/course/_open_ended_grading.scss
index c41fe58b80..b95eca6b02 100644
--- a/lms/static/sass/course/_open_ended_grading.scss
+++ b/lms/static/sass/course/_open_ended_grading.scss
@@ -44,7 +44,8 @@
             padding: 5px 0px;
             font-size: 1.1em;
         }
-        .notification-link:hover
+        .notification-link:hover,
+        .notification-link:focus
         {
             background-color: #eee;
         }
diff --git a/lms/static/sass/course/_profile.scss b/lms/static/sass/course/_profile.scss
index 0f38cedff9..ae405f7b47 100644
--- a/lms/static/sass/course/_profile.scss
+++ b/lms/static/sass/course/_profile.scss
@@ -79,7 +79,7 @@ div.profile-wrapper {
           text-transform: uppercase;
           top: 9px;
 
-          &:hover {
+          &:hover, &:focus {
             color: #555;
           }
         }
@@ -110,7 +110,7 @@ div.profile-wrapper {
           text-transform: uppercase;
           top: 9px;
 
-          &:hover {
+          &:hover, &:focus {
             color: #555;
           }
         }
diff --git a/lms/static/sass/course/_textbook.scss b/lms/static/sass/course/_textbook.scss
index d3632be2c5..c5c492d936 100755
--- a/lms/static/sass/course/_textbook.scss
+++ b/lms/static/sass/course/_textbook.scss
@@ -85,7 +85,7 @@ div.book-wrapper {
           color: $link-color;
           cursor: pointer;
 
-          &:hover {
+          &:hover, &:focus {
             background-color: transparent;
             color: $link-hover;
 
@@ -101,7 +101,7 @@ div.book-wrapper {
           position: relative;
           top: 4px;
 
-          &:hover {
+          &:hover, &:focus {
             filter: alpha(opacity=60);
             opacity: 0.6;
           }
@@ -161,7 +161,7 @@ div.book-wrapper {
             vertical-align: middle;
             width: 100%;
 
-            &:hover {
+            &:hover, &:focus {
               opacity: 1.0;
             }
 
diff --git a/lms/static/sass/course/base/_base.scss b/lms/static/sass/course/base/_base.scss
index 28665a3303..abbe82a4aa 100644
--- a/lms/static/sass/course/base/_base.scss
+++ b/lms/static/sass/course/base/_base.scss
@@ -15,7 +15,7 @@ table {
 }
 
 a {
-  &:hover {
+  &:hover, &:focus {
     color: $pink;
     text-decoration: none !important;
   }
diff --git a/lms/static/sass/course/base/_extends.scss b/lms/static/sass/course/base/_extends.scss
index dd02e71e54..b9fa8f7ef6 100644
--- a/lms/static/sass/course/base/_extends.scss
+++ b/lms/static/sass/course/base/_extends.scss
@@ -10,7 +10,7 @@ h1.top-header {
   text-transform: none;
   letter-spacing: 0;
 
-  &:hover {
+  &:hover, &:focus {
     text-decoration: none;
   }
 }
@@ -129,7 +129,7 @@ h1.top-header {
         @include box-sizing(border-box);
         padding: lh(.25) lh(.5) lh(.25) 0;
 
-        &:hover {
+        &:hover, &:focus {
           color: #666;
           background: #f6f6f6;
         }
@@ -153,7 +153,7 @@ h1.top-header {
       width: 16px;
       z-index: 99;
 
-      &:hover {
+      &:hover, &:focus {
         background-color: white;
       }
     }
@@ -177,7 +177,7 @@ h1.top-header {
       border-left: 1px solid lighten($border-color, 10%);
       display: block;
 
-      &:hover {
+      &:hover, &:focus {
         background: none;
       }
     }
diff --git a/lms/static/sass/course/base/_mixins.scss b/lms/static/sass/course/base/_mixins.scss
index ab6e909c10..766b656afb 100644
--- a/lms/static/sass/course/base/_mixins.scss
+++ b/lms/static/sass/course/base/_mixins.scss
@@ -12,7 +12,7 @@
   text-shadow: 0 1px 0 rgba(0, 0, 0, .3);
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
 
-  &:hover {
+  &:hover, &:focus {
     border-color: #297095;
     @include linear-gradient(top, #4fbbe4, #2090d0);
   }
@@ -32,7 +32,7 @@
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
 
-  &:hover {
+  &:hover, &:focus {
     @include linear-gradient(top, #fff, #ddd);
   }
 }
@@ -51,7 +51,7 @@
   text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6);
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
 
-  &:hover {
+  &:hover, &:focus {
     background: -webkit-linear-gradient(top, #888, #666);
   }
 }
\ No newline at end of file
diff --git a/lms/static/sass/course/courseware/_amplifier.scss b/lms/static/sass/course/courseware/_amplifier.scss
index 002035bbed..10e13a49b3 100644
--- a/lms/static/sass/course/courseware/_amplifier.scss
+++ b/lms/static/sass/course/courseware/_amplifier.scss
@@ -64,7 +64,7 @@ section.tool-wrapper {
           letter-spacing: 1px;
           text-transform: uppercase;
 
-          &:hover {
+          &:hover, &:focus {
             color: #eee8d5;
           }
         }
@@ -236,7 +236,7 @@ section.tool-wrapper {
           box-shadow: inset 0 1px 0 lighten( #586e75, 20% );
           margin-top: -.3em;
 
-          &:hover, &:active {
+          &:hover, &:active, &:focus {
             background-color: lighten( #586e75, 10% );
           }
         }
diff --git a/lms/static/sass/course/courseware/_sidebar.scss b/lms/static/sass/course/courseware/_sidebar.scss
index c8e9e233e7..83e1885324 100644
--- a/lms/static/sass/course/courseware/_sidebar.scss
+++ b/lms/static/sass/course/courseware/_sidebar.scss
@@ -24,12 +24,13 @@ section.course-index {
       border-radius: 0;
       margin: 0;
       overflow: visible;
+      font-size: 16px;
 
       &:first-child {
         border: none;
       }
 
-      &:hover {
+      &:hover, &:focus {
         color: #666;
       }
 
@@ -47,13 +48,14 @@ section.course-index {
           border-radius: 0;
           box-shadow: none;
           padding-left: 19px;
+          color: $link-color;
         }
 
         &.ui-state-active {
           @extend .active;
           border-bottom: none;
 
-          &:hover {
+          &:hover, &:focus {
             background: none;
           }
         }
@@ -88,7 +90,7 @@ section.course-index {
         box-shadow: 0 1px 0 #fff inset;
       }
 
-      &:hover {
+      &:hover, &:focus {
         background-color: #fff
       }
     }
@@ -134,7 +136,7 @@ section.course-index {
             }
           }
 
-          &:hover {
+          &:hover, &:focus {
             background: rgba(0, 0, 0, .1);
 
             > a p {
diff --git a/lms/static/sass/course/instructor/_instructor_2.scss b/lms/static/sass/course/instructor/_instructor_2.scss
index 294b3e9670..92f01dce1a 100644
--- a/lms/static/sass/course/instructor/_instructor_2.scss
+++ b/lms/static/sass/course/instructor/_instructor_2.scss
@@ -350,7 +350,7 @@ section.instructor-dashboard-content-2 {
       height: 10px;
       background: url('../images/moderator-delete-icon.png') left center no-repeat;
       opacity: 0.7;
-      &:hover  { opacity: 0.8; }
+      &:hover, &:focus  { opacity: 0.8; }
       &:active { opacity: 0.9; }
 
       // @include idashbutton($danger-red);
@@ -493,7 +493,7 @@ section.instructor-dashboard-content-2 {
     height: 17px;
     background: url('../images/info-icon-dark.png') left center no-repeat;
     opacity: 0.35;
-    &:hover  { opacity: 0.45; }
+    &:hover, &:focus  { opacity: 0.45; }
     &:active { opacity: 0.5; }
   }
 
diff --git a/lms/static/sass/course/layout/_calculator.scss b/lms/static/sass/course/layout/_calculator.scss
index b60ae2285b..02e32ffd4f 100644
--- a/lms/static/sass/course/layout/_calculator.scss
+++ b/lms/static/sass/course/layout/_calculator.scss
@@ -26,7 +26,7 @@ div.calc-main {
     top: -45px;
     width: 16px;
 
-    &:hover {
+    &:hover, &:focus {
       opacity: 0.8;
     }
 
diff --git a/lms/static/sass/course/layout/_chat.scss b/lms/static/sass/course/layout/_chat.scss
index f3b3f33dca..b9724ef4b4 100644
--- a/lms/static/sass/course/layout/_chat.scss
+++ b/lms/static/sass/course/layout/_chat.scss
@@ -25,7 +25,8 @@
     cursor: pointer;
 }
 
-#chat-toggle:hover {
+#chat-toggle:hover,
+#chat-toggle:focus {
     text-decoration: none;
 }
 
diff --git a/lms/static/sass/course/layout/_courseware_header.scss b/lms/static/sass/course/layout/_courseware_header.scss
index 95765fc93c..9bd1ce49fa 100644
--- a/lms/static/sass/course/layout/_courseware_header.scss
+++ b/lms/static/sass/course/layout/_courseware_header.scss
@@ -45,7 +45,7 @@ nav.course-material {
         text-decoration: none;
         // text-shadow: 0 1px 0 rgba(0, 0, 0, .4);
 
-        &:hover {
+        &:hover, &:focus {
           color: #333;
           background: rgba(255, 255, 255, .6);
         }
diff --git a/lms/static/sass/course/layout/_courseware_subnav.scss b/lms/static/sass/course/layout/_courseware_subnav.scss
index c06b1435f3..eaffa28668 100644
--- a/lms/static/sass/course/layout/_courseware_subnav.scss
+++ b/lms/static/sass/course/layout/_courseware_subnav.scss
@@ -31,7 +31,7 @@ nav.course-material {
         text-decoration: none;
         text-shadow: 0 1px rgb(255,255,255);
 
-        &:hover {
+        &:hover, &:focus {
           color: $base-font-color;
         }
 
diff --git a/lms/static/sass/course/wiki/_create.scss b/lms/static/sass/course/wiki/_create.scss
index f1c0473858..c967410d38 100644
--- a/lms/static/sass/course/wiki/_create.scss
+++ b/lms/static/sass/course/wiki/_create.scss
@@ -53,7 +53,7 @@ form#wiki_revision {
   margin-top: lh();
   width: flex-grid(3, 9);
 
-  &:hover {
+  &:hover, &:focus {
     color: #333;
   }
 
diff --git a/lms/static/sass/course/wiki/_wiki.scss b/lms/static/sass/course/wiki/_wiki.scss
index 022d08b81f..f79385bc90 100644
--- a/lms/static/sass/course/wiki/_wiki.scss
+++ b/lms/static/sass/course/wiki/_wiki.scss
@@ -87,7 +87,7 @@ section.wiki {
     font-size: 0.72em;
     font-weight: 600;
 
-    &:hover {
+    &:hover, &:focus {
       text-decoration: none;
     }
   }
@@ -260,7 +260,7 @@ section.wiki {
         font-size: 0.9em;
         line-height: 25px;
 
-        &:hover {
+        &:hover, &:focus {
           background-color: #f6f6f6;
           text-decoration: none;
         }
@@ -302,7 +302,7 @@ section.wiki {
             background-position: -25px -99px;
           }
 
-          &:hover {
+          &:hover, &:focus {
             background: none;
           }
         }
@@ -349,7 +349,7 @@ section.wiki {
         background-position: 0 -99px;
       }
 
-      &:hover {
+      &:hover, &:focus {
         background-color: #f6f6f6;
         text-decoration: none;
       }
@@ -465,7 +465,7 @@ section.wiki {
     text-transform: none !important;
     letter-spacing: 0 !important;
 
-    &:hover {
+    &:hover, &:focus {
       color: $base-font-color;
       text-decoration: none;
     }
@@ -662,7 +662,7 @@ section.wiki {
       background: #f9f9f9;
       border-radius: 5px;
 
-      a:hover {
+      a:hover, a:focus {
         text-decoration: none;
       }
     }
@@ -823,7 +823,7 @@ section.wiki {
     a {
       color: #aaa;
 
-      &:hover {
+      &:hover, &:focus {
         color: #777;
       }
     }
@@ -1007,7 +1007,7 @@ section.wiki {
         text-align: center;
         -webkit-font-smoothing: antialiased;
 
-        &:hover {
+        &:hover, &:focus {
           background: darken($pink, 12%);
         }
       }
@@ -1078,7 +1078,7 @@ section.wiki {
     text-transform: none !important;
     letter-spacing: 0 !important;
 
-    &:hover {
+    &:hover, &:focus {
       color: $base-font-color;
       text-decoration: none;
     }
diff --git a/lms/static/sass/elements/_controls.scss b/lms/static/sass/elements/_controls.scss
index 3582f51132..4846a14ae5 100644
--- a/lms/static/sass/elements/_controls.scss
+++ b/lms/static/sass/elements/_controls.scss
@@ -8,7 +8,7 @@
   cursor: pointer;
   text-decoration: none;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     text-decoration: none;
   }
 
@@ -39,13 +39,13 @@
   padding: ($baseline*0.75) $baseline;
   text-align: center;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
 
   }
 
   &.current, &.active {
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
 
     }
   }
@@ -63,7 +63,7 @@
   background: $m-gray;
   color: $white;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     background: $m-gray-l1;
     color: $white;
   }
@@ -73,7 +73,7 @@
     background: $m-gray;
     color: $m-gray-l1;
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       box-shadow: inset 0 2px 1px 1px $m-gray-d3;
       color: $m-gray-d3;
     }
@@ -91,7 +91,7 @@
   background: $m-blue-d3;
   color: $white;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     background: $m-blue-d1;
     color: $white;
   }
@@ -101,7 +101,7 @@
     background: $m-blue;
     color: $m-blue-d2;
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       box-shadow: inset 0 2px 1px 1px $m-blue-d3;
       color: $m-blue-d3;
     }
@@ -119,7 +119,7 @@
   background: $m-pink;
   color: $white;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     background: $m-pink-l3;
     color: $white;
   }
@@ -129,7 +129,7 @@
     background: $m-pink-l2;
     color: $m-pink-d1;
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       box-shadow: inset 0 2px 1px 1px $m-pink-d2;
       color: $m-pink-d3;
     }
@@ -147,7 +147,7 @@
   background: $m-green-d1;
   color: $white;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     background: $m-green-s1;
     color: $white;
   }
@@ -157,7 +157,7 @@
     background: $m-green-l2;
     color: $m-green;
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       box-shadow: inset 0 2px 1px 1px $m-green-d1;
       color: $m-green-d1;
     }
@@ -176,7 +176,7 @@
   cursor: default;
   pointer-events: none;
   box-shadow: none;
-  :hover {
+  :hover, :focus {
     pointer-events: none;
   }
 }
diff --git a/lms/static/sass/elements/_typography.scss b/lms/static/sass/elements/_typography.scss
index 2cf11ce79b..fc9acabc89 100644
--- a/lms/static/sass/elements/_typography.scss
+++ b/lms/static/sass/elements/_typography.scss
@@ -271,7 +271,7 @@
 %copy-link {
   border-bottom: 1px dotted transparent;
 
-  &:hover, &:active {
+  &:hover, &:active, &:focus {
     border-color: $link-color-d1;
   }
 }
diff --git a/lms/static/sass/ie.scss b/lms/static/sass/ie.scss
index 258707a497..a2dc84de38 100644
--- a/lms/static/sass/ie.scss
+++ b/lms/static/sass/ie.scss
@@ -13,13 +13,14 @@
 
   // hide all actions
   .home > header .title .actions,
-  .home > header .title:hover .actions {
+  .home > header .title:hover .actions,
+  .home > header .title:focus .actions {
     display: none;
     height: auto;
   }
 
   .home > header .title {
-    &:hover {
+    &:hover, &:focus {
 
       > hgroup {
         h1 {
@@ -49,7 +50,7 @@
       position: static;
     }
 
-    &:hover {
+    &:hover, &:focus {
       text-decoration: none;
 
       &::before {
@@ -117,7 +118,7 @@
       }
     }
 
-    &:hover {
+    &:hover, &:focus {
       background: rgb(245,245,245);
       border-color: rgb(170,170,170);
       box-shadow: 0 1px 16px 0 rgba($blue, 0.4);
diff --git a/lms/static/sass/multicourse/_about_pages.scss b/lms/static/sass/multicourse/_about_pages.scss
index ca573377ec..78840f8f7f 100644
--- a/lms/static/sass/multicourse/_about_pages.scss
+++ b/lms/static/sass/multicourse/_about_pages.scss
@@ -24,7 +24,7 @@
       @include transition(all 0.15s linear 0s);
       text-transform: lowercase;
 
-      &:hover, &.active {
+      &:hover, &.active, &:focus {
         border-color: rgb(200,200,200);
         color: $base-font-color;
         text-decoration: none;
@@ -165,7 +165,7 @@
         padding: 12px 0px 12px 20px;
         text-align: left;
 
-        &:hover {
+        &:hover, &:focus {
           background: rgb(245,245,245);
           text-decoration: none;
         }
diff --git a/lms/static/sass/multicourse/_account.scss b/lms/static/sass/multicourse/_account.scss
index f1cda25654..fa8d5f9c38 100644
--- a/lms/static/sass/multicourse/_account.scss
+++ b/lms/static/sass/multicourse/_account.scss
@@ -173,14 +173,14 @@
   a {
     @include transition(color 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s);
 
-    &:link, &:visited, &:hover, &:active {
+    &:link, &:visited, &:hover, &:active, &:focus {
       color: $link-color-d1;
       font-weight: 400;
       text-decoration: none !important; // needed but nasty
       font-family: $sans-serif;
     }
 
-    &:hover, &:active {
+    &:hover, &:active, &:focus {
       text-decoration: none !important; // needed but nasty
       border-bottom: 1px dotted $link-color-d1;
     }
diff --git a/lms/static/sass/multicourse/_course_about.scss b/lms/static/sass/multicourse/_course_about.scss
index 26bafff87d..5eeb837fb1 100644
--- a/lms/static/sass/multicourse/_course_about.scss
+++ b/lms/static/sass/multicourse/_course_about.scss
@@ -214,7 +214,7 @@
           }
         }
 
-        &:hover {
+        &:hover, &:focus {
           text-decoration: none;
 
           .play-intro {
@@ -261,7 +261,7 @@
           margin-left: 0px;
         }
 
-        &:hover, &.active {
+        &:hover, &.active, &:focus {
           border-color: $border-color-2;
           color: $base-font-color;
           text-decoration: none;
@@ -411,7 +411,7 @@
         margin-right: 15px;
         padding-right: 15px;
 
-        &:hover {
+        &:hover, &:focus {
           color: $lighter-base-font-color;
         }
       }
@@ -427,7 +427,7 @@
 
         float: none;
 
-        &:hover {
+        &:hover, &:focus {
           .sharing-message {
             opacity: 1.0;
             top: 56px;
@@ -456,7 +456,7 @@
           top: 65px;
           width: 220px;
 
-          &:hover {
+          &:hover, &:focus {
             opacity: 0;
           }
         }
@@ -469,7 +469,7 @@
           @include transition(all 0.15s linear 0s);
           width: 44px;
 
-          &:hover {
+          &:hover, &:focus {
             opacity: 1.0;
           }
 
@@ -512,7 +512,7 @@
           }
         }
 
-        &:hover {
+        &:hover, &:focus {
           .icon {
             opacity: 1.0;
           }
diff --git a/lms/static/sass/multicourse/_dashboard.scss b/lms/static/sass/multicourse/_dashboard.scss
index 9ca37e9c9d..ad8919f69a 100644
--- a/lms/static/sass/multicourse/_dashboard.scss
+++ b/lms/static/sass/multicourse/_dashboard.scss
@@ -75,7 +75,7 @@
           margin-bottom: 15px;
           padding-bottom: 17px;
 
-          &:hover {
+          &:hover, &:focus {
             .title .icon {
               opacity: 1.0;
             }
@@ -162,7 +162,7 @@
         border-radius: 11px;
         background: $dot-color;
 
-        &:hover {
+        &:hover, &:focus {
           background: $lighter-base-font-color;
         }
 
@@ -265,7 +265,7 @@
         padding: 5px 10px;
         text-shadow: 0 1px rgba(255,255,255, 0.6);
 
-        &:hover {
+        &:hover, &:focus {
           color: $link-color;
           text-decoration: none;
         }
@@ -350,7 +350,7 @@
             line-height: 42px;
             font-weight: 300;
 
-            &:hover {
+            &:hover, &:focus {
               text-decoration: none;
             }
           }
@@ -405,12 +405,12 @@
             font: normal 15px/1.6rem $sans-serif;
             padding: 6px 32px 7px;
 
-            &:hover {
+            &:hover, &:focus {
               text-decoration: none;
             }
           }
 
-          &:hover {
+          &:hover, &:focus {
             text-decoration: none;
           }
         }
@@ -522,7 +522,7 @@
             &.disabled {
               cursor: default !important;
 
-              &:hover {
+              &:hover, &:focus {
                 background: #eee;
                 background-image: -webkit-linear-gradient(top, #EEE 0%, #C2C2C2 50%, #ABABAB 50%, #B0B0B0 100%);
                 background-image: -moz-linear-gradient(top, #EEE 0%, #C2C2C2 50%, #ABABAB 50%, #B0B0B0 100%);
@@ -584,7 +584,7 @@
         font-weight: bold;
         letter-spacing: 0;
 
-        &:hover {
+        &:hover, &:focus {
           text-decoration: none;
         }
       }
@@ -624,7 +624,7 @@
       font-size: .8em;
       margin-top: 32px;
 
-      &:hover {
+      &:hover, &:focus {
         color: #333;
       }
     }
diff --git a/lms/static/sass/multicourse/_edge.scss b/lms/static/sass/multicourse/_edge.scss
index 30d5c0815a..d38f648d04 100644
--- a/lms/static/sass/multicourse/_edge.scss
+++ b/lms/static/sass/multicourse/_edge.scss
@@ -23,12 +23,12 @@ $paleYellow: #fffcf1;
     color: $darkGrey !important;
     pointer-events: none;
     cursor: none;
-    &:hover {
+    &:hover, &:focus {
       box-shadow: 0 0 0 0 !important;
     }
   }
 
-  &:hover {
+  &:hover, &:focus {
     box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15);
     text-decoration: none;
   }
@@ -42,7 +42,7 @@ $paleYellow: #fffcf1;
   background-color: $blue;
   color: #fff;
 
-  &:hover {
+  &:hover, &:focus {
     background-color: #62aaf5;
     color: #fff;
   }
@@ -57,7 +57,7 @@ $paleYellow: #fffcf1;
   box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
   color: #6d788b;
 
-  &:hover {
+  &:hover, &:focus {
     background-color: #d9e3ee;
     color: #6d788b;
   }
@@ -72,7 +72,7 @@ $paleYellow: #fffcf1;
     border-bottom: 3px solid $blue;
   }
 
-  a:hover {
+  a:hover, a:focus {
     text-decoration: none;
   }
 
diff --git a/lms/static/sass/multicourse/_help.scss b/lms/static/sass/multicourse/_help.scss
index 9cc0030efb..b1ea577b39 100644
--- a/lms/static/sass/multicourse/_help.scss
+++ b/lms/static/sass/multicourse/_help.scss
@@ -18,7 +18,7 @@
         padding: 12px 0px 12px 20px;
         text-align: left;
 
-        &:hover {
+        &:hover, &:focus {
           background: rgb(245,245,245);
           text-decoration: none;
         }
diff --git a/lms/static/sass/multicourse/_home.scss b/lms/static/sass/multicourse/_home.scss
index 881437da04..347a9a915c 100644
--- a/lms/static/sass/multicourse/_home.scss
+++ b/lms/static/sass/multicourse/_home.scss
@@ -43,7 +43,7 @@
       @include transition(all 0.2s linear 0s);
       vertical-align: top;
 
-      &:hover {
+      &:hover, &:focus {
         .actions {
           display: none;
         }
@@ -93,7 +93,7 @@
       width: flex-grid(2) + flex-gutter();
       z-index: 2;
 
-      &:hover {
+      &:hover, &:focus {
         text-decoration: underline;
       }
 
@@ -140,7 +140,7 @@
         }
       }
 
-      &:hover {
+      &:hover, &:focus {
         .play-intro {
           @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8)));
           box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.5);
@@ -295,7 +295,7 @@
             text-shadow: 0 1px rgba(255,255,255, 0.6);
             @include transition(all 0.15s ease-in-out 0s);
 
-            &:hover {
+            &:hover, &:focus {
               color: $lighter-base-font-color;
             }
           }
@@ -308,7 +308,7 @@
           z-index: 2;
         }
 
-        &:hover {
+        &:hover, &:focus {
           text-decoration: none;
 
           &::before {
@@ -354,7 +354,7 @@
               font-size: 1.0em;
             }
 
-            &:hover {
+            &:hover, &:focus {
               .name {
                 bottom: 14px;
               }
@@ -431,7 +431,7 @@
           @include transition(all 0.15s linear 0s);
           width: flex-grid(4);
 
-          &:hover {
+          &:hover, &:focus {
             background: $body-bg;
             border: 1px solid $border-color-2;
             box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.1);
@@ -467,7 +467,7 @@
               color: $base-font-color;
               font: 700 1em/1.2em $sans-serif;
 
-              &:hover {
+              &:hover, &:focus {
                 color: $blue;
                 text-decoration: underline;
               }
@@ -500,7 +500,7 @@
             float: right;
             color: lighten($base-font-color, 50%);
 
-            &:hover {
+            &:hover, &:focus {
               color: $blue;
               text-decoration: underline;
             }
diff --git a/lms/static/sass/multicourse/_jobs.scss b/lms/static/sass/multicourse/_jobs.scss
index f9629232d6..e5caee6810 100644
--- a/lms/static/sass/multicourse/_jobs.scss
+++ b/lms/static/sass/multicourse/_jobs.scss
@@ -97,7 +97,7 @@
           padding: 12px 0px 12px 20px;
           text-align: left;
 
-          &:hover {
+          &:hover, &:focus {
             background: rgb(245,245,245);
             text-decoration: none;
           }
diff --git a/lms/static/sass/multicourse/_media-kit.scss b/lms/static/sass/multicourse/_media-kit.scss
index 1c6d787760..adcacb2883 100644
--- a/lms/static/sass/multicourse/_media-kit.scss
+++ b/lms/static/sass/multicourse/_media-kit.scss
@@ -77,7 +77,7 @@ $white: rgb(255,255,255);
       }
     }
 
-    &:hover {
+    &:hover, &:focus {
 
       .note {
         color: shade($blue, 25%);
@@ -228,7 +228,7 @@ $white: rgb(255,255,255);
           border: 2px solid tint($light-gray,75%);
           padding: $baseline;
 
-          &:hover {
+          &:hover, &:focus {
             border-color: $blue;
           }
         }
diff --git a/lms/static/sass/multicourse/_testcenter-register.scss b/lms/static/sass/multicourse/_testcenter-register.scss
index 754b1428de..e39c25b387 100644
--- a/lms/static/sass/multicourse/_testcenter-register.scss
+++ b/lms/static/sass/multicourse/_testcenter-register.scss
@@ -484,7 +484,7 @@
 						}
 					}
 
-					&:hover {
+					&:hover, &:focus {
 
 						.details, .item, .instructions {
 							opacity: 1.0;
@@ -546,7 +546,7 @@
 				  font-size: 13px;
 				  font-weight: bold;
 
-				  &:hover {
+				  &:hover, &:focus {
 				    text-decoration: none;
 				  }
 				}
@@ -681,7 +681,7 @@
 				font-weight: bold;
 				letter-spacing: 0;
 
-				&:hover {
+				&:hover, &:focus {
 				  text-decoration: none;
 				}
 			}
@@ -743,7 +743,7 @@
 						color: $red;
 						text-decoration: none;
 
-						&:hover, &:active {
+						&:hover, &:active, &:focus {
 							text-decoration: underline;
 						}
 					}
diff --git a/lms/static/sass/shared/_course_filter.scss b/lms/static/sass/shared/_course_filter.scss
index a8bf7f9fdc..6ac23849f3 100644
--- a/lms/static/sass/shared/_course_filter.scss
+++ b/lms/static/sass/shared/_course_filter.scss
@@ -62,7 +62,7 @@
         }
       }
 
-      &:hover {
+      &:hover, &:focus {
         .filter-heading {
           background: rgb(255,255,255);
           @include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(255,255,255)));
diff --git a/lms/static/sass/shared/_course_object.scss b/lms/static/sass/shared/_course_object.scss
index 3321afd92d..212d7c9015 100644
--- a/lms/static/sass/shared/_course_object.scss
+++ b/lms/static/sass/shared/_course_object.scss
@@ -232,7 +232,7 @@
             margin-right: 10px;
             padding-right: 10px;
 
-            &:hover {
+            &:hover, &:focus {
               color: $link-color;
             }
           }
@@ -244,7 +244,7 @@
         }
       }
 
-      &:hover {
+      &:hover, &:focus {
         background: $course-profile-bg;
         border-color: $border-color-1;
         box-shadow: 0 1px 16px 0 rgba($shadow-color, 0.4);
diff --git a/lms/static/sass/shared/_footer.scss b/lms/static/sass/shared/_footer.scss
index 888f19ac88..f76e114cc4 100644
--- a/lms/static/sass/shared/_footer.scss
+++ b/lms/static/sass/shared/_footer.scss
@@ -18,14 +18,14 @@
     a {
       @include transition(link-color 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s);
 
-      &:link, &:visited, &:hover, &:active {
+      &:link, &:visited, &:hover, &:focus, &:active {
         border-bottom: none;
         color: $link-color;
         text-decoration: none !important;
         font-family: $sans-serif;
       }
 
-      &:hover, &:active {
+      &:hover, &:focus, &:active {
         border-bottom: 1px dotted $link-color;
         color: $link-color;
       }
@@ -48,7 +48,7 @@
           a {
             color: tint($black, 20%);
 
-            &:hover, &:active {
+            &:hover, &:focus, &:active {
               color: $link-color;
             }
           }
@@ -100,7 +100,7 @@
           a {
             display: block;
 
-            &:hover, &:active {
+            &:hover, &:focus, &:active {
               border: none;
             }
           }
diff --git a/lms/static/sass/shared/_header.scss b/lms/static/sass/shared/_header.scss
index b3ca2077f0..3a0a34f415 100644
--- a/lms/static/sass/shared/_header.scss
+++ b/lms/static/sass/shared/_header.scss
@@ -66,7 +66,7 @@ header.global {
           margin-right: 0px;
         }
 
-        &:hover {
+        &:hover, &:focus {
           color: $base-font-color;
         }
       }
@@ -98,7 +98,7 @@ header.global {
           margin-right: 0px;
         }
 
-        &:hover, &.active {
+        &:hover, &:focus, &.active {
           background: $button-bg-hover-color;
         }
       }
@@ -156,7 +156,7 @@ header.global {
           width: 26px;
         }
 
-        &:hover {
+        &:hover, &:focus {
           .avatar {
             opacity: 0.8;
           }
@@ -224,7 +224,7 @@ header.global {
             white-space: nowrap;
             width: 100%;
 
-            &:hover {
+            &:hover, &:focus {
               color: $base-font-color;
               text-decoration: none;
             }
@@ -256,7 +256,7 @@ header.global {
         color: $lighter-base-font-color;
         font-weight: 600;
 
-        &:hover, &:active {
+        &:hover, &:focus, &:active {
           text-decoration: none;
           color: $link-color;
         }
diff --git a/lms/static/sass/shared/_modal.scss b/lms/static/sass/shared/_modal.scss
index 8b9ad63836..fad5585eaf 100644
--- a/lms/static/sass/shared/_modal.scss
+++ b/lms/static/sass/shared/_modal.scss
@@ -109,8 +109,8 @@
     }
 
     .modal-form-error {
-      background: $error-red;
-      border: 1px solid rgb(202, 17, 17);
+      background: tint($red,90%);
+      border: 1px solid rgb(143, 14, 14);
       color: rgb(143, 14, 14);
       display: none;
       margin-bottom: 20px;
@@ -195,7 +195,7 @@
         margin-bottom: 20px;
         padding: 8px 10px;
 
-        &:hover {
+        &:hover, &:focus {
           background: rgb(230,230,230);
         }
 
@@ -262,7 +262,7 @@
           font-style: italic;
           text-decoration: underline;
 
-          &:hover {
+          &:hover, &:focus {
             color: $base-font-color;
           }
         }
@@ -288,7 +288,7 @@
       text-shadow: 0 1px rgba(255,255,255, 0.8);
       @include transition(all 0.15s ease-out 0s);
 
-      &:hover {
+      &:hover, &:focus {
         color: $base-font-color;
         text-decoration: none;
       }
diff --git a/lms/static/sass/views/_verification.scss b/lms/static/sass/views/_verification.scss
index 40795b922b..589c45f7d3 100644
--- a/lms/static/sass/views/_verification.scss
+++ b/lms/static/sass/views/_verification.scss
@@ -1560,7 +1560,7 @@
         @include font-size(24);
         color: $m-blue-d3;
 
-        &:hover {
+        &:hover, &:focus {
           color: $m-blue-d1;
           border: none;
         }
diff --git a/lms/templates/courseware/course_about.html b/lms/templates/courseware/course_about.html
index 382dbf4660..0afce28595 100644
--- a/lms/templates/courseware/course_about.html
+++ b/lms/templates/courseware/course_about.html
@@ -162,14 +162,14 @@
       % if get_course_about_section(course, "video"):
       <a href="#video-modal" class="media" rel="leanModal">
         <div class="hero">
-          <img src="${course_image_url(course)}" />
+          <img src="${course_image_url(course)}" alt="" />
           <div class="play-intro"></div>
         </div>
       </a>
       %else:
       <div class="media">
         <div class="hero">
-          <img src="${course_image_url(course)}" />
+          <img src="${course_image_url(course)}" alt="" />
         </div>
       </div>
       % endif
@@ -203,19 +203,20 @@
             ##       want here (and on this whole page, really).
             % if self.stanford_theme_enabled():
               <a href="http://twitter.com/intent/tweet?text=I+just+registered+for+${course.number}+${get_course_about_section(course, 'title')}!+(http://class.stanford.edu)" class="share">
-                <img src="${static.url('images/social/twitter-sharing.png')}">
+                <img src="${static.url('images/social/twitter-sharing.png')}" alt="Tweet that you've registered for this course">
               </a>
               <a href="mailto:?subject=Take%20a%20course%20at%20Stanford%20online!&body=I%20just%20registered%20for%20${course.number}%20${get_course_about_section(course, 'title')}+(http://class.stanford.edu)" class="share">
-                <img src="${static.url('images/social/email-sharing.png')}">
+                <img src="${static.url('images/social/email-sharing.png')}" alt="Email someone to say you've registered for this course">
               </a>
             % else:
               <a href="http://twitter.com/intent/tweet?text=I+just+registered+for+${course.number}+${get_course_about_section(course, 'title')}+through+@edxonline:+http://www.edx.org${reverse('about_course', args=[course.id])}" class="share">
-                <img src="${static.url('images/social/twitter-sharing.png')}">
+                <img src="${static.url('images/social/twitter-sharing.png')}" alt="Tweet that you've registered for this course">
               </a>
-              <a href="http://www.facebook.com/EdxOnline" class="share"> <img src="${static.url('images/social/facebook-sharing.png')}">
+              <a href="http://www.facebook.com/EdxOnline" class="share">
+                <img src="${static.url('images/social/facebook-sharing.png')}" alt="Post a Facebook message to say you've registered for this course">
               </a>
               <a href="mailto:?subject=Take%20a%20course%20with%20edX%20online&body=I%20just%20registered%20for%20${course.number}%20${get_course_about_section(course, 'title')}%20through%20edX:+http://edx.org/${reverse('about_course', args=[course.id])}" class="share">
-                <img src="${static.url('images/social/email-sharing.png')}">
+                <img src="${static.url('images/social/email-sharing.png')}" alt="Email someone to say you've registered for this course">
               </a>
             % endif
           </div>
diff --git a/lms/templates/video.html b/lms/templates/video.html
index 07855f1aae..b4bae8a91e 100644
--- a/lms/templates/video.html
+++ b/lms/templates/video.html
@@ -44,48 +44,50 @@
     <div class="focus_grabber first"></div>
 
     <div class="tc-wrapper">
-        <article class="video-wrapper">
-            <div class="video-player-pre"></div>
+      <a href="#transcript-captions" class="sr">Skip to clickable transcript video links.</a>
+      
+      <article class="video-wrapper">
+          <div class="video-player-pre"></div>
 
-            <section class="video-player">
-                <div id="${id}"></div>
-                <h3 class="hidden">${_('ERROR: No playable video sources found!')}</h3>
-            </section>
+          <section class="video-player">
+              <div id="${id}"></div>
+              <h3 class="hidden">${_('ERROR: No playable video sources found!')}</h3>
+          </section>
 
-            <div class="video-player-post"></div>
+          <div class="video-player-post"></div>
 
-            <section class="video-controls">
-                <div class="slider" title="Video position"></div>
+          <section class="video-controls">
+              <div class="slider" title="Video position"></div>
 
-                <div>
-                    <ul class="vcr">
-                        <li><a class="video_control" href="#" title="${_('Play')}" role="button" aria-disabled="false"></a></li>
-                        <li><div class="vidtime">0:00 / 0:00</div></li>
-                    </ul>
-                    <div class="secondary-controls">
-                        <div class="speeds">
-                            <a href="#" title="${_('Speeds')}" role="button" aria-disabled="false">
-                                <h3>${_('Speed')}</h3>
-                                <p class="active"></p>
-                            </a>
-                            <ol class="video_speeds"></ol>
-                        </div>
-                        <div class="volume">
-                            <a href="#" title="${_('Volume')}" role="button" aria-disabled="false"></a>
-                            <div class="volume-slider-container">
-                                <div class="volume-slider"></div>
-                            </div>
-                        </div>
-                        <a href="#" class="add-fullscreen" title="${_('Fill browser')}" role="button" aria-disabled="false">${_('Fill browser')}</a>
-                        <a href="#" class="quality_control" title="${_('HD off')}" role="button" aria-disabled="false">${_('HD off')}</a>
+              <div>
+                  <ul class="vcr">
+                      <li><a class="video_control" href="#" title="${_('Play')}" role="button" aria-disabled="false"></a></li>
+                      <li><div class="vidtime">0:00 / 0:00</div></li>
+                  </ul>
+                  <div class="secondary-controls">
+                      <div class="speeds">
+                          <a href="#" title="${_('Speeds')}" role="button" aria-disabled="false">
+                              <h3>${_('Speed')}</h3>
+                              <p class="active"></p>
+                          </a>
+                          <ol class="video_speeds"></ol>
+                      </div>
+                      <div class="volume">
+                          <a href="#" title="${_('Volume')}" role="button" aria-disabled="false"></a>
+                          <div class="volume-slider-container">
+                              <div class="volume-slider"></div>
+                          </div>
+                      </div>
+                      <a href="#" class="add-fullscreen" title="${_('Fill browser')}" role="button" aria-disabled="false">${_('Fill browser')}</a>
+                      <a href="#" class="quality_control" title="${_('HD off')}" role="button" aria-disabled="false">${_('HD off')}</a>
 
-                        <a href="#" class="hide-subtitles" title="${_('Turn off captions')}" role="button" aria-disabled="false">${_('Turn off captions')}</a>
-                    </div>
-                </div>
-            </section>
-        </article>
+                      <a href="#" class="hide-subtitles" title="${_('Turn off captions')}" role="button" aria-disabled="false">${_('Turn off captions')}</a>
+                  </div>
+              </div>
+          </section>
+      </article>
 
-        <ol class="subtitles" tabindex="0" title="${_('Captions')}" role="group" aria-label="${_('Activating an item in this group will spool the video to the corresponding time point')}"><li></li></ol>
+      <ol id="transcript-captions" class="subtitles" tabindex="0" title="${_('Captions')}" role="group" aria-label="${_('Activating an item in this group will spool the video to the corresponding time point')}"><li></li></ol>
     </div>
 
     <div class="focus_grabber last"></div>