diff --git a/gulpfile.js b/gulpfile.js
index 83297ca7f3..1913ded9b5 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -55,7 +55,7 @@ gulp.task('sass-watch', ['sass'], function () {
 });
 
 gulp.task('sass', function(done) {
-  gulp.src('src/core/styles/ionic.scss')
+  gulp.src('src/components/app/ionic.scss')
     .pipe(sass({
       onError: function(err) {
         console.log(err);
diff --git a/src/core/styles/_globals.scss b/src/components/app/_globals.scss
similarity index 97%
rename from src/core/styles/_globals.scss
rename to src/components/app/_globals.scss
index 6140de8d29..01616250c4 100644
--- a/src/core/styles/_globals.scss
+++ b/src/components/app/_globals.scss
@@ -1,5 +1,5 @@
 
-[ionic] {
+[ion-app] {
 
   // Typography
   // -------------------------
diff --git a/src/core/styles/_normalize.scss b/src/components/app/_normalize.scss
similarity index 98%
rename from src/core/styles/_normalize.scss
rename to src/components/app/_normalize.scss
index 472f8c2a2b..e242a8ea76 100644
--- a/src/core/styles/_normalize.scss
+++ b/src/components/app/_normalize.scss
@@ -43,13 +43,13 @@ template {
 // ==========================================================================
 
 // Remove the gray background color from active links in IE 10.
-[ionic] a {
+[ion-app] a {
   background-color: transparent;
 }
 
 // Improve readability when focused and also mouse hovered in all browsers.
-[ionic] a:active,
-[ionic] a:hover {
+[ion-app] a:active,
+[ion-app] a:hover {
   outline: 0;
 }
 
@@ -90,12 +90,12 @@ sub {
 // ==========================================================================
 
 // Remove border when inside `a` element in IE 8/9/10.
-[ionic] img {
+[ion-app] img {
   border: 0;
 }
 
 // Correct overflow not hidden in IE 9/10/11.
-[ionic] svg:not(:root) {
+svg:not(:root) {
   overflow: hidden;
 }
 
@@ -104,12 +104,12 @@ sub {
 // ==========================================================================
 
 // Address margin not present in IE 8/9 and Safari.
-[ionic] figure {
+figure {
   margin: 1em 40px;
 }
 
 // Address differences between Firefox and other browsers.
-[ionic] hr {
+hr {
   -moz-box-sizing: content-box;
   box-sizing: content-box;
   height: 0;
diff --git a/src/core/styles/_scaffolding.scss b/src/components/app/_scaffolding.scss
similarity index 96%
rename from src/core/styles/_scaffolding.scss
rename to src/components/app/_scaffolding.scss
index fbe94ff182..8dcbcb6d76 100644
--- a/src/core/styles/_scaffolding.scss
+++ b/src/components/app/_scaffolding.scss
@@ -1,14 +1,14 @@
 
-[ionic] {
+[ion-app] {
   @include flex-display();
   @include flex-direction(row);
 
   overflow: hidden;
+  height: 100%;
   max-width: 100%;
   max-height: 100%;
   margin: 0;
   padding: 0;
-  height: 100%;
 
   .view {
     position: relative;
@@ -26,7 +26,6 @@
 
   .tool-bar {
     display: block;
-    min-height: 50px;
   }
 
   .tool-bar-top {
@@ -68,4 +67,3 @@
   }
 
 }
-
diff --git a/src/components/app/_typography.scss b/src/components/app/_typography.scss
new file mode 100644
index 0000000000..6fb3d1348d
--- /dev/null
+++ b/src/components/app/_typography.scss
@@ -0,0 +1,52 @@
+
+// Typography
+// -------------------------
+
+$font-family-sans-serif:          "Helvetica Neue", "Roboto", sans-serif !default;
+$font-family-light-sans-serif:    "HelveticaNeue-Light", "Roboto-Light", sans-serif-light !default;
+
+$font-family-base:                $font-family-sans-serif !default;
+$font-size-base:                  14px !default;
+
+$line-height-base:                1.428571429 !default; // 20/14
+$line-height-computed:            floor($font-size-base * $line-height-base) !default; // ~20px
+
+$headings-font-family:            $font-family-base !default;
+$headings-font-weight:            500 !default;
+$headings-line-height:            1.2 !default;
+
+
+[ion-app] {
+
+  h1, h2, h3, h4, h5, h6 {
+    font-weight: $headings-font-weight;
+    font-family: $headings-font-family;
+    line-height: $headings-line-height;
+  }
+
+  h1,
+  h2,
+  h3 {
+    margin-top: $line-height-computed;
+    margin-bottom: ($line-height-computed / 2);
+
+    &:first-child {
+      margin-top: 0;
+    }
+  }
+
+  h4,
+  h5,
+  h6 {
+    margin-top: ($line-height-computed / 2);
+    margin-bottom: ($line-height-computed / 2);
+  }
+
+  h1 { font-size: floor($font-size-base * 2.60); } // ~36px
+  h2 { font-size: floor($font-size-base * 2.15); } // ~30px
+  h3 { font-size: ceil($font-size-base * 1.70); } // ~24px
+  h4 { font-size: ceil($font-size-base * 1.25); } // ~18px
+  h5 { font-size: $font-size-base; }
+  h6 { font-size: ceil($font-size-base * 0.85); } // ~12px
+
+}
diff --git a/src/components/app/ionic.scss b/src/components/app/ionic.scss
new file mode 100644
index 0000000000..b1eafc147b
--- /dev/null
+++ b/src/components/app/ionic.scss
@@ -0,0 +1,22 @@
+@charset "UTF-8";
+
+
+// Mixins
+@import
+  "mixins/flex",
+  "mixins/transition";
+
+
+// Globals
+@import
+  "normalize",
+  "globals",
+  "scaffolding",
+  "typography";
+
+
+// Components
+@import "../button/button";
+@import "../tabbar/tabbar";
+@import "../modal/modal";
+
diff --git a/src/core/styles/mixins/_flex.scss b/src/components/app/mixins/_flex.scss
similarity index 100%
rename from src/core/styles/mixins/_flex.scss
rename to src/components/app/mixins/_flex.scss
diff --git a/src/core/styles/mixins/_transition.scss b/src/components/app/mixins/_transition.scss
similarity index 100%
rename from src/core/styles/mixins/_transition.scss
rename to src/components/app/mixins/_transition.scss
diff --git a/src/core/styles/_components.scss b/src/core/styles/_components.scss
deleted file mode 100644
index 47f0777e92..0000000000
--- a/src/core/styles/_components.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-
-$components: (
-  button: true,
-  tabbar: false,
-);
diff --git a/src/core/styles/_typography.scss b/src/core/styles/_typography.scss
deleted file mode 100644
index e693e1d648..0000000000
--- a/src/core/styles/_typography.scss
+++ /dev/null
@@ -1,48 +0,0 @@
-
-// Typography
-// -------------------------
-
-$font-family-sans-serif:          "Helvetica Neue", "Roboto", sans-serif !default;
-$font-family-light-sans-serif:    "HelveticaNeue-Light", "Roboto-Light", sans-serif-light !default;
-
-$font-family-base:                $font-family-sans-serif !default;
-$font-size-base:                  14px !default;
-
-$line-height-base:                1.428571429 !default; // 20/14
-$line-height-computed:            floor($font-size-base * $line-height-base) !default; // ~20px
-
-$headings-font-family:            $font-family-base !default;
-$headings-font-weight:            500 !default;
-$headings-line-height:            1.2 !default;
-
-
-h1, h2, h3, h4, h5, h6 {
-  font-weight: $headings-font-weight;
-  font-family: $headings-font-family;
-  line-height: $headings-line-height;
-}
-
-h1,
-h2,
-h3 {
-  margin-top: $line-height-computed;
-  margin-bottom: ($line-height-computed / 2);
-
-  &:first-child {
-    margin-top: 0;
-  }
-}
-
-h4,
-h5,
-h6 {
-  margin-top: ($line-height-computed / 2);
-  margin-bottom: ($line-height-computed / 2);
-}
-
-h1 { font-size: floor($font-size-base * 2.60); } // ~36px
-h2 { font-size: floor($font-size-base * 2.15); } // ~30px
-h3 { font-size: ceil($font-size-base * 1.70); } // ~24px
-h4 { font-size: ceil($font-size-base * 1.25); } // ~18px
-h5 { font-size: $font-size-base; }
-h6 { font-size: ceil($font-size-base * 0.85); } // ~12px
diff --git a/src/core/styles/ionic.scss b/src/core/styles/ionic.scss
deleted file mode 100644
index 829ab50527..0000000000
--- a/src/core/styles/ionic.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-@charset "UTF-8";
-
-
-// Mixins
-@import
-  "mixins/flex",
-  "mixins/transition";
-
-
-// Globals
-@import
-  "normalize",
-  "globals",
-  "scaffolding";
-
-@import
-  "typography";
-
-
-// Components (Conditional Includes)
-@import "components";
-@import "../../components/button/button";
-@import "../../components/tabbar/tabbar";
-@import "../../components/modal/modal";
-