Update to Tiny CSS

20 files changed, 752 insertions, 345 deletions

diff --git a/_sass/_base.scss b/_sass/_base.scss
deleted file mode 100644
index dc8d1fa..0000000
--- a/_sass/_base.scss
+++ /dev/null
@@ -1,73 +0,0 @@
-html {
-  font-size: 20px;
-}
-
-body {
-  font-family: $serif;
-  font-size: 20px;
-  margin: 0;
-  padding: 0;
-}
-
-article, aside, p {
-  display: block;
-  margin: 0;
-  padding: 0;
-}
-
-h1, h2, h3, h4, h5, h6 {
-  margin: 0;
-  padding: 0;
-}
-
-strong {
-  font-weight: bold;
-}
-
-em {
-  font-style: italic;
-}
-
-pre, code, kbd {
-  font-family: $monospace;
-}
-
-pre {
-  margin-left: 1rem;
-  margin-right: 1rem;
-}
-
-a {
-  text-decoration: none;
-  background: transparent;
-  color: inherit;
-  cursor: pointer;
-}
-
-time {
-  display: inline;
-}
-
-hr {
-  border-width: 1px;
-  border-color: $gray;
-  border-style: dotted none none none;
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-}
-
-ul, ol {
-  margin: 0;
-}
-
-li {
-  margin: 1rem;
-}
-
-blockquote {
-  margin: 0;
-  padding-left: 1em;
-  padding-right: 3em;
-  font-style: italic;
-  font-size: 1.2rem;
-}
diff --git a/_sass/_brand.scss b/_sass/_brand.scss
deleted file mode 100644
index 9d9eb63..0000000
--- a/_sass/_brand.scss
+++ /dev/null
@@ -1,98 +0,0 @@
-body {
-  color: $gray;
-}
-
-header, footer, main {
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-  @extend .container;
-}
-
-main {
-  padding-left: 1rem;
-  padding-right: 1rem;
-}
-
-a {
-  color: $teal;
-  transition: color 0.4s ease, background-color 0.4s ease;
-
-  &:hover {
-    color: $gray;
-    @extend .hilite;
-  }
-}
-
-kbd {
-  border-style: solid;
-  border-color: $light-gray;
-  border-width: 1px 1px 2px 1px;
-  border-radius: 4px;
-  font-size: 0.8rem;
-  padding: 0 0.3em;
-}
-
-footer {
-  @extend .center;
-  font-family: $sans;
-  font-size: 0.8rem;
-  margin-top: 2rem;
-}
-
-header nav a {
-  display: inline-block;
-  font-family: $monospace;
-  margin-right: 1rem;
-}
-
-time {
-  color: $light-gray;
-  font-style: italic;
-}
-
-hr {
-  width: 20%;
-  margin-left: auto;
-  margin-right: auto;
-  border-color: $light-gray;
-}
-
-aside {
-  width: 66%;
-  // text-align: center;
-  margin-left: auto;
-  margin-right: auto;
-  color: $light-gray;
-}
-
-ul {
-  list-style-type: square;
-}
-
-ol {
-  list-style-type: lower-roman;
-}
-
-.social-icons {
-  a {
-    padding: 0.5em;
-    color: $light-gray;
-    &:hover {
-      color: $gray;
-      background-color: transparent;
-    }
-  }
-}
-
-.about pre {
-  color: $light-gray;
-  margin-left: 0;
-  em {
-    color: $gray;
-    font-style: normal;
-  }
-}
-
-.data-table {
-  font-size: 0.8rem;
-}
diff --git a/_sass/_mixins.scss b/_sass/_mixins.scss
deleted file mode 100644
index f813c72..0000000
--- a/_sass/_mixins.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-@mixin clearfix {
-  &:before {
-    display: table;
-    content: "";
-  }
-
-  &:after {
-    display: table;
-    clear: both;
-    content: "";
-  }
-}
-
-@mixin transition ($param, $time, $type) {
-    -webkit-transition: $param $time $type;
-    -moz-transition: $param $time $type;
-    -o-transition: $param $time $type;
-    -ms-transition: $param $time $type;
-    transition: $param $time $type;
-}
diff --git a/_sass/_print.scss b/_sass/_print.scss
deleted file mode 100644
index e63f187..0000000
--- a/_sass/_print.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-@media print {
-
-  body {
-    font-size: 12pt;
-    color: black;
-  }
-
-  time {
-    color: black;
-  }
-
-  a {
-    color: black;
-    text-decoration: underline;
-  }
-
-  .print-hide {
-    display: none;
-  }
-}
diff --git a/_sass/_respond.scss b/_sass/_respond.scss
deleted file mode 100644
index 863767a..0000000
--- a/_sass/_respond.scss
+++ /dev/null
@@ -1,43 +0,0 @@
-// Set up default container
-.container {
-  display: block;
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-// If we have a decent size screen, we can split columns if we want to
-@media only screen and (min-width: 768px) {
-  .split {
-    @include clearfix;
-
-    .left, .right {
-      width: 50%;
-      margin: 0;
-      padding: 0;
-    }
-
-    .left {
-      float: left;
-    }
-
-    .right {
-      float: right;
-    }
-  }
-}
-
-// Set a layout breakpoint at 768px for tablets
-@media only screen and (min-width: 768px) and (max-width: 799px) {
-  .container {
-    width: 768px;
-  }
-}
-
-// Set a layout breakpoint at 900px for desktops
-@media only screen and (min-width: 800px) {
-  .container {
-    width: 800px;
-  }
-}
diff --git a/_sass/_typography.scss b/_sass/_typography.scss
deleted file mode 100644
index a97953e..0000000
--- a/_sass/_typography.scss
+++ /dev/null
@@ -1,40 +0,0 @@
-body {
-  line-height: 2.2;
-}
-
-h1, h2, h3, h4, h5, h6 {
-  font-family: $sans;
-  font-weight: 200;
-  line-height: 1.3;
-}
-
-h1 {
-  font-size: 2rem;
-  margin-top: 2.5rem;
-  margin-bottom: 1.5rem;
-}
-
-h2 {
-  font-size: 1.5rem;
-  margin-top: 1rem;
-  margin-bottom: 0.5rem;
-}
-
-h1 small {
-  font-size: 1rem;
-  padding-left: 1rem;
-}
-
-pre, code, kbd {
-  font-size: 0.9rem;
-  color: $gray;
-}
-
-pre, code {
-  white-space: pre;
-}
-
-p {
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-}
diff --git a/_sass/_utility.scss b/_sass/_utility.scss
deleted file mode 100644
index 6c0c796..0000000
--- a/_sass/_utility.scss
+++ /dev/null
@@ -1,31 +0,0 @@
-.hilite {
-  background-color: $highlight;
-}
-
-.center {
-  text-align: center;
-}
-
-.align-left {
-  text-align: left;
-}
-
-.align-right {
-  text-align: right;
-}
-
-.sans {
-  font-family: $sans;
-}
-
-.monospace {
-  font-family: $monospace;
-}
-
-.light-gray {
-  color: $light-gray;
-}
-
-.compressed-list li {
-  margin: 0;
-}
diff --git a/_sass/_variables.scss b/_sass/_variables.scss
deleted file mode 100644
index 267a722..0000000
--- a/_sass/_variables.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-// Colors
-$teal: #00819B;
-$gray: #40434E;
-$light-gray: lighten($gray, 21%);
-$highlight: #ffd;
-$white: #fff;
-
-// Fonts
-$sans: 'open_sans', sans-serif;
-$serif: 'merriweather_light', serif;
-$monospace: 'source_code_pro', monospace;
diff --git a/_sass/font-awesome/_icons.scss b/_sass/font-awesome/_icons.scss
index 8e84cb4..e7c4398 100644
--- a/_sass/font-awesome/_icons.scss
+++ b/_sass/font-awesome/_icons.scss
@@ -8,7 +8,7 @@
 // .#{$fa-css-prefix}-heart:before { content: $fa-var-heart; }
 // .#{$fa-css-prefix}-star:before { content: $fa-var-star; }
 // .#{$fa-css-prefix}-star-o:before { content: $fa-var-star-o; }
-// .#{$fa-css-prefix}-user:before { content: $fa-var-user; }
+.#{$fa-css-prefix}-user:before { content: $fa-var-user; }
 // .#{$fa-css-prefix}-film:before { content: $fa-var-film; }
 // .#{$fa-css-prefix}-th-large:before { content: $fa-var-th-large; }
 // .#{$fa-css-prefix}-th:before { content: $fa-var-th; }
@@ -24,7 +24,7 @@
 // .#{$fa-css-prefix}-gear:before,
 // .#{$fa-css-prefix}-cog:before { content: $fa-var-cog; }
 // .#{$fa-css-prefix}-trash-o:before { content: $fa-var-trash-o; }
-// .#{$fa-css-prefix}-home:before { content: $fa-var-home; }
+.#{$fa-css-prefix}-home:before { content: $fa-var-home; }
 // .#{$fa-css-prefix}-file-o:before { content: $fa-var-file-o; }
 // .#{$fa-css-prefix}-clock-o:before { content: $fa-var-clock-o; }
 // .#{$fa-css-prefix}-road:before { content: $fa-var-road; }
@@ -68,7 +68,7 @@
 // .#{$fa-css-prefix}-photo:before,
 // .#{$fa-css-prefix}-image:before,
 // .#{$fa-css-prefix}-picture-o:before { content: $fa-var-picture-o; }
-// .#{$fa-css-prefix}-pencil:before { content: $fa-var-pencil; }
+.#{$fa-css-prefix}-pencil:before { content: $fa-var-pencil; }
 // .#{$fa-css-prefix}-map-marker:before { content: $fa-var-map-marker; }
 // .#{$fa-css-prefix}-adjust:before { content: $fa-var-adjust; }
 // .#{$fa-css-prefix}-tint:before { content: $fa-var-tint; }
@@ -147,7 +147,7 @@
 // .#{$fa-css-prefix}-sign-out:before { content: $fa-var-sign-out; }
 // .#{$fa-css-prefix}-linkedin-square:before { content: $fa-var-linkedin-square; }
 // .#{$fa-css-prefix}-thumb-tack:before { content: $fa-var-thumb-tack; }
-.#{$fa-css-prefix}-external-link:before { content: $fa-var-external-link; }
+// .#{$fa-css-prefix}-external-link:before { content: $fa-var-external-link; }
 // .#{$fa-css-prefix}-sign-in:before { content: $fa-var-sign-in; }
 // .#{$fa-css-prefix}-trophy:before { content: $fa-var-trophy; }
 // .#{$fa-css-prefix}-github-square:before { content: $fa-var-github-square; }
@@ -288,7 +288,7 @@
 // .#{$fa-css-prefix}-flag-o:before { content: $fa-var-flag-o; }
 // .#{$fa-css-prefix}-flag-checkered:before { content: $fa-var-flag-checkered; }
 // .#{$fa-css-prefix}-terminal:before { content: $fa-var-terminal; }
-// .#{$fa-css-prefix}-code:before { content: $fa-var-code; }
+.#{$fa-css-prefix}-code:before { content: $fa-var-code; }
 // .#{$fa-css-prefix}-mail-reply-all:before,
 // .#{$fa-css-prefix}-reply-all:before { content: $fa-var-reply-all; }
 // .#{$fa-css-prefix}-star-half-empty:before,
diff --git a/_sass/font-awesome/_larger.scss b/_sass/font-awesome/_larger.scss
index 41e9a81..94445f2 100644
--- a/_sass/font-awesome/_larger.scss
+++ b/_sass/font-awesome/_larger.scss
@@ -8,6 +8,6 @@
   vertical-align: -15%;
 }
 .#{$fa-css-prefix}-2x { font-size: 2em; }
-.#{$fa-css-prefix}-3x { font-size: 3em; }
-.#{$fa-css-prefix}-4x { font-size: 4em; }
-.#{$fa-css-prefix}-5x { font-size: 5em; }
+// .#{$fa-css-prefix}-3x { font-size: 3em; }
+// .#{$fa-css-prefix}-4x { font-size: 4em; }
+// .#{$fa-css-prefix}-5x { font-size: 5em; }
diff --git a/_sass/font-awesome/font-awesome.scss b/_sass/font-awesome/font-awesome.scss
index c893b48..9517797 100644
--- a/_sass/font-awesome/font-awesome.scss
+++ b/_sass/font-awesome/font-awesome.scss
@@ -9,7 +9,7 @@
 @import "core";
 @import "larger";
 // @import "fixed-width";
-@import "list";
+// @import "list";
 // @import "bordered-pulled";
 // @import "animated";
 // @import "rotated-flipped";
diff --git a/_sass/tiny/_base.scss b/_sass/tiny/_base.scss
new file mode 100644
index 0000000..ba6d78a
--- /dev/null
+++ b/_sass/tiny/_base.scss
@@ -0,0 +1,62 @@
+* {
+  box-sizing: border-box;
+}
+
+body {
+  font-size: $base-font-size;
+  color: $base-color;
+}
+
+a {
+  color: $brand-color;
+  text-decoration: none;
+
+  &:hover,
+  &:active {
+    color: $alternate-color;
+  }
+}
+
+// Horizontal lines
+hr {
+  height: 0;
+  margin: 15px 0;
+  overflow: hidden;
+  background: transparent;
+  border: 0;
+  border-bottom: 1px solid $muted-color;
+  @include clearfix();
+}
+
+p {
+  line-height: 2em;
+}
+
+li {
+  margin-top: 1em;
+  margin-bottom: 1em;
+}
+
+pre {
+  line-height: 1.5em;
+}
+
+blockquote {
+  font-style: italic;
+}
+
+.main-header {
+  padding: 10px;
+  text-align: center;
+  font-family: $sans;
+  @include gradient(lighten($brand-color, 3%), darken($brand-color, 3%));
+  a {
+    color: white;
+    padding: 15px;
+
+    &:active,
+    &:hover {
+      text-decoration: none;
+    }
+  }
+}
diff --git a/_sass/tiny/_fonts.scss b/_sass/tiny/_fonts.scss
new file mode 100644
index 0000000..1b60da6
--- /dev/null
+++ b/_sass/tiny/_fonts.scss
@@ -0,0 +1,30 @@
+// Open Sans
+@font-face {
+    font-family: 'open_sans';
+    src: url('/assets/fonts/OpenSans-Light.eot');
+    src: url('/assets/fonts/OpenSans-Light.woff') format('woff'),
+        url('/assets/fonts/OpenSans-Light.ttf') format('truetype');
+    font-weight: 200;
+    font-style: normal;
+}
+
+// Merriweather
+@font-face {
+    font-family: 'merriweather_light';
+    src: url('/assets/fonts/merriweather-lightitalic-webfont.eot');
+    src: url('/assets/fonts/merriweather-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
+         url('/assets/fonts/merriweather-lightitalic-webfont.woff') format('woff'),
+         url('/assets/fonts/merriweather-lightitalic-webfont.ttf') format('truetype');
+    font-weight: normal;
+    font-style: italic;
+}
+
+@font-face {
+    font-family: 'merriweather_light';
+    src: url('/assets/fonts/merriweather_light-webfont.eot');
+    src: url('/assets/fonts/merriweather_light-webfont.eot?#iefix') format('embedded-opentype'),
+         url('/assets/fonts/merriweather_light-webfont.woff') format('woff'),
+         url('/assets/fonts/merriweather_light-webfont.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+}
diff --git a/_sass/tiny/_layout.scss b/_sass/tiny/_layout.scss
new file mode 100644
index 0000000..bf44757
--- /dev/null
+++ b/_sass/tiny/_layout.scss
@@ -0,0 +1,69 @@
+// Fixed-width, centered column for site content.
+.container {
+  width: $container-width;
+  margin-right: auto;
+  margin-left: auto;
+  @include clearfix;
+}
+
+// Grid system
+//
+// Create rows with `.columns` to clear the floated columns and outdent the
+// padding on `.column`s with negative margin for alignment.
+
+.columns {
+  margin-right: -$grid-gutter;
+  margin-left: -$grid-gutter;
+  @include clearfix;
+}
+
+// Base class for every column (requires a column width from below)
+.column {
+  float: left;
+  padding-right: $grid-gutter;
+  padding-left: $grid-gutter;
+}
+
+// Column widths
+.one-third {
+  width: 33.333333%;
+}
+
+// .two-thirds {
+//   width: 66.666667%;
+// }
+
+// .one-fourth {
+//   width: 25%;
+// }
+
+.one-half {
+  width: 50%;
+}
+
+// .three-fourths {
+//   width: 75%;
+// }
+
+// .one-fifth {
+//   width: 20%;
+// }
+
+// .four-fifths {
+//   width: 80%;
+// }
+
+// Single column hack
+.single-column {
+  padding-right: $grid-gutter;
+  padding-left: $grid-gutter;
+}
+
+// Equal width columns via table sorcery.
+// .table-column {
+//   display: table-cell;
+//   width: 1%;
+//   padding-right: $grid-gutter;
+//   padding-left: $grid-gutter;
+//   vertical-align: top;
+// }
diff --git a/_sass/tiny/_mixins.scss b/_sass/tiny/_mixins.scss
new file mode 100644
index 0000000..3afa7e9
--- /dev/null
+++ b/_sass/tiny/_mixins.scss
@@ -0,0 +1,36 @@
+// Clearfix
+//
+// Clears floats via mixin (avoid using as a class).
+
+@mixin clearfix {
+  &:before {
+    display: table;
+    content: "";
+  }
+
+  &:after {
+    display: table;
+    clear: both;
+    content: "";
+  }
+}
+
+// Text hiding for image based text replacement.
+// Higher performance than -9999px because it only renders
+// the size of the actual text, not a full 9999px box.
+
+@mixin hide-text() {
+  overflow: hidden;
+  text-indent: 100%;
+  white-space: nowrap;
+}
+
+@mixin gradient($start: #fafafa, $end: #eaeaea) {
+  background-color: $end;
+  // FF 3.6+
+  background-image: -moz-linear-gradient($start, $end);
+  // Safari 5.1+, Chrome 10+
+  background-image: -webkit-linear-gradient($start, $end);
+  background-image: linear-gradient($start, $end);
+  background-repeat: repeat-x;
+}
diff --git a/_sass/tiny/_normalize.scss b/_sass/tiny/_normalize.scss
new file mode 100644
index 0000000..4ccb777
--- /dev/null
+++ b/_sass/tiny/_normalize.scss
@@ -0,0 +1,423 @@
+/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
+
+/**
+ * 1. Set default font family to sans-serif.
+ * 2. Prevent iOS and IE text size adjust after device orientation change,
+ *    without disabling user zoom.
+ */
+
+html {
+  font-family: $serif; /* 1 */
+  text-size-adjust: 100%; /* 2 */
+}
+
+/**
+ * Remove default margin.
+ */
+
+body {
+  margin: 0;
+}
+
+/* HTML5 display definitions
+   ========================================================================== */
+
+/**
+ * Correct `block` display not defined for any HTML5 element in IE 8/9.
+ * Correct `block` display not defined for `details` or `summary` in IE 10/11
+ * and Firefox.
+ * Correct `block` display not defined for `main` in IE 11.
+ */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+menu,
+nav,
+section,
+summary {
+  display: block;
+}
+
+/**
+ * 1. Correct `inline-block` display not defined in IE 8/9.
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+ */
+
+// audio,
+// canvas,
+// progress,
+// video {
+//   display: inline-block; /* 1 */
+//   vertical-align: baseline; /* 2 */
+// }
+
+/**
+ * Prevent modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+
+// audio:not([controls]) {
+//   display: none;
+//   height: 0;
+// }
+
+/**
+ * Address `[hidden]` styling not present in IE 8/9/10.
+ * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
+ */
+
+// [hidden],
+// template {
+//   display: none;
+// }
+
+/* Links
+   ========================================================================== */
+
+/**
+ * Remove the gray background color from active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * Improve readability of focused elements when they are also in an
+ * active/hover state.
+ */
+
+a:active,
+a:hover {
+  outline: 0;
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
+ */
+
+abbr[title] {
+  border-bottom: 1px dotted;
+}
+
+/**
+ * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
+ */
+
+b,
+strong {
+  font-weight: bold;
+}
+
+/**
+ * Address styling not present in Safari and Chrome.
+ */
+
+// dfn {
+//   font-style: italic;
+// }
+
+/**
+ * Address variable `h1` font-size and margin within `section` and `article`
+ * contexts in Firefox 4+, Safari, and Chrome.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/**
+ * Address styling not present in IE 8/9.
+ */
+
+// mark {
+//   background: #ff0;
+//   color: #000;
+// }
+
+/**
+ * Address inconsistent and variable font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` affecting `line-height` in all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sup {
+  top: -0.5em;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove border when inside `a` element in IE 8/9/10.
+ */
+
+img {
+  border: 0;
+}
+
+/**
+ * Correct overflow not hidden in IE 9/10/11.
+ */
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * Address margin not present in IE 8/9 and Safari.
+ */
+
+figure {
+  margin: 1em 40px;
+}
+
+/**
+ * Address differences between Firefox and other browsers.
+ */
+
+hr {
+  box-sizing: content-box;
+  height: 0;
+}
+
+/**
+ * Contain overflow in all browsers.
+ */
+
+pre {
+  overflow: auto;
+}
+
+/**
+ * Address odd `em`-unit font size rendering in all browsers.
+ */
+
+code,
+kbd,
+pre,
+samp {
+  font-family: $monospace;
+  font-size: 1em;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
+ * styling of `select`, unless a `border` property is set.
+ */
+
+/**
+ * 1. Correct color not being inherited.
+ *    Known issue: affects color of disabled elements.
+ * 2. Correct font properties not being inherited.
+ * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+ */
+
+// button,
+// input,
+// optgroup,
+// select,
+// textarea {
+//   color: inherit; /* 1 */
+//   font: inherit; /* 2 */
+//   margin: 0; /* 3 */
+// }
+
+/**
+ * Address `overflow` set to `hidden` in IE 8/9/10/11.
+ */
+
+// button {
+//   overflow: visible;
+// }
+
+/**
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
+ * All other form control elements do not inherit `text-transform` values.
+ * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+ * Correct `select` style inheritance in Firefox.
+ */
+
+// button,
+// select {
+//   text-transform: none;
+// }
+
+/**
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ *    and `video` controls.
+ * 2. Correct inability to style clickable `input` types in iOS.
+ * 3. Improve usability and consistency of cursor style between image-type
+ *    `input` and others.
+ */
+
+// button,
+// html input[type="button"], /* 1 */
+// input[type="reset"],
+// input[type="submit"] {
+//   -webkit-appearance: button; /* 2 */
+//   cursor: pointer; /* 3 */
+// }
+
+/**
+ * Re-set default cursor for disabled elements.
+ */
+
+// button[disabled],
+// html input[disabled] {
+//   cursor: default;
+// }
+
+/**
+ * Remove inner padding and border in Firefox 4+.
+ */
+
+// button::-moz-focus-inner,
+// input::-moz-focus-inner {
+//   border: 0;
+//   padding: 0;
+// }
+
+/**
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in
+ * the UA stylesheet.
+ */
+
+// input {
+//   line-height: normal;
+// }
+
+/**
+ * It's recommended that you don't attempt to style these elements.
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
+ *
+ * 1. Address box sizing set to `content-box` in IE 8/9/10.
+ * 2. Remove excess padding in IE 8/9/10.
+ */
+
+// input[type="checkbox"],
+// input[type="radio"] {
+//   box-sizing: border-box; /* 1 */
+//   padding: 0; /* 2 */
+// }
+
+/**
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+ * `font-size` values of the `input`, it causes the cursor style of the
+ * decrement button to change from `default` to `text`.
+ */
+
+// input[type="number"]::-webkit-inner-spin-button,
+// input[type="number"]::-webkit-outer-spin-button {
+//   height: auto;
+// }
+
+/**
+ * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
+ */
+
+// input[type="search"] {
+//   -webkit-appearance: textfield; /* 1 */
+//   box-sizing: content-box; /* 2 */
+// }
+
+/**
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+ * Safari (but not Chrome) clips the cancel button when the search input has
+ * padding (and `textfield` appearance).
+ */
+
+// input[type="search"]::-webkit-search-cancel-button,
+// input[type="search"]::-webkit-search-decoration {
+//   -webkit-appearance: none;
+// }
+
+/**
+ * Define consistent border, margin, and padding.
+ */
+
+// fieldset {
+//   border: 1px solid #c0c0c0;
+//   margin: 0 2px;
+//   padding: 0.35em 0.625em 0.75em;
+// }
+
+/**
+ * 1. Correct `color` not being inherited in IE 8/9/10/11.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+
+// legend {
+//   border: 0; /* 1 */
+//   padding: 0; /* 2 */
+// }
+
+/**
+ * Remove default vertical scrollbar in IE 8/9/10/11.
+ */
+
+// textarea {
+//   overflow: auto;
+// }
+
+/**
+ * Don't inherit the `font-weight` (applied by a rule above).
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+ */
+
+// optgroup {
+//   font-weight: bold;
+// }
+
+/* Tables
+   ========================================================================== */
+
+/**
+ * Remove most spacing between table cells.
+ */
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+td,
+th {
+  padding: 0;
+}
diff --git a/_sass/tiny/_syntax.scss b/_sass/tiny/_syntax.scss
new file mode 100644
index 0000000..1e651cf
--- /dev/null
+++ b/_sass/tiny/_syntax.scss
@@ -0,0 +1,60 @@
+.highlight  { background: #ffffff; }
+.highlight .c { color: #999988; font-style: italic } /* Comment */
+.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
+.highlight .k { font-weight: bold } /* Keyword */
+.highlight .o { font-weight: bold } /* Operator */
+.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
+.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
+.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
+.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
+.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
+.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gr { color: #aa0000 } /* Generic.Error */
+.highlight .gh { color: #999999 } /* Generic.Heading */
+.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
+.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
+.highlight .go { color: #888888 } /* Generic.Output */
+.highlight .gp { color: #555555 } /* Generic.Prompt */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #aaaaaa } /* Generic.Subheading */
+.highlight .gt { color: #aa0000 } /* Generic.Traceback */
+.highlight .kc { font-weight: bold } /* Keyword.Constant */
+.highlight .kd { font-weight: bold } /* Keyword.Declaration */
+.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
+.highlight .kr { font-weight: bold } /* Keyword.Reserved */
+.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
+.highlight .m { color: #009999 } /* Literal.Number */
+.highlight .s { color: #d14 } /* Literal.String */
+.highlight .na { color: #008080 } /* Name.Attribute */
+.highlight .nb { color: #0086B3 } /* Name.Builtin */
+.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
+.highlight .no { color: #008080 } /* Name.Constant */
+.highlight .ni { color: #800080 } /* Name.Entity */
+.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
+.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
+.highlight .nn { color: #555555 } /* Name.Namespace */
+.highlight .nt { color: #000080 } /* Name.Tag */
+.highlight .nv { color: #008080 } /* Name.Variable */
+.highlight .ow { font-weight: bold } /* Operator.Word */
+.highlight .w { color: #bbbbbb } /* Text.Whitespace */
+.highlight .mf { color: #009999 } /* Literal.Number.Float */
+.highlight .mh { color: #009999 } /* Literal.Number.Hex */
+.highlight .mi { color: #009999 } /* Literal.Number.Integer */
+.highlight .mo { color: #009999 } /* Literal.Number.Oct */
+.highlight .sb { color: #d14 } /* Literal.String.Backtick */
+.highlight .sc { color: #d14 } /* Literal.String.Char */
+.highlight .sd { color: #d14 } /* Literal.String.Doc */
+.highlight .s2 { color: #d14 } /* Literal.String.Double */
+.highlight .se { color: #d14 } /* Literal.String.Escape */
+.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
+.highlight .si { color: #d14 } /* Literal.String.Interpol */
+.highlight .sx { color: #d14 } /* Literal.String.Other */
+.highlight .sr { color: #009926 } /* Literal.String.Regex */
+.highlight .s1 { color: #d14 } /* Literal.String.Single */
+.highlight .ss { color: #990073 } /* Literal.String.Symbol */
+.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
+.highlight .vc { color: #008080 } /* Name.Variable.Class */
+.highlight .vg { color: #008080 } /* Name.Variable.Global */
+.highlight .vi { color: #008080 } /* Name.Variable.Instance */
+.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
\ No newline at end of file
diff --git a/_sass/tiny/_type.scss b/_sass/tiny/_type.scss
new file mode 100644
index 0000000..8f873ac
--- /dev/null
+++ b/_sass/tiny/_type.scss
@@ -0,0 +1,12 @@
+h1, h2 {
+  font-family: $sans;
+  font-weight: 200;
+}
+
+h1 {
+  font-size: 3rem;
+}
+
+h2 {
+  font-size: 2rem;
+}
diff --git a/_sass/tiny/_utility.scss b/_sass/tiny/_utility.scss
new file mode 100644
index 0000000..1213070
--- /dev/null
+++ b/_sass/tiny/_utility.scss
@@ -0,0 +1,39 @@
+// Layout
+.centered {
+  display: block;
+  float: none;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+// Text alignment
+.text-right { text-align: right; }
+.text-left { text-align: left; }
+.text-center { text-align: center; }
+
+.sans {
+  font-family: $sans;
+}
+
+.muted {
+  color: $muted-color;
+  a {
+    color: $muted-color;
+    &:active,
+    &:hover {
+      color: $alternate-color;
+    }
+  }
+}
+
+.fancy-table {
+  font-family: $sans;
+  font-size: 80%;
+  td {
+    padding: 7px;
+  }
+
+  tbody tr:nth-child(even) {
+    background-color: #eee;
+  }
+}
diff --git a/_sass/tiny/_variables.scss b/_sass/tiny/_variables.scss
new file mode 100644
index 0000000..1b1a873
--- /dev/null
+++ b/_sass/tiny/_variables.scss
@@ -0,0 +1,12 @@
+$brand-color: #00819B;
+$alternate-color: adjust-hue($brand-color, -120);
+$muted-color: desaturate($brand-color, 100%);
+$base-color: #222;
+
+$base-font-size: 20px;
+$sans: 'open_sans', Helvetica, arial, nimbussansl, liberationsans, freesans, clean, sans-serif;
+$serif: 'merriweather_light';
+$monospace: Consolas, "Liberation Mono", Menlo, Courier, monospace !default;
+
+$container-width: 900px;
+$grid-gutter: 10px;