give help page some layout

help.html

@@ -5,27 +5,33 @@
 <section class="help main-content">
   <h1>Help</h1>
 
-  <p> If you need help:
+  <section class="self-help">
+    <h2>Self-help</h2>
+
     <ul>
-      <li> Ask on the <a href="/discussion">discussion forums</a>
-      <li> Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]
-      <li> Check the <a href="/info">course handouts.</a>
+      <li>Ask on the <a href="/discussion">discussion forums</a></li>
+      <li>Ask in the IRC channel (irc.mitx.mit.edu, channel #6002)]</li>
+      <li>Check the <a href="/info">course handouts.</a></li>
     </ul>
+  </section>
 
-  <p> If you can't solve your problems with self-help, we have several
-  e-mail addresses set up:</p>
+    <section class="help-email">
+      <h2>Help email</h2>
+      <p> If you can't solve your problems with self-help, we have several
+        e-mail addresses set up:</p>
 
-  <dl>
-    <dt> technical@mitx.mit.edu</dt>
-    <dd> System-related questions</dd>
-    <dt> content@mitx.mit.edu</dt>
-    <dd> Content-related questions</dd>
-    <dt> bugs@mitx.mit.edu</dt>
-    <dd> Bug reports</dd>
-    <dt> suggestions@mitx.mit.edu</dt>
-    <dd> Suggestions</dd>
-  </dl>
+      <dl>
+        <dt>System-related questions</dt>
+        <dd><a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a></dd>
+        <dt>Content-related questions</dt>
+        <dd><a href="mailto:content@mitx.mit.edu">content@mitx.mit.edu</a></dd>
+        <dt>Bug reports</dt>
+        <dd><a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a></dd>
+        <dt>Suggestions</dt>
+        <dd><a href="mailto:suggestions@mitx.mit.edu">suggestions@mitx.mit.edu</a></dd>
+      </dl>
 
-  <p> Please bear in mind that while we read them, we do not expect to
-  have time to respond to all e-mails.</p>
+      <p> Please bear in mind that while we read them, we do not expect to
+        have time to respond to all e-mails.</p>
+    </section>
 </section>