Completed homepage

_includes/footer.html

@@ -1,15 +1,22 @@
 <footer class="container-fluid">
-  <div class="center-both">
-    <div class="container">
-      <div class="row">
-      <p class="col-sm-4 pull-left">&copy; Copyright 2016 &#8212; Watch Out! News Agency</p>
-      <div class="col-sm-4 pull-right">
-        <div class="row">
-          <a class="col-sm-4" href="/about/">About Us</a>
-          <a class="col-sm-4" href="http://fb.com/WatchOutNewsAgency">Facebook</a>
-        </div>
+  <div class="pre-footer container">
+    <div class="brand pull-left">
+      <img class="logo" src="/images/logo-black.png">
+      <div class="name-container">
+        <div class="name">Watch Out!</div>
+        <div class="desc">Official News<br>Body of IITR</div>
       </div>
-     </div>
     </div>
-	</div>
+    <div class="social pull-right">
+      <a href="/team">Team</a>
+      <a href="/about">About</a>
+      <img src="/images/fb-logo.svg" href="http://fb.com/WatchOutNewsAgency">
+      <img src="/images/youtube-play.svg" href="https://www.youtube.com/channel/UCthZ7tKOzy4EJpuVxtdcp1A">
+    </div>
+  </div>
+
+
+  <div class="container copyright">
+    <p>&copy; Copyright 2016 &#8212; Watch Out! News Agency</p>
+  </div>
 </footer>

_includes/head.html

@@ -38,7 +38,6 @@
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
   <link rel="alternate" type="application/rss+xml" href="/atom.xml" />
 
-  <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet">
   <link rel="stylesheet" href="/css/base.css" type="text/css" media="screen, projection" />
 
   <script type="text/javascript" src="/js/jquery-2.1.3.min.js"></script>

_includes/header.html

@@ -13,10 +13,12 @@
 }(document, 'script', 'facebook-jssdk'));</script>
 
 <div id="header" class="container {% if page.is_post %}post-header{% endif %}">
-  <div class="row">
+  <div class="row header-row outer-row">
     {% if post.image != nil %}
-    <div class="col-md-8 tinted cover-image center-fill-container img-container">
+    <div class="col-md-8 tinted cover-image center-fill-container">
+      <div class="img-container">
         <img class="center-both img-center-fill" src="/images/posts/{{ post.image }}" alt="">
+      </div>
     </div>
     {% endif %}
     <div class="col-md-4 cover-details">
@@ -39,12 +41,12 @@
 
 <div id="new-articles" class="container content">
   <section>
-    <div class="row">
+    <div class="row outer-row">
       {% for post in site.related_posts limit: 5 %}
 
       {% if forloop.index == 3 %}
         </div>
-        <div class="row">
+        <div class="row outer-row">
       {% endif %}
 
       <div class="article col-sm-{% if forloop.index < 3 %}6{% else %}4{% endif %}">