diff --git a/dist/css/ionic-ios7.css b/dist/css/ionic-ios7.css
index 04d0b57938..fdc24b249d 100644
--- a/dist/css/ionic-ios7.css
+++ b/dist/css/ionic-ios7.css
@@ -556,11 +556,12 @@ a.subdued‎ {
   border-style: solid;
   border-top: 1px solid transparent;
   border-bottom: 1px solid #dddddd;
+  background-size: 0;
   background-color: white; }
   @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
     .bar {
-      border-top: none;
-      border-bottom: none;
+      border-top: none !important;
+      border-bottom: none !important;
       background-image: linear-gradient(0deg, #dddddd, #dddddd, 50%, transparent 50%);
       background-position: bottom;
       background-size: 100% 1px;
@@ -575,122 +576,66 @@ a.subdued‎ {
       color: #fff; }
   .bar.bar-default {
     background-color: rgba(255, 255, 255, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #dddddd;
+    border-top-color: transparent;
+    border-bottom-color: #dddddd;
+    background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
     color: #333333; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-default {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-default .title {
       color: #333333; }
   .bar.bar-secondary {
     background-color: rgba(245, 245, 245, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #bbbbbb;
+    border-top-color: transparent;
+    border-bottom-color: #bbbbbb;
+    background-image: linear-gradient(0deg, #bbbbbb, #bbbbbb 50%, transparent 50%);
     color: #333333; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-secondary {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #bbbbbb, #bbbbbb 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-secondary .title {
       color: #333333; }
   .bar.bar-primary {
     background-color: rgba(74, 135, 238, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #3b6dc2;
+    border-top-color: transparent;
+    border-bottom-color: #3b6dc2;
+    background-image: linear-gradient(0deg, #3b6dc2, #3b6dc2 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-primary {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #3b6dc2, #3b6dc2 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-primary .title {
       color: white; }
   .bar.bar-info {
     background-color: rgba(67, 206, 230, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #3bb3c8;
+    border-top-color: transparent;
+    border-bottom-color: #3bb3c8;
+    background-image: linear-gradient(0deg, #3bb3c8, #3bb3c8 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-info {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #3bb3c8, #3bb3c8 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-info .title {
       color: white; }
   .bar.bar-success {
     background-color: rgba(102, 204, 51, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #5bb22f;
+    border-top-color: transparent;
+    border-bottom-color: #5bb22f;
+    background-image: linear-gradient(0deg, #5bb22f, #5bb22f 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-success {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #5bb22f, #5bb22f 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-success .title {
       color: white; }
   .bar.bar-warning {
     background-color: rgba(240, 184, 64, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #d29f31;
+    border-top-color: transparent;
+    border-bottom-color: #d29f31;
+    background-image: linear-gradient(0deg, #d29f31, #d29f31 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-warning {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #d29f31, #d29f31 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-warning .title {
       color: white; }
   .bar.bar-danger {
     background-color: rgba(239, 78, 58, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #c73927;
+    border-top-color: transparent;
+    border-bottom-color: #c73927;
+    background-image: linear-gradient(0deg, #c73927, #c73927 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-danger {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #c73927, #c73927 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-danger .title {
       color: white; }
   .bar.bar-dark {
     background-color: rgba(68, 68, 68, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #111111;
+    border-top-color: transparent;
+    border-bottom-color: #111111;
+    background-image: linear-gradient(0deg, #111111, #111111 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-dark {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #111111, #111111 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-dark .title {
       color: white; }
   .bar .title {
@@ -875,7 +820,10 @@ a.subdued‎ {
   top: 0; }
 
 .bar-footer {
-  bottom: 0; }
+  bottom: 0;
+  border-top-width: 1px;
+  border-bottom-width: 0;
+  background-position: top; }
 
 .bar-tabs {
   padding: 0; }
diff --git a/dist/css/ionic-scoped.css b/dist/css/ionic-scoped.css
index a03b55e172..fea9109fb3 100644
--- a/dist/css/ionic-scoped.css
+++ b/dist/css/ionic-scoped.css
@@ -1322,11 +1322,12 @@
     border-style: solid;
     border-top: 1px solid transparent;
     border-bottom: 1px solid #dddddd;
+    background-size: 0;
     background-color: white; }
     @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
       .ionic .bar {
-        border-top: none;
-        border-bottom: none;
+        border-top: none !important;
+        border-bottom: none !important;
         background-image: linear-gradient(0deg, #dddddd, #dddddd, 50%, transparent 50%);
         background-position: bottom;
         background-size: 100% 1px;
@@ -1341,122 +1342,66 @@
         color: #fff; }
     .ionic .bar.bar-default {
       background-color: rgba(255, 255, 255, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #dddddd;
+      border-top-color: transparent;
+      border-bottom-color: #dddddd;
+      background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
       color: #333333; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-default {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-default .title {
         color: #333333; }
     .ionic .bar.bar-secondary {
       background-color: rgba(245, 245, 245, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #bbbbbb;
+      border-top-color: transparent;
+      border-bottom-color: #bbbbbb;
+      background-image: linear-gradient(0deg, #bbbbbb, #bbbbbb 50%, transparent 50%);
       color: #333333; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-secondary {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #bbbbbb, #bbbbbb 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-secondary .title {
         color: #333333; }
     .ionic .bar.bar-primary {
       background-color: rgba(74, 135, 238, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #3b6dc2;
+      border-top-color: transparent;
+      border-bottom-color: #3b6dc2;
+      background-image: linear-gradient(0deg, #3b6dc2, #3b6dc2 50%, transparent 50%);
       color: white; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-primary {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #3b6dc2, #3b6dc2 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-primary .title {
         color: white; }
     .ionic .bar.bar-info {
       background-color: rgba(67, 206, 230, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #3bb3c8;
+      border-top-color: transparent;
+      border-bottom-color: #3bb3c8;
+      background-image: linear-gradient(0deg, #3bb3c8, #3bb3c8 50%, transparent 50%);
       color: white; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-info {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #3bb3c8, #3bb3c8 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-info .title {
         color: white; }
     .ionic .bar.bar-success {
       background-color: rgba(102, 204, 51, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #5bb22f;
+      border-top-color: transparent;
+      border-bottom-color: #5bb22f;
+      background-image: linear-gradient(0deg, #5bb22f, #5bb22f 50%, transparent 50%);
       color: white; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-success {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #5bb22f, #5bb22f 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-success .title {
         color: white; }
     .ionic .bar.bar-warning {
       background-color: rgba(240, 184, 64, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #d29f31;
+      border-top-color: transparent;
+      border-bottom-color: #d29f31;
+      background-image: linear-gradient(0deg, #d29f31, #d29f31 50%, transparent 50%);
       color: white; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-warning {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #d29f31, #d29f31 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-warning .title {
         color: white; }
     .ionic .bar.bar-danger {
       background-color: rgba(239, 78, 58, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #c73927;
+      border-top-color: transparent;
+      border-bottom-color: #c73927;
+      background-image: linear-gradient(0deg, #c73927, #c73927 50%, transparent 50%);
       color: white; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-danger {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #c73927, #c73927 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-danger .title {
         color: white; }
     .ionic .bar.bar-dark {
       background-color: rgba(68, 68, 68, 0.9);
-      border-top: 1px solid transparent;
-      border-bottom: 1px solid #111111;
+      border-top-color: transparent;
+      border-bottom-color: #111111;
+      background-image: linear-gradient(0deg, #111111, #111111 50%, transparent 50%);
       color: white; }
-      @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-        .ionic .bar.bar-dark {
-          border-top: none;
-          border-bottom: none;
-          background-image: linear-gradient(0deg, #111111, #111111 50%, transparent 50%);
-          background-size: 100% 1px;
-          background-repeat: no-repeat;
-          background-position: bottom; } }
       .ionic .bar.bar-dark .title {
         color: white; }
     .ionic .bar .title {
@@ -1631,7 +1576,10 @@
   .ionic .bar-header {
     top: 0; }
   .ionic .bar-footer {
-    bottom: 0; }
+    bottom: 0;
+    border-top-width: 1px;
+    border-bottom-width: 0;
+    background-position: top; }
   .ionic .bar-tabs {
     padding: 0; }
   .ionic .bar-subheader {
diff --git a/dist/css/ionic.css b/dist/css/ionic.css
index c2c1669548..fdb651735d 100644
--- a/dist/css/ionic.css
+++ b/dist/css/ionic.css
@@ -1665,11 +1665,12 @@ a.subdued‎ {
   border-style: solid;
   border-top: 1px solid transparent;
   border-bottom: 1px solid #dddddd;
+  background-size: 0;
   background-color: white; }
   @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
     .bar {
-      border-top: none;
-      border-bottom: none;
+      border-top: none !important;
+      border-bottom: none !important;
       background-image: linear-gradient(0deg, #dddddd, #dddddd, 50%, transparent 50%);
       background-position: bottom;
       background-size: 100% 1px;
@@ -1684,122 +1685,66 @@ a.subdued‎ {
       color: #fff; }
   .bar.bar-default {
     background-color: rgba(255, 255, 255, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #dddddd;
+    border-top-color: transparent;
+    border-bottom-color: #dddddd;
+    background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
     color: #333333; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-default {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #dddddd, #dddddd 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-default .title {
       color: #333333; }
   .bar.bar-secondary {
     background-color: rgba(245, 245, 245, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #bbbbbb;
+    border-top-color: transparent;
+    border-bottom-color: #bbbbbb;
+    background-image: linear-gradient(0deg, #bbbbbb, #bbbbbb 50%, transparent 50%);
     color: #333333; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-secondary {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #bbbbbb, #bbbbbb 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-secondary .title {
       color: #333333; }
   .bar.bar-primary {
     background-color: rgba(74, 135, 238, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #3b6dc2;
+    border-top-color: transparent;
+    border-bottom-color: #3b6dc2;
+    background-image: linear-gradient(0deg, #3b6dc2, #3b6dc2 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-primary {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #3b6dc2, #3b6dc2 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-primary .title {
       color: white; }
   .bar.bar-info {
     background-color: rgba(67, 206, 230, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #3bb3c8;
+    border-top-color: transparent;
+    border-bottom-color: #3bb3c8;
+    background-image: linear-gradient(0deg, #3bb3c8, #3bb3c8 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-info {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #3bb3c8, #3bb3c8 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-info .title {
       color: white; }
   .bar.bar-success {
     background-color: rgba(102, 204, 51, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #5bb22f;
+    border-top-color: transparent;
+    border-bottom-color: #5bb22f;
+    background-image: linear-gradient(0deg, #5bb22f, #5bb22f 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-success {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #5bb22f, #5bb22f 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-success .title {
       color: white; }
   .bar.bar-warning {
     background-color: rgba(240, 184, 64, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #d29f31;
+    border-top-color: transparent;
+    border-bottom-color: #d29f31;
+    background-image: linear-gradient(0deg, #d29f31, #d29f31 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-warning {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #d29f31, #d29f31 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-warning .title {
       color: white; }
   .bar.bar-danger {
     background-color: rgba(239, 78, 58, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #c73927;
+    border-top-color: transparent;
+    border-bottom-color: #c73927;
+    background-image: linear-gradient(0deg, #c73927, #c73927 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-danger {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #c73927, #c73927 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-danger .title {
       color: white; }
   .bar.bar-dark {
     background-color: rgba(68, 68, 68, 0.9);
-    border-top: 1px solid transparent;
-    border-bottom: 1px solid #111111;
+    border-top-color: transparent;
+    border-bottom-color: #111111;
+    background-image: linear-gradient(0deg, #111111, #111111 50%, transparent 50%);
     color: white; }
-    @media (min--moz-device-pixel-ratio: 1.5), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
-      .bar.bar-dark {
-        border-top: none;
-        border-bottom: none;
-        background-image: linear-gradient(0deg, #111111, #111111 50%, transparent 50%);
-        background-size: 100% 1px;
-        background-repeat: no-repeat;
-        background-position: bottom; } }
     .bar.bar-dark .title {
       color: white; }
   .bar .title {
@@ -1984,7 +1929,10 @@ a.subdued‎ {
   top: 0; }
 
 .bar-footer {
-  bottom: 0; }
+  bottom: 0;
+  border-top-width: 1px;
+  border-bottom-width: 0;
+  background-position: top; }
 
 .bar-tabs {
   padding: 0; }
diff --git a/scss/ionic/_bar.scss b/scss/ionic/_bar.scss
index baec16a85f..8a99cbd3d7 100644
--- a/scss/ionic/_bar.scss
+++ b/scss/ionic/_bar.scss
@@ -20,6 +20,7 @@
   border-style: solid;
   border-top: 1px solid transparent;
   border-bottom: 1px solid $bar-default-border-color;
+  background-size: 0;
 
   background-color: $bar-bg;
   @media (min--moz-device-pixel-ratio: 1.5),
@@ -27,15 +28,13 @@
          (min-device-pixel-ratio: 1.5),
          (min-resolution: 144dpi),
          (min-resolution: 1.5dppx) {
-
-    border-top: none;
-    border-bottom: none;
+    border-top: none !important;
+    border-bottom: none !important;
     background-image: linear-gradient(0deg, $bar-default-border-color, $bar-default-border-color, 50%, transparent 50%);
     background-position: bottom;
     background-size: 100% 1px;
     background-repeat: no-repeat;
-
-   }
+  }
 
   &.bar-clear {
     border: none;
@@ -85,7 +84,6 @@
     z-index: 0;
 
     margin: 0;
-    //padding: $barPaddingVertical 0px;
 
     min-width: 30px;
 
@@ -202,6 +200,9 @@
 // Footer at bottom
 .bar-footer {
   bottom: 0;
+  border-top-width: 1px;
+  border-bottom-width: 0;
+  background-position: top;
 }
 
 // Don't render padding if the bar is just for tabs
diff --git a/scss/ionic/_mixins.scss b/scss/ionic/_mixins.scss
index 341615ae81..7a225e08c1 100644
--- a/scss/ionic/_mixins.scss
+++ b/scss/ionic/_mixins.scss
@@ -96,23 +96,9 @@
 
 @mixin bar-style($bgColor, $borderColor, $color) {
   background-color: $bgColor;
-  border-top: 1px solid transparent;
-  border-bottom: 1px solid $borderColor;
-
-  @media (min--moz-device-pixel-ratio: 1.5),
-         (-webkit-min-device-pixel-ratio: 1.5),
-         (min-device-pixel-ratio: 1.5),
-         (min-resolution: 144dpi),
-         (min-resolution: 1.5dppx) {
-
-    border-top: none;
-    border-bottom: none;
-    background-image: linear-gradient(0deg, $borderColor, $borderColor 50%, transparent 50%);
-    background-size: 100% 1px;
-    background-repeat: no-repeat;
-    background-position: bottom;
-
-   }
+  border-top-color: transparent;
+  border-bottom-color: $borderColor;
+  background-image: linear-gradient(0deg, $borderColor, $borderColor 50%, transparent 50%);
 
   color: $color;
 
diff --git a/test/footers.html b/test/footers.html
index 0cb77afc79..62ece8084a 100644
--- a/test/footers.html
+++ b/test/footers.html
@@ -5,82 +5,59 @@
 
     <!-- Sets initial viewport load and disables zooming  -->
     <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
-    <link href="../dist/ionicons.css" rel="stylesheet">
-    <link href="../dist/ionic.css" rel="stylesheet">
+    <link href="../dist/css/ionic.css" rel="stylesheet">
     <style>
       .hide{display:none;}
     </style>
   </head>
   <body>
 
-    <section>
+    <header class="bar bar-header bar-dark">
+      <h1 class="title">Footer</h1>
+    </header>
 
-      <header class="bar bar-header bar-dark">
-        <h1 class="title">Footer</h1>
-      </header>
+    <main class="content padding has-header has-footer">
+      <p>Footer should always stay at the bottom of the screen, and on top of the main content.</p>
+      <p>Content element must have "has-footer" as a classname.</p>
+      <p><button id="btnAddMore">Dynamically Add More Content</button></p>
+      <div id="add-more"></div>
+      <p><button id="btnToggle">Toggle Content</button></p>
+      <p id="toggle-content" class="hide">
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+        Toggled content<br>
+      </p>
+      <p><a class="button button-secondary" href="index.html">Homepage</a></p>
+    </main>
 
-      <main class="content padding has-header has-footer">
-        <p>Footer should always stay at the bottom of the screen, and on top of the main content.</p>
-        <p>Content element must have "has-footer" as a classname.</p>
-        <p><button id="btnAddMore">Dynamically Add More Content</button></p>
-        <div id="add-more"></div>
-        <p><button id="btnToggle">Toggle Content</button></p>
-        <p id="toggle-content" class="hide">
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-          Toggled content<br>
-        </p>
-        <p><a class="button button-secondary" href="index.html">Homepage</a></p>
-      </main>
+    <footer class="bar bar-footer bar-default">
+      <h3 class="title">Footer</h3>
+    </footer>
 
-      <footer class="bar bar-footer bar-dark">
-        <h3 class="title">Footer</h3>
-      </footer>
-
-    </section>
-    
-    <script src="../dist/ionic.js"></script>
-    <script src="../dist/ionic-simple.js"></script>
-    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
-    <script>
-      $("#btnAddMore").click(function(){
-        var moreContent = [];
-        moreContent.push("<ul>");
-        for(var x=0; x<20; x++) {
-          moreContent.push("<li>Dynamically added content!");
-        }
-        moreContent.push("</ul>");
-        $("#add-more").append( moreContent.join('') );
-        return false;
-      });
-      $("#btnToggle").click(function(){
-        $("#toggle-content").toggle("hide")
-      });
-    </script>
   </body>
 </html>