add video to mitx_global

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">

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();