image responsiveness for mobile, tweaking the text up

srctweb/website/templates/index.html

@@ -66,7 +66,11 @@ SRCT
 
 <div class="row smidge">
   <legend><i class="fa fa-child fa-fw"></i>&nbsp;<strong>Initiatives</strong></legend>
-  <div class="col-md-9 col-sm-8 col-xs-8 smidge">
+
+  <div class="col-lg-3 col-lg-push-9 col-md-offset-0 col-md-4 col-md-push-8 col-sm-offset-3 col-sm-6 col-xs-offset-3 col-xs-6 smidge">
+    <img src="/static/img/openhatch.jpg" alt="..." class="img-circle img-responsive center-block">
+  </div>
+  <div class="col-lg-9 col-lg-pull-3 col-md-8 col-md-pull-4 col-sm-12 col-xs-12 smidge">
     <h4><strong>Projects & Infrastructure</strong></h4>
       <p>To learn more about SRCT, check out our
       <a href="{{ url_for('projects') }}">projects</a>, active, under development, or proposed, or talk to one of the
@@ -74,15 +78,12 @@ SRCT
       available on our <a href="http://wiki.srct.gmu.edu">wiki</a>, and all of our
       code is visible on the <a href="http://git.gmu.edu/public">public page</a> of
       our student git repository.</p>
-      <p>See some of the ways we've improved life on campus on the <a href="{{ url_for('projects') }}">projects page</a>.</p>
-      <p>We're on <a href="https://www.facebook.com/MasonSRCT">Facebook</a> and
-      <a href="https://www.twitter.com/MasonSRCT">Twitter</a>, have
-      <a href="http://lists.srct.gmu.edu/mailman/listinfo">active mailing lists</a>,
-      and an active <a href="https://srct.slack.com/">Slack team</a>. More ways to
-      get in touch are on our <a href="{{ url_for('contact') }}">contact page</a>.</p>
-  </div>
-  <div class="col-md-3 col-sm-4 col-xs-4 smidge">
-    <img src="/static/img/openhatch.jpg" alt="..." class="img-circle img-responsive center-block">
+    <p>
+      We run projects for the benefit of the community. All of our projects open source so anyone can learn and contribute. Blog consectetur cronut bespoke paleo, elit echo park church-key salvia cred stumptown tempor sapiente. Pariatur raw denim umami try-hard, hammock velit disrupt semiotics neutra. 
+    </p>
+    <p>
+      And of course, we need people to help manage the infrastructure that all of our projects are hosted on. Laboris kogi kickstarter bitters leggings sustainable, irony put a bird on it thundercats YOLO skateboard nulla franzen.
+    </p>
   </div>
 
   <div class="col-xs-offset-2 col-xs-8 smidge">
@@ -91,16 +92,26 @@ SRCT
   <div class="col-xs-2">
   </div>
 
-  <div class="col-md-9 col-sm-8 col-xs-8 smidge">
+  <div class="col-lg-3 col-lg-push-9 col-md-offset-0 col-md-4 col-md-push-8 col-sm-offset-3 col-sm-6 col-xs-offset-3 col-xs-6 smidge">
+    <img src="/static/img/bitcamp.jpg" alt="..." class="img-circle img-responsive center-block">
+  </div>
+  <div class="col-lg-9 col-lg-pull-3 col-md-8 col-md-pull-4 col-sm-12 col-xs-12 smidge">
     <h4><strong>Events & Workshops</strong></h4>
       <p>You can come to any of our planned <a href="//hackmason.org">events</a>. We hold
       numerous events each semester, from traveling to hackathons and conferences to
       doing local outreach, holding large programming events, and hosting speakers.</p>
-      <p>Letterpress venmo mixtape microdosing raw denim cray. Master cleanse four dollar toast paleo letterpress pork belly. Wayfarers meh pariatur, flannel velit mixtape kogi sunt banjo green juice ullamco four loko. Quinoa incididunt enim, laboris occaecat blog ethical stumptown et do raw denim distillery etsy.</p>
-      <p>See some of the ways we've improved life on campus on the <a href="{{ url_for('projects') }}">projects page</a>.</p>
-  </div>
-  <div class="col-md-3 col-sm-4 col-xs-4 smidge">
-    <img src="/static/img/bitcamp.jpg" alt="..." class="img-circle img-responsive center-block">
+      <p>
+        We hold our own large events around once a month
+      </p>
+      <p>
+        Sometimes, we host speakers at meetings
+      </p>
+      <p>
+        We organize Mason contingents to hackathons, intercollegiate programming competitions
+      </p>
+      <p>
+        We hold workshops at meetings and on weekends to help people learn to computer
+      </p>
   </div>
   
   <div class="col-xs-offset-2 col-xs-8 smidge">
@@ -109,18 +120,21 @@ SRCT
   <div class="col-xs-2">
   </div>
 
-  <div class="col-md-9 col-sm-8 col-xs-8 smidge">
+  <div class="col-lg-3 col-lg-push-9 col-md-offset-0 col-md-4 col-md-push-8 col-sm-offset-3 col-sm-6 col-xs-offset-3 col-xs-6 smidge">
+    <img src="/static/img/org-fair.jpg" alt="..." class="img-circle img-responsive center-block">
+  </div>
+  <div class="col-lg-9 col-lg-pull-3 col-md-8 col-md-pull-4 col-sm-12 col-xs-12 smidge">
     <h4><strong>Outreach & Community</strong></h4>
-      <p>We're on <a href="https://www.facebook.com/MasonSRCT">Facebook</a> and
-      <a href="https://www.twitter.com/MasonSRCT">Twitter</a>, have
-      <a href="http://lists.srct.gmu.edu/mailman/listinfo">active mailing lists</a>,
-      and an active <a href="https://srct.slack.com/">Slack team</a>. More ways to
-      get in touch are on our <a href="{{ url_for('contact') }}">contact page</a>.</p>
       <p>See some of the ways we've improved life on campus on the <a href="{{ url_for('projects') }}">projects page</a>.</p>
-      <p>3 wolf moon sustainable squid meggings, selvage raw denim microdosing health goth beard skateboard cold-pressed pop-up tote bag schlitz. Cred farm-to-table roof party thundercats trust fund irony. Man bun iPhone brooklyn keytar waistcoat, man braid distillery quinoa everyday carry brunch chicharrones deserunt aesthetic.</p>
-  </div>
-  <div class="col-md-3 col-sm-4 col-xs-4 smidge">
-    <img src="/static/img/org-fair.jpg" alt="..." class="img-circle img-responsive center-block">
+      <p>
+        We have helped teach elementary school children programming in the past, currently on hold
+      </p>
+      <p>
+        We try to be real friendly-like, go do random social things or get food :-)
+      </p>
+      <p>
+        Students from CS 101 are welcome to attend; can haz minorities pls
+      </p>
   </div>
 </div>
 
@@ -167,7 +181,7 @@ SRCT
       </div>
       <div class="panel-body">
         <p>
-          During the semester we have weekly meetings, where we do many things
+          During the semester we have weekly meetings, where we do many things. Make sure to bring your laptop
         </p>
         <p>
           Make sure to pick up a sticker for your laptop. You can also purchase a shirt