Set 'Code-In Timeline' and 'Connect with Us' in one row on tablet screen

Change-Id: Ib3e0f46359df8b9e7479f15e06e50e88dd920565
diff --git a/app/soc/content/less/gci/elements/homepage_blocks.less b/app/soc/content/less/gci/elements/homepage_blocks.less
index 6a34299..8e11015 100644
--- a/app/soc/content/less/gci/elements/homepage_blocks.less
+++ b/app/soc/content/less/gci/elements/homepage_blocks.less
@@ -521,17 +521,28 @@
 .social-media {
   margin: 0 auto;
   text-align: center;
-  padding: 5px 15px 15px 15px;
+  padding: 15px;
+  @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
+    padding: 46px 15px;
+    height: 126px;
+  }
 
   li {
     display: inline-block;
     font-size: 1.5em;
-    line-height: 1.2em;
-    margin: 4px .25em 0;
+    padding: 5px;
+  }
+
+  li + li {
+    margin-left: 5px;
+    @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
+      margin-left: 20px;
+    }
   }
 
   // Image replacement
   .ir {
+    display: inline-block;
     background-color: transparent;
     border: 0;
     overflow: hidden;
diff --git a/app/soc/templates/modules/gci/homepage/base.html b/app/soc/templates/modules/gci/homepage/base.html
index 689280f..e71e8c0 100644
--- a/app/soc/templates/modules/gci/homepage/base.html
+++ b/app/soc/templates/modules/gci/homepage/base.html
@@ -19,8 +19,14 @@
     {{ how_it_works.render }}
 
     <div class="col-md-4 col-md-push-8 main-side">
-      {{ timeline.render }}
-      {{ connect_with_us.render }}
+      <div class="row">
+        <div class="col-md-12 col-sm-6">
+          {{ timeline.render }}
+        </div>
+        <div class="col-md-12 col-sm-6">
+          {{ connect_with_us.render }}
+        </div>
+      </div>
     </div>
     <div class="col-md-8 col-md-pull-4 main-content">
       {{ participating_orgs.render }}