proofing UI of unavailable steps to show visually that they are unavailable

apps/openassessment/templates/openassessmentblock/peer/oa_peer_unavailable.html

 {%  extends "openassessmentblock/peer/oa_peer_assessment.html" %}
 
 {% block list_item %}
-<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment ui-toggle-visibility is--collapsed is--unavailable">
+<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment is--collapsed is--unavailable">
 {% endblock %}
 
 {% block title %}

apps/openassessment/templates/openassessmentblock/self/oa_self_unavailable.html

 {%  extends "openassessmentblock/self/oa_self_assessment.html" %}
 
 {% block list_item %}
-<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment ui-toggle-visibility is--collapsed is--unavailable">
+<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment is--collapsed is--unavailable">
 {% endblock %}
 
 {% block title %}

apps/openassessment/xblock/static/sass/oa/views/_oa-base.scss

@@ -294,7 +294,7 @@
         }
 
         // STATE: hover
-        &:hover {
+        &:hover, &:focus {
           opacity: 1.0;
         }
       }
@@ -314,6 +314,15 @@
 
     }
 
+    // STATE: step is unavailable
+    &.is--unavailable {
+
+      .step__header:hover, .step__header:focus {
+        opacity: 0.4;
+      }
+    }
+
+
     // STATE: step is complete/submitted/graded
     &.is--complete, &.is--submitted, &.is--graded {