mobile header responsive hotfix - allows scrolling so header doesn't block stuff

styles/app/index.styl

@@ -32,6 +32,12 @@ html,body,p,h1,ul,li,table,tr,th,td
   box-sizing: border-box
   z-index: 1000
 
+@media (max-width: 480px) {
+  #head {
+    position: static;
+  }
+}
+
 #head .pull-right
   margin-right: 0
   margin-left: 1%
@@ -123,6 +129,12 @@ html,body,p,h1,ul,li,table,tr,th,td
   /*overflow:auto;*/                                                                                                                                                                                                                             
   padding-bottom: 250px; /* don't know why this works, sticky footers are weird */
 
+@media (max-width: 480px) {
+  #wrap {
+    margin-top: 0
+  }
+}
+
 /* Tokens
 -------------------------------------------------- */
 /* Adaptation of GH's social-count for Tokens */

views/app/index.html

@@ -295,11 +295,11 @@ do a find for the string after "→"
 
 <Body:>
   <br/>
-  <div id=wrap class=container-fluid>
+  <div id=wrap class="container-fluid">
 
     <app:alerts />
 
-    <div id=main class=row-fluid>
+    <div id=main class="row-fluid">
       <!-- would rather have one component: <app:taskList>, which handles taskList, task, and newTask.  However,
         can't pass references as paramters.  so <app:taskList newModel={_newHabit} list={_habitList}> doesn't work
         and have to pass those in via {{{content}}} instead -->