Add SCSS build

go.mod

@@ -8,4 +8,5 @@ require (
 	github.com/julienschmidt/httprouter v1.3.0
 	github.com/rs/zerolog v1.20.0
 	github.com/spf13/cobra v1.1.3
+	github.com/wellington/go-libsass v0.9.2
 )

go.sum

@@ -255,6 +255,8 @@ github.com/stretchr/testify v1.5.1 h1:nOGnQDM7FYENwehXlg/kFVnos3rEvtKTjRvOWSzb6H
 github.com/stretchr/testify v1.5.1/go.mod h1:5W2xD1RspED5o8YsWQXVCued0rvSQ+mT+I5cxcmMvtA=
 github.com/subosito/gotenv v1.2.0/go.mod h1:N0PQaV/YGNqwC0u51sEeR/aUtSLEXKX9iv69rRypqCw=
 github.com/tmc/grpc-websocket-proxy v0.0.0-20190109142713-0ad062ec5ee5/go.mod h1:ncp9v5uamzpCO7NfCPTXjqaC+bZgJeR0sMTm6dMHP7U=
+github.com/wellington/go-libsass v0.9.2 h1:6Ims04UDdBs6/CGSVK5JC8FNikR5ssrsMMKE/uaO5Q8=
+github.com/wellington/go-libsass v0.9.2/go.mod h1:mxgxgam0N0E+NAUMHLcu20Ccfc3mVpDkyrLDayqfiTs=
 github.com/xiang90/probing v0.0.0-20190116061207-43a291ad63a2/go.mod h1:UETIi67q53MR2AWcXfiuqkDkRtnGDLqkBTpCHuJHxtU=
 github.com/zenazn/goji v0.9.0/go.mod h1:7S9M489iMyHBNxwZnk9/EHS098H4/F6TATF2mIxtB1Q=
 go.etcd.io/bbolt v1.3.2/go.mod h1:IbVyRI1SCnLcuJnV2u8VeU0CEYM7e686BmAb1XKL+uU=
@@ -311,6 +313,7 @@ golang.org/x/net v0.0.0-20190501004415-9ce7a6920f09/go.mod h1:t9HGtf8HONx5eT2rtn
 golang.org/x/net v0.0.0-20190503192946-f4e77d36d62c/go.mod h1:t9HGtf8HONx5eT2rtn7q6eTqICYqUVnKs3thJo3Qplg=
 golang.org/x/net v0.0.0-20190603091049-60506f45cf65/go.mod h1:HSz+uSET+XFnRR8LxR5pz3Of3rY3CfYBVs4xY44aLks=
 golang.org/x/net v0.0.0-20190620200207-3b0461eec859/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
+golang.org/x/net v0.0.0-20190813141303-74dc4d7220e7 h1:fHDIZ2oxGnUZRN6WgWFCbYBjH9uqVPRCUVUDhs0wnbA=
 golang.org/x/net v0.0.0-20190813141303-74dc4d7220e7/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
 golang.org/x/oauth2 v0.0.0-20180821212333-d2e6202438be/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/oauth2 v0.0.0-20190226205417-e64efc72b421/go.mod h1:gOpvHmFTYa4IltrdGE7lF6nIHvwfUNPOp7c8zoXwtLw=

src/buildscss/buildscss.go

@@ -0,0 +1,77 @@
+package buildscss
+
+import (
+	"fmt"
+	"os"
+	"path/filepath"
+
+	"git.handmade.network/hmn/hmn/src/color"
+	"git.handmade.network/hmn/hmn/src/oops"
+	"git.handmade.network/hmn/hmn/src/website"
+	"github.com/spf13/cobra"
+	"github.com/wellington/go-libsass"
+)
+
+var compressed bool
+
+func init() {
+	buildCommand := &cobra.Command{
+		Use:   "buildscss",
+		Short: "Build the website CSS",
+		Run: func(cmd *cobra.Command, args []string) {
+			style := libsass.NESTED_STYLE
+			if compressed {
+				style = libsass.COMPRESSED_STYLE
+			}
+
+			err := compile("src/rawdata/scss/style.scss", "public/style.css", "light", style)
+			if err != nil {
+				fmt.Println(color.Bold + color.Red + "Failed to compile main SCSS." + color.Reset)
+				fmt.Println(err)
+				os.Exit(1)
+			}
+
+			for _, theme := range []string{"light", "dark"} {
+				err := compile("src/rawdata/scss/theme.scss", fmt.Sprintf("public/themes/%s/theme.css", theme), theme, style)
+				if err != nil {
+					fmt.Println(color.Bold + color.Red + "Failed to compile theme SCSS." + color.Reset)
+					fmt.Println(err)
+					os.Exit(1)
+				}
+			}
+		},
+	}
+	buildCommand.Flags().BoolVar(&compressed, "compressed", false, "Minify the output CSS")
+
+	website.WebsiteCommand.AddCommand(buildCommand)
+}
+
+func compile(inpath, outpath string, theme string, style int) error {
+	err := os.MkdirAll(filepath.Dir(outpath), 0755)
+	if err != nil {
+		panic(oops.New(err, "failed to create directory for CSS file"))
+	}
+
+	outfile, err := os.OpenFile(outpath, os.O_WRONLY|os.O_CREATE|os.O_TRUNC, 0644)
+	if err != nil {
+		panic(oops.New(err, "failed to open CSS file for writing"))
+	}
+	defer outfile.Close()
+
+	infile, err := os.Open(inpath)
+	if err != nil {
+		panic(oops.New(err, "failed to open SCSS file"))
+	}
+	compiler, err := libsass.New(outfile, infile,
+		libsass.IncludePaths([]string{
+			"src/rawdata/scss",
+			fmt.Sprintf("src/rawdata/scss/themes/%s", theme),
+		}),
+		libsass.OutputStyle(style),
+	)
+	if err != nil {
+		panic(oops.New(err, "failed to create SCSS compiler"))
+	}
+
+	return compiler.Run()
+}

src/main.go

@@ -1,6 +1,7 @@
 package main
 
 import (
+	_ "git.handmade.network/hmn/hmn/src/buildscss"
 	_ "git.handmade.network/hmn/hmn/src/migration"
 	"git.handmade.network/hmn/hmn/src/website"
 )

src/rawdata/scss/_admin.scss

@@ -0,0 +1,23 @@
+.unapproved-project {
+  border-bottom: 1px solid transparent;
+  padding: 10px;
+  padding-bottom: 20px;
+
+  &.hidden-project {
+    background: -moz-linear-gradient(left,      rgba(132,26,26,0.4) 0%,rgba(132,26,26,0.1) 15%, rgba(132,26,26,0.0) 50%); /* FF3.6-15 */
+    background: -webkit-linear-gradient(left,   rgba(132,26,26,0.4) 0%,rgba(132,26,26,0.1) 15%, rgba(132,26,26,0.0) 50%); /* Chrome10-25,Safari5.1-6 */
+    background: linear-gradient(to right,       rgba(132,26,26,0.4) 0%,rgba(132,26,26,0.1) 15%, rgba(132,26,26,0.0) 50%); /*  W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+  }
+
+  &:last-child {
+    border-bottom-width: 0px;
+  }
+}
+
+.hidden-project-tag {
+  color:red;
+}
+
+a.new-user {
+  display:block;
+}

src/rawdata/scss/_authors.scss

@@ -0,0 +1,70 @@
+.userlist {
+  text-align:center;
+  width:100%;
+  margin:0px auto;
+  padding-top:30px;
+  position:relative;
+  line-height:0em;
+
+  .user {
+    margin:5px;
+    display:inline-block;
+    height:200px;
+    max-height:180px;
+    text-align:left;
+    position:relative;
+    width:296px;
+    border-radius:3px;
+    line-height:1.4em;
+    overflow:hidden;
+    box-shadow:0px 2px 5px rgba(0,0,0,0.20);
+
+    top:0px;
+    transition: box-shadow 0.2s, background-color 0.2s;
+
+    &:hover {
+      box-shadow:0px 3px 7px rgba(0,0,0,0.20);
+    }
+
+    table {
+      /* Border and background color given by theme */
+      border:1px solid transparent;
+      width:100%;
+      height:100%;
+    }
+
+    .bottom {
+      transition: background-color 0.2s;
+    }
+
+    td {
+      vertical-align:top;
+
+      &.avatar {
+        width:100px;
+        height:80px;
+      }
+    }
+
+    .name {
+      text-align:left;
+
+      .username {
+        vertical-align:middle;
+      }
+    }
+
+    .avatar .image {
+      display:block;
+      float:left;
+      width:80px;
+      height:80px;
+      background-size:cover;
+      margin-right:10px;
+    }
+
+    .bio {
+      padding:5px;
+    }
+  }
+}

src/rawdata/scss/_content.scss

@@ -0,0 +1,56 @@
+.text {
+  @include usevar(background-color, text-background);
+}
+
+.underline {
+  text-decoration:underline;
+}
+
+.monospace {
+  font-family: "Fira Mono", monospace;
+  background-color: rgba(0, 0, 0, 0.1);
+  padding: 0.2em 0 0.05em;
+  border-radius: 3px;
+
+  &::before, &::after {
+    content: "\00a0";
+    letter-spacing: -0.2em;
+  }
+}
+
+.center {
+  text-align: center;
+}
+
+.right {
+  text-align: right;
+}
+
+.left {
+  text-align: left;
+}
+
+.justify {
+  text-align:justify;
+  -webkit-hyphens:manual;
+  -moz-hyphens:manual;
+  -ms-hyphens:manual;
+  hyphens:manual;
+}
+
+.spoiler {
+  @include usevar(border-color, spoiler-border);
+
+  border-width: 1px;
+  border-style: dashed;
+  color: transparent;
+
+  &::selection {
+    color: white;
+    background-color: black;
+  }
+}
+
+pre {
+  font-family: monospace;
+}

src/rawdata/scss/_core.scss

@@ -0,0 +1,820 @@
+.noselect {
+  -webkit-touch-callout: none; /* iOS Safari */
+  -webkit-user-select: none;   /* Chrome/Safari/Opera */
+  -khtml-user-select: none;    /* Konqueror */
+  -moz-user-select: none;      /* Firefox */
+  -ms-user-select: none;       /* IE/Edge */
+  user-select: none;           /* non-prefixed version, currently */
+}
+
+* {
+  box-sizing: border-box;
+}
+
+br {
+  border-style: none; // why, IE...
+}
+
+body {
+  @include usevar(background-color, main-background-color);
+  @include usevar(color, main-color);
+
+  font-family: "Fira Sans", sans-serif;
+  background-size: cover;
+  min-height: 100vh;
+  box-sizing: border-box;
+  font-size: px2rem(14px);
+  line-height: 1.5em;
+  font-weight: 400;
+}
+
+a {
+  @include usevar(color, link-color);
+  @include usevar(border-bottom-color, link-border-color);
+
+  border-bottom:none;
+  text-decoration:none;
+
+  &:hover {
+    /* text-decoration:underline; */
+  }
+
+  &.external::after {
+    font-family: "icons";
+    content:" 1";
+    vertical-align:middle;
+  }
+}
+
+ol {
+  list-style-type: decimal;
+}
+
+ul {
+  list-style-type: circle;
+  padding: 0px;
+  margin: 0px;
+}
+
+.list-none {
+  list-style-type: none;
+}
+
+li {
+  padding: 0px;
+  margin: 0px;
+  padding-left: 5px;
+  margin-left: 15px;
+}
+
+h1, h2 {
+  font-weight: 500;
+}
+
+h1, h2, h3, h4 {
+  margin: 0px;
+  margin-bottom: 5px;
+  font-size: px2rem(24px);
+  line-height: 1.25em;
+}
+
+strong {
+  font-weight:600;
+}
+
+em {
+  font-style:italic;
+}
+
+p {
+  box-sizing:border-box;
+  margin:0px;
+  padding:0px;
+}
+
+.p-spaced p {
+  $spacing: 0.6em;
+
+  &:not(:first-child) {
+    margin-top: $spacing;
+  }
+  
+  &:not(:last-child) {
+    margin-bottom: $spacing;
+  }
+}
+
+table {
+  border-collapse:collapse;
+  table-layout:fixed;
+}
+
+th, td {
+  @include usevar(color, fg-font-color);
+}
+
+td {
+  vertical-align:baseline;
+}
+
+tr.line-above {
+  th, td {
+    @include usevar(border-top-color, table-border-color);
+
+    border-top-width: 1px;
+    border-top-style: solid;
+    padding-top:20px;
+  }
+}
+
+hr  {
+  @include usevar(border-top-color, hr-color);
+  @extend .mv3;
+
+  border-width: 1px 0 0;
+  border-top-style: solid;
+  max-width: 300px;
+}
+
+article code {
+  font-family: "Fira Mono", monospace;
+}
+
+.big { font-size:120%; }
+
+.title {
+  font-weight:bold;
+}
+
+.clear {
+  width: 0;
+}
+
+.full {
+  width:100%;
+}
+
+.hidden {
+  display:none;
+}
+
+.empty {
+  padding-left: 20px;
+}
+
+.column h2 {
+  text-align:center;
+  margin-bottom:20px;
+}
+
+.margin-center {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
+.flex-grow-1 {
+  flex-grow: 1;
+}
+
+.b--theme {
+  @include usevar(border-color, theme-color);
+}
+
+.c--dim {
+  @include usevar(color, dim-color);
+}
+
+.c--theme-dim {
+  @include usevar(color, theme-color-dim);
+}
+
+.b--dim {
+  @include usevar(border-color, dim-color);
+}
+
+.b--theme-dim {
+  @include usevar(border-color, theme-color-dim);
+}
+
+.c--dimmer {
+  @include usevar(color, dimmer-color);
+}
+
+.c--theme-dimmer {
+  @include usevar(color, theme-color-dimmer);
+}
+
+.b--dimmer {
+  @include usevar(border-color, dimmer-color);
+}
+
+.b--theme-dimmer {
+  @include usevar(border-color, theme-color-dimmer);
+}
+
+.c--dimmest {
+  @include usevar(color, dimmest-color);
+}
+
+.c--theme-dimmest {
+  @include usevar(color, theme-color-dimmest);
+}
+
+.b--dimmest {
+  @include usevar(border-color, dimmest-color);
+}
+
+.b--theme-dimmest {
+  @include usevar(border-color, theme-color-dimmest);
+}
+
+.bg--dim {
+  @include usevar(background-color, dim-background);
+}
+
+.bg--content {
+  @include usevar(background-color, content-background);
+}
+
+.f8 {
+  font-size: 0.65rem;
+}
+
+.mw-site {
+  max-width: 80rem;
+}
+
+.mh-100 {
+  max-height: 100%;
+}
+
+.mh-50vh {
+  max-height: 50vh;
+}
+
+.mh-60vh {
+  max-height: 60vh;
+}
+
+.mh-70vh {
+  max-height: 70vh;
+}
+
+.mh-80vh {
+  max-height: 80vh;
+}
+
+.fira {
+  font-family: "Fira Sans", sans-serif;
+}
+
+.bi-avoid { break-inside: avoid; }
+.cc-auto { column-count: auto; }
+.cc1 { column-count: 1; }
+.cc2 { column-count: 2; }
+.cc3 { column-count: 3; }
+.cg0 { column-gap: $spacing-none; }
+.cg1 { column-gap: $spacing-extra-small; }
+.cg2 { column-gap: $spacing-small; }
+.cg3 { column-gap: $spacing-medium; }
+.cg4 { column-gap: $spacing-large; }
+.cg5 { column-gap: $spacing-extra-large; }
+
+@media #{$breakpoint-not-small} {
+  .bi-avoid-ns { break-inside: avoid; }
+  .cc-auto-ns { column-count: auto; }
+  .cc1-ns { column-count: 1; }
+  .cc2-ns { column-count: 2; }
+  .cc3-ns { column-count: 3; }
+  .cg0-ns { column-gap: $spacing-none; }
+  .cg1-ns { column-gap: $spacing-extra-small; }
+  .cg2-ns { column-gap: $spacing-small; }
+  .cg3-ns { column-gap: $spacing-medium; }
+  .cg4-ns { column-gap: $spacing-large; }
+  .cg5-ns { column-gap: $spacing-extra-large; }
+
+  .bg--dim-ns {
+    @include usevar(background-color, dim-background);
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .bi-avoid-m { break-inside: avoid; }
+  .cc-auto-m { column-count: auto; }
+  .cc1-m { column-count: 1; }
+  .cc2-m { column-count: 2; }
+  .cc3-m { column-count: 3; }
+  .cg1-m { column-gap: $spacing-extra-small; }
+  .cg2-m { column-gap: $spacing-small; }
+  .cg3-m { column-gap: $spacing-medium; }
+  .cg4-m { column-gap: $spacing-large; }
+  .cg5-m { column-gap: $spacing-extra-large; }
+
+  .bg--dim-m {
+    @include usevar(background-color, dim-background);
+  }
+}
+
+@media #{$breakpoint-large} {
+  .bi-avoid-l { break-inside: avoid; }
+  .cc-auto-l { column-count: auto; }
+  .cc1-l { column-count: 1; }
+  .cc2-l { column-count: 2; }
+  .cc3-l { column-count: 3; }
+  .cg1-l { column-gap: $spacing-extra-small; }
+  .cg2-l { column-gap: $spacing-small; }
+  .cg3-l { column-gap: $spacing-medium; }
+  .cg4-l { column-gap: $spacing-large; }
+  .cg5-l { column-gap: $spacing-extra-large; }
+
+  .bg--dim-l {
+    @include usevar(background-color, dim-background);
+  }
+}
+
+.not-first:first-child {
+  display: none;
+}
+
+.not-first-of-type:first-of-type {
+  display: none;
+}
+
+.not-last:last-child {
+  display: none;
+}
+
+.not-last-of-type:last-of-type {
+  display: none;
+}
+
+.svgicon {
+  svg {
+    fill: currentColor;
+    width: 1em;
+    height: 1em;
+  }
+
+  &:not(.svgicon-nofix) svg {
+    transform: translate(0px,0.1em);
+  }
+}
+
+
+// Tachyons' `center` is unfortunately overloaded by a .center
+// class we have in our own CSS.
+.center-layout {
+  margin-right: auto;
+  margin-left: auto;
+}
+
+header {
+  border-bottom: 2px solid #333;
+
+  .menu-bar {
+    width: 100%;
+    z-index: 10;
+
+    .items a {
+      @extend .pa2;
+      @extend .pv3-ns;
+      @extend .ph3-l;
+
+      font-weight: bold;
+
+      &:first-child {
+        @extend .ml2-ns;
+        @extend .ml3-l;
+      }
+
+      &.patreon {
+        float:right;
+        height:30px;
+        padding-top:18px;
+        display:inline-block;
+      }
+
+      &.project-logo {
+        @extend .pv2;
+      }
+
+      h1 {
+        display: inline;
+      }
+    }
+
+    // TODO(ben): What is the difference between this and .logo?
+    .hmdev-logo {
+      width: 100%;
+
+      @media #{$breakpoint-not-small} {
+        width: px2rem(180px);
+      }
+
+      &.project {
+        width:70px;
+      }
+
+      @keyframes logo-blink {
+        from {
+          opacity: 0.0;
+        }
+        to {
+          opacity: 1.0;
+        }
+      }
+
+      @-webkit-keyframes logo-blink {
+        from {
+          opacity: 0.0;
+        }
+        to {
+          opacity: 1.0;
+        }
+      }
+    }
+
+    .logo {
+      height: px2rem(60px);
+      background-color: #333;
+      margin: 0px;
+      padding: 0px;
+    }
+
+    .underscore {
+      width: 100%;
+      height: 100%;
+      animation: logo-blink 1s infinite alternate;
+      -webkit-animation: logo-blink 1s infinite alternate ease-in-out;
+    }
+
+    .logo, .underscore {
+      background-size: px2rem(140px);
+      background-repeat: no-repeat;
+      background-position: center center;
+    }
+  }
+
+  .user-options {
+    position: relative;
+
+    a {
+      @extend .pa2;
+    }
+  }
+
+  .login, .register {
+    text-align:center;
+  }
+
+  #login-popup {
+    @include usevar(background-color, login-popup-background);
+    @include usevar(color, fg-font-color);
+
+    @extend .pa3;
+
+    border-width: 1px;
+    border-style: dashed;
+    @extend .b--dimmest;
+
+    visibility: hidden;
+    position: absolute;
+    z-index: 12;
+    margin-top: 10px;
+    right: 0px;
+    top: 20px;
+    width: 290px;
+    max-height: 0px;
+    overflow: hidden;
+    opacity: 0;
+
+    transition: all 0.2s;
+
+    &.open {
+      max-height: 170px;
+      opacity: 1;
+      visibility: visible;
+    }
+
+    label {
+      padding-right:10px;
+    }
+  }
+}
+
+footer {
+  .list li:not(:last-child)::after {
+    @extend .c--dimmer;
+
+    @media #{$breakpoint-not-small} {
+      & {
+        content: ' / ';
+      }
+    }
+  }
+}
+
+.content {
+  @include usevar(background-color, content-background);
+
+  text-align:center;
+  margin:auto;
+
+  p {
+    -moz-text-size-adjust:auto;
+    -webkit-text-size-adjust:auto;
+    text-size-adjust:auto;
+  }
+
+  .description {
+    line-height: 1.42em;
+    text-align: left;
+    margin: auto;
+
+    p {
+      margin-bottom: $spacing-small;
+      text-align: left;
+    }
+  }
+
+  > .top-bar {
+      text-align: left;
+  }
+}
+
+.content-block {
+  // TODO: What the heck are these styles
+  /* Background color given by theme */
+  background-repeat:repeat-x;
+  border-radius:2px;
+  text-align:left;
+  width:100%;
+  /* box-shadow: 0px 4px 7px rgba(0,0,0,0.5); /* Not themed */
+  position:relative;
+  box-sizing:border-box;
+
+  &.top-bar {
+    background-image:none;
+  }
+
+  &.language-desc {
+    padding: 10px;
+
+    h3 {
+      margin-left: 10px;
+    }
+  }
+
+  .no-bg {
+    background-image:none;
+    background-color:transparent;
+    box-shadow:none;
+  }
+}
+
+.sidebar {
+  .content-block {
+    &.single {
+      padding:0px; /* for project list, TODO */
+      margin-top:20px;
+    }
+
+    &.top-bar {
+      /* box-shadow: 0px 2px 4px rgba(0,0,0,0.2); /* Not themed */
+      width:80%;
+      display:block;
+      margin:10px auto;
+    }
+  }
+
+  br.sidebar-filler {
+    line-height:20px;
+  }
+
+  .projectlist {
+    background-color:transparent;
+  }
+}
+
+.content-block .bottom-padding, .sidebar .bottom-padding {
+  margin-top: $spacing-medium;
+}
+
+.breadcrumb {
+  &:hover {
+    text-decoration:underline;
+  }
+
+  &.current {
+    text-overflow: clip ellipsis;
+  }
+}
+
+.breadcrumb-before:nth-of-type(n+2)::before {
+  content: '≫';
+}
+
+.optionbar {
+  @extend .b--dimmest;
+
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  text-align: center;
+  border-style: dashed;
+  border-width: 0px;
+  border-bottom-width: 1px;
+
+  @media #{$breakpoint-not-small} {
+    flex-direction: row;
+    text-align: left;
+  }
+
+  &.bottom {
+    border-bottom-width: 0px;
+    border-top-width: 1px;
+  }
+
+  &.center {
+    text-align: center; // TODO: find this and kill it
+  }
+
+  .options {
+    display: flex;
+    flex-direction: column;
+
+    @media #{$breakpoint-not-small} {
+      flex-direction: row;
+    }
+
+    & > * {
+      @extend .ph2;
+      @extend .pv1;
+      @extend .pv2-ns;
+    }
+  }
+
+  #{$buttons} {
+      @include lite-button;
+  }
+
+  .group {
+    display: inline-block;
+    height: 100%;
+    margin: auto;
+  }
+}
+
+.tab {
+  @include usevar(background-color, tab-background);
+  @extend .pa2;
+}
+
+.tab-bar {
+  @include usevar(border-color, tab-border-color);
+
+  width: 100%;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+  box-sizing: border-box;
+
+  .tab-button {
+    @include usevar(background-color, tab-button-background);
+    @include usevar(border-color, tab-border-color);
+
+    height:100%;
+    display:inline-block;
+    padding:10px 15px;
+    line-height:100%;
+    cursor:pointer;
+    border-width: 1px;
+    border-style: solid;
+    box-sizing:border-box;
+
+    &:hover {
+      @include usevar(background-color, tab-button-background-hover);
+    }
+
+    &.current {
+      @include usevar(background-color, tab-button-background-current);
+
+      border-bottom-color: transparent;
+      font-weight:bold;
+      height:105%;
+    }
+  }
+}
+
+.pagination {
+  .page.current {
+    cursor: default;
+    font-weight: 600;
+
+    &:hover {
+      text-decoration: none;
+    }
+  }
+
+  .button {
+    @extend .pv0, .ph2;
+  }
+}
+
+.user-link {
+  position:relative;
+}
+
+// TODO(ben): It appears that this code is inactive because the JS that would
+// create the popups is commented out.
+.user-popup {
+  opacity:0;
+  max-height:0px;
+  width:340px;
+
+  text-align:center;
+
+  transition:max-height 0.2s, opacity 0.1s;
+  box-shadow:0px 2px 5px rgba(0,0,0,0.3);
+
+  overflow:hidden;
+  position:absolute;
+  bottom:0px;
+
+  &.expanded {
+    visibility:visible;
+    max-height:250px;
+    opacity:1;
+  }
+
+  table {
+    /* Background color given by theme */
+    width:100%;
+    position:relative;
+    border-radius:3px;
+    z-index:10;
+  }
+
+  td {
+    vertical-align:top;
+    padding:15px 9px;
+  }
+
+  #avatar {
+    width:100px;
+    height:100px;
+    background-size:contain;
+    background-position:center center;
+    background-repeat:no-repeat;
+    border-radius:3px;
+    margin:0px auto;
+  }
+
+  .username {
+    font-weight:bold;
+  }
+
+  .bottom {
+    /* Border color given by theme */
+    border-top: 1px solid transparent;
+    padding: 15px;
+
+    .bio {
+      vertical-align:top;
+      width:90%;
+    }
+  }
+}
+
+.site-search {
+  width: 100%;
+
+  &:focus {
+    width: 200%;
+  }
+
+  &[type=text].lite {
+    // wow CSS selector priority sucks
+
+    // First transition copied from input .lite
+    transition: border-bottom-color 60ms ease-in-out, width 300ms ease;
+  }
+}
+
+#search_button_homepage {
+  margin:0px;
+  height:100%;
+  height:calc(100% - 2px);
+  border-radius:0px;
+  display:inline-block;
+  display:none;
+}
+
+.background-even:nth-of-type(even) {
+  @include usevar(background-color, background-even-background);
+  // this is the default, and should be overridden by dynamic colors.
+}

src/rawdata/scss/_editor.scss

@@ -0,0 +1,249 @@
+.post-edit {
+  width:90%;
+  margin:auto;
+}
+
+.toolbar {
+  @include usevar('background-color', 'editor-toolbar-background');
+  @include usevar('border-color', 'editor-toolbar-border-color');
+
+  border-radius:3px;
+  height: 2.2em;
+  overflow-y:scroll;
+  transition:all 0.3s;
+  border: 1px solid transparent;
+
+  .button, input[type=button] {
+    @include usevar('background-color', 'editor-toolbar-button-background');
+    @include usevar('border-color', 'editor-toolbar-button-border-color');
+
+    line-height: 2.2em;
+    box-shadow:none;
+    border:0px;
+    border-right:1px solid transparent;
+    border-radius:0px;
+    margin:0px;
+    padding:0px 10px;
+    height:100%;
+    vertical-align:bottom;
+    text-transform:none;
+    font-weight:300;
+
+    &:hover {
+      @include usevar('background-color', 'editor-toolbar-button-background-hover');
+    }
+  }
+
+  input[type="text"] {
+    height:2.2em;
+    border:0px solid transparent; /* Not themed */
+  }
+}
+
+.actionbar {
+  text-align:center;
+}
+
+.editor {
+  .body {
+    width:100%;
+    font-size:13pt;
+    height:25em;
+  }
+
+  .title-edit {
+    width:100%;
+
+    label {
+      font-weight:bold;
+    }
+
+    input {
+      width:100%;
+    }
+  }
+
+  .editreason {
+    label {
+      font-weight:bold;
+    }
+
+    input {
+      width:100%;
+    }
+  }
+
+  .toolbar {
+    width:95%;
+    margin:10px auto;
+
+    select {
+      font-size:10pt;
+      border:0px;
+
+      &:hover {
+        border:0px;
+      }
+
+      &:focus{
+        border:0px;
+      }
+    }
+
+    #bold {
+      font-weight: bold;
+    }
+
+    #italic {
+      font-style: italic;
+    }
+
+    #underline {
+      text-decoration: underline;
+    }
+
+    #monospace {
+      font-family: monospace;
+    }
+
+    #url {
+      text-decoration: underline;
+      font-style: italic;
+    }
+  }
+
+  .actionbar input[type=button] {
+    margin-left:10px;
+    margin-right:10px;
+  }
+}
+
+.edit-form {
+  .error {
+    margin-left:5em;
+    padding:10px;
+    color:red;
+  }
+
+  input[type=text] {
+    min-width:20em;
+  }
+
+  textarea {
+    font-size:13pt;
+  }
+
+  .note {
+    margin-bottom:5px;
+    font-style:italic;
+    font-size:90%;
+  }
+
+  .links {
+    width: 80%;
+    min-height: 200px;
+    height: 15vh;
+  }
+
+  .half {
+    padding:10px;
+    text-align:center;
+  }
+
+  table {
+    width:95%;
+    margin:auto;
+    border-collapse:separate;
+    border-spacing: 0px 10px;
+
+    td {
+      padding-bottom:15px;
+      width:90%;
+
+      &.half {
+        width:50%;
+      }
+      
+      table {
+        width:100%;
+      }
+    }
+  }
+
+  th {
+    text-align:right;
+    font-weight:bold;
+    padding-right:10px;
+    padding-bottom:15px;
+    vertical-align:top;
+    max-width:5em;
+  }
+
+  td table th {
+    text-align:left;
+  }
+
+  .page-options label {
+    font-weight:bold;
+    margin-right:20px;
+  }
+
+  &.profile-edit {
+    .longbio {
+      width: 100%;
+      min-height: 400px;
+      height: 30vh;
+    }
+
+    .avatar-preview {
+      border:1px solid transparent;
+      margin:10px;
+      margin-bottom:0px;
+    }
+
+    textarea.shortbio, 
+    textarea.signature,
+    {
+      min-width:300px;
+      width:50%;
+      min-height: 100px;
+      height:4em;
+    }
+
+    .logo-preview {
+      @include usevar(border-color, 'project-edit-logo-previw-border-color');
+
+      width:200px;
+      border-width: 1px;
+    }
+  }
+
+  &.project-edit {
+    .project_description {
+      width: 100%;
+      min-height: 400px;
+      height: 30vh;
+    }
+
+    input.project_blurb, 
+    input.project_name,
+    {
+      min-width:300px;
+      width:50%;
+    }
+
+    .quota-bar {
+      @include usevar(border-color, 'project-edit-quota-bar-border-color');
+
+      width:500px;
+      border-width: 1px;
+      margin-bottom:10px;
+
+      .quota-filled {
+        @include usevar(background-color, 'project-edit-quota-bar-filled-background');
+
+        height:100%;
+      }
+    }
+  }
+}

src/rawdata/scss/_episodes.scss

@@ -0,0 +1,269 @@
+.episode-list {
+  .description p {
+    line-height:1.42em;
+  }
+
+  h2, h3 {
+    font-size:1em;
+    font-weight:bold;
+  }
+
+  ul {
+    margin-bottom:30px;
+    list-style-type:none;
+    margin-top:-2px;
+  }
+}
+
+// UNUSED(outer_holder)
+#outer_holder .back {
+  margin: 0px auto 20px auto;
+
+  .outer {
+    display: -webkit-box;
+    display: -moz-box;
+    display: -ms-flexbox;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-flex-wrap: wrap;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    -webkit-justify-content: center;
+    justify-content: center;
+
+    & > .sidebar {
+      max-width: 260px;
+
+      & > div {
+        margin: 6px;
+        background-color: #ddd;
+        width: 200px;
+        margin-bottom: 12px;
+      }
+    }
+  }
+
+  article {
+    -webkit-box-flex: 1 1 40%;
+    -moz-box-flex: 1 1 40%;
+    -webkit-flex: 1 1 40%;
+    -ms-flex: 1 1 40%;
+    flex: 1 1 40%;
+  }
+}
+
+// UNUSED
+#player-wrapper {
+  display: inline-block;
+  -webkit-box-flex: 0 1 auto;
+  -moz-box-flex: 0 1 auto;
+  -webkit-flex: 0 1 auto;
+  -ms-flex: 0 1 auto;
+  flex: 0 1 auto;
+  box-shadow: 0px 0px 4px #000;
+}
+
+@media screen {
+  #player-wrapper #player {
+    width: 320px;
+    height: 210px;
+  }
+}
+@media screen and (min-width: 500px) {
+  #player-wrapper #player {
+    width: 480px;
+    height: 300px;
+  }
+}
+@media screen and (min-width: 670px) {
+  #player-wrapper #player {
+    width: 640px;
+    height: 390px;
+  }
+}
+@media screen and (min-width: 890px) {
+  #player-wrapper #player {
+    width: 854px;
+    height: 510px;
+  }
+}
+@media screen and (min-width: 1320px) {
+  #player-wrapper #player {
+    width: 1280px;
+    height: 750px;
+  }
+}
+
+.annotation {
+  display: -webkit-box;
+  display: -moz-box;
+  display: -ms-flexbox;
+  display: -webkit-flex;
+  display: flex;
+  -webkit-flex-wrap: wrap;
+  flex-wrap: wrap;
+  align-items: flex-start;
+
+  .navigation {
+    width: 450px;
+    display: inline-block;
+  }
+
+  .notes {
+    display: inline-block;
+  }
+}
+
+// UNUSED(timecodes)
+nav.timecodes {
+  margin: 0px;
+  max-width: 450px;
+  min-height: 700px;
+  overflow-y: auto;
+  -webkit-box-flex: 0 0 auto;
+  -moz-box-flex: 0 0 auto;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+
+  a {
+    color: #ccc;
+  }
+
+  ul[name=markers] {
+    margin: 0px;
+    padding: 0px;
+    list-style-type: none;
+    font-size: 15px;
+
+    & > li {
+      padding: 4px;
+      display: block;
+      border-bottom: 1px solid #333;
+
+      &:hover {
+        background-color: rgba(0,90,0,0.3);
+      }
+
+      a {
+        display: block;
+        text-decoration: none;
+
+        span.timecode {
+          color: #777777;
+          float: left;
+          font-size: 86%;
+          margin-right: .5em;
+          text-align: right;
+          width: 42px;
+        }
+      }
+    }
+  }
+}
+
+// UNUSED
+#video-notes {
+  min-height: 700px;
+  margin-top: 0px;
+
+  pre {
+    margin-top:1.5em;
+    margin-left: 10px;
+    margin-right: 30px;
+    margin-bottom: 1.5em;
+    padding: 10px;
+    overflow: auto;
+  }
+}
+
+// UNUSED
+#game_icon {
+  background-position: 0px 0px;
+  background-repeat: no-repeat;
+  background-image: url("/images/hero_home_200x114.png");
+  background-size: cover;
+  height: 113px;
+  margin: 0px 0px 4px 0px;
+}
+
+// UNUSED
+.sidebar-heading {
+  margin: 0px 0px 16px;
+  font-size: 18px;
+  line-height: 24px;
+  font-weight: bold;
+  color: #00547c;
+  white-space: nowrap;
+  text-shadow: 1px 1px 2px rgba(0,0,0,0.25);
+  text-align: center;
+}
+
+// Episode Search
+
+.queryContainer {
+  width: 1000px;
+  margin: 15px auto;
+  display: flex;
+  flex-direction: horizontal;
+
+  label {
+    flex-grow: 0;
+    flex-shrink: 0;
+    padding-right: 15px;
+  }
+}
+
+#query {
+  flex-grow: 1;
+}
+
+#results {
+  width: 800px;
+  margin: 0 auto;
+}
+
+.dayContainer:nth-child(2n) {
+  background-color: rgba(0,0,0,0.05);
+}
+
+.dayName {
+  width: 200px;
+  display: inline-block;
+  vertical-align: top;
+  line-height: 16px;
+  box-sizing: border-box;
+  padding: 5px;
+}
+
+.markerList {
+  display: inline-block;
+  width: 600px;
+  box-sizing: border-box;
+  vertical-align: top;
+}
+
+.marker {
+  cursor: pointer;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  display: block;
+  text-decoration: none;
+
+  &:first-child {
+    border: none;
+  }
+
+  &:hover {
+    background-color: rgba(0, 0, 0, 0.1);
+  }
+
+  b {
+    color: black;
+    background-color: rgb(255, 155, 0);
+  }
+}
+
+#resultsSummary {
+  text-align: center;
+  margin: 10px 0;
+}

src/rawdata/scss/_forms.scss

@@ -0,0 +1,216 @@
+.radio, .checkbox {
+  $size: 1.3rem;
+  $margin: 0.5rem;
+
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  padding-left: $size + $margin;
+
+  input {
+    visibility: hidden;
+    position: absolute;
+  }
+
+  label {
+    &::before {
+      @include usevar('color', 'fg-font-color');
+      @include usevar('background-color', 'form-check-background');
+      @include usevar('border-color', 'form-check-border-color');
+
+      position: absolute;
+      left: 0;
+
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      border-width: 1px;
+      border-style: solid;
+
+      content: "";
+
+      width: $size;
+      height: $size;
+
+      transition: border-color 0.2s;
+
+      &:hover {
+        @include usevar('border-color', 'form-check-border-color-hover');
+      }
+    }
+  }
+
+  input:disabled ~ * {
+    opacity: 0.5;
+  }
+}
+
+.radio {
+  label:before {
+    border-radius:50px;
+  }
+
+  input:checked + label:before {
+    content:"\25cf";
+  }
+}
+
+.checkbox {
+  label:before {
+    border-radius:0.1cm;
+  }
+
+  input:checked + label:before {
+    content:"\2713";
+  }
+}
+
+input[type=text],
+input[type=password],
+textarea,
+select,
+{
+  @include usevar('color', 'fg-font-color');
+  @include usevar('background-color', 'form-text-background');
+  @include usevar('border-color', 'form-text-border-color');
+
+  border-width: 1px;
+  border-radius: 2px;
+  transition: border-color 0.3s, background-color 0.3s;
+  outline: none;
+
+  &.lite {
+    background-color: transparent;
+    border-radius: 0;
+    border-width: 2px 0 2px;
+    border-style: solid;
+    border-color: transparent;
+
+    transition: border-bottom-color 60ms ease-in-out;
+
+    &:focus, &:active {
+      background-color: transparent;
+      border-top-color: transparent; // ugh
+      border-bottom-color: var(--input-lite-border);
+    }
+  }
+
+  &:active, &:focus {
+    @include usevar('background-color', 'form-text-background-active');
+    @include usevar('border-color', 'form-text-border-color-active');
+  }
+}
+
+input[type=text], input[type=password] {
+  &:not(.lite) {
+    padding:5px;
+  }
+}
+
+form .note {
+  font-style:italic;
+}
+
+select {
+  padding: 5px 10px;
+}
+
+option[selected] {
+  font-weight:bold;
+}
+
+input, select, textarea {
+  &[disabled] {
+    opacity: 0.5;
+  }
+}
+
+#{$buttons} {
+  @extend .ph3;
+  @extend .pv2;
+
+  @include usevar('color', 'form-button-color');
+  @include usevar('background-color', 'form-button-background');
+  @include usevar('border-color', 'form-button-border-color');
+
+  border-width: 1px;
+  border-style: solid;
+  display: inline-block;
+  border-radius: 2px;
+  transition: background-color 0.1s, border-color 0.1s;
+  cursor: pointer;
+  font-weight: 600;
+
+  &:hover {
+    @include usevar('color', 'form-button-color-active');
+    @include usevar('background-color', 'form-button-background-active');
+  }
+
+  &.lite {
+      @include lite-button;
+  }
+
+  // UNUSED
+  &.inline-button {
+    @include usevar('border-color', 'form-button-inline-border-color');
+
+    margin:5px;
+    box-shadow:none;
+    border-width: 1px;
+    border-style: solid;
+    padding:5px 7px;
+  }
+}
+
+// UNUSED
+.tabbar {
+  height:40px;
+  padding-left:50px;
+  margin-bottom:20px;
+
+  .tab {
+    padding:10px;
+    border-bottom:none;
+
+    &.current {
+      /* Border color given by theme */
+      border-bottom:2px solid transparent;
+    }
+  }
+}
+
+.generic-form {
+  width:60%;
+  max-width:50em;
+  margin:auto;
+  margin-top:50px;
+  padding:50px;
+  border:1px solid transparent;
+  border-bottom-width:0px;
+  border-top-left-radius:3px;
+  border-top-right-radius:3px;
+
+  table {
+    border-collapse: separate;
+    border-spacing: 4px;
+  }
+
+  th {
+    padding-right:10px;
+    text-align:right;
+
+    &.error {
+      color: red;
+      text-align:center;
+    }
+  }
+}
+
+#search_form_input_homepage {
+  @include usevar('background-color', 'landing-search-background');
+
+  &:hover, &:focus {
+    @include usevar('background-color', 'landing-search-background-hover');
+  }
+}

src/rawdata/scss/_forum.scss

@@ -0,0 +1,573 @@
+.display-options {
+  height:100%;
+  padding:0px 20px 0px 20px;
+
+  > * {
+    display:inline-block;
+    vertical-align:middle;
+  }
+}
+
+.forum h3 {
+  margin:0px 80px 0px 20px;
+  font-weight:bold;
+}
+
+.forum-narrow .forum-narrow-hide {
+  display: none;
+}
+
+.thread {
+  @include usevar('color', 'fg-font-color');
+
+  @extend .ma0;
+
+  .forum &:nth-of-type(odd),
+  .feed &:nth-of-type(odd),
+  {
+    @include usevar('background-color', 'forum-even-background');
+  }
+
+  &.more {
+    // background-color: transparent;
+  }
+
+  .profile & {
+    padding-left:15px;
+  }
+
+  .title {
+    font-weight: bold;
+
+    transition: border-bottom-color 0.1s;
+    border-bottom-color: transparent;
+
+    &:hover {
+      border-bottom-color: initial;
+    }
+  }
+
+  &.read {
+    @include usevar('color', 'forum-thread-read-color');
+
+    td {
+      @include usevar('color', 'forum-thread-read-color');
+    }
+
+    a {
+      @include usevar('color', 'forum-thread-read-link-color');
+    }
+
+    .title {
+      font-weight: 500;
+    }
+  }
+
+  .goto {
+    font-size: 200%;
+    width: 30px;
+
+    a {
+      display: block;
+      padding: 0px 10px;
+      box-sizing: border-box;
+      position: relative;
+      line-height: 100%;
+      background-color: transparent;
+    }
+  }
+
+  .forum & .info th {
+    width: 50px;
+  }
+}
+
+.avatar-icon {
+  width: 40px;
+  height: 40px;
+  flex-shrink: 0;
+  border-radius: 100%;
+  overflow: hidden;
+  @include usevar(background-color, dimmest-color);
+
+  &:not(.lite) {
+    .thread & {
+      left: 30px;
+      bottom: 10px;
+    }
+
+    .thread .info & {
+      bottom: 0px;
+      left: 0px;
+    }
+
+    .feed & {
+      left: -50px;
+      bottom: -10px;
+    }
+
+    .project .box & {
+      left: 0px;
+      bottom: -10px;
+    }
+  }
+}
+
+.badge {
+  display: inline-block;
+  border-radius: 1000em;
+  padding: 0 0.8em;
+  font-size: 0.9em;
+  line-height: 1.8em;
+  font-weight: bold;
+
+  &.staff {
+    background-color: #17b2c6;
+    color: white;
+
+    &::before {
+      content: 'Staff';
+    }
+  }
+}
+
+.contents {
+  div.code {
+    @extend .b--dimmer;
+
+    max-width: 100%;
+    max-height: 20em;
+    max-height: 80vh;
+    overflow: auto;
+    -moz-tab-size: 4;
+    tab-size: 4;
+    border-width: 1px;
+    border-style: solid;
+  }
+
+  div + br,
+  blockquote + br,
+  ul + br,
+  ol + br,
+  {
+    display: none;
+  }
+}
+
+.codeblocktable {
+  font-family: "Fira Mono", monospace;
+  font-size:14px;
+  overflow:auto;
+  line-height:1.5em;
+
+  tbody {
+    width:100%;
+  }
+
+  .linenos {
+    @include usevar(color, 'code-line-number-color');
+
+    font-weight:500;
+    padding: 5px;
+    background: rgba(0, 0, 0, 0.15);
+  }
+
+  .code {
+    /* Background color given by theme */
+    padding-right:20px;
+    padding-left:10px;
+    max-width:80em;
+  }
+}
+
+.post {
+  .wiki &,
+  {
+    padding: 0;
+    margin: auto;
+    max-width: 70em;
+  }
+
+  .contents {
+    h1, h2 {
+      margin: 20px 0px;
+    }
+
+    h2 {
+      font-size: 20px;
+    }
+
+    h5, h6 {
+      margin: 10px 0px;
+    }
+
+    strong {
+      font-weight: 500;
+    }
+
+    blockquote {
+      @extend .b--dimmest;
+
+      display: block;
+      margin-top: 0;
+      margin-bottom: 0;
+      padding: 10px 18px;
+      padding-top: 0;
+      padding-bottom: 0;
+      margin-left: 20px;
+      margin-right: 20px;
+      border-left-width: 1px;
+      border-left-style: solid;
+
+      .quotewho {
+        line-height: 2em;
+
+        &::after {
+          content: " said:";
+        }
+      }
+    }
+
+    img {
+      max-width: 100%;
+    }
+  }
+
+  &.bbcode .contents {
+    h1, h2, h3 {
+      display: inline;
+    }
+  }
+
+  .project & .contents h3,
+  .contents h4 {
+    display:block;
+    font-size:18px;
+    margin: 10px 0px;
+  }
+
+  .action.button {
+    padding:0px 10px;
+    margin-top:0px;
+    margin-right:4px;
+    background-color:transparent;
+    font-size:130%;
+    border-radius:0px;
+    border-width:0px;
+    border-bottom-width:2px;
+    transition:border-bottom-width 0.1s;
+
+    &:hover {
+      border-bottom-width:4px;
+    }
+  }
+
+  hr {
+    max-width:90%;
+  }
+
+  .signature {
+    hr {
+      width: 80%;
+    }
+  }
+}
+
+.post .body, .post-preview {
+  .size1 {
+    font-size:12px;
+  }
+
+  .size2 {
+    font-size:13px;
+  }
+
+  .size3 {
+    font-size:14px;
+  }
+
+  .size4 {
+    font-size:15px;
+  }
+
+  .size5 {
+    font-size:16px;
+  }
+}
+
+.blog {
+  .post {
+    .meta {
+      position:relative;
+    }
+
+    &.op .meta {
+      margin-bottom:10px;
+    }
+
+    .badges {
+      width: 40px;
+      font-size: 0.7em;
+      text-align: center;
+    }
+
+    &.op .body {
+      padding-top: 6px;
+
+      .contents {
+        text-align:left;
+      }
+
+      p {
+        margin-top:8px;
+        margin-bottom:8px;
+        text-align:left;
+      }
+    }
+  }
+
+  .sidebar {
+    .post > .author {
+      padding:15px;
+      text-align:center;
+    }
+
+    .recent-posts {
+      text-align:center;
+      padding:15px;
+
+      h2 {
+        display:inline;
+      }
+    }
+
+    .archive ul {
+      list-style-type:none;
+      text-align:left;
+    }
+  }
+
+  .post-list {
+    .post {
+      &:nth-child(even) {
+        background-color: transparent;
+      }
+    }
+  }
+}
+
+.wiki {
+  .post p {
+    margin: 10px 0px;
+  }
+
+  .toc {
+    @include usevar(border-color, 'wiki-border-color');
+
+    border-left-width: 1px;
+
+    .toc-number {
+      @include usevar(color, 'wiki-toc-number-color');
+    }
+
+    ul {
+      list-style-type: none;
+      margin-left: 10px;
+      margin-bottom: 5px;
+    }
+
+    li {
+      margin-left: 0px;
+    }
+  }
+
+  .aside {
+    @include usevar(border-color, 'wiki-border-color');
+
+    border-left-width: 1px;
+    margin-left:20px;
+
+    &::before {
+      margin-left:-20px;
+      margin-right:15px;
+      display:inline-block;
+      width:10px;
+      content:"\21b4 ";
+    }
+
+    .aside-heading {
+      padding:2px;
+      margin:1px;
+      border-radius:3px;
+      border-width:0px;
+      cursor:pointer;
+      display:inline;
+      background-color:transparent;
+    }
+
+    > .aside-body {
+      overflow:hidden;
+      padding-left:10px;
+    }
+
+    &.folded {
+      &::before {
+        content:"\2192 ";
+      }
+
+      > .aside-body {
+        max-height: 0px;
+      }
+    }
+  }
+}
+
+.featured-post .meta .avatar-icon {
+  left:-60px;
+  bottom:-5px;
+}
+
+.blog .body blockquote,
+.wiki .body blockquote {
+    padding-top:1px;
+    padding-bottom:1px;
+}
+
+.content-block.blog {
+  p.title {
+    font-weight:bold;
+
+    a {
+      border-bottom-width:0px;
+
+      &:hover {
+        border-bottom-width:1px;
+      }
+    }
+  }
+}
+
+a.mark_as_read {
+  float: right;
+}
+
+.mark_as_read_toplevel_forum {
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  text-align: center;
+
+  a {
+    text-decoration: underline;
+  }
+}
+
+div.mark_as_read_toplevel_blog {
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  text-align: center;
+
+  a {
+    text-decoration: none;
+  }
+}
+
+.mark_as_read_toplevel_blog 
+div.mark_as_read_site {
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  text-align: center;
+
+  a {
+    text-decoration: none;
+  }
+}
+
+.mark_as_read_site 
+li.post-entry {
+  margin-left:0px;
+  margin-bottom: 3px;
+}
+
+.diff {
+  width:100%;
+  max-height:100vh;
+  overflow-y:scroll;
+  margin-top:20px;
+
+  > .post-source {
+    @include usevar(color, 'fg-font-color');
+    @include usevar(background-color, 'forum-diff-source-background');
+    @include usevar(border-color, 'forum-diff-source-border-color');
+
+    border-width: 1px;
+    border-radius: 2px;
+    font-family: "Fira Mono", monospace;
+    width:49%;
+    box-sizing:border-box;
+    padding: 4px;
+    display:inline-block;
+    vertical-align: top;
+  }
+
+  .diff-replace,
+  .diff-delete,
+  .diff-insert,
+  {
+    border-width: 1px;
+    border-radius:2px;
+    padding:1px;
+  }
+
+  .diff-replace {
+    @include usevar(background-color, 'forum-diff-replace-background');
+    @include usevar(border-color, 'forum-diff-replace-border-color');
+  }
+
+  .diff-delete {
+    @include usevar(background-color, 'forum-diff-delete-background');
+    @include usevar(border-color, 'forum-diff-delete-border-color');
+  }
+
+  .diff-insert {
+    @include usevar(background-color, 'forum-diff-insert-background');
+    @include usevar(border-color, 'forum-diff-insert-border-color');
+  }
+}
+
+.index {
+  list-style-type:none;
+  -webkit-column-count: 3;
+  -moz-column-count: 3;
+  column-count: 3;
+  margin-top:20px;
+
+  .index-category {
+    margin-bottom:20px;
+    -webkit-column-break-inside: avoid;
+    page-break-inside: avoid;
+    break-inside: avoid-column;
+  }
+}
+
+.bbtable {
+  width: 100%;
+  border: 1px solid;
+
+  td, th {
+    border: 1px solid;
+    padding: 4px;
+  }
+
+  th {
+    background: rgba(0, 0, 0, 0.15);
+    font-weight: bold;
+    border-bottom-width: 2px;
+  }
+
+  tbody tr:nth-child(even) {
+    background: rgba(0, 0, 0, 0.05);
+  }
+}

src/rawdata/scss/_globals.scss

@@ -0,0 +1,58 @@
+/*
+Inserts a CSS expression with one or more custom variables.
+You can provide an arbitrary number of strings in the second
+argument, separated by spaces. Any strings corresponding to
+variable names will be replaced by the correct values, while
+other strings are left untouched.
+
+Example usage:
+
+@include usevar(border-color, dimmer-color);
+@include usevar(background, "linear-gradient(" dim-background-transparent "," dim-background ")");
+
+For clarity and to avoid syntax issues, you are encouraged to
+use unquoted strings for variables and quoted strings for
+everything else.
+
+For convenience in common cases, if only a single argument
+is provided and it does not match an existing variable, this
+will throw an error.
+*/
+@mixin usevar($prop, $pieces) {
+  $maprule: ();
+  $varrule: ();
+
+  @each $piece in $pieces {
+    @if map-get($vars, $piece) != null {
+      $maprule: append($maprule, map-get($vars, $piece));
+      $varrule: append($varrule, var(--#{$piece}));
+    } @else {
+      @if length($pieces) == 1 {
+        @error "Var \"#{$piece}\" not defined";
+      }
+
+      $maprule: append($maprule, unquote($piece));
+      $varrule: append($varrule, unquote($piece));
+    }
+  }
+
+  #{$prop}: $maprule;
+  #{$prop}: $varrule;
+}
+
+@function px2rem($px) {
+  @return ($px / 16px) * 1rem;
+}
+
+@mixin lite-button {
+    border: none;
+    background: none;
+    font-weight: normal;
+}
+
+$buttons: "
+  button,
+  .button,
+  input[type=button],
+  input[type=submit]
+";

src/rawdata/scss/_icons.scss

@@ -0,0 +1,73 @@
+@font-face {
+  font-family: icons;
+  src: url("/static/icon/icons.ttf?v=4");
+}
+
+span.icon {
+  font-family: "icons";
+}
+
+span.icon-settings::before {
+  font-family: "icons";
+  content:"0";
+}
+
+span.icon-link::before {
+  font-family: "icons";
+  content:"1";
+}
+
+span.icon-logout::before {
+  font-family: "icons";
+  content:"2";
+}
+
+span.icon-twitter::before {
+  font-family: "icons";
+  content:"#";
+}
+
+span.icon-twitch::before {
+  font-family: "icons";
+  content:"$";
+}
+
+span.icon-github::before {
+  font-family: "icons";
+  content:"%";
+}
+
+span.icon-patreon::before {
+  font-family: "icons";
+  content:"&";
+}
+
+span.icon-youtube::before {
+  font-family: "icons";
+  content:"'";
+}
+
+span.icon-soundcloud::before {
+  font-family: "icons";
+  content:"*";
+}
+
+span.icon-web::before {
+  font-family: "icons";
+  content:"3";
+}
+
+span.icon-itchio::before {
+  font-family: "icons";
+  content:"+";
+}
+
+span.icon-hitbox::before {
+  font-family: "icons";
+  content:",";
+}
+
+span.icon-rss::before {
+  font-family: "icons";
+  content:"4";
+}

src/rawdata/scss/_irc.scss

@@ -0,0 +1,206 @@
+.chat {
+  @include usevar(border-color, 'irc-border-color');
+
+  margin: auto;
+  width: 100%;
+  border: 1px solid transparent;
+  position: relative;
+  overflow: hidden;
+  padding-right: 8px;
+  box-sizing: border-box;
+
+  #tabs {
+    overflow-y: scroll;
+    box-sizing: border-box;
+
+    .hidden {
+      display: none;
+    }
+
+    .current {
+      @include usevar(box-shadow, 'irc-tab-current-shadow');
+    }
+
+    .button {
+      padding-left: 10px;
+      padding-right: 3px;
+      transition: width 0.2s;
+      text-transform: none;
+      vertical-align: top;
+
+      .close-btn {
+        visibility: hidden;
+        opacity: 0;
+        transition: opacity 0.2s;
+
+        display: inline-block;
+        font-size: 9pt;
+        vertical-align: middle;
+        height: 13px;
+        line-height: 11px;
+        width: 13px;
+        margin-left: 5px;
+        padding-left: 2px;
+        padding-right: 3px;
+        border-radius: 3px;
+        border: 1px solid transparent; /* Not themed */
+
+        position: relative;
+        top: -2px;
+      }
+
+      &:hover .close-btn {
+        @include usevar(color, 'irc-tab-close-button-color');
+        @include usevar(background-color, 'irc-tab-close-button-background');
+
+        visibility: visible;
+        opacity: 1;
+      }
+    }
+
+    .new-tab {
+      padding: 0px;
+      padding-left: 10px;
+    }
+  }
+
+  #history {
+    width: 100%;
+    min-height: 300px;
+    height: 50vh;
+    overflow-y: auto;
+    padding-top: 3px;
+    box-sizing: border-box;
+
+    .channel {
+      width: 100%;
+      display: none;
+
+      &.current {
+        display: table;
+      }
+
+      &.hidden {
+        display: none;
+      }
+    }
+
+    .entry {
+      display: table-row;
+      width: 100%;
+      font-size: 11pt;
+
+      &.minor {
+        color: #777;
+        font-size: 10pt;
+      }
+
+      &.alert {
+        color: #dd683b;
+      }
+
+      &.error {
+        color: #880000;
+        font-style: italic;
+      }
+
+      &.action {
+        font-style: italic;
+
+        .msg .action-name {
+          font-weight: bold;
+        }
+      }
+
+      .nick, .msg {
+        display: table-cell;
+        padding: 0px 4px;
+      }
+
+      .nick {
+        @include usevar(border-color, 'irc-nick-border-color');
+
+        font-weight: bold;
+        text-align: right;
+        border-right-width: 1px;
+        border-right-style: solid;
+      }
+
+      .msg {
+        width: 100%;
+
+        .highlight {
+          background-color: #dd683b;
+          color: #fff;
+          padding: 0px 5px;
+        }
+
+        .emote {
+          height: 1.6em;
+          vertical-align: middle;
+        }
+      }
+    }
+  }
+
+  #chatbox {
+    width: 100%;
+  }
+
+  #users {
+    @include usevar(color, 'irc-users-color');
+    @include usevar(background-color, 'irc-users-background');
+    @include usevar(border-color, 'irc-users-border-color');
+
+    position: absolute;
+    border-left-width: 1px;
+    border-left-style: solid;
+    padding: 5px;
+    right: 0px;
+    top: 0px;
+    color: #333;
+    height: 100%;
+    max-width: 20%;
+    width: 20%;
+    transition: right 0.2s;
+    max-height: 100%;
+    overflow-y: auto;
+    box-sizing: border-box;
+
+    &.collapsed {
+      right:-20%;
+    }
+
+    .popout {
+      @include usevar(background-color, 'irc-users-popout-background');
+      @include usevar(border-left-color, 'irc-users-popout-border-color-left');
+      @include usevar(border-right-color, 'irc-users-popout-border-color-right');
+
+      width: 8px;
+      font-size: 7pt;
+      height: 100%;
+      border-radius: 2px;
+      border: 0px solid transparent; /* Not themed */
+      border-left-width: 1px;
+      border-left-style: solid;
+      border-right-width: 1px;
+      border-right-style: solid;
+      position: absolute;
+      top: 0px;
+      left: -8px;
+      box-shadow: 0px 0px 0px transparent; /* Not themed */
+      text-align: center;
+      margin: 0px;
+      cursor: pointer;
+    }
+
+    .op {
+      font-weight: bold;
+    }
+
+    .user {
+      cursor: pointer;
+    }
+  }
+}
+

src/rawdata/scss/_landing.scss

@@ -0,0 +1,86 @@
+.landing {
+  .breadcrumb {
+    padding: 0px 3px;
+
+    &:first-child {
+      padding-left: 0px;
+    }
+  }
+
+  .more {
+    display: block;
+    margin-top: 10px;
+  }
+
+  .contents {
+    margin-bottom: 20px;
+  }
+
+  .showcase {
+    .arrow-container {
+      width: 60px;
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      z-index: 2;
+
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      $svg-scoot: 0.05rem;
+
+      &.left {
+        left: 0;
+        @include usevar(background-image, 'linear-gradient(to right, ' content-background ', rgba(0, 0, 0, 0))');
+
+        svg {
+          transform: translateX(-$svg-scoot);
+        }
+      }
+
+      &.right {
+        right: 0;
+        @include usevar(background-image, 'linear-gradient(to left, ' content-background ', rgba(0, 0, 0, 0))');
+
+        svg {
+          transform: translateX($svg-scoot);
+        }
+      }
+
+      &.hide {
+        opacity: 0;
+        pointer-events: none;
+      }
+
+      .arrow {
+        @include usevar(background-color, content-background);
+        border-radius: 100%;
+        width: 2.4rem;
+        height: 2.4rem;
+        font-size: 1rem;
+        transition: opacity 40ms ease-in-out;
+        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.20);
+
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+  }
+
+  #showcase-items {
+    transition: transform 200ms ease-in-out;
+  }
+
+  .showcase-item {
+    width: 7rem;
+    height: 7rem;
+
+    @media #{$breakpoint-not-small} {
+      width: 10rem;
+      height: 10rem;  
+    }
+  }
+}

src/rawdata/scss/_library.scss

@@ -0,0 +1,21 @@
+.star-btn {
+  border-bottom-width: 2px;
+  @include usevar('background-color', 'library-star-btn-background');
+  @include usevar('border-color', 'library-star-btn-border-color');
+
+  a {
+    @include usevar('border-color', 'library-star-btn-a-border-color');
+
+    &:hover {
+      @include usevar('background-color', 'library-star-btn-a-hover-background');
+    }
+  }
+}
+
+.library-dropcap {
+  width: 1em;
+  height: 1.1em;
+  padding-top: 0.19em;
+  text-align: center;
+  font-size: 2rem;
+}

src/rawdata/scss/_profile.scss

@@ -0,0 +1,52 @@
+.profile {
+  .content {
+    .description {
+      margin:0px auto;
+      max-width:40em;
+    }
+
+    h2 {
+      margin-bottom:10px;
+    }
+  }
+
+  ul.recent-posts, ul.recent-comments {
+    list-style-type:none;
+  }
+
+  ul .entry {
+    margin-left:20px;
+  }
+
+  .entry {
+    .context {
+      font-weight:bold;
+      border-bottom:0px;
+    }
+  }
+
+  .content-block.projects {
+    background-image:none;
+    overflow-y:visible;
+  }
+}
+
+.profile .content-block.avatar,
+.project .content-block.logo {
+  background-color:transparent;
+  background-image:none;
+  box-shadow:none;
+  min-height:200px;
+
+  img {
+    // TODO(ben): Check if this was actually set to anything before
+    // box-shadow: 
+  }
+}
+
+.project .content-block.screenshots,
+.profile .content-block.projects
+{
+  padding:0px;
+  min-height:0em;
+}

src/rawdata/scss/_projects.scss

@@ -0,0 +1,338 @@
+.project {
+  .notice {
+    @include usevar(color, project-notice-text-color);
+
+    a {
+      @include usevar(color, project-notice-text-color);
+      @include usevar(border-bottom-color, project-notice-text-color);
+    }
+  }
+
+  .pair {
+    display: flex;
+    align-items: flex-start;
+
+    .key {
+      font-weight: bold;
+      flex-shrink: 0;
+    }
+
+    .value {
+      text-align: right;
+      flex-grow: 1;
+    }
+  }
+
+  .settings-icon {
+    z-index: 10;
+    position: absolute;
+    width: 25px;
+    height: 25px;
+    right: 5px;
+    top: 5px;
+    margin: 0px;
+    text-align: center;
+    padding: 3px;
+    border-radius: 5px;
+    line-height: 100%;
+    box-sizing: border-box;
+  }
+
+  .screenshots .slideshow {
+    background-color:black;
+  }
+
+  .tags {
+    text-align:center;
+
+    h2 {
+      margin-bottom:5px;
+    }
+
+    li {
+      display:inline-block;
+    }
+  }
+
+  .button-bar {
+    border: none;
+  }
+
+  .forum {
+    h3 {
+      margin: 0;
+    }
+
+    .thread-entry-right {
+      display: none;
+    }
+  }
+}
+
+.notice-unapproved {
+  @include usevar(background-color, notice-unapproved-color);
+}
+
+.notice-hidden {
+  @include usevar(background-color, notice-hidden-color);
+}
+
+.notice-hiatus {
+  @include usevar(background-color, notice-hiatus-color);
+}
+
+.notice-dead {
+  @include usevar(background-color, notice-dead-color);
+}
+
+.notice-lts {
+  @include usevar(background-color, notice-lts-color);
+}
+
+.notice-lts-reqd {
+  @include usevar(background-color, notice-lts-reqd-color);
+}
+
+.project-carousel-container {
+  width: 50rem;
+
+  .project-carousel {
+    box-sizing: content-box;
+    position: relative;
+    height: 12rem;
+
+    @media #{$breakpoint-large} {
+      height: $height-5;
+    }
+  }
+
+  .project-carousel-item {
+    position: absolute;
+    top: 0;
+    left: 0;
+
+    &:not(.active) {
+      display: none;
+    }
+
+    br {
+      line-height: 0.6em;
+    }
+  }
+
+  .project-carousel-description {
+    max-height: 14rem;
+    overflow: hidden;
+  }
+
+  .project-carousel-fade {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 30px;
+
+    @include usevar(background, "linear-gradient(" dim-background-transparent "," dim-background ")")
+  }
+
+  .project-carousel-item-small {
+    &:not(.active) {
+      display: none;
+    }
+  }
+
+  .project-carousel-button {
+    border: 1px solid;
+    @include usevar(border-color, dimmer-color);
+    cursor: pointer;
+
+    transition: all 100ms ease-in-out;
+
+    &:hover {
+      @include usevar(background-color, dimmest-color);
+    }
+
+    &.active {
+      @include usevar(border-color, theme-color);
+      @extend .w2;
+
+      &:hover {
+        @include usevar(background-color, theme-color-dimmest);
+      }
+    }
+  }
+}
+
+.project-card {
+  @include usevar(color, 'fg-font-color');
+  @include usevar(background-color, 'card-background');
+  @include usevar(border-color, 'project-card-border-color');
+
+  transition: box-shadow 0.2s, background-color 0.2s;
+
+  .slideshow & {
+    margin-top:8px;
+  }
+
+  &:hover {
+    @include usevar(background-color, 'card-background-hover');
+
+    & > .title {
+      text-decoration:underline;
+    }
+  }
+
+  .image-container {
+    $image-size: 8rem;
+
+    width: $image-size;
+    min-height: $image-size;
+
+    .image {
+      position: absolute;
+      width: $image-size;
+      top: 0;
+      bottom: 0;
+    }
+  }
+
+  .details {
+    /* Background color given by theme */
+    transition: background-color 0.2s;
+  }
+
+  .badges:empty {
+    display: none;
+  }
+
+  .badge {
+    color: white;
+    border-radius: 5px;
+  }
+}
+
+.projectlist {
+  .sidebar & {
+    padding:0px;
+    width:340px;
+
+    // background-image:none;
+    // background-color:transparent;
+    // box-shadow:none;
+
+    .project-card.more {
+      height:40px;
+      width:326px;
+      padding-top:5px;
+    }
+  }
+}
+
+.screenshots .slide {
+  max-width:100%;
+}
+
+.slideshow {
+  /* Background color and color given by theme */
+  position:relative;
+  background-image:none;
+  overflow:hidden;
+
+  .optionbar {
+    height:30px;
+    text-align:center;
+  }
+
+  .buttons {
+    display:inline-block;
+    height:100%;
+  }
+
+  .button {
+    line-height:100%;
+    padding:5px 8px;
+    font-weight:400;
+
+    &.current {
+      font-weight:600;
+    }
+  }
+
+  #slide-deck {
+    width:100%;
+    position:relative;
+    transition:left 0.3s;
+    left:0px;
+    text-align:center;
+    display:flex;
+    flex-direction:horizontal;
+    justify-content: space-around;
+    align-items: center;
+  }
+
+  .slide {
+    flex: 1 1 100%;
+    position:relative;
+
+    img {
+      margin:auto;
+      max-height:60vh;
+      max-width:100%;
+    }
+  }
+
+  &.cards {
+    #slide-deck {
+      justify-content: flex-start;
+    }
+
+    .slide {
+      flex: 0 1 auto;
+    }
+  }
+}
+
+#project_owner_suggestions {
+  max-height:300px;
+  overflow:auto;
+  position:absolute;
+  border:1px solid transparent;
+
+  #user_template {
+    display:none;
+  }
+}
+
+.user_suggestions {
+  @include usevar(background-color, 'project-user-suggestions-background');
+
+  padding-top: 5px;
+  padding-bottom: 5px;
+
+  &#project_owner_suggestions .user {
+    @include usevar(border-color, 'project-user-suggestions-border-color');
+
+    border-bottom-width: 1px;
+    width: 200px;
+    box-sizing:border-box;
+    cursor:pointer;
+  }
+
+  .user {
+    position:relative;
+    margin-left:50px;
+    display: inline-block;
+    margin-right:10px;
+
+    .avatar-icon {
+      left:-50px;
+      bottom:0px;
+      border-radius:50%;
+      border:2px solid transparent;
+    }
+  }
+}
+
+#project_owners {
+  min-width:50%;
+}

src/rawdata/scss/_showcase.scss

@@ -0,0 +1,7 @@
+.showcase-item {
+  .gradient {
+    width: 100%;
+    height: 114px;
+    background-image: linear-gradient(rgba(0, 0, 0, 0.82), #0000);
+  }
+}

src/rawdata/scss/_streams.scss

@@ -0,0 +1,51 @@
+.streams-container {
+  #empty-message {
+    display: none;
+  }
+
+  .streams {
+    &:empty {
+      display: none;
+
+      + #empty-message {
+        display: block;
+      }
+    }
+  }
+
+  .stream {
+    .live {
+      position: absolute;
+      left: $spacing-small;
+      top: $spacing-small;
+      color: white;
+      background-color: #e91916;
+      font-weight: bold;
+    }
+
+    .viewers {
+      position: absolute;
+      left: $spacing-small;
+      bottom: $spacing-small;
+      color: white;
+      background-color: rgba(0, 0, 0, 0.7);
+    }
+
+    .avatar {
+      padding: 1.5rem;
+    }
+  }
+
+  .twitch-embed-container {
+    padding-bottom: 0%;
+    transition: padding-bottom 400ms ease-in-out;
+
+    &.open {
+      padding-bottom: 150%;
+
+      @media screen and (min-width: 713px) { // magic numbers, Twitch has weird breakpoints
+        padding-bottom: 40.6%;
+      }
+    }
+  }
+}

src/rawdata/scss/_timeline.scss

@@ -0,0 +1,73 @@
+.timeline {
+    &.no-forums .forums {
+        display: none;
+    }
+    &.no-blogs .blogs {
+        display: none;
+    }
+    &.no-wiki .wiki {
+        display: none;
+    }
+    &.no-library .library {
+        display: none;
+    }
+    &.no-snippets .snippets {
+        display: none;
+    }
+
+    .timeline-item {
+        @include usevar(background-color, card-background);
+        @include usevar(color, main-color);
+    }
+}
+
+.timeline-item {
+    /*
+    &:hover {
+        @include usevar(background-color, card-background-hover);
+    }
+    */
+
+    .avatar-icon {
+        border: 2px solid;
+        @include usevar(border-color, theme-color);
+
+        &.big {
+            width: 62px;
+            height: 62px;
+        }
+    }
+
+    .timeline-content-box > * {
+        display: block;
+        max-width: 100%;
+        max-height: 80vh;
+    }
+
+    .timeline-content-box.youtube {
+        // NOTE(asaf): CSS trick to get an iframe to auto resize
+        position: relative;
+        width: 100%;
+        height: 0;
+        padding-bottom: 56.25%; // NOTE(asaf): As percentage of width. Ensures 16:9 aspect ratio.
+
+        & > iframe {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+        }
+    }
+}
+
+.timeline-modal {
+    .container {
+        max-height: 100vh;
+        
+        @media #{$breakpoint-not-small} {
+            width: auto;
+            max-height: calc(100vh - 2rem);
+        }
+    }
+}

src/rawdata/scss/style.scss

@@ -0,0 +1,25 @@
+@import 'tachyons/tachyons';
+
+@import 'globals';
+
+// This defines the $vars variable. Which _variables.scss file gets
+// imported is determined by the include paths of the SCSS compiler.
+@import 'variables';
+
+@import 'core';
+
+@import 'authors';
+@import 'content';
+@import 'editor';
+@import 'episodes';
+@import 'forms';
+@import 'forum';
+@import 'icons';
+@import 'irc';
+@import 'landing';
+@import 'library';
+@import 'profile';
+@import 'projects';
+@import 'showcase';
+@import 'streams';
+@import 'timeline';

src/rawdata/scss/tachyons/scss/_aspect-ratios.scss

@@ -0,0 +1,142 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   ASPECT RATIOS
+
+*/
+
+/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.
+ * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e
+ * Make sure there are no height and width attributes on the embedded media.
+ * Adapted from: https://github.com/suitcss/components-flex-embed
+ *
+ * Example:
+ *
+ * <div class="aspect-ratio aspect-ratio--16x9">
+ *  <iframe class="aspect-ratio--object"></iframe>
+ * </div>
+ *
+ * */
+
+.aspect-ratio {
+  height: 0;
+  position: relative;
+}
+
+.aspect-ratio--16x9 { padding-bottom: 56.25%; }
+.aspect-ratio--9x16 { padding-bottom: 177.77%; }
+
+.aspect-ratio--4x3 {  padding-bottom: 75%; }
+.aspect-ratio--3x4 {  padding-bottom: 133.33%; }
+
+.aspect-ratio--6x4 {  padding-bottom: 66.6%; }
+.aspect-ratio--4x6 {  padding-bottom: 150%; }
+
+.aspect-ratio--8x5 {  padding-bottom: 62.5%; }
+.aspect-ratio--5x8 {  padding-bottom: 160%; }
+
+.aspect-ratio--7x5 {  padding-bottom: 71.42%; }
+.aspect-ratio--5x7 {  padding-bottom: 140%; }
+
+.aspect-ratio--1x1 {  padding-bottom: 100%; }
+
+.aspect-ratio--object {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 100;
+}
+
+@media #{$breakpoint-not-small}{
+    .aspect-ratio-ns {
+      height: 0;
+      position: relative;
+    }
+    .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }
+    .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }
+    .aspect-ratio--4x3-ns {  padding-bottom: 75%; }
+    .aspect-ratio--3x4-ns {  padding-bottom: 133.33%; }
+    .aspect-ratio--6x4-ns {  padding-bottom: 66.6%; }
+    .aspect-ratio--4x6-ns {  padding-bottom: 150%; }
+    .aspect-ratio--8x5-ns {  padding-bottom: 62.5%; }
+    .aspect-ratio--5x8-ns {  padding-bottom: 160%; }
+    .aspect-ratio--7x5-ns {  padding-bottom: 71.42%; }
+    .aspect-ratio--5x7-ns {  padding-bottom: 140%; }
+    .aspect-ratio--1x1-ns {  padding-bottom: 100%; }
+    .aspect-ratio--object-ns {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 100;
+    }
+}
+
+@media #{$breakpoint-medium}{
+    .aspect-ratio-m {
+      height: 0;
+      position: relative;
+    }
+    .aspect-ratio--16x9-m { padding-bottom: 56.25%; }
+    .aspect-ratio--9x16-m { padding-bottom: 177.77%; }
+    .aspect-ratio--4x3-m {  padding-bottom: 75%; }
+    .aspect-ratio--3x4-m {  padding-bottom: 133.33%; }
+    .aspect-ratio--6x4-m {  padding-bottom: 66.6%; }
+    .aspect-ratio--4x6-m {  padding-bottom: 150%; }
+    .aspect-ratio--8x5-m {  padding-bottom: 62.5%; }
+    .aspect-ratio--5x8-m {  padding-bottom: 160%; }
+    .aspect-ratio--7x5-m {  padding-bottom: 71.42%; }
+    .aspect-ratio--5x7-m {  padding-bottom: 140%; }
+    .aspect-ratio--1x1-m {  padding-bottom: 100%; }
+    .aspect-ratio--object-m {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 100;
+    }
+}
+
+@media #{$breakpoint-large}{
+    .aspect-ratio-l {
+      height: 0;
+      position: relative;
+    }
+    .aspect-ratio--16x9-l { padding-bottom: 56.25%; }
+    .aspect-ratio--9x16-l { padding-bottom: 177.77%; }
+    .aspect-ratio--4x3-l {  padding-bottom: 75%; }
+    .aspect-ratio--3x4-l {  padding-bottom: 133.33%; }
+    .aspect-ratio--6x4-l {  padding-bottom: 66.6%; }
+    .aspect-ratio--4x6-l {  padding-bottom: 150%; }
+    .aspect-ratio--8x5-l {  padding-bottom: 62.5%; }
+    .aspect-ratio--5x8-l {  padding-bottom: 160%; }
+    .aspect-ratio--7x5-l {  padding-bottom: 71.42%; }
+    .aspect-ratio--5x7-l {  padding-bottom: 140%; }
+    .aspect-ratio--1x1-l {  padding-bottom: 100%; }
+    .aspect-ratio--object-l {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 100;
+    }
+}

src/rawdata/scss/tachyons/scss/_background-position.scss

@@ -0,0 +1,133 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+    BACKGROUND POSITION
+
+    Base:
+    bg = background
+
+    Modifiers:
+    -center = center center
+    -top = top center
+    -right = center right
+    -bottom = bottom center
+    -left = center left
+
+    Media Query Extensions:
+      -ns = not-small
+      -m  = medium
+      -l  = large
+
+ */
+
+.bg-center { 
+  background-repeat: no-repeat;
+  background-position: center center; 
+}
+
+.bg-top {    
+  background-repeat: no-repeat; 
+  background-position: top center;    
+}
+
+.bg-right {  
+  background-repeat: no-repeat; 
+  background-position: center right;  
+}
+
+.bg-bottom { 
+  background-repeat: no-repeat; 
+  background-position: bottom center; 
+}
+
+.bg-left {   
+  background-repeat: no-repeat; 
+  background-position: center left;   
+}
+
+@media #{$breakpoint-not-small} {
+  .bg-center-ns { 
+    background-repeat: no-repeat;
+    background-position: center center; 
+  }
+
+  .bg-top-ns {    
+    background-repeat: no-repeat; 
+    background-position: top center;    
+  }
+
+  .bg-right-ns {  
+    background-repeat: no-repeat; 
+    background-position: center right;  
+  }
+
+  .bg-bottom-ns { 
+    background-repeat: no-repeat; 
+    background-position: bottom center; 
+  }
+
+  .bg-left-ns {   
+    background-repeat: no-repeat; 
+    background-position: center left;   
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .bg-center-m { 
+    background-repeat: no-repeat;
+    background-position: center center; 
+  }
+
+  .bg-top-m {    
+    background-repeat: no-repeat; 
+    background-position: top center;    
+  }
+
+  .bg-right-m {  
+    background-repeat: no-repeat; 
+    background-position: center right;  
+  }
+
+  .bg-bottom-m { 
+    background-repeat: no-repeat; 
+    background-position: bottom center; 
+  }
+
+  .bg-left-m {   
+    background-repeat: no-repeat; 
+    background-position: center left;   
+  }
+}
+
+@media #{$breakpoint-large} {
+  .bg-center-l { 
+    background-repeat: no-repeat;
+    background-position: center center; 
+  }
+
+  .bg-top-l {    
+    background-repeat: no-repeat; 
+    background-position: top center;    
+  }
+
+  .bg-right-l {  
+    background-repeat: no-repeat; 
+    background-position: center right;  
+  }
+
+  .bg-bottom-l { 
+    background-repeat: no-repeat; 
+    background-position: bottom center; 
+  }
+
+  .bg-left-l {   
+    background-repeat: no-repeat; 
+    background-position: center left;   
+  }
+}

src/rawdata/scss/tachyons/scss/_background-size.scss

@@ -0,0 +1,41 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   BACKGROUND SIZE
+   Docs: http://tachyons.io/docs/themes/background-size/
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+/*
+  Often used in combination with background image set as an inline style
+  on an html element.
+*/
+
+  .cover { background-size: cover!important; }
+  .contain { background-size: contain!important; }
+
+@media #{$breakpoint-not-small} {
+  .cover-ns { background-size: cover!important; }
+  .contain-ns { background-size: contain!important; }
+}
+
+@media #{$breakpoint-medium} {
+  .cover-m { background-size: cover!important; }
+  .contain-m { background-size: contain!important; }
+}
+
+@media #{$breakpoint-large} {
+  .cover-l { background-size: cover!important; }
+  .contain-l { background-size: contain!important; }
+}

src/rawdata/scss/tachyons/scss/_border-colors.scss

@@ -0,0 +1,93 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   BORDER COLORS
+   Docs: http://tachyons.io/docs/themes/borders/
+
+   Border colors can be used to extend the base
+   border classes ba,bt,bb,br,bl found in the _borders.css file.
+
+   The base border class by default will set the color of the border
+   to that of the current text color. These classes are for the cases
+   where you desire for the text and border colors to be different.
+
+   Base:
+     b = border
+
+   Modifiers:
+   --color-name = each color variable name is also a border color name
+
+*/
+
+.b--black {        border-color: $black; }
+.b--near-black {   border-color: $near-black; }
+.b--dark-gray {    border-color: $dark-gray; }
+.b--mid-gray {     border-color: $mid-gray; }
+.b--gray {         border-color: $gray; }
+.b--silver {       border-color: $silver; }
+.b--light-silver { border-color: $light-silver; }
+.b--moon-gray {    border-color: $moon-gray; }
+.b--light-gray {   border-color: $light-gray; }
+.b--near-white {   border-color: $near-white; }
+.b--white {        border-color: $white; }
+
+.b--white-90 {   border-color: $white-90; }
+.b--white-80 {   border-color: $white-80; }
+.b--white-70 {   border-color: $white-70; }
+.b--white-60 {   border-color: $white-60; }
+.b--white-50 {   border-color: $white-50; }
+.b--white-40 {   border-color: $white-40; }
+.b--white-30 {   border-color: $white-30; }
+.b--white-20 {   border-color: $white-20; }
+.b--white-10 {   border-color: $white-10; }
+.b--white-05 {   border-color: $white-05; }
+.b--white-025 {   border-color: $white-025; }
+.b--white-0125 {   border-color: $white-0125; }
+
+.b--black-90 {   border-color: $black-90; }
+.b--black-80 {   border-color: $black-80; }
+.b--black-70 {   border-color: $black-70; }
+.b--black-60 {   border-color: $black-60; }
+.b--black-50 {   border-color: $black-50; }
+.b--black-40 {   border-color: $black-40; }
+.b--black-30 {   border-color: $black-30; }
+.b--black-20 {   border-color: $black-20; }
+.b--black-10 {   border-color: $black-10; }
+.b--black-05 {   border-color: $black-05; }
+.b--black-025 {   border-color: $black-025; }
+.b--black-0125 {   border-color: $black-0125; }
+
+.b--dark-red { border-color: $dark-red; }
+.b--red { border-color: $red; }
+.b--light-red { border-color: $light-red; }
+.b--orange { border-color: $orange; }
+.b--gold { border-color: $gold; }
+.b--yellow { border-color: $yellow; }
+.b--light-yellow { border-color: $light-yellow; }
+.b--purple { border-color: $purple; }
+.b--light-purple { border-color: $light-purple; }
+.b--dark-pink { border-color: $dark-pink; }
+.b--hot-pink { border-color: $hot-pink; }
+.b--pink { border-color: $pink; }
+.b--light-pink { border-color: $light-pink; }
+.b--dark-green { border-color: $dark-green; }
+.b--green { border-color: $green; }
+.b--light-green { border-color: $light-green; }
+.b--navy { border-color: $navy; }
+.b--dark-blue { border-color: $dark-blue; }
+.b--blue { border-color: $blue; }
+.b--light-blue { border-color: $light-blue; }
+.b--lightest-blue { border-color: $lightest-blue; }
+.b--washed-blue { border-color: $washed-blue; }
+.b--washed-green { border-color: $washed-green; }
+.b--washed-yellow { border-color: $washed-yellow; }
+.b--washed-red { border-color: $washed-red; }
+
+.b--transparent { border-color: $transparent; }
+.b--inherit { border-color: inherit; }

src/rawdata/scss/tachyons/scss/_border-radius.scss

@@ -0,0 +1,134 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   BORDER RADIUS
+   Docs: http://tachyons.io/docs/themes/border-radius/
+
+   Base:
+     br   = border-radius
+
+   Modifiers:
+     0    = 0/none
+     1    = 1st step in scale
+     2    = 2nd step in scale
+     3    = 3rd step in scale
+     4    = 4th step in scale
+
+   Literal values:
+     -100 = 100%
+     -pill = 9999px
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+  .br0 {        border-radius: $border-radius-none }
+  .br1 {        border-radius: $border-radius-1; }
+  .br2 {        border-radius: $border-radius-2; }
+  .br3 {        border-radius: $border-radius-3; }
+  .br4 {        border-radius: $border-radius-4; }
+  .br-100 {     border-radius: $border-radius-circle; }
+  .br-pill {    border-radius: $border-radius-pill; }
+  .br--bottom {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+  }
+  .br--top {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+  .br--right {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+  }
+  .br--left {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+
+@media #{$breakpoint-not-small} {
+  .br0-ns {     border-radius: $border-radius-none }
+  .br1-ns {     border-radius: $border-radius-1; }
+  .br2-ns {     border-radius: $border-radius-2; }
+  .br3-ns {     border-radius: $border-radius-3; }
+  .br4-ns {     border-radius: $border-radius-4; }
+  .br-100-ns {  border-radius: $border-radius-circle; }
+  .br-pill-ns { border-radius: $border-radius-pill; }
+  .br--bottom-ns {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+  }
+  .br--top-ns {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+  .br--right-ns {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+  }
+  .br--left-ns {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .br0-m {     border-radius: $border-radius-none }
+  .br1-m {     border-radius: $border-radius-1; }
+  .br2-m {     border-radius: $border-radius-2; }
+  .br3-m {     border-radius: $border-radius-3; }
+  .br4-m {     border-radius: $border-radius-4; }
+  .br-100-m {  border-radius: $border-radius-circle; }
+  .br-pill-m { border-radius: $border-radius-pill; }
+  .br--bottom-m {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+  }
+  .br--top-m {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+  .br--right-m {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+  }
+  .br--left-m {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+}
+
+@media #{$breakpoint-large} {
+  .br0-l {     border-radius: $border-radius-none }
+  .br1-l {     border-radius: $border-radius-1; }
+  .br2-l {     border-radius: $border-radius-2; }
+  .br3-l {     border-radius: $border-radius-3; }
+  .br4-l {     border-radius: $border-radius-4; }
+  .br-100-l {  border-radius: $border-radius-circle; }
+  .br-pill-l { border-radius: $border-radius-pill; }
+  .br--bottom-l {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+  }
+  .br--top-l {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+  .br--right-l {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+  }
+  .br--left-l {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+  }
+}

src/rawdata/scss/tachyons/scss/_border-style.scss

@@ -0,0 +1,55 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   BORDER STYLES
+   Docs: http://tachyons.io/docs/themes/borders/
+
+   Depends on base border module in _borders.css
+
+   Base:
+     b = border-style
+
+   Modifiers:
+     --none   = none
+     --dotted = dotted
+     --dashed = dashed
+     --solid  = solid
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+ */
+
+.b--dotted { border-style: dotted; }
+.b--dashed { border-style: dashed; }
+.b--solid {  border-style: solid; }
+.b--none {   border-style: none; }
+
+@media #{$breakpoint-not-small} {
+  .b--dotted-ns { border-style: dotted; }
+  .b--dashed-ns { border-style: dashed; }
+  .b--solid-ns {  border-style: solid; }
+  .b--none-ns {   border-style: none; }
+}
+
+@media #{$breakpoint-medium} {
+  .b--dotted-m { border-style: dotted; }
+  .b--dashed-m { border-style: dashed; }
+  .b--solid-m {  border-style: solid; }
+  .b--none-m {   border-style: none; }
+}
+
+@media #{$breakpoint-large} {
+  .b--dotted-l { border-style: dotted; }
+  .b--dashed-l { border-style: dashed; }
+  .b--solid-l {  border-style: solid; }
+  .b--none-l {   border-style: none; }
+}

src/rawdata/scss/tachyons/scss/_border-widths.scss

@@ -0,0 +1,81 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   BORDER WIDTHS
+   Docs: http://tachyons.io/docs/themes/borders/
+
+   Base:
+     bw = border-width
+
+   Modifiers:
+     0 = 0 width border
+     1 = 1st step in border-width scale
+     2 = 2nd step in border-width scale
+     3 = 3rd step in border-width scale
+     4 = 4th step in border-width scale
+     5 = 5th step in border-width scale
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.bw0 { border-width: $border-width-none; }
+.bw1 { border-width: $border-width-1; }
+.bw2 { border-width: $border-width-2; }
+.bw3 { border-width: $border-width-3; }
+.bw4 { border-width: $border-width-4; }
+.bw5 { border-width: $border-width-5; }
+
+/* Resets */
+.bt-0 { border-top-width: $border-width-none }
+.br-0 { border-right-width: $border-width-none }
+.bb-0 { border-bottom-width: $border-width-none }
+.bl-0 { border-left-width: $border-width-none }
+
+@media #{$breakpoint-not-small} {
+  .bw0-ns { border-width: $border-width-none; }
+  .bw1-ns { border-width: $border-width-1; }
+  .bw2-ns { border-width: $border-width-2; }
+  .bw3-ns { border-width: $border-width-3; }
+  .bw4-ns { border-width: $border-width-4; }
+  .bw5-ns { border-width: $border-width-5; }
+  .bt-0-ns { border-top-width: $border-width-none }
+  .br-0-ns { border-right-width: $border-width-none }
+  .bb-0-ns { border-bottom-width: $border-width-none }
+  .bl-0-ns { border-left-width: $border-width-none }
+}
+
+@media #{$breakpoint-medium} {
+  .bw0-m { border-width: $border-width-none; }
+  .bw1-m { border-width: $border-width-1; }
+  .bw2-m { border-width: $border-width-2; }
+  .bw3-m { border-width: $border-width-3; }
+  .bw4-m { border-width: $border-width-4; }
+  .bw5-m { border-width: $border-width-5; }
+  .bt-0-m { border-top-width: $border-width-none }
+  .br-0-m { border-right-width: $border-width-none }
+  .bb-0-m { border-bottom-width: $border-width-none }
+  .bl-0-m { border-left-width: $border-width-none }
+}
+
+@media #{$breakpoint-large} {
+  .bw0-l { border-width: $border-width-none; }
+  .bw1-l { border-width: $border-width-1; }
+  .bw2-l { border-width: $border-width-2; }
+  .bw3-l { border-width: $border-width-3; }
+  .bw4-l { border-width: $border-width-4; }
+  .bw5-l { border-width: $border-width-5; }
+  .bt-0-l { border-top-width: $border-width-none }
+  .br-0-l { border-right-width: $border-width-none }
+  .bb-0-l { border-bottom-width: $border-width-none }
+  .bl-0-l { border-left-width: $border-width-none }
+}

src/rawdata/scss/tachyons/scss/_borders.scss

@@ -0,0 +1,65 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+    BORDERS
+    Docs: http://tachyons.io/docs/themes/borders/
+
+    Base:
+      b = border
+
+    Modifiers:
+      a = all
+      t = top
+      r = right
+      b = bottom
+      l = left
+      n = none
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+  .ba { border-style: solid; border-width: 1px; }
+  .bt { border-top-style: solid; border-top-width: 1px; }
+  .br { border-right-style: solid; border-right-width: 1px; }
+  .bb { border-bottom-style: solid; border-bottom-width: 1px; }
+  .bl { border-left-style: solid; border-left-width: 1px; }
+  .bn { border-style: none; border-width: 0; }
+
+
+@media #{$breakpoint-not-small} {
+  .ba-ns { border-style: solid; border-width: 1px; }
+  .bt-ns { border-top-style: solid; border-top-width: 1px; }
+  .br-ns { border-right-style: solid; border-right-width: 1px; }
+  .bb-ns { border-bottom-style: solid; border-bottom-width: 1px; }
+  .bl-ns { border-left-style: solid; border-left-width: 1px; }
+  .bn-ns { border-style: none; border-width: 0; }
+}
+
+@media #{$breakpoint-medium} {
+  .ba-m { border-style: solid; border-width: 1px; }
+  .bt-m { border-top-style: solid; border-top-width: 1px; }
+  .br-m { border-right-style: solid; border-right-width: 1px; }
+  .bb-m { border-bottom-style: solid; border-bottom-width: 1px; }
+  .bl-m { border-left-style: solid; border-left-width: 1px; }
+  .bn-m { border-style: none; border-width: 0; }
+}
+
+@media #{$breakpoint-large} {
+  .ba-l { border-style: solid; border-width: 1px; }
+  .bt-l { border-top-style: solid; border-top-width: 1px; }
+  .br-l { border-right-style: solid; border-right-width: 1px; }
+  .bb-l { border-bottom-style: solid; border-bottom-width: 1px; }
+  .bl-l { border-left-style: solid; border-left-width: 1px; }
+  .bn-l { border-style: none; border-width: 0; }
+}
+

src/rawdata/scss/tachyons/scss/_box-shadow.scss

@@ -0,0 +1,48 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  BOX-SHADOW
+  Docs: http://tachyons.io/docs/themes/box-shadow/
+
+  Media Query Extensions:
+   -ns = not-small
+   -m  = medium
+   -l  = large
+
+ */
+
+.shadow-1 { box-shadow: $box-shadow-1; }
+.shadow-2 { box-shadow: $box-shadow-2; }
+.shadow-3 { box-shadow: $box-shadow-3; }
+.shadow-4 { box-shadow: $box-shadow-4; }
+.shadow-5 { box-shadow: $box-shadow-5; }
+
+@media #{$breakpoint-not-small} {
+  .shadow-1-ns { box-shadow: $box-shadow-1; }
+  .shadow-2-ns { box-shadow: $box-shadow-2; }
+  .shadow-3-ns { box-shadow: $box-shadow-3; }
+  .shadow-4-ns { box-shadow: $box-shadow-4; }
+  .shadow-5-ns { box-shadow: $box-shadow-5; }
+}
+
+@media #{$breakpoint-medium} {
+  .shadow-1-m { box-shadow: $box-shadow-1; }
+  .shadow-2-m { box-shadow: $box-shadow-2; }
+  .shadow-3-m { box-shadow: $box-shadow-3; }
+  .shadow-4-m { box-shadow: $box-shadow-4; }
+  .shadow-5-m { box-shadow: $box-shadow-5; }
+}
+
+@media #{$breakpoint-large} {
+  .shadow-1-l { box-shadow: $box-shadow-1; }
+  .shadow-2-l { box-shadow: $box-shadow-2; }
+  .shadow-3-l { box-shadow: $box-shadow-3; }
+  .shadow-4-l { box-shadow: $box-shadow-4; }
+  .shadow-5-l { box-shadow: $box-shadow-5; }
+}

src/rawdata/scss/tachyons/scss/_box-sizing.scss

@@ -0,0 +1,49 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  BOX SIZING
+
+*/
+
+html,
+body,
+div,
+article,
+section,
+main,
+footer,
+header,
+form,
+fieldset,
+legend,
+pre,
+code,
+a,
+h1,h2,h3,h4,h5,h6,
+p,
+ul,
+ol,
+li,
+dl,
+dt,
+dd,
+textarea,
+table,
+td,
+th,
+tr,
+input[type="email"],
+input[type="number"],
+input[type="password"],
+input[type="tel"],
+input[type="text"],
+input[type="url"],
+.border-box {
+  box-sizing: border-box;
+}

src/rawdata/scss/tachyons/scss/_clears.scss

@@ -0,0 +1,47 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   CLEARFIX
+   http://tachyons.io/docs/layout/clearfix/
+
+*/
+
+/* Nicolas Gallaghers Clearfix solution
+   Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */
+
+.cf:before,
+.cf:after { content: " "; display: table; }
+.cf:after { clear: both; }
+.cf {       *zoom: 1; }
+
+.cl { clear: left; }
+.cr { clear: right; }
+.cb { clear: both; }
+.cn { clear: none; }
+
+@media #{$breakpoint-not-small} {
+  .cl-ns { clear: left; }
+  .cr-ns { clear: right; }
+  .cb-ns { clear: both; }
+  .cn-ns { clear: none; }
+}
+
+@media #{$breakpoint-medium} {
+  .cl-m { clear: left; }
+  .cr-m { clear: right; }
+  .cb-m { clear: both; }
+  .cn-m { clear: none; }
+}
+
+@media #{$breakpoint-large} {
+  .cl-l { clear: left; }
+  .cr-l { clear: right; }
+  .cb-l { clear: both; }
+  .cn-l { clear: none; }
+}

src/rawdata/scss/tachyons/scss/_code.scss

@@ -0,0 +1,18 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   CODE
+
+*/
+
+.pre {
+  overflow-x: auto;
+  overflow-y: hidden;
+  overflow:   scroll;
+}

src/rawdata/scss/tachyons/scss/_coordinates.scss

@@ -0,0 +1,153 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   COORDINATES
+   Docs: http://tachyons.io/docs/layout/position/
+
+   Use in combination with the position module.
+
+   Base:
+     top
+     bottom
+     right
+     left
+
+   Modifiers:
+     -0  = literal value 0
+     -1  = literal value 1
+     -2  = literal value 2
+     --1 = literal value -1
+     --2 = literal value -2
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.top-0    { top:    0; }
+.right-0  { right:  0; }
+.bottom-0 { bottom: 0; }
+.left-0   { left:   0; }
+
+.top-1    { top:    1rem; }
+.right-1  { right:  1rem; }
+.bottom-1 { bottom: 1rem; }
+.left-1   { left:   1rem; }
+
+.top-2    { top:    2rem; }
+.right-2  { right:  2rem; }
+.bottom-2 { bottom: 2rem; }
+.left-2   { left:   2rem; }
+
+.top--1    { top:    -1rem; }
+.right--1  { right:  -1rem; }
+.bottom--1 { bottom: -1rem; }
+.left--1   { left:   -1rem; }
+
+.top--2    { top:    -2rem; }
+.right--2  { right:  -2rem; }
+.bottom--2 { bottom: -2rem; }
+.left--2   { left:   -2rem; }
+
+
+.absolute--fill {
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+@media #{$breakpoint-not-small} {
+  .top-0-ns     { top:   0; }
+  .left-0-ns    { left:  0; }
+  .right-0-ns   { right: 0; }
+  .bottom-0-ns  { bottom: 0; }
+  .top-1-ns     { top:   1rem; }
+  .left-1-ns    { left:  1rem; }
+  .right-1-ns   { right: 1rem; }
+  .bottom-1-ns  { bottom: 1rem; }
+  .top-2-ns     { top:   2rem; }
+  .left-2-ns    { left:  2rem; }
+  .right-2-ns   { right: 2rem; }
+  .bottom-2-ns  { bottom: 2rem; }
+  .top--1-ns    { top:    -1rem; }
+  .right--1-ns  { right:  -1rem; }
+  .bottom--1-ns { bottom: -1rem; }
+  .left--1-ns   { left:   -1rem; }
+  .top--2-ns    { top:    -2rem; }
+  .right--2-ns  { right:  -2rem; }
+  .bottom--2-ns { bottom: -2rem; }
+  .left--2-ns   { left:   -2rem; }
+  .absolute--fill-ns {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .top-0-m     { top:   0; }
+  .left-0-m    { left:  0; }
+  .right-0-m   { right: 0; }
+  .bottom-0-m  { bottom: 0; }
+  .top-1-m     { top:   1rem; }
+  .left-1-m    { left:  1rem; }
+  .right-1-m   { right: 1rem; }
+  .bottom-1-m  { bottom: 1rem; }
+  .top-2-m     { top:   2rem; }
+  .left-2-m    { left:  2rem; }
+  .right-2-m   { right: 2rem; }
+  .bottom-2-m  { bottom: 2rem; }
+  .top--1-m    { top:    -1rem; }
+  .right--1-m  { right:  -1rem; }
+  .bottom--1-m { bottom: -1rem; }
+  .left--1-m   { left:   -1rem; }
+  .top--2-m    { top:    -2rem; }
+  .right--2-m  { right:  -2rem; }
+  .bottom--2-m { bottom: -2rem; }
+  .left--2-m   { left:   -2rem; }
+  .absolute--fill-m {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+}
+
+@media #{$breakpoint-large} {
+  .top-0-l     { top:   0; }
+  .left-0-l    { left:  0; }
+  .right-0-l   { right: 0; }
+  .bottom-0-l  { bottom: 0; }
+  .top-1-l     { top:   1rem; }
+  .left-1-l    { left:  1rem; }
+  .right-1-l   { right: 1rem; }
+  .bottom-1-l  { bottom: 1rem; }
+  .top-2-l     { top:   2rem; }
+  .left-2-l    { left:  2rem; }
+  .right-2-l   { right: 2rem; }
+  .bottom-2-l  { bottom: 2rem; }
+  .top--1-l    { top:    -1rem; }
+  .right--1-l  { right:  -1rem; }
+  .bottom--1-l { bottom: -1rem; }
+  .left--1-l   { left:   -1rem; }
+  .top--2-l    { top:    -2rem; }
+  .right--2-l  { right:  -2rem; }
+  .bottom--2-l { bottom: -2rem; }
+  .left--2-l   { left:   -2rem; }
+  .absolute--fill-l {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+}

src/rawdata/scss/tachyons/scss/_debug-children.scss

@@ -0,0 +1,21 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  DEBUG CHILDREN
+  Docs: http://tachyons.io/docs/debug/
+
+  Just add the debug class to any element to see outlines on its
+  children.
+
+*/
+
+.debug * { outline: 1px solid gold; }
+.debug-white * { outline: 1px solid white; }
+.debug-black * { outline: 1px solid black; }
+

src/rawdata/scss/tachyons/scss/_debug-grid.scss

@@ -0,0 +1,33 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   DEBUG GRID
+   http://tachyons.io/docs/debug-grid/
+
+   Can be useful for debugging layout issues
+   or helping to make sure things line up perfectly.
+   Just tack one of these classes onto a parent element.
+
+*/
+
+.debug-grid {
+  background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTRDOTY4N0U2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTRDOTY4N0Q2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3NjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3NzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsBS+GMAAAAjSURBVHjaYvz//z8DLsD4gcGXiYEAGBIKGBne//fFpwAgwAB98AaF2pjlUQAAAABJRU5ErkJggg==) repeat top left;
+}
+
+.debug-grid-16 {
+  background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODYyRjhERDU2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODYyRjhERDQ2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QTY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3QjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvCS01IAAABMSURBVHjaYmR4/5+BFPBfAMFm/MBgx8RAGWCn1AAmSg34Q6kBDKMGMDCwICeMIemF/5QawEipAWwUhwEjMDvbAWlWkvVBwu8vQIABAEwBCph8U6c0AAAAAElFTkSuQmCC) repeat top left;
+}
+
+.debug-grid-8-solid {
+  background:white url(data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAAAAD/4QMxaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzExMSA3OS4xNTgzMjUsIDIwMTUvMDkvMTAtMDE6MTA6MjAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE1IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkIxMjI0OTczNjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkIxMjI0OTc0NjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QjEyMjQ5NzE2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QjEyMjQ5NzI2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAbGhopHSlBJiZBQi8vL0JHPz4+P0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHAR0pKTQmND8oKD9HPzU/R0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0f/wAARCAAIAAgDASIAAhEBAxEB/8QAWQABAQAAAAAAAAAAAAAAAAAAAAYBAQEAAAAAAAAAAAAAAAAAAAIEEAEBAAMBAAAAAAAAAAAAAAABADECA0ERAAEDBQAAAAAAAAAAAAAAAAARITFBUWESIv/aAAwDAQACEQMRAD8AoOnTV1QTD7JJshP3vSM3P//Z) repeat top left;
+}
+
+.debug-grid-16-solid {
+  background:white url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzY3MkJEN0U2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzY3MkJEN0Y2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3RDY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pve6J3kAAAAzSURBVHjaYvz//z8D0UDsMwMjSRoYP5Gq4SPNbRjVMEQ1fCRDg+in/6+J1AJUxsgAEGAA31BAJMS0GYEAAAAASUVORK5CYII=) repeat top left;
+}

src/rawdata/scss/tachyons/scss/_debug.scss

@@ -0,0 +1,127 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+
+body {        outline: 1px solid  #2980B9!important; }
+article {     outline: 1px solid  #3498DB!important; }
+nav {         outline: 1px solid  #0088C3!important; }
+aside {       outline: 1px solid  #33A0CE!important; }
+section {     outline: 1px solid  #66B8DA!important; }
+header {      outline: 1px solid  #99CFE7!important; }
+footer {      outline: 1px solid  #CCE7F3!important; }
+h1 {          outline: 1px solid  #162544!important; }
+h2 {          outline: 1px solid  #314E6E!important; }
+h3 {          outline: 1px solid  #3E5E85!important; }
+h4 {          outline: 1px solid  #449BAF!important; }
+h5 {          outline: 1px solid  #C7D1CB!important; }
+h6 {          outline: 1px solid  #4371D0!important; }
+main {        outline: 1px solid  #2F4F90!important; }
+address {     outline: 1px solid  #1A2C51!important; }
+div {         outline: 1px solid  #036CDB!important; }
+
+
+p {           outline: 1px solid  #AC050B!important; }
+hr {          outline: 1px solid  #FF063F!important; }
+pre {         outline: 1px solid  #850440!important; }
+blockquote {  outline: 1px solid  #F1B8E7!important; }
+ol {          outline: 1px solid  #FF050C!important; }
+ul {          outline: 1px solid  #D90416!important; }
+li {          outline: 1px solid  #D90416!important; }
+dl {          outline: 1px solid  #FD3427!important; }
+dt {          outline: 1px solid  #FF0043!important; }
+dd {          outline: 1px solid  #E80174!important; }
+figure {      outline: 1px solid  #FF00BB!important; }
+figcaption {  outline: 1px solid  #BF0032!important; }
+
+
+
+table {       outline: 1px solid  #00CC99!important; }
+caption {     outline: 1px solid  #37FFC4!important; }
+thead {       outline: 1px solid  #98DACA!important; }
+tbody {       outline: 1px solid  #64A7A0!important; }
+tfoot {       outline: 1px solid  #22746B!important; }
+tr {          outline: 1px solid  #86C0B2!important; }
+th {          outline: 1px solid  #A1E7D6!important; }
+td {          outline: 1px solid  #3F5A54!important; }
+col {         outline: 1px solid  #6C9A8F!important; }
+colgroup {    outline: 1px solid  #6C9A9D!important; }
+
+
+button {      outline: 1px solid  #DA8301!important; }
+datalist {    outline: 1px solid  #C06000!important; }
+fieldset {    outline: 1px solid  #D95100!important; }
+form {        outline: 1px solid  #D23600!important; }
+input {       outline: 1px solid  #FCA600!important; }
+keygen {      outline: 1px solid  #B31E00!important; }
+label {       outline: 1px solid  #EE8900!important; }
+legend {      outline: 1px solid  #DE6D00!important; }
+meter {       outline: 1px solid  #E8630C!important; }
+optgroup {    outline: 1px solid  #B33600!important; }
+option {      outline: 1px solid  #FF8A00!important; }
+output {      outline: 1px solid  #FF9619!important; }
+progress {    outline: 1px solid  #E57C00!important; }
+select {      outline: 1px solid  #E26E0F!important; }
+textarea {    outline: 1px solid  #CC5400!important; }
+
+
+
+details {     outline: 1px solid  #33848F!important; }
+summary {     outline: 1px solid  #60A1A6!important; }
+command {     outline: 1px solid  #438DA1!important; }
+menu {        outline: 1px solid  #449DA6!important; }
+
+
+
+del {         outline: 1px solid  #BF0000!important; }
+ins {         outline: 1px solid  #400000!important; }
+
+
+
+img     {     outline: 1px solid #22746B!important; }
+iframe  {     outline: 1px solid #64A7A0!important; }
+embed   {     outline: 1px solid #98DACA!important; }
+object  {     outline: 1px solid #00CC99!important; }
+param   {     outline: 1px solid #37FFC4!important; }
+video   {     outline: 1px solid #6EE866!important; }
+audio   {     outline: 1px solid #027353!important; }
+source  {     outline: 1px solid #012426!important; }
+canvas  {     outline: 1px solid #A2F570!important; }
+track   {     outline: 1px solid #59A600!important; }
+map     {     outline: 1px solid #7BE500!important; }
+area    {     outline: 1px solid #305900!important; }
+
+
+
+a {           outline: 1px solid #FF62AB!important; }
+em {          outline: 1px solid #800B41!important; }
+strong {      outline: 1px solid #FF1583!important; }
+i {           outline: 1px solid #803156!important; }
+b {           outline: 1px solid #CC1169!important; }
+u {           outline: 1px solid #FF0430!important; }
+s {           outline: 1px solid #F805E3!important; }
+small {       outline: 1px solid #D107B2!important; }
+abbr {        outline: 1px solid #4A0263!important; }
+q {           outline: 1px solid #240018!important; }
+cite {        outline: 1px solid #64003C!important; }
+dfn {         outline: 1px solid #B4005A!important; }
+sub {         outline: 1px solid #DBA0C8!important; }
+sup {         outline: 1px solid #CC0256!important; }
+time {        outline: 1px solid #D6606D!important; }
+code {        outline: 1px solid #E04251!important; }
+kbd {         outline: 1px solid #5E001F!important; }
+samp {        outline: 1px solid #9C0033!important; }
+var {         outline: 1px solid #D90047!important; }
+mark {        outline: 1px solid #FF0053!important; }
+bdi {         outline: 1px solid #BF3668!important; }
+bdo {         outline: 1px solid #6F1400!important; }
+ruby {        outline: 1px solid #FF7B93!important; }
+rt {          outline: 1px solid #FF2F54!important; }
+rp {          outline: 1px solid #803E49!important; }
+span {        outline: 1px solid #CC2643!important; }
+br {          outline: 1px solid #DB687D!important; }
+wbr {         outline: 1px solid #DB175B!important; }
+

src/rawdata/scss/tachyons/scss/_debug_children.scss

@@ -0,0 +1,18 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  DEBUG CHILDREN
+
+  Just add the debug class to any element to see outlines on its
+  children.
+
+*/
+
+.debug * { outline: 1px solid gold; }
+

src/rawdata/scss/tachyons/scss/_display.scss

@@ -0,0 +1,111 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   DISPLAY
+   Docs: http://tachyons.io/docs/layout/display
+
+   Base:
+    d = display
+
+   Modifiers:
+    n     = none
+    b     = block
+    ib    = inline-block
+    it    = inline-table
+    t     = table
+    tc    = table-cell
+    tr    = table-row
+    tcol  = table-column
+    tcolg = table-column-group
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.dn {              display: none; }
+.di {              display: inline; }
+.db {              display: block; }
+.dib {             display: inline-block; }
+.dit {             display: inline-table; }
+.dt {              display: table; }
+.dtc {             display: table-cell; }
+.dt-row {          display: table-row; }
+.dt-row-group {    display: table-row-group; }
+.dt-column {       display: table-column; }
+.dt-column-group { display: table-column-group; }
+
+/*
+  This will set table to full width and then
+  all cells will be equal width
+*/
+.dt--fixed {
+  table-layout: fixed;
+  width: 100%;
+}
+
+@media #{$breakpoint-not-small} {
+  .dn-ns {              display: none; }
+  .di-ns {              display: inline; }
+  .db-ns {              display: block; }
+  .dib-ns {             display: inline-block; }
+  .dit-ns {             display: inline-table; }
+  .dt-ns {              display: table; }
+  .dtc-ns {             display: table-cell; }
+  .dt-row-ns {          display: table-row; }
+  .dt-row-group-ns {    display: table-row-group; }
+  .dt-column-ns {       display: table-column; }
+  .dt-column-group-ns { display: table-column-group; }
+
+  .dt--fixed-ns {
+    table-layout: fixed;
+    width: 100%;
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .dn-m {              display: none; }
+  .di-m {              display: inline; }
+  .db-m {              display: block; }
+  .dib-m {             display: inline-block; }
+  .dit-m {             display: inline-table; }
+  .dt-m {              display: table; }
+  .dtc-m {             display: table-cell; }
+  .dt-row-m {          display: table-row; }
+  .dt-row-group-m {    display: table-row-group; }
+  .dt-column-m {       display: table-column; }
+  .dt-column-group-m { display: table-column-group; }
+
+  .dt--fixed-m {
+    table-layout: fixed;
+    width: 100%;
+  }
+}
+
+@media #{$breakpoint-large} {
+  .dn-l {              display: none; }
+  .di-l {              display: inline; }
+  .db-l {              display: block; }
+  .dib-l {             display: inline-block; }
+  .dit-l {             display: inline-table; }
+  .dt-l {              display: table; }
+  .dtc-l {             display: table-cell; }
+  .dt-row-l {          display: table-row; }
+  .dt-row-group-l {    display: table-row-group; }
+  .dt-column-l {       display: table-column; }
+  .dt-column-group-l { display: table-column-group; }
+
+  .dt--fixed-l {
+    table-layout: fixed;
+    width: 100%;
+  }
+}
+

src/rawdata/scss/tachyons/scss/_flexbox.scss

@@ -0,0 +1,257 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  FLEXBOX
+
+  Media Query Extensions:
+   -ns = not-small
+   -m  = medium
+   -l  = large
+
+*/
+
+.flex { display: flex; }
+.inline-flex { display: inline-flex; }
+
+/* 1. Fix for Chrome 44 bug.
+ * https://code.google.com/p/chromium/issues/detail?id=506893 */
+.flex-auto {
+  flex: 1 1 auto;
+  min-width: 0; /* 1 */
+  min-height: 0; /* 1 */
+}
+
+.flex-none { flex: none; }
+
+.flex-column  { flex-direction: column; }
+.flex-row     { flex-direction: row; }
+.flex-wrap    { flex-wrap: wrap; }
+.flex-nowrap    { flex-wrap: nowrap; }
+.flex-wrap-reverse    { flex-wrap: wrap-reverse; }
+.flex-column-reverse  { flex-direction: column-reverse; }
+.flex-row-reverse     { flex-direction: row-reverse; }
+
+.items-start    { align-items: flex-start; }
+.items-end      { align-items: flex-end; }
+.items-center   { align-items: center; }
+.items-baseline { align-items: baseline; }
+.items-stretch  { align-items: stretch; }
+
+.self-start    { align-self: flex-start; }
+.self-end      { align-self: flex-end; }
+.self-center   { align-self: center; }
+.self-baseline { align-self: baseline; }
+.self-stretch  { align-self: stretch; }
+
+.justify-start   { justify-content: flex-start; }
+.justify-end     { justify-content: flex-end; }
+.justify-center  { justify-content: center; }
+.justify-between { justify-content: space-between; }
+.justify-around  { justify-content: space-around; }
+
+.content-start   { align-content: flex-start; }
+.content-end     { align-content: flex-end; }
+.content-center  { align-content: center; }
+.content-between { align-content: space-between; }
+.content-around  { align-content: space-around; }
+.content-stretch { align-content: stretch; }
+
+.order-0 { order: 0; }
+.order-1 { order: 1; }
+.order-2 { order: 2; }
+.order-3 { order: 3; }
+.order-4 { order: 4; }
+.order-5 { order: 5; }
+.order-6 { order: 6; }
+.order-7 { order: 7; }
+.order-8 { order: 8; }
+.order-last { order: 99999; }
+
+.flex-grow-0 { flex-grow: 0; }
+.flex-grow-1 { flex-grow: 1; }
+
+.flex-shrink-0 { flex-shrink: 0; }
+.flex-shrink-1 { flex-shrink: 1; }
+
+@media #{$breakpoint-not-small} {
+  .flex-ns { display: flex; }
+  .inline-flex-ns { display: inline-flex; }
+  .flex-auto-ns {
+    flex: 1 1 auto;
+    min-width: 0; /* 1 */
+    min-height: 0; /* 1 */
+  }
+  .flex-none-ns { flex: none; }
+  .flex-column-ns { flex-direction: column; }
+  .flex-row-ns { flex-direction: row; }
+  .flex-wrap-ns { flex-wrap: wrap; }
+  .flex-nowrap-ns { flex-wrap: nowrap; }
+  .flex-wrap-reverse-ns { flex-wrap: wrap-reverse; }
+  .flex-column-reverse-ns { flex-direction: column-reverse; }
+  .flex-row-reverse-ns { flex-direction: row-reverse; }
+  .items-start-ns { align-items: flex-start; }
+  .items-end-ns { align-items: flex-end; }
+  .items-center-ns { align-items: center; }
+  .items-baseline-ns { align-items: baseline; }
+  .items-stretch-ns { align-items: stretch; }
+
+  .self-start-ns { align-self: flex-start; }
+  .self-end-ns { align-self: flex-end; }
+  .self-center-ns { align-self: center; }
+  .self-baseline-ns { align-self: baseline; }
+  .self-stretch-ns { align-self: stretch; }
+
+  .justify-start-ns { justify-content: flex-start; }
+  .justify-end-ns { justify-content: flex-end; }
+  .justify-center-ns { justify-content: center; }
+  .justify-between-ns { justify-content: space-between; }
+  .justify-around-ns { justify-content: space-around; }
+
+  .content-start-ns { align-content: flex-start; }
+  .content-end-ns { align-content: flex-end; }
+  .content-center-ns { align-content: center; }
+  .content-between-ns { align-content: space-between; }
+  .content-around-ns { align-content: space-around; }
+  .content-stretch-ns { align-content: stretch; }
+
+  .order-0-ns { order: 0; }
+  .order-1-ns { order: 1; }
+  .order-2-ns { order: 2; }
+  .order-3-ns { order: 3; }
+  .order-4-ns { order: 4; }
+  .order-5-ns { order: 5; }
+  .order-6-ns { order: 6; }
+  .order-7-ns { order: 7; }
+  .order-8-ns { order: 8; }
+  .order-last-ns { order: 99999; }
+
+  .flex-grow-0-ns { flex-grow: 0; }
+  .flex-grow-1-ns { flex-grow: 1; }
+
+  .flex-shrink-0-ns { flex-shrink: 0; }
+  .flex-shrink-1-ns { flex-shrink: 1; }
+}
+@media #{$breakpoint-medium} {
+  .flex-m { display: flex; }
+  .inline-flex-m { display: inline-flex; }
+  .flex-auto-m {
+    flex: 1 1 auto;
+    min-width: 0; /* 1 */
+    min-height: 0; /* 1 */
+  }
+  .flex-none-m { flex: none; }
+  .flex-column-m { flex-direction: column; }
+  .flex-row-m     { flex-direction: row; }
+  .flex-wrap-m { flex-wrap: wrap; }
+  .flex-nowrap-m { flex-wrap: nowrap; }
+  .flex-wrap-reverse-m { flex-wrap: wrap-reverse; }
+  .flex-column-reverse-m { flex-direction: column-reverse; }
+  .flex-row-reverse-m { flex-direction: row-reverse; }
+  .items-start-m { align-items: flex-start; }
+  .items-end-m { align-items: flex-end; }
+  .items-center-m { align-items: center; }
+  .items-baseline-m { align-items: baseline; }
+  .items-stretch-m { align-items: stretch; }
+
+  .self-start-m { align-self: flex-start; }
+  .self-end-m { align-self: flex-end; }
+  .self-center-m { align-self: center; }
+  .self-baseline-m { align-self: baseline; }
+  .self-stretch-m { align-self: stretch; }
+
+  .justify-start-m { justify-content: flex-start; }
+  .justify-end-m { justify-content: flex-end; }
+  .justify-center-m { justify-content: center; }
+  .justify-between-m { justify-content: space-between; }
+  .justify-around-m { justify-content: space-around; }
+
+  .content-start-m { align-content: flex-start; }
+  .content-end-m { align-content: flex-end; }
+  .content-center-m { align-content: center; }
+  .content-between-m { align-content: space-between; }
+  .content-around-m { align-content: space-around; }
+  .content-stretch-m { align-content: stretch; }
+
+  .order-0-m { order: 0; }
+  .order-1-m { order: 1; }
+  .order-2-m { order: 2; }
+  .order-3-m { order: 3; }
+  .order-4-m { order: 4; }
+  .order-5-m { order: 5; }
+  .order-6-m { order: 6; }
+  .order-7-m { order: 7; }
+  .order-8-m { order: 8; }
+  .order-last-m { order: 99999; }
+
+  .flex-grow-0-m { flex-grow: 0; }
+  .flex-grow-1-m { flex-grow: 1; }
+
+  .flex-shrink-0-m { flex-shrink: 0; }
+  .flex-shrink-1-m { flex-shrink: 1; }
+}
+
+@media #{$breakpoint-large} {
+  .flex-l { display: flex; }
+  .inline-flex-l { display: inline-flex; }
+  .flex-auto-l {
+    flex: 1 1 auto;
+    min-width: 0; /* 1 */
+    min-height: 0; /* 1 */
+  }
+  .flex-none-l { flex: none; }
+  .flex-column-l { flex-direction: column; }
+  .flex-row-l { flex-direction: row; }
+  .flex-wrap-l { flex-wrap: wrap; }
+  .flex-nowrap-l { flex-wrap: nowrap; }
+  .flex-wrap-reverse-l { flex-wrap: wrap-reverse; }
+  .flex-column-reverse-l { flex-direction: column-reverse; }
+  .flex-row-reverse-l { flex-direction: row-reverse; }
+
+  .items-start-l { align-items: flex-start; }
+  .items-end-l { align-items: flex-end; }
+  .items-center-l { align-items: center; }
+  .items-baseline-l { align-items: baseline; }
+  .items-stretch-l { align-items: stretch; }
+
+  .self-start-l { align-self: flex-start; }
+  .self-end-l { align-self: flex-end; }
+  .self-center-l { align-self: center; }
+  .self-baseline-l { align-self: baseline; }
+  .self-stretch-l { align-self: stretch; }
+
+  .justify-start-l { justify-content: flex-start; }
+  .justify-end-l { justify-content: flex-end; }
+  .justify-center-l { justify-content: center; }
+  .justify-between-l { justify-content: space-between; }
+  .justify-around-l { justify-content: space-around; }
+
+  .content-start-l { align-content: flex-start; }
+  .content-end-l { align-content: flex-end; }
+  .content-center-l { align-content: center; }
+  .content-between-l { align-content: space-between; }
+  .content-around-l { align-content: space-around; }
+  .content-stretch-l { align-content: stretch; }
+
+  .order-0-l { order: 0; }
+  .order-1-l { order: 1; }
+  .order-2-l { order: 2; }
+  .order-3-l { order: 3; }
+  .order-4-l { order: 4; }
+  .order-5-l { order: 5; }
+  .order-6-l { order: 6; }
+  .order-7-l { order: 7; }
+  .order-8-l { order: 8; }
+  .order-last-l { order: 99999; }
+
+  .flex-grow-0-l { flex-grow: 0; }
+  .flex-grow-1-l { flex-grow: 1; }
+
+  .flex-shrink-0-l { flex-shrink: 0; }
+  .flex-shrink-1-l { flex-shrink: 1; }
+}

src/rawdata/scss/tachyons/scss/_floats.scss

@@ -0,0 +1,56 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   FLOATS
+   http://tachyons.io/docs/layout/floats/
+
+   1. Floated elements are automatically rendered as block level elements.
+      Setting floats to display inline will fix the double margin bug in
+      ie6. You know... just in case.
+
+   2. Don't forget to clearfix your floats with .cf
+
+   Base:
+     f = float
+
+   Modifiers:
+     l = left
+     r = right
+     n = none
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+
+
+.fl { float: left;  _display: inline; }
+.fr { float: right; _display: inline; }
+.fn { float: none; }
+
+@media #{$breakpoint-not-small} {
+  .fl-ns { float: left; _display: inline; }
+  .fr-ns { float: right; _display: inline; }
+  .fn-ns { float: none; }
+}
+
+@media #{$breakpoint-medium} {
+  .fl-m { float: left; _display: inline; }
+  .fr-m { float: right; _display: inline; }
+  .fn-m { float: none; }
+}
+
+@media #{$breakpoint-large} {
+  .fl-l { float: left; _display: inline; }
+  .fr-l { float: right; _display: inline; }
+  .fn-l { float: none; }
+}

src/rawdata/scss/tachyons/scss/_font-family.scss

@@ -0,0 +1,99 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   FONT FAMILY GROUPS
+   Docs: http://tachyons.io/docs/typography/font-family/
+
+*/
+
+
+.sans-serif {
+  font-family: $sans-serif;
+}
+
+.serif {
+  font-family: $serif;
+}
+
+.system-sans-serif {
+  font-family: sans-serif;
+}
+
+.system-serif {
+  font-family: serif;
+}
+
+
+/* Monospaced Typefaces (for code) */
+
+/* From http://cssfontstack.com */
+code, .code {
+  font-family: Consolas,
+               monaco,
+               monospace;
+}
+
+.courier {
+  font-family: 'Courier Next',
+               courier,
+               monospace;
+}
+
+
+/* Sans-Serif Typefaces */
+
+.helvetica {
+  font-family: 'helvetica neue', helvetica,
+               sans-serif;
+}
+
+.avenir {
+  font-family: 'avenir next', avenir,
+               sans-serif;
+}
+
+
+/* Serif Typefaces */
+
+.athelas {
+  font-family: athelas,
+               georgia,
+               serif;
+}
+
+.georgia {
+  font-family: georgia,
+               serif;
+}
+
+.times {
+  font-family: times,
+               serif;
+}
+
+.bodoni {
+  font-family: "Bodoni MT",
+                serif;
+}
+
+.calisto {
+  font-family: "Calisto MT",
+                serif;
+}
+
+.garamond {
+  font-family: garamond,
+               serif;
+}
+
+.baskerville {
+  font-family: baskerville,
+               serif;
+}
+

src/rawdata/scss/tachyons/scss/_font-style.scss

@@ -0,0 +1,36 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   FONT STYLE
+   Docs: http://tachyons.io/docs/typography/font-style/
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.i         { font-style: italic; }
+.fs-normal { font-style: normal; }
+
+@media #{$breakpoint-not-small} {
+  .i-ns       { font-style: italic; }
+  .fs-normal-ns     { font-style: normal; }
+}
+
+@media #{$breakpoint-medium} {
+  .i-m       { font-style: italic; }
+  .fs-normal-m     { font-style: normal; }
+}
+
+@media #{$breakpoint-large} {
+  .i-l       { font-style: italic; }
+  .fs-normal-l     { font-style: normal; }
+}

src/rawdata/scss/tachyons/scss/_font-weight.scss

@@ -0,0 +1,87 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   FONT WEIGHT
+   Docs: http://tachyons.io/docs/typography/font-weight/
+
+   Base
+     fw = font-weight
+
+   Modifiers:
+     1 = literal value 100
+     2 = literal value 200
+     3 = literal value 300
+     4 = literal value 400
+     5 = literal value 500
+     6 = literal value 600
+     7 = literal value 700
+     8 = literal value 800
+     9 = literal value 900
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.normal { font-weight: normal; }
+.b      { font-weight: bold; }
+.fw1    { font-weight: 100; }
+.fw2    { font-weight: 200; }
+.fw3    { font-weight: 300; }
+.fw4    { font-weight: 400; }
+.fw5    { font-weight: 500; }
+.fw6    { font-weight: 600; }
+.fw7    { font-weight: 700; }
+.fw8    { font-weight: 800; }
+.fw9    { font-weight: 900; }
+
+
+@media #{$breakpoint-not-small} {
+  .normal-ns { font-weight: normal; }
+  .b-ns      { font-weight: bold; }
+  .fw1-ns    { font-weight: 100; }
+  .fw2-ns    { font-weight: 200; }
+  .fw3-ns    { font-weight: 300; }
+  .fw4-ns    { font-weight: 400; }
+  .fw5-ns    { font-weight: 500; }
+  .fw6-ns    { font-weight: 600; }
+  .fw7-ns    { font-weight: 700; }
+  .fw8-ns    { font-weight: 800; }
+  .fw9-ns    { font-weight: 900; }
+}
+
+@media #{$breakpoint-medium} {
+  .normal-m { font-weight: normal; }
+  .b-m      { font-weight: bold; }
+  .fw1-m    { font-weight: 100; }
+  .fw2-m    { font-weight: 200; }
+  .fw3-m    { font-weight: 300; }
+  .fw4-m    { font-weight: 400; }
+  .fw5-m    { font-weight: 500; }
+  .fw6-m    { font-weight: 600; }
+  .fw7-m    { font-weight: 700; }
+  .fw8-m    { font-weight: 800; }
+  .fw9-m    { font-weight: 900; }
+}
+
+@media #{$breakpoint-large} {
+  .normal-l { font-weight: normal; }
+  .b-l      { font-weight: bold; }
+  .fw1-l    { font-weight: 100; }
+  .fw2-l    { font-weight: 200; }
+  .fw3-l    { font-weight: 300; }
+  .fw4-l    { font-weight: 400; }
+  .fw5-l    { font-weight: 500; }
+  .fw6-l    { font-weight: 600; }
+  .fw7-l    { font-weight: 700; }
+  .fw8-l    { font-weight: 800; }
+  .fw9-l    { font-weight: 900; }
+}

src/rawdata/scss/tachyons/scss/_forms.scss

@@ -0,0 +1,23 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   FORMS
+   
+*/
+
+.input-reset {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+}
+
+.button-reset::-moz-focus-inner,
+.input-reset::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}

src/rawdata/scss/tachyons/scss/_gradients.scss

@@ -0,0 +1,29 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   GRADIENTS
+
+
+*/
+
+.gradient-blue { 
+  background-image: linear-gradient(#4570B0, #0081C2);
+}
+
+.gradient-blue-reversed { 
+  background-image: linear-gradient(#0081C2, #4570B0);
+}
+
+.gradient-light-blue { 
+  background-image: linear-gradient(#76D3FE, #008AE0);
+}
+
+.gradient-light-blue-reversed { 
+  background-image: linear-gradient(#008AE0, #76D3FE);
+}

src/rawdata/scss/tachyons/scss/_heights.scss

@@ -0,0 +1,131 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   HEIGHTS
+   Docs: http://tachyons.io/docs/layout/heights/
+
+   Base:
+     h = height
+     min-h = min-height
+     min-vh = min-height vertical screen height
+     vh = vertical screen height
+
+   Modifiers
+     1 = 1st step in height scale
+     2 = 2nd step in height scale
+     3 = 3rd step in height scale
+     4 = 4th step in height scale
+     5 = 5th step in height scale
+
+     -25   = literal value 25%
+     -50   = literal value 50%
+     -75   = literal value 75%
+     -100  = literal value 100%
+
+     -auto = string value of auto
+     -inherit = string value of inherit
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+/* Height Scale */
+
+.h1 { height: $height-1; }
+.h2 { height: $height-2; }
+.h3 { height: $height-3; }
+.h4 { height: $height-4; }
+.h5 { height: $height-5; }
+
+/* Height Percentages - Based off of height of parent */
+
+.h-25 {  height:  25%; }
+.h-50 {  height:  50%; }
+.h-75 {  height:  75%; }
+.h-100 { height: 100%; }
+
+.min-h-100 { min-height: 100%; }
+
+/* Screen Height Percentage */
+
+.vh-25 {  height:  25vh; }
+.vh-50 {  height:  50vh; }
+.vh-75 {  height:  75vh; }
+.vh-100 { height: 100vh; }
+
+.min-vh-100 { min-height: 100vh; }
+
+
+/* String Properties */
+
+.h-auto {     height: auto; }
+.h-inherit {  height: inherit; }
+
+@media #{$breakpoint-not-small} {
+  .h1-ns {  height: $height-1; }
+  .h2-ns {  height: $height-2; }
+  .h3-ns {  height: $height-3; }
+  .h4-ns {  height: $height-4; }
+  .h5-ns {  height: $height-5; }
+  .h-25-ns { height: 25%; }
+  .h-50-ns { height: 50%; }
+  .h-75-ns { height: 75%; }
+  .h-100-ns { height: 100%; }
+  .min-h-100-ns { min-height: 100%; }
+  .vh-25-ns {  height:  25vh; }
+  .vh-50-ns {  height:  50vh; }
+  .vh-75-ns {  height:  75vh; }
+  .vh-100-ns { height: 100vh; }
+  .min-vh-100-ns { min-height: 100vh; }
+  .h-auto-ns { height: auto; }
+  .h-inherit-ns { height: inherit; }
+}
+
+@media #{$breakpoint-medium} {
+  .h1-m { height: $height-1; }
+  .h2-m { height: $height-2; }
+  .h3-m { height: $height-3; }
+  .h4-m { height: $height-4; }
+  .h5-m { height: $height-5; }
+  .h-25-m { height: 25%; }
+  .h-50-m { height: 50%; }
+  .h-75-m { height: 75%; }
+  .h-100-m { height: 100%; }
+  .min-h-100-m { min-height: 100%; }
+  .vh-25-m {  height:  25vh; }
+  .vh-50-m {  height:  50vh; }
+  .vh-75-m {  height:  75vh; }
+  .vh-100-m { height: 100vh; }
+  .min-vh-100-m { min-height: 100vh; }
+  .h-auto-m { height: auto; }
+  .h-inherit-m { height: inherit; }
+}
+
+@media #{$breakpoint-large} {
+  .h1-l { height: $height-1; }
+  .h2-l { height: $height-2; }
+  .h3-l { height: $height-3; }
+  .h4-l { height: $height-4; }
+  .h5-l { height: $height-5; }
+  .h-25-l { height: 25%; }
+  .h-50-l { height: 50%; }
+  .h-75-l { height: 75%; }
+  .h-100-l { height: 100%; }
+  .min-h-100-l { min-height: 100%; }
+  .vh-25-l {  height:  25vh; }
+  .vh-50-l {  height:  50vh; }
+  .vh-75-l {  height:  75vh; }
+  .vh-100-l { height: 100vh; }
+  .min-vh-100-l { min-height: 100vh; }
+  .h-auto-l { height: auto; }
+  .h-inherit-l { height: inherit; }
+}

src/rawdata/scss/tachyons/scss/_hovers.scss

@@ -0,0 +1,166 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  HOVER EFFECTS
+  Docs: http://tachyons.io/docs/themes/hovers/
+
+    - Dim
+    - Glow
+    - Hide Child
+    - Underline text
+    - Grow
+    - Pointer
+    - Shadow
+
+*/
+
+/*
+
+  Dim element on hover by adding the dim class.
+
+*/
+.dim {
+  opacity: 1;
+  transition: opacity .15s ease-in;
+}
+.dim:hover,
+.dim:focus {
+  opacity: .5;
+  transition: opacity .15s ease-in;
+}
+.dim:active {
+  opacity: .8; transition: opacity .15s ease-out;
+}
+
+/*
+
+  Animate opacity to 100% on hover by adding the glow class.
+
+*/
+.glow {
+  transition: opacity .15s ease-in;
+}
+.glow:hover,
+.glow:focus {
+  opacity: 1;
+  transition: opacity .15s ease-in;
+}
+
+/*
+
+  Hide child & reveal on hover:
+
+  Put the hide-child class on a parent element and any nested element with the
+  child class will be hidden and displayed on hover or focus.
+
+  <div class="hide-child">
+    <div class="child"> Hidden until hover or focus </div>
+    <div class="child"> Hidden until hover or focus </div>
+    <div class="child"> Hidden until hover or focus </div>
+    <div class="child"> Hidden until hover or focus </div>
+  </div>
+*/
+
+.hide-child .child {
+  opacity: 0;
+  transition: opacity .15s ease-in;
+}
+.hide-child:hover  .child,
+.hide-child:focus  .child,
+.hide-child:active .child {
+  opacity: 1;
+  transition: opacity .15s ease-in;
+}
+
+.underline-hover:hover,
+.underline-hover:focus {
+  text-decoration: underline;
+}
+
+/* Can combine this with overflow-hidden to make background images grow on hover
+ * even if you are using background-size: cover */
+
+.grow {
+  -moz-osx-font-smoothing: grayscale;
+  backface-visibility: hidden;
+  transform: translateZ(0);
+  transition: transform 0.25s ease-out;
+}
+
+.grow:hover,
+.grow:focus {
+  transform: scale(1.05);
+}
+
+.grow:active {
+  transform: scale(.90);
+}
+
+.grow-large {
+  -moz-osx-font-smoothing: grayscale;
+  backface-visibility: hidden;
+  transform: translateZ(0);
+  transition: transform .25s ease-in-out;
+}
+
+.grow-large:hover,
+.grow-large:focus {
+  transform: scale(1.2);
+}
+
+.grow-large:active {
+  transform: scale(.95);
+}
+
+/* Add pointer on hover */
+
+.pointer:hover {
+  cursor: pointer;
+}
+
+/*
+   Add shadow on hover.
+
+   Performant box-shadow animation pattern from
+   http://tobiasahlin.com/blog/how-to-animate-box-shadow/
+*/
+
+.shadow-hover {
+  cursor: pointer;
+  position: relative;
+  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
+}
+
+.shadow-hover::after {
+  content: '';
+  box-shadow: 0px 0px 16px 2px rgba( 0, 0, 0, .2 );
+  border-radius: inherit;
+  opacity: 0;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  transition: opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
+}
+
+.shadow-hover:hover::after,
+.shadow-hover:focus::after {
+  opacity: 1;
+}
+
+/* Combine with classes in skins and skins-pseudo for
+ * many different transition possibilities. */
+
+.bg-animate,
+.bg-animate:hover,
+.bg-animate:focus {
+  transition: background-color .15s ease-in-out;
+}

src/rawdata/scss/tachyons/scss/_images.scss

@@ -0,0 +1,18 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   IMAGES
+   Docs: http://tachyons.io/docs/elements/images/
+
+*/
+
+/* Responsive images! */
+
+img, video { max-width: 100%; }
+

src/rawdata/scss/tachyons/scss/_letter-spacing.scss

@@ -0,0 +1,40 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   LETTER SPACING
+   Docs: http://tachyons.io/docs/typography/tracking/
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.tracked       { letter-spacing:  $letter-spacing-1; }
+.tracked-tight { letter-spacing: $letter-spacing-tight; }
+.tracked-mega  { letter-spacing:  $letter-spacing-2; }
+
+@media #{$breakpoint-not-small} {
+  .tracked-ns       { letter-spacing:  $letter-spacing-1; }
+  .tracked-tight-ns { letter-spacing: $letter-spacing-tight; }
+  .tracked-mega-ns  { letter-spacing:  $letter-spacing-2; }
+}
+
+@media #{$breakpoint-medium} {
+  .tracked-m       { letter-spacing:  $letter-spacing-1; }
+  .tracked-tight-m { letter-spacing: $letter-spacing-tight; }
+  .tracked-mega-m  { letter-spacing:  $letter-spacing-2; }
+}
+
+@media #{$breakpoint-large} {
+  .tracked-l       { letter-spacing:  $letter-spacing-1; }
+  .tracked-tight-l { letter-spacing: $letter-spacing-tight; }
+  .tracked-mega-l  { letter-spacing:  $letter-spacing-2; }
+}

src/rawdata/scss/tachyons/scss/_line-height.scss

@@ -0,0 +1,41 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   LINE HEIGHT / LEADING
+   Docs: http://tachyons.io/docs/typography/line-height
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+  .lh-solid { line-height: $line-height-solid; }
+  .lh-title { line-height: $line-height-title; }
+  .lh-copy  { line-height: $line-height-copy; }
+
+@media #{$breakpoint-not-small} {
+  .lh-solid-ns { line-height: $line-height-solid; }
+  .lh-title-ns { line-height: $line-height-title; }
+  .lh-copy-ns  { line-height: $line-height-copy; }
+}
+
+@media #{$breakpoint-medium} {
+  .lh-solid-m { line-height: $line-height-solid; }
+  .lh-title-m { line-height: $line-height-title; }
+  .lh-copy-m  { line-height: $line-height-copy; }
+}
+
+@media #{$breakpoint-large} {
+  .lh-solid-l { line-height: $line-height-solid; }
+  .lh-title-l { line-height: $line-height-title; }
+  .lh-copy-l  { line-height: $line-height-copy; }
+}
+

src/rawdata/scss/tachyons/scss/_links.scss

@@ -0,0 +1,34 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   LINKS
+   Docs: http://tachyons.io/docs/elements/links/
+
+*/
+
+.link {
+  text-decoration: none;
+  transition: color .15s ease-in;
+}
+
+.link:link,
+.link:visited {
+  transition: color .15s ease-in;
+}
+.link:hover   {
+  transition: color .15s ease-in;
+}
+.link:active  {
+  transition: color .15s ease-in;
+}
+.link:focus   {
+  transition: color .15s ease-in;
+  outline: 1px dotted currentColor;
+}
+

src/rawdata/scss/tachyons/scss/_lists.scss

@@ -0,0 +1,15 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   LISTS
+   http://tachyons.io/docs/elements/lists/
+
+*/
+
+.list {         list-style-type: none; }

src/rawdata/scss/tachyons/scss/_max-widths.scss

@@ -0,0 +1,105 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   MAX WIDTHS
+   Docs: http://tachyons.io/docs/layout/max-widths/
+
+   Base:
+     mw = max-width
+
+   Modifiers
+     1 = 1st step in width scale
+     2 = 2nd step in width scale
+     3 = 3rd step in width scale
+     4 = 4th step in width scale
+     5 = 5th step in width scale
+     6 = 6st step in width scale
+     7 = 7nd step in width scale
+     8 = 8rd step in width scale
+     9 = 9th step in width scale
+
+     -100 = literal value 100%
+
+     -none  = string value none
+
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+/* Max Width Percentages */
+
+.mw-100  { max-width: 100%; }
+
+/* Max Width Scale */
+
+.mw1  {  max-width: $max-width-1; }
+.mw2  {  max-width: $max-width-2; }
+.mw3  {  max-width: $max-width-3; }
+.mw4  {  max-width: $max-width-4; }
+.mw5  {  max-width: $max-width-5; }
+.mw6  {  max-width: $max-width-6; }
+.mw7  {  max-width: $max-width-7; }
+.mw8  {  max-width: $max-width-8; }
+.mw9  {  max-width: $max-width-9; }
+
+/* Max Width String Properties */
+
+.mw-none { max-width: none; }
+
+@media #{$breakpoint-not-small} {
+  .mw-100-ns  { max-width: 100%; }
+
+  .mw1-ns  {  max-width: $max-width-1; }
+  .mw2-ns  {  max-width: $max-width-2; }
+  .mw3-ns  {  max-width: $max-width-3; }
+  .mw4-ns  {  max-width: $max-width-4; }
+  .mw5-ns  {  max-width: $max-width-5; }
+  .mw6-ns  {  max-width: $max-width-6; }
+  .mw7-ns  {  max-width: $max-width-7; }
+  .mw8-ns  {  max-width: $max-width-8; }
+  .mw9-ns  {  max-width: $max-width-9; }
+
+  .mw-none-ns { max-width: none; }
+}
+
+@media #{$breakpoint-medium} {
+  .mw-100-m  { max-width: 100%; }
+
+  .mw1-m  {  max-width: $max-width-1; }
+  .mw2-m  {  max-width: $max-width-2; }
+  .mw3-m  {  max-width: $max-width-3; }
+  .mw4-m  {  max-width: $max-width-4; }
+  .mw5-m  {  max-width: $max-width-5; }
+  .mw6-m  {  max-width: $max-width-6; }
+  .mw7-m  {  max-width: $max-width-7; }
+  .mw8-m  {  max-width: $max-width-8; }
+  .mw9-m  {  max-width: $max-width-9; }
+
+  .mw-none-m { max-width: none; }
+}
+
+@media #{$breakpoint-large} {
+  .mw-100-l  { max-width: 100%; }
+
+  .mw1-l  {  max-width: $max-width-1; }
+  .mw2-l  {  max-width: $max-width-2; }
+  .mw3-l  {  max-width: $max-width-3; }
+  .mw4-l  {  max-width: $max-width-4; }
+  .mw5-l  {  max-width: $max-width-5; }
+  .mw6-l  {  max-width: $max-width-6; }
+  .mw7-l  {  max-width: $max-width-7; }
+  .mw8-l  {  max-width: $max-width-8; }
+  .mw9-l  {  max-width: $max-width-9; }
+
+  .mw-none-l { max-width: none; }
+}

src/rawdata/scss/tachyons/scss/_module-template.scss

@@ -0,0 +1,29 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  MODULE NAME
+
+  Use this scaffolding to create or extend your own modules with tachyons
+  style architecture.
+
+*/
+
+
+@media #{$breakpoint-not-small} {
+
+}
+
+@media #{$breakpoint-medium} {
+
+}
+
+@media #{$breakpoint-large} {
+
+}
+

src/rawdata/scss/tachyons/scss/_negative-margins.scss

@@ -0,0 +1,205 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+   NEGATIVE MARGINS
+
+   Base:
+     n = negative
+
+   Modifiers:
+     a = all
+     t = top
+     r = right
+     b = bottom
+     l = left
+
+     1 = 1st step in spacing scale
+     2 = 2nd step in spacing scale
+     3 = 3rd step in spacing scale
+     4 = 4th step in spacing scale
+     5 = 5th step in spacing scale
+     6 = 6th step in spacing scale
+     7 = 7th step in spacing scale
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+
+
+.na1 { margin: -$spacing-extra-small; }
+.na2 { margin: -$spacing-small; }
+.na3 { margin: -$spacing-medium; }
+.na4 { margin: -$spacing-large; }
+.na5 { margin: -$spacing-extra-large; }
+.na6 { margin: -$spacing-extra-extra-large; }
+.na7 { margin: -$spacing-extra-extra-extra-large; }
+
+.nl1 { margin-left: -$spacing-extra-small; }
+.nl2 { margin-left: -$spacing-small; }
+.nl3 { margin-left: -$spacing-medium; }
+.nl4 { margin-left: -$spacing-large; }
+.nl5 { margin-left: -$spacing-extra-large; }
+.nl6 { margin-left: -$spacing-extra-extra-large; }
+.nl7 { margin-left: -$spacing-extra-extra-extra-large; }
+
+.nr1 { margin-right: -$spacing-extra-small; }
+.nr2 { margin-right: -$spacing-small; }
+.nr3 { margin-right: -$spacing-medium; }
+.nr4 { margin-right: -$spacing-large; }
+.nr5 { margin-right: -$spacing-extra-large; }
+.nr6 { margin-right: -$spacing-extra-extra-large; }
+.nr7 { margin-right: -$spacing-extra-extra-extra-large; }
+
+.nb1 { margin-bottom: -$spacing-extra-small; }
+.nb2 { margin-bottom: -$spacing-small; }
+.nb3 { margin-bottom: -$spacing-medium; }
+.nb4 { margin-bottom: -$spacing-large; }
+.nb5 { margin-bottom: -$spacing-extra-large; }
+.nb6 { margin-bottom: -$spacing-extra-extra-large; }
+.nb7 { margin-bottom: -$spacing-extra-extra-extra-large; }
+
+.nt1 { margin-top: -$spacing-extra-small; }
+.nt2 { margin-top: -$spacing-small; }
+.nt3 { margin-top: -$spacing-medium; }
+.nt4 { margin-top: -$spacing-large; }
+.nt5 { margin-top: -$spacing-extra-large; }
+.nt6 { margin-top: -$spacing-extra-extra-large; }
+.nt7 { margin-top: -$spacing-extra-extra-extra-large; }
+
+@media #{$breakpoint-not-small} {
+
+  .na1-ns { margin: -$spacing-extra-small; }
+  .na2-ns { margin: -$spacing-small; }
+  .na3-ns { margin: -$spacing-medium; }
+  .na4-ns { margin: -$spacing-large; }
+  .na5-ns { margin: -$spacing-extra-large; }
+  .na6-ns { margin: -$spacing-extra-extra-large; }
+  .na7-ns { margin: -$spacing-extra-extra-extra-large; }
+
+  .nl1-ns { margin-left: -$spacing-extra-small; }
+  .nl2-ns { margin-left: -$spacing-small; }
+  .nl3-ns { margin-left: -$spacing-medium; }
+  .nl4-ns { margin-left: -$spacing-large; }
+  .nl5-ns { margin-left: -$spacing-extra-large; }
+  .nl6-ns { margin-left: -$spacing-extra-extra-large; }
+  .nl7-ns { margin-left: -$spacing-extra-extra-extra-large; }
+
+  .nr1-ns { margin-right: -$spacing-extra-small; }
+  .nr2-ns { margin-right: -$spacing-small; }
+  .nr3-ns { margin-right: -$spacing-medium; }
+  .nr4-ns { margin-right: -$spacing-large; }
+  .nr5-ns { margin-right: -$spacing-extra-large; }
+  .nr6-ns { margin-right: -$spacing-extra-extra-large; }
+  .nr7-ns { margin-right: -$spacing-extra-extra-extra-large; }
+
+  .nb1-ns { margin-bottom: -$spacing-extra-small; }
+  .nb2-ns { margin-bottom: -$spacing-small; }
+  .nb3-ns { margin-bottom: -$spacing-medium; }
+  .nb4-ns { margin-bottom: -$spacing-large; }
+  .nb5-ns { margin-bottom: -$spacing-extra-large; }
+  .nb6-ns { margin-bottom: -$spacing-extra-extra-large; }
+  .nb7-ns { margin-bottom: -$spacing-extra-extra-extra-large; }
+
+  .nt1-ns { margin-top: -$spacing-extra-small; }
+  .nt2-ns { margin-top: -$spacing-small; }
+  .nt3-ns { margin-top: -$spacing-medium; }
+  .nt4-ns { margin-top: -$spacing-large; }
+  .nt5-ns { margin-top: -$spacing-extra-large; }
+  .nt6-ns { margin-top: -$spacing-extra-extra-large; }
+  .nt7-ns { margin-top: -$spacing-extra-extra-extra-large; }
+
+}
+
+@media #{$breakpoint-medium} {
+  .na1-m { margin: -$spacing-extra-small; }
+  .na2-m { margin: -$spacing-small; }
+  .na3-m { margin: -$spacing-medium; }
+  .na4-m { margin: -$spacing-large; }
+  .na5-m { margin: -$spacing-extra-large; }
+  .na6-m { margin: -$spacing-extra-extra-large; }
+  .na7-m { margin: -$spacing-extra-extra-extra-large; }
+
+  .nl1-m { margin-left: -$spacing-extra-small; }
+  .nl2-m { margin-left: -$spacing-small; }
+  .nl3-m { margin-left: -$spacing-medium; }
+  .nl4-m { margin-left: -$spacing-large; }
+  .nl5-m { margin-left: -$spacing-extra-large; }
+  .nl6-m { margin-left: -$spacing-extra-extra-large; }
+  .nl7-m { margin-left: -$spacing-extra-extra-extra-large; }
+
+  .nr1-m { margin-right: -$spacing-extra-small; }
+  .nr2-m { margin-right: -$spacing-small; }
+  .nr3-m { margin-right: -$spacing-medium; }
+  .nr4-m { margin-right: -$spacing-large; }
+  .nr5-m { margin-right: -$spacing-extra-large; }
+  .nr6-m { margin-right: -$spacing-extra-extra-large; }
+  .nr7-m { margin-right: -$spacing-extra-extra-extra-large; }
+
+  .nb1-m { margin-bottom: -$spacing-extra-small; }
+  .nb2-m { margin-bottom: -$spacing-small; }
+  .nb3-m { margin-bottom: -$spacing-medium; }
+  .nb4-m { margin-bottom: -$spacing-large; }
+  .nb5-m { margin-bottom: -$spacing-extra-large; }
+  .nb6-m { margin-bottom: -$spacing-extra-extra-large; }
+  .nb7-m { margin-bottom: -$spacing-extra-extra-extra-large; }
+
+  .nt1-m { margin-top: -$spacing-extra-small; }
+  .nt2-m { margin-top: -$spacing-small; }
+  .nt3-m { margin-top: -$spacing-medium; }
+  .nt4-m { margin-top: -$spacing-large; }
+  .nt5-m { margin-top: -$spacing-extra-large; }
+  .nt6-m { margin-top: -$spacing-extra-extra-large; }
+  .nt7-m { margin-top: -$spacing-extra-extra-extra-large; }
+
+}
+
+@media #{$breakpoint-large} {
+  .na1-l { margin: -$spacing-extra-small; }
+  .na2-l { margin: -$spacing-small; }
+  .na3-l { margin: -$spacing-medium; }
+  .na4-l { margin: -$spacing-large; }
+  .na5-l { margin: -$spacing-extra-large; }
+  .na6-l { margin: -$spacing-extra-extra-large; }
+  .na7-l { margin: -$spacing-extra-extra-extra-large; }
+
+  .nl1-l { margin-left: -$spacing-extra-small; }
+  .nl2-l { margin-left: -$spacing-small; }
+  .nl3-l { margin-left: -$spacing-medium; }
+  .nl4-l { margin-left: -$spacing-large; }
+  .nl5-l { margin-left: -$spacing-extra-large; }
+  .nl6-l { margin-left: -$spacing-extra-extra-large; }
+  .nl7-l { margin-left: -$spacing-extra-extra-extra-large; }
+
+  .nr1-l { margin-right: -$spacing-extra-small; }
+  .nr2-l { margin-right: -$spacing-small; }
+  .nr3-l { margin-right: -$spacing-medium; }
+  .nr4-l { margin-right: -$spacing-large; }
+  .nr5-l { margin-right: -$spacing-extra-large; }
+  .nr6-l { margin-right: -$spacing-extra-extra-large; }
+  .nr7-l { margin-right: -$spacing-extra-extra-extra-large; }
+
+  .nb1-l { margin-bottom: -$spacing-extra-small; }
+  .nb2-l { margin-bottom: -$spacing-small; }
+  .nb3-l { margin-bottom: -$spacing-medium; }
+  .nb4-l { margin-bottom: -$spacing-large; }
+  .nb5-l { margin-bottom: -$spacing-extra-large; }
+  .nb6-l { margin-bottom: -$spacing-extra-extra-large; }
+  .nb7-l { margin-bottom: -$spacing-extra-extra-extra-large; }
+
+  .nt1-l { margin-top: -$spacing-extra-small; }
+  .nt2-l { margin-top: -$spacing-small; }
+  .nt3-l { margin-top: -$spacing-medium; }
+  .nt4-l { margin-top: -$spacing-large; }
+  .nt5-l { margin-top: -$spacing-extra-large; }
+  .nt6-l { margin-top: -$spacing-extra-extra-large; }
+  .nt7-l { margin-top: -$spacing-extra-extra-extra-large; }
+}

src/rawdata/scss/tachyons/scss/_nested.scss

@@ -0,0 +1,63 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+    NESTED
+    Tachyons module for styling nested elements
+    that are generated by a cms.
+
+*/
+
+.nested-copy-line-height p,
+.nested-copy-line-height ul,
+.nested-copy-line-height ol {
+  line-height: $line-height-copy;
+}
+
+.nested-headline-line-height h1,
+.nested-headline-line-height h2,
+.nested-headline-line-height h3,
+.nested-headline-line-height h4,
+.nested-headline-line-height h5,
+.nested-headline-line-height h6 {
+  line-height: $line-height-title;
+}
+
+.nested-list-reset ul,
+.nested-list-reset ol {
+  padding-left: 0;
+  margin-left: 0;
+  list-style-type: none;
+}
+
+.nested-copy-indent p+p {
+  text-indent: $letter-spacing-1;
+  margin-top: $spacing-none;
+  margin-bottom: $spacing-none;
+}
+
+.nested-copy-seperator p+p {
+  margin-top: $spacing-copy-separator;
+}
+
+.nested-img img {
+  width: 100%;
+  max-width: 100%;
+  display: block;
+}
+
+.nested-links a {
+  color: $blue;
+  transition: color .15s ease-in;
+}
+
+.nested-links a:hover,
+.nested-links a:focus {
+  color: $light-blue;
+  transition: color .15s ease-in;
+}

src/rawdata/scss/tachyons/scss/_normalize.scss

@@ -0,0 +1,454 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in
+ *    IE on Windows Phone and in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -ms-text-size-adjust: 100%; /* 2 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers (opinionated).
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+article,
+aside,
+footer,
+header,
+nav,
+section {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in IE.
+ */
+
+figcaption,
+figure,
+main { /* 1 */
+  display: block;
+}
+
+/**
+ * Add the correct margin in IE 8.
+ */
+
+figure {
+  margin: 1em 40px;
+}
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * 1. Remove the gray background on active links in IE 10.
+ * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
+ */
+
+a {
+  background-color: transparent; /* 1 */
+  -webkit-text-decoration-skip: objects; /* 2 */
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
+ */
+
+b,
+strong {
+  font-weight: inherit;
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font style in Android 4.3-.
+ */
+
+dfn {
+  font-style: italic;
+}
+
+/**
+ * Add the correct background and color in IE 9-.
+ */
+
+mark {
+  background-color: #ff0;
+  color: #000;
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+audio,
+video {
+  display: inline-block;
+}
+
+/**
+ * Add the correct display in iOS 4-7.
+ */
+
+audio:not([controls]) {
+  display: none;
+  height: 0;
+}
+
+/**
+ * Remove the border on images inside links in IE 10-.
+ */
+
+img {
+  border-style: none;
+}
+
+/**
+ * Hide the overflow in IE.
+ */
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers (opinionated).
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: sans-serif; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
+ *    controls in Android 4.
+ * 2. Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+html [type="button"], /* 1 */
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button; /* 2 */
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * 1. Add the correct display in IE 9-.
+ * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  display: inline-block; /* 1 */
+  vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Remove the default vertical scrollbar in IE.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10-.
+ * 2. Remove the padding in IE 10-.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-cancel-button,
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in Edge, IE, and Firefox.
+ */
+
+details, /* 1 */
+menu {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Scripting
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+canvas {
+  display: inline-block;
+}
+
+/**
+ * Add the correct display in IE.
+ */
+
+template {
+  display: none;
+}
+
+/* Hidden
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10-.
+ */
+
+[hidden] {
+  display: none;
+}

src/rawdata/scss/tachyons/scss/_opacity.scss

@@ -0,0 +1,27 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+    OPACITY
+    Docs: http://tachyons.io/docs/themes/opacity/
+
+*/
+
+.o-100 { opacity: 1;    }
+.o-90  { opacity: .9;   }
+.o-80  { opacity: .8;   }
+.o-70  { opacity: .7;   }
+.o-60  { opacity: .6;   }
+.o-50  { opacity: .5;   }
+.o-40  { opacity: .4;   }
+.o-30  { opacity: .3;   }
+.o-20  { opacity: .2;   }
+.o-10  { opacity: .1;   }
+.o-05  { opacity: .05;  }
+.o-025 { opacity: .025; }
+.o-0   { opacity: 0; }

src/rawdata/scss/tachyons/scss/_outlines.scss

@@ -0,0 +1,39 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   OUTLINES
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.outline { outline: 1px solid; }
+.outline-transparent { outline: 1px solid transparent; }
+.outline-0 { outline: 0; }
+
+@media #{$breakpoint-not-small} {
+  .outline-ns { outline: 1px solid; }
+  .outline-transparent-ns { outline: 1px solid transparent; }
+  .outline-0-ns { outline: 0; }
+}
+
+@media #{$breakpoint-medium} {
+  .outline-m { outline: 1px solid; }
+  .outline-transparent-m { outline: 1px solid transparent; }
+  .outline-0-m { outline: 0; }
+}
+
+@media #{$breakpoint-large} {
+  .outline-l { outline: 1px solid; }
+  .outline-transparent-l { outline: 1px solid transparent; }
+  .outline-0-l { outline: 0; }
+}

src/rawdata/scss/tachyons/scss/_overflow.scss

@@ -0,0 +1,82 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+    OVERFLOW
+
+    Media Query Extensions:
+      -ns = not-small
+      -m  = medium
+      -l  = large
+
+ */
+
+.overflow-visible { overflow: visible; }
+.overflow-hidden { overflow: hidden; }
+.overflow-scroll { overflow: scroll; }
+.overflow-auto { overflow: auto; }
+
+.overflow-x-visible { overflow-x: visible; }
+.overflow-x-hidden { overflow-x: hidden; }
+.overflow-x-scroll { overflow-x: scroll; }
+.overflow-x-auto { overflow-x: auto; }
+
+.overflow-y-visible { overflow-y: visible; }
+.overflow-y-hidden { overflow-y: hidden; }
+.overflow-y-scroll { overflow-y: scroll; }
+.overflow-y-auto { overflow-y: auto; }
+
+@media #{$breakpoint-not-small} {
+  .overflow-visible-ns { overflow: visible; }
+  .overflow-hidden-ns { overflow: hidden; }
+  .overflow-scroll-ns { overflow: scroll; }
+  .overflow-auto-ns { overflow: auto; }
+  .overflow-x-visible-ns { overflow-x: visible; }
+  .overflow-x-hidden-ns { overflow-x: hidden; }
+  .overflow-x-scroll-ns { overflow-x: scroll; }
+  .overflow-x-auto-ns { overflow-x: auto; }
+
+  .overflow-y-visible-ns { overflow-y: visible; }
+  .overflow-y-hidden-ns { overflow-y: hidden; }
+  .overflow-y-scroll-ns { overflow-y: scroll; }
+  .overflow-y-auto-ns { overflow-y: auto; }
+}
+
+@media #{$breakpoint-medium} {
+  .overflow-visible-m { overflow: visible; }
+  .overflow-hidden-m { overflow: hidden; }
+  .overflow-scroll-m { overflow: scroll; }
+  .overflow-auto-m { overflow: auto; }
+
+  .overflow-x-visible-m { overflow-x: visible; }
+  .overflow-x-hidden-m { overflow-x: hidden; }
+  .overflow-x-scroll-m { overflow-x: scroll; }
+  .overflow-x-auto-m { overflow-x: auto; }
+
+  .overflow-y-visible-m { overflow-y: visible; }
+  .overflow-y-hidden-m { overflow-y: hidden; }
+  .overflow-y-scroll-m { overflow-y: scroll; }
+  .overflow-y-auto-m { overflow-y: auto; }
+}
+
+@media #{$breakpoint-large} {
+  .overflow-visible-l { overflow: visible; }
+  .overflow-hidden-l { overflow: hidden; }
+  .overflow-scroll-l { overflow: scroll; }
+  .overflow-auto-l { overflow: auto; }
+
+  .overflow-x-visible-l { overflow-x: visible; }
+  .overflow-x-hidden-l { overflow-x: hidden; }
+  .overflow-x-scroll-l { overflow-x: scroll; }
+  .overflow-x-auto-l { overflow-x: auto; }
+
+  .overflow-y-visible-l { overflow-y: visible; }
+  .overflow-y-hidden-l { overflow-y: hidden; }
+  .overflow-y-scroll-l { overflow-y: scroll; }
+  .overflow-y-auto-l { overflow-y: auto; }
+}

src/rawdata/scss/tachyons/scss/_position.scss

@@ -0,0 +1,44 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   POSITIONING
+   Docs: http://tachyons.io/docs/layout/position/
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.static { position: static; }
+.relative  { position: relative; }
+.absolute  { position: absolute; }
+.fixed  { position: fixed; }
+
+@media #{$breakpoint-not-small} {
+  .static-ns { position: static; }
+  .relative-ns  { position: relative; }
+  .absolute-ns  { position: absolute; }
+  .fixed-ns  { position: fixed; }
+}
+
+@media #{$breakpoint-medium} {
+  .static-m { position: static; }
+  .relative-m  { position: relative; }
+  .absolute-m  { position: absolute; }
+  .fixed-m  { position: fixed; }
+}
+
+@media #{$breakpoint-large} {
+  .static-l { position: static; }
+  .relative-l  { position: relative; }
+  .absolute-l  { position: absolute; }
+  .fixed-l  { position: fixed; }
+}

src/rawdata/scss/tachyons/scss/_rotations.scss

@@ -0,0 +1,50 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   ROTATIONS
+
+*/
+
+.rotate-45 { transform: rotate(45deg); }
+.rotate-90 { transform: rotate(90deg); }
+.rotate-135 { transform: rotate(135deg); }
+.rotate-180 { transform: rotate(180deg); }
+.rotate-225 { transform: rotate(225deg); }
+.rotate-270 { transform: rotate(270deg); }
+.rotate-315 { transform: rotate(315deg); }
+
+@media #{$breakpoint-not-small}{
+  .rotate-45-ns { transform: rotate(45deg); }
+  .rotate-90-ns { transform: rotate(90deg); }
+  .rotate-135-ns { transform: rotate(135deg); }
+  .rotate-180-ns { transform: rotate(180deg); }
+  .rotate-225-ns { transform: rotate(225deg); }
+  .rotate-270-ns { transform: rotate(270deg); }
+  .rotate-315-ns { transform: rotate(315deg); }
+}
+
+@media #{$breakpoint-medium}{
+  .rotate-45-m { transform: rotate(45deg); }
+  .rotate-90-m { transform: rotate(90deg); }
+  .rotate-135-m { transform: rotate(135deg); }
+  .rotate-180-m { transform: rotate(180deg); }
+  .rotate-225-m { transform: rotate(225deg); }
+  .rotate-270-m { transform: rotate(270deg); }
+  .rotate-315-m { transform: rotate(315deg); }
+}
+
+@media #{$breakpoint-large}{
+  .rotate-45-l { transform: rotate(45deg); }
+  .rotate-90-l { transform: rotate(90deg); }
+  .rotate-135-l { transform: rotate(135deg); }
+  .rotate-180-l { transform: rotate(180deg); }
+  .rotate-225-l { transform: rotate(225deg); }
+  .rotate-270-l { transform: rotate(270deg); }
+  .rotate-315-l { transform: rotate(315deg); }
+}

src/rawdata/scss/tachyons/scss/_skins-pseudo.scss

@@ -0,0 +1,243 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   SKINS:PSEUDO
+
+   Customize the color of an element when
+   it is focused or hovered over.
+
+ */
+
+.hover-black:hover,
+.hover-black:focus { color: $black; }
+.hover-near-black:hover,
+.hover-near-black:focus { color: $near-black; }
+.hover-dark-gray:hover,
+.hover-dark-gray:focus { color: $dark-gray; }
+.hover-mid-gray:hover,
+.hover-mid-gray:focus { color: $mid-gray; }
+.hover-gray:hover,
+.hover-gray:focus { color: $gray; }
+.hover-silver:hover,
+.hover-silver:focus { color: $silver; }
+.hover-light-silver:hover,
+.hover-light-silver:focus { color: $light-silver; }
+.hover-moon-gray:hover,
+.hover-moon-gray:focus { color: $moon-gray; }
+.hover-light-gray:hover,
+.hover-light-gray:focus { color: $light-gray; }
+.hover-near-white:hover,
+.hover-near-white:focus { color: $near-white; }
+.hover-white:hover,
+.hover-white:focus { color: $white; }
+
+.hover-black-90:hover,
+.hover-black-90:focus { color: $black-90; }
+.hover-black-80:hover,
+.hover-black-80:focus { color: $black-80; }
+.hover-black-70:hover,
+.hover-black-70:focus { color: $black-70; }
+.hover-black-60:hover,
+.hover-black-60:focus { color: $black-60; }
+.hover-black-50:hover,
+.hover-black-50:focus { color: $black-50; }
+.hover-black-40:hover,
+.hover-black-40:focus { color: $black-40; }
+.hover-black-30:hover,
+.hover-black-30:focus { color: $black-30; }
+.hover-black-20:hover,
+.hover-black-20:focus { color: $black-20; }
+.hover-black-10:hover,
+.hover-black-10:focus { color: $black-10; }
+.hover-white-90:hover,
+.hover-white-90:focus { color: $white-90; }
+.hover-white-80:hover,
+.hover-white-80:focus { color: $white-80; }
+.hover-white-70:hover,
+.hover-white-70:focus { color: $white-70; }
+.hover-white-60:hover,
+.hover-white-60:focus { color: $white-60; }
+.hover-white-50:hover,
+.hover-white-50:focus { color: $white-50; }
+.hover-white-40:hover,
+.hover-white-40:focus { color: $white-40; }
+.hover-white-30:hover,
+.hover-white-30:focus { color: $white-30; }
+.hover-white-20:hover,
+.hover-white-20:focus { color: $white-20; }
+.hover-white-10:hover,
+.hover-white-10:focus { color: $white-10; }
+.hover-inherit:hover,
+.hover-inherit:focus { color: inherit; }
+
+.hover-bg-black:hover,
+.hover-bg-black:focus { background-color: $black; }
+.hover-bg-near-black:hover,
+.hover-bg-near-black:focus { background-color: $near-black; }
+.hover-bg-dark-gray:hover,
+.hover-bg-dark-gray:focus { background-color: $dark-gray; }
+.hover-bg-mid-gray:hover,
+.hover-bg-mid-gray:focus { background-color: $mid-gray; }
+.hover-bg-gray:hover,
+.hover-bg-gray:focus { background-color: $gray; }
+.hover-bg-silver:hover,
+.hover-bg-silver:focus { background-color: $silver; }
+.hover-bg-light-silver:hover,
+.hover-bg-light-silver:focus { background-color: $light-silver; }
+.hover-bg-moon-gray:hover,
+.hover-bg-moon-gray:focus { background-color: $moon-gray; }
+.hover-bg-light-gray:hover,
+.hover-bg-light-gray:focus { background-color: $light-gray; }
+.hover-bg-near-white:hover,
+.hover-bg-near-white:focus { background-color: $near-white; }
+.hover-bg-white:hover,
+.hover-bg-white:focus { background-color: $white; }
+.hover-bg-transparent:hover,
+.hover-bg-transparent:focus { background-color: $transparent; }
+
+.hover-bg-black-90:hover,
+.hover-bg-black-90:focus { background-color: $black-90; }
+.hover-bg-black-80:hover,
+.hover-bg-black-80:focus { background-color: $black-80; }
+.hover-bg-black-70:hover,
+.hover-bg-black-70:focus { background-color: $black-70; }
+.hover-bg-black-60:hover,
+.hover-bg-black-60:focus { background-color: $black-60; }
+.hover-bg-black-50:hover,
+.hover-bg-black-50:focus { background-color: $black-50; }
+.hover-bg-black-40:hover,
+.hover-bg-black-40:focus { background-color: $black-40; }
+.hover-bg-black-30:hover,
+.hover-bg-black-30:focus { background-color: $black-30; }
+.hover-bg-black-20:hover,
+.hover-bg-black-20:focus { background-color: $black-20; }
+.hover-bg-black-10:hover,
+.hover-bg-black-10:focus { background-color: $black-10; }
+.hover-bg-white-90:hover,
+.hover-bg-white-90:focus { background-color: $white-90; }
+.hover-bg-white-80:hover,
+.hover-bg-white-80:focus { background-color: $white-80; }
+.hover-bg-white-70:hover,
+.hover-bg-white-70:focus { background-color: $white-70; }
+.hover-bg-white-60:hover,
+.hover-bg-white-60:focus { background-color: $white-60; }
+.hover-bg-white-50:hover,
+.hover-bg-white-50:focus { background-color: $white-50; }
+.hover-bg-white-40:hover,
+.hover-bg-white-40:focus { background-color: $white-40; }
+.hover-bg-white-30:hover,
+.hover-bg-white-30:focus { background-color: $white-30; }
+.hover-bg-white-20:hover,
+.hover-bg-white-20:focus { background-color: $white-20; }
+.hover-bg-white-10:hover,
+.hover-bg-white-10:focus { background-color: $white-10; }
+
+.hover-dark-red:hover,
+.hover-dark-red:focus { color: $dark-red; }
+.hover-red:hover,
+.hover-red:focus { color: $red; }
+.hover-light-red:hover,
+.hover-light-red:focus { color: $light-red; }
+.hover-orange:hover,
+.hover-orange:focus { color: $orange; }
+.hover-gold:hover,
+.hover-gold:focus { color: $gold; }
+.hover-yellow:hover,
+.hover-yellow:focus { color: $yellow; }
+.hover-light-yellow:hover,
+.hover-light-yellow:focus { color: $light-yellow; }
+.hover-purple:hover,
+.hover-purple:focus { color: $purple; }
+.hover-light-purple:hover,
+.hover-light-purple:focus { color: $light-purple; }
+.hover-dark-pink:hover,
+.hover-dark-pink:focus { color: $dark-pink; }
+.hover-hot-pink:hover,
+.hover-hot-pink:focus { color: $hot-pink; }
+.hover-pink:hover,
+.hover-pink:focus { color: $pink; }
+.hover-light-pink:hover,
+.hover-light-pink:focus { color: $light-pink; }
+.hover-dark-green:hover,
+.hover-dark-green:focus { color: $dark-green; }
+.hover-green:hover,
+.hover-green:focus { color: $green; }
+.hover-light-green:hover,
+.hover-light-green:focus { color: $light-green; }
+.hover-navy:hover,
+.hover-navy:focus { color: $navy; }
+.hover-dark-blue:hover,
+.hover-dark-blue:focus { color: $dark-blue; }
+.hover-blue:hover,
+.hover-blue:focus { color: $blue; }
+.hover-light-blue:hover,
+.hover-light-blue:focus { color: $light-blue; }
+.hover-lightest-blue:hover,
+.hover-lightest-blue:focus { color: $lightest-blue; }
+.hover-washed-blue:hover,
+.hover-washed-blue:focus { color: $washed-blue; }
+.hover-washed-green:hover,
+.hover-washed-green:focus { color: $washed-green; }
+.hover-washed-yellow:hover,
+.hover-washed-yellow:focus { color: $washed-yellow; }
+.hover-washed-red:hover,
+.hover-washed-red:focus { color: $washed-red; }
+
+.hover-bg-dark-red:hover,
+.hover-bg-dark-red:focus { background-color: $dark-red; }
+.hover-bg-red:hover,
+.hover-bg-red:focus { background-color: $red; }
+.hover-bg-light-red:hover,
+.hover-bg-light-red:focus { background-color: $light-red; }
+.hover-bg-orange:hover,
+.hover-bg-orange:focus { background-color: $orange; }
+.hover-bg-gold:hover,
+.hover-bg-gold:focus { background-color: $gold; }
+.hover-bg-yellow:hover,
+.hover-bg-yellow:focus { background-color: $yellow; }
+.hover-bg-light-yellow:hover,
+.hover-bg-light-yellow:focus { background-color: $light-yellow; }
+.hover-bg-purple:hover,
+.hover-bg-purple:focus { background-color: $purple; }
+.hover-bg-light-purple:hover,
+.hover-bg-light-purple:focus { background-color: $light-purple; }
+.hover-bg-dark-pink:hover,
+.hover-bg-dark-pink:focus { background-color: $dark-pink; }
+.hover-bg-hot-pink:hover,
+.hover-bg-hot-pink:focus { background-color: $hot-pink; }
+.hover-bg-pink:hover,
+.hover-bg-pink:focus { background-color: $pink; }
+.hover-bg-light-pink:hover,
+.hover-bg-light-pink:focus { background-color: $light-pink; }
+.hover-bg-dark-green:hover,
+.hover-bg-dark-green:focus { background-color: $dark-green; }
+.hover-bg-green:hover,
+.hover-bg-green:focus { background-color: $green; }
+.hover-bg-light-green:hover,
+.hover-bg-light-green:focus { background-color: $light-green; }
+.hover-bg-navy:hover,
+.hover-bg-navy:focus { background-color: $navy; }
+.hover-bg-dark-blue:hover,
+.hover-bg-dark-blue:focus { background-color: $dark-blue; }
+.hover-bg-blue:hover,
+.hover-bg-blue:focus { background-color: $blue; }
+.hover-bg-light-blue:hover,
+.hover-bg-light-blue:focus { background-color: $light-blue; }
+.hover-bg-lightest-blue:hover,
+.hover-bg-lightest-blue:focus { background-color: $lightest-blue; }
+.hover-bg-washed-blue:hover,
+.hover-bg-washed-blue:focus { background-color: $washed-blue; }
+.hover-bg-washed-green:hover,
+.hover-bg-washed-green:focus { background-color: $washed-green; }
+.hover-bg-washed-yellow:hover,
+.hover-bg-washed-yellow:focus { background-color: $washed-yellow; }
+.hover-bg-washed-red:hover,
+.hover-bg-washed-red:focus { background-color: $washed-red; }
+.hover-bg-inherit:hover,
+.hover-bg-inherit:focus { background-color: inherit; }

src/rawdata/scss/tachyons/scss/_skins.scss

@@ -0,0 +1,143 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   SKINS
+   Docs: http://tachyons.io/docs/themes/skins/
+
+   Classes for setting foreground and background colors on elements.
+   If you haven't declared a border color, but set border on an element, it will
+   be set to the current text color.
+
+*/
+
+/* Text colors */
+
+.black-90 {         color: $black-90; }
+.black-80 {         color: $black-80; }
+.black-70 {         color: $black-70; }
+.black-60 {         color: $black-60; }
+.black-50 {         color: $black-50; }
+.black-40 {         color: $black-40; }
+.black-30 {         color: $black-30; }
+.black-20 {         color: $black-20; }
+.black-10 {         color: $black-10; }
+.black-05 {         color: $black-05; }
+
+.white-90 {         color: $white-90; }
+.white-80 {         color: $white-80; }
+.white-70 {         color: $white-70; }
+.white-60 {         color: $white-60; }
+.white-50 {         color: $white-50; }
+.white-40 {         color: $white-40; }
+.white-30 {         color: $white-30; }
+.white-20 {         color: $white-20; }
+.white-10 {         color: $white-10; }
+
+.black {         color: $black; }
+.near-black {    color: $near-black; }
+.dark-gray {     color: $dark-gray; }
+.mid-gray {      color: $mid-gray; }
+.gray {          color: $gray; }
+.silver  {       color: $silver; }
+.light-silver {  color: $light-silver; }
+.moon-gray {     color: $moon-gray; }
+.light-gray {    color: $light-gray; }
+.near-white {    color: $near-white; }
+.white {         color: $white; }
+
+.dark-red { color: $dark-red; }
+.red { color: $red; }
+.light-red { color: $light-red; }
+.orange { color: $orange; }
+.gold { color: $gold; }
+.yellow { color: $yellow; }
+.light-yellow { color: $light-yellow; }
+.purple { color: $purple; }
+.light-purple { color: $light-purple; }
+.dark-pink { color: $dark-pink; }
+.hot-pink { color: $hot-pink; }
+.pink { color: $pink; }
+.light-pink { color: $light-pink; }
+.dark-green { color: $dark-green; }
+.green { color: $green; }
+.light-green { color: $light-green; }
+.navy { color: $navy; }
+.dark-blue { color: $dark-blue; }
+.blue { color: $blue; }
+.light-blue { color: $light-blue; }
+.lightest-blue { color: $lightest-blue; }
+.washed-blue { color: $washed-blue; }
+.washed-green { color: $washed-green; }
+.washed-yellow { color: $washed-yellow; }
+.washed-red { color: $washed-red; }
+.color-inherit { color: inherit; }
+
+.bg-black-90 {         background-color: $black-90; }
+.bg-black-80 {         background-color: $black-80; }
+.bg-black-70 {         background-color: $black-70; }
+.bg-black-60 {         background-color: $black-60; }
+.bg-black-50 {         background-color: $black-50; }
+.bg-black-40 {         background-color: $black-40; }
+.bg-black-30 {         background-color: $black-30; }
+.bg-black-20 {         background-color: $black-20; }
+.bg-black-10 {         background-color: $black-10; }
+.bg-black-05 {         background-color: $black-05; }
+.bg-white-90 {        background-color: $white-90; }
+.bg-white-80 {        background-color: $white-80; }
+.bg-white-70 {        background-color: $white-70; }
+.bg-white-60 {        background-color: $white-60; }
+.bg-white-50 {        background-color: $white-50; }
+.bg-white-40 {        background-color: $white-40; }
+.bg-white-30 {        background-color: $white-30; }
+.bg-white-20 {        background-color: $white-20; }
+.bg-white-10 {        background-color: $white-10; }
+
+
+
+/* Background colors */
+
+.bg-black {         background-color: $black; }
+.bg-near-black {    background-color: $near-black; }
+.bg-dark-gray {     background-color: $dark-gray; }
+.bg-mid-gray {      background-color: $mid-gray; }
+.bg-gray {          background-color: $gray; }
+.bg-silver  {       background-color: $silver; }
+.bg-light-silver {  background-color: $light-silver; }
+.bg-moon-gray {     background-color: $moon-gray; }
+.bg-light-gray {    background-color: $light-gray; }
+.bg-near-white {    background-color: $near-white; }
+.bg-white {         background-color: $white; }
+.bg-transparent {   background-color: $transparent; }
+
+.bg-dark-red { background-color: $dark-red; }
+.bg-red { background-color: $red; }
+.bg-light-red { background-color: $light-red; }
+.bg-orange { background-color: $orange; }
+.bg-gold { background-color: $gold; }
+.bg-yellow { background-color: $yellow; }
+.bg-light-yellow { background-color: $light-yellow; }
+.bg-purple { background-color: $purple; }
+.bg-light-purple { background-color: $light-purple; }
+.bg-dark-pink { background-color: $dark-pink; }
+.bg-hot-pink { background-color: $hot-pink; }
+.bg-pink { background-color: $pink; }
+.bg-light-pink { background-color: $light-pink; }
+.bg-dark-green { background-color: $dark-green; }
+.bg-green { background-color: $green; }
+.bg-light-green { background-color: $light-green; }
+.bg-navy { background-color: $navy; }
+.bg-dark-blue { background-color: $dark-blue; }
+.bg-blue { background-color: $blue; }
+.bg-light-blue { background-color: $light-blue; }
+.bg-lightest-blue { background-color: $lightest-blue; }
+.bg-washed-blue { background-color: $washed-blue; }
+.bg-washed-green { background-color: $washed-green; }
+.bg-washed-yellow { background-color: $washed-yellow; }
+.bg-washed-red { background-color: $washed-red; }
+.bg-inherit { background-color: inherit; }

src/rawdata/scss/tachyons/scss/_spacing.scss

@@ -0,0 +1,947 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/* Variables */
+
+/*
+   SPACING
+   Docs: http://tachyons.io/docs/layout/spacing/
+
+   An eight step powers of two scale ranging from 0 to 16rem.
+
+   Base:
+     p = padding
+     m = margin
+
+   Modifiers:
+     a = all
+     h = horizontal
+     v = vertical
+     t = top
+     r = right
+     b = bottom
+     l = left
+
+     0 = none
+     1 = 1st step in spacing scale
+     2 = 2nd step in spacing scale
+     3 = 3rd step in spacing scale
+     4 = 4th step in spacing scale
+     5 = 5th step in spacing scale
+     6 = 6th step in spacing scale
+     7 = 7th step in spacing scale
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+
+.pa0 { padding: $spacing-none; }
+.pa1 { padding: $spacing-extra-small; }
+.pa2 { padding: $spacing-small; }
+.pa3 { padding: $spacing-medium; }
+.pa4 { padding: $spacing-large; }
+.pa5 { padding: $spacing-extra-large; }
+.pa6 { padding: $spacing-extra-extra-large; }
+.pa7 { padding: $spacing-extra-extra-extra-large; }
+
+.pl0 { padding-left: $spacing-none; }
+.pl1 { padding-left: $spacing-extra-small; }
+.pl2 { padding-left: $spacing-small; }
+.pl3 { padding-left: $spacing-medium; }
+.pl4 { padding-left: $spacing-large; }
+.pl5 { padding-left: $spacing-extra-large; }
+.pl6 { padding-left: $spacing-extra-extra-large; }
+.pl7 { padding-left: $spacing-extra-extra-extra-large; }
+
+.pr0 { padding-right: $spacing-none; }
+.pr1 { padding-right: $spacing-extra-small; }
+.pr2 { padding-right: $spacing-small; }
+.pr3 { padding-right: $spacing-medium; }
+.pr4 { padding-right: $spacing-large; }
+.pr5 { padding-right: $spacing-extra-large; }
+.pr6 { padding-right: $spacing-extra-extra-large; }
+.pr7 { padding-right: $spacing-extra-extra-extra-large; }
+
+.pb0 { padding-bottom: $spacing-none; }
+.pb1 { padding-bottom: $spacing-extra-small; }
+.pb2 { padding-bottom: $spacing-small; }
+.pb3 { padding-bottom: $spacing-medium; }
+.pb4 { padding-bottom: $spacing-large; }
+.pb5 { padding-bottom: $spacing-extra-large; }
+.pb6 { padding-bottom: $spacing-extra-extra-large; }
+.pb7 { padding-bottom: $spacing-extra-extra-extra-large; }
+
+.pt0 { padding-top: $spacing-none; }
+.pt1 { padding-top: $spacing-extra-small; }
+.pt2 { padding-top: $spacing-small; }
+.pt3 { padding-top: $spacing-medium; }
+.pt4 { padding-top: $spacing-large; }
+.pt5 { padding-top: $spacing-extra-large; }
+.pt6 { padding-top: $spacing-extra-extra-large; }
+.pt7 { padding-top: $spacing-extra-extra-extra-large; }
+
+.pv0 {
+  padding-top: $spacing-none;
+  padding-bottom: $spacing-none;
+}
+.pv1 {
+  padding-top: $spacing-extra-small;
+  padding-bottom: $spacing-extra-small;
+}
+.pv2 {
+  padding-top: $spacing-small;
+  padding-bottom: $spacing-small;
+}
+.pv3 {
+  padding-top: $spacing-medium;
+  padding-bottom: $spacing-medium;
+}
+.pv4 {
+  padding-top: $spacing-large;
+  padding-bottom: $spacing-large;
+}
+.pv5 {
+  padding-top: $spacing-extra-large;
+  padding-bottom: $spacing-extra-large;
+}
+.pv6 {
+  padding-top: $spacing-extra-extra-large;
+  padding-bottom: $spacing-extra-extra-large;
+}
+
+.pv7 {
+  padding-top: $spacing-extra-extra-extra-large;
+  padding-bottom: $spacing-extra-extra-extra-large;
+}
+
+.ph0 {
+  padding-left: $spacing-none;
+  padding-right: $spacing-none;
+}
+
+.ph1 {
+  padding-left: $spacing-extra-small;
+  padding-right: $spacing-extra-small;
+}
+
+.ph2 {
+  padding-left: $spacing-small;
+  padding-right: $spacing-small;
+}
+
+.ph3 {
+  padding-left: $spacing-medium;
+  padding-right: $spacing-medium;
+}
+
+.ph4 {
+  padding-left: $spacing-large;
+  padding-right: $spacing-large;
+}
+
+.ph5 {
+  padding-left: $spacing-extra-large;
+  padding-right: $spacing-extra-large;
+}
+
+.ph6 {
+  padding-left: $spacing-extra-extra-large;
+  padding-right: $spacing-extra-extra-large;
+}
+
+.ph7 {
+  padding-left: $spacing-extra-extra-extra-large;
+  padding-right: $spacing-extra-extra-extra-large;
+}
+
+.ma0  {  margin: $spacing-none; }
+.ma1 {  margin: $spacing-extra-small; }
+.ma2  {  margin: $spacing-small; }
+.ma3  {  margin: $spacing-medium; }
+.ma4  {  margin: $spacing-large; }
+.ma5  {  margin: $spacing-extra-large; }
+.ma6 {  margin: $spacing-extra-extra-large; }
+.ma7 { margin: $spacing-extra-extra-extra-large; }
+
+.ml0  {  margin-left: $spacing-none; }
+.ml1 {  margin-left: $spacing-extra-small; }
+.ml2  {  margin-left: $spacing-small; }
+.ml3  {  margin-left: $spacing-medium; }
+.ml4  {  margin-left: $spacing-large; }
+.ml5  {  margin-left: $spacing-extra-large; }
+.ml6 {  margin-left: $spacing-extra-extra-large; }
+.ml7 { margin-left: $spacing-extra-extra-extra-large; }
+
+.mr0  {  margin-right: $spacing-none; }
+.mr1 {  margin-right: $spacing-extra-small; }
+.mr2  {  margin-right: $spacing-small; }
+.mr3  {  margin-right: $spacing-medium; }
+.mr4  {  margin-right: $spacing-large; }
+.mr5  {  margin-right: $spacing-extra-large; }
+.mr6 {  margin-right: $spacing-extra-extra-large; }
+.mr7 { margin-right: $spacing-extra-extra-extra-large; }
+
+.mb0  {  margin-bottom: $spacing-none; }
+.mb1 {  margin-bottom: $spacing-extra-small; }
+.mb2  {  margin-bottom: $spacing-small; }
+.mb3  {  margin-bottom: $spacing-medium; }
+.mb4  {  margin-bottom: $spacing-large; }
+.mb5  {  margin-bottom: $spacing-extra-large; }
+.mb6 {  margin-bottom: $spacing-extra-extra-large; }
+.mb7 { margin-bottom: $spacing-extra-extra-extra-large; }
+
+.mt0  {  margin-top: $spacing-none; }
+.mt1 {  margin-top: $spacing-extra-small; }
+.mt2  {  margin-top: $spacing-small; }
+.mt3  {  margin-top: $spacing-medium; }
+.mt4  {  margin-top: $spacing-large; }
+.mt5  {  margin-top: $spacing-extra-large; }
+.mt6 {  margin-top: $spacing-extra-extra-large; }
+.mt7 { margin-top: $spacing-extra-extra-extra-large; }
+
+.mv0   {
+  margin-top: $spacing-none;
+  margin-bottom: $spacing-none;
+}
+.mv1  {
+  margin-top: $spacing-extra-small;
+  margin-bottom: $spacing-extra-small;
+}
+.mv2   {
+  margin-top: $spacing-small;
+  margin-bottom: $spacing-small;
+}
+.mv3   {
+  margin-top: $spacing-medium;
+  margin-bottom: $spacing-medium;
+}
+.mv4   {
+  margin-top: $spacing-large;
+  margin-bottom: $spacing-large;
+}
+.mv5   {
+  margin-top: $spacing-extra-large;
+  margin-bottom: $spacing-extra-large;
+}
+.mv6  {
+  margin-top: $spacing-extra-extra-large;
+  margin-bottom: $spacing-extra-extra-large;
+}
+.mv7  {
+  margin-top: $spacing-extra-extra-extra-large;
+  margin-bottom: $spacing-extra-extra-extra-large;
+}
+
+.mh0   {
+  margin-left: $spacing-none;
+  margin-right: $spacing-none;
+}
+.mh1   {
+  margin-left: $spacing-extra-small;
+  margin-right: $spacing-extra-small;
+}
+.mh2   {
+  margin-left: $spacing-small;
+  margin-right: $spacing-small;
+}
+.mh3   {
+  margin-left: $spacing-medium;
+  margin-right: $spacing-medium;
+}
+.mh4   {
+  margin-left: $spacing-large;
+  margin-right: $spacing-large;
+}
+.mh5   {
+  margin-left: $spacing-extra-large;
+  margin-right: $spacing-extra-large;
+}
+.mh6  {
+  margin-left: $spacing-extra-extra-large;
+  margin-right: $spacing-extra-extra-large;
+}
+.mh7  {
+  margin-left: $spacing-extra-extra-extra-large;
+  margin-right: $spacing-extra-extra-extra-large;
+}
+
+@media #{$breakpoint-not-small} {
+  .pa0-ns  {  padding: $spacing-none; }
+  .pa1-ns {  padding: $spacing-extra-small; }
+  .pa2-ns  {  padding: $spacing-small; }
+  .pa3-ns  {  padding: $spacing-medium; }
+  .pa4-ns  {  padding: $spacing-large; }
+  .pa5-ns  {  padding: $spacing-extra-large; }
+  .pa6-ns {  padding: $spacing-extra-extra-large; }
+  .pa7-ns { padding: $spacing-extra-extra-extra-large; }
+
+  .pl0-ns  {  padding-left: $spacing-none; }
+  .pl1-ns {  padding-left: $spacing-extra-small; }
+  .pl2-ns  {  padding-left: $spacing-small; }
+  .pl3-ns  {  padding-left: $spacing-medium; }
+  .pl4-ns  {  padding-left: $spacing-large; }
+  .pl5-ns  {  padding-left: $spacing-extra-large; }
+  .pl6-ns {  padding-left: $spacing-extra-extra-large; }
+  .pl7-ns { padding-left: $spacing-extra-extra-extra-large; }
+
+  .pr0-ns  {  padding-right: $spacing-none; }
+  .pr1-ns {  padding-right: $spacing-extra-small; }
+  .pr2-ns  {  padding-right: $spacing-small; }
+  .pr3-ns  {  padding-right: $spacing-medium; }
+  .pr4-ns  {  padding-right: $spacing-large; }
+  .pr5-ns {   padding-right: $spacing-extra-large; }
+  .pr6-ns {  padding-right: $spacing-extra-extra-large; }
+  .pr7-ns { padding-right: $spacing-extra-extra-extra-large; }
+
+  .pb0-ns  {  padding-bottom: $spacing-none; }
+  .pb1-ns {  padding-bottom: $spacing-extra-small; }
+  .pb2-ns  {  padding-bottom: $spacing-small; }
+  .pb3-ns  {  padding-bottom: $spacing-medium; }
+  .pb4-ns  {  padding-bottom: $spacing-large; }
+  .pb5-ns  {  padding-bottom: $spacing-extra-large; }
+  .pb6-ns {  padding-bottom: $spacing-extra-extra-large; }
+  .pb7-ns { padding-bottom: $spacing-extra-extra-extra-large; }
+
+  .pt0-ns  {  padding-top: $spacing-none; }
+  .pt1-ns {  padding-top: $spacing-extra-small; }
+  .pt2-ns  {  padding-top: $spacing-small; }
+  .pt3-ns  {  padding-top: $spacing-medium; }
+  .pt4-ns  {  padding-top: $spacing-large; }
+  .pt5-ns  {  padding-top: $spacing-extra-large; }
+  .pt6-ns {  padding-top: $spacing-extra-extra-large; }
+  .pt7-ns { padding-top: $spacing-extra-extra-extra-large; }
+
+  .pv0-ns {
+    padding-top: $spacing-none;
+    padding-bottom: $spacing-none;
+  }
+  .pv1-ns {
+    padding-top: $spacing-extra-small;
+    padding-bottom: $spacing-extra-small;
+  }
+  .pv2-ns {
+    padding-top: $spacing-small;
+    padding-bottom: $spacing-small;
+  }
+  .pv3-ns {
+    padding-top: $spacing-medium;
+    padding-bottom: $spacing-medium;
+  }
+  .pv4-ns {
+    padding-top: $spacing-large;
+    padding-bottom: $spacing-large;
+  }
+  .pv5-ns {
+    padding-top: $spacing-extra-large;
+    padding-bottom: $spacing-extra-large;
+  }
+  .pv6-ns {
+    padding-top: $spacing-extra-extra-large;
+    padding-bottom: $spacing-extra-extra-large;
+  }
+  .pv7-ns {
+    padding-top: $spacing-extra-extra-extra-large;
+    padding-bottom: $spacing-extra-extra-extra-large;
+  }
+  .ph0-ns {
+    padding-left: $spacing-none;
+    padding-right: $spacing-none;
+  }
+  .ph1-ns {
+    padding-left: $spacing-extra-small;
+    padding-right: $spacing-extra-small;
+  }
+  .ph2-ns {
+    padding-left: $spacing-small;
+    padding-right: $spacing-small;
+  }
+  .ph3-ns {
+    padding-left: $spacing-medium;
+    padding-right: $spacing-medium;
+  }
+  .ph4-ns {
+    padding-left: $spacing-large;
+    padding-right: $spacing-large;
+  }
+  .ph5-ns {
+    padding-left: $spacing-extra-large;
+    padding-right: $spacing-extra-large;
+  }
+  .ph6-ns {
+    padding-left: $spacing-extra-extra-large;
+    padding-right: $spacing-extra-extra-large;
+  }
+  .ph7-ns {
+    padding-left: $spacing-extra-extra-extra-large;
+    padding-right: $spacing-extra-extra-extra-large;
+  }
+
+  .ma0-ns  {  margin: $spacing-none; }
+  .ma1-ns {  margin: $spacing-extra-small; }
+  .ma2-ns  {  margin: $spacing-small; }
+  .ma3-ns  {  margin: $spacing-medium; }
+  .ma4-ns  {  margin: $spacing-large; }
+  .ma5-ns  {  margin: $spacing-extra-large; }
+  .ma6-ns {  margin: $spacing-extra-extra-large; }
+  .ma7-ns { margin: $spacing-extra-extra-extra-large; }
+
+  .ml0-ns  {  margin-left: $spacing-none; }
+  .ml1-ns {  margin-left: $spacing-extra-small; }
+  .ml2-ns  {  margin-left: $spacing-small; }
+  .ml3-ns  {  margin-left: $spacing-medium; }
+  .ml4-ns  {  margin-left: $spacing-large; }
+  .ml5-ns  {  margin-left: $spacing-extra-large; }
+  .ml6-ns {  margin-left: $spacing-extra-extra-large; }
+  .ml7-ns { margin-left: $spacing-extra-extra-extra-large; }
+
+  .mr0-ns  {  margin-right: $spacing-none; }
+  .mr1-ns {  margin-right: $spacing-extra-small; }
+  .mr2-ns  {  margin-right: $spacing-small; }
+  .mr3-ns  {  margin-right: $spacing-medium; }
+  .mr4-ns  {  margin-right: $spacing-large; }
+  .mr5-ns  {  margin-right: $spacing-extra-large; }
+  .mr6-ns {  margin-right: $spacing-extra-extra-large; }
+  .mr7-ns { margin-right: $spacing-extra-extra-extra-large; }
+
+  .mb0-ns  {  margin-bottom: $spacing-none; }
+  .mb1-ns {  margin-bottom: $spacing-extra-small; }
+  .mb2-ns  {  margin-bottom: $spacing-small; }
+  .mb3-ns  {  margin-bottom: $spacing-medium; }
+  .mb4-ns  {  margin-bottom: $spacing-large; }
+  .mb5-ns  {  margin-bottom: $spacing-extra-large; }
+  .mb6-ns {  margin-bottom: $spacing-extra-extra-large; }
+  .mb7-ns { margin-bottom: $spacing-extra-extra-extra-large; }
+
+  .mt0-ns  {  margin-top: $spacing-none; }
+  .mt1-ns {  margin-top: $spacing-extra-small; }
+  .mt2-ns  {  margin-top: $spacing-small; }
+  .mt3-ns  {  margin-top: $spacing-medium; }
+  .mt4-ns  {  margin-top: $spacing-large; }
+  .mt5-ns  {  margin-top: $spacing-extra-large; }
+  .mt6-ns {  margin-top: $spacing-extra-extra-large; }
+  .mt7-ns { margin-top: $spacing-extra-extra-extra-large; }
+
+  .mv0-ns   {
+    margin-top: $spacing-none;
+    margin-bottom: $spacing-none;
+  }
+  .mv1-ns  {
+    margin-top: $spacing-extra-small;
+    margin-bottom: $spacing-extra-small;
+  }
+  .mv2-ns   {
+    margin-top: $spacing-small;
+    margin-bottom: $spacing-small;
+  }
+  .mv3-ns   {
+    margin-top: $spacing-medium;
+    margin-bottom: $spacing-medium;
+  }
+  .mv4-ns   {
+    margin-top: $spacing-large;
+    margin-bottom: $spacing-large;
+  }
+  .mv5-ns   {
+    margin-top: $spacing-extra-large;
+    margin-bottom: $spacing-extra-large;
+  }
+  .mv6-ns  {
+    margin-top: $spacing-extra-extra-large;
+    margin-bottom: $spacing-extra-extra-large;
+  }
+  .mv7-ns  {
+    margin-top: $spacing-extra-extra-extra-large;
+    margin-bottom: $spacing-extra-extra-extra-large;
+  }
+
+  .mh0-ns   {
+    margin-left: $spacing-none;
+    margin-right: $spacing-none;
+  }
+  .mh1-ns   {
+    margin-left: $spacing-extra-small;
+    margin-right: $spacing-extra-small;
+  }
+  .mh2-ns   {
+    margin-left: $spacing-small;
+    margin-right: $spacing-small;
+  }
+  .mh3-ns   {
+    margin-left: $spacing-medium;
+    margin-right: $spacing-medium;
+  }
+  .mh4-ns   {
+    margin-left: $spacing-large;
+    margin-right: $spacing-large;
+  }
+  .mh5-ns   {
+    margin-left: $spacing-extra-large;
+    margin-right: $spacing-extra-large;
+  }
+  .mh6-ns  {
+    margin-left: $spacing-extra-extra-large;
+    margin-right: $spacing-extra-extra-large;
+  }
+  .mh7-ns  {
+    margin-left: $spacing-extra-extra-extra-large;
+    margin-right: $spacing-extra-extra-extra-large;
+  }
+
+}
+
+@media #{$breakpoint-medium} {
+  .pa0-m  {  padding: $spacing-none; }
+  .pa1-m {  padding: $spacing-extra-small; }
+  .pa2-m  {  padding: $spacing-small; }
+  .pa3-m  {  padding: $spacing-medium; }
+  .pa4-m  {  padding: $spacing-large; }
+  .pa5-m  {  padding: $spacing-extra-large; }
+  .pa6-m {  padding: $spacing-extra-extra-large; }
+  .pa7-m { padding: $spacing-extra-extra-extra-large; }
+
+  .pl0-m  {  padding-left: $spacing-none; }
+  .pl1-m {  padding-left: $spacing-extra-small; }
+  .pl2-m  {  padding-left: $spacing-small; }
+  .pl3-m  {  padding-left: $spacing-medium; }
+  .pl4-m  {  padding-left: $spacing-large; }
+  .pl5-m  {  padding-left: $spacing-extra-large; }
+  .pl6-m {  padding-left: $spacing-extra-extra-large; }
+  .pl7-m { padding-left: $spacing-extra-extra-extra-large; }
+
+  .pr0-m  {  padding-right: $spacing-none; }
+  .pr1-m {  padding-right: $spacing-extra-small; }
+  .pr2-m  {  padding-right: $spacing-small; }
+  .pr3-m  {  padding-right: $spacing-medium; }
+  .pr4-m  {  padding-right: $spacing-large; }
+  .pr5-m  {  padding-right: $spacing-extra-large; }
+  .pr6-m {  padding-right: $spacing-extra-extra-large; }
+  .pr7-m { padding-right: $spacing-extra-extra-extra-large; }
+
+  .pb0-m  {  padding-bottom: $spacing-none; }
+  .pb1-m {  padding-bottom: $spacing-extra-small; }
+  .pb2-m  {  padding-bottom: $spacing-small; }
+  .pb3-m  {  padding-bottom: $spacing-medium; }
+  .pb4-m  {  padding-bottom: $spacing-large; }
+  .pb5-m  {  padding-bottom: $spacing-extra-large; }
+  .pb6-m {  padding-bottom: $spacing-extra-extra-large; }
+  .pb7-m { padding-bottom: $spacing-extra-extra-extra-large; }
+
+  .pt0-m  {  padding-top: $spacing-none; }
+  .pt1-m {  padding-top: $spacing-extra-small; }
+  .pt2-m  {  padding-top: $spacing-small; }
+  .pt3-m  {  padding-top: $spacing-medium; }
+  .pt4-m  {  padding-top: $spacing-large; }
+  .pt5-m  {  padding-top: $spacing-extra-large; }
+  .pt6-m {  padding-top: $spacing-extra-extra-large; }
+  .pt7-m { padding-top: $spacing-extra-extra-extra-large; }
+
+  .pv0-m {
+    padding-top: $spacing-none;
+    padding-bottom: $spacing-none;
+  }
+  .pv1-m {
+    padding-top: $spacing-extra-small;
+    padding-bottom: $spacing-extra-small;
+  }
+  .pv2-m {
+    padding-top: $spacing-small;
+    padding-bottom: $spacing-small;
+  }
+  .pv3-m {
+    padding-top: $spacing-medium;
+    padding-bottom: $spacing-medium;
+  }
+  .pv4-m {
+    padding-top: $spacing-large;
+    padding-bottom: $spacing-large;
+  }
+  .pv5-m {
+    padding-top: $spacing-extra-large;
+    padding-bottom: $spacing-extra-large;
+  }
+  .pv6-m {
+    padding-top: $spacing-extra-extra-large;
+    padding-bottom: $spacing-extra-extra-large;
+  }
+  .pv7-m {
+    padding-top: $spacing-extra-extra-extra-large;
+    padding-bottom: $spacing-extra-extra-extra-large;
+  }
+
+  .ph0-m {
+    padding-left: $spacing-none;
+    padding-right: $spacing-none;
+  }
+  .ph1-m {
+    padding-left: $spacing-extra-small;
+    padding-right: $spacing-extra-small;
+  }
+  .ph2-m {
+    padding-left: $spacing-small;
+    padding-right: $spacing-small;
+  }
+  .ph3-m {
+    padding-left: $spacing-medium;
+    padding-right: $spacing-medium;
+  }
+  .ph4-m {
+    padding-left: $spacing-large;
+    padding-right: $spacing-large;
+  }
+  .ph5-m {
+    padding-left: $spacing-extra-large;
+    padding-right: $spacing-extra-large;
+  }
+  .ph6-m {
+    padding-left: $spacing-extra-extra-large;
+    padding-right: $spacing-extra-extra-large;
+  }
+  .ph7-m {
+    padding-left: $spacing-extra-extra-extra-large;
+    padding-right: $spacing-extra-extra-extra-large;
+  }
+
+  .ma0-m  {  margin: $spacing-none; }
+  .ma1-m {  margin: $spacing-extra-small; }
+  .ma2-m  {  margin: $spacing-small; }
+  .ma3-m  {  margin: $spacing-medium; }
+  .ma4-m  {  margin: $spacing-large; }
+  .ma5-m  {  margin: $spacing-extra-large; }
+  .ma6-m {  margin: $spacing-extra-extra-large; }
+  .ma7-m { margin: $spacing-extra-extra-extra-large; }
+
+  .ml0-m  {  margin-left: $spacing-none; }
+  .ml1-m {  margin-left: $spacing-extra-small; }
+  .ml2-m  {  margin-left: $spacing-small; }
+  .ml3-m  {  margin-left: $spacing-medium; }
+  .ml4-m  {  margin-left: $spacing-large; }
+  .ml5-m  {  margin-left: $spacing-extra-large; }
+  .ml6-m {  margin-left: $spacing-extra-extra-large; }
+  .ml7-m { margin-left: $spacing-extra-extra-extra-large; }
+
+  .mr0-m  {  margin-right: $spacing-none; }
+  .mr1-m {  margin-right: $spacing-extra-small; }
+  .mr2-m  {  margin-right: $spacing-small; }
+  .mr3-m  {  margin-right: $spacing-medium; }
+  .mr4-m  {  margin-right: $spacing-large; }
+  .mr5-m  {  margin-right: $spacing-extra-large; }
+  .mr6-m {  margin-right: $spacing-extra-extra-large; }
+  .mr7-m { margin-right: $spacing-extra-extra-extra-large; }
+
+  .mb0-m  {  margin-bottom: $spacing-none; }
+  .mb1-m {  margin-bottom: $spacing-extra-small; }
+  .mb2-m  {  margin-bottom: $spacing-small; }
+  .mb3-m  {  margin-bottom: $spacing-medium; }
+  .mb4-m  {  margin-bottom: $spacing-large; }
+  .mb5-m  {  margin-bottom: $spacing-extra-large; }
+  .mb6-m {  margin-bottom: $spacing-extra-extra-large; }
+  .mb7-m { margin-bottom: $spacing-extra-extra-extra-large; }
+
+  .mt0-m  {  margin-top: $spacing-none; }
+  .mt1-m {  margin-top: $spacing-extra-small; }
+  .mt2-m  {  margin-top: $spacing-small; }
+  .mt3-m  {  margin-top: $spacing-medium; }
+  .mt4-m  {  margin-top: $spacing-large; }
+  .mt5-m  {  margin-top: $spacing-extra-large; }
+  .mt6-m {  margin-top: $spacing-extra-extra-large; }
+  .mt7-m { margin-top: $spacing-extra-extra-extra-large; }
+
+  .mv0-m {
+    margin-top: $spacing-none;
+    margin-bottom: $spacing-none;
+  }
+  .mv1-m {
+    margin-top: $spacing-extra-small;
+    margin-bottom: $spacing-extra-small;
+  }
+  .mv2-m {
+    margin-top: $spacing-small;
+    margin-bottom: $spacing-small;
+  }
+  .mv3-m {
+    margin-top: $spacing-medium;
+    margin-bottom: $spacing-medium;
+  }
+  .mv4-m {
+    margin-top: $spacing-large;
+    margin-bottom: $spacing-large;
+  }
+  .mv5-m {
+    margin-top: $spacing-extra-large;
+    margin-bottom: $spacing-extra-large;
+  }
+  .mv6-m {
+    margin-top: $spacing-extra-extra-large;
+    margin-bottom: $spacing-extra-extra-large;
+  }
+  .mv7-m {
+    margin-top: $spacing-extra-extra-extra-large;
+    margin-bottom: $spacing-extra-extra-extra-large;
+  }
+
+  .mh0-m {
+    margin-left: $spacing-none;
+    margin-right: $spacing-none;
+  }
+  .mh1-m {
+    margin-left: $spacing-extra-small;
+    margin-right: $spacing-extra-small;
+  }
+  .mh2-m {
+    margin-left: $spacing-small;
+    margin-right: $spacing-small;
+  }
+  .mh3-m {
+    margin-left: $spacing-medium;
+    margin-right: $spacing-medium;
+  }
+  .mh4-m {
+    margin-left: $spacing-large;
+    margin-right: $spacing-large;
+  }
+  .mh5-m {
+    margin-left: $spacing-extra-large;
+    margin-right: $spacing-extra-large;
+  }
+  .mh6-m {
+    margin-left: $spacing-extra-extra-large;
+    margin-right: $spacing-extra-extra-large;
+  }
+  .mh7-m {
+    margin-left: $spacing-extra-extra-extra-large;
+    margin-right: $spacing-extra-extra-extra-large;
+  }
+
+}
+
+@media #{$breakpoint-large} {
+  .pa0-l  {  padding: $spacing-none; }
+  .pa1-l {  padding: $spacing-extra-small; }
+  .pa2-l  {  padding: $spacing-small; }
+  .pa3-l  {  padding: $spacing-medium; }
+  .pa4-l  {  padding: $spacing-large; }
+  .pa5-l  {  padding: $spacing-extra-large; }
+  .pa6-l {  padding: $spacing-extra-extra-large; }
+  .pa7-l { padding: $spacing-extra-extra-extra-large; }
+
+  .pl0-l  {  padding-left: $spacing-none; }
+  .pl1-l {  padding-left: $spacing-extra-small; }
+  .pl2-l  {  padding-left: $spacing-small; }
+  .pl3-l  {  padding-left: $spacing-medium; }
+  .pl4-l  {  padding-left: $spacing-large; }
+  .pl5-l  {  padding-left: $spacing-extra-large; }
+  .pl6-l {  padding-left: $spacing-extra-extra-large; }
+  .pl7-l { padding-left: $spacing-extra-extra-extra-large; }
+
+  .pr0-l  {  padding-right: $spacing-none; }
+  .pr1-l {  padding-right: $spacing-extra-small; }
+  .pr2-l  {  padding-right: $spacing-small; }
+  .pr3-l  {  padding-right: $spacing-medium; }
+  .pr4-l  {  padding-right: $spacing-large; }
+  .pr5-l  {  padding-right: $spacing-extra-large; }
+  .pr6-l {  padding-right: $spacing-extra-extra-large; }
+  .pr7-l { padding-right: $spacing-extra-extra-extra-large; }
+
+  .pb0-l  {  padding-bottom: $spacing-none; }
+  .pb1-l {  padding-bottom: $spacing-extra-small; }
+  .pb2-l  {  padding-bottom: $spacing-small; }
+  .pb3-l  {  padding-bottom: $spacing-medium; }
+  .pb4-l  {  padding-bottom: $spacing-large; }
+  .pb5-l  {  padding-bottom: $spacing-extra-large; }
+  .pb6-l {  padding-bottom: $spacing-extra-extra-large; }
+  .pb7-l { padding-bottom: $spacing-extra-extra-extra-large; }
+
+  .pt0-l  {  padding-top: $spacing-none; }
+  .pt1-l {  padding-top: $spacing-extra-small; }
+  .pt2-l  {  padding-top: $spacing-small; }
+  .pt3-l  {  padding-top: $spacing-medium; }
+  .pt4-l  {  padding-top: $spacing-large; }
+  .pt5-l  {  padding-top: $spacing-extra-large; }
+  .pt6-l {  padding-top: $spacing-extra-extra-large; }
+  .pt7-l { padding-top: $spacing-extra-extra-extra-large; }
+
+  .pv0-l {
+    padding-top: $spacing-none;
+    padding-bottom: $spacing-none;
+  }
+  .pv1-l {
+    padding-top: $spacing-extra-small;
+    padding-bottom: $spacing-extra-small;
+  }
+  .pv2-l {
+    padding-top: $spacing-small;
+    padding-bottom: $spacing-small;
+  }
+  .pv3-l {
+    padding-top: $spacing-medium;
+    padding-bottom: $spacing-medium;
+  }
+  .pv4-l {
+    padding-top: $spacing-large;
+    padding-bottom: $spacing-large;
+  }
+  .pv5-l {
+    padding-top: $spacing-extra-large;
+    padding-bottom: $spacing-extra-large;
+  }
+  .pv6-l {
+    padding-top: $spacing-extra-extra-large;
+    padding-bottom: $spacing-extra-extra-large;
+  }
+  .pv7-l {
+    padding-top: $spacing-extra-extra-extra-large;
+    padding-bottom: $spacing-extra-extra-extra-large;
+  }
+
+  .ph0-l {
+    padding-left: $spacing-none;
+    padding-right: $spacing-none;
+  }
+  .ph1-l {
+    padding-left: $spacing-extra-small;
+    padding-right: $spacing-extra-small;
+  }
+  .ph2-l {
+    padding-left: $spacing-small;
+    padding-right: $spacing-small;
+  }
+  .ph3-l {
+    padding-left: $spacing-medium;
+    padding-right: $spacing-medium;
+  }
+  .ph4-l {
+    padding-left: $spacing-large;
+    padding-right: $spacing-large;
+  }
+  .ph5-l {
+    padding-left: $spacing-extra-large;
+    padding-right: $spacing-extra-large;
+  }
+  .ph6-l {
+    padding-left: $spacing-extra-extra-large;
+    padding-right: $spacing-extra-extra-large;
+  }
+  .ph7-l {
+    padding-left: $spacing-extra-extra-extra-large;
+    padding-right: $spacing-extra-extra-extra-large;
+  }
+
+  .ma0-l  {  margin: $spacing-none; }
+  .ma1-l {  margin: $spacing-extra-small; }
+  .ma2-l  {  margin: $spacing-small; }
+  .ma3-l  {  margin: $spacing-medium; }
+  .ma4-l  {  margin: $spacing-large; }
+  .ma5-l  {  margin: $spacing-extra-large; }
+  .ma6-l {  margin: $spacing-extra-extra-large; }
+  .ma7-l { margin: $spacing-extra-extra-extra-large; }
+
+  .ml0-l  {  margin-left: $spacing-none; }
+  .ml1-l {  margin-left: $spacing-extra-small; }
+  .ml2-l  {  margin-left: $spacing-small; }
+  .ml3-l  {  margin-left: $spacing-medium; }
+  .ml4-l  {  margin-left: $spacing-large; }
+  .ml5-l  {  margin-left: $spacing-extra-large; }
+  .ml6-l {  margin-left: $spacing-extra-extra-large; }
+  .ml7-l { margin-left: $spacing-extra-extra-extra-large; }
+
+  .mr0-l  {  margin-right: $spacing-none; }
+  .mr1-l {  margin-right: $spacing-extra-small; }
+  .mr2-l  {  margin-right: $spacing-small; }
+  .mr3-l  {  margin-right: $spacing-medium; }
+  .mr4-l  {  margin-right: $spacing-large; }
+  .mr5-l  {  margin-right: $spacing-extra-large; }
+  .mr6-l {  margin-right: $spacing-extra-extra-large; }
+  .mr7-l { margin-right: $spacing-extra-extra-extra-large; }
+
+  .mb0-l  {  margin-bottom: $spacing-none; }
+  .mb1-l {  margin-bottom: $spacing-extra-small; }
+  .mb2-l  {  margin-bottom: $spacing-small; }
+  .mb3-l  {  margin-bottom: $spacing-medium; }
+  .mb4-l  {  margin-bottom: $spacing-large; }
+  .mb5-l  {  margin-bottom: $spacing-extra-large; }
+  .mb6-l {  margin-bottom: $spacing-extra-extra-large; }
+  .mb7-l { margin-bottom: $spacing-extra-extra-extra-large; }
+
+  .mt0-l  {  margin-top: $spacing-none; }
+  .mt1-l {  margin-top: $spacing-extra-small; }
+  .mt2-l  {  margin-top: $spacing-small; }
+  .mt3-l  {  margin-top: $spacing-medium; }
+  .mt4-l  {  margin-top: $spacing-large; }
+  .mt5-l  {  margin-top: $spacing-extra-large; }
+  .mt6-l {  margin-top: $spacing-extra-extra-large; }
+  .mt7-l { margin-top: $spacing-extra-extra-extra-large; }
+
+  .mv0-l {
+    margin-top: $spacing-none;
+    margin-bottom: $spacing-none;
+  }
+  .mv1-l {
+    margin-top: $spacing-extra-small;
+    margin-bottom: $spacing-extra-small;
+  }
+  .mv2-l {
+    margin-top: $spacing-small;
+    margin-bottom: $spacing-small;
+  }
+  .mv3-l {
+    margin-top: $spacing-medium;
+    margin-bottom: $spacing-medium;
+  }
+  .mv4-l {
+    margin-top: $spacing-large;
+    margin-bottom: $spacing-large;
+  }
+  .mv5-l {
+    margin-top: $spacing-extra-large;
+    margin-bottom: $spacing-extra-large;
+  }
+  .mv6-l {
+    margin-top: $spacing-extra-extra-large;
+    margin-bottom: $spacing-extra-extra-large;
+  }
+  .mv7-l {
+    margin-top: $spacing-extra-extra-extra-large;
+    margin-bottom: $spacing-extra-extra-extra-large;
+  }
+
+  .mh0-l {
+    margin-left: $spacing-none;
+    margin-right: $spacing-none;
+  }
+  .mh1-l {
+    margin-left: $spacing-extra-small;
+    margin-right: $spacing-extra-small;
+  }
+  .mh2-l {
+    margin-left: $spacing-small;
+    margin-right: $spacing-small;
+  }
+  .mh3-l {
+    margin-left: $spacing-medium;
+    margin-right: $spacing-medium;
+  }
+  .mh4-l {
+    margin-left: $spacing-large;
+    margin-right: $spacing-large;
+  }
+  .mh5-l {
+    margin-left: $spacing-extra-large;
+    margin-right: $spacing-extra-large;
+  }
+  .mh6-l {
+    margin-left: $spacing-extra-extra-large;
+    margin-right: $spacing-extra-extra-large;
+  }
+  .mh7-l {
+    margin-left: $spacing-extra-extra-extra-large;
+    margin-right: $spacing-extra-extra-extra-large;
+  }
+}

src/rawdata/scss/tachyons/scss/_styles.scss

@@ -0,0 +1,15 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  STYLES
+
+  Add custom styles here.
+
+*/
+

src/rawdata/scss/tachyons/scss/_tables.scss

@@ -0,0 +1,42 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  TABLES
+  Docs: http://tachyons.io/docs/elements/tables/
+
+*/
+
+.collapse {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+.striped--light-silver:nth-child(odd) {
+  background-color: $light-silver;
+}
+
+.striped--moon-gray:nth-child(odd) {
+  background-color: $moon-gray;
+}
+
+.striped--light-gray:nth-child(odd) {
+  background-color: $light-gray;
+}
+
+.striped--near-white:nth-child(odd) {
+  background-color: $near-white;
+}
+
+.stripe-light:nth-child(odd) {
+  background-color: $white-10;
+}
+
+.stripe-dark:nth-child(odd) {
+  background-color: $black-10;
+}

src/rawdata/scss/tachyons/scss/_text-align.scss

@@ -0,0 +1,53 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  TEXT ALIGN
+  Docs: http://tachyons.io/docs/typography/text-align/
+
+  Base
+    t = text-align
+
+  Modifiers
+    l = left
+    r = right
+    c = center
+    j = justify
+
+  Media Query Extensions:
+    -ns = not-small
+    -m  = medium
+    -l  = large
+
+*/
+
+.tl  { text-align: left; }
+.tr  { text-align: right; }
+.tc  { text-align: center; }
+.tj  { text-align: justify; }
+
+@media #{$breakpoint-not-small} {
+  .tl-ns  { text-align: left; }
+  .tr-ns  { text-align: right; }
+  .tc-ns  { text-align: center; }
+  .tj-ns  { text-align: justify; }
+}
+
+@media #{$breakpoint-medium} {
+  .tl-m  { text-align: left; }
+  .tr-m  { text-align: right; }
+  .tc-m  { text-align: center; }
+  .tj-m  { text-align: justify; }
+}
+
+@media #{$breakpoint-large} {
+  .tl-l  { text-align: left; }
+  .tr-l  { text-align: right; }
+  .tc-l  { text-align: center; }
+  .tj-l  { text-align: justify; }
+}

src/rawdata/scss/tachyons/scss/_text-decoration.scss

@@ -0,0 +1,42 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   TEXT DECORATION
+   Docs: http://tachyons.io/docs/typography/text-decoration/
+
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.strike       { text-decoration: line-through; }
+.underline    { text-decoration: underline; }
+.no-underline { text-decoration: none; }
+
+
+@media #{$breakpoint-not-small} {
+  .strike-ns       { text-decoration: line-through; }
+  .underline-ns    { text-decoration: underline; }
+  .no-underline-ns { text-decoration: none; }
+}
+
+@media #{$breakpoint-medium} {
+  .strike-m       { text-decoration: line-through; }
+  .underline-m    { text-decoration: underline; }
+  .no-underline-m { text-decoration: none; }
+}
+
+@media #{$breakpoint-large} {
+  .strike-l       { text-decoration: line-through; }
+  .underline-l {    text-decoration: underline; }
+  .no-underline-l { text-decoration: none; }
+}

src/rawdata/scss/tachyons/scss/_text-transform.scss

@@ -0,0 +1,53 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   TEXT TRANSFORM
+   Docs: http://tachyons.io/docs/typography/text-transform/
+
+   Base:
+     tt = text-transform
+
+   Modifiers
+     c = capitalize
+     l = lowercase
+     u = uppercase
+     n = none
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.ttc { text-transform: capitalize; }
+.ttl { text-transform: lowercase; }
+.ttu { text-transform: uppercase; }
+.ttn { text-transform: none; }
+
+@media #{$breakpoint-not-small} {
+  .ttc-ns { text-transform: capitalize; }
+  .ttl-ns { text-transform: lowercase; }
+  .ttu-ns { text-transform: uppercase; }
+  .ttn-ns { text-transform: none; }
+}
+
+@media #{$breakpoint-medium} {
+  .ttc-m { text-transform: capitalize; }
+  .ttl-m { text-transform: lowercase; }
+  .ttu-m { text-transform: uppercase; }
+  .ttn-m { text-transform: none; }
+}
+
+@media #{$breakpoint-large} {
+  .ttc-l { text-transform: capitalize; }
+  .ttl-l { text-transform: lowercase; }
+  .ttu-l { text-transform: uppercase; }
+  .ttn-l { text-transform: none; }
+}

src/rawdata/scss/tachyons/scss/_type-scale.scss

@@ -0,0 +1,102 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   TYPE SCALE
+   Docs: http://tachyons.io/docs/typography/scale/
+
+   Base:
+    f = font-size
+
+   Modifiers
+     1 = 1st step in size scale
+     2 = 2nd step in size scale
+     3 = 3rd step in size scale
+     4 = 4th step in size scale
+     5 = 5th step in size scale
+     6 = 6th step in size scale
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+*/
+
+/*
+ * For Hero/Marketing Titles
+ *
+ * These generally are too large for mobile
+ * so be careful using them on smaller screens.
+ * */
+
+.f-6,
+.f-headline {
+  font-size: $font-size-headline;
+}
+.f-5,
+.f-subheadline {
+  font-size: $font-size-subheadline;
+}
+
+
+/* Type Scale */
+
+
+.f1 { font-size: $font-size-1; }
+.f2 { font-size: $font-size-2; }
+.f3 { font-size: $font-size-3; }
+.f4 { font-size: $font-size-4; }
+.f5 { font-size: $font-size-5; }
+.f6 { font-size: $font-size-6; }
+.f7 { font-size: $font-size-7; }
+
+@media #{$breakpoint-not-small}{
+  .f-6-ns,
+  .f-headline-ns { font-size: $font-size-headline; }
+  .f-5-ns,
+  .f-subheadline-ns { font-size: $font-size-subheadline; }
+  .f1-ns { font-size: $font-size-1; }
+  .f2-ns { font-size: $font-size-2; }
+  .f3-ns { font-size: $font-size-3; }
+  .f4-ns { font-size: $font-size-4; }
+  .f5-ns { font-size: $font-size-5; }
+  .f6-ns { font-size: $font-size-6; }
+  .f7-ns { font-size: $font-size-7; }
+}
+
+@media #{$breakpoint-medium} {
+  .f-6-m,
+  .f-headline-m { font-size: $font-size-headline; }
+  .f-5-m,
+  .f-subheadline-m { font-size: $font-size-subheadline; }
+  .f1-m { font-size: $font-size-1; }
+  .f2-m { font-size: $font-size-2; }
+  .f3-m { font-size: $font-size-3; }
+  .f4-m { font-size: $font-size-4; }
+  .f5-m { font-size: $font-size-5; }
+  .f6-m { font-size: $font-size-6; }
+  .f7-m { font-size: $font-size-7; }
+}
+
+@media #{$breakpoint-large} {
+  .f-6-l,
+  .f-headline-l {
+    font-size: $font-size-headline;
+  }
+  .f-5-l,
+  .f-subheadline-l {
+    font-size: $font-size-subheadline;
+  }
+  .f1-l { font-size: $font-size-1; }
+  .f2-l { font-size: $font-size-2; }
+  .f3-l { font-size: $font-size-3; }
+  .f4-l { font-size: $font-size-4; }
+  .f5-l { font-size: $font-size-5; }
+  .f6-l { font-size: $font-size-6; }
+  .f7-l { font-size: $font-size-7; }
+}

src/rawdata/scss/tachyons/scss/_typography.scss

@@ -0,0 +1,129 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   TYPOGRAPHY
+   http://tachyons.io/docs/typography/measure/
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+
+
+/* Measure is limited to ~66 characters */
+.measure {
+  max-width: $measure;
+}
+
+/* Measure is limited to ~80 characters */
+.measure-wide {
+  max-width: $measure-wide;
+}
+
+/* Measure is limited to ~45 characters */
+.measure-narrow {
+  max-width: $measure-narrow;
+}
+
+/* Book paragraph style - paragraphs are indented with no vertical spacing. */
+.indent {
+  text-indent: 1em;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.small-caps {
+  font-variant: small-caps;
+}
+
+/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */
+
+.truncate {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+@media #{$breakpoint-not-small} {
+  .measure-ns  {
+    max-width: $measure;
+  }
+  .measure-wide-ns {
+    max-width: $measure-wide;
+  }
+  .measure-narrow-ns {
+    max-width: $measure-narrow;
+  }
+  .indent-ns {
+    text-indent: 1em;
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .small-caps-ns {
+    font-variant: small-caps;
+  }
+  .truncate-ns {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .measure-m {
+    max-width: $measure;
+  }
+  .measure-wide-m {
+    max-width: $measure-wide;
+  }
+  .measure-narrow-m {
+    max-width: $measure-narrow;
+  }
+  .indent-m {
+    text-indent: 1em;
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .small-caps-m {
+    font-variant: small-caps;
+  }
+  .truncate-m {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+
+@media #{$breakpoint-large} {
+  .measure-l {
+    max-width: $measure;
+  }
+  .measure-wide-l {
+    max-width: $measure-wide;
+  }
+  .measure-narrow-l {
+    max-width: $measure-narrow;
+  }
+  .indent-l {
+    text-indent: 1em;
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .small-caps-l {
+    font-variant: small-caps;
+  }
+  .truncate-l {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}

src/rawdata/scss/tachyons/scss/_utilities.scss

@@ -0,0 +1,57 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   UTILITIES
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+/* Equivalent to .overflow-y-scroll */
+.overflow-container {
+  overflow-y: scroll;
+}
+
+.center {
+  margin-right: auto;
+  margin-left: auto;
+}
+
+.mr-auto { margin-right: auto; }
+.ml-auto { margin-left:  auto; }
+
+@media #{$breakpoint-not-small}{
+  .center-ns {
+    margin-right: auto;
+    margin-left: auto;
+  }
+  .mr-auto-ns { margin-right: auto; }
+  .ml-auto-ns { margin-left:  auto; }
+}
+
+@media #{$breakpoint-medium}{
+  .center-m {
+    margin-right: auto;
+    margin-left: auto;
+  }
+  .mr-auto-m { margin-right: auto; }
+  .ml-auto-m { margin-left:  auto; }
+}
+
+@media #{$breakpoint-large}{
+  .center-l {
+    margin-right: auto;
+    margin-left: auto;
+  }
+  .mr-auto-l { margin-right: auto; }
+  .ml-auto-l { margin-left:  auto; }
+}

src/rawdata/scss/tachyons/scss/_variables.scss

@@ -0,0 +1,143 @@
+
+// Converted Variables
+
+$sans-serif: -apple-system, BlinkMacSystemFont, 'avenir next', avenir, helvetica, 'helvetica neue', ubuntu, roboto, noto, 'segoe ui', arial, sans-serif !default;
+$serif: georgia, serif !default;
+$code: consolas, monaco, monospace !default;
+$font-size-headline: 6rem !default;
+$font-size-subheadline: 5rem !default;
+$font-size-1: 3rem !default;
+$font-size-2: 2.25rem !default;
+$font-size-3: 1.5rem !default;
+$font-size-4: 1.25rem !default;
+$font-size-5: 1rem !default;
+$font-size-6: .875rem !default;
+$font-size-7: .75rem !default;
+$letter-spacing-tight: -.05em !default;
+$letter-spacing-1: .1em !default;
+$letter-spacing-2: .25em !default;
+$line-height-solid: 1 !default;
+$line-height-title: 1.25 !default;
+$line-height-copy: 1.5 !default;
+$measure: 30em !default;
+$measure-narrow: 20em !default;
+$measure-wide: 34em !default;
+$spacing-none: 0 !default;
+$spacing-extra-small: .25rem !default;
+$spacing-small: .5rem !default;
+$spacing-medium: 1rem !default;
+$spacing-large: 2rem !default;
+$spacing-extra-large: 4rem !default;
+$spacing-extra-extra-large: 8rem !default;
+$spacing-extra-extra-extra-large: 16rem !default;
+$spacing-copy-separator: 1.5em !default;
+$height-1: 1rem !default;
+$height-2: 2rem !default;
+$height-3: 4rem !default;
+$height-4: 8rem !default;
+$height-5: 16rem !default;
+$width-1: 1rem !default;
+$width-2: 2rem !default;
+$width-3: 4rem !default;
+$width-4: 8rem !default;
+$width-5: 16rem !default;
+$max-width-1: 1rem !default;
+$max-width-2: 2rem !default;
+$max-width-3: 4rem !default;
+$max-width-4: 8rem !default;
+$max-width-5: 16rem !default;
+$max-width-6: 32rem !default;
+$max-width-7: 48rem !default;
+$max-width-8: 64rem !default;
+$max-width-9: 96rem !default;
+$border-radius-none: 0 !default;
+$border-radius-1: .125rem !default;
+$border-radius-2: .25rem !default;
+$border-radius-3: .5rem !default;
+$border-radius-4: 1rem !default;
+$border-radius-circle: 100% !default;
+$border-radius-pill: 9999px !default;
+$border-width-none: 0 !default;
+$border-width-1: .125rem !default;
+$border-width-2: .25rem !default;
+$border-width-3: .5rem !default;
+$border-width-4: 1rem !default;
+$border-width-5: 2rem !default;
+$box-shadow-1: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ) !default;
+$box-shadow-2: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ) !default;
+$box-shadow-3: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ) !default;
+$box-shadow-4: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ) !default;
+$box-shadow-5: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ) !default;
+$black: #000 !default;
+$near-black: #111 !default;
+$dark-gray: #333 !default;
+$mid-gray: #555 !default;
+$gray: #777 !default;
+$silver: #999 !default;
+$light-silver: #aaa !default;
+$moon-gray: #ccc !default;
+$light-gray: #eee !default;
+$near-white: #f4f4f4 !default;
+$white: #fff !default;
+$transparent: transparent !default;
+$black-90: rgba(0,0,0,.9) !default;
+$black-80: rgba(0,0,0,.8) !default;
+$black-70: rgba(0,0,0,.7) !default;
+$black-60: rgba(0,0,0,.6) !default;
+$black-50: rgba(0,0,0,.5) !default;
+$black-40: rgba(0,0,0,.4) !default;
+$black-30: rgba(0,0,0,.3) !default;
+$black-20: rgba(0,0,0,.2) !default;
+$black-10: rgba(0,0,0,.1) !default;
+$black-05: rgba(0,0,0,.05) !default;
+$black-025: rgba(0,0,0,.025) !default;
+$black-0125: rgba(0,0,0,.0125) !default;
+$white-90: rgba(255,255,255,.9) !default;
+$white-80: rgba(255,255,255,.8) !default;
+$white-70: rgba(255,255,255,.7) !default;
+$white-60: rgba(255,255,255,.6) !default;
+$white-50: rgba(255,255,255,.5) !default;
+$white-40: rgba(255,255,255,.4) !default;
+$white-30: rgba(255,255,255,.3) !default;
+$white-20: rgba(255,255,255,.2) !default;
+$white-10: rgba(255,255,255,.1) !default;
+$white-05: rgba(255,255,255,.05) !default;
+$white-025: rgba(255,255,255,.025) !default;
+$white-0125: rgba(255,255,255,.0125) !default;
+$dark-red: #e7040f !default;
+$red: #ff4136 !default;
+$light-red: #ff725c !default;
+$orange: #ff6300 !default;
+$gold: #ffb700 !default;
+$yellow: #ffd700 !default;
+$light-yellow: #fbf1a9 !default;
+$purple: #5e2ca5 !default;
+$light-purple: #a463f2 !default;
+$dark-pink: #d5008f !default;
+$hot-pink: #ff41b4 !default;
+$pink: #ff80cc !default;
+$light-pink: #ffa3d7 !default;
+$dark-green: #137752 !default;
+$green: #19a974 !default;
+$light-green: #9eebcf !default;
+$navy: #001b44 !default;
+$dark-blue: #00449e !default;
+$blue: #357edd !default;
+$light-blue: #96ccff !default;
+$lightest-blue: #cdecff !default;
+$washed-blue: #f6fffe !default;
+$washed-green: #e8fdf5 !default;
+$washed-yellow: #fffceb !default;
+$washed-red: #ffdfdf !default;
+
+// Custom Media Query Variables
+
+$breakpoint-not-small: 'screen and (min-width: 30em)' !default;
+$breakpoint-medium: 'screen and (min-width: 30em) and (max-width: 60em)' !default;
+$breakpoint-large: 'screen and (min-width: 60em)' !default;
+
+/*
+
+    VARIABLES
+
+*/

src/rawdata/scss/tachyons/scss/_vertical-align.scss

@@ -0,0 +1,43 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   VERTICAL ALIGN
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.v-base     { vertical-align: baseline; }
+.v-mid      { vertical-align: middle; }
+.v-top      { vertical-align: top; }
+.v-btm      { vertical-align: bottom; }
+
+@media #{$breakpoint-not-small} {
+  .v-base-ns     { vertical-align: baseline; }
+  .v-mid-ns      { vertical-align: middle; }
+  .v-top-ns      { vertical-align: top; }
+  .v-btm-ns      { vertical-align: bottom; }
+}
+
+@media #{$breakpoint-medium} {
+  .v-base-m     { vertical-align: baseline; }
+  .v-mid-m      { vertical-align: middle; }
+  .v-top-m      { vertical-align: top; }
+  .v-btm-m      { vertical-align: bottom; }
+}
+
+@media #{$breakpoint-large} {
+  .v-base-l     { vertical-align: baseline; }
+  .v-mid-l      { vertical-align: middle; }
+  .v-top-l      { vertical-align: top; }
+  .v-btm-l      { vertical-align: bottom; }
+}

src/rawdata/scss/tachyons/scss/_visibility.scss

@@ -0,0 +1,58 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   VISIBILITY
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+
+/*
+    Text that is hidden but accessible
+    Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
+*/
+
+.clip {
+  position: fixed !important;
+  _position: absolute !important;
+  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+  clip: rect(1px, 1px, 1px, 1px);
+}
+
+@media #{$breakpoint-not-small} {
+  .clip-ns {
+    position: fixed !important;
+    _position: absolute !important;
+    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+    clip: rect(1px, 1px, 1px, 1px);
+  }
+}
+
+@media #{$breakpoint-medium} {
+  .clip-m {
+    position: fixed !important;
+    _position: absolute !important;
+    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+    clip: rect(1px, 1px, 1px, 1px);
+  }
+}
+
+@media #{$breakpoint-large} {
+  .clip-l {
+    position: fixed !important;
+    _position: absolute !important;
+    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
+    clip: rect(1px, 1px, 1px, 1px);
+  }
+}
+

src/rawdata/scss/tachyons/scss/_white-space.scss

@@ -0,0 +1,41 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   WHITE SPACE
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+
+.ws-normal { white-space: normal; }
+.nowrap { white-space: nowrap; }
+.pre { white-space: pre; }
+
+@media #{$breakpoint-not-small} {
+  .ws-normal-ns { white-space: normal; }
+  .nowrap-ns { white-space: nowrap; }
+  .pre-ns { white-space: pre; }
+}
+
+@media #{$breakpoint-medium} {
+  .ws-normal-m { white-space: normal; }
+  .nowrap-m { white-space: nowrap; }
+  .pre-m { white-space: pre; }
+}
+
+@media #{$breakpoint-large} {
+  .ws-normal-l { white-space: normal; }
+  .nowrap-l { white-space: nowrap; }
+  .pre-l { white-space: pre; }
+}
+

src/rawdata/scss/tachyons/scss/_widths.scss

@@ -0,0 +1,150 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   WIDTHS
+   Docs: http://tachyons.io/docs/layout/widths/
+
+   Base:
+     w = width
+
+     Modifiers
+       1 = 1st step in width scale
+       2 = 2nd step in width scale
+       3 = 3rd step in width scale
+       4 = 4th step in width scale
+       5 = 5th step in width scale
+
+       -10  = literal value 10%
+       -20  = literal value 20%
+       -25  = literal value 25%
+       -30  = literal value 30%
+       -33  = literal value 33%
+       -34  = literal value 34%
+       -40  = literal value 40%
+       -50  = literal value 50%
+       -60  = literal value 60%
+       -70  = literal value 70%
+       -75  = literal value 75%
+       -80  = literal value 80%
+       -90  = literal value 90%
+       -100 = literal value 100%
+
+       -third      = 100% / 3 (Not supported in opera mini or IE8)
+       -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)
+       -auto       = string value auto
+
+
+     Media Query Extensions:
+       -ns = not-small
+       -m  = medium
+       -l  = large
+
+  */
+
+/* Width Scale */
+
+.w1 {    width: $width-1; }
+.w2 {    width: $width-2; }
+.w3 {    width: $width-3; }
+.w4 {    width: $width-4; }
+.w5 {    width: $width-5; }
+
+.w-10 {  width:  10%; }
+.w-20 {  width:  20%; }
+.w-25 {  width:  25%; }
+.w-30 {  width:  30%; }
+.w-33 {  width:  33%; }
+.w-34 {  width:  34%; }
+.w-40 {  width:  40%; }
+.w-50 {  width:  50%; }
+.w-60 {  width:  60%; }
+.w-70 {  width:  70%; }
+.w-75 {  width:  75%; }
+.w-80 {  width:  80%; }
+.w-90 {  width:  90%; }
+.w-100 { width: 100%; }
+
+.w-third { width: (100% / 3); }
+.w-two-thirds { width: (100% / 1.5); }
+.w-auto { width: auto; }
+
+@media #{$breakpoint-not-small} {
+  .w1-ns {  width: $width-1; }
+  .w2-ns {  width: $width-2; }
+  .w3-ns {  width: $width-3; }
+  .w4-ns {  width: $width-4; }
+  .w5-ns {  width: $width-5; }
+  .w-10-ns { width:  10%; }
+  .w-20-ns { width:  20%; }
+  .w-25-ns { width:  25%; }
+  .w-30-ns { width:  30%; }
+  .w-33-ns { width:  33%; }
+  .w-34-ns { width:  34%; }
+  .w-40-ns { width:  40%; }
+  .w-50-ns { width:  50%; }
+  .w-60-ns { width:  60%; }
+  .w-70-ns { width:  70%; }
+  .w-75-ns { width:  75%; }
+  .w-80-ns { width:  80%; }
+  .w-90-ns { width:  90%; }
+  .w-100-ns { width: 100%; }
+  .w-third-ns { width: (100% / 3); }
+  .w-two-thirds-ns { width: (100% / 1.5); }
+  .w-auto-ns { width: auto; }
+}
+
+@media #{$breakpoint-medium} {
+  .w1-m {      width: $width-1; }
+  .w2-m {      width: $width-2; }
+  .w3-m {      width: $width-3; }
+  .w4-m {      width: $width-4; }
+  .w5-m {      width: $width-5; }
+  .w-10-m { width:  10%; }
+  .w-20-m { width:  20%; }
+  .w-25-m { width:  25%; }
+  .w-30-m { width:  30%; }
+  .w-33-m { width:  33%; }
+  .w-34-m { width:  34%; }
+  .w-40-m { width:  40%; }
+  .w-50-m { width:  50%; }
+  .w-60-m { width:  60%; }
+  .w-70-m { width:  70%; }
+  .w-75-m { width:  75%; }
+  .w-80-m { width:  80%; }
+  .w-90-m { width:  90%; }
+  .w-100-m { width: 100%; }
+  .w-third-m { width: (100% / 3); }
+  .w-two-thirds-m { width: (100% / 1.5); }
+  .w-auto-m {    width: auto; }
+}
+
+@media #{$breakpoint-large} {
+  .w1-l {      width: $width-1; }
+  .w2-l {      width: $width-2; }
+  .w3-l {      width: $width-3; }
+  .w4-l {      width: $width-4; }
+  .w5-l {      width: $width-5; }
+  .w-10-l {    width:  10%; }
+  .w-20-l {    width:  20%; }
+  .w-25-l {    width:  25%; }
+  .w-30-l {    width:  30%; }
+  .w-33-l {    width:  33%; }
+  .w-34-l {    width:  34%; }
+  .w-40-l {    width:  40%; }
+  .w-50-l {    width:  50%; }
+  .w-60-l {    width:  60%; }
+  .w-70-l {    width:  70%; }
+  .w-75-l {    width:  75%; }
+  .w-80-l {    width:  80%; }
+  .w-90-l {    width:  90%; }
+  .w-100-l {   width: 100%; }
+  .w-third-l { width: (100% / 3); }
+  .w-two-thirds-l { width: (100% / 1.5); }
+  .w-auto-l {    width: auto; }
+}

src/rawdata/scss/tachyons/scss/_word-break.scss

@@ -0,0 +1,43 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  WORD BREAK
+
+   Base:
+     word = word-break
+
+   Media Query Extensions:
+     -ns = not-small
+     -m  = medium
+     -l  = large
+
+*/
+
+.word-normal { word-break: normal; }
+.word-wrap { word-break: break-all; }
+.word-nowrap { word-break: keep-all; }
+
+@media #{$breakpoint-not-small} {
+  .word-normal-ns { word-break: normal; }
+  .word-wrap-ns { word-break: break-all; }
+  .word-nowrap-ns { word-break: keep-all; }
+}
+
+@media #{$breakpoint-medium} {
+  .word-normal-m { word-break: normal; }
+  .word-wrap-m { word-break: break-all; }
+  .word-nowrap-m { word-break: keep-all; }
+}
+
+@media #{$breakpoint-large} {
+  .word-normal-l { word-break: normal; }
+  .word-wrap-l { word-break: break-all; }
+  .word-nowrap-l { word-break: keep-all; }
+}
+

src/rawdata/scss/tachyons/scss/_z-index.scss

@@ -0,0 +1,60 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+  Z-INDEX
+
+  Base
+    z = z-index
+
+  Modifiers
+    -0 = literal value 0
+    -1 = literal value 1
+    -2 = literal value 2
+    -3 = literal value 3
+    -4 = literal value 4
+    -5 = literal value 5
+    -999 = literal value 999
+    -9999 = literal value 9999
+
+    -max = largest accepted z-index value as integer
+
+    -inherit = string value inherit
+    -initial = string value initial
+    -unset = string value unset
+
+  MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index
+  Spec: http://www.w3.org/TR/CSS2/zindex.html
+  Articles:
+    https://philipwalton.com/articles/what-no-one-told-you-about-z-index/
+
+  Tips on extending:
+  There might be a time worth using negative z-index values.
+  Or if you are using tachyons with another project, you might need to
+  adjust these values to suit your needs.
+
+*/
+
+.z-0 { z-index: 0; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.z-3 { z-index: 3; }
+.z-4 { z-index: 4; }
+.z-5 { z-index: 5; }
+
+.z-999 { z-index: 999; }
+.z-9999 { z-index: 9999; }
+
+.z-max {
+  z-index: 2147483647;
+}
+
+.z-inherit { z-index: inherit; }
+.z-initial { z-index: initial; }
+.z-unset { z-index: unset; }
+

src/rawdata/scss/tachyons/tachyons.scss

@@ -0,0 +1,94 @@
+// ! TACHYONS v4.9.0 | http://tachyons.io 
+
+//
+//
+//      ________            ______
+//      ___  __/_____ _________  /______  ______________________
+//      __  /  _  __ `/  ___/_  __ \_  / / /  __ \_  __ \_  ___/
+//      _  /   / /_/ // /__ _  / / /  /_/ // /_/ /  / / /(__  )
+//      /_/    \__,_/ \___/ /_/ /_/_\__, / \____//_/ /_//____/
+//                                 /____/
+//
+//    TABLE OF CONTENTS
+//
+//    1. External Library Includes
+//       - Normalize.css | http://normalize.css.github.io
+//    2. Tachyons Modules
+//    3. Variables
+//       - Media Queries
+//       - Colors
+//    4. Debugging
+//       - Debug all
+//       - Debug children
+//
+//
+
+
+ //  External Library Includes 
+ @import 'scss/normalize';
+
+
+//  Variables 
+//  Importing here will allow you to override any variables in the modules 
+
+@import 'scss/variables';
+
+//  Debugging 
+@import 'scss/debug-children';
+@import 'scss/debug-grid';
+
+//  Uncomment out the line below to help debug layout issues 
+//  @import 'scss/debug'; 
+
+ //  Modules 
+ @import 'scss/box-sizing';
+ @import 'scss/aspect-ratios';
+ @import 'scss/images';
+ @import 'scss/background-size';
+ @import 'scss/background-position';
+ @import 'scss/outlines';
+ @import 'scss/borders';
+ @import 'scss/border-colors';
+ @import 'scss/border-radius';
+ @import 'scss/border-style';
+ @import 'scss/border-widths';
+ @import 'scss/box-shadow';
+ @import 'scss/code';
+ @import 'scss/coordinates';
+ @import 'scss/clears';
+ @import 'scss/display';
+ @import 'scss/flexbox'; // HMN MODIFICATION: In the original, flex came before display, but this made things difficult.
+ @import 'scss/floats';
+ @import 'scss/font-family';
+ @import 'scss/font-style';
+ @import 'scss/font-weight';
+ @import 'scss/forms';
+ @import 'scss/heights';
+ @import 'scss/letter-spacing';
+ @import 'scss/line-height';
+ @import 'scss/links';
+ @import 'scss/lists';
+ @import 'scss/max-widths';
+ @import 'scss/widths';
+ @import 'scss/overflow';
+ @import 'scss/position';
+ @import 'scss/opacity';
+ @import 'scss/rotations';
+ @import 'scss/skins';
+ @import 'scss/skins-pseudo';
+ @import 'scss/spacing';
+ @import 'scss/negative-margins';
+ @import 'scss/tables';
+ @import 'scss/text-decoration';
+ @import 'scss/text-align';
+ @import 'scss/text-transform';
+ @import 'scss/type-scale';
+ @import 'scss/typography';
+ @import 'scss/utilities';
+ @import 'scss/visibility';
+ @import 'scss/white-space';
+ @import 'scss/vertical-align';
+ @import 'scss/hovers';
+ @import 'scss/z-index';
+ @import 'scss/nested';
+ @import 'scss/styles';

src/rawdata/scss/theme.scss

@@ -0,0 +1,11 @@
+@import 'globals';
+
+// This defines the $vars variable. Which _variables.scss gets
+// imported is determined by the include paths of the SCSS compiler.
+@import 'variables';
+
+:root {
+  @each $name, $val in $vars {
+    --#{$name}: #{$val};
+  }
+}

src/rawdata/scss/themes/dark/_variables.scss

@@ -0,0 +1,198 @@
+$fg-font-color: #eee;
+
+$vars: (
+  fg-font-color: $fg-font-color,
+
+  // Default theme colors in case the assets.css is busted
+  theme-color: #666,
+  theme-color-dim: #444,
+  theme-color-dimmer: #383838,
+  theme-color-dimmest: #333,
+
+  link-color: #aaa,
+  link-border-color: #aaa,
+
+  table-border-color: #aaa,
+  hr-color: #aaa,
+
+  main-background-color: #202020,
+  main-color: #eee,
+  dim-color: #bbb,
+  dimmer-color: #999,
+  dimmest-color: #777,
+
+  menu-bottom-border-color: #444,
+
+  login-popup-background: #181818,
+
+  content-background: #202020,
+  content-background-transparent: rgba(#202020, 0),
+  dim-background: #252525,
+  dim-background-transparent: rgba(#252525, 0),
+
+  text-background: #181818,
+  spoiler-border: #777,
+
+  background-even-background: #242424,
+
+  project-notice-text-color: $fg-font-color,
+  project-card-border-color: #333,
+  project-user-suggestions-background: #222,
+  project-user-suggestions-border-color: #444,
+  project-edit-logo-previw-border-color: #444,
+  project-edit-quota-bar-border-color: #444,
+  project-edit-quota-bar-filled-background: #888,
+
+  notice-unapproved-color: #7a2020,
+  notice-hidden-color: #494949,
+  notice-hiatus-color: #876327,
+  notice-dead-color: #7a2020,
+  notice-lts-color: #2a681d,
+  notice-lts-reqd-color: #876327,
+
+  optionbar-border-color: #333,
+
+  tab-background: #181818,
+  tab-border-color: #3f3f3f,
+  tab-button-background: #303030,
+  tab-button-background-hover: #383838,
+  tab-button-background-current: #181818,
+
+  form-check-background: #252527,
+  form-check-border-color: #666,
+  form-check-border-color-hover: #084068,
+  form-text-background: #181818,
+  form-text-background-active: #252527,
+  form-text-border-color: #444,
+  form-text-border-color-active: #084068,
+  form-button-color: #999,
+  form-button-color-active: #4c9ed9,
+  form-button-background: #383838,
+  form-button-background-active: #303840,
+  form-button-border-color: transparent,
+  form-button-inline-border-color: transparent,
+
+  landing-search-background: #282828,
+  landing-search-background-hover: #181818,
+
+  editor-toolbar-background: #282828,
+  editor-toolbar-border-color: #333,
+  editor-toolbar-button-background: 282828,
+  editor-toolbar-button-background-hover: #333,
+  editor-toolbar-button-border-color: #333,
+
+  post-blockquote-border-color: #555,
+
+  forum-even-background: #242424,
+  forum-thread-read-color: #777,
+  forum-thread-read-link-color: #999,
+  forum-post-author-color: #999,
+  forum-diff-source-background: #181818,
+  forum-diff-source-border-color: #444,
+  forum-diff-replace-background: #18283a,
+  forum-diff-replace-border-color: #223d5b,
+  forum-diff-delete-background: #3a1818,
+  forum-diff-delete-border-color: #6b1e1c,
+  forum-diff-insert-background: #233a18,
+  forum-diff-insert-border-color: #30591b,
+
+  card-background: #222,
+  card-background-hover: #282828,
+
+  irc-border-color: #333,
+  irc-tab-current-shadow: 0px 0px 5px #000 inset,
+  irc-tab-close-button-color: #bbb,
+  irc-tab-close-button-background: #444,
+  irc-nick-border-color: #444,
+  irc-users-color: #aaa,
+  irc-users-background: #181818,
+  irc-users-border-color: transparent,
+  irc-users-popout-background: #181818,
+  irc-users-popout-border-color-left: #444,
+  irc-users-popout-border-color-right: #333,
+
+  wiki-border-color: #444,
+  wiki-toc-number-color: #bbb,
+
+  code-line-number-color: #444,
+
+  library-star-btn-background: #252525,
+  library-star-btn-border-color: #bbb,
+  library-star-btn-a-border-color: #999,
+  library-star-btn-a-hover-background: #333,
+);
+
+// code styles
+
+/* bbcode [code] -- see: https://github.com/richleland/pygments-css/blob/master/monokai.css */
+.codeblock .hll { background-color: #49483e }
+.codeblock .c { color: #75715e } /* Comment */
+.codeblock .err { color: #ff0000; } /* Error */
+.codeblock .k { color: #66d9ef } /* Keyword */
+.codeblock .l { color: #ae81ff } /* Literal */
+.codeblock .n { color: #f8f8f2 } /* Name */
+.codeblock .o { color: #f92672 } /* Operator */
+.codeblock .p { color: #f8f8f2 } /* Punctuation */
+.codeblock .cm { color: #75715e } /* Comment.Multiline */
+.codeblock .cp { color: #75715e } /* Comment.Preproc */
+.codeblock .c1 { color: #75715e } /* Comment.Single */
+.codeblock .cs { color: #75715e } /* Comment.Special */
+.codeblock .ge { font-style: italic } /* Generic.Emph */
+.codeblock .gs { font-weight: bold } /* Generic.Strong */
+.codeblock .kc { color: #66d9ef } /* Keyword.Constant */
+.codeblock .kd { color: #66d9ef } /* Keyword.Declaration */
+.codeblock .kn { color: #f92672 } /* Keyword.Namespace */
+.codeblock .kp { color: #66d9ef } /* Keyword.Pseudo */
+.codeblock .kr { color: #66d9ef } /* Keyword.Reserved */
+.codeblock .kt { color: #66d9ef } /* Keyword.Type */
+.codeblock .ld { color: #e6db74 } /* Literal.Date */
+.codeblock .m { color: #ae81ff } /* Literal.Number */
+.codeblock .s { color: #e6db74 } /* Literal.String */
+.codeblock .na { color: #a6e22e } /* Name.Attribute */
+.codeblock .nb { color: #f8f8f2 } /* Name.Builtin */
+.codeblock .nc { color: #a6e22e } /* Name.Class */
+.codeblock .no { color: #66d9ef } /* Name.Constant */
+.codeblock .nd { color: #a6e22e } /* Name.Decorator */
+.codeblock .ni { color: #f8f8f2 } /* Name.Entity */
+.codeblock .ne { color: #a6e22e } /* Name.Exception */
+.codeblock .nf { color: #a6e22e } /* Name.Function */
+.codeblock .nl { color: #f8f8f2 } /* Name.Label */
+.codeblock .nn { color: #f8f8f2 } /* Name.Namespace */
+.codeblock .nx { color: #a6e22e } /* Name.Other */
+.codeblock .py { color: #f8f8f2 } /* Name.Property */
+.codeblock .nt { color: #f92672 } /* Name.Tag */
+.codeblock .nv { color: #f8f8f2 } /* Name.Variable */
+.codeblock .ow { color: #f92672 } /* Operator.Word */
+.codeblock .w { color: #f8f8f2 } /* Text.Whitespace */
+.codeblock .mf { color: #ae81ff } /* Literal.Number.Float */
+.codeblock .mh { color: #ae81ff } /* Literal.Number.Hex */
+.codeblock .mi { color: #ae81ff } /* Literal.Number.Integer */
+.codeblock .mo { color: #ae81ff } /* Literal.Number.Oct */
+.codeblock .sb { color: #e6db74 } /* Literal.String.Backtick */
+.codeblock .sc { color: #e6db74 } /* Literal.String.Char */
+.codeblock .sd { color: #e6db74 } /* Literal.String.Doc */
+.codeblock .s2 { color: #e6db74 } /* Literal.String.Double */
+.codeblock .se { color: #ae81ff } /* Literal.String.Escape */
+.codeblock .sh { color: #e6db74 } /* Literal.String.Heredoc */
+.codeblock .si { color: #e6db74 } /* Literal.String.Interpol */
+.codeblock .sx { color: #e6db74 } /* Literal.String.Other */
+.codeblock .sr { color: #e6db74 } /* Literal.String.Regex */
+.codeblock .s1 { color: #e6db74 } /* Literal.String.Single */
+.codeblock .ss { color: #e6db74 } /* Literal.String.Symbol */
+.codeblock .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
+.codeblock .vc { color: #f8f8f2 } /* Name.Variable.Class */
+.codeblock .vg { color: #f8f8f2 } /* Name.Variable.Global */
+.codeblock .vi { color: #f8f8f2 } /* Name.Variable.Instance */
+.codeblock .il { color: #ae81ff } /* Literal.Number.Integer.Long */
+
+.codeblock .gh { } /* Generic Heading & Diff Header */
+.codeblock .gu { color: #75715e; } /* Generic.Subheading & Diff Unified/Comment? */
+.codeblock .gd { color: #f92672; } /* Generic.Deleted & Diff Deleted */
+.codeblock .gi { color: #a6e22e; } /* Generic.Inserted & Diff Inserted */
+
+// hack in stuff for other themes
+
+.light {
+  background-color: #fff;
+  color: #000;
+}

src/rawdata/scss/themes/light/_variables.scss

@@ -0,0 +1,195 @@
+$fg-font-color: black;
+
+$vars: (
+  fg-font-color: $fg-font-color,
+
+  // Default theme colors in case the assets.css is busted
+  theme-color: #666,
+  theme-color-dim: #aaa,
+  theme-color-dimmer: #bbb,
+  theme-color-dimmest: #ccc,
+
+  link-color: #666,
+  link-border-color: #666,
+
+  table-border-color: #444,
+  hr-color: #444,
+
+  main-background-color: #fff,
+  main-color: black,
+  dim-color: #333,
+  dimmer-color: #999,
+  dimmest-color: #bbb,
+
+  menu-bottom-border-color: black,
+
+  login-popup-background: #fbfbfb,
+
+  content-background: #f8f8f8,
+  content-background-transparent: rgba(#f8f8f8, 0),
+  dim-background: #f0f0f0,
+  dim-background-transparent: rgba(#f0f0f0, 0),
+
+  text-background: #f9f9f9,
+  spoiler-border: #aaa,
+
+  background-even-background: #f8f8f8,
+
+  project-notice-text-color: #fff,
+  project-card-border-color: #aaa,
+  project-user-suggestions-background: #fff,
+  project-user-suggestions-border-color: #ddd,
+  project-edit-logo-previw-border-color: #999,
+  project-edit-quota-bar-border-color: #999,
+  project-edit-quota-bar-filled-background: #444,
+
+  notice-unapproved-color: #b42222,
+  notice-hidden-color: #b6b6b6,
+  notice-hiatus-color: #aa7d30,
+  notice-dead-color: #b42222,
+  notice-lts-color: #43a52f,
+  notice-lts-reqd-color: #aa7d30,
+
+  optionbar-border-color: #ccc,
+
+  tab-background: #fff,
+  tab-border-color: #d8d8d8,
+  tab-button-background: #dfdfdf,
+  tab-button-background-hover: #efefef,
+  tab-button-background-current: #fff,
+
+  form-check-background: #fafafc,
+  form-check-border-color: #999,
+  form-check-border-color-hover: #4c9ed9,
+  form-text-background: #fff,
+  form-text-background-active: #fafafc,
+  form-text-border-color: #999,
+  form-text-border-color-active: #4c9ed9,
+  form-button-color: $fg-font-color,
+  form-button-color-active: #4c9ed9,
+  form-button-background: #fff,
+  form-button-background-active: #f2f2f2,
+  form-button-border-color: #ccc,
+  form-button-inline-border-color: #999,
+
+  landing-search-background: #f8f8f8,
+  landing-search-background-hover: #fefeff,
+
+  editor-toolbar-background: #fff,
+  editor-toolbar-border-color: transparent,
+  editor-toolbar-button-background: transparent,
+  editor-toolbar-button-background-hover: #ddd,
+  editor-toolbar-button-border-color: #ccc,
+
+  post-blockquote-border-color: #ddd,
+
+  forum-even-background: #f0f0f0,
+  forum-thread-read-color: #555,
+  forum-thread-read-link-color: #888,
+  forum-post-author-color: #333,
+  forum-diff-source-background: #fff,
+  forum-diff-source-border-color: #999,
+  forum-diff-replace-background: #adcef4,
+  forum-diff-replace-border-color: #4787d1,
+  forum-diff-delete-background: #e57979,
+  forum-diff-delete-border-color: #c12626,
+  forum-diff-insert-background: #96e579,
+  forum-diff-insert-border-color: #5baa3f,
+
+  card-background: #e8e8e8,
+  card-background-hover: #f0f0f0,
+
+  irc-border-color: #ddd,
+  irc-tab-current-shadow: 0px 0px 5px #bbb inset,
+  irc-tab-close-button-color: #fff,
+  irc-tab-close-button-background: #aaa,
+  irc-nick-border-color: #ccc,
+  irc-users-color: $fg-font-color,
+  irc-users-background: #fff,
+  irc-users-border-color: #ccc,
+  irc-users-popout-background: #fff,
+  irc-users-popout-border-color-left: #bbb,
+  irc-users-popout-border-color-right: #ccc,
+
+  wiki-border-color: #aaa,
+  wiki-toc-number-color: #333,
+
+  code-line-number-color: #777,
+
+  library-star-btn-background: #fff,
+  library-star-btn-border-color: #999,
+  library-star-btn-a-border-color: #aaa,
+  library-star-btn-a-hover-background: #fafafa,
+);
+
+// code styles
+
+/* bbcode [code] -- see: https://github.com/richleland/pygments-css/blob/master/friendly.css */
+.codeblock .hll { background-color: #ffffcc }
+.codeblock .c { color: #60a0b0; font-style: italic } /* Comment */
+.codeblock .err { color: #FF0000 } /* Error */
+.codeblock .k { color: #007020; font-weight: bold } /* Keyword */
+.codeblock .o { color: #666666 } /* Operator */
+.codeblock .cm { color: #60a0b0; font-style: italic } /* Comment.Multiline */
+.codeblock .cp { color: #007020 } /* Comment.Preproc */
+.codeblock .c1 { color: #60a0b0; font-style: italic } /* Comment.Single */
+.codeblock .cs { color: #60a0b0; background-color: #fff0f0 } /* Comment.Special */
+.codeblock .gd { color: #A00000 } /* Generic.Deleted */
+.codeblock .ge { font-style: italic } /* Generic.Emph */
+.codeblock .gr { color: #FF0000 } /* Generic.Error */
+.codeblock .gh { color: #000080; font-weight: bold } /* Generic.Heading */
+.codeblock .gi { color: #00A000 } /* Generic.Inserted */
+.codeblock .go { color: #808080 } /* Generic.Output */
+.codeblock .gp { color: #c65d09; font-weight: bold } /* Generic.Prompt */
+.codeblock .gs { font-weight: bold } /* Generic.Strong */
+.codeblock .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
+.codeblock .gt { color: #0040D0 } /* Generic.Traceback */
+.codeblock .kc { color: #007020; font-weight: bold } /* Keyword.Constant */
+.codeblock .kd { color: #007020; font-weight: bold } /* Keyword.Declaration */
+.codeblock .kn { color: #007020; font-weight: bold } /* Keyword.Namespace */
+.codeblock .kp { color: #007020 } /* Keyword.Pseudo */
+.codeblock .kr { color: #007020; font-weight: bold } /* Keyword.Reserved */
+.codeblock .kt { color: #902000 } /* Keyword.Type */
+.codeblock .m { color: #40a070 } /* Literal.Number */
+.codeblock .s { color: #4070a0 } /* Literal.String */
+.codeblock .na { color: #4070a0 } /* Name.Attribute */
+.codeblock .nb { color: #007020 } /* Name.Builtin */
+.codeblock .nc { color: #0e84b5; font-weight: bold } /* Name.Class */
+.codeblock .no { color: #60add5 } /* Name.Constant */
+.codeblock .nd { color: #555555; font-weight: bold } /* Name.Decorator */
+.codeblock .ni { color: #d55537; font-weight: bold } /* Name.Entity */
+.codeblock .ne { color: #007020 } /* Name.Exception */
+.codeblock .nf { color: #06287e } /* Name.Function */
+.codeblock .nl { color: #002070; font-weight: bold } /* Name.Label */
+.codeblock .nn { color: #0e84b5; font-weight: bold } /* Name.Namespace */
+.codeblock .nt { color: #062873; font-weight: bold } /* Name.Tag */
+.codeblock .nv { color: #bb60d5 } /* Name.Variable */
+.codeblock .ow { color: #007020; font-weight: bold } /* Operator.Word */
+.codeblock .w { color: #bbbbbb } /* Text.Whitespace */
+.codeblock .mf { color: #40a070 } /* Literal.Number.Float */
+.codeblock .mh { color: #40a070 } /* Literal.Number.Hex */
+.codeblock .mi { color: #40a070 } /* Literal.Number.Integer */
+.codeblock .mo { color: #40a070 } /* Literal.Number.Oct */
+.codeblock .sb { color: #4070a0 } /* Literal.String.Backtick */
+.codeblock .sc { color: #4070a0 } /* Literal.String.Char */
+.codeblock .sd { color: #4070a0; font-style: italic } /* Literal.String.Doc */
+.codeblock .s2 { color: #4070a0 } /* Literal.String.Double */
+.codeblock .se { color: #4070a0; font-weight: bold } /* Literal.String.Escape */
+.codeblock .sh { color: #4070a0 } /* Literal.String.Heredoc */
+.codeblock .si { color: #70a0d0; font-style: italic } /* Literal.String.Interpol */
+.codeblock .sx { color: #c65d09 } /* Literal.String.Other */
+.codeblock .sr { color: #235388 } /* Literal.String.Regex */
+.codeblock .s1 { color: #4070a0 } /* Literal.String.Single */
+.codeblock .ss { color: #517918 } /* Literal.String.Symbol */
+.codeblock .bp { color: #007020 } /* Name.Builtin.Pseudo */
+.codeblock .vc { color: #bb60d5 } /* Name.Variable.Class */
+.codeblock .vg { color: #bb60d5 } /* Name.Variable.Global */
+.codeblock .vi { color: #bb60d5 } /* Name.Variable.Instance */
+.codeblock .il { color: #40a070 } /* Literal.Number.Integer.Long */
+
+// hack in stuff for other themes
+
+.dark {
+  background-color: #222;
+  color: #bbb;
+}