Clean up on marketing styles

index.html

@@ -4,7 +4,7 @@
   <div class="anouncement-wrapper">
   <nav>
     <h1><a href="/t/mitx_global.html">MITx</a></h1>
-    <a class="" rel="leanModal" href="#login">Log In</a>
+    <a class="login" rel="leanModal" href="#login">Log In</a>
   </nav>
 
     <section class="course">

sass/_base.scss

@@ -1,3 +1,7 @@
+:focus {
+  outline-color: #ccc;
+}
+
 h1 {
   font-size:1.6em;
   margin:20px 0 10px 0;

sass/_index.scss

@@ -103,6 +103,10 @@ body {
   color: #444;
   font: $body-font-size $body-font-family;
 
+  :focus {
+    outline-color: #ccc;
+  }
+
   h1 {
     font: 800 24px $header-font-family;
   }
@@ -188,16 +192,20 @@ header.announcement {
       @include border-radius(0 0 3px 3px);
       background: #333;
       background: rgba(#000, .7);
-      padding: lh(.5);
+      padding: lh(.5) lh();
 
       h1 {
         @include inline-block();
-        margin-right: lh();
+        margin-right: lh(.5);
 
         a {
           font: italic 800 18px $header-font-family;
           color: #fff;
           text-decoration: none;
+
+          &:hover, &:focus {
+            color: $mit-red;
+          }
         }
       }
 
@@ -206,9 +214,10 @@ header.announcement {
         color: #fff;
         font-size: 12px;
         font-style: normal;
+        font-family: $header-font-family;
 
-        &:hover {
-          color: rgba(#fff, .6);
+        &:hover, &:focus {
+          color: $mit-red;
         }
       }
     }