Added quotes and refactored landing page

Author: Kinnardian

assets/style.css

@@ -37,14 +37,17 @@ nav a:hover{
 .section{
     margin-bottom: 1%;
 }
-.half{width: 45%; display:inline-block; margin: 0;}
+.half{width: 45%;}
+#section-2{
+    display: flex;
+}
 #arcquotes{
-    border-left: 3px solid #ffbb33;
+    width: 70%;
     padding:2%;
 }
 #learnmore{
-    position: relative;
-    top: -150;
+    border-left: 3px solid #ffbb33;
+    padding:2%;
 }
 #keystone{
     width: 40px;
@@ -83,6 +86,17 @@ input{
 input::-webkit-input-placeholder{
     color:white;
 }
+.quote{
+    display: flex;
+    margin-bottom: 2%;
+}
+.quote-avatar{
+    width: 75px;
+    height: 75px;
+}
+.caption{
+    margin-left: 3%;
+}
 
 .cell{
     width:30%;
@@ -121,9 +135,9 @@ footer{
 
 }
 .avatar{
-    display: inline-block;
     width: 40px;
 }
+
 .codebox{
 display:inline-block;
     background: none repeat scroll 0% 0% #444;
@@ -139,10 +153,10 @@ hr{
 }
 #contribute{
     display: flex;
-    flex-flow: row wrap;
+    flex-flow: column wrap;
 }
 #contribute *{
-    flex-basis: 100%;
+    
 }
 
 #contribute ul{ flex-basis: 40% }

index.html

@@ -14,7 +14,38 @@ <h1>What is Arc? The Hundred Year Language</h1>
 
     <p>Arc is a powerful, practical programmable programming language built up from axioms. Arc was created by paul graham and & robert morris </p>
     <hr>
-    <div class="half" id="learnmore">
+</div>    
+<div class="section" id="section-2">
+    <div id="arcquotes">
+        <div class="quote">
+            <img src='/assets/pg.jpg', class='quote-avatar'>
+            <div class="caption">
+            "By way of summary, let's try describing the hacker's dream language. The dream language is beautiful, clean, and terse." <h3>—Paul Graham</h3>
+            </div>
+        </div>
+        <div class="quote">
+            <img src='/assets/alankay.jpg', class='quote-avatar'>
+            <div class="caption">
+            "Lisp isn't a language, it's a building material."
+            <h3> —Alan Kay</h3>
+            </div>
+        </div>
+        <div class="quote">
+            <img src='/assets/ericraymond.jpg', class='quote-avatar'>
+            <div class="caption">
+                "Lisp is worth learning for the profound enlightenment experience you will have when you finally get it; that experience will make you a better programmer for the rest of your days, even if you never actually use Lisp itself a lot."
+                <h3> —Eric Raymond</h3>
+            </div>
+        </div>
+        <div class="quote">
+            <img src='/assets/pg.jpg', class='quote-avatar'>
+            <div class="caption">
+                "Nothing is hidden from you that doesn't absolutely have to be. The language offers abstractions only as a way of saving you work, rather than as a way of telling you what to do. In fact, the language encourages you to be an equal participant in its design. You can change everything about it, including even its syntax, and anything you write has, as much as possible, the same status as what comes predefined."
+                <h3>—Paul Graham</h3>
+            </div>
+        </div>
+    </div>
+    <div id="learnmore">
         <h3>Learn More:</h3>
         <ul>
         <li><a href="http://paulgraham.com/hundred.html">The Hundred Year Language</a></li>
@@ -23,20 +54,13 @@ <h3>Learn More:</h3>
         <li><a href="https://arclanguage.github.io/">Arc-Language Documentation</a></li>
         </ul>
     </div>
-    <div class="half" id="arcquotes">
-        <p> "By way of summary, let's try describing the hacker's dream language. The dream language is beautiful, clean, and terse."</p>
-        <p> "Lisp is worth learning for the profound enlightenment experience you will have when you finally get it; that experience will make you a better programmer for the rest of your days, even if you never actually use Lisp itself a lot."</p>
 
-        <p>
-        "Nothing is hidden from you that doesn't absolutely have to be. The language offers abstractions only as a way of saving you work, rather than as a way of telling you what to do. In fact, the language encourages you to be an equal participant in its design. You can change everything about it, including even its syntax, and anything you write has, as much as possible, the same status as what comes predefined."
-        </p>
-    </div>    
 </div>
 <hr>
 <div>
     <div class='cell'> <h3> <i class="fa fa-cubes"></i> 40 Stones and Counting</h3></div>
     <div class='cell'> <h3> <i class="fa fa-line-chart"></i>400 Downloads and Counting</h3></div>
-    <div class='cell'> <h3> <i class="fa fa-users"></i>15 Developers and Counting</h3></div>
+    <div class='cell'> <h3> <i class="fa fa-users"></i>150 Developers and Counting</h3></div>
 
 </div>
 <hr>