made login form labels and close modal button accessible friendly

lms/static/sass/shared/_modal.scss

@@ -149,7 +149,7 @@
       }
 
       label {
-        color: #999;
+        color: #646464;
 
         &.field-error {
           display: block;

lms/templates/login_modal.html

@@ -9,14 +9,17 @@
     </header>
 
     <form id="login_form" class="login_form" method="post" data-remote="true" action="/login">
-      <label>E-mail</label>
-      <input name="email" type="email">
-      <label>Password</label>
-      <input name="password" type="password">
-      <label class="remember-me">
-        <input name="remember" type="checkbox" value="true">
+      <label for="login_email">E-mail</label>
+        <input id="login_email" type="email" name="email" placeholder="e.g. jane.doe@email.com" />
+      
+      <label for="login_password">Password</label>
+        <input id="login_password" type="password" name="password" placeholder="&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;" />  
+      
+      <label for="login_remember_me" class="remember-me">
+        <input id="login_remember_me" type="checkbox" name="remember" value="true" />
         Remember me
       </label>
+      
       <div class="submit">
         <input name="submit" type="submit" value="Access My Courses">
       </div>
@@ -34,11 +37,11 @@
 % endif
     </section>
 
-    <div class="close-modal">
+    <a href="javascript:void(0);" class="close-modal" title="Close Modal">
       <div class="inner">
         <p>&#10005;</p>
       </div>
-    </div>
+    </a>
   </div>
 </section>