Make footer stick to the bottom of the page

- Use JavaScript to determine height of `.page_footer` to apply padding to `body` avoiding any content overlap
- Absolute position `.page_footer` to bottom of the page

assets/_scss/_base.scss

@@ -2,6 +2,12 @@
    BASE ELEMENTS
    ========================================================================== */
 
+html {
+  /* sticky footer fix */
+  position: relative;
+  min-height: 100%;
+}
+
 body {
   margin: 0;
   padding: 0;

assets/_scss/_footer.scss

@@ -5,6 +5,13 @@
 .page__footer {
   @include full();
   @include clearfix;
+  /* sticky footer fix start */
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  clear: both;
+  height: auto;
+  /* sticky footer fix end */
   margin-top: 3em;
   color: mix(#fff, $gray, 25%);
   animation: intro 0.3s both;

assets/js/_main.js

@@ -4,6 +4,24 @@
 
 $(document).ready(function(){
 
+  // Sticky footer
+  var bumpIt = function() {
+      $('body').css('margin-bottom', $('.page__footer').outerHeight(true));
+    },
+    didResize = false;
+
+  bumpIt();
+
+  $(window).resize(function() {
+    didResize = true;
+  });
+  setInterval(function() {
+    if(didResize) {
+      didResize = false;
+      bumpIt();
+    }
+  }, 250);
+
   // FitVids init
   $("#main").fitVids();