footer: visible only on the bottom, resize

labs/meteor-client/app/client/main.html

@@ -1,5 +1,5 @@
 <template name="footer">
-   <div id="footer" class="myFooter gradientBar navbar navbar-default navbar-fixed-bottom" role="navigation">
+   <div id="footer" class="myFooter gradientBar navbar navbar-default">
       {{{getFooterString}}}
    </div>
 </template>

labs/meteor-client/app/client/stylesheets/style.less

@@ -47,14 +47,24 @@ body {
   padding-top: 13px;
   text-align: center;
   @media @landscape {
+    position:fixed;
+    bottom:0;
+    margin-bottom: 0;
+    border-width: 1px 0 0;
+    width: 100%;
+  }  
+  @media @landscape, @desktop-portrait {
     font-size: 10px;
     max-height: 20px;
   }
-  @media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
-    font-size: 18px;
+  @media @mobile-portrait-with-keyboard, @mobile-portrait {
+    font-size: 26px;
   }
-  @media @desktop-portrait {
-    font-size: 16px;
+
+  // the footer should be visible only at the very bottom of a portrait page
+  @media @desktop-portrait, @mobile-portrait-with-keyboard, @mobile-portrait {
+    order: 4;
+    -webkit-order: 4;
   }
 }