trying to fix sticky footer in safari by unifing markup

app/styles/app/layouts/footer.sass

@@ -2,6 +2,8 @@
  * Footer on the dashboard
  */
 
+$footer-height: 204px
+
 a
   color           : $color-link
   text-decoration : none
@@ -25,11 +27,11 @@ footer
   height: auto
 @media (min-width: 640px)
   .wrapper
-    padding-bottom: 204px
+    padding-bottom: $footer-height + 50
 
   footer
-    margin-top: -204px
+    margin-top: - $footer-height
-    min-height: 204px
+    min-height: $footer-height
 
 footer h3
   font-size   : 15px
@@ -87,5 +89,3 @@ footer a:active
 .status-circle.major
   background: #e74c3c
 
-.wrapper:not(.centered) ~ footer
-  display: none

app/styles/app/modules/tabs.sass

@@ -25,7 +25,7 @@
       content: ""
       position: absolute
       left: 0
-      bottom: -4px
+      bottom: -0.25em
       width: 100%
       height: 2px
       background-color: $teal2

app/templates/layouts/dashboard.hbs

@@ -1,14 +1,15 @@
-<div class="centered">
+<div class="wrapper wrapper-dashboard">
-  <div class="wrapper wrapper-dashboard">
+  <header id="top" class="top">
-    <header id="top" class="top">
+    <div class="centered">
       {{render "top"}}
-    </header>
+    </div>
+  </header>
 
+  <div class="centered">
     {{yield}}
-
   </div>
-
-  <footer>
-    {{render "footer"}}
-  </footer>
 </div>
+
+<footer>
+  {{render "footer"}}
+</footer>

app/templates/layouts/profile.hbs

@@ -1,15 +1,17 @@
-<header id="top" class="topbar">
+<div class="wrapper">
+  <header id="top" class="topbar">
+    <div class="centered">
+      {{render "top"}}
+    </div>
+  </header>
+
   <div class="centered">
-    {{render "top"}}
+    {{render "flash"}}
-  </div>
+    <div id="main" class="main" role="main">
-</header>
+      {{yield}}
 
-<div class="wrapper centered">
+      {{outlet "left"}}
-  {{render "flash"}}
+    </div>
-  <div id="main" class="main" role="main">
-    {{yield}}
-
-    {{outlet "left"}}
   </div>
 </div>