Rename folder scss with an "_" for Jekyll to ignore it

assets/_scss/_base.scss

@@ -0,0 +1,287 @@
+/* ==========================================================================
+   BASE ELEMENTS
+   ========================================================================== */
+
+@include border-box-sizing;
+
+body {
+  margin: 0;
+  padding: 0;
+  color: $text-color;
+  font-family: $serif;
+  line-height: 1.5;
+  background-color: $body-color;
+  &.overflow--hidden {
+    /* when primary navigation is visible, the content in the background won't scroll */
+    overflow: hidden;
+  }
+}
+
+h1, h2, h3, h4, h5, h6 {
+  line-height: 1.25;
+  font-family: $sans-serif;
+}
+
+h1 {
+  font-size: 32px;
+}
+h2 {
+  font-size: 28px;
+}
+h3 {
+  font-size: 24px;
+}
+h4 {
+  font-size: 18px;
+}
+h5 {
+  font-size: 16px;
+}
+h6 {
+  font-size: 14px;
+}
+
+small {
+  font-size: 0.8rem;
+}
+
+u,
+ins {
+  text-decoration: none;
+  border-bottom: 1px solid $text-color;
+  a {
+    color: inherit;
+  }
+}
+
+del a {
+  color: inherit;
+}
+
+/* paragraph indents */
+
+p {
+  margin: 0 0 $indent-var;
+  // sibling indentation
+  @if $paragraph-indent == true {
+    & + p {
+      text-indent: $indent-var;
+      margin-top: -($indent-var);
+    }
+  }
+}
+
+/* reduce orphans and widows when printing */
+
+p, pre, blockquote, ul, ol, dl, figure, table, fieldset {
+  orphans: 3;
+  widows: 3;
+}
+
+/* abbreviations */
+
+abbr[title],
+abbr[data-original-title] {
+  text-decoration: none;
+  cursor: help;
+  border-bottom: 1px dotted $text-color;
+}
+
+/* blockquotes */
+
+blockquote {
+  margin: 2em 1em 2em 0;
+  padding-left: 1em;
+  padding-right: 1em;
+  font-style: italic;
+  border-left: 0.25em solid $accent-color;
+  a {
+    color: inherit;
+  }
+  cite {
+    font-family: $sans-serif;
+    font-size: 14px;
+    font-style: normal;
+    &:before {
+      content: "\2014";
+      padding-right: 5px;
+    }
+  }
+}
+
+/* links */
+
+a {
+  &:focus {
+    @extend %tab-focus;
+  }
+  &:hover,
+  &:active {
+    outline: 0;
+  }
+  &:hover {
+    img {
+      box-shadow: 0 0 10px rgba(#000, 0.25);
+    }
+  }
+}
+
+/* lists */
+
+ol, ul {
+  @include breakpoint($small) {
+    padding-left: 0;
+    ol, ul {
+      padding: 0.5em 1em;
+    }
+  }
+}
+
+/* code */
+
+tt, code, kbd, samp, pre {
+  font-family: $monospace;
+  font-size: 14px;
+}
+pre {
+  overflow-x: auto; // add scrollbars to wide code blocks
+}
+p code,
+li code,
+figcaption code {
+  padding-top: 0.1rem;
+  padding-bottom: 0.1rem;
+  background: mix(#fff, $light-gray, 40%);
+  border: 1px solid $light-gray;
+  border-radius: $border-radius;
+  &:before, &:after {
+    letter-spacing: -0.2em;
+    content: "\00a0"; // non-breaking space
+  }
+}
+
+/* horizontal rule */
+
+hr {
+  display: block;
+  margin: 1em 0;
+  border: 0;
+  border-top: 1px solid $border-color;
+}
+
+/*
+   Media and embeds
+   ========================================================================== */
+
+/* Figures and images */
+
+figure {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  flex-wrap: wrap;
+  margin: 2em 0;
+  img,
+  iframe,
+  .fluid-width-video-wrapper {
+    margin-bottom: 1em;
+  }
+  img {
+    width: 100%;
+    border-radius: $border-radius;
+    transition: box-shadow 0.3s;
+  }
+  > a {
+    display: block;
+  }
+  &.half {
+    > a,
+    > img {
+      @include breakpoint($small) {
+        width: calc(50% - 0.5em);
+      }
+    }
+    figcaption {
+      width: 100%;
+    }
+  }
+  &.third {
+    > a,
+    > img {
+      @include breakpoint($small) {
+        width: calc(33.3333% - 0.5em);
+      }
+    }
+    figcaption {
+      width: 100%;
+    }
+  }
+}
+
+/* Figure captions */
+
+figcaption {
+  margin-bottom: 0.65rem;
+  color: mix(#fff, $text-color, 25%);
+  font-family: $sans-serif;
+  font-size: 0.8rem;
+  a {
+    color: inherit;
+    text-decoration: none;
+    border-bottom: 1px solid $light-gray;
+    transition: border 0.4s ease-in-out;
+    &:hover {
+      color: #000;
+      border-bottom-color: #000;
+    }
+  }
+  code {
+    font-size: 0.64rem;
+  }
+}
+
+
+/* Fix IE9 SVG bug */
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+
+/*
+   Navigation lists
+   ========================================================================== */
+
+/**
+ * Removes margins, padding, and bullet points from navigation lists
+ *
+ * Example usage:
+ * <nav>
+ *    <ul>
+ *      <li><a href="#link-1">Link 1</a></li>
+ *      <li><a href="#link-2">Link 2</a></li>
+ *      <li><a href="#link-3">Link 3</a></li>
+ *    </ul>
+ *  </nav>
+ */
+
+nav {
+  ul {
+    margin: 0;
+    padding: 0;
+  }
+  li {
+    list-style: none;
+  }
+  a {
+    text-decoration: none;
+  }
+}
+
+/*
+   Global animation transition
+   ========================================================================== */
+
+b, i, strong, em, blockquote, p, q, span, figure, img, h1, h2, header, input, a, tr, td, form button, input[type="submit"], .btn, .highlight, .archive__item-teaser {
+  transition: all 0.2s ease-in-out;
+}