diff --git a/gulp-tasks/paths.js b/gulp-tasks/paths.js
index bcb0b6e2..5cb93b2a 100755
--- a/gulp-tasks/paths.js
+++ b/gulp-tasks/paths.js
@@ -10,7 +10,11 @@ module.exports = {
     minifySrc: [
       'src/wmcads/assets/sass/wmcads.scss',
       'src/www/wmcads-website.scss',
-      'src/www/pages/templates/templates.scss'
+      'src/www/pages/templates/templates.scss',
+      'src/wmcads/assets/sass/wmcads-grid/grid.scss',
+      'src/wmcads/assets/sass/split/buttons.scss',
+      'src/wmcads/assets/sass/split/accordion.scss',
+      'src/wmcads/assets/sass/split/typography.scss'
     ], // List of scss file(s) which should be processed, linted & minified
     output: 'build/css/', // output location of minified styles
     reactNativeSrc: 'src/wmcads/assets/sass/wmcads.scss'
diff --git a/src/wmcads/assets/sass/split/accordion.scss b/src/wmcads/assets/sass/split/accordion.scss
new file mode 100644
index 00000000..1e0f4c94
--- /dev/null
+++ b/src/wmcads/assets/sass/split/accordion.scss
@@ -0,0 +1,12 @@
+// Vars
+@import "https://fonts.googleapis.com/css?family=DM+Sans:700&display=swap"; // Google Fonts
+@import "../vars";
+
+// Mixins
+@import "../mixins";
+
+
+// Accorddion Styles
+.umb-grid {
+  @import "../../../components/accordion/accordion";
+}
diff --git a/src/wmcads/assets/sass/split/buttons.scss b/src/wmcads/assets/sass/split/buttons.scss
new file mode 100755
index 00000000..0d0e4a4e
--- /dev/null
+++ b/src/wmcads/assets/sass/split/buttons.scss
@@ -0,0 +1,12 @@
+// Vars
+@import "https://fonts.googleapis.com/css?family=DM+Sans:700&display=swap"; // Google Fonts
+@import "../vars";
+
+// Mixins
+@import "../mixins";
+
+
+// Button Styles
+.umb-grid {
+  @import "../../../components/button/button"; // Import all pattern styles
+}
diff --git a/src/wmcads/assets/sass/split/typography.scss b/src/wmcads/assets/sass/split/typography.scss
new file mode 100644
index 00000000..c4bc8bd7
--- /dev/null
+++ b/src/wmcads/assets/sass/split/typography.scss
@@ -0,0 +1,13 @@
+// Vars
+@import "https://fonts.googleapis.com/css?family=DM+Sans:700&display=swap"; // Google Fonts
+@import "../vars";
+
+// Mixins
+@import "../mixins";
+
+
+// Typography Styles
+#umb-grid {
+  @import "../typography";
+}
+
diff --git a/src/wmcads/assets/sass/wmcads-grid/grid.scss b/src/wmcads/assets/sass/wmcads-grid/grid.scss
new file mode 100644
index 00000000..9a9d834b
--- /dev/null
+++ b/src/wmcads/assets/sass/wmcads-grid/grid.scss
@@ -0,0 +1,46 @@
+@import "../vars";
+
+// When setting the primary font stack, apply it to the Pure grid units along
+// with `html`, `button`, `input`, `select`, and `textarea`. Pure Grids use
+// specific font stacks to ensure the greatest OS/browser compatibility.
+
+.umb-grid {
+  button,
+  input,
+  select,
+  textarea,
+  .wmcads-grid [class*="wmcads-col-"] {
+    font-family: $x-font-family;
+    -webkit-font-smoothing: antialiased;
+  }
+
+  .wmcads-grid {
+    display: flex;
+    width: 100%;
+    text-rendering: optimizespeed;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+    -webkit-flex-flow: row wrap;
+    -ms-flex-flow: row wrap;
+    flex-flow: row wrap;
+    -webkit-align-content: flex-start;
+    -ms-flex-line-pack: start;
+    align-content: flex-start;
+
+    [class*="wmcads-col-"] {
+      display: inline-block;
+      zoom: 1;
+      letter-spacing: normal;
+      word-spacing: normal;
+      text-rendering: auto;
+      vertical-align: top;
+    }
+  }
+
+  // Import grid components
+  @import "grid-cols";
+  @import "grid-spacing";
+
+  // Import utilities
+  @import "../utilities";
+}