more landing page layout

assets/sass/pages/_home.scss

@@ -1,6 +1,7 @@
 #home-page {
   @include readable-content;
   grid-row-grap: 1em;
+  background-color: #fff;
 
   .headline-banner {
     grid-column: full;
@@ -10,7 +11,6 @@
     overflow: hidden;
     width: 100%;
     height: 800px;
-    margin-bottom: 80px;
 
     @media (max-width: $screen-sm) {
       margin-bottom: 30px;
@@ -69,6 +69,22 @@
     }
   }
 
+  .banner {
+    grid-column: full;
+    text-align: center;
+    padding: 20px 55px 20px 55px;
+    margin-bottom: 5px;
+
+    &.purple {
+      background-color: #63338f;
+    }
+
+    p {
+      font-size: 28px;
+      color: #fff;
+    }
+  }
+
   .content {
     h2 {
       width: 75%;

index.html

@@ -8,7 +8,6 @@ layout: home
                                 src="{{ "assets/images/CircuitPython_Hero.jpg" |
                                 relative_url }}"
          />
-    <div>
     <div class="text">
       <div class="title"><span>The easiest way to program microcontrollers</span></div>
       <div class="tagline">
@@ -19,7 +18,13 @@ layout: home
         </span>
       </div>
     </div>
-    </div>
+  </div>
+  <div class="purple banner">
+    <p>
+      With CircuitPython, there are no upfront desktop downloads needed. Once
+      you get your board set up, open any text editor, and start editing code.
+      It's that simple.
+    </p>
   </div>