From 134165fed4a5da151f98100af73f478ab86b2ff2 Mon Sep 17 00:00:00 2001
From: Piotr Mitros <pmitros@mit.edu>
Date: Mon, 30 Jan 2012 12:49:18 -0500
Subject: [PATCH 01/26] Near-final TOS, Honor Code, Copyright

---
 copyright.html |  31 +++---
 honor.html     |  48 +++++++-
 tos.html       | 291 ++++++++++++++++++++++++++++++++++++++++++++++++-
 3 files changed, 343 insertions(+), 27 deletions(-)

diff --git a/copyright.html b/copyright.html
index a238a12ec3..003db8c2af 100644
--- a/copyright.html
+++ b/copyright.html
@@ -7,31 +7,32 @@
 
   <ul>
     <li>
-      <h2>Videos and Ungraded Exercises</h2>
-      <p><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-sa/3.0/80x15.png" /></a><br />The videos on this page are licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-ShareAlike 3.0 Unported License</a>.</p>
-    </li>
-
-    <li>
-      <h2>Graded Exercises</h2>
-      <p>Graded exercises are All Rights Reserved until the due date. Past the due date, they  are licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-ShareAlike 3.0 Unported License</a>.</p>
+      <h2>Videos and Exercises</h2>
+      <p> Copyright &copy; 2012 MIT. All rights reserved. In order to
+      further MIT's goal of making education accessible and affordable
+      to the world, MIT is planning to make <i>MITx</i> course content
+      available under open source licenses.
+</p>
     </li>
 
     <li>
       <h2>Textbook</h2>
-      <p>Textbook is All Rights Reserved Elsevier. We are using it with permission. We apologize for the inclusion of proprietary work. </p>
+      <p> Copyright &copy; 2005 Elsevier Inc. All Rights
+      Reserved. Used with permission. While our goal is to build
+      courses with as much free and open content as possible, we
+      apologize that we do not have the ability to do so
+      entirely. </p>
     </li>
 
     <li>
       <h2>Student-generated content</h2>
-      <td>Due to privacy concerns, all forum posts, wiki etc, and other student-created works are All Rights Reserved until released otherwise by MIT. </td></li>
-
-    <li>
-      <h2>Source Code</h2>
-      <p>Source code is All Rights Reserved during the beta offering. We expect to release it under a free and open license shortly thereafter.  </p>
-    </li>
+      <td>Copyright &copy; 2012. All Rights Reserved. Due to privacy
+      concerns, we do not know what portion of these will be released
+      under open licenses. </td></li>
   </ul>
 
-  <p>MIT and MITx are trademarks of the Massachusetts Institute of Technology, and may not be used without permission.</p>
+  <p>MIT and <i>MITx</i> are trademarks of the Massachusetts Institute
+  of Technology, and may not be used without permission.</p>
   </div>
 
 </section>
diff --git a/honor.html b/honor.html
index 5a36865865..a763eb4f50 100644
--- a/honor.html
+++ b/honor.html
@@ -2,12 +2,48 @@
 
 <section class="honor-code">
   <div>
-    <h1> Honor Code </h1>
+    <h1> Collaboration Policy </h1>
 
-    <ul>
-      <li> I agree to not engage in any activities that would dishonestly improve my results, or improve or hurt those of others.</li>
-      <li> I agree to never post answers to problems.</li>
-      <li> I agree to maintain only one account.</li>
-    </ul>
+    <p> By enrolling in a course on <i>MITx</i>, you are joining a
+      special worldwide community of learners. The aspiration
+      of <i>MITx</i> is to provide anyone in the world who has the
+      motivation and ability to engage MIT coursework the opportunity
+      to attain the best MIT-based educational experience that
+      Internet technology enables. You are part of the community who
+      will help <i>MITx</i> achieve this goal.
+
+    <p> <i>MITx</i> depends upon your motivation to learn the material
+      and to do so with honesty. In order to participate
+      in <i>MITx</i>, you must agree to the Honor Code below and any
+      additional terms specific to a class. This Honor Code, and any
+      additional terms, will be posted on each class website.
+
+      <div style="color:darkred;"> 
+      <h2> <i>MITx</i> Honor Code Pledge</h2>
+
+    <p> By enrolling in an <i>MITx</i> course, I agree that I will:
+
+      <ul>
+	<li> Complete all mid-terms and final exams with my own work
+	  and only my own work. I will not submit the work of any
+	  other person.
+	<li> Maintain only one user account and not let anyone else
+	  use my username and/or password.
+	<li> Not engage in any activity that would dishonestly improve
+	  my results, or improve or hurt the results of others.
+	<li> Not post answers to problems that are being used to
+	  assess student performance.
+      </ul>
+      </div>
+    <p> Unless otherwise indicated by the instructor of an <i>MITx</i>
+    course, learners on <i>MITx</i> are encouraged to:
+      <ul>
+	<li> Collaborate with others on the lecture videos, exercises,
+	homework and labs.
+	<li> Discuss with others general concepts and materials in
+	each course.
+	<li> Present ideas and written work to fellow <i>MITx</i>
+	learners or others for comment or criticism.
+      </ul>
   </div>
 </section>
diff --git a/tos.html b/tos.html
index e71023997e..9a4d327e87 100644
--- a/tos.html
+++ b/tos.html
@@ -2,11 +2,290 @@
 
 <section class="tos">
   <div>
-    <h1>MITx Terms of Service</h1>
 
-    <p>Welcome to MITx. You must read and agree to these Terms of Service ("TOS") prior to using any portion of this site (&rdquo;Site&ldquo;), including accessing any chat room, mailing list, or other electronic service. These TOS, MITx&rsquo;s Privacy Policy [link] and Honor Code [link] are an agreement between you and the Massachusetts Institute of Technology ("MIT"). By registering for, accessing, browsing, or using any portion of the Site, you acknowledge that you have read, understood and agree to be bound by these TOS, the Privacy Policy and Honor Code. </p>
-    <p>MITx reserves the right to modify these TOS at any time and will publish notice of any such modifications online on the Site&rsquo;s homepage for a reasonable period of time following such modifications, and by changing the effective date of these TOS. By continuing to access the Site after notice of such modifications has been published, you signify your agreement to be bound by them. </p>
-    <h2>Description of MITx </h2>
-    <p>MITx offers online courses, professor-to-student and student-to-student interactivity, individual assessment of a student&rsqyo;s work, and the opportunity for students who demonstrate their mastery of subjects to earn a certificate or credential awarded by MITx. </p>
-  </div>
+<h1>MITx Terms of Service</h1>
+
+<p>Welcome to MITx. You must read and agree to these Terms of Service
+(&quot;TOS&quot;), MITx&rsquo;s <a href="/t/privacy.html">Privacy
+Policy</a>, and <a href="/t/honor.html">Honor Code</a> prior to
+registering for this Site or using any portion of this site
+(&ldquo;Site&rdquo;) , including accessing any course materials, chat
+room, mailing list, or other electronic service. These TOS, the
+Privacy Policy and the Honor Code are agreements (the
+&ldquo;Agreements&rdquo;) between you and the Massachusetts Institute
+of Technology (&ldquo;MIT&rdquo;). If you do not understand or do not
+agree to be bound by the terms of the Agreements, please immediately
+exit this site. </p>
+
+<p>MITx reserves the right to modify these TOS at any time and will
+publish notice of any such modifications online on the
+Site <a href="/t/tos.html">Terms of Service page</a> for a reasonable
+period of time following such modifications, and by changing the
+effective date of these TOS. By continuing to access the Site
+after notice of such modifications has been published, you signify
+your agreement to be bound by them. </p>
+
+<h2>Description of MITx </h2>
+
+<p>MITx offers online courses, professor-to-student and
+student-to-student interactivity, individual assessment of a
+student&rsquo;s work, and the opportunity for students who demonstrate
+their mastery of subjects to earn a certificate or credential awarded
+by MITx. </p>
+
+<h2>Rules for Online Conduct</h2>
+
+<p>You agree that you are responsible for your own use of the Site and
+for your User Postings.  &ldquo;User Postings&rdquo; include all
+content submitted, posted, published or distributed on the Site by you
+or other users of the Site, including but not limited to all forum
+posts, notes, questions, and comments. You agree that you will use the
+Site in compliance with these TOS and all applicable local, state,
+national, and international laws, rules and regulations, including any
+laws regarding the transmission of technical data exported from your
+country of residence and all United States export control laws.
+
+<p>As a condition of your use of the Services, you will not use the
+Site in any manner that could damage, disable, overburden, or impair
+any MITx server, or the network(s) connected to any MITx server, or
+interfere with any other party&#39;s use and enjoyment of the
+Site. You may not attempt to gain unauthorized access to the Site,
+other accounts, computer systems or networks connected to any MITx
+server through hacking, password mining or any other means. You may
+not obtain or attempt to obtain any materials or information through
+any means not intentionally made available through the Site. </p>
+
+<h2>The following list of items is strictly prohibited on the Site:</h2>
+<ol>
+<li>Content that defames or threatens others
+<li>Harassing statements or content 
+<li>Content that discusses illegal activities with the intent to commit them.
+<li>Content that infringes another&#39;s intellectual property,
+including, but not limited to, copyrights, trademarks, or trade
+secrets
+<li>Any inappropriate, profane, pornographic, defamatory, obscene,
+indecent, or unlawful content
+<li>Advertising or any form of commercial solicitation
+<li>Political content or content related to partisan political
+activities
+<li>Viruses, trojan horses, worms, time bombs, corrupted files,
+malware, spyware, or any other similar software that may damage the
+operation of another&rsquo;s computer or property
+<li>Content that contains intentional inaccurate information with the
+intent of misleading others.
+<li>You, furthermore, agree not to scrape, or otherwise download in
+bulk, user-contributed content, a list or directory of users on the
+system, or other material including but not limited to on-line
+textbooks, User Postings, or user information. You agree not to store
+more than 5 pages of the electronic textbook or 5 forum posts in any
+permanent medium (hard drive, optical disk, etc., flash drive, etc.).
+<lu>You agree to not misrepresent or attempt to misrepresent your
+identity while using the Sites (although you are welcome and
+encouraged to use an anonymous username in the forums).
+</ol> 
+
+<h2>User Accounts and Authority</h2>
+
+<p>In order to participate in Site activities, you must provide an
+email address (&quot;Email Address&quot;) and a user password
+(&quot;User Password&quot;) in order to create a user account
+(&ldquo;User Account&rdquo;). You agree that you will never divulge or
+share access or access information to your User Account with any third
+party for any reason. In setting up your User Account, you may be
+prompted or required to enter additional information, including your
+name. You understand and agree that all information provided by you is
+accurate and current. You agree to maintain and update your
+information to keep it accurate and current. </p>
+
+<p>We consider the confidentiality and security of your information to
+be of the utmost importance.  Please see
+our <a href="/t/privacy.html">Privacy Policy</a> for more information
+about what information about you MITx collects and how MITx uses that
+information.</p>
+
+<h2>Your Right to Use Content on the Site</h2>
+
+<p>Unless indicated as being in the public domain, all content on the
+Site is protected by United States copyright. The texts, exams and
+other instructional materials provided with the courses offered on
+this Site are for your personal use in connection with those courses
+only. MIT is planning to make MITx course content and software
+infrastructure available under open source licenses that will help
+create a vibrant ecosystem of contributors and further MIT&rsquo;s
+goal of making education accessible and affordable to the world. </p>
+
+<p>Certain reference documents, digital textbooks, articles and other
+information on the Site are used with the permission of third parties
+and use of that information is subject to certain rules and
+conditions, which will be posted along with the information. By using
+this Site you agree to abide by all such terms and conditions. Due to
+privacy concerns, student-created content, including all forum posts,
+is all Rights Reserved until released under other terms by MITx. </p>
+
+<h2>USER POSTINGS</h2>
+
+<p><strong>User Postings Representations and Warranties.</strong> By
+uploading and publishing your User Postings, you affirm, represent,
+and warrant that you are the creator and owner of or have the
+necessary licenses, rights, consents, and permissions to use and to
+authorize MIT and MITx&rsquo;s Users to use and distribute your User
+Postings as necessary to exercise the licenses granted by you in these
+TOS and in the manner contemplated by MITx. You, and not MITx, are
+solely responsible for your User Postings and the consequences of
+posting or publishing them.</p>
+
+<p><strong>Limited License Grant to MIT.</strong> By submitting or distributing
+User Postings through the Site, you hereby grant to MIT a worldwide,
+non-exclusive, transferable, assignable, fully paid-up, royalty-free,
+perpetual, irrevocable right and license to host, transfer, display,
+perform, reproduce, modify, distribute and re-distribute, relicense,
+and otherwise exploit your User Postings, in whole or in part, in any
+form, and in any media formats and through any media channels (now
+known or hereafter developed).</p>
+
+<p><strong>Limited License Grant to MITx Users.</strong> By submitting
+or distributing User Postings through the Site, you hereby grant to
+each User of the Site a non-exclusive license to access and use your
+User Postings in connection with their use of the Site for their own
+personal purposes. </p>
+
+<h2>Use of MITx and MIT Names, Trademarks and Service Marks</h2>
+
+<p>&ldquo;MITx,&rdquo; &quot;MIT&quot;, &quot;Massachusetts Institute
+of Technology&quot;, and its logos and seal are trademarks of the
+Massachusetts Institute of Technology. You may not use MIT&rsquo;s
+names or logos, or any variations thereof, without prior written
+consent of MIT. You may not use the MIT name in any of its forms nor
+MIT seals or logos for promotional purposes, or in any way that
+deliberately or inadvertently claims, suggests, or in MIT&#39;s sole
+judgment gives the appearance or impression of a relationship with or
+endorsement by MIT.
+
+<p>All Trademarks not owned by MIT that appear on the Site or on or
+through the services made available on or through the Site, if any,
+are the property of their respective owners.  Nothing contained
+on the Site should be construed as granting, by implication, estoppel,
+or otherwise, any license or right to use any such Trademark displayed
+on the Site without the written permission of the third party that may
+own the applicable Trademark.
+name="id.7dd2c542f51d"></a>
+
+
+<h2>Digital Millennium Copyright Act</h2>
+
+<p>It is MIT&rsquo;s policy to respond to notices of alleged copyright
+infringement that comply with the Digital Millennium Copyright
+Act. For more information, please go to MIT&rsquo;s DMCA Notification
+Guidelines <a href="http://web.mit.edu/copyright/dmca-notices.html">http://web.mit.edu/copyright/dmca-notices.html</a>,
+incorporated herein by reference.</p>
+
+<h2>Disclaimer of Warranty / Indemnification/Limitation of Liabilities</h2>
+
+<p>THE SITE, INCLUDING, WITHOUT LIMITATION, ALL SERVICES, CONTENT,
+FUNCTIONS AND MATERIALS PROVIDED ON OR THROUGH THE SITE AND ANY
+INFORMATION THEREIN ARE PROVIDED &quot;AS IS&quot; WITHOUT WARRANTY OF
+ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY, FITNESS FOR USE FOR A
+PARTICULAR PURPOSE, TITLE OR NONINFRINGEMENT AND MIT HEREBY DISCLAIMS
+ANY AND ALL SUCH WARRANTIES, EXPRESS OR IMPLIED. MIT does not warrant
+the Site will operate in an uninterrupted or error-free manner or that
+the Site is free of viruses or other harmful components. Use of
+information obtained from or through this Site is at your own
+risk. Your access to or download of information, materials, or data
+through the Site or any reference sites is at your own discretion and
+risk and that you will be solely responsible for any damage to your
+property (including your computer system) or loss of data that results
+from the download or use of such material or data.</p>
+
+<p><strong>User Postings Disclaimer.</strong> You understand that when
+using the Site you will be exposed to User Postings from a variety of
+sources, and that MIT is not responsible for the accuracy, usefulness,
+reliability, or intellectual property rights of or relating to such
+User Postings. You further understand and acknowledge that you may be
+exposed to User Postings that are inaccurate, offensive, defamatory,
+indecent or objectionable, and you agree to waive, and hereby do
+waive, any legal or equitable rights or remedies you have or may have
+against MIT with respect thereto. MIT does not endorse any User
+Postings or any opinion, recommendation or advice expressed
+therein.  MITx has no obligation to monitor any User Postings or
+any other user communications through the Site. However, MITx reserves
+the right to review User Postings and to edit or remove, in whole or
+in part, such User Postings in its sole discretion. If notified by a
+User or a content owner of a User Posting that allegedly does not
+conform to the TOS, MIT may investigate the allegation and determine
+in its sole discretion whether to remove the User Posting, which it
+reserves the right to do at any time and without notice. </p>
+
+<p><strong>Links to Other Sites.</strong> The Site may include
+hyperlinks to sites maintained or controlled by others. MIT is not
+responsible for and does not routinely screen, approve, review or
+endorse the contents of or use of any of the products or services that
+may be offered at these sites. MIT does MIT make any warranty or
+representation regarding any linked third party web sites or the
+information or materials appearing thereon or any of the products or
+services described thereon.  Hyperlinks do not imply that MIT is
+affiliated or associated with, the linked-third party site.  If
+you decide to access linked third party web sites, you do so at your
+own risk.</p>
+
+<strong>
+<p>YOU AGREE THAT MIT WILL NOT BE LIABLE TO YOU FOR ANY LOSS OR
+DAMAGES, EITHER ACTUAL OR CONSEQUENTIAL, ARISING OUT OF OR RELATING TO
+THESETOS, OR TO YOUR (OR ANY THIRD PARTY&#39;S) USE OR INABILITY TO
+USE THE SITE, OR TO YOUR PLACEMENT OF CONTENT ON THE SITE, OR TO YOUR
+RELIANCE UPON INFORMATION OBTAINED FROM OR THROUGH THE SITE WHETHER
+BASED IN CONTRACT, TORT, STATUTORY OR OTHER LAW, EXCEPT ONLY IN THE
+CASE OF DEATH OR PERSONAL INJURY WHERE AND ONLY TO THE EXTENT THAT
+APPLICABLE LAW REQUIRES SUCH LIABILITY. </p>
+
+<p>IN PARTICULAR, MIT WILL HAVE NO LIABILTY FOR ANY CONSEQUENTIAL,
+INDIRECT, PUNITIVE, SPECIAL, EXEMPLARY OR INCIDENTAL DAMAGES, WHETHER
+FORESEEABLE OR UNFORESEEABLE, (INCLUDING, BUT NOT LIMITED TO, CLAIMS
+FOR DEFAMATION, ERRORS, LOSS OF DATA, OR INTERRUPTION IN AVAILABILITY
+OF DATA).</p>
+</strong>
+
+<h2>Indemnification</h2>
+
+<p>You agree to defend, hold harmless and indemnify MIT, and its
+subsidiaries, affiliates, officers, agents, and employees from and
+against any third-party claims, actions or demands arising out of,
+resulting from or in any way related to your use of the Site,
+including any liability or expense arising from any and all claims,
+losses, damages (actual and consequential), suits, judgments,
+litigation costs and attorneys&#39; fees, of every kind and nature. In
+such a case, MIT will provide you with written notice of such claim,
+suit or action.</p>
+
+<h2>Miscellaneous</h2>
+
+<p><strong>Termination Rights.</strong> You agree that MIT, in its sole
+discretion, may terminate your use of the Site or your participation
+in it thereof, for any reason or no reason. If you no longer desire to
+participate in the Site, you may terminate your participation therein
+upon notice to MIT.</p>
+
+<p><strong>Entire Agreement.</strong> This Agreement constitutes the entire agreement
+between you and MIT with respect to your use of the Site, superseding
+any prior agreements between you and MIT regarding your use of the
+Site. </p>
+
+<p><strong>Waiver and Severability of TOS.</strong> The failure of MIT to exercise or
+enforce any right or provision of the TOS of Site shall not constitute
+a waiver of such right or provision. If any provision of the TOS is
+found by a court of competent jurisdiction to be invalid, the parties
+nevertheless agree that the court should endeavor to give effect to
+the parties&#39; intentions as reflected in the provision, and the
+other provisions of the TOS remain in full force and effect.</p>
+
+<p><strong>Choice of Law/Forum Selection.</strong>  You agree that any dispute
+arising out of or relating to these Terms or any content posted to a
+Site will be governed by the laws of the Commonwealth of
+Massachusetts, excluding its conflicts of law provisions. You further
+consent to the personal jurisdiction of and exclusive venue in the
+federal and state courts located in and serving Boston, Massachusetts
+as the legal forum for any such dispute.</p>
+
+<p><strong>Effective Date:</strong> January 30, 2012</p><div>
+</div>
 </section>

From bd570bee4675caf4d26e1619ddd6dbbbe3955c53 Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Mon, 30 Jan 2012 15:51:08 -0500
Subject: [PATCH 02/26] Added styles for the video player

---
 sass/_courseware-video.scss | 113 +++++++++++++++++++++++++++++-------
 video.html                  |  19 ++++--
 2 files changed, 105 insertions(+), 27 deletions(-)

diff --git a/sass/_courseware-video.scss b/sass/_courseware-video.scss
index 10504ff39c..bb8dde7d58 100644
--- a/sass/_courseware-video.scss
+++ b/sass/_courseware-video.scss
@@ -3,7 +3,6 @@ section.course-content {
   div.video-wrapper {
     float: left;
     width: flex-grid(6, 9);
-
     margin-right: flex-gutter(9);
 
     div.video-player {
@@ -32,40 +31,112 @@ section.course-content {
       }
     }
 
-    section {
-      ul {
-        display: inline-block;
+    // ul {
+    //   float: left;
+
+    //   li {
+    //     margin-top: 5px;
+    //     display: inline-block;
+    //     cursor: pointer;
+    //     border: 0;
+    //     padding: 0;
+
+    //     div {
+    //       &:empty {
+    //         display: none;
+    //       }
+    //     }
+    //   }
+    // }
+
+    section.video-controls {
+      @extend .clearfix;
+      background: #333;
+      border: 1px solid #000;
+      color: #ccc;
+
+      div#slider {
+        @extend .clearfix;
+        @include border-radius(0);
+        @include box-shadow(inset 0 1px 0 #eee, 0 1px 0 #555);
+        background: #c2c2c2;
+        border: none;
+        border-bottom: 1px solid #000;
+        height: 22px;
+
+        a.ui-slider-handle {
+          @include border-radius(0);
+          background: $mit-red url(/static/images/slider-handle.png) center center no-repeat;
+          border: 0;
+          border-right: 1px solid darken($mit-red, 20%);
+          border-left: 1px solid darken($mit-red, 20%);
+          cursor: pointer;
+          height: 22px;
+          margin: 0;
+          top: 0;
+          width: 22px;
+        }
+      }
+
+      ul.vcr {
+        float: left;
+        margin-right: lh();
 
         li {
-          margin-top: 5px;
-          display: inline-block;
-          cursor: pointer;
-          border: 0;
-          padding: 0;
+          float: left;
 
-          div {
-            &:empty {
-              display: none;
+          a {
+            @include box-shadow(1px 0 0 #555);
+            border-right: 1px solid #000;
+            display: block;
+            cursor: pointer;
+            height: 14px;
+            padding: lh(.75) lh();
+            text-indent: -9999px;
+            width: 14px;
+
+            &.play {
+              background: url('/static/images/play-icon.png') center center no-repeat;
+
+              &:hover {
+                background-color: #444;
+              }
+            }
+
+            &.pause {
+              background: url('/static/images/pause-icon.png') center center no-repeat;
+
+              &:hover {
+                background-color: #444;
+              }
             }
           }
         }
       }
 
-      div#slider {
-        margin: -14px 0 10px 60px;
-      }
-
       div#vidtime {
         float: left;
+        font-weight: bold;
+        line-height: 46px; //height of play pause buttons
+        -webkit-font-smoothing: antialiased;
       }
 
-      div#video_speeds {
+      div.speeds {
         float: right;
-        cursor: pointer;
+        line-height: 46px; //height of play pause buttons
+        margin-right: lh();
+        -webkit-font-smoothing: antialiased;
 
-        span {
-          &:hover {
-            color: $mit-red;
+        div#video_speeds {
+          @include inline-block();
+          font-weight: bold;
+
+          span {
+            cursor: pointer;
+
+            &:hover {
+              color: $mit-red;
+            }
           }
         }
       }
diff --git a/video.html b/video.html
index 20dd38d063..a68476548e 100644
--- a/video.html
+++ b/video.html
@@ -8,13 +8,20 @@
   </div>
 
   <section class="video-controls">
-       <ul>
-        <li><span class="ui-icon ui-icon-play" onclick="play();"></span></li>
-        <li><span class="ui-icon ui-icon-pause" onclick="pause();"></span></li>
-      </ul>
     <div id="slider"></div>
-    <div id="vidtime">0:00/0:00</div>
-    <div id="video_speeds"></div>
+
+    <section>
+      <ul class="vcr">
+        <li><a class="play" onclick="play();">Play</a></li>
+        <li><a class="pause" onclick="pause();">Pause</a></li>
+      </ul>
+
+      <div id="vidtime">0:00 / 0:00</div>
+
+      <div class="speeds">
+        Speed: <div id="video_speeds"></div>
+      </div>
+    </section>
   </section>
 
 </div>

From e6cea32d82b0a7ae3b8b656b9c51afdc318c326a Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Mon, 30 Jan 2012 16:50:47 -0500
Subject: [PATCH 03/26] Changed around the text on the marketing pages

---
 index.html                  | 23 +++++++++--------------
 marketing.html              |  2 +-
 mitx_global.html            | 17 ++++++++---------
 sass/_courseware-video.scss |  6 +++---
 video.html                  |  2 +-
 5 files changed, 22 insertions(+), 28 deletions(-)

diff --git a/index.html b/index.html
index 8d73c3ad00..0f305e8f13 100644
--- a/index.html
+++ b/index.html
@@ -7,7 +7,7 @@
         <h2>6.002x</h2>
         <a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002 Circuits <span>&amp;</span> Electronics</a>
       </section>
-      <p> Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris Terman, &ldquo;6.002x Circuits and Electronics&rdquo; is an experimental on-line adaption of MIT's first undergraduate analog design course 6.002. This course will run, free of charge, for students worldwide  from February 21, 2012 through June&nbsp;10,&nbsp;2012.</p>
+      <p>6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT&rsquo;s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012.</p>
     </section>
 </%block>
 <%block name="header_class">course</%block>
@@ -18,9 +18,9 @@
     <section class="about-info">
       <h1>About 6.002x</h1>
 
-      <p>6.002x is designed to serve as a first course in an undergraduate electrical engineering (EE), or electrical engineering and computer science (EECS) curriculum. At MIT, 6.002 is in the core of department subjects required for all undergraduates in EECS.</p>
+      <p>6.002x (Circuits and Electronics) is designed to serve as a first course in an undergraduate electrical engineering (EE), or electrical engineering and computer science (EECS) curriculum. At MIT, 6.002 is in the core of department subjects required for all undergraduates in EECS.</p>
 
-<p>The course introduces engineering in the context of the lumped circuit abstraction. Topics covered include: resistive elements and networks; independent and dependent sources; switches and MOS transistors; digital abstraction; amplifiers; energy storage elements; dynamics of first- and second-order networks; design in the time and frequency domains; and analog and digital circuits and applications. Design and lab exercises are also significant components of the course. Students should expect to spend approximately 10  hours per week on the course.  The 6.002 content was created collaboratively by Profs. Anant Agarwal and Jeffrey H. Lang.</p>
+<p>The course introduces engineering in the context of the lumped circuit abstraction. Topics covered include: resistive elements and networks; independent and dependent sources; switches and MOS transistors; digital abstraction; amplifiers; energy storage elements; dynamics of first- and second-order networks; design in the time and frequency domains; and analog and digital circuits and applications. Design and lab exercises are also significant components of the course. You should expect to spend approximately 10  hours per week on the course.</p>
 
       <!-- <p> The course uses the textbook Foundations of Analog and Digital Electronic Circuits. Agarwal, Anant, and Jeffrey H. Lang. San Mateo, CA: Morgan Kaufmann Publishers, Elsevier, July 2005. ISBN: 9781558607354. While recommended, the book is not required -- relevant section will be provided electronically as part of the on-line course.</p> -->
     </section>
@@ -28,15 +28,15 @@
     <section class="on-mitx">
       <h1>6.002x on <em>MITx</em></h1> <!-- Link doesn't need to be here, but there should be some way to get back to main MITx site -->
 
-      <p>Students who successfully complete the course will receive an electronic certificate of accomplishment from MIT. Since this is an experimental version of the course, the certificate will be marked as Beta.</p>
+      <p>If you successfully complete the course, you will receive an electronic certificate of accomplishment from <em>MITx</em>. This certificate will indicate that you earned it from <em>MITx&rsquo;s</em> pilot course. In this prototype version, <em>MITx</em> will not require that you be tested in a testing center or otherwise have your identity certified in order to receive this certificate.</p>
 
-<p> The course uses the textbook Foundations of Analog and Digital Electronic Circuits. Agarwal, Anant, and Jeffrey H. Lang.  Morgan Kaufmann Publishers, Elsevier, July 2005. ISBN: 9781558607354. While recommended, the book is not required -- relevant sections will be provided electronically as part of the on-line course. The book can be purchased on <a href="http://www.amazon.com/exec/obidos/ASIN/1558607358/ref=nosim" target="_blank">Amazon</a>. Copyright for the book is with Elsevier and the book cannot be printed etc.</p>
+<p>The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005.  While recommended, the book is not required: relevant sections will be provided electronically as part of the online course for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on <a href="http://www.amazon.com/exec/obidos/ASIN/1558607358/ref=nosim" target="_blank">Amazon</a>.</p>
     </section>
 
     <section class="requirements">
       <h1> Requirements </h1>
 
-      <p>In order to succeed in this course, students must have taken an  AP level physics course in electricity and magnetism.  Students must know basic calculus and  linear algebra, and have some background in differential equations. Since more advanced mathematics will not show up until the second half of the course, the first half of the course will include an optional remedial differential equations component for students with weaker math backgrounds.</p>
+      <p>In order to succeed in this course, you  must have taken an AP level physics course in electricity and magnetism. You  must know basic calculus and linear algebra and have some background in differential equations. Since more advanced mathematics will not show up until the second half of the course, the first half of the course will include an optional remedial differential equations component for those who need it.</p>
 
       <p>The course web site was developed and tested primarily with Google Chrome. We support Mozilla Firefox as well. While we will attempt to make it possible to complete the course with Internet Explorer, portions of the web site functionality will be unavailable. The videos require Flash.</p>
     </section>
@@ -54,22 +54,17 @@
       <li>
         <img src="/static/staff/agarwal-mit-news-small.jpg">
         <h2>Anant Agarwal</h2>
-        <p>The Director of MIT's Computer Science and Artificial Intelligence Laboratory. His research focus is in parallel computer architectures, and he is the founder of several successful startups. Most recently, he founded Tilera, which produces scalable multicore embedded processors. He co-author the course textbook "Foundations of Analog and Digital Electronic Circuits."</p></li>
-
-      <li>
-        <img src="/static/staff/cjt-small.jpg">
-        <h2>Chris Terman</h2>
-        <p>The Co-Director MIT CSAIL, and a highly regarded instructor. He is the author of JSim, an educational package for on-line circuit schematic entry and simulation, and XTutor, and on-line question-and-answer tutoring system.</p></li>
+        <p>Director of MIT's Computer Science and Artificial Intelligence Laboratory (CSAIL) and a professor of the Electrical Engineering and Computer Science department at MIT. His research focus is in parallel computer architectures and cloud software systems, and he is a founder of several successful startups, including  Tilera, a company that produces scalable multicore  processors.  Prof. Agarwal won MIT&rsquo;s  Smullin and Jamieson prizes for teaching and co-authored  the course textbook &ldquo;Foundations of Analog and Digital Electronic Circuits.&rdquo;</p></li>
 
       <li>
         <img src="/static/staff/gjs-small.jpg">
         <h2>Gerald Sussman</h2>
-        <p>A Professor of Electrical Engineering at MIT. He is a well know educator in the computer science community, perhaps best know as the author of Structure and Interpretation of Computer Programs, which is universally acknowledged as one of the top ten textboooks in computer science, or as the creator of Scheme, a popular teaching language. His research spans a range of topics, from artificial intelligence, to physics and chaotic systems, to supercomputer design.</p></li>
+        <p>Professor of Electrical Engineering at MIT. He is a well known educator in the computer science community, perhaps best known as the author of Structure and Interpretation of Computer Programs, which is universally acknowledged as one of the top ten textbooks in computer science, and as the creator of Scheme, a popular teaching language. His research spans a range of topics, from artificial intelligence, to physics and chaotic systems, to supercomputer design.</p></li>
 
       <li>
         <img src="/static/staff/pmitros-small.jpg">
         <h2>Piotr Mitros</h2>
-        <p>A Research Scientist at MIT. His research focus is in finding ways to apply techniques from control systems to optimizing the learning process. Piotr has worked as an analog designer at Texas Instruments, Talking Lights, and most recently, designed the analog front end for a novel medical imaging modality for Rhythmia Medical.</p></li>
+        <p>Research Scientist at MIT. His research focus is in finding ways to apply techniques from control systems to optimizing the learning process. Dr. Mitros has worked as an analog designer at Texas Instruments, Talking Lights, and most recently, designed the analog front end for a novel medical imaging modality for Rhythmia Medical.</p></li>
     </ul>
 
   </section>
diff --git a/marketing.html b/marketing.html
index 6979a54790..601aef39aa 100644
--- a/marketing.html
+++ b/marketing.html
@@ -73,7 +73,7 @@ function postJSON(url, data, callback) {
     <%block name="header_text">
       <section>
         <h1>MITx</h1>
-        <h2>An MIT Education Anywhere. For free.</h2>
+        <h2>MIT&rsquo;s new online learning initiative</h2>
       </section>
      </%block>
     </div>
diff --git a/mitx_global.html b/mitx_global.html
index 83fc572f2e..29fcfdd784 100644
--- a/mitx_global.html
+++ b/mitx_global.html
@@ -4,21 +4,20 @@
 
 <section class="index-content">
   <section class="about">
-    <h1><em>MITx</em> is MIT&rsquo;s online learning initiative.</h1>
 
     <section class="intro">
-      <p>This learning platform will enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences. It will also be host to a virtual community of learners around the world.</p>
-      <p>The first course offered by <em>MITx</em> in an experimental prototype form is 6.002x Circuits and Electronics. Watch this space for the next set of courses that will become available in Fall 2012.</p>
+      <p><em>MITx</em>  will offer a portfolio of MIT courses for free to a virtual community of learners around the world. It will also enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences.</p>
+      <p>The first <em>MITx</em> course, 6.002x (Circuits and Electronics), will be launched in an experimental prototype form. Watch this space for further upcoming courses, which will become available in Fall 2012.</p>
     </section>
 
     <section class="features">
-      <h2>It will offer a portfolio of MIT courses for free on an online learning platform that:</h2>
+      <h2><em>MITx</em> courses will be offered on an online learning platform that:</h2>
 
       <ul>
-        <li>organizes and presents course material to enable students to learn at their own pace</li>
-        <li>features interactivity, online laboratories and student-to-student communication</li>
-        <li>allows for the individual assessment of any student&rsquo;s work and allow students who demonstrate their mastery of subjects to earn a certificate of completion awarded by <em>MITx</em></li>
-        <li>operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions.</li>
+        <li>organizes and presents course material to enable students to learn worldwide</li>
+        <li>features interactive instruction, online laboratories and student-to-student and student-to-professor communication</li>
+        <li>allows for the individual assessment of any student&rsquo;s work and allows students who demonstrate their mastery of subjects to earn certificates awarded by <em>MITx</em></li>
+        <li>operates on an open-source, scalable software infrastructure in order to make it continuously improving and readily available to other educational institutions, such as universities and K-12 school systems.</li>
       </ul>
 
       <p><strong>Press &amp; links:</strong> <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>,  <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a></p>
@@ -36,7 +35,7 @@
       <a href="http://6002x.mitx.mit.edu/" class="more-info">More information <span>&amp;</span> Enroll</a>
     </p>
 
-    <p>Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris Terman, &ldquo;6.002 Circuits and Electronics&rdwuo; is an on-line adaption of MIT's first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from February 21, 2012 through June 10, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
+    <p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
   </section>
 </section>
 <script>
diff --git a/sass/_courseware-video.scss b/sass/_courseware-video.scss
index bb8dde7d58..a77877b262 100644
--- a/sass/_courseware-video.scss
+++ b/sass/_courseware-video.scss
@@ -62,7 +62,7 @@ section.course-content {
         background: #c2c2c2;
         border: none;
         border-bottom: 1px solid #000;
-        height: 22px;
+        height: 20px;
 
         a.ui-slider-handle {
           @include border-radius(0);
@@ -71,10 +71,10 @@ section.course-content {
           border-right: 1px solid darken($mit-red, 20%);
           border-left: 1px solid darken($mit-red, 20%);
           cursor: pointer;
-          height: 22px;
+          height: 20px;
           margin: 0;
           top: 0;
-          width: 22px;
+          width: 20px;
         }
       }
 
diff --git a/video.html b/video.html
index a68476548e..7e13c80974 100644
--- a/video.html
+++ b/video.html
@@ -16,7 +16,7 @@
         <li><a class="pause" onclick="pause();">Pause</a></li>
       </ul>
 
-      <div id="vidtime">0:00 / 0:00</div>
+      <div id="vidtime">0:00/0:00</div>
 
       <div class="speeds">
         Speed: <div id="video_speeds"></div>

From 5e89fba41d5b0b8910fc497b23e8230c7fb0fb8a Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Mon, 30 Jan 2012 17:08:51 -0500
Subject: [PATCH 04/26] Added min-height to subtitles to decrease the size
 change

---
 sass/_courseware-video.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/sass/_courseware-video.scss b/sass/_courseware-video.scss
index a77877b262..389c23c370 100644
--- a/sass/_courseware-video.scss
+++ b/sass/_courseware-video.scss
@@ -146,6 +146,7 @@ section.course-content {
   ol.subtitles {
     float: left;
     width: flex-grid(3, 9);
+    min-height: 570px;
 
     li {
       margin-bottom: 0px;

From 82c1c70c0d3db1bca651541cef5d01d23babac5c Mon Sep 17 00:00:00 2001
From: Reda Lemeden <reda@thoughtbot.com>
Date: Mon, 30 Jan 2012 17:31:41 -0500
Subject: [PATCH 05/26] Added style to the top section of the question view
 (voting+social still missing)

---
 sass/_askbot-original.scss      | 888 ++++++++++++++++----------------
 sass/_base.scss                 |   6 +
 sass/_discussion-questions.scss |  42 +-
 sass/_discussion-tags.scss      |   4 +-
 sass/_question-view.scss        |  70 +++
 sass/application.scss           |   2 +-
 6 files changed, 562 insertions(+), 450 deletions(-)
 create mode 100644 sass/_question-view.scss

diff --git a/sass/_askbot-original.scss b/sass/_askbot-original.scss
index 6fb2f026d6..461bc05176 100644
--- a/sass/_askbot-original.scss
+++ b/sass/_askbot-original.scss
@@ -1205,448 +1205,451 @@ ul {
 .edit-question-page .title-desc, #fmedit .title-desc, .wmd-preview .title-desc {
   margin-bottom: 10px; }
 
-.question-page {
-  h1 {
-    padding-top: 0px;
-    font-family: 'Yanone Kaffeesatz',sans-serif;
-    a {
-      color: #464646;
-      font-size: 30px;
-      font-weight: normal;
-      line-height: 1; } }
-  p.rss {
-    float: none;
-    clear: both;
-    padding: 3px 0 0 23px;
-    font-size: 15px;
-    width: 110px;
-    background-position: center left;
-    margin-left: 0px !important;
-    a {
-      font-family: 'Yanone Kaffeesatz',sans-serif;
-      vertical-align: top; } }
-  .question-content {
-    float: right;
-    width: 682px;
-    margin-bottom: 10px; }
-  #question-table {
-    float: left;
-    border-top: #f0f0f0 1px solid;
-    margin: 6px 0 6px 0;
-    border-spacing: 0px;
-    width: 670px;
-    padding-right: 10px; }
-  .answer-table {
-    margin: 6px 0 6px 0;
-    border-spacing: 0px;
-    width: 670px;
-    padding-right: 10px;
-    margin-top: 0px;
-    border-bottom: 1px solid #D4D4D4;
-    float: right;
-    td {
-      width: 20px;
-      vertical-align: top; } }
-  #question-table td {
-    width: 20px;
-    vertical-align: top; }
-  .question-body, .answer-body {
-    overflow: auto;
-    margin-top: 10px;
-    font-family: Arial;
-    color: #4b4b4b; }
-  .question-body p, .answer-body p {
-    margin-bottom: 14px;
-    line-height: 1.4;
-    font-size: 14px;
-    padding: 0px 5px 5px 0px; }
-  .question-body a, .answer-body a {
-    color: #1b79bd; }
-  .question-body li, .answer-body li {
-    margin-bottom: 7px; }
-  .question-body IMG, .answer-body IMG {
-    max-width: 600px; }
-  .post-update-info-container {
-    float: right;
-    width: 175px; }
-  .post-update-info {
-    background: white url(../images/background-user-info.png) repeat-x bottom;
-    float: right;
-    font-size: 9px;
-    font-family: Arial;
-    width: 158px;
-    padding: 4px;
-    margin: 0px 0px 5px 5px;
-    line-height: 14px;
-    border-radius: 4px;
-    -ms-border-radius: 4px;
-    -moz-border-radius: 4px;
-    -webkit-border-radius: 4px;
-    -khtml-border-radius: 4px;
-    -webkit-box-shadow: 0px 2px 1px #bfbfbf;
-    -moz-box-shadow: 0px 2px 1px #bfbfbf;
-    box-shadow: 0px 2px 1px #bfbfbf;
-    p {
-      line-height: 13px;
-      font-size: 11px;
-      margin: 0 0 2px 1px;
-      padding: 0; }
-    a {
-      color: #444; }
-    .gravatar {
-      float: left;
-      margin-right: 4px; }
-    p.tip {
-      color: #444;
-      line-height: 13px;
-      font-size: 10px; } }
-  .post-controls {
-    font-size: 11px;
-    line-height: 12px;
-    min-width: 200px;
-    padding-left: 5px;
-    text-align: right;
-    clear: left;
-    float: right;
-    margin-top: 10px;
-    margin-bottom: 8px;
-    a {
-      color: #777;
-      padding: 0px 3px 3px 22px;
-      cursor: pointer;
-      border: none;
-      font-size: 12px;
-      font-family: Arial;
-      text-decoration: none;
-      height: 18px;
-      display: block;
-      float: right;
-      line-height: 18px;
-      margin-top: -2px;
-      margin-left: 4px;
-      &:hover {
-        background-color: #f5f0c9;
-        border-radius: 3px;
-        -ms-border-radius: 3px;
-        -moz-border-radius: 3px;
-        -webkit-border-radius: 3px;
-        -khtml-border-radius: 3px; } }
-    .sep {
-      color: #ccc;
-      float: right;
-      height: 18px;
-      font-size: 18px; }
-    .question-delete {
-      background: url(../images/delete.png) no-repeat center left;
-      padding-left: 16px; } }
-  .answer-controls .question-delete {
-    background: url(../images/delete.png) no-repeat center left;
-    padding-left: 16px; }
-  .post-controls .question-flag, .answer-controls .question-flag {
-    background: url(../images/flag.png) no-repeat center left; }
-  .post-controls .question-edit, .answer-controls .question-edit {
-    background: url(../images/edit2.png) no-repeat center left; }
-  .post-controls .question-retag, .answer-controls .question-retag {
-    background: url(../images/retag.png) no-repeat center left; }
-  .post-controls .question-close, .answer-controls .question-close {
-    background: url(../images/close.png) no-repeat center left; }
-  .post-controls .permant-link, .answer-controls .permant-link {
-    background: url(../images/link.png) no-repeat center left; }
-  .tabBar {
-    width: 100%; }
-  #questionCount {
-    float: left;
-    font-family: 'Yanone Kaffeesatz',sans-serif;
-    line-height: 15px; }
-  .question-img-upvote, .question-img-downvote, .answer-img-upvote, .answer-img-downvote {
-    width: 25px;
-    height: 20px;
-    cursor: pointer; }
-  .question-img-upvote, .answer-img-upvote {
-    background: url(../images/vote-arrow-up-new.png) no-repeat; }
-  .question-img-downvote, .answer-img-downvote {
-    background: url(../images/vote-arrow-down-new.png) no-repeat; }
-  .question-img-upvote {
-    &:hover, &.on {
-      background: url(../images/vote-arrow-up-on-new.png) no-repeat; } }
-  .answer-img-upvote {
-    &:hover, &.on {
-      background: url(../images/vote-arrow-up-on-new.png) no-repeat; } }
-  .question-img-downvote {
-    &:hover, &.on {
-      background: url(../images/vote-arrow-down-on-new.png) no-repeat; } }
-  .answer-img-downvote {
-    &:hover, &.on {
-      background: url(../images/vote-arrow-down-on-new.png) no-repeat; } }
-  #fmanswer_button {
-    margin: 8px 0px; }
-  .question-img-favorite:hover {
-    background: url(../images/vote-favorite-on.png); }
-  div.comments {
-    padding: 0; }
-  #comment-title {
-    font-weight: bold;
-    font-size: 23px;
-    color: #7ea9b3;
-    width: 200px;
-    float: left;
-    font-family: 'Yanone Kaffeesatz',sans-serif; }
-  .comments {
-    font-size: 12px;
-    clear: both;
-    div.controls {
-      clear: both;
-      float: left;
-      width: 100%;
-      margin: 3px 0 20px 5px; }
-    .controls a {
-      color: #988e4c;
-      padding: 0 3px 2px 22px;
-      font-family: Arial;
-      font-size: 13px;
-      background: url(../images/comment.png) no-repeat center left;
-      &:hover {
-        background-color: #f5f0c9;
-        text-decoration: none; } }
-    .button {
-      color: #988e4c;
-      font-size: 11px;
-      padding: 3px;
-      cursor: pointer; }
-    a {
-      background-color: inherit;
-      color: #1b79bd;
-      padding: 0; }
-    form.post-comments {
-      margin: 3px 26px 0 42px;
-      textarea {
-        font-size: 13px;
-        line-height: 1.3; } }
-    textarea {
-      height: 42px;
-      width: 100%;
-      margin: 7px 0 5px 1px;
-      font-family: Arial;
-      outline: none;
-      overflow: auto;
-      font-size: 12px;
-      line-height: 140%;
-      padding-left: 2px;
-      padding-top: 3px;
-      border: #cce6ec 3px solid; }
-    input {
-      margin-left: 10px;
-      margin-top: 1px;
-      vertical-align: top;
-      width: 100px; }
-    button {
-      background: url(../images/small-button-blue.png) repeat-x top;
-      border: 0;
-      color: #4a757f;
-      font-family: Arial;
-      font-size: 13px;
-      width: 100px;
-      font-weight: bold;
-      height: 27px;
-      line-height: 25px;
-      margin-bottom: 5px;
-      cursor: pointer;
-      border-radius: 4px;
-      -ms-border-radius: 4px;
-      -moz-border-radius: 4px;
-      -webkit-border-radius: 4px;
-      -khtml-border-radius: 4px;
-      text-shadow: 0px 1px 0px #e6f6fa;
-      -moz-text-shadow: 0px 1px 0px #e6f6fa;
-      -webkit-text-shadow: 0px 1px 0px #e6f6fa;
-      -webkit-box-shadow: 1px 1px 2px #808080;
-      -moz-box-shadow: 1px 1px 2px #808080;
-      box-shadow: 1px 1px 2px #808080;
-      &:hover {
-        background: url(../images/small-button-blue.png) bottom repeat-x;
-        text-shadow: 0px 1px 0px #c6d9dd;
-        -moz-text-shadow: 0px 1px 0px #c6d9dd;
-        -webkit-text-shadow: 0px 1px 0px #c6d9dd; } }
-    .counter {
-      display: inline-block;
-      width: 245px;
-      float: right;
-      color: #b6a475 !important;
-      vertical-align: top;
-      font-family: Arial;
-      float: right;
-      text-align: right; }
-    .comment {
-      border-bottom: 1px solid #edeeeb;
-      clear: both;
-      margin: 0;
-      margin-top: 8px;
-      padding-bottom: 4px;
-      overflow: auto;
-      font-family: Arial;
-      font-size: 11px;
-      min-height: 25px;
-      background: white url(../images/comment-background.png) bottom repeat-x;
-      border-radius: 5px;
-      -ms-border-radius: 5px;
-      -moz-border-radius: 5px;
-      -webkit-border-radius: 5px;
-      -khtml-border-radius: 5px; }
-    div.comment:hover {
-      background-color: #efefef; }
-    a.author {
-      background-color: inherit;
-      color: #1b79bd;
-      padding: 0;
-      &:hover {
-        text-decoration: underline; } }
-    span.delete-icon {
-      background: url(../images/close-small.png) no-repeat;
-      border: 0;
-      width: 14px;
-      height: 14px;
-      &:hover {
-        border: #BC564B 2px solid;
-        border-radius: 10px;
-        -ms-border-radius: 10px;
-        -moz-border-radius: 10px;
-        -webkit-border-radius: 10px;
-        -khtml-border-radius: 10px;
-        margin: -3px 0px 0px -2px; } }
-    .content {
-      margin-bottom: 7px; }
-    .comment-votes {
-      float: left;
-      width: 37px;
-      line-height: 130%;
-      padding: 6px 5px 6px 3px; }
-    .comment-body {
-      line-height: 1.3;
-      margin: 3px 26px 0 46px;
-      padding: 5px 3px;
-      color: #666;
-      font-size: 13px;
-      .edit {
-        padding-left: 6px; }
-      p {
-        font-size: 13px;
-        line-height: 1.3;
-        margin-bottom: 3px;
-        padding: 0; } }
-    .comment-delete {
-      float: right;
-      width: 14px;
-      line-height: 130%;
-      padding: 8px 6px; }
-    .upvote {
-      margin: 0px;
-      padding-right: 17px;
-      padding-top: 2px;
-      text-align: right;
-      height: 20px;
-      font-size: 13px;
-      font-weight: bold;
-      color: #777;
-      &.upvoted {
-        color: #d64000; }
-      &.hover {
-        background: url(../images/go-up-grey.png) no-repeat;
-        background-position: right 1px; }
-      &:hover {
-        background: url(../images/go-up-orange.png) no-repeat;
-        background-position: right 1px; } }
-    .help-text {
-      float: right;
-      text-align: right;
-      color: gray;
-      margin-bottom: 0px;
-      margin-top: 0px;
-      line-height: 50%; } }
-  #questionTools {
-    font-size: 22px;
-    margin-top: 11px;
-    text-align: left; }
-  .question-status {
-    margin-top: 10px;
-    margin-bottom: 15px;
-    padding: 20px;
-    background-color: #fef7cc;
-    text-align: center;
-    border: #e1c04a 1px solid;
-    h3 {
-      font-size: 20px;
-      color: #707070;
-      font-weight: normal; } }
-  .vote-buttons {
-    float: left;
-    text-align: center;
-    padding-top: 2px;
-    margin: 10px 10px 0px 3px;
-    IMG {
-      cursor: pointer; } }
-  .vote-number {
-    font-family: 'Yanone Kaffeesatz',sans-serif;
-    padding: 0px 0 5px 0;
-    font-size: 25px;
-    font-weight: bold;
-    color: #777; }
-  .vote-buttons .notify-sidebar {
-    text-align: left;
-    width: 120px;
-    label {
-      vertical-align: top; } }
-  .tabBar-answer {
-    margin-bottom: 15px;
-    padding-left: 7px;
-    width: 723px;
-    margin-top: 10px; }
-  .answer .vote-buttons {
-    float: left; }
-  .accepted-answer {
-    background-color: #f7fecc;
-    border-bottom-color: #9BD59B;
-    .vote-buttons {
-      width: 27px;
-      margin-right: 10px;
-      margin-top: 10px; } }
-  .answer .post-update-info a {
-    color: #444444; }
-  .answered {
-    background: #CCC;
-    color: #999; }
-  .answered-accepted {
-    background: #DCDCDC;
-    color: #763333;
-    strong {
-      color: #E1E818; } }
-  .answered-by-owner {
-    background: #F1F1FF;
-    .comments {
-      .button {
-        background-color: #E6ECFF; }
-      background-color: #E6ECFF; }
-    .vote-buttons {
-      margin-right: 10px; } }
-  .answer-img-accept:hover {
-    background: url(../images/vote-accepted-on.png); }
-  .answer-body {
-    a {
-      color: #1b79bd; }
-    li {
-      margin-bottom: 0.7em; } }
-  #fmanswer {
-    color: #707070;
-    line-height: 1.2;
-    margin-top: 10px;
-    h2 {
-      font-family: 'Yanone Kaffeesatz',sans-serif;
-      color: #7ea9b3;
-      font-size: 24px; }
-    label {
-      font-size: 13px; } }
-  .message {
-    padding: 5px;
-    margin: 0px 0 10px 0; } }
+// .question-page {
+//   h1 {
+//     padding-top: 0px;
+//     font-family: 'Yanone Kaffeesatz',sans-serif;
+//     a {
+//       color: #464646;
+//       font-size: 30px;
+//       font-weight: normal;
+//       line-height: 1; } }
+//   p.rss {
+//     float: none;
+//     clear: both;
+//     padding: 3px 0 0 23px;
+//     font-size: 15px;
+//     width: 110px;
+//     background-position: center left;
+//     margin-left: 0px !important;
+//     a {
+//       font-family: 'Yanone Kaffeesatz',sans-serif;
+//       vertical-align: top; } }
+//   .question-content {
+//     float: right;
+//     width: 682px;
+//     margin-bottom: 10px; }
+//   #question-table {
+//     float: left;
+//     border-top: #f0f0f0 1px solid;
+//     margin: 6px 0 6px 0;
+//     border-spacing: 0px;
+//     width: 670px;
+//     padding-right: 10px; }
+//   .answer-table {
+//     margin: 6px 0 6px 0;
+//     border-spacing: 0px;
+//     width: 670px;
+//     padding-right: 10px;
+//     margin-top: 0px;
+//     border-bottom: 1px solid #D4D4D4;
+//     float: right;
+//     td {
+//       width: 20px;
+//       vertical-align: top; } }
+//   #question-table td {
+//     width: 20px;
+//     vertical-align: top; }
+//   .question-body, .answer-body {
+//     overflow: auto;
+//     margin-top: 10px;
+//     font-family: Arial;
+//     color: #4b4b4b; }
+//   .question-body p, .answer-body p {
+//     margin-bottom: 14px;
+//     line-height: 1.4;
+//     font-size: 14px;
+//     padding: 0px 5px 5px 0px; }
+//   .question-body a, .answer-body a {
+//     color: #1b79bd; }
+//   .question-body li, .answer-body li {
+//     margin-bottom: 7px; }
+//   .question-body IMG, .answer-body IMG {
+//     max-width: 600px; }
+//   .post-update-info-container {
+//     float: right;
+//     width: 175px; }
+//   .post-update-info {
+//     background: white url(../images/background-user-info.png) repeat-x bottom;
+//     float: right;
+//     font-size: 9px;
+//     font-family: Arial;
+//     width: 158px;
+//     padding: 4px;
+//     margin: 0px 0px 5px 5px;
+//     line-height: 14px;
+//     border-radius: 4px;
+//     -ms-border-radius: 4px;
+//     -moz-border-radius: 4px;
+//     -webkit-border-radius: 4px;
+//     -khtml-border-radius: 4px;
+//     -webkit-box-shadow: 0px 2px 1px #bfbfbf;
+//     -moz-box-shadow: 0px 2px 1px #bfbfbf;
+//     box-shadow: 0px 2px 1px #bfbfbf;
+//     p {
+//       line-height: 13px;
+//       font-size: 11px;
+//       margin: 0 0 2px 1px;
+//       padding: 0; }
+//     a {
+//       color: #444; }
+//     .gravatar {
+//       float: left;
+//       margin-right: 4px; }
+//     p.tip {
+//       color: #444;
+//       line-height: 13px;
+//       font-size: 10px; } }
+//   .post-controls {
+//     font-size: 11px;
+//     line-height: 12px;
+//     min-width: 200px;
+//     padding-left: 5px;
+//     text-align: right;
+//     clear: left;
+//     float: right;
+//     margin-top: 10px;
+//     margin-bottom: 8px;
+//     a {
+//       color: #777;
+//       padding: 0px 3px 3px 22px;
+//       cursor: pointer;
+//       border: none;
+//       font-size: 12px;
+//       font-family: Arial;
+//       text-decoration: none;
+//       height: 18px;
+//       display: block;
+//       float: right;
+//       line-height: 18px;
+//       margin-top: -2px;
+//       margin-left: 4px;
+//       &:hover {
+//         background-color: #f5f0c9;
+//         border-radius: 3px;
+//         -ms-border-radius: 3px;
+//         -moz-border-radius: 3px;
+//         -webkit-border-radius: 3px;
+//         -khtml-border-radius: 3px; } }
+//     .sep {
+//       color: #ccc;
+//       float: right;
+//       height: 18px;
+//       font-size: 18px; }
+//     .question-delete {
+//       background: url(../images/delete.png) no-repeat center left;
+//       padding-left: 16px; } }
+//   .answer-controls .question-delete {
+//     background: url(../images/delete.png) no-repeat center left;
+//     padding-left: 16px; }
+//   .post-controls .question-flag, .answer-controls .question-flag {
+//     background: url(../images/flag.png) no-repeat center left; }
+//   .post-controls .question-edit, .answer-controls .question-edit {
+//     background: url(../images/edit2.png) no-repeat center left; }
+//   .post-controls .question-retag, .answer-controls .question-retag {
+//     background: url(../images/retag.png) no-repeat center left; }
+//   .post-controls .question-close, .answer-controls .question-close {
+//     background: url(../images/close.png) no-repeat center left; }
+//   .post-controls .permant-link, .answer-controls .permant-link {
+//     background: url(../images/link.png) no-repeat center left; }
+//   .tabBar {
+//     width: 100%; }
+//   #questionCount {
+//     float: left;
+//     font-family: 'Yanone Kaffeesatz',sans-serif;
+//     line-height: 15px; }
+//   .question-img-upvote, .question-img-downvote, .answer-img-upvote, .answer-img-downvote {
+//     width: 25px;
+//     height: 20px;
+//     cursor: pointer; }
+//   .question-img-upvote, .answer-img-upvote {
+//     background: url(../images/vote-arrow-up-new.png) no-repeat; }
+//   .question-img-downvote, .answer-img-downvote {
+//     background: url(../images/vote-arrow-down-new.png) no-repeat; }
+//   .question-img-upvote {
+//     &:hover, &.on {
+//       background: url(../images/vote-arrow-up-on-new.png) no-repeat; } }
+//   .answer-img-upvote {
+//     &:hover, &.on {
+//       background: url(../images/vote-arrow-up-on-new.png) no-repeat; } }
+//   .question-img-downvote {
+//     &:hover, &.on {
+//       background: url(../images/vote-arrow-down-on-new.png) no-repeat; } }
+//   .answer-img-downvote {
+//     &:hover, &.on {
+//       background: url(../images/vote-arrow-down-on-new.png) no-repeat; } }
+//   #fmanswer_button {
+//     margin: 8px 0px; }
+//   .question-img-favorite:hover {
+//     background: url(../images/vote-favorite-on.png); }
+//   div.comments {
+//     padding: 0; }
+//   #comment-title {
+//     font-weight: bold;
+//     font-size: 23px;
+//     color: #7ea9b3;
+//     width: 200px;
+//     float: left;
+//     font-family: 'Yanone Kaffeesatz',sans-serif; }
+//   .comments {
+//     font-size: 12px;
+//     clear: both;
+//     div.controls {
+//       clear: both;
+//       float: left;
+//       width: 100%;
+//       margin: 3px 0 20px 5px; }
+//     .controls a {
+//       color: #988e4c;
+//       padding: 0 3px 2px 22px;
+//       font-family: Arial;
+//       font-size: 13px;
+//       background: url(../images/comment.png) no-repeat center left;
+//       &:hover {
+//         background-color: #f5f0c9;
+//         text-decoration: none; } }
+//     .button {
+//       color: #988e4c;
+//       font-size: 11px;
+//       padding: 3px;
+//       cursor: pointer; }
+//     a {
+//       background-color: inherit;
+//       color: #1b79bd;
+//       padding: 0; }
+//     form.post-comments {
+//       margin: 3px 26px 0 42px;
+//       textarea {
+//         font-size: 13px;
+//         line-height: 1.3; } }
+//     textarea {
+//       height: 42px;
+//       width: 100%;
+//       margin: 7px 0 5px 1px;
+//       font-family: Arial;
+//       outline: none;
+//       overflow: auto;
+//       font-size: 12px;
+//       line-height: 140%;
+//       padding-left: 2px;
+//       padding-top: 3px;
+//       border: #cce6ec 3px solid; }
+//     input {
+//       margin-left: 10px;
+//       margin-top: 1px;
+//       vertical-align: top;
+//       width: 100px; }
+//     button {
+//       background: url(../images/small-button-blue.png) repeat-x top;
+//       border: 0;
+//       color: #4a757f;
+//       font-family: Arial;
+//       font-size: 13px;
+//       width: 100px;
+//       font-weight: bold;
+//       height: 27px;
+//       line-height: 25px;
+//       margin-bottom: 5px;
+//       cursor: pointer;
+//       border-radius: 4px;
+//       -ms-border-radius: 4px;
+//       -moz-border-radius: 4px;
+//       -webkit-border-radius: 4px;
+//       -khtml-border-radius: 4px;
+//       text-shadow: 0px 1px 0px #e6f6fa;
+//       -moz-text-shadow: 0px 1px 0px #e6f6fa;
+//       -webkit-text-shadow: 0px 1px 0px #e6f6fa;
+//       -webkit-box-shadow: 1px 1px 2px #808080;
+//       -moz-box-shadow: 1px 1px 2px #808080;
+//       box-shadow: 1px 1px 2px #808080;
+//       &:hover {
+//         background: url(../images/small-button-blue.png) bottom repeat-x;
+//         text-shadow: 0px 1px 0px #c6d9dd;
+//         -moz-text-shadow: 0px 1px 0px #c6d9dd;
+//         -webkit-text-shadow: 0px 1px 0px #c6d9dd; } }
+//     .counter {
+//       display: inline-block;
+//       width: 245px;
+//       float: right;
+//       color: #b6a475 !important;
+//       vertical-align: top;
+//       font-family: Arial;
+//       float: right;
+//       text-align: right; }
+//     .comment {
+//       border-bottom: 1px solid #edeeeb;
+//       clear: both;
+//       margin: 0;
+//       margin-top: 8px;
+//       padding-bottom: 4px;
+//       overflow: auto;
+//       font-family: Arial;
+//       font-size: 11px;
+//       min-height: 25px;
+//       background: white url(../images/comment-background.png) bottom repeat-x;
+//       border-radius: 5px;
+//       -ms-border-radius: 5px;
+//       -moz-border-radius: 5px;
+//       -webkit-border-radius: 5px;
+//       -khtml-border-radius: 5px; }
+//     div.comment:hover {
+//       background-color: #efefef; }
+//     a.author {
+//       background-color: inherit;
+//       color: #1b79bd;
+//       padding: 0;
+//       &:hover {
+//         text-decoration: underline; } }
+//     span.delete-icon {
+//       background: url(../images/close-small.png) no-repeat;
+//       border: 0;
+//       width: 14px;
+//       height: 14px;
+//       &:hover {
+//         border: #BC564B 2px solid;
+//         border-radius: 10px;
+//         -ms-border-radius: 10px;
+//         -moz-border-radius: 10px;
+//         -webkit-border-radius: 10px;
+//         -khtml-border-radius: 10px;
+//         margin: -3px 0px 0px -2px; } }
+//     .content {
+//       margin-bottom: 7px; }
+//     .comment-votes {
+//       float: left;
+//       width: 37px;
+//       line-height: 130%;
+//       padding: 6px 5px 6px 3px; }
+//     .comment-body {
+//       line-height: 1.3;
+//       margin: 3px 26px 0 46px;
+//       padding: 5px 3px;
+//       color: #666;
+//       font-size: 13px;
+//       .edit {
+//         padding-left: 6px; }
+//       p {
+//         font-size: 13px;
+//         line-height: 1.3;
+//         margin-bottom: 3px;
+//         padding: 0; } }
+//     .comment-delete {
+//       float: right;
+//       width: 14px;
+//       line-height: 130%;
+//       padding: 8px 6px; }
+//     .upvote {
+//       margin: 0px;
+//       padding-right: 17px;
+//       padding-top: 2px;
+//       text-align: right;
+//       height: 20px;
+//       font-size: 13px;
+//       font-weight: bold;
+//       color: #777;
+//       &.upvoted {
+//         color: #d64000; }
+//       &.hover {
+//         background: url(../images/go-up-grey.png) no-repeat;
+//         background-position: right 1px; }
+//       &:hover {
+//         background: url(../images/go-up-orange.png) no-repeat;
+//         background-position: right 1px; } }
+//     .help-text {
+//       float: right;
+//       text-align: right;
+//       color: gray;
+//       margin-bottom: 0px;
+//       margin-top: 0px;
+//       line-height: 50%; } }
+//   #questionTools {
+//     font-size: 22px;
+//     margin-top: 11px;
+//     text-align: left; }
+//   .question-status {
+//     margin-top: 10px;
+//     margin-bottom: 15px;
+//     padding: 20px;
+//     background-color: #fef7cc;
+//     text-align: center;
+//     border: #e1c04a 1px solid;
+//     h3 {
+//       font-size: 20px;
+//       color: #707070;
+//       font-weight: normal; } }
+//   .vote-buttons {
+//     // float: left;
+//     // text-align: center;
+//     // padding-top: 2px;
+//     // margin: 10px 10px 0px 3px;
+//     IMG {
+//       cursor: pointer; } }
+//   .vote-number {
+//     font-family: 'Yanone Kaffeesatz',sans-serif;
+//     padding: 0px 0 5px 0;
+//     font-size: 25px;
+//     font-weight: bold;
+//     color: #777; }
+//   .vote-buttons .notify-sidebar {
+//     // text-align: left;
+//     // width: 120px;
+//     label {
+//       vertical-align: top; } }
+//   .tabBar-answer {
+//     margin-bottom: 15px;
+//     padding-left: 7px;
+//     width: 723px;
+//     margin-top: 10px; }
+//   .answer .vote-buttons {
+//     // float: left;
+//   }
+//   .accepted-answer {
+//     background-color: #f7fecc;
+//     border-bottom-color: #9BD59B;
+//     // .vote-buttons {
+//     //   width: 27px;
+//     //   margin-right: 10px;
+//     //   margin-top: 10px; } 
+//   }
+//   .answer .post-update-info a {
+//     color: #444444; }
+//   .answered {
+//     background: #CCC;
+//     color: #999; }
+//   .answered-accepted {
+//     background: #DCDCDC;
+//     color: #763333;
+//     strong {
+//       color: #E1E818; } }
+//   .answered-by-owner {
+//     background: #F1F1FF;
+//     .comments {
+//       .button {
+//         background-color: #E6ECFF; }
+//       background-color: #E6ECFF; }
+//     // .vote-buttons {
+//       // margin-right: 10px; }
+//     }
+//   .answer-img-accept:hover {
+//     background: url(../images/vote-accepted-on.png); }
+//   .answer-body {
+//     a {
+//       color: #1b79bd; }
+//     li {
+//       margin-bottom: 0.7em; } }
+//   #fmanswer {
+//     color: #707070;
+//     line-height: 1.2;
+//     margin-top: 10px;
+//     h2 {
+//       font-family: 'Yanone Kaffeesatz',sans-serif;
+//       color: #7ea9b3;
+//       font-size: 24px; }
+//     label {
+//       font-size: 13px; } }
+//   .message {
+//     padding: 5px;
+//     margin: 0px 0 10px 0; } }
 
 @media screen and (-webkit-min-device-pixel-ratio:0) {
   textarea {
@@ -2704,4 +2707,3 @@ pre.prettyprint {
 //     color: #404; }
 //   .atv {
 //     color: #060; } }
-
diff --git a/sass/_base.scss b/sass/_base.scss
index 4df1d6de88..a703cf208e 100644
--- a/sass/_base.scss
+++ b/sass/_base.scss
@@ -2,6 +2,12 @@
   outline-color: #ccc;
 }
 
+h1, h2, h3, h4, h5, h6 {
+  a {
+    color: #000;
+  }
+}
+
 h1 {
   font-size:1.6em;
   margin:20px 0 10px 0;
diff --git a/sass/_discussion-questions.scss b/sass/_discussion-questions.scss
index 73b39f738f..8c7f04871a 100644
--- a/sass/_discussion-questions.scss
+++ b/sass/_discussion-questions.scss
@@ -74,10 +74,6 @@ ul.question-list {
           font-weight: normal;
           margin: 0px 0 15px 0;
           text-transform: none;
-
-          a {
-            color: #000;
-          }
         }
 
         div.user-info {
@@ -158,3 +154,41 @@ div.search-tips {
 .search-result-summary {
 }
 
+div.post-update-info {
+  @include box-sizing(border-box);
+  @include border-radius(5px);
+  background:lighten(#F6EFD4, 5%);
+  padding: 10px;
+
+  a {
+    color:$mit-red ;
+  }
+
+  div.change-date {
+    font-size: 12px;
+    margin-bottom: 10px;
+  }
+
+  div.avatar {
+    display: inline-block;
+    float: left;
+    margin-right: 3px;
+
+    img.gravatar {
+      background: white;
+      border: 1px solid darken(#F6EFD4, 10%);
+      margin-right: 5px;
+      padding: 3px ;
+      vertical-align: bottom;
+    }
+  }
+
+  div.user-meta {
+    display: inline-block;
+    width: 60%;
+
+    span.user-badges {
+      display: block;
+    }
+  }
+}
diff --git a/sass/_discussion-tags.scss b/sass/_discussion-tags.scss
index af4fc11f4a..8dcbb2446e 100644
--- a/sass/_discussion-tags.scss
+++ b/sass/_discussion-tags.scss
@@ -10,13 +10,13 @@ ul.tags {
     display: inline;
     font-size: 12px;
     margin-left: 15px;
-    padding: 5px 10px 5px 5px;
+    padding: 3px 10px 5px 5px;
 
     &:before {
      content:"";
      position:absolute;
      top:0;
-     left:-12px;
+     left:-11px;
      width:0;
      height:0;
      border-color:transparent #eee transparent transparent;
diff --git a/sass/_question-view.scss b/sass/_question-view.scss
new file mode 100644
index 0000000000..1035f156df
--- /dev/null
+++ b/sass/_question-view.scss
@@ -0,0 +1,70 @@
+div.question-header {
+  div.vote-buttons {
+    display: inline-block;
+    float: left;
+    width: flex-grid(1,9);
+    margin-right: flex-gutter(9);
+  }
+
+  div.question-container {
+    display: inline-block;
+    float: left;
+    width: flex-grid(8,9);
+
+    h1 {
+      margin-top: 0;
+    }
+
+    div.meta-bar {
+      border-bottom: 1px solid #eee;
+      display: block;
+      margin: 20px 0 10px;
+      overflow: hidden;
+      padding-bottom: 15px;
+
+
+      div.tag-list {
+        display: inline-block;
+        float:left;
+        width: flex-grid(4,8);
+        margin-right: flex-gutter(8);
+      }
+
+      div.question-actions {
+        display: inline-block;
+        float:left;
+        text-align: right;
+        width: flex-grid(4,8);
+
+        a {
+          color: darken(#F6EFD4, 50%);
+
+          &.question-delete {
+            color: $mit-red;
+          }
+        }
+
+        span.sep {
+          color: darken(#F6EFD4, 10%);
+        }
+      }
+    }
+
+    div.question-content {
+      overflow: hidden;
+
+      div.question-body {
+        display: inline-block;
+        float: left;
+        margin-right: flex-gutter(8);
+        width: flex-grid(6.2,8);
+      }
+
+      div.post-update-info {
+        display: inline-block;
+        float: left;
+        width: flex-grid(1.8,8);
+      }
+    }
+  }
+}
diff --git a/sass/application.scss b/sass/application.scss
index cf57b00093..6d046c2a6a 100644
--- a/sass/application.scss
+++ b/sass/application.scss
@@ -14,7 +14,7 @@
 @import "wiki-basic-html", "wiki-create", "wiki";
 @import "activation";
 @import "help";
-@import "askbot-original", "discussion", "discussion-questions", "discussion-tags" ;
+@import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" ;
 
 // left over
 @import "theme";

From e8311db7a64d83f8885c6a444e9666bf743cf525 Mon Sep 17 00:00:00 2001
From: Piotr Mitros <pmitros@mit.edu>
Date: Mon, 30 Jan 2012 20:23:24 -0500
Subject: [PATCH 06/26] Better text for password change in profile page

---
 profile.html | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/profile.html b/profile.html
index e50efed801..689bffaa38 100644
--- a/profile.html
+++ b/profile.html
@@ -84,8 +84,10 @@ $(function() {
       <!-- <div><a class="modal" href="#change_password_pop">Reset password</a></div> -->
 
       <div id="change_password_pop">
-        <h2>Password reset</h2>
-        <p>We'll e-mail you a password reset link at ${email}. Follow the link in the email to reset your password.</p>
+        <h2>Password change</h2>
+        <p>We'll e-mail you a password reset link at ${email}. Follow
+        the link in the confirmation email to change your
+        password.</p>
 
         <input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" />
         <input type="submit" id="pwd_reset_button" value="Reset Password" />

From 94016f8ba8b719d52e3cd67f2e2dd821b6fa0b53 Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Tue, 31 Jan 2012 09:48:27 -0500
Subject: [PATCH 07/26] Minor edits to the index pages

---
 index.html       | 4 ++--
 marketing.html   | 2 +-
 mitx_global.html | 2 +-
 sass/_index.scss | 4 ++++
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 0f305e8f13..a6b71cbc13 100644
--- a/index.html
+++ b/index.html
@@ -5,7 +5,7 @@
       <section>
         <h1>Circuits &amp; Electronics</h1>
         <h2>6.002x</h2>
-        <a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002 Circuits <span>&amp;</span> Electronics</a>
+        <a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002x Circuits <span>&amp;</span> Electronics</a>
       </section>
       <p>6.002x (Circuits and Electronics) is an experimental on-line adaptation of MIT&rsquo;s first undergraduate analog design course: 6.002. This course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012.</p>
     </section>
@@ -42,7 +42,7 @@
     </section>
 
     <section class="cta">
-      <a class="enroll" rel="leanModal" href="#enroll">Enroll in Circuits &amp; Electronics</a>
+      <a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002x Circuits &amp; Electronics</a>
     </section>
 
   </section>
diff --git a/marketing.html b/marketing.html
index 601aef39aa..a897145379 100644
--- a/marketing.html
+++ b/marketing.html
@@ -72,7 +72,7 @@ function postJSON(url, data, callback) {
 
     <%block name="header_text">
       <section>
-        <h1>MITx</h1>
+        <h1><em>MITx</em></h1>
         <h2>MIT&rsquo;s new online learning initiative</h2>
       </section>
      </%block>
diff --git a/mitx_global.html b/mitx_global.html
index 29fcfdd784..9c5ac92f8e 100644
--- a/mitx_global.html
+++ b/mitx_global.html
@@ -11,7 +11,7 @@
     </section>
 
     <section class="features">
-      <h2><em>MITx</em> courses will be offered on an online learning platform that:</h2>
+      <h2><em>MIT<span>x</span></em> courses will be offered on an online learning platform that:</h2>
 
       <ul>
         <li>organizes and presents course material to enable students to learn worldwide</li>
diff --git a/sass/_index.scss b/sass/_index.scss
index 3718b41ec1..784d9eecef 100644
--- a/sass/_index.scss
+++ b/sass/_index.scss
@@ -247,6 +247,10 @@ section.index-content {
             letter-spacing: 1px;
             color: #666;
             margin-bottom: lh();
+
+            span {
+              text-transform: none;
+            }
           }
 
           p {

From 3d552243d500f0f4d209bff55203cd568995194b Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Tue, 31 Jan 2012 10:23:17 -0500
Subject: [PATCH 08/26] Styled wiki delete button

---
 sass/_wiki-create.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/sass/_wiki-create.scss b/sass/_wiki-create.scss
index 0c26f96c83..d37d739dcc 100644
--- a/sass/_wiki-create.scss
+++ b/sass/_wiki-create.scss
@@ -21,7 +21,12 @@ form#wiki_revision {
   }
 
   #submit_delete {
+    @include box-shadow(none);
+    background: none;
+    border: none;
+    color: #999;
     float: right;
+    text-decoration: underline;
   }
   
   input[type="submit"] {

From 2d3ebff218d5eaa08b2cd62324019eba9ca7015c Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Tue, 31 Jan 2012 14:45:44 -0500
Subject: [PATCH 09/26] IE6 & 7 fixeS

---
 .DS_Store              | Bin 12292 -> 12292 bytes
 marketing.html         |   3 +++
 sass/_index.scss       |   2 +-
 sass/_wiki-create.scss |  28 ++++++++++++++++++----------
 sass/marketing-ie.scss |   9 +++++++++
 simplewiki_edit.html   |   2 +-
 6 files changed, 32 insertions(+), 12 deletions(-)
 create mode 100644 sass/marketing-ie.scss

diff --git a/.DS_Store b/.DS_Store
index a630216fad2b616b683bda11c2b2e6803e0fb4f3..b9a409939207eb86dd2d0e8a5dbb4b906be0aec4 100644
GIT binary patch
delta 106
zcmZokXi3;mEWo&Sa*05)msoYRfsTSnt&T#qk*OJwX=rL}QCrK&$-yb`ghNzG&&DGp
pv8uYJwvGV|7#Sfn122?@Q4O1w1)s2OW|jECviZLZt1uG-0|0Gi7LNb`

delta 82
zcmZokXi3;mEWo&aa*05)jzo2}iII_xf}x37t&T#qg`uI2f~lotZ7nA!2d6+ghp3XC
mjYmjgO>JF$!(>K5dB&#Aih@trHnU57V_`}O-~3mGRTu!|HW&i{

diff --git a/marketing.html b/marketing.html
index a897145379..0a30783e38 100644
--- a/marketing.html
+++ b/marketing.html
@@ -5,6 +5,9 @@
 
   <!--link rel="stylesheet" href="${ settings.LIB_URL }jquery.treeview.css" type="text/css" media="all" /-->
   <link rel="stylesheet" href="/static/css/marketing.css" type="text/css" media="all" />
+  <!--[if lt IE 8]>
+  <link rel="stylesheet" href="/static/css/marketing-ie.css" type="text/css" media="all" />
+  <![endif]-->
 
   <script type="text/javascript" src="${ settings.LIB_URL }jquery-1.6.2.min.js"></script>
   <script type="text/javascript" src="${ settings.LIB_URL }jquery-ui-1.8.16.custom.min.js"></script>
diff --git a/sass/_index.scss b/sass/_index.scss
index 784d9eecef..f1dd89392f 100644
--- a/sass/_index.scss
+++ b/sass/_index.scss
@@ -358,7 +358,7 @@ section.index-content {
 
         &.requirements {
           clear: both;
-          width: auto;
+          width: 100%;
           border-top: 1px solid #E5E5E5;
           padding-top: lh();
           margin-bottom: 0;
diff --git a/sass/_wiki-create.scss b/sass/_wiki-create.scss
index d37d739dcc..e4aad2d4ba 100644
--- a/sass/_wiki-create.scss
+++ b/sass/_wiki-create.scss
@@ -27,6 +27,7 @@ form#wiki_revision {
     color: #999;
     float: right;
     text-decoration: underline;
+    font-weight: normal;
   }
   
   input[type="submit"] {
@@ -37,18 +38,25 @@ form#wiki_revision {
 #wiki_edit_instructions {
   float: left;
   width: flex-grid(3, 9);
+  margin-top: lh();
+  color: #666;
+
+  &:hover {
+    color: #333;
+  }
 
   .markdown-example {
-    background-color: $light-gray;
-    padding-top: 5px;
-    padding-right: 2px;
-    padding-bottom: 5px;
-    padding-left: 5px;
-        
-    margin-top: 5px;
-    margin-bottom: 7px;
-    margin-left: 5px;
-        
+    background-color: #e3e3e3;
+    text-shadow: 0 1px 0 #fff;
+
+    padding: {
+      top: 5px;
+      right: 2px;
+      bottom: 5px;
+      left: 5px;
+    }
+
+    margin: 5px 0 7px;
     line-height: 1.0;
   }
 }
diff --git a/sass/marketing-ie.scss b/sass/marketing-ie.scss
new file mode 100644
index 0000000000..0d1562a88a
--- /dev/null
+++ b/sass/marketing-ie.scss
@@ -0,0 +1,9 @@
+body {
+  margin: 0;
+  padding: 0;
+}
+
+.wrapper, .subpage, section.copyright, section.tos, section.privacy-policy, section.honor-code, header.announcement div, section.index-content, footer {
+  margin: 0;
+  overflow: hidden;
+}
diff --git a/simplewiki_edit.html b/simplewiki_edit.html
index fc5f63d970..7ead7f4abc 100644
--- a/simplewiki_edit.html
+++ b/simplewiki_edit.html
@@ -12,7 +12,7 @@ ${ wiki_article.title }
       <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
   </div>
   ${wiki_form}
-  <input type="submit" id="submit_edit" name="edit" value="Edit article" />
+  <input type="submit" id="submit_edit" name="edit" value="Save Changes" />
   <input type="submit" id="submit_delete" name="delete" value="Delete article" />
 </form>
 

From 91f9c31e1f95028256e8a65eb82ea2ad79241e6e Mon Sep 17 00:00:00 2001
From: aa <none@none>
Date: Tue, 31 Jan 2012 15:21:53 -0500
Subject: [PATCH 10/26] update

---
 index.html       | 7 +------
 mitx_global.html | 2 +-
 2 files changed, 2 insertions(+), 7 deletions(-)

diff --git a/index.html b/index.html
index 8d73c3ad00..269adea744 100644
--- a/index.html
+++ b/index.html
@@ -7,7 +7,7 @@
         <h2>6.002x</h2>
         <a class="enroll" rel="leanModal" href="#enroll">Enroll in 6.002 Circuits <span>&amp;</span> Electronics</a>
       </section>
-      <p> Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris Terman, &ldquo;6.002x Circuits and Electronics&rdquo; is an experimental on-line adaption of MIT's first undergraduate analog design course 6.002. This course will run, free of charge, for students worldwide  from February 21, 2012 through June&nbsp;10,&nbsp;2012.</p>
+      <p> Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, &ldquo;6.002x Circuits and Electronics&rdquo; is an experimental on-line adaption of MIT's first undergraduate analog design course 6.002. This course will run, free of charge, for students worldwide  from February 21, 2012 through June&nbsp;10,&nbsp;2012.</p>
     </section>
 </%block>
 <%block name="header_class">course</%block>
@@ -56,11 +56,6 @@
         <h2>Anant Agarwal</h2>
         <p>The Director of MIT's Computer Science and Artificial Intelligence Laboratory. His research focus is in parallel computer architectures, and he is the founder of several successful startups. Most recently, he founded Tilera, which produces scalable multicore embedded processors. He co-author the course textbook "Foundations of Analog and Digital Electronic Circuits."</p></li>
 
-      <li>
-        <img src="/static/staff/cjt-small.jpg">
-        <h2>Chris Terman</h2>
-        <p>The Co-Director MIT CSAIL, and a highly regarded instructor. He is the author of JSim, an educational package for on-line circuit schematic entry and simulation, and XTutor, and on-line question-and-answer tutoring system.</p></li>
-
       <li>
         <img src="/static/staff/gjs-small.jpg">
         <h2>Gerald Sussman</h2>
diff --git a/mitx_global.html b/mitx_global.html
index 83fc572f2e..7a4b195676 100644
--- a/mitx_global.html
+++ b/mitx_global.html
@@ -36,7 +36,7 @@
       <a href="http://6002x.mitx.mit.edu/" class="more-info">More information <span>&amp;</span> Enroll</a>
     </p>
 
-    <p>Taught by Anant Agarwal, with Gerald Sussman, Piotr Mitros, and Chris Terman, &ldquo;6.002 Circuits and Electronics&rdwuo; is an on-line adaption of MIT's first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from February 21, 2012 through June 10, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
+    <p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, &ldquo;6.002 Circuits and Electronics&rdwuo; is an on-line adaption of MIT's first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from February 21, 2012 through June 10, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
   </section>
 </section>
 <script>

From 0e3c4871870301f5163350761b8f31b02a1f1f15 Mon Sep 17 00:00:00 2001
From: Reda Lemeden <reda@thoughtbot.com>
Date: Tue, 31 Jan 2012 15:57:02 -0500
Subject: [PATCH 11/26] Voting widget skinned

---
 sass/_question-view.scss | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/sass/_question-view.scss b/sass/_question-view.scss
index 1035f156df..4f3cac582f 100644
--- a/sass/_question-view.scss
+++ b/sass/_question-view.scss
@@ -4,6 +4,35 @@ div.question-header {
     float: left;
     width: flex-grid(1,9);
     margin-right: flex-gutter(9);
+
+    ul li {
+      background-position: center;
+      background-repeat: no-repeat;
+      cursor: pointer;
+      font-weight: bold;
+      height: 20px;
+      list-style: none;
+      padding: 10px;
+      text-align: center;
+      width: 25px;
+
+      &.question-img-upvote, &.answer-img-upvote  {
+        background-image: url(/static/images/askbot/vote-arrow-up-new.png);
+        background-color: #F6EFD4;
+
+        &:hover, &.on {
+          background-image: url(/static/images/askbot/vote-arrow-up-on-new.png);
+        }
+      }
+
+      &.question-img-downvote, &.answer-img-downvote  {
+        background-image: url(/static/images/askbot/vote-arrow-down-new.png);
+
+        &:hover, &.on {
+          background-image: url(/static/images/askbot/vote-arrow-down-on-new.png);
+        }
+      }
+    }
   }
 
   div.question-container {
@@ -68,3 +97,5 @@ div.question-header {
     }
   }
 }
+
+

From 8263c2a5870244c1e876db070721d9c9d32079b1 Mon Sep 17 00:00:00 2001
From: Piotr Mitros <pmitros@mit.edu>
Date: Tue, 31 Jan 2012 22:21:51 -0500
Subject: [PATCH 12/26] Fixed name

--HG--
rename : server_down.html => server-down.html
---
 index.html                           | 7 ++++++-
 server_down.html => server-down.html | 0
 2 files changed, 6 insertions(+), 1 deletion(-)
 rename server_down.html => server-down.html (100%)

diff --git a/index.html b/index.html
index 0c815b5a0b..199bffc0c2 100644
--- a/index.html
+++ b/index.html
@@ -38,7 +38,12 @@
 
       <p>In order to succeed in this course, you  must have taken an AP level physics course in electricity and magnetism. You  must know basic calculus and linear algebra and have some background in differential equations. Since more advanced mathematics will not show up until the second half of the course, the first half of the course will include an optional remedial differential equations component for those who need it.</p>
 
-      <p>The course web site was developed and tested primarily with Google Chrome. We support Mozilla Firefox as well. While we will attempt to make it possible to complete the course with Internet Explorer, portions of the web site functionality will be unavailable. The videos require Flash.</p>
+      <p>The course web site was developed and tested primarily with
+      Google Chrome. We support current versions of Mozilla Firefox as
+      well. The videos player is designed to work with Flash. While we
+      provide a non-Flash fallback for the video, as well as partial
+      support for Internet Explorer, other browsers, and tablets,
+      portions of the functionality will be unavailable. </p>
     </section>
 
     <section class="cta">
diff --git a/server_down.html b/server-down.html
similarity index 100%
rename from server_down.html
rename to server-down.html

From f0f259970bdcd8d1c9d02634ef88fdf171cfa0fd Mon Sep 17 00:00:00 2001
From: Piotr Mitros <pmitros@mit.edu>
Date: Tue, 31 Jan 2012 22:51:56 -0500
Subject: [PATCH 13/26] typo

---
 index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 199bffc0c2..d50348bcdd 100644
--- a/index.html
+++ b/index.html
@@ -40,7 +40,7 @@
 
       <p>The course web site was developed and tested primarily with
       Google Chrome. We support current versions of Mozilla Firefox as
-      well. The videos player is designed to work with Flash. While we
+      well. The video player is designed to work with Flash. While we
       provide a non-Flash fallback for the video, as well as partial
       support for Internet Explorer, other browsers, and tablets,
       portions of the functionality will be unavailable. </p>

From 9f093f985c2ad62043ab2ceee83a21eedbf1da2c Mon Sep 17 00:00:00 2001
From: Ernie Park <eipark@mit.edu>
Date: Wed, 1 Feb 2012 11:51:24 -0500
Subject: [PATCH 14/26] update password reset form and change inputs to type
 submit and chmod executable html files

---
 create_account.html                       |  4 +--
 index.html                                |  3 +-
 login.html                                |  4 +--
 marketing.html                            | 35 +++++++++++++++--------
 password_reset_form.html                  |  9 ------
 registration/password_reset_complete.html |  0
 registration/password_reset_confirm.html  |  0
 registration/password_reset_done.html     |  4 ---
 registration/password_reset_email.html    |  0
 registration/password_reset_form.html     |  8 ++++--
 sass/_leanmodal.scss                      |  2 +-
 11 files changed, 35 insertions(+), 34 deletions(-)
 delete mode 100755 password_reset_form.html
 mode change 100755 => 100644 registration/password_reset_complete.html
 mode change 100755 => 100644 registration/password_reset_confirm.html
 mode change 100755 => 100644 registration/password_reset_done.html
 mode change 100755 => 100644 registration/password_reset_email.html
 mode change 100755 => 100644 registration/password_reset_form.html

diff --git a/create_account.html b/create_account.html
index f64ff106d5..dd0ed7f9f9 100644
--- a/create_account.html
+++ b/create_account.html
@@ -2,7 +2,7 @@
 <div name="enroll_form" id="enroll_form">
 
   <h1>Enroll in 6.002 Circuits &amp; Electronics</h1>
-  <form name="login"  method="get">
+  <form name="enroll" id="enroll_form"  method="get">
     <fieldset><% if 'error' in locals(): e = error %>
 
     <div id="enroll_error" name="enroll_error"></div>
@@ -67,6 +67,6 @@
       </li>
 
     </ol>
-    <input name="create_account_button" id="create_account_button" type="button" value="Create Account">
+    <input name="create_account_button" id="create_account_button" type="submit" value="Create Account">
 </fieldset>  </form>
 </div>
diff --git a/index.html b/index.html
index 8d73c3ad00..7b6c327ad4 100644
--- a/index.html
+++ b/index.html
@@ -103,7 +103,8 @@ $(function() {
     /* Handles when the user hits 'enroll'. Grabs form data. Does AJAX.
             Either shows error, or shows success. */
 
-    $('#create_account_button').click(function() {
+    $('form#enroll_form').submit(function(e) {
+      e.preventDefault();
       var submit_data={};
       $.each($("[id^=ca_]"), function(index,value){
         submit_data[value.name]=value.value;
diff --git a/login.html b/login.html
index eea9d7f26a..601df0a4c6 100644
--- a/login.html
+++ b/login.html
@@ -3,7 +3,7 @@ ${ error }
 
 <div id="login_div">
   <h1>Log in to MITx</h1>
-  <form name="login" action="/login" method="get">
+  <form id="login_form" method="post">
     <div id="login_error"></div>
     <ol>
       <li>
@@ -21,7 +21,7 @@ ${ error }
       </li>
 
     </ol>
-    <input name="submit" id="login_button" type="button" value="Log in">
+    <input name="submit" id="login_button" type="submit" value="Log in">
   </form>
 
   <div class="lost-password">
diff --git a/marketing.html b/marketing.html
index c0e9f51590..dc712f008a 100644
--- a/marketing.html
+++ b/marketing.html
@@ -19,11 +19,11 @@
   <script src="/static/js/html5shiv.js"></script>
   <![endif]-->
 
-	<script type="text/javascript">
-		$(function(){
-			$("a[rel*=leanModal]").leanModal();
-		});
-	</script>
+  <script type="text/javascript">
+    $(function(){
+      $("a[rel*=leanModal]").leanModal();
+    });
+  </script>
 
 <%block name="headextra"/>
 
@@ -66,14 +66,15 @@
   </footer>
 
   <div id="login" class="leanModal_box"><%include file="login.html" /></div>
-  <div id="pwd_reset" class="leanModal_box"><%include file="password_reset_form.html" /></div>
+  <div id="pwd_reset" class="leanModal_box"><%include file="registration/password_reset_form.html" /></div>
   <div id="reset_done" class="leanModal_box"></div>
 
 <script>
 $(document).ready(function(){
     /* Handles when the user tries to log in. Grabs form data. Does AJAX.
        Either shows error, or redirects. */
-  $('#login_button').click(function() {
+  $('form#login_form').submit(function(e) {
+    e.preventDefault();
     var submit_data={};
     $.each($("[id^=li_]"), function(index,value){
       submit_data[value.name]=value.value;
@@ -92,11 +93,21 @@ $(document).ready(function(){
     );
   });
 
-  $('#pwd_reset_button').click(function() {
-    $.post('/password_reset/',{ "csrfmiddlewaretoken" : "${ csrf }",
-      "email"  : $('#id_email').val()}, function(data){
-        $('#pwd_reset').html(data);
-    });
+
+  $('form#pwd_reset_form').submit(function(e) {
+    e.preventDefault();
+    var submit_data = {};
+    submit_data['email'] = $('#id_email').val();
+    postJSON('/password_reset/',
+      submit_data,
+      function(json){
+        if (json.success) {
+          $('#pwd_reset').html(json.value);
+        } else {
+          $('#pwd_error').html(json.error);
+        }
+      }
+    );
   });
 
 });
diff --git a/password_reset_form.html b/password_reset_form.html
deleted file mode 100755
index 5c5aaf7853..0000000000
--- a/password_reset_form.html
+++ /dev/null
@@ -1,9 +0,0 @@
-<h1>Password reset</h1>
-
-<p>Forgotten your password? Enter your e-mail address below, and we'll e-mail instructions for setting a new one.</p>
-
-<form action="/password_reset/" method="post">
-  <input type='hidden' name='csrfmiddlewaretoken' value='${ csrf }' />
-  <label for="id_email">E-mail address:</label>
-  <input id="id_email" type="email" name="email" maxlength="75" /> <input type="button" id="pwd_reset_button" value="Reset my password" />
-</form>
diff --git a/registration/password_reset_complete.html b/registration/password_reset_complete.html
old mode 100755
new mode 100644
diff --git a/registration/password_reset_confirm.html b/registration/password_reset_confirm.html
old mode 100755
new mode 100644
diff --git a/registration/password_reset_done.html b/registration/password_reset_done.html
old mode 100755
new mode 100644
index c4cffde474..f47a520e0a
--- a/registration/password_reset_done.html
+++ b/registration/password_reset_done.html
@@ -1,7 +1,3 @@
-{% block content %}
-
 <h1>Password reset successful</h1>
 
 <p>We've e-mailed you instructions for setting your password to the e-mail address you submitted. You should be receiving it shortly.</p>
-
-{% endblock %}
diff --git a/registration/password_reset_email.html b/registration/password_reset_email.html
old mode 100755
new mode 100644
diff --git a/registration/password_reset_form.html b/registration/password_reset_form.html
old mode 100755
new mode 100644
index 4d73ff8c3a..31464d833e
--- a/registration/password_reset_form.html
+++ b/registration/password_reset_form.html
@@ -2,7 +2,9 @@
 
 <p>Forgotten your password? Enter your e-mail address below, and we'll e-mail instructions for setting a new one.</p>
 
-<form action="" method="post">{% csrf_token %}
-{{ form.email.errors }}
-<p><label for="id_email">E-mail address:</label> {{ form.email }} <input type="submit" value="Reset my password" /></p>
+<form id="pwd_reset_form">
+  <div id="pwd_error"></div>
+  <label for="id_email">E-mail address:</label>
+  <input id="id_email" type="email" name="email" maxlength="75" />
+  <input type="submit" id="pwd_reset_button" value="Reset my password" />
 </form>
diff --git a/sass/_leanmodal.scss b/sass/_leanmodal.scss
index 04d4f09701..bdd1a9bb22 100644
--- a/sass/_leanmodal.scss
+++ b/sass/_leanmodal.scss
@@ -93,7 +93,7 @@ div.leanModal_box {
       }
     }
 
-    input[type="button"] {
+    input[type="button"], input[type="submit"] {
       @include button($mit-red);
       font-size: 18px;
       padding: lh(.5);

From a0db591b88d546386e3c38cce0e1afb2e3cd063b Mon Sep 17 00:00:00 2001
From: Ernie Park <eipark@mit.edu>
Date: Wed, 1 Feb 2012 11:58:23 -0500
Subject: [PATCH 15/26] move password_reset_form out of registration

--HG--
rename : registration/password_reset_form.html => password_reset_form.html
---
 marketing.html                                                  | 2 +-
 .../password_reset_form.html => password_reset_form.html        | 0
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename registration/password_reset_form.html => password_reset_form.html (100%)

diff --git a/marketing.html b/marketing.html
index dc712f008a..117eb827b3 100644
--- a/marketing.html
+++ b/marketing.html
@@ -66,7 +66,7 @@
   </footer>
 
   <div id="login" class="leanModal_box"><%include file="login.html" /></div>
-  <div id="pwd_reset" class="leanModal_box"><%include file="registration/password_reset_form.html" /></div>
+  <div id="pwd_reset" class="leanModal_box"><%include file="password_reset_form.html" /></div>
   <div id="reset_done" class="leanModal_box"></div>
 
 <script>
diff --git a/registration/password_reset_form.html b/password_reset_form.html
similarity index 100%
rename from registration/password_reset_form.html
rename to password_reset_form.html

From 4ad4663efe7df87d27a5499c80f96e795f1aac45 Mon Sep 17 00:00:00 2001
From: Ernie Park <eipark@mit.edu>
Date: Wed, 1 Feb 2012 13:40:04 -0500
Subject: [PATCH 16/26] use leanmodal from static rather than 3rdParty

---
 main.html      | 2 +-
 marketing.html | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/main.html b/main.html
index a3bc73e1a6..1004f27740 100644
--- a/main.html
+++ b/main.html
@@ -12,7 +12,7 @@
   <script type="text/javascript" src="${ settings.LIB_URL }jquery-ui-1.8.16.custom.min.js"></script>
   <script type="text/javascript" src="${ settings.LIB_URL }swfobject/swfobject.js"></script>
   <script type="text/javascript" src="${ settings.LIB_URL }jquery.treeview.js"></script>
-  <script type="text/javascript" src="${ settings.LIB_URL }jquery.leanModal.min.js"></script>
+  <script type="text/javascript" src="/static/js/jquery.leanModal.min.js"></script>
   <script type="text/javascript" src="/static/js/video_player.js"></script>
   <script type="text/javascript" src="/static/js/schematic.js"></script>
   <script type="text/javascript" src="/static/js/cktsim.js"></script>
diff --git a/marketing.html b/marketing.html
index 8ce05d3c62..7daac63ba8 100644
--- a/marketing.html
+++ b/marketing.html
@@ -12,7 +12,7 @@
   <script type="text/javascript" src="${ settings.LIB_URL }jquery-1.6.2.min.js"></script>
   <script type="text/javascript" src="${ settings.LIB_URL }jquery-ui-1.8.16.custom.min.js"></script>
 
-  <script type="text/javascript" src="${ settings.LIB_URL }jquery.leanModal.min.js"></script>
+  <script type="text/javascript" src="/static/js/jquery.leanModal.min.js"></script>
   <!--script type="text/javascript" src="${ settings.LIB_URL }swfobject/swfobject.js"></script-->
   <!--script type="text/javascript" src="${ settings.LIB_URL }jquery.treeview.js"></script-->
   <!--script type="text/javascript" src="/static/js/video_player.js"></script-->

From 02ca97a32c06ab2c06578cf5f9774093963293d9 Mon Sep 17 00:00:00 2001
From: cjt <none@none>
Date: Wed, 1 Feb 2012 14:15:21 -0500
Subject: [PATCH 17/26] tutorial html

---
 schematic_tutorial.html | 1 +
 1 file changed, 1 insertion(+)
 create mode 120000 schematic_tutorial.html

diff --git a/schematic_tutorial.html b/schematic_tutorial.html
new file mode 120000
index 0000000000..da681ac006
--- /dev/null
+++ b/schematic_tutorial.html
@@ -0,0 +1 @@
+../data/problems/schematic_tutorial.html
\ No newline at end of file

From ec548fda0a6550b8cbc19a1789a4e8e7ee8f3f77 Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Wed, 1 Feb 2012 16:50:50 -0500
Subject: [PATCH 18/26] Added style for sequence nav and reworked courseware
 problems

---
 homework.html                      |   1 +
 problem.html                       |  14 +-
 problem_ajax.html                  |   2 +-
 sass/_base-extends.scss            |   5 +-
 sass/_base.scss                    |   8 ++
 sass/_courseware-sequence-nav.scss | 142 ++++++++++++++++++++
 sass/_courseware-video.scss        |   5 +-
 sass/_courseware.scss              | 205 ++++++++++++-----------------
 sass/_layout.scss                  |  21 +--
 sass/_theme.scss                   |   8 --
 sass/application.scss              |   6 +-
 schematicinput.html                |  30 +++--
 seq_module.html                    |  19 +--
 textinput.html                     |  28 ++--
 video.html                         |   4 +-
 15 files changed, 315 insertions(+), 183 deletions(-)
 create mode 100644 sass/_courseware-sequence-nav.scss

diff --git a/homework.html b/homework.html
index 4aae9095e8..058f513280 100644
--- a/homework.html
+++ b/homework.html
@@ -4,6 +4,7 @@
 % for problem in homework['problems']:
   <li>
     <h2>${ problem['name'] }</h2>
+
     ${ problem['html'] }
 
     <section>
diff --git a/problem.html b/problem.html
index 67d74cedc8..965f5a9c38 100644
--- a/problem.html
+++ b/problem.html
@@ -1,23 +1,25 @@
 <h2>${ problem['name'] }</h2>
 
-  <p> ${ problem['html'] } </p>
+<section class="problem">
+  ${ problem['html'] }
 
   <section class="action">
     <input type="hidden" name="problem_id" value="${ problem['name'] }">
 
     % if check_button:
-      <input id="check_${ id }" type="button" value="Check ${ attempts }" >
+    <input id="check_${ id }" type="button" value="Check ${ attempts }" >
     % endif
     % if reset_button:
-      <input id="reset_${ id }" type="button" value="Reset ${ attempts }" >
+    <input id="reset_${ id }" type="button" value="Reset ${ attempts }" >
     % endif
     % if save_button:
-      <input id="save_${ id }" type="button" value="Save" >
+    <input id="save_${ id }" type="button" value="Save" >
     % endif
     % if answer_available:
-      <input id="show_${ id }" type="button" value="Show Answer" >
+    <input id="show_${ id }" type="button" value="Show Answer" >
     % endif
     % if explain :
-      <a href="/courseware/6.002_Spring_2012/${ explain }" class="new-page">Explanation</a>
+    <a href="/courseware/6.002_Spring_2012/${ explain }" class="new-page">Explanation</a>
     % endif
   </section>
+</section>
diff --git a/problem_ajax.html b/problem_ajax.html
index fb8a98c765..7296b362ad 100644
--- a/problem_ajax.html
+++ b/problem_ajax.html
@@ -1 +1 @@
-<div id="main_${id}"></div>
+<section id="main_${id}" class="problems-wrapper"></section>
diff --git a/sass/_base-extends.scss b/sass/_base-extends.scss
index de1f917fca..c8c5e4b687 100644
--- a/sass/_base-extends.scss
+++ b/sass/_base-extends.scss
@@ -39,6 +39,7 @@
 
 .content {
   @include box-sizing(border-box);
+  @include box-shadow(inset 0 0 2px 3px #f3f3f3);
   display: table-cell;
   padding: lh();
   vertical-align: top;
@@ -46,8 +47,9 @@
 }
 
 .sidebar {
-  @include box-shadow( inset -1px 0 0 #f6f6f6);
+  @include box-shadow( inset 0 0 0 1px #f6f6f6);
   @include box-sizing(border-box);
+  @include border-radius(4px 0 0 4px);
   background: #e3e3e3;
   border-right: 1px solid #d3d3d3;
   display: table-cell;
@@ -106,6 +108,7 @@
   margin: (-$body-line-height) (-$body-line-height) $body-line-height;
   font-size: 12px;
   text-shadow: 0 1px 0 #fff;
+  @include box-shadow(inset 0 1px 0 #fff, inset 1px 0 0 #fff);
   @extend .clearfix;
 
   a {
diff --git a/sass/_base.scss b/sass/_base.scss
index a703cf208e..f0e86c7624 100644
--- a/sass/_base.scss
+++ b/sass/_base.scss
@@ -41,6 +41,14 @@ em {
   }
 }
 
+a:link, a:visited {
+  text-decoration:none;
+}
+
+a:hover {
+  text-decoration:underline;
+}
+
 input[type="submit"], input[type="button"], button {
   @extend .button;
 }
diff --git a/sass/_courseware-sequence-nav.scss b/sass/_courseware-sequence-nav.scss
new file mode 100644
index 0000000000..5a7b971fe2
--- /dev/null
+++ b/sass/_courseware-sequence-nav.scss
@@ -0,0 +1,142 @@
+nav.sequence-nav {
+  @extend .topbar;
+  margin-bottom: $body-line-height;
+
+  ol {
+    a {
+      @extend .block-link;
+    }
+
+    .inactive {
+      background-repeat: no-repeat;
+
+      &:hover {
+        background-color: lighten(#F6EFD4, 3%);
+      }
+    }
+
+    .visited {
+      background-color: shade(#F6EFD4, 10%);
+      background-repeat: no-repeat;
+      border-color: shade(#F6EFD4, 10%);
+
+      &:hover {
+        background-color: #F6EFD4;
+      }
+    }
+
+    .active {
+      // @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
+      @include box-shadow(0 1px 0 #fff);
+      background-color: #fff;
+      background-repeat: no-repeat;
+
+      &:hover {
+        background-color: #fff;
+      }
+    }
+
+    li {
+      border: none;
+      border-right: 1px solid darken(#F6EFD4, 10%);
+      @include box-shadow(1px 0 0 #fff);
+      cursor: pointer;
+      display: table-cell;
+      padding: lh(.75);
+      float: left;
+      width: 18px;
+
+      //problem
+      // &.seq_problem_inactive {
+      //   width: 14px;
+      //   background: url('/static/images/problem-icon.png') 13px 13px no-repeat;
+        // @extend .inactive;
+      // }
+
+      // &.seq_problem_visited {
+      //   width: 14px;
+      //   background: shade(#F6EFD4, 4%) url('/static/images/problem-icon.png') -57px 13px no-repeat;
+      //   &:hover {
+      //     background-color: #F6EFD4;
+      //   }
+      // }
+
+      // &.seq_problem_active {
+      //   width: 14px;
+      //   background: #FFFBEB url('/static/images/problem-icon.png') -22px 13px no-repeat;
+      //   @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
+
+      //   &:hover {
+      //     background-color: #F6EFD4;
+      //   }
+      // }
+
+      //video
+      &.seq_video_inactive {
+        @extend .inactive;
+        background-image: url('/static/images/video-icon.png');
+        background-position: 13px 15px;
+      }
+
+      &.seq_video_visited {
+        @extend .visited;
+        background-image: url('/static/images/video-icon.png');
+        background-position: -81px 15px;
+      }
+
+      &.seq_video_active {
+        @extend .active;
+        background-image: url('/static/images/video-icon.png');
+        background-position: -32px 15px;
+      }
+
+      //vertical
+      &.seq_vertical_inactive, &.seq_problem_inactive {
+        background-image: url('/static/images/vertical-icon.png');
+        background-position: -82px 15px;
+        @extend .inactive;
+      }
+
+      &.seq_vertical_visited, &.seq_problem_visited {
+        background-image: url('/static/images/vertical-icon.png');
+        background-position: 13px 15px;
+        @extend .visited;
+      }
+
+      &.seq_vertical_active, &.seq_problem_active {
+        background-image: url('/static/images/vertical-icon.png');
+        background-position: -35px 15px;
+        @extend .active;
+      }
+
+    }
+  }
+
+  ul {
+    float: right;
+    margin-right: 1px;
+
+    li {
+      float: left;
+
+      &.prev, &.next {
+        @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
+        background: darken(#F6EFD4, 5%);
+        border-left: 1px solid darken(#f6efd4, 20%);
+        color: darken(#F6EFD4, 80%);
+        float: right;
+        letter-spacing: 1px;
+        padding: lh(.75);
+        text-transform: uppercase;
+        cursor: pointer;
+
+        &:hover {
+          text-decoration: none;
+          color: darken(#F6EFD4, 60%);
+          text-decoration: none;
+          background: none;
+        }
+      }
+    }
+  }
+}
diff --git a/sass/_courseware-video.scss b/sass/_courseware-video.scss
index 389c23c370..f8067e703c 100644
--- a/sass/_courseware-video.scss
+++ b/sass/_courseware-video.scss
@@ -132,7 +132,9 @@ section.course-content {
           font-weight: bold;
 
           span {
+            @include inline-block();
             cursor: pointer;
+            margin-bottom: 0;
 
             &:hover {
               color: $mit-red;
@@ -146,7 +148,8 @@ section.course-content {
   ol.subtitles {
     float: left;
     width: flex-grid(3, 9);
-    min-height: 570px;
+    height: 530px;
+    overflow: hidden;
 
     li {
       margin-bottom: 0px;
diff --git a/sass/_courseware.scss b/sass/_courseware.scss
index 3c59e6e0c8..aae17b46fd 100644
--- a/sass/_courseware.scss
+++ b/sass/_courseware.scss
@@ -86,146 +86,115 @@ div.course-wrapper {
   section.course-content {
     @extend .content;
 
-    ol.vert-mod {
-     > li {
-        @extend .clearfix;
-        border-bottom: 1px solid #eee;
-        padding: 15px 0;
+    p {
+      margin-bottom: lh();
 
-        &:last-child {
-          border-bottom: none;
-        }
-
-        h2 {
-          margin-top: 0;
-          margin-bottom: 15px;
-        }
-
-        input[type="text"] {
-          display: inline-block;
-          margin: 8px 4px 4px 10px;
-        }
+      &:empty {
+        display: none;
+        margin-bottom: 0;
       }
     }
 
-    ol.sequence-nav {
-      margin-bottom: $body-line-height;
-      @extend .topbar;
+    .problem-set {
+      position: relative;
+      @extend .clearfix;
 
-      a {
-        @extend .block-link;
+      h2 {
+        margin-top: 0;
+        margin-bottom: 15px;
+        width: flex-grid(2, 9);
+        padding-right: flex-gutter(9);
+        border-right: 1px dotted #ccc;
+        @include box-sizing(border-box);
+        display: table-cell;
+        vertical-align: top;
+
+        @media screen and (max-width:910px) {
+          display: block;
+          width: auto;
+        }
       }
 
-      li {
-        border: none;
-        cursor: pointer;
+      section.problem {
         display: table-cell;
-        padding: lh(.75);
-        float: left;
+        width: flex-grid(7, 9);
+        padding-left: flex-gutter(9);
 
-        //problem
-        &.seq_problem_inactive {
-          width: 14px;
-          background: url('/static/images/problem-icon.png') 13px 13px no-repeat;
-          @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
-
-          &:hover {
-            background-color: lighten(#F6EFD4, 3%);
-          }
+        @media screen and (max-width:910px) {
+          display: block;
+          width: auto;
         }
 
-        &.seq_problem_visited {
-          width: 14px;
-          background: shade(#F6EFD4, 4%) url('/static/images/problem-icon.png') -57px 13px no-repeat;
-          &:hover {
-            background-color: #F6EFD4;
+        span {
+          &.unanswered {
+            @include inline-block();
+            background: url('/static/images/unanswered-icon.png') center center no-repeat;
+            height: 14px;
+            position: relative;
+            top: 4px;
+            width: 14px;
+          }
+
+          &.correct {
+            @include inline-block();
+            background: url('/static/images/correct-icon.png') center center no-repeat;
+            height: 20px;
+            position: relative;
+            top: 6px;
+            width: 25px;
+          }
+
+          &.incorrect {
+            @include inline-block();
+            background: url('/static/images/incorrect-icon.png') center center no-repeat;
+            height: 20px;
+            width: 20px;
+            position: relative;
+            top: 6px;
           }
         }
+      }
 
-        &.seq_problem_active {
-          width: 14px;
-          background: #FFFBEB url('/static/images/problem-icon.png') -22px 13px no-repeat;
-          @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
-
-          &:hover {
-            background-color: #F6EFD4;
-          }
+      div {
+        > span {
+          display: block;
+          margin-bottom: lh(.5);
         }
+      }
 
-        //video
-        &.seq_video_inactive {
-          width: 14px;
-          background: url('/static/images/video-icon.png') 13px 15px no-repeat;
-          @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
+      input[type="text"] {
+        display: inline-block;
+      }
 
-          &:hover {
-            background-color: lighten(#F6EFD4, 3%);
-          }
-        }
+      center {
+        display: block;
+        margin: lh() 0;
+        border: 1px solid #ccc;
+        padding: lh();
+      }
 
-        &.seq_video_visited {
-          width: 14px;
-          background: shade(#F6EFD4, 4%) url('/static/images/video-icon.png') -81px 15px no-repeat;
-          &:hover {
-            background-color: #F6EFD4;
-          }
-        }
-
-        &.seq_video_active {
-          width: 14px;
-          background: #FFFBEB url('/static/images/video-icon.png') -32px 15px no-repeat;
-          @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%),inset 1px 0 0 darken(#F6EFD4, 20%));
-          &:hover {
-            background-color: #F6EFD4;
-          }
-        }
+      section.action {
+        margin-top: lh();
+      }
+    }
 
 
-        //vertical
-        &.seq_vertical_inactive {
-          width: 14px;
-          background: url('/static/images/vertical-icon.png') -82px 15px no-repeat;
-          @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 10%));
+    section.problems-wrapper, div#seq_content {
+      @extend .problem-set;
+    }
 
-          &:hover {
-            background-color: lighten(#F6EFD4, 3%);
-          }
-        }
+    ol.vert-mod {
+     > li {
+        @extend .clearfix;
+        @extend .problem-set;
+        border-bottom: 1px solid #ddd;
+        margin-bottom: 15px;
+        padding: 0 0 15px;
 
-        &.seq_vertical_visited {
-          width: 14px;
-          background: shade(#F6EFD4, 4%) url('/static/images/vertical-icon.png') 13px 15px no-repeat;
-          &:hover {
-            background-color: #F6EFD4;
-          }
-        }
-
-        &.seq_vertical_active {
-          width: 14px;
-          background: #FFFBEB url('/static/images/vertical-icon.png') -35px 15px no-repeat;
-          @include box-shadow(inset -1px 0 0 darken(#F6EFD4, 20%), inset 1px 0 0 darken(#F6EFD4, 20%));
-
-          &:hover {
-            background-color: #F6EFD4;
-          }
-        }
-
-        &.prev, &.next {
-          @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
-          background: darken(#F6EFD4, 5%);
-          border-left: 1px solid darken(#f6efd4, 20%);
-          color: darken(#F6EFD4, 80%);
-          float: right;
-          letter-spacing: 1px;
-          padding: lh(.75);
-          text-transform: uppercase;
-
-          &:hover {
-            text-decoration: none;
-            color: darken(#F6EFD4, 60%);
-            text-decoration: none;
-            background: none;
-          }
+        &:last-child {
+          border-bottom: none;
+          margin-bottom: 0;
+          padding-bottom: 0;
         }
       }
     }
diff --git a/sass/_layout.scss b/sass/_layout.scss
index 2614e3b56c..8867ef5348 100644
--- a/sass/_layout.scss
+++ b/sass/_layout.scss
@@ -6,7 +6,7 @@ html {
     font: $body-font-size $body-font-family;
     text-align: center;
     margin: 0;
-    background: #f6f6f6;
+    background: #f4f4f4; //#f3f1e5
 
     div.header-wrapper {
       // @include linear-gradient(lighten($mit-red, 5%), darken($mit-red, 5%));
@@ -28,7 +28,7 @@ html {
           font-size: 20px;
           font-weight: 800;
           margin: 0 lh() 0 0;
-          padding: 17px lh() 17px 0;
+          padding: 17px lh() 14px 0;
           text-shadow: 0 1px 0 lighten($mit-red, 10%);
           line-height: lh();
         }
@@ -44,16 +44,16 @@ html {
           h2 {
             float: left;
             margin: 0 lh() 0 0;
-            padding: 19px lh() 12px 0;
+            padding: 19px lh() 9px 0;
             line-height: lh();
             border-right: 1px solid darken($mit-red, 5%);
 
             a {
               color: #fff;
+              text-decoration: none;
 
               &:hover {
                 color: rgba(#fff, .7);
-                text-decoration: none;
               }
             }
           }
@@ -61,7 +61,7 @@ html {
           ul {
             @extend .clearfix;
             display: inline-block;
-            padding: 19px 0 12px;
+            padding: 19px 0 9px;
             margin: 0;
 
             li {
@@ -72,6 +72,7 @@ html {
 
               a {
                 color: #fff;
+                text-decoration: none;
 
                 &:hover {
                   color: rgba(#fff, .7);
@@ -88,15 +89,17 @@ html {
     section.main-content {
       @extend .clearfix;
       @extend .wrapper;
-      @include box-shadow(0 0 4px #ddd);
       @include box-sizing(border-box);
+      @include border-radius(4px);
+      overflow: hidden;
       background: #fff;
       border-bottom: 1px solid #bbb;
 
       @media screen and (min-width: 1400px) {
-      margin-top: lh(.5);
-      @include border-radius(3px);
-      border: 1px solid #bbb;
+        // @include border-radius(3px);
+        @include box-shadow(0 0 4px #dfdfdf);
+        border: 1px solid #bbb;
+        margin-top: lh(.5);
       }
     }
 
diff --git a/sass/_theme.scss b/sass/_theme.scss
index 276bb6a694..31e45ae734 100644
--- a/sass/_theme.scss
+++ b/sass/_theme.scss
@@ -37,14 +37,6 @@ h3 {
   clear:both;
 }
 
-a:link, a:visited {
-  text-decoration:none;
-}
-
-a:hover {
-  text-decoration:underline;
-}
-
 #wrapper {
 	background: transparent url( images/css/page-vbg.jpg ) repeat-y scroll 50% 0px;
 	margin:0 auto ;
diff --git a/sass/application.scss b/sass/application.scss
index 6d046c2a6a..ad0298d720 100644
--- a/sass/application.scss
+++ b/sass/application.scss
@@ -8,7 +8,7 @@
 @import "leanmodal";
 
 // pages
-@import "courseware", "courseware-video";
+@import "courseware", "courseware-video", "courseware-sequence-nav";
 @import "textbook";
 @import "profile";
 @import "wiki-basic-html", "wiki-create", "wiki";
@@ -17,5 +17,5 @@
 @import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" ;
 
 // left over
-@import "theme";
-@import "local";
+// @import "theme";
+// @import "local";
diff --git a/schematicinput.html b/schematicinput.html
index 8c7f7e0c83..3290de3b44 100644
--- a/schematicinput.html
+++ b/schematicinput.html
@@ -1,19 +1,23 @@
 <span>
-<input type="hidden" class="schematic" height="${height}" width="${width}" parts="${parts}" analyses="${analyses}" name="input_${id}" id="input_${id}" value="" initial_value=""/>
-<div id="value_${id}" style="display:none">${value}</div>
-<div id="initial_value_${id}" style="display:none">${initial_value}</div>
-<script>
-$("#input_${id}").attr("value",$("#value_${id}").text());
-$("#input_${id}").attr("initial_value",$("#initial_value_${id}").text());
-</script>
-<span id="answer_${id}"></span>
-% if state == 'unsubmitted':
+  <input type="hidden" class="schematic" height="${height}" width="${width}" parts="${parts}" analyses="${analyses}" name="input_${id}" id="input_${id}" value="" initial_value=""/>
+
+  <div id="value_${id}" style="display:none">${value}</div>
+  <div id="initial_value_${id}" style="display:none">${initial_value}</div>
+
+  <script>
+    $("#input_${id}").attr("value",$("#value_${id}").text());
+    $("#input_${id}").attr("initial_value",$("#initial_value_${id}").text());
+  </script>
+
+  <span id="answer_${id}"></span>
+  % if state == 'unsubmitted':
   <span class="ui-icon ui-icon-bullet" style="display:inline-block;" id="status_${id}"></span>
-% elif state == 'correct': 
+  % elif state == 'correct': 
   <span class="ui-icon ui-icon-check" style="display:inline-block;" id="status_${id}"></span>
-% elif state == 'incorrect':
+  % elif state == 'incorrect':
   <span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span>
-% elif state == 'incomplete':
+  % elif state == 'incomplete':
   <span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span>
-% endif
+  % endif
 </span>
+
diff --git a/seq_module.html b/seq_module.html
index 6608344e2f..b011815e68 100644
--- a/seq_module.html
+++ b/seq_module.html
@@ -1,12 +1,15 @@
-<ol class="sequence-nav">
+<nav class="sequence-nav">
+  <ol>
+    % for t in range(1,1+len(items)):
+    <li class="seq_inactive" id="tt_${ t }">&nbsp;</li>
+    % endfor
+  </ol>
 
-  % for t in range(1,1+len(items)):
-  <li class="seq_inactive" id="tt_${ t }">&nbsp;</li>
-  % endfor
-
-  <li id="${ id }next" class="next">Next</li>
-  <li id="${ id }prev" class="prev">Previous</li>
-</ol>
+  <ul>
+    <li id="${ id }next" class="next">Next</li>
+    <li id="${ id }prev" class="prev">Previous</li>
+  </ul>
+</nav>
 
 
 <!-- <td colspan=${ len(items) }> -->
diff --git a/textinput.html b/textinput.html
index fbe9090df8..1473eadbf2 100644
--- a/textinput.html
+++ b/textinput.html
@@ -1,13 +1,15 @@
-<span>
-<input type="text" name="input_${id}" id="input_${id}" value="${value}" />
-<span id="answer_${id}"></span>
-% if state == 'unsubmitted':
-  <span class="ui-icon ui-icon-bullet" style="display:inline-block;" id="status_${id}"></span>
-% elif state == 'correct': 
-  <span class="ui-icon ui-icon-check" style="display:inline-block;" id="status_${id}"></span>
-% elif state == 'incorrect':
-  <span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span>
-% elif state == 'incomplete':
-  <span class="ui-icon ui-icon-close" style="display:inline-block;" id="status_${id}"></span>
-% endif
-</span>
+<section class="text-input">
+  <input type="text" name="input_${id}" id="input_${id}" value="${value}" />
+
+  <span id="answer_${id}"></span>
+
+  % if state == 'unsubmitted':
+  <span class="unanswered" style="display:inline-block;" id="status_${id}"></span>
+  % elif state == 'correct': 
+  <span class="correct" id="status_${id}"></span>
+  % elif state == 'incorrect':
+  <span class="incorrect" id="status_${id}"></span>
+  % elif state == 'incomplete':
+  <span class="incorrect" id="status_${id}"></span>
+  % endif
+</section>
diff --git a/video.html b/video.html
index 7e13c80974..d32bbfb49c 100644
--- a/video.html
+++ b/video.html
@@ -27,7 +27,7 @@
 </div>
 
 <ol class="subtitles">
-  <li id="stt_n5"><div id="std_n7" onclick="title_seek(-7);"></div></li>
+  <!-- <li id="stt_n5"><div id="std_n7" onclick="title_seek(-7);"></div></li> -->
   <li id="stt_n4"><div id="std_n6" onclick="title_seek(-6);"></div></li>
   <li id="stt_n4"><div id="std_n5" onclick="title_seek(-5);"></div></li>
   <li id="stt_n4"><div id="std_n4" onclick="title_seek(-4);"></div></li>
@@ -42,5 +42,5 @@
   <li id="stt_p5"><div id="std_p5" onclick="title_seek( 5);"></div></li>
   <li id="stt_p6"><div id="std_p7" onclick="title_seek( 6);"></div></li>
   <li id="stt_p6"><div id="std_p7" onclick="title_seek( 7);"></div></li>
-  <li id="stt_p6"><div id="std_p7" onclick="title_seek( 8);"></div></li>
+  <!-- <li id="stt_p6"><div id="std_p7" onclick="title_seek( 8);"></div></li> -->
 </ol>

From 5db3d4c5aa1dfafba72ae61da40b2af3105e64a7 Mon Sep 17 00:00:00 2001
From: Reda Lemeden <reda@thoughtbot.com>
Date: Wed, 1 Feb 2012 18:08:27 -0500
Subject: [PATCH 19/26] Re-skinned the top part of the question view

---
 sass/_discussion-questions.scss |  39 -------
 sass/_question-view.scss        | 176 +++++++++++++++++++++++++++-----
 2 files changed, 150 insertions(+), 65 deletions(-)

diff --git a/sass/_discussion-questions.scss b/sass/_discussion-questions.scss
index 8c7f04871a..18a4575aa6 100644
--- a/sass/_discussion-questions.scss
+++ b/sass/_discussion-questions.scss
@@ -153,42 +153,3 @@ div.search-tips {
 
 .search-result-summary {
 }
-
-div.post-update-info {
-  @include box-sizing(border-box);
-  @include border-radius(5px);
-  background:lighten(#F6EFD4, 5%);
-  padding: 10px;
-
-  a {
-    color:$mit-red ;
-  }
-
-  div.change-date {
-    font-size: 12px;
-    margin-bottom: 10px;
-  }
-
-  div.avatar {
-    display: inline-block;
-    float: left;
-    margin-right: 3px;
-
-    img.gravatar {
-      background: white;
-      border: 1px solid darken(#F6EFD4, 10%);
-      margin-right: 5px;
-      padding: 3px ;
-      vertical-align: bottom;
-    }
-  }
-
-  div.user-meta {
-    display: inline-block;
-    width: 60%;
-
-    span.user-badges {
-      display: block;
-    }
-  }
-}
diff --git a/sass/_question-view.scss b/sass/_question-view.scss
index 4f3cac582f..abbc16669f 100644
--- a/sass/_question-view.scss
+++ b/sass/_question-view.scss
@@ -2,34 +2,40 @@ div.question-header {
   div.vote-buttons {
     display: inline-block;
     float: left;
-    width: flex-grid(1,9);
     margin-right: flex-gutter(9);
+    width: flex-grid(0.7,9);
 
-    ul li {
-      background-position: center;
-      background-repeat: no-repeat;
-      cursor: pointer;
-      font-weight: bold;
-      height: 20px;
-      list-style: none;
-      padding: 10px;
-      text-align: center;
-      width: 25px;
+    ul {
+      li {
+        background-position: center;
+        background-repeat: no-repeat;
+        cursor: pointer;
+        font-weight: bold;
+        height: 20px;
+        list-style: none;
+        padding: 10px;
+        text-align: center;
+        width: 70%;
 
-      &.question-img-upvote, &.answer-img-upvote  {
-        background-image: url(/static/images/askbot/vote-arrow-up-new.png);
-        background-color: #F6EFD4;
-
-        &:hover, &.on {
-          background-image: url(/static/images/askbot/vote-arrow-up-on-new.png);
+        &.post-vote {
+          @include border-radius(4px);
+          background-color: lighten(#F6EFD4, 3%);
         }
-      }
 
-      &.question-img-downvote, &.answer-img-downvote  {
-        background-image: url(/static/images/askbot/vote-arrow-down-new.png);
+        &.question-img-upvote, &.answer-img-upvote  {
+          background-image: url(/static/images/askbot/vote-arrow-up.png);
 
-        &:hover, &.on {
-          background-image: url(/static/images/askbot/vote-arrow-down-on-new.png);
+          &:hover, &.on {
+            background-color:#d1e3a8;
+          }
+        }
+
+        &.question-img-downvote, &.answer-img-downvote  {
+          background-image: url(/static/images/askbot/vote-arrow-down.png);
+
+          &:hover, &.on {
+            background-color:#eac6ad;
+          }
         }
       }
     }
@@ -38,7 +44,7 @@ div.question-header {
   div.question-container {
     display: inline-block;
     float: left;
-    width: flex-grid(8,9);
+    width: flex-grid(8.3,9);
 
     h1 {
       margin-top: 0;
@@ -47,9 +53,9 @@ div.question-header {
     div.meta-bar {
       border-bottom: 1px solid #eee;
       display: block;
-      margin: 20px 0 10px;
+      margin: 10px 0;
       overflow: hidden;
-      padding-bottom: 15px;
+      padding: 5px 0 10px;
 
 
       div.tag-list {
@@ -89,10 +95,128 @@ div.question-header {
         width: flex-grid(6.2,8);
       }
 
-      div.post-update-info {
+      div.post-update-container {
         display: inline-block;
         float: left;
         width: flex-grid(1.8,8);
+
+        div.post-update-info {
+          @include box-sizing(border-box);
+          @include border-radius(5px);
+          background:lighten(#F6EFD4, 5%);
+          padding: 10px;
+          margin-bottom: 10px;
+
+          &:last-child {
+            margin-bottom: 0;
+          }
+
+          &.revision {
+            text-align: center;
+            background:lighten(#F6EFD4, 7%);
+
+            a {
+              color: black;
+            }
+          }
+
+          a {
+            color:$mit-red ;
+          }
+
+          div.change-date {
+            font-size: 12px;
+            margin-bottom: 10px;
+          }
+
+          div.avatar {
+            display: inline-block;
+            float: left;
+            margin-right: 3px;
+
+            img.gravatar {
+              background: white;
+              border: 1px solid darken(#F6EFD4, 10%);
+              margin-right: 5px;
+              padding: 3px ;
+              vertical-align: bottom;
+            }
+          }
+
+          div.user-meta {
+            display: inline-block;
+            width: 60%;
+
+            span.user-badges {
+              display: block;
+            }
+          }
+        }
+      }
+    }
+
+    div.comments-container {
+      @include box-sizing(border-box);
+      background: lighten(#efefef, 3%);
+      padding: 3%;
+      display: inline-block;
+      margin: 15px 0 0;
+      padding: 3%;
+      width: 100%;
+
+      div.comments-content {
+        font-size: 13px;
+
+        div.comment {
+          border-bottom: 1px solid #ddd;
+          border-top: 1px solid #fff;
+          padding: 15px 0;
+          display: block;
+
+          &:first-child {
+            border-top: 0;
+          }
+
+          &:last-child {
+            margin-bottom: 20px;
+          }
+
+          div.comment-votes {
+            display: inline;
+
+            .upvote {
+              background: #ccc;
+              display:inline-block;
+              margin: 0px;
+              padding-right: 17px;
+              padding-top: 2px;
+              height: 20px;
+              color: #777;
+              width: 20px;
+            }
+          }
+
+          div.comment-delete {
+            display: inline;
+          }
+
+          div.comment-body {
+          }
+        }
+      }
+
+      #edit-comment-form {
+        margin: 10px 0;
+        min-height: 100px;
+        width: 99%;
+        resize: vertical;
+      }
+      .counter {
+        color: #888;
+        display: block;
+        float: right;
+        margin-top: 5px;
+        text-align: right;
       }
     }
   }

From 5a246d1bd7a0a4d0f41eb476e22ef63d280196ed Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Thu, 2 Feb 2012 11:39:44 -0500
Subject: [PATCH 20/26] add video to mitx_global

---
 mitx_global.html | 11 +++++++++++
 sass/_index.scss | 38 ++++++++++++++++++++++++++++++++++++++
 2 files changed, 49 insertions(+)

diff --git a/mitx_global.html b/mitx_global.html
index 9c5ac92f8e..12640b63df 100644
--- a/mitx_global.html
+++ b/mitx_global.html
@@ -6,10 +6,20 @@
   <section class="about">
 
     <section class="intro">
+      <section class="intro-text">
       <p><em>MITx</em>  will offer a portfolio of MIT courses for free to a virtual community of learners around the world. It will also enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences.</p>
       <p>The first <em>MITx</em> course, 6.002x (Circuits and Electronics), will be launched in an experimental prototype form. Watch this space for further upcoming courses, which will become available in Fall 2012.</p>
+
+      </section>
+    <section class="intro-video">
+      <div class="video-wrapper">
+      <iframe width="560" height="315" src="http://www.youtube.com/embed/p2Q6BrNhdh8?rel=0" frameborder="0" allowfullscreen></iframe>
+      </div>
     </section>
 
+    </section>
+
+
     <section class="features">
       <h2><em>MIT<span>x</span></em> courses will be offered on an online learning platform that:</h2>
 
@@ -22,6 +32,7 @@
 
       <p><strong>Press &amp; links:</strong> <a href="http://www.boston.com/news/local/massachusetts/articles/2011/12/19/mit_to_launch_online_only_graded_courses_free_to_all/?page=full" target="_blank">Boston Globe</a>, <a href="http://www.nytimes.com/2011/12/19/education/mit-expands-free-online-courses-offering-certificates.html?_r=3&hpw=" target="_blank">New York Times</a>,  <a href="http://web.mit.edu/newsoffice/2011/mitx-education-initiative-1219.html" target="_blank">MIT Press Release</a>, <a href="http://web.mit.edu/newsoffice/2011/mitx-faq-1219" target="_blank"><em>MITx</em> FAQ</a></p>
     </section>
+
   </section>
 
   <section class="course">
diff --git a/sass/_index.scss b/sass/_index.scss
index f1dd89392f..6fd33f904f 100644
--- a/sass/_index.scss
+++ b/sass/_index.scss
@@ -237,6 +237,44 @@ section.index-content {
           }
         }
 
+        &.intro {
+          section {
+            margin-bottom: 0;
+
+            &.intro-text {
+              margin-right: flex-gutter(8);
+              width: flex-grid(4, 8);
+
+              p {
+                margin-right: 0;
+                width: auto;
+                float: none;
+              }
+            }
+
+            &.intro-video {
+              width: flex-grid(4, 8);
+
+              div.video-wrapper {
+                position: relative;
+                padding-bottom: 56.25%;
+                padding-top: 30px;
+                height: 0;
+                overflow: hidden;
+                width: 100%;
+
+                iframe {
+                  position: absolute;
+                  top: 0;
+                  left: 0;
+                  width: 100%;
+                  height: 100%;
+                }
+              }
+            }
+          }
+        }
+
         &.features {
           border-top: 1px solid #E5E5E5;
           padding-top: lh();

From 2458b52aa9bfffae779227c2c51ed5a63dc577ce Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Thu, 2 Feb 2012 12:16:58 -0500
Subject: [PATCH 21/26] put video in overlay

---
 mitx_global.html     | 11 ++++++-----
 sass/_index.scss     | 18 +++++++-----------
 sass/_leanmodal.scss |  5 ++++-
 3 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/mitx_global.html b/mitx_global.html
index 12640b63df..5505b84238 100644
--- a/mitx_global.html
+++ b/mitx_global.html
@@ -9,17 +9,14 @@
       <section class="intro-text">
       <p><em>MITx</em>  will offer a portfolio of MIT courses for free to a virtual community of learners around the world. It will also enhance the educational experience of its on-campus students, offering them online tools that supplement and enrich their classroom and laboratory experiences.</p>
       <p>The first <em>MITx</em> course, 6.002x (Circuits and Electronics), will be launched in an experimental prototype form. Watch this space for further upcoming courses, which will become available in Fall 2012.</p>
-
       </section>
+
     <section class="intro-video">
-      <div class="video-wrapper">
-      <iframe width="560" height="315" src="http://www.youtube.com/embed/p2Q6BrNhdh8?rel=0" frameborder="0" allowfullscreen></iframe>
-      </div>
+      <a rel="leanModal" href="#video-overlay"><img src="/static/images/video-image.png" alt="" /><span> Watch intro video</span></a>
     </section>
 
     </section>
 
-
     <section class="features">
       <h2><em>MIT<span>x</span></em> courses will be offered on an online learning platform that:</h2>
 
@@ -49,6 +46,10 @@
     <p>Taught by Anant Agarwal, with Gerald Sussman and Piotr Mitros, 6.002x (Circuits and Electronics) is an on-line adaption of 6.002, MIT&rsquo;s first undergraduate analog design course. This prototype course will run, free of charge, for students worldwide from March 1, 2012 through June 8, 2012. Students will be given the opportunity to demonstrate their mastery of the material and earn a certificate from <em>MITx</em>.</p>
   </section>
 </section>
+
+<div id="video-overlay" class="leanModal_box">
+  <iframe width="560" height="315" src="http://www.youtube.com/embed/p2Q6BrNhdh8?rel=0" frameborder="0" allowfullscreen></iframe>
+</div>
 <script>
 
 $(function() {
diff --git a/sass/_index.scss b/sass/_index.scss
index 6fd33f904f..44c138d530 100644
--- a/sass/_index.scss
+++ b/sass/_index.scss
@@ -255,20 +255,16 @@ section.index-content {
             &.intro-video {
               width: flex-grid(4, 8);
 
-              div.video-wrapper {
-                position: relative;
-                padding-bottom: 56.25%;
-                padding-top: 30px;
-                height: 0;
-                overflow: hidden;
+              a {
+                display: block;
                 width: 100%;
 
-                iframe {
-                  position: absolute;
-                  top: 0;
-                  left: 0;
+                img {
                   width: 100%;
-                  height: 100%;
+                }
+
+                span {
+                  display: none;
                 }
               }
             }
diff --git a/sass/_leanmodal.scss b/sass/_leanmodal.scss
index bdd1a9bb22..8c14db22d4 100644
--- a/sass/_leanmodal.scss
+++ b/sass/_leanmodal.scss
@@ -15,7 +15,6 @@ div.leanModal_box {
   @include box-sizing(border-box);
   display: none;
   border: none;
-  max-width: 600px;
   background: #fff;
   padding: lh(2);
 
@@ -27,6 +26,10 @@ div.leanModal_box {
     margin-bottom: lh();
   }
 
+  &#enroll {
+    max-width: 600px;
+  }
+
   form {
     text-align: left;
 

From da17810d2dfc2a64552707a0cf221bf30ccfe6a1 Mon Sep 17 00:00:00 2001
From: Reda Lemeden <reda@thoughtbot.com>
Date: Thu, 2 Feb 2012 13:30:15 -0500
Subject: [PATCH 22/26] Fixed the layout of the question-specific comment
 section.

---
 sass/_askbot-original.scss | 48 +++++++++++-----------
 sass/_question-view.scss   | 84 ++++++++++++++++++++++++++++++--------
 2 files changed, 92 insertions(+), 40 deletions(-)

diff --git a/sass/_askbot-original.scss b/sass/_askbot-original.scss
index 461bc05176..02d50862b3 100644
--- a/sass/_askbot-original.scss
+++ b/sass/_askbot-original.scss
@@ -972,30 +972,30 @@ ul {
 .main-page h1 {
   margin-right: 5px; }
 
-.delete-icon {
-  margin-top: -1px;
-  float: left;
-  height: 21px;
-  width: 18px;
-  display: block;
-  line-height: 20px;
-  text-align: center;
-  background: #bbcdcd;
-  cursor: default;
-  color: #fff;
-  border-top: #cfdbdb 1px solid;
-  font-family: Arial;
-  border-top-right-radius: 4px;
-  border-bottom-right-radius: 4px;
-  -moz-border-radius-topright: 4px;
-  -moz-border-radius-bottomright: 4px;
-  -webkit-border-bottom-right-radius: 4px;
-  -webkit-border-top-right-radius: 4px;
-  text-shadow: 0px 1px 0px #7ea0a0;
-  -moz-text-shadow: 0px 1px 0px #7ea0a0;
-  -webkit-text-shadow: 0px 1px 0px #7ea0a0;
-  &:hover {
-    background: #b32f2f; } }
+// .delete-icon {
+//   margin-top: -1px;
+//   float: left;
+//   height: 21px;
+//   width: 18px;
+//   display: block;
+//   line-height: 20px;
+//   text-align: center;
+//   background: #bbcdcd;
+//   cursor: default;
+//   color: #fff;
+//   border-top: #cfdbdb 1px solid;
+//   font-family: Arial;
+//   border-top-right-radius: 4px;
+//   border-bottom-right-radius: 4px;
+//   -moz-border-radius-topright: 4px;
+//   -moz-border-radius-bottomright: 4px;
+//   -webkit-border-bottom-right-radius: 4px;
+//   -webkit-border-top-right-radius: 4px;
+//   text-shadow: 0px 1px 0px #7ea0a0;
+//   -moz-text-shadow: 0px 1px 0px #7ea0a0;
+//   -webkit-text-shadow: 0px 1px 0px #7ea0a0;
+//   &:hover {
+//     background: #b32f2f; } }
 
 .tag-number {
   font-weight: normal;
diff --git a/sass/_question-view.scss b/sass/_question-view.scss
index abbc16669f..ff66a8052f 100644
--- a/sass/_question-view.scss
+++ b/sass/_question-view.scss
@@ -167,12 +167,24 @@ div.question-header {
       div.comments-content {
         font-size: 13px;
 
-        div.comment {
+        .block {
           border-bottom: 1px solid #ddd;
           border-top: 1px solid #fff;
           padding: 15px 0;
           display: block;
 
+           &:first-child {
+            border-top: 0;
+          }
+          &:only-of-type {
+            border: 0;
+          }
+        }
+
+        form.post-comments {
+        }
+
+        div.comment {
           &:first-child {
             border-top: 0;
           }
@@ -181,26 +193,66 @@ div.question-header {
             margin-bottom: 20px;
           }
 
-          div.comment-votes {
-            display: inline;
+          aside.comment-controls {
+            background: none;
+            border: none;
+            display: inline-block;
+            margin-top: -8px;
+            padding:0 2% 0 0;
+            text-align: center;
+            width: 5%;
 
-            .upvote {
-              background: #ccc;
-              display:inline-block;
-              margin: 0px;
-              padding-right: 17px;
-              padding-top: 2px;
-              height: 20px;
-              color: #777;
-              width: 20px;
+            div {
+              background: none;
+              opacity: 0.6;
+
+              &:hover {
+                opacity: 1;
+              }
+            }
+
+            div.comment-votes {
+                @include transform(rotate(-90deg));
+                width: 16px;
+
+              a.upvote {
+                cursor: pointer;
+                font-size: 25px;
+                text-decoration: none;
+              }
+            }
+
+            div.comment-delete {
+              // display: inline;
+              color: $mit-red;
+              cursor: pointer;
+              font-size: 15px;
             }
           }
 
-          div.comment-delete {
-            display: inline;
-          }
-
           div.comment-body {
+            display: inline-block;
+            width: 95%;
+
+            div.comment-meta {
+              text-align: right;
+
+              a.author {
+                font-weight: bold;
+              }
+
+              a.edit {
+                @extend .button;
+                font-size: 12px;
+                padding: 2px 10px;
+                // @include border-radius(2px);
+                // background: #eee;
+                // color: #555;
+                // cursor: pointer;
+                // padding: 1px 10px;
+                // text-decoration: none;
+              }
+            }
           }
         }
       }

From 4dafe790df94d72a2ac666ccb3ad070b47cfb1d1 Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Thu, 2 Feb 2012 14:20:27 -0500
Subject: [PATCH 23/26] Added start to style for profile and course info

---
 info.html             |  6 +++---
 sass/_base.scss       | 22 +++++++++++++++++-----
 sass/_info.scss       | 39 +++++++++++++++++++++++++++++++++++++++
 sass/_layout.scss     | 16 ++++++++++++++++
 sass/_profile.scss    | 33 +++++++++++++++++++++------------
 sass/application.scss |  1 +
 6 files changed, 97 insertions(+), 20 deletions(-)
 create mode 100644 sass/_info.scss

diff --git a/info.html b/info.html
index 5867feb021..2559807e08 100644
--- a/info.html
+++ b/info.html
@@ -3,11 +3,11 @@
 <%include file="navigation.html" />
 
 <section class="main-content">
-  <div class="profile-wrapper">
-    <section class="user-info">
+  <div class="info-wrapper">
+    <section class="updates">
       <%include file="info_files/updates.html" />
     </section>
-    <section class="course-info">
+    <section class="handouts">
       <%include file="info_files/handouts.html" />
     </section>
   </div>
diff --git a/sass/_base.scss b/sass/_base.scss
index f0e86c7624..8ea0957ac3 100644
--- a/sass/_base.scss
+++ b/sass/_base.scss
@@ -41,12 +41,24 @@ em {
   }
 }
 
-a:link, a:visited {
-  text-decoration:none;
-}
+a {
+  color: $mit-red;
 
-a:hover {
-  text-decoration:underline;
+  &:link {
+    color: $mit-red;
+  }
+
+  &:visited {
+    color: darken($mit-red, 10%);
+  }
+
+  &:link, &:visited {
+    text-decoration:none;
+  }
+
+  &:hover, &:focus {
+    text-decoration:underline;
+  }
 }
 
 input[type="submit"], input[type="button"], button {
diff --git a/sass/_info.scss b/sass/_info.scss
new file mode 100644
index 0000000000..4f7a0b8d1a
--- /dev/null
+++ b/sass/_info.scss
@@ -0,0 +1,39 @@
+div.info-wrapper {
+  @extend .table-wrapper;
+
+  section.updates {
+    @extend .content;
+  }
+
+  section.handouts {
+    @extend .sidebar;
+    @include border-radius(0px 4px 0px 4px);
+    border-right: 0;
+    border-left: 1px solid #d3d3d3;
+
+    h1 {
+      padding: 0 lh();
+    }
+
+    ol {
+      list-style: none;
+
+      li {
+        a {
+          @include transition();
+          color: lighten($text-color, 10%);
+          display: block;
+          text-decoration: none;
+          @include box-shadow(0 1px 0 #eee);
+          padding: 7px lh();
+          border-bottom: 1px solid #d3d3d3;
+
+          &:hover {
+            @include box-shadow(0 1px 0 #fff);
+            background: #efefef;
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/sass/_layout.scss b/sass/_layout.scss
index 8867ef5348..89c216e26d 100644
--- a/sass/_layout.scss
+++ b/sass/_layout.scss
@@ -122,6 +122,14 @@ html {
 
       a {
         color: #444;
+
+        &:link, &:visited {
+          color: #444;
+        }
+
+        &:hover, &:focus {
+          color: #000;
+        }
       }
     }
 
@@ -134,6 +142,14 @@ html {
 
         a {
           color: #444;
+
+        &:link, &:visited {
+          color: #444;
+        }
+
+        &:hover, &:focus {
+          color: #000;
+        }
         }
       }
     }
diff --git a/sass/_profile.scss b/sass/_profile.scss
index 9cab2dbce6..5ba10ab283 100644
--- a/sass/_profile.scss
+++ b/sass/_profile.scss
@@ -2,23 +2,32 @@ div.profile-wrapper {
   @extend .table-wrapper;
 
   section.user-info {
-    @include box-sizing(border-box);
-    margin-right: flex-gutter();
-    padding: $body-line-height;
-    width: flex-grid(6);
-    background: #e3e3e3;
-    border-right: 1px solid #d3d3d3;
-    text-shadow: 0 1px 0 #f6f6f6;
-    display: table-cell;
+    @extend .sidebar;
+    padding: lh();
+
+    ul {
+      list-style: none;
+
+      li {
+        margin-bottom: lh(.5);
+      }
+    }
+
+    div #change_password_pop {
+      border-top: 1px;
+    }
   }
 
   section.course-info {
-    @include box-sizing(border-box);
-    display: table-cell;
-    padding: $body-line-height;
-    width: flex-grid(6);
+    @extend .content;
+
+    ol {
+      list-style: none;
+    }
 
     ul {
+      list-style: none;
+
       li {
         display: inline-block;
         padding-right: 1em;
diff --git a/sass/application.scss b/sass/application.scss
index ad0298d720..9f2776c912 100644
--- a/sass/application.scss
+++ b/sass/application.scss
@@ -10,6 +10,7 @@
 // pages
 @import "courseware", "courseware-video", "courseware-sequence-nav";
 @import "textbook";
+@import "info";
 @import "profile";
 @import "wiki-basic-html", "wiki-create", "wiki";
 @import "activation";

From 1b0f03d722b4728297bcc5fbc32438697ed39404 Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Thu, 2 Feb 2012 16:32:46 -0500
Subject: [PATCH 24/26] Continued style on profile page

---
 profile.html       | 117 +++++++++++++++++++++++----------------------
 sass/_profile.scss |  57 ++++++++++++++++++----
 2 files changed, 108 insertions(+), 66 deletions(-)

diff --git a/profile.html b/profile.html
index 689bffaa38..1ed517b2a8 100644
--- a/profile.html
+++ b/profile.html
@@ -1,11 +1,71 @@
 <%inherit file="main.html" />
 
+
+<%include file="navigation.html" />
+
+<section class="main-content">
+  <div class="profile-wrapper">
+
+    <section class="course-info">
+      <h1>Course Progress</h1>
+
+      <ol>
+        % for hw in homeworks:
+        <li>
+          <h2>${ hw['chapter'] }</h2>
+
+          <div class="scores">
+            <h3>${ hw['section'] }</h3>
+
+            <ul>
+              % for score in hw['scores']:
+              <li>${ score[0] }/${ score[1] }</li>
+              % endfor
+            </ul>
+          </div>
+        </li>
+        % endfor
+      </ol>
+    </section>
+
+    <section class="user-info">
+
+      <h1>${name}</h1>
+
+      <ul>
+        <li>Forum name: <strong>${username}</strong></li>
+        <li>E-mail: <strong>${email}</strong></li>
+        <li>
+          Location: <div id="location_sub">${location}</div><div id="description"></div> <a href="#" id="change_location">Change</a>
+        </li>
+        <li>
+          Language: <div id="language_sub">${language}</div> <a href="#" id="change_language">Change</a>
+        </li>
+      </ul>
+
+      <!-- <div><a class="modal" href="#change_password_pop">Reset password</a></div> -->
+
+      <div id="change_password_pop">
+        <h2>Password change</h2>
+        <p>We'll e-mail you a password reset link at ${email}. Follow
+        the link in the confirmation email to change your
+        password.</p>
+
+        <input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" />
+        <input type="submit" id="pwd_reset_button" value="Reset Password" />
+      </div>
+
+    </section>
+  </div>
+</section>
+
 <script>
 var loc=true; // Activate on clicks? Not if already clicked.
 var lang=true;
 $(function() {
       $("#change_location").click(function() {
          log_event("profile", {"type":"location_show", "old":$("#location_sub").text()});
+         $("#change-location").hide();
 
          if(loc) {
            $("#description").html('<div>'+
@@ -18,6 +78,7 @@ $(function() {
            $("#location_sub").html('<input id="id_loc_text" type="text" name="loc_text" />'+
                                    '<input type="button" id="change_loc_button" value="Change" />');
            $("#change_loc_button").click(function() {
+             $("#change-location").show();
               postJSON('/change_setting', {'location':$("#id_loc_text").attr("value")}, function(json) {
                 $("#location_sub").text(json.location);
                 loc=true;
@@ -61,59 +122,3 @@ $(function() {
 });
 
 </script>
-
-<%include file="navigation.html" />
-
-<section class="main-content">
-  <div class="profile-wrapper">
-    <section class="user-info">
-
-      <h1>${name}</h1>
-
-      <ul>
-        <li>Forum name: ${username}</li>
-        <li>E-mail: ${email}</li>
-        <li>
-          Location: <div id="location_sub">${location}</div><div id="description"></div> <a href="#" id="change_location">Change</a>
-        </li>
-        <li>
-          Language: <div id="language_sub">${language}</div> <a href="#" id="change_language">Change</a>
-        </li>
-      </ul>
-
-      <!-- <div><a class="modal" href="#change_password_pop">Reset password</a></div> -->
-
-      <div id="change_password_pop">
-        <h2>Password change</h2>
-        <p>We'll e-mail you a password reset link at ${email}. Follow
-        the link in the confirmation email to change your
-        password.</p>
-
-        <input id="id_email" type="hidden" name="email" maxlength="75" value="${email}" />
-        <input type="submit" id="pwd_reset_button" value="Reset Password" />
-      </div>
-
-    </section>
-
-    <section class="course-info">
-      <h1>Course Progress</h1>
-
-      <!-- <div id="description"></div> -->
-
-      <ol>
-        % for hw in homeworks:
-        <li>
-          <h2>${ hw['chapter'] }</h2>
-          <h3>${ hw['section'] }</h3>
-
-          <ul>
-            % for score in hw['scores']:
-            <li>${ score[0] }/${ score[1] }</li>
-            % endfor
-          </ul>
-        </li>
-        % endfor
-      </ol>
-    </section>
-  </div>
-</section>
diff --git a/sass/_profile.scss b/sass/_profile.scss
index 5ba10ab283..504185b055 100644
--- a/sass/_profile.scss
+++ b/sass/_profile.scss
@@ -1,20 +1,33 @@
 div.profile-wrapper {
   @extend .table-wrapper;
+  color: #000;
 
   section.user-info {
     @extend .sidebar;
-    padding: lh();
+    @include border-radius(0px 4px 0px 4px);
+    border-left: 1px solid #d3d3d3;
+    border-right: 0;
+
+    h1 {
+      padding: lh();
+    }
 
     ul {
       list-style: none;
 
       li {
-        margin-bottom: lh(.5);
+        @include transition();
+        color: lighten($text-color, 10%);
+        display: block;
+        text-decoration: none;
+        @include box-shadow(0 1px 0 #eee);
+        padding: 7px lh();
+        border-bottom: 1px solid #d3d3d3;
       }
     }
 
-    div #change_password_pop {
-      border-top: 1px;
+    div#change_password_pop {
+      padding: 7px lh();
     }
   }
 
@@ -23,15 +36,39 @@ div.profile-wrapper {
 
     ol {
       list-style: none;
-    }
 
-    ul {
-      list-style: none;
+      > li {
+        border-bottom: 1px solid #e3e3e3;
+        padding: lh() 0;
+        @extend .clearfix;
 
-      li {
-        display: inline-block;
-        padding-right: 1em;
+        h2 {
+          float: left;
+          padding: 0;
+          margin: 0;
+          width: flex-grid(2, 9);
+          margin-right: flex-gutter(9);
+        }
+
+        div.scores {
+          float: left;
+          width: flex-grid(7, 9);
+
+          h3 {
+            color: #666;
+          }
+
+          ul {
+            list-style: none;
+
+            li {
+              display: inline-block;
+              padding-right: 1em;
+            }
+          }
+        }
       }
     }
+
   }
 }

From bdde1599c4359c72b4912ee8bbc64e5e5de34b86 Mon Sep 17 00:00:00 2001
From: Kyle Fiedler <kfiedler@thoughtbot.com>
Date: Thu, 2 Feb 2012 17:09:19 -0500
Subject: [PATCH 25/26] More edits to the profile page

---
 profile.html       |  8 ++++++--
 sass/_profile.scss | 18 ++++++++++++++++++
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/profile.html b/profile.html
index 1ed517b2a8..ed3ac70f85 100644
--- a/profile.html
+++ b/profile.html
@@ -64,8 +64,9 @@ var loc=true; // Activate on clicks? Not if already clicked.
 var lang=true;
 $(function() {
       $("#change_location").click(function() {
+         $(this).hide();
+
          log_event("profile", {"type":"location_show", "old":$("#location_sub").text()});
-         $("#change-location").hide();
 
          if(loc) {
            $("#description").html('<div>'+
@@ -78,7 +79,8 @@ $(function() {
            $("#location_sub").html('<input id="id_loc_text" type="text" name="loc_text" />'+
                                    '<input type="button" id="change_loc_button" value="Change" />');
            $("#change_loc_button").click(function() {
-             $("#change-location").show();
+             $("#change_location").show();
+
               postJSON('/change_setting', {'location':$("#id_loc_text").attr("value")}, function(json) {
                 $("#location_sub").text(json.location);
                 loc=true;
@@ -90,6 +92,7 @@ $(function() {
       });
 
       $("#change_language").click(function() {
+         $(this).hide();
          log_event("profile", {"type":"language_show", "old":$("#language_sub").text()});
 
          if(lang) {
@@ -97,6 +100,7 @@ $(function() {
            $("#language_sub").html('<input id="id_lang_text" type="text" name="lang_text" />'+
                                    '<input type="button" id="change_lang_button" value="Change" />');
            $("#change_lang_button").click(function() {
+             $("#change_language").show();
               postJSON('/change_setting', {'language':$("#id_lang_text").attr("value")}, function(json) {
                 $("#language_sub").text(json.language);
                 lang=true;
diff --git a/sass/_profile.scss b/sass/_profile.scss
index 504185b055..b383c61a85 100644
--- a/sass/_profile.scss
+++ b/sass/_profile.scss
@@ -23,11 +23,29 @@ div.profile-wrapper {
         @include box-shadow(0 1px 0 #eee);
         padding: 7px lh();
         border-bottom: 1px solid #d3d3d3;
+
+        div#location_sub, div#language_sub {
+          font-weight: bold;
+          @include inline-block();
+
+          input {
+            margin: lh(.5) 0;
+          }
+
+          &:empty {
+            padding: 0;
+          }
+        }
+
+        div#description {
+          font-size: 12px;
+        }
       }
     }
 
     div#change_password_pop {
       padding: 7px lh();
+      color: #4D4D4D;
     }
   }
 

From 8b1b7168188ae3124fee9ab6019f768951095dd6 Mon Sep 17 00:00:00 2001
From: Reda Lemeden <reda@thoughtbot.com>
Date: Thu, 2 Feb 2012 17:23:12 -0500
Subject: [PATCH 26/26] Redesigned the answer list. Answer controls (edit,
 delete, etc) still missing.

---
 sass/_discussion-answers.scss   | 45 +++++++++++++++++++++++++++++++++
 sass/_discussion-questions.scss | 12 ++++++---
 sass/_question-view.scss        |  6 ++---
 sass/application.scss           |  2 +-
 4 files changed, 57 insertions(+), 8 deletions(-)
 create mode 100644 sass/_discussion-answers.scss

diff --git a/sass/_discussion-answers.scss b/sass/_discussion-answers.scss
new file mode 100644
index 0000000000..12d6500c48
--- /dev/null
+++ b/sass/_discussion-answers.scss
@@ -0,0 +1,45 @@
+div.answer-controls {
+  @extend div.question-controls;
+  display: inline-block;
+  margin-top: 20px;
+  margin-bottom: 0;
+
+  div.answer-sort {
+    @extend div.question-sort;
+  }
+
+  div.answer-count {
+    @extend div.question-count;
+  }
+}
+
+div.answer-block {
+  @extend div.question-header;
+  border-top: #ddd 1px solid;
+  display: inline-block;
+  float: left;
+  margin: 20px 0;
+  padding-top: 20px;
+  width: 100%;
+
+  img.answer-img-accept {
+    margin: 10px 0px 10px 16px;
+  }
+  div.answer-container {
+    @extend div.question-container;
+
+    div.answer-content {
+      @extend div.question-content;
+
+      div.answer-body {
+        @extend div.question-body;
+      }
+    }
+  }
+
+  div.meta-bar {
+    div.answer-actions {
+      @extend div.question-actions;
+    }
+  }
+}
diff --git a/sass/_discussion-questions.scss b/sass/_discussion-questions.scss
index 18a4575aa6..4a8704c477 100644
--- a/sass/_discussion-questions.scss
+++ b/sass/_discussion-questions.scss
@@ -10,7 +10,7 @@ div.question-controls {
 
   div.question-count {
     margin-right: flex-gutter();
-    width: flex-grid(5.5,9);
+    width: flex-grid(5,9);
 
     h1 {
       margin-top: 0;
@@ -19,7 +19,7 @@ div.question-controls {
 
   div.question-sort {
     vertical-align: bottom;
-    width: flex-grid(3.5,9);
+    width: flex-grid(4,9);
 
     nav {
       @include border-radius(35px);
@@ -28,10 +28,14 @@ div.question-controls {
       float: right;
       font-size: 16px;
       margin: 3px 0;
-      padding: 0 20px;
+      padding:0px 20px 5px;
 
       a {
-        color: darken(#F6EFD4, 50%);
+        color: darken(#F6EFD4, 50%); 
+
+        &.on span{
+          font-weight: bold;
+        }
 
         &:before {
           content: '|';
diff --git a/sass/_question-view.scss b/sass/_question-view.scss
index ff66a8052f..4fca12d2e4 100644
--- a/sass/_question-view.scss
+++ b/sass/_question-view.scss
@@ -176,9 +176,9 @@ div.question-header {
            &:first-child {
             border-top: 0;
           }
-          &:only-of-type {
-            border: 0;
-          }
+          // &:only-of-type {
+          //   border: 0;
+          // }
         }
 
         form.post-comments {
diff --git a/sass/application.scss b/sass/application.scss
index ad0298d720..9d67161043 100644
--- a/sass/application.scss
+++ b/sass/application.scss
@@ -14,7 +14,7 @@
 @import "wiki-basic-html", "wiki-create", "wiki";
 @import "activation";
 @import "help";
-@import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" ;
+@import "askbot-original", "discussion", "discussion-questions", "discussion-tags", "question-view" , "discussion-answers";
 
 // left over
 // @import "theme";