diff --git a/README.md b/README.md
index bfe71df..b541765 100644
--- a/README.md
+++ b/README.md
@@ -117,3 +117,5 @@ browsersSupport: [
 - https://github.com/Famolus/awesome-sass
   Curated list of awesome Sass and SCSS frameworks, libraries, style guides,
   articles, and resources.
+- https://github.com/jptaranto/typey
+  A complete framework for working with typography on the web.
diff --git a/css/theme/theme.css b/css/theme/theme.css
new file mode 100644
index 0000000..d5d1989
--- /dev/null
+++ b/css/theme/theme.css
@@ -0,0 +1,166 @@
+
+
+html {
+  font-size: 100%;
+  line-height: 1.5em;
+  -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+          text-size-adjust: 100%;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+}
+
+abbr[title] {
+  border-bottom: 0;
+  text-decoration: underline dotted;
+}
+
+pre,
+code,
+kbd,
+samp,
+var {
+  font-family: Menlo, "DejaVu Sans Mono", "Ubuntu Mono", Courier, "Courier New", monospace, sans-serif;
+  font-size: 1rem;
+}
+
+mark {
+  background-color: color(mark-bg);
+  color: color(text);
+}
+
+small {
+  font-size: 0.875rem;
+}
+
+sub,
+sup {
+  font-size: 0.625rem;
+  position: relative;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+h1,
+.h1 {
+  font-size: 2rem;
+  line-height: 3rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+h2,
+.h2 {
+  font-size: 1.5rem;
+  line-height: 2.25rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+h3,
+.h3 {
+  font-size: 1.25rem;
+  line-height: 2.25rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+h4,
+.h4 {
+  font-size: 1rem;
+  line-height: 1.5rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+h5,
+.h5 {
+  font-size: 0.875rem;
+  line-height: 1.5rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+h6,
+.h6 {
+  font-size: 0.625rem;
+  line-height: 1.5rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+
+blockquote {
+  margin: 1.5rem 2rem;
+}
+
+dl,
+menu,
+ol,
+ul {
+  margin: 1.5rem 0;
+}
+
+ol ol,
+ol ul,
+ul ol,
+ul ul {
+  margin: 0;
+}
+
+dd {
+  margin: 0 0 0 32px;
+}
+
+.divider,
+hr {
+  margin: 1.5rem 0;
+  border: 0;
+  border-top: 1px solid color(border);
+}
+
+.divider > :first-child, hr > :first-child {
+  margin-top: 1.5rem;
+}
+
+hr {
+  box-sizing: content-box;
+  height: 0;
+  overflow: visible;
+}
+
+p,
+pre {
+  margin: 1.5rem 0;
+}
+
+table {
+  margin: 1.5rem 0;
+  border-collapse: collapse;
+  border-spacing: 0;
+  width: 100%;
+}
+
+td,
+th {
+  padding: 0;
+}
+
+@media print {
+  html {
+    font-size: 12pt;
+  }
+  abbr[title]::after {
+    content: " (" attr(title) ")";
+  }
+}
diff --git a/gulp-tasks.js b/gulp-tasks.js
index ad42029..a0644e1 100644
--- a/gulp-tasks.js
+++ b/gulp-tasks.js
@@ -51,7 +51,9 @@ module.exports = function(gulp, plugins, options) {
       }))
       .pipe(plugins.postcss(options.postcssOptions))
       .pipe(plugins.rucksack())
-      .pipe(plugins.stripCssComments())
+      .pipe(plugins.stripCssComments({
+        preserve: false
+      }))
       // Flatten folders.
       // .pipe(rename({dirname: ''}))
       .pipe(gulp.dest(options.cssDest));
diff --git a/package.json b/package.json
index 777f3f9..e91b649 100644
--- a/package.json
+++ b/package.json
@@ -35,6 +35,7 @@
     "stylelint-config-standard": "^16.0.0",
     "stylelint-order": "^0.3.0",
     "stylelint-scss": "^1.4.3",
-    "stylelint-selector-bem-pattern": "^1.0.0"
+    "stylelint-selector-bem-pattern": "^1.0.0",
+    "typey": "^1.1.1"
   }
 }
diff --git a/sass/_init.scss b/sass/_init.scss
index 84ca925..c7229fa 100644
--- a/sass/_init.scss
+++ b/sass/_init.scss
@@ -3,3 +3,12 @@
 
 // Variables.
 @import "variables/bs_base";
+
+// Typey framework for working with typography.
+// Documentation on the [Typey homepage](https://github.com/jptaranto/typey).
+
+//Load typey variables
+@import "variables/typey";
+
+// Load typey to manage font sizes and margins.
+@import 'typey/stylesheets/typey';
diff --git a/sass/theme/base/_elements.scss b/sass/theme/base/_elements.scss
new file mode 100644
index 0000000..63a3c6c
--- /dev/null
+++ b/sass/theme/base/_elements.scss
@@ -0,0 +1,210 @@
+@import "init";
+
+// Typey vertical rhythm rules (https://github.com/jptaranto/typey)
+//  Font-size:    16px
+//  Line height:  24px
+
+// Root
+
+html {
+  @include define-type-sizing;
+  // Prevent adjustments of font size after orientation changes in IE and iOS.
+  text-size-adjust: 100%;
+}
+
+body {
+  // Output a horizontal grid to help with debugging typography. The
+  // $typey-debug variable will toggle its output.
+  @include typey-debug-grid;
+  // Remove default margin and padding.
+  margin: 0;
+  padding: 0;
+}
+
+// Text-level semantics
+
+// Abbreviation / Acroynym
+abbr[title] {
+  // Remove the bottom border in Firefox <40.
+  border-bottom: 0;
+  // Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+  text-decoration: underline dotted;
+
+  @media print {
+    // Add visible title after abbreviations.
+    &::after {
+      content: " (" attr(title) ")";
+    }
+  }
+}
+
+// Code
+%monospace,
+code,
+kbd,
+samp,
+var {
+  // Correct the inheritance and scaling of font size in all browsers.
+  @include typeface(monospace);
+  // Correct the odd `em` font sizing in all browsers.
+  font-size: 1rem;
+}
+
+// Small text
+small {
+  // Add the correct font size in all browsers.
+  @include font-size(s);
+}
+
+// Superscript / Subscript
+sub,
+sup {
+  // Prevent `sub` and `sup` elements from affecting the line height in
+  // all browsers.
+  @include font-size(xs);
+
+  position: relative;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25rem;
+}
+
+sup {
+  top: -0.5rem;
+}
+
+// Headings
+h1,
+.h1 {
+  // Set the font-size and line-height while keeping a proper vertical rhythm.
+  @include type-layout(xxl, 2);
+
+  // Set 1 unit of vertical rhythm on the top and bottom margins.
+  @include margin-top(1, xxl);
+  @include margin-bottom(1, xxl);
+}
+
+h2,
+.h2 {
+  @include type-layout(xl, 1.5);
+  @include margin-top(1, xl);
+  @include margin-bottom(1, xl);
+}
+
+h3,
+.h3 {
+  @include type-layout(l, 1.5);
+  @include margin-top(1, l);
+  @include margin-bottom(1, l);
+}
+
+h4,
+.h4 {
+  @include type-layout(m, 1);
+  @include margin-top(1, m);
+  @include margin-bottom(1, m);
+}
+
+h5,
+.h5 {
+  @include type-layout(s, 1);
+  @include margin-top(1, s);
+  @include margin-bottom(1, s);
+}
+
+h6,
+.h6 {
+  @include type-layout(xs, 1);
+  @include margin-top(1, xs);
+  @include margin-bottom(1, xs);
+}
+
+// Grouping content
+
+// Block quotes
+blockquote {
+  // Set 1 unit of vertical rhythm on the top and bottom margin.
+  // Also indent the quote on both sides.
+  @include margin(1 $indent-amount);
+}
+
+// Lists
+dl,
+menu,
+ol,
+ul {
+  // Address margins set differently in IE 6/7.
+  @include margin(1 0);
+}
+
+// Turn off margins on nested lists.
+ol,
+ul {
+  ol,
+  ul {
+    margin: 0;
+  }
+}
+
+dd {
+  margin: 0 0 0 $indent-amount;
+}
+
+// Divider
+.divider,
+%divider {
+  @include margin(1 0);
+
+  border: 0;
+  border-top: 1px solid;
+
+  // If used as a container, add a top margin to the first child.
+  > :first-child {
+    @include margin-top(1);
+  }
+}
+
+// Horizontal rule
+hr {
+  @extend %divider;
+  // Add the correct box sizing in Firefox.
+  box-sizing: content-box;
+  height: 0;
+  // Show the overflow in Edge and IE.
+  overflow: visible;
+}
+
+// Body copy
+p,
+pre {
+  // Set 1 unit of vertical rhythm on the top and bottom margin.
+  @include margin(1 0);
+}
+
+// Preformatted text
+pre {
+  @extend %monospace;
+}
+
+// Tables
+
+table {
+  // Add vertical rhythm margins.
+  @include margin(1 0);
+
+  // Remove most spacing between table cells.
+  border-collapse: collapse;
+  border-spacing: 0;
+
+  // Prevent cramped-looking tables
+  width: 100%;
+}
+
+td,
+th {
+  // Remove most spacing between table cells.
+  padding: 0;
+}
diff --git a/sass/theme/theme.scss b/sass/theme/theme.scss
new file mode 100644
index 0000000..ac8becf
--- /dev/null
+++ b/sass/theme/theme.scss
@@ -0,0 +1,2 @@
+@import "init";
+@import "base/elements";
diff --git a/sass/variables/_typey.scss b/sass/variables/_typey.scss
new file mode 100644
index 0000000..8cc00b2
--- /dev/null
+++ b/sass/variables/_typey.scss
@@ -0,0 +1,61 @@
+// Typey variables
+// Documentation on the [Typey homepage](https://github.com/jptaranto/typey).
+
+// Font styling and line heights
+
+// The length unit in which to output font size and margin values.
+// Supported values: px, em, rem.
+$base-unit:         'rem';
+
+// The font size set on the root html element.
+$base-font-size:    16px;
+
+// The base line height determines the basic unit of vertical rhythm.
+$base-line-height:  24px;
+
+// The method to calculate line-height.
+// Rhytm uses a vertical rhythm approach where line-height is specified as
+// a multiple of the $base-line-height.
+$line-height-method:       rhythm !default;
+
+// px fallbacks for rem units are needed for IE 8 and earlier.
+$rem-fallback:      false;
+
+// The font sizes in our type hierarchy as tee shirt sizes.
+$font-size: (
+  xxl:              32px,
+  xl:               24px,
+  l:                20px,
+  m:                $base-font-size,
+  s:                14px,
+  xs:               10px
+);
+
+// Typey allows you to alter font weights site-wide with this map.
+$font-weight: (
+  bold:             bold,
+  medium:           500,
+  normal:           normal,
+  light:            300,
+  lighter:          lighter,
+);
+
+// Monospace font stacks.
+$menlo:           Menlo, 'DejaVu Sans Mono', 'Ubuntu Mono', Courier, 'Courier New', monospace, sans-serif;
+
+// The font faces you specify in the $typefaces map can be used in the
+// typeface() mixin.
+$typefaces: (
+  monospace: (
+    font-family: $menlo,
+  ),
+);
+
+// Output a horizontal grid to help with debugging typography.
+$typey-debug: false;
+
+// Debug grid coloring
+$typey-debug-color:        #4affff !default;
+
+// Miscellaneous variable
+$indent-amount: 2 * $base-font-size;
diff --git a/themes/bs_bootstrap/css/base/elements.css b/themes/bs_bootstrap/css/base/elements.css
index c4833e0..3fe6af9 100644
--- a/themes/bs_bootstrap/css/base/elements.css
+++ b/themes/bs_bootstrap/css/base/elements.css
@@ -1,3 +1,4 @@
+
 html {
   box-sizing: border-box;
 }
diff --git a/themes/bs_bootstrap/css/base/normalize.css b/themes/bs_bootstrap/css/base/normalize.css
index 010d7f6..909c542 100644
--- a/themes/bs_bootstrap/css/base/normalize.css
+++ b/themes/bs_bootstrap/css/base/normalize.css
@@ -1,4 +1,5 @@
-/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
+
+
 html {
   font-family: sans-serif;
   line-height: 1.15;
diff --git a/themes/bs_bootstrap/css/base/transitions.css b/themes/bs_bootstrap/css/base/transitions.css
index c5a8107..9f63cc8 100644
--- a/themes/bs_bootstrap/css/base/transitions.css
+++ b/themes/bs_bootstrap/css/base/transitions.css
@@ -1,3 +1,4 @@
+
 .fade {
   opacity: 0;
   transition: opacity 0.15s linear;
diff --git a/themes/bs_bootstrap/css/base/util.css b/themes/bs_bootstrap/css/base/util.css
index c87ad73..39f0e1a 100644
--- a/themes/bs_bootstrap/css/base/util.css
+++ b/themes/bs_bootstrap/css/base/util.css
@@ -1,3 +1,4 @@
+
 .sr-only {
   position: absolute;
   width: 1px;
@@ -137,60 +138,48 @@ a.text-gray-dark:focus, a.text-gray-dark:hover {
 }
 
 @media (min-width: 576px) {
-
   .text-sm-left {
     text-align: left !important;
   }
-
   .text-sm-right {
     text-align: right !important;
   }
-
   .text-sm-center {
     text-align: center !important;
   }
 }
 
 @media (min-width: 768px) {
-
   .text-md-left {
     text-align: left !important;
   }
-
   .text-md-right {
     text-align: right !important;
   }
-
   .text-md-center {
     text-align: center !important;
   }
 }
 
 @media (min-width: 992px) {
-
   .text-lg-left {
     text-align: left !important;
   }
-
   .text-lg-right {
     text-align: right !important;
   }
-
   .text-lg-center {
     text-align: center !important;
   }
 }
 
 @media (min-width: 1200px) {
-
   .text-xl-left {
     text-align: left !important;
   }
-
   .text-xl-right {
     text-align: right !important;
   }
-
   .text-xl-center {
     text-align: center !important;
   }
diff --git a/themes/bs_bootstrap/css/components/block.css b/themes/bs_bootstrap/css/components/block.css
index 1efcc5c..55a1cd9 100644
--- a/themes/bs_bootstrap/css/components/block.css
+++ b/themes/bs_bootstrap/css/components/block.css
@@ -1,3 +1,4 @@
+
 .block {
   margin-top: 1rem;
   margin-bottom: 1rem;
diff --git a/themes/bs_bootstrap/css/components/breadcrumb.css b/themes/bs_bootstrap/css/components/breadcrumb.css
index 945cbd6..91d857a 100644
--- a/themes/bs_bootstrap/css/components/breadcrumb.css
+++ b/themes/bs_bootstrap/css/components/breadcrumb.css
@@ -1,3 +1,4 @@
+
 .breadcrumb {
   padding: 0.75rem 0;
   margin-bottom: 1rem;
diff --git a/themes/bs_bootstrap/css/components/buttons.css b/themes/bs_bootstrap/css/components/buttons.css
index 4f039b0..b901cf4 100644
--- a/themes/bs_bootstrap/css/components/buttons.css
+++ b/themes/bs_bootstrap/css/components/buttons.css
@@ -1,3 +1,4 @@
+
 .btn {
   display: inline-block;
   font-weight: normal;
diff --git a/themes/bs_bootstrap/css/components/carousel.css b/themes/bs_bootstrap/css/components/carousel.css
index 5218aef..bab8860 100644
--- a/themes/bs_bootstrap/css/components/carousel.css
+++ b/themes/bs_bootstrap/css/components/carousel.css
@@ -1,3 +1,4 @@
+
 .carousel {
   position: relative;
 }
@@ -181,7 +182,6 @@
 }
 
 @media (-webkit-transform-3d) {
-
   .carousel-item {
     transition: -webkit-transform 0.6s ease-in-out;
     transition: transform 0.6s ease-in-out;
@@ -191,19 +191,16 @@
     -webkit-perspective: 1000px;
     perspective: 1000px;
   }
-
   .carousel-item-next.carousel-item-left,
   .carousel-item-prev.carousel-item-right {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
-
   .carousel-item-next,
   .active.carousel-item-right {
     -webkit-transform: translate3d(100%, 0, 0);
     transform: translate3d(100%, 0, 0);
   }
-
   .carousel-item-prev,
   .active.carousel-item-left {
     -webkit-transform: translate3d(-100%, 0, 0);
diff --git a/themes/bs_bootstrap/css/components/close.css b/themes/bs_bootstrap/css/components/close.css
index e7228e9..e112eab 100644
--- a/themes/bs_bootstrap/css/components/close.css
+++ b/themes/bs_bootstrap/css/components/close.css
@@ -1,3 +1,4 @@
+
 .close {
   float: right;
   font-size: 1.5rem;
diff --git a/themes/bs_bootstrap/css/components/dropdown.css b/themes/bs_bootstrap/css/components/dropdown.css
index 74556fe..a8cf48e 100644
--- a/themes/bs_bootstrap/css/components/dropdown.css
+++ b/themes/bs_bootstrap/css/components/dropdown.css
@@ -1,3 +1,4 @@
+
 .dropup,
 .dropdown {
   position: relative;
diff --git a/themes/bs_bootstrap/css/components/entity.css b/themes/bs_bootstrap/css/components/entity.css
index 88f7ae9..74dcefc 100644
--- a/themes/bs_bootstrap/css/components/entity.css
+++ b/themes/bs_bootstrap/css/components/entity.css
@@ -1,3 +1,4 @@
+
 .embedded-entity.align-left {
   margin-right: 1rem;
 }
diff --git a/themes/bs_bootstrap/css/components/forms.css b/themes/bs_bootstrap/css/components/forms.css
index 7a82264..9cb4bed 100644
--- a/themes/bs_bootstrap/css/components/forms.css
+++ b/themes/bs_bootstrap/css/components/forms.css
@@ -1,3 +1,4 @@
+
 .form-control {
   display: block;
   width: 100%;
@@ -275,7 +276,6 @@ label {
 }
 
 @media (min-width: 576px) {
-
   .form-inline label {
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -288,7 +288,6 @@ label {
     justify-content: center;
     margin-bottom: 0;
   }
-
   .form-inline .form-group {
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -304,26 +303,21 @@ label {
     align-items: center;
     margin-bottom: 0;
   }
-
   .form-inline .form-control {
     display: inline-block;
     width: auto;
     vertical-align: middle;
   }
-
   .form-inline .form-control-static {
     display: inline-block;
   }
-
   .form-inline .input-group {
     width: auto;
   }
-
   .form-inline .form-control-label {
     margin-bottom: 0;
     vertical-align: middle;
   }
-
   .form-inline .form-check {
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -338,18 +332,15 @@ label {
     margin-top: 0;
     margin-bottom: 0;
   }
-
   .form-inline .form-check-label {
     padding-left: 0;
   }
-
   .form-inline .form-check-input {
     position: relative;
     margin-top: 0;
     margin-right: 0.25rem;
     margin-left: 0;
   }
-
   .form-inline .custom-control {
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -362,14 +353,12 @@ label {
     justify-content: center;
     padding-left: 0;
   }
-
   .form-inline .custom-control-indicator {
     position: static;
     display: inline-block;
     margin-right: 0.25rem;
     vertical-align: text-bottom;
   }
-
   .form-inline .has-feedback .form-control-feedback {
     top: 0;
   }
diff --git a/themes/bs_bootstrap/css/components/messages.css b/themes/bs_bootstrap/css/components/messages.css
index a818895..d62a800 100644
--- a/themes/bs_bootstrap/css/components/messages.css
+++ b/themes/bs_bootstrap/css/components/messages.css
@@ -1,3 +1,4 @@
+
 .alert {
   padding: 0.75rem 1.25rem;
   margin-bottom: 1rem;
diff --git a/themes/bs_bootstrap/css/components/modal.css b/themes/bs_bootstrap/css/components/modal.css
index 792ba0f..3b8b9c5 100644
--- a/themes/bs_bootstrap/css/components/modal.css
+++ b/themes/bs_bootstrap/css/components/modal.css
@@ -1,3 +1,4 @@
+
 .modal-open {
   overflow: hidden;
 }
@@ -129,19 +130,16 @@
 }
 
 @media (min-width: 576px) {
-
   .modal-dialog {
     max-width: 500px;
     margin: 30px auto;
   }
-
   .modal-sm {
     max-width: 300px;
   }
 }
 
 @media (min-width: 992px) {
-
   .modal-lg {
     max-width: 800px;
   }
diff --git a/themes/bs_bootstrap/css/components/nav.css b/themes/bs_bootstrap/css/components/nav.css
index f4dd94c..579d7d1 100644
--- a/themes/bs_bootstrap/css/components/nav.css
+++ b/themes/bs_bootstrap/css/components/nav.css
@@ -1,3 +1,4 @@
+
 .nav {
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/themes/bs_bootstrap/css/components/navbar.css b/themes/bs_bootstrap/css/components/navbar.css
index 19d1194..0630f2d 100644
--- a/themes/bs_bootstrap/css/components/navbar.css
+++ b/themes/bs_bootstrap/css/components/navbar.css
@@ -1,3 +1,4 @@
+
 .nav {
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -181,17 +182,14 @@
 }
 
 @media (min-width: 768px) {
-
   .navbar__inner .row {
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
     flex-direction: row;
   }
-
   .navbar-toggler {
     display: none;
   }
-
   .navbar-collapse {
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -206,22 +204,18 @@
     -ms-flex-align: center;
     align-items: center;
   }
-
   .navbar-collapse .navbar-nav {
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
     flex-direction: row;
   }
-
   .navbar-collapse .navbar-nav .nav-link {
     padding-right: .5rem;
     padding-left: .5rem;
   }
-
   .navbar-collapse .navbar-toggler {
     display: none;
   }
-
   .navbar-nav {
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
diff --git a/themes/bs_bootstrap/css/components/node.css b/themes/bs_bootstrap/css/components/node.css
index 6e9da26..857424e 100644
--- a/themes/bs_bootstrap/css/components/node.css
+++ b/themes/bs_bootstrap/css/components/node.css
@@ -1,3 +1,5 @@
+
+
 .node-preview-container {
   width: auto;
   padding: 1rem;
diff --git a/themes/bs_bootstrap/css/components/pagination.css b/themes/bs_bootstrap/css/components/pagination.css
index 61ef8ca..e92855e 100644
--- a/themes/bs_bootstrap/css/components/pagination.css
+++ b/themes/bs_bootstrap/css/components/pagination.css
@@ -1,3 +1,4 @@
+
 .pagination {
   display: -webkit-flex;
   display: -ms-flexbox;
diff --git a/themes/bs_bootstrap/css/components/popover.css b/themes/bs_bootstrap/css/components/popover.css
index a4066e4..48ebe30 100644
--- a/themes/bs_bootstrap/css/components/popover.css
+++ b/themes/bs_bootstrap/css/components/popover.css
@@ -1,3 +1,4 @@
+
 .popover {
   position: absolute;
   top: 0;
diff --git a/themes/bs_bootstrap/css/components/tooltip.css b/themes/bs_bootstrap/css/components/tooltip.css
index b167008..f4d785b 100644
--- a/themes/bs_bootstrap/css/components/tooltip.css
+++ b/themes/bs_bootstrap/css/components/tooltip.css
@@ -1,3 +1,4 @@
+
 .tooltip {
   position: absolute;
   z-index: 1070;
diff --git a/themes/bs_bootstrap/css/layout/layout.css b/themes/bs_bootstrap/css/layout/layout.css
index f9e708e..2d55530 100644
--- a/themes/bs_bootstrap/css/layout/layout.css
+++ b/themes/bs_bootstrap/css/layout/layout.css
@@ -1,3 +1,4 @@
+
 .container {
   position: relative;
   margin-left: auto;
@@ -17,6 +18,7 @@
   margin-left: -15px;
 }
 
+
 .page__header .row {
   -webkit-justify-content: space-between;
       -ms-flex-pack: justify;
@@ -28,6 +30,7 @@
   padding-left: 15px;
 }
 
+
 .page__main {
   margin-top: 3rem;
   margin-bottom: 3rem;
@@ -42,6 +45,7 @@
   padding-left: 15px;
 }
 
+
 .page__footer__content .region {
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -80,50 +84,41 @@
 }
 
 @media (min-width: 576px) {
-
   .container {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .container {
     width: 540px;
     max-width: 100%;
   }
-
   .row {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__header .region {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__content--with-sidebar .page__content-col,
   .page__content--with-sidebar .region-content-sidebar {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer__content .block {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer__content .block {
     -webkit-flex: 1;
     -ms-flex: 1;
     flex: 1;
     width: auto;
   }
-
   .page__footer .region-footer-copyright {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__footer .region-footer-copyright .block {
     padding-right: 15px;
     padding-left: 15px;
@@ -131,64 +126,53 @@
 }
 
 @media (min-width: 768px) {
-
   .container {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .container {
     width: 720px;
     max-width: 100%;
   }
-
   .row {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__header .region {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__content--with-sidebar .page__content-col,
   .page__content--with-sidebar .region-content-sidebar {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__content--with-sidebar .page__content-col {
     -webkit-flex: 0 0 75%;
     -ms-flex: 0 0 75%;
     flex: 0 0 75%;
     max-width: 75%;
   }
-
   .page__content--with-sidebar .region-content-sidebar {
     -webkit-flex: 0 0 25%;
     -ms-flex: 0 0 25%;
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .page__footer__content .region {
     -webkit-flex: 1;
     -ms-flex: 1;
     flex: 1;
     width: auto;
   }
-
   .page__footer__content .block {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer .region-footer-copyright {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__footer .region-footer-copyright .block {
     padding-right: 15px;
     padding-left: 15px;
@@ -196,43 +180,35 @@
 }
 
 @media (min-width: 992px) {
-
   .container {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .container {
     width: 960px;
     max-width: 100%;
   }
-
   .row {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__header .region {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__content--with-sidebar .page__content-col,
   .page__content--with-sidebar .region-content-sidebar {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer__content .block {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer .region-footer-copyright {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__footer .region-footer-copyright .block {
     padding-right: 15px;
     padding-left: 15px;
@@ -240,43 +216,35 @@
 }
 
 @media (min-width: 1200px) {
-
   .container {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .container {
     width: 1140px;
     max-width: 100%;
   }
-
   .row {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__header .region {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__content--with-sidebar .page__content-col,
   .page__content--with-sidebar .region-content-sidebar {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer__content .block {
     padding-right: 15px;
     padding-left: 15px;
   }
-
   .page__footer .region-footer-copyright {
     margin-right: -15px;
     margin-left: -15px;
   }
-
   .page__footer .region-footer-copyright .block {
     padding-right: 15px;
     padding-left: 15px;
diff --git a/themes/bs_bootstrap/css/theme/print.css b/themes/bs_bootstrap/css/theme/print.css
index b76bd84..13e2707 100644
--- a/themes/bs_bootstrap/css/theme/print.css
+++ b/themes/bs_bootstrap/css/theme/print.css
@@ -1,3 +1,4 @@
+
 @media print {
     *,
   *::before,
diff --git a/themes/bs_bootstrap/css/theme/theme.css b/themes/bs_bootstrap/css/theme/theme.css
index 2f34814..763c8de 100644
--- a/themes/bs_bootstrap/css/theme/theme.css
+++ b/themes/bs_bootstrap/css/theme/theme.css
@@ -1,67 +1,158 @@
-h1, .h1 {
+
+
+
+html {
+  font-size: 100%;
+  line-height: 1.5em;
+  -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+          text-size-adjust: 100%;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+}
+
+abbr[title] {
+  border-bottom: 0;
+  text-decoration: underline dotted;
+}
+
+pre,
+code,
+kbd,
+samp,
+var {
+  font-family: Menlo, "DejaVu Sans Mono", "Ubuntu Mono", Courier, "Courier New", monospace, sans-serif;
+  font-size: 1rem;
+}
+
+small {
+  font-size: 0.875rem;
+}
+
+sub,
+sup {
+  font-size: 0.625rem;
+  position: relative;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+h1,
+.h1 {
+  font-size: 2rem;
   line-height: 3rem;
   margin-top: 1.5rem;
-  margin-bottom: 3rem;
+  margin-bottom: 1.5rem;
 }
 
-h2, .h2 {
-  line-height: 3rem;
+h2,
+.h2 {
+  font-size: 1.5rem;
+  line-height: 2.25rem;
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
 }
 
-h3, .h3 {
-  line-height: 1.5rem;
+h3,
+.h3 {
+  font-size: 1.25rem;
+  line-height: 2.25rem;
   margin-top: 1.5rem;
-  margin-bottom: 0rem;
+  margin-bottom: 1.5rem;
 }
 
-h4, .h4 {
+h4,
+.h4 {
+  font-size: 1rem;
   line-height: 1.5rem;
   margin-top: 1.5rem;
-  margin-bottom: 0rem;
+  margin-bottom: 1.5rem;
 }
 
-h5, .h5 {
+h5,
+.h5 {
+  font-size: 0.875rem;
   line-height: 1.5rem;
   margin-top: 1.5rem;
-  margin-bottom: 0rem;
+  margin-bottom: 1.5rem;
 }
 
-h6, .h6 {
+h6,
+.h6 {
+  font-size: 0.625rem;
   line-height: 1.5rem;
   margin-top: 1.5rem;
-  margin-bottom: 0rem;
+  margin-bottom: 1.5rem;
 }
 
-p, ul, ol, pre, table, blockquote {
-  margin-top: 0rem;
-  margin-bottom: 1.5rem;
+blockquote {
+  margin: 1.5rem 2rem;
 }
 
-ul ul, ol ol, ul ol, ol ul {
-  margin-top: 0rem;
-  margin-bottom: 0rem;
+dl,
+menu,
+ol,
+ul {
+  margin: 1.5rem 0;
 }
 
-hr, .hr {
-  border: 1px solid;
-  margin: -1px 0;
+ol ol,
+ol ul,
+ul ol,
+ul ul {
+  margin: 0;
 }
 
-sub, sup {
-  position: relative;
-  vertical-align: baseline;
+dd {
+  margin: 0 0 0 32px;
 }
 
-sup {
-  top: -0.5em;
+.divider,
+hr {
+  margin: 1.5rem 0;
+  border: 0;
+  border-top: 1px solid;
 }
 
-sub {
-  bottom: -0.25em;
+.divider > :first-child, hr > :first-child {
+  margin-top: 1.5rem;
+}
+
+hr {
+  box-sizing: content-box;
+  height: 0;
+  overflow: visible;
+}
+
+p,
+pre {
+  margin: 1.5rem 0;
+}
+
+table {
+  margin: 1.5rem 0;
+  border-collapse: collapse;
+  border-spacing: 0;
+  width: 100%;
 }
 
+td,
+th {
+  padding: 0;
+}
+
+
 .page__footer {
   background-color: #eceeef;
   color: #292b2c;
@@ -97,6 +188,7 @@ sub {
   color: #299bfd;
 }
 
+
 .navbar-brand {
   font-size: 1.25rem;
   line-height: inherit;
@@ -160,3 +252,12 @@ sub {
 .navbar .navbar-text {
   color: #0275d8;
 }
+
+@media print {
+  html {
+    font-size: 12pt;
+  }
+  abbr[title]::after {
+    content: " (" attr(title) ")";
+  }
+}
diff --git a/themes/bs_bootstrap/package.json b/themes/bs_bootstrap/package.json
index f4f42ab..9d488b5 100644
--- a/themes/bs_bootstrap/package.json
+++ b/themes/bs_bootstrap/package.json
@@ -36,6 +36,7 @@
     "stylelint-config-standard": "^16.0.0",
     "stylelint-order": "^0.3.0",
     "stylelint-scss": "^1.4.3",
-    "stylelint-selector-bem-pattern": "^1.0.0"
+    "stylelint-selector-bem-pattern": "^1.0.0",
+    "typey": "^1.1.1"
   }
 }
diff --git a/themes/bs_bootstrap/sass/theme/base/_elements.scss b/themes/bs_bootstrap/sass/theme/base/_elements.scss
index b5e8e05..187878d 100644
--- a/themes/bs_bootstrap/sass/theme/base/_elements.scss
+++ b/themes/bs_bootstrap/sass/theme/base/_elements.scss
@@ -1,69 +1,4 @@
 @import "init";
 
-// Experimenting with gridlover vertical rythm.
-// @see https://www.gridlover.net/try
-//   Font size:    16
-//   Line height:  1.5
-//   Scale factor: 1.333
-//
-// @todo - Investigate next links
-// - http://typecast.com/blog/4-simple-steps-to-vertical-rhythm
-// - https://scotch.io/tutorials/aesthetic-sass-3-typography-and-vertical-rhythm
-// - https://www.smashingmagazine.com/2012/12/css-baseline-the-good-the-bad-and-the-ugly/
-// and figure something nicer.
-h1, .h1 {
-  line-height: 3rem;
-  margin-top: 1.5rem;
-  margin-bottom: 3rem;
-}
-h2, .h2 {
-  line-height: 3rem;
-  margin-top: 1.5rem;
-  margin-bottom: 1.5rem;
-}
-h3, .h3 {
-  line-height: 1.5rem;
-  margin-top: 1.5rem;
-  margin-bottom: 0rem;
-}
-h4, .h4 {
-  line-height: 1.5rem;
-  margin-top: 1.5rem;
-  margin-bottom: 0rem;
-}
-h5, .h5 {
-  line-height: 1.5rem;
-  margin-top: 1.5rem;
-  margin-bottom: 0rem;
-}
-h6, .h6 {
-  line-height: 1.5rem;
-  margin-top: 1.5rem;
-  margin-bottom: 0rem;
-}
-p, ul, ol, pre, table, blockquote {
-  margin-top: 0rem;
-  margin-bottom: 1.5rem;
-}
-ul ul, ol ol, ul ol, ol ul {
-  margin-top: 0rem;
-  margin-bottom: 0rem;
-}
-
-// Let's make sure all's aligned.
-hr, .hr {
-  border: 1px solid;
-  margin: -1px 0;
-}
-
-sub, sup {
-  //line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-sup {
-  top: -0.5em;
-}
-sub {
-  bottom: -0.25em;
-}
+// Load typey custom code from BS Base.
+@import "bs_base/sass/theme/base/elements";
diff --git a/themes/starterkit_bootstrap/package.json b/themes/starterkit_bootstrap/package.json
index fbb677a..c7364cf 100644
--- a/themes/starterkit_bootstrap/package.json
+++ b/themes/starterkit_bootstrap/package.json
@@ -36,6 +36,7 @@
     "stylelint-config-standard": "^16.0.0",
     "stylelint-order": "^0.3.0",
     "stylelint-scss": "^1.4.3",
-    "stylelint-selector-bem-pattern": "^1.0.0"
+    "stylelint-selector-bem-pattern": "^1.0.0",
+    "typey": "^1.1.1"
   }
 }