Index page (mostly) reworked

- need to include a "features" bullet point list

src/html/index.html

@@ -39,8 +39,7 @@
   <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
     <div class="container">
       <a class="navbar-brand d-flex mx-auto mr-2" href="./index.html">
-        <img src="./img/SRCT_square.svg" width="30" height="30" class="d-inline-block align-top mr-2" alt="SRCT Masonstrap">
-        Masonstrap 4
+        <img src="./img/SRCT_square.svg" width="30" height="30" class="d-inline-block align-top mr-2" alt="SRCT Masonstrap"> Masonstrap
       </a>
 
       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
@@ -71,6 +70,57 @@
     </div>
   </nav>
 
+  <div class="jumbotron jumbotron-fluid">
+      <div class="container">
+        <div class="d-flex flex-wrap">
+          <div class="d-md-none d-lg-none d-xl-none mx-auto">
+            <span class="fa-stack fa-2x">
+              <i class="fas fa-circle fa-stack-2x"></i>
+              <i class="fas fa-paint-brush fa-stack-1x fa-inverse"></i>
+            </span>            
+          </div>
+          <div class="d-none d-md-block mr-3">
+            <span class="fa-stack fa-2x">
+              <i class="fas fa-circle fa-stack-2x"></i>
+              <i class="fas fa-paint-brush fa-stack-1x fa-inverse"></i>
+            </span>  
+          </div>
+          <h1 class="display-4">
+            Masonstrap
+          </h1>
+        </div>
+        <p class="lead">Easily apply GMU styling to any web project.</p>
+      </div>
+    </div>
+
+  <div class="container">
+    <div class="row">
+      <div class="col-md-6">
+        <div class="card bg-light mb-3">
+          <h5 class="card-header">CSS</h5>
+          <div class="card-body">
+            <pre class="p-3"><code>&lt;link rel="stylesheet" href="https://srct.gmu.io/masonstrap/css/masonstrap.min.css" rel="stylesheet"&gt;</code></pre>
+          </div>    
+        </div>
+      </div>
+
+      <div class="col-md-6">
+        <div class="card bg-light">
+          <h5 class="card-header">JS</h5>
+          <div class="card-body">
+            <pre class="p-3"><code>&lt;script src="https://srct.gmu.io/masonstrap/js/masonstrap.min.js"&gt;&lt;/script&gt;</code></pre>
+          </div>    
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="footer">
+    <div class="container d-flex">
+      <span class="text-muted mx-auto">A project of <a href="https://www.srct.gmu.edu">GMU <strong>SRCT</strong></a> | Freely Licensed under <a href="https://git.gmu.edu/srct/masonstrap/blob/master/LICENSE">MIT</a> | <a href="https://git.gmu.edu/srct/masonstrap/blob/master/CHANGELOG.md">v4.0</a></span>
+    </div>
+  </div>
+
   <!-- load in external js -->
   <script src="./js/masonstrap.min.js"></script>