switch floats to flexboxes, header fixes

assets/sass/pages/responsive/_global.scss

@@ -5,7 +5,7 @@
   body {
     // Safari iOS menu bar reappers below 44px:
     // https://www.eventbrite.com/engineering/mobile-safari-why/
-    padding-bottom: 50px !important;
+    padding-bottom: 45px !important;
     // Allows content to fill the viewport and go beyond the bottom
     height: 100%;
     // Allows you to scroll below the viewport; default value is visible

assets/sass/pages/responsive/_home.scss

@@ -16,8 +16,6 @@ body#home {
   }
 
   footer div {
-    line-height: 1.7;
-
     &#panda {
       display: none;
     }
@@ -34,7 +32,7 @@ body#home {
 
     &#info {
       font-size: 0.7em;
-      line-height: 2;
+      line-height: 2.1;  // magic numbers don't judge
 
       span#copyright::after {
         content: "\A";

assets/sass/pages/responsive/_notes.scss

@@ -2,16 +2,19 @@
 
 // Responsive Blog
 body#notes {
-  padding: 10px 20px 30px 20px;
+  padding: 0 20px;
   width: 100%;
   max-width: 100%;
 
   header {
-
     nav {
+      padding: 5px 0;
+
       a#logo {
+        padding: 10px;
+
         img, svg {
-          height: 55px;
+          height: 60px;
           width: auto;
         }
 
@@ -20,8 +23,18 @@ body#notes {
         }
       }
 
-      ul li {
-        width: 50px;
+      ul {
+        font-size: 1.75em;
+        margin-right: 10px;
+
+        li {
+          width: 55px;
+
+          // hide home emoji on mobile -- logo probably suffices?
+          // &:first-child {
+          //   display: none;
+          // }
+        }
       }
     }
   }
@@ -45,7 +58,7 @@ body#notes {
     }
   }
 
-  main#archive section.year div {
+  main#archive section.year {
     font-size: 1em;
   }