From 9a898651c53885be6f8efdecf0378f3f5d78bb2f Mon Sep 17 00:00:00 2001
From: Bryan C Guner <bryan.guner@gmail.com>
Date: Wed, 24 Aug 2022 05:06:02 +0000
Subject: [PATCH]  update

---
 src/sass/imports/_buttons.scss   |  24 +-
 src/sass/imports/_footer.scss    | 127 ++++---
 src/sass/imports/_forms.scss     |  62 ++--
 src/sass/imports/_general.scss   |  16 +-
 src/sass/imports/_header.scss    | 584 +++++++++++++++----------------
 src/sass/imports/_helpers.scss   |   2 +-
 src/sass/imports/_icons.scss     | 146 ++++----
 src/sass/imports/_palettes.scss  |  92 ++---
 src/sass/imports/_prism.scss     | 133 ++++---
 src/sass/imports/_sections.scss  | 430 +++++++++++------------
 src/sass/imports/_structure.scss |  42 +--
 src/sass/imports/_tables.scss    |  84 ++---
 src/sass/imports/_variables.scss |   4 +-
 13 files changed, 861 insertions(+), 885 deletions(-)

diff --git a/src/sass/imports/_buttons.scss b/src/sass/imports/_buttons.scss
index 5dff8fd7ce..c98f57275f 100644
--- a/src/sass/imports/_buttons.scss
+++ b/src/sass/imports/_buttons.scss
@@ -3,31 +3,25 @@
     align-items: center;
     background: $color-primary;
     border: 0;
-    border-radius: 1.95em;
+    border-radius: 1.75em;
     box-shadow: none;
     box-sizing: border-box;
     color: #fff;
     cursor: pointer;
     display: -ms-inline-flexbox;
     display: inline-flex;
-    font-size: 1em;
+    font-size: 0.875em;
     font-weight: bold;
     -ms-flex-pack: center;
     justify-content: center;
     letter-spacing: 0.035em;
-    line-height: 1.6;
+    line-height: 1.2;
     opacity: 1;
-    padding: 1.2em 2.14285em;
+    padding: 0.9em 2.14285em;
     text-decoration: none;
     -webkit-transition: 0.3s ease;
     transition: 0.3s ease;
     vertical-align: middle;
-    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3),
-        0 0 40px rgba(0, 0, 0, 0.1) inset;
-    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3),
-        0 0 40px rgba(0, 0, 0, 0.1) inset;
-    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3),
-        0 0 40px rgba(0, 0, 0, 0.1) inset;
 
     &:hover,
     &:focus,
@@ -40,13 +34,13 @@
 
 .button-secondary {
     background: 0 !important;
-    box-shadow: inset 0 0 0 3px currentColor;
+    box-shadow: inset 0 0 0 2px currentColor;
     color: $color-primary;
 
     &:hover,
     &:focus,
     &:active {
-        box-shadow: inset 0 0 0 4px currentColor;
+        box-shadow: inset 0 0 0 3px currentColor;
         color: $color-primary;
         opacity: 1;
     }
@@ -55,8 +49,8 @@
 .button-icon {
     background: 0 !important;
     border: 0;
-    color: black;
-    font-size: 1.2em;
+    color: inherit;
+    font-size: 1em;
     font-weight: normal;
     letter-spacing: normal;
     padding: 0.25em;
@@ -92,4 +86,4 @@
     &:active {
         outline: 0;
     }
-}
\ No newline at end of file
+}
diff --git a/src/sass/imports/_footer.scss b/src/sass/imports/_footer.scss
index 6f4ab15edd..b8b176f135 100644
--- a/src/sass/imports/_footer.scss
+++ b/src/sass/imports/_footer.scss
@@ -1,94 +1,89 @@
 .site-footer {
-  background-color: black;
-  background-image: url('https://i.imgur.com/CEYEZp8.jpeg');
-  padding-bottom: 7.5em;
-  padding-top: 8.5em;
-  color: white !important;
-  border: 4px solid black;
+    background-color: #fff;
+    padding-bottom: 1.5em;
+    padding-top: 1.5em;
 }
 
 #colophon {
-  a:not(.button) {
-    color: inherit;
+    a:not(.button) {
+        color: inherit;
 
-    &:hover,
-    &:focus {
-      color: $color-primary;
-    }
+        &:hover,
+        &:focus {
+            color: $color-primary;
+        }
     }
 }
 
 .site-info,
 .social-links {
-  -ms-flex-align: center;
-  align-items: center;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  -ms-flex-pack: center;
-  justify-content: center;
-  font-size: 0.675em;
-  line-height: 1.2;
-
-  .button:not(.button-icon) {
-    font-size: inherit;
+    -ms-flex-align: center;
+    align-items: center;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+    flex-wrap: wrap;
+    -ms-flex-pack: center;
+    justify-content: center;
+    font-size: 0.875em;
     line-height: 1.2;
-    padding: 0.3em 1em;
-  }
+
+    .button:not(.button-icon) {
+        font-size: inherit;
+        line-height: 1.2;
+        padding: 0.3em 1em;
+    }
 }
 
 .site-info {
-  margin: 0.25em 0 0;
-  text-align: center;
+    margin: 0.25em 0 0;
+    text-align: center;
 
-  .copyright,
-  >a {
-    margin: 0 4px 0.2em 0;
-  }
+    .copyright,
+    > a {
+        margin: 0 8px 0.5em 0;
+    }
 }
 
 .social-links {
-  margin-top: 0.5375em;
+    margin-top: 0.9375em;
 
-  a {
-    margin: 0 50px 0.2em;
-  }
+    a {
+        margin: 0 10px 0.5em;
+    }
 
-  .icon {
-    font-size: 20px;
-    color: rgb(0, 0, 0);
-    background-color: rgb(0, 0, 0);
-  }
+    .icon {
+        font-size: 20px;
+    }
 }
 
 @media only screen and (min-width: 641px) {
-  .site-footer-inside {
-    -ms-flex-align: start;
-    align-items: flex-start;
-    display: -ms-flexbox;
-    display: flex;
-  }
+    .site-footer-inside {
+        -ms-flex-align: start;
+        align-items: flex-start;
+        display: -ms-flexbox;
+        display: flex;
+    }
 
-  .site-info {
-    -ms-flex-pack: start;
-    justify-content: flex-start;
-    text-align: left;
-  }
+    .site-info {
+        -ms-flex-pack: start;
+        justify-content: flex-start;
+        text-align: left;
+    }
 
-  .social-links {
-    -ms-flex: 0 0 auto;
-    flex: 0 0 auto;
-    -ms-flex-wrap: nowrap;
-    flex-wrap: nowrap;
-    -ms-flex-pack: start;
-    justify-content: flex-start;
-    margin-left: auto;
-    margin-top: 0;
+    .social-links {
+        -ms-flex: 0 0 auto;
+        flex: 0 0 auto;
+        -ms-flex-wrap: nowrap;
+        flex-wrap: nowrap;
+        -ms-flex-pack: start;
+        justify-content: flex-start;
+        margin-left: auto;
+        margin-top: 0;
 
-    a {
-      margin-left: 20px;
-      margin-right: 0;
-    }
+        a {
+            margin-left: 20px;
+            margin-right: 0;
+        }
     }
 }
diff --git a/src/sass/imports/_forms.scss b/src/sass/imports/_forms.scss
index d03cf35dae..689f68c032 100644
--- a/src/sass/imports/_forms.scss
+++ b/src/sass/imports/_forms.scss
@@ -1,16 +1,16 @@
 label {
-  color: $gray-700;
-  font-weight: bold;
-  line-height: 1.5;
-  margin-bottom: 0.25em;
+    color: $gray-700;
+    font-weight: bold;
+    line-height: 1.5;
+    margin-bottom: 0.25em;
 
-  input[type='checkbox']+&,
-  input[type='radio']+& {
-    font-weight: normal;
-    cursor: pointer;
-    padding-left: 0.25em;
-    padding-right: 1em;
-  }
+    input[type='checkbox'] + &,
+    input[type='radio'] + & {
+        font-weight: normal;
+        cursor: pointer;
+        padding-left: 0.25em;
+        padding-right: 1em;
+    }
 }
 
 input[type='text'],
@@ -22,34 +22,34 @@ input[type='search'],
 input[type='url'],
 select,
 textarea {
-  background: #fff;
-  border: 1px solid $gray-300;
-  border-radius: $border-radius-sm;
-  box-shadow: none;
-  box-sizing: border-box;
-  color: $gray-700;
-  display: block;
-  font-size: 1em;
-  font-weight: normal;
-  line-height: 1.5;
-  max-width: 100%;
-  padding: 0.5em;
-  width: 100%;
+    background: #fff;
+    border: 1px solid $gray-300;
+    border-radius: $border-radius-sm;
+    box-shadow: none;
+    box-sizing: border-box;
+    color: $gray-700;
+    display: block;
+    font-size: 1em;
+    font-weight: normal;
+    line-height: 1.5;
+    max-width: 100%;
+    padding: 0.5em;
+    width: 100%;
 
-  &:focus {
-    outline: 0;
-  }
+    &:focus {
+        outline: 0;
+    }
 }
 
 ::placeholder {
-  color: $gray-400;
-  opacity: 1;
+    color: $gray-400;
+    opacity: 1;
 }
 
 .form-row {
-  margin-bottom: 1em;
+    margin-bottom: 1em;
 }
 
 .form-submit {
-  margin-top: 1.66667em;
+    margin-top: 1.66667em;
 }
diff --git a/src/sass/imports/_general.scss b/src/sass/imports/_general.scss
index eb5c9cb173..848e785864 100644
--- a/src/sass/imports/_general.scss
+++ b/src/sass/imports/_general.scss
@@ -1,7 +1,6 @@
 html {
     font-family: $font-primary;
     font-size: 100%;
-    scroll-behavior: smooth;
 }
 
 body {
@@ -179,23 +178,14 @@ embed,
 iframe,
 object,
 video {
-    max-width: 100%;
-}
-div.wrapper:hover img:not(:hover) {
-Filter: brightness(50%);
+    max-width: 1400px !important;
 }
+
 img {
     height: auto;
     max-width: 100%;
-    scroll-snap-align: center;
-}
-img:hover {
-Filter: brightness(110%);
-}
-figure {
-  overflow: auto;
-  scroll-snap-type: inline mandatory;
 }
+
 @media only screen and (min-width: 641px) {
     blockquote {
         font-size: 1.5em;
diff --git a/src/sass/imports/_header.scss b/src/sass/imports/_header.scss
index e772301a79..5c91cb2d66 100644
--- a/src/sass/imports/_header.scss
+++ b/src/sass/imports/_header.scss
@@ -1,371 +1,369 @@
 .site-header {
-  background: black;
-  background-image: url('https://i.imgur.com/CEYEZp8.jpeg');
-  padding-bottom: 0.4em;
-  padding-top: 0.2em;
+    background: #fff;
+    padding-bottom: 1.25em;
+    padding-top: 1.125em;
 }
 
 .site-header-inside {
-  -ms-flex-align: center;
-  align-items: center;
-  display: -ms-flexbox;
-  display: flex;
+    -ms-flex-align: center;
+    align-items: center;
+    display: -ms-flexbox;
+    display: flex;
 }
 
 .site-branding {
-  -ms-flex: 0 1 auto;
-  flex: 0 1 auto;
+    -ms-flex: 0 1 auto;
+    flex: 0 1 auto;
 }
 
 .site-title {
-  color: $gray-700;
-  font-size: 1.5em;
-  font-weight: bold;
-  line-height: 1.2;
-  margin: 0;
+    color: $gray-700;
+    font-size: 1.5em;
+    font-weight: bold;
+    line-height: 1.2;
+    margin: 0;
 }
 
 .site-logo {
-  margin: 0;
+    margin: 0;
 
-  img {
-    max-height: 65px;
-  }
+    img {
+        max-height: 36px;
+    }
 }
 
 .menu,
 .submenu {
-  list-style: none;
-  margin: 0;
-  padding: 0;
+    list-style: none;
+    margin: 0;
+    padding: 0;
 }
 
 .menu-item {
-  position: relative;
+    position: relative;
 
-  &.current {
-    color: $color-primary;
-  }
+    &.current {
+        color: $color-primary;
+    }
 
-  a {
-    &:not(.button) {
-      display: inline-block;
-      font-size: 1.1em;
-      line-height: 1.5;
+    a {
+        &:not(.button) {
+            display: inline-block;
+            font-size: 0.9375em;
+            line-height: 1.5;
+        }
     }
-  }
 }
 
 #masthead {
-  a {
-    &:not(.button) {
-      color: inherit;
-      display: inline-block;
-      text-decoration: none;
-
-      &:hover {
-        color: $color-primary;
-      }
-      }
-      }
-
-  .site-branding {
     a {
-      &:hover {
-        color: inherit;
-      }
+        &:not(.button) {
+            color: inherit;
+            display: inline-block;
+            text-decoration: none;
+
+            &:hover {
+                color: $color-primary;
+            }
+        }
+    }
+
+    .site-branding {
+        a {
+            &:hover {
+                color: inherit;
+            }
+        }
     }
-  }
 }
 
 @media only screen and (min-width: 801px) {
-  #menu-open,
-  #menu-close {
-    display: none;
-  }
-
-  .site-navigation {
-    margin-left: auto;
-  }
-
-  .menu {
-    -ms-flex-align: center;
-    align-items: center;
-    display: -ms-flexbox;
-    display: flex;
-  }
-
-  .menu-item {
-    display: inline-block;
-    margin: 0 0 0 1.25em;
-    padding-bottom: 0.1875em;
-    padding-top: 0.1875em;
+    #menu-open,
+    #menu-close {
+        display: none;
+    }
 
-    a {
-      padding-bottom: 0.5em;
-      padding-top: 0.5em;
-
-      &.button:not(.button-icon) {
-        padding-left: 1.25em;
-        padding-right: 1.25em;
-      }
-      }
-
-    &.has-children>a {
-      padding-right: 18px;
-      position: relative;
-
-      &:after {
-        background: 0;
-        border-color: currentColor;
-        border-style: solid;
-        border-width: 1px 1px 0 0;
-        box-sizing: border-box;
-        content: '';
-        height: 6px;
-        position: absolute;
-        right: 0;
-        top: 50%;
-        width: 6px;
-        -webkit-transform: translateY(-50%) rotate(135deg);
-        transform: translateY(-50%) rotate(135deg);
-      }
+    .site-navigation {
+        margin-left: auto;
+    }
 
-      &.button:not(.button-icon) {
-        padding-right: 2.25em;
+    .menu {
+        -ms-flex-align: center;
+        align-items: center;
+        display: -ms-flexbox;
+        display: flex;
+    }
 
-        &:after {
-          right: 1.25em;
+    .menu-item {
+        display: inline-block;
+        margin: 0 0 0 1.25em;
+        padding-bottom: 0.1875em;
+        padding-top: 0.1875em;
+
+        a {
+            padding-bottom: 0.5em;
+            padding-top: 0.5em;
+
+            &.button:not(.button-icon) {
+                padding-left: 1.25em;
+                padding-right: 1.25em;
+            }
         }
+
+        &.has-children > a {
+            padding-right: 15px;
+            position: relative;
+
+            &:after {
+                background: 0;
+                border-color: currentColor;
+                border-style: solid;
+                border-width: 1px 1px 0 0;
+                box-sizing: border-box;
+                content: '';
+                height: 6px;
+                position: absolute;
+                right: 0;
+                top: 50%;
+                width: 6px;
+                -webkit-transform: translateY(-50%) rotate(135deg);
+                transform: translateY(-50%) rotate(135deg);
+            }
+
+            &.button:not(.button-icon) {
+                padding-right: 2.25em;
+
+                &:after {
+                    right: 1.25em;
+                }
+            }
         }
+
+        .submenu-toggle {
+            display: none;
         }
 
-    .submenu-toggle {
-      display: none;
+        &.has-children:hover > .submenu {
+            opacity: 1;
+            -webkit-transition: margin 0.3s, opacity 0.2s;
+            transition: margin 0.3s, opacity 0.2s;
+            visibility: visible;
+        }
     }
 
-    &.has-children:hover>.submenu {
-      opacity: 1;
-      -webkit-transition: margin 0.3s, opacity 0.2s;
-      transition: margin 0.3s, opacity 0.2s;
-      visibility: visible;
-    }
-    }
+    .submenu {
+        background: #fff;
+        border: 1px solid $gray-300;
+        border-radius: $border-radius-sm;
+        box-shadow: $box-shadow;
+        left: 0;
+        min-width: 180px;
+        opacity: 0;
+        padding: 0.5em 0;
+        position: absolute;
+        text-align: left;
+        top: 100%;
+        -webkit-transition: opacity 0.2s, visibility 0s 0.2s;
+        transition: opacity 0.2s, visibility 0s 0.2s;
+        visibility: hidden;
+        width: 100%;
+        z-index: 99;
+
+        .menu-item {
+            display: block;
+            margin: 0;
+            padding: 0 1em;
+        }
 
-  .submenu {
-    background: #fff;
-    border: 4px solid $gray-300;
-    border-radius: $border-radius-sm;
-    box-shadow: $box-shadow;
-    left: 0;
-    min-width: 180px;
-    opacity: 0;
-    padding: 0.5em 0;
-    position: absolute;
-    text-align: left;
-    top: 100%;
-    -webkit-transition: opacity 0.2s, visibility 0s 0.2s;
-    transition: opacity 0.2s, visibility 0s 0.2s;
-    visibility: hidden;
-    width: 100%;
-    z-index: 99;
+        a {
+            &:not(.button-icon) {
+                display: block;
+            }
 
-    .menu-item {
-      display: block;
-      margin: 0;
-      padding: 0 1em;
+            &.button:not(.button-icon) {
+                margin: 0.5em 0;
+            }
+        }
     }
-
-    a {
-      &:not(.button-icon) {
-        display: block;
-      }
-
-      &.button:not(.button-icon) {
-        margin: 0.5em 0;
-      }
-      }
-      }
 }
 
 @media only screen and (max-width: 800px) {
-  .site {
-    overflow: hidden;
-    position: relative;
-  }
-
-  .site-branding {
-    margin-right: 0.625em;
-  }
-
-  .site-header {
-    &:after {
-      background: rgba($gray-600, 0.6);
-      content: '';
-      height: 100vh;
-      left: 0;
-      opacity: 0;
-      position: absolute;
-      top: 0;
-      -webkit-transition: opacity 0.15s ease-in-out, visibility 0s ease-in-out 0.15s;
-      transition: opacity 0.15s ease-in-out, visibility 0s ease-in-out 0.15s;
-      visibility: hidden;
-      width: 100%;
-      z-index: 998;
+    .site {
+        overflow: hidden;
+        position: relative;
     }
-  }
 
-  .site-navigation {
-    background: #fff;
-    box-sizing: border-box;
-    height: 100vh;
-    margin: 0;
-    max-width: 360px;
-    -webkit-overflow-scrolling: touch;
-    position: absolute;
-    right: -100%;
-    top: 0;
-    -webkit-transition: right 0.3s ease-in-out, visibility 0s 0.3s ease-in-out;
-    transition: right 0.3s ease-in-out, visibility 0s 0.3s ease-in-out;
-    visibility: hidden;
-    width: 100%;
-    z-index: 999;
-  }
-
-  .site-nav-inside {
-    height: 100%;
-    overflow: auto;
-    -webkit-overflow-scrolling: touch;
-    position: relative;
-  }
+    .site-branding {
+        margin-right: 0.625em;
+    }
 
-  .menu--opened {
-    .site {
-      height: 100%;
-      left: 0;
-      overflow: hidden;
-      position: fixed;
-      top: 0;
-      -webkit-transform: translate3d(0, 0, 0);
-      transform: translate3d(0, 0, 0);
-      width: 100%;
-      z-index: 997;
+    .site-header {
+        &:after {
+            background: rgba($gray-600, 0.6);
+            content: '';
+            height: 100vh;
+            left: 0;
+            opacity: 0;
+            position: absolute;
+            top: 0;
+            -webkit-transition: opacity 0.15s ease-in-out, visibility 0s ease-in-out 0.15s;
+            transition: opacity 0.15s ease-in-out, visibility 0s ease-in-out 0.15s;
+            visibility: hidden;
+            width: 100%;
+            z-index: 998;
+        }
     }
 
     .site-navigation {
-      right: 0;
-      -webkit-transition: right 0.3s ease-in-out;
-      transition: right 0.3s ease-in-out;
-      visibility: visible;
+        background: #fff;
+        box-sizing: border-box;
+        height: 100vh;
+        margin: 0;
+        max-width: 360px;
+        -webkit-overflow-scrolling: touch;
+        position: absolute;
+        right: -100%;
+        top: 0;
+        -webkit-transition: right 0.3s ease-in-out, visibility 0s 0.3s ease-in-out;
+        transition: right 0.3s ease-in-out, visibility 0s 0.3s ease-in-out;
+        visibility: hidden;
+        width: 100%;
+        z-index: 999;
     }
 
-    .site-header {
-      &:after {
-        opacity: 1;
-        -webkit-transition-delay: 0s;
-        transition-delay: 0s;
-        visibility: visible;
-      }
-    }
+    .site-nav-inside {
+        height: 100%;
+        overflow: auto;
+        -webkit-overflow-scrolling: touch;
+        position: relative;
     }
 
-  .menu {
-    padding: calc(3vw + 2.8125em) $container-padding 3em;
-  }
+    .menu--opened {
+        .site {
+            height: 100%;
+            left: 0;
+            overflow: hidden;
+            position: fixed;
+            top: 0;
+            -webkit-transform: translate3d(0, 0, 0);
+            transform: translate3d(0, 0, 0);
+            width: 100%;
+            z-index: 997;
+        }
 
-  .submenu {
-    border-top: 1px solid $gray-300;
-    display: none;
-    padding-left: 1em;
-  }
+        .site-navigation {
+            right: 0;
+            -webkit-transition: right 0.3s ease-in-out;
+            transition: right 0.3s ease-in-out;
+            visibility: visible;
+        }
 
-  .menu-item {
-    display: block;
-    margin: 0;
+        .site-header {
+            &:after {
+                opacity: 1;
+                -webkit-transition-delay: 0s;
+                transition-delay: 0s;
+                visibility: visible;
+            }
+        }
+    }
 
-    &:not(.menu-button) {
-      border-bottom: 1px solid $gray-300;
+    .menu {
+        padding: calc(3vw + 2.8125em) $container-padding 3em;
+    }
 
-      &:first-child {
+    .submenu {
         border-top: 1px solid $gray-300;
-      }
-      }
+        display: none;
+        padding-left: 1em;
+    }
 
-    a {
+    .menu-item {
+        display: block;
+        margin: 0;
 
-      &:not(.button),
-      &.button-icon {
-        padding: 0.75em 0;
-      }
+        &:not(.menu-button) {
+            border-bottom: 1px solid $gray-300;
 
-      &:not(.button) {
-        display: block;
-      }
+            &:first-child {
+                border-top: 1px solid $gray-300;
+            }
+        }
 
-      &.button {
-        &:not(.button-icon) {
-          width: 100%;
+        a {
+            &:not(.button),
+            &.button-icon {
+                padding: 0.75em 0;
+            }
+
+            &:not(.button) {
+                display: block;
+            }
+
+            &.button {
+                &:not(.button-icon) {
+                    width: 100%;
+                }
+            }
         }
-      }
-      }
 
-    &.has-children>a {
-      margin-right: 2em;
-    }
+        &.has-children > a {
+            margin-right: 2em;
+        }
 
-    .menu-item {
-      &:first-child {
-        border-top: 0;
-      }
-
-      &:last-child {
-        border-bottom: 0;
-      }
-      }
-
-    .submenu-toggle {
-      color: $gray-500;
-      height: 2.8125em;
-      position: absolute;
-      right: 0;
-      top: 0;
-    }
+        .menu-item {
+            &:first-child {
+                border-top: 0;
+            }
 
-    &.active {
-      .submenu-toggle {
-        .icon-angle-right {
-          -webkit-transform: rotate(135deg);
-          transform: rotate(135deg);
+            &:last-child {
+                border-bottom: 0;
+            }
         }
-      }
 
-      .submenu {
-        display: block;
-      }
-      }
-      }
-
-  .menu-button {
-    &>.button:not(.button-icon) {
-      margin-bottom: 1.25em;
-      margin-top: 1.25em;
-    }
+        .submenu-toggle {
+            color: $gray-500;
+            height: 2.8125em;
+            position: absolute;
+            right: 0;
+            top: 0;
+        }
 
-    &+.menu-button {
-      &>.button:not(.button-icon) {
-        margin-top: 0;
-      }
+        &.active {
+            .submenu-toggle {
+                .icon-angle-right {
+                    -webkit-transform: rotate(135deg);
+                    transform: rotate(135deg);
+                }
+            }
+
+            .submenu {
+                display: block;
+            }
+        }
     }
+
+    .menu-button {
+        & > .button:not(.button-icon) {
+            margin-bottom: 1.25em;
+            margin-top: 1.25em;
+        }
+
+        & + .menu-button {
+            & > .button:not(.button-icon) {
+                margin-top: 0;
+            }
+        }
     }
 
-  #menu-open {
-    margin-left: auto;
-  }
+    #menu-open {
+        margin-left: auto;
+    }
 
-  #menu-close {
-    display: block;
-    position: absolute;
-    right: $container-padding;
-    top: $container-padding;
-  }
+    #menu-close {
+        display: block;
+        position: absolute;
+        right: $container-padding;
+        top: $container-padding;
+    }
 }
diff --git a/src/sass/imports/_helpers.scss b/src/sass/imports/_helpers.scss
index 2d07226953..d3b885c696 100644
--- a/src/sass/imports/_helpers.scss
+++ b/src/sass/imports/_helpers.scss
@@ -114,7 +114,7 @@
     background-size: cover;
     bottom: 0;
     left: 0;
-    opacity: 0.2;
+    opacity: 0.6;
     position: absolute;
     right: 0;
     top: 0;
diff --git a/src/sass/imports/_icons.scss b/src/sass/imports/_icons.scss
index 4e36651076..63a5df66ca 100644
--- a/src/sass/imports/_icons.scss
+++ b/src/sass/imports/_icons.scss
@@ -1,101 +1,101 @@
 // SVG icons
 .icon {
-  color: inherit;
-  fill: white;
-  flex-shrink: 0;
-  height: 1em;
-  line-height: 1;
-  width: 1em;
+    color: inherit;
+    fill: currentColor;
+    flex-shrink: 0;
+    height: 1em;
+    line-height: 1;
+    width: 1em;
 }
 
 // CSS icons
 .icon-menu,
 .icon-close {
-  background: white;
-  border-radius: 1px;
-  color: inherit;
-  height: 2px;
-  left: 50%;
-  margin-top: -1px;
-  margin-left: -12px;
-  position: absolute;
-  top: 50%;
-  width: 24px;
-
-  &:before,
-  &:after {
-    background: white;
+    background: currentColor;
     border-radius: 1px;
-    content: '';
-    height: 100%;
-    left: 0;
+    color: inherit;
+    height: 2px;
+    left: 50%;
+    margin-top: -1px;
+    margin-left: -12px;
     position: absolute;
-    width: 100%;
-  }
+    top: 50%;
+    width: 24px;
+
+    &:before,
+    &:after {
+        background: currentColor;
+        border-radius: 1px;
+        content: '';
+        height: 100%;
+        left: 0;
+        position: absolute;
+        width: 100%;
+    }
 }
 
 .icon-menu {
-  &:before {
-    top: -6px;
-  }
+    &:before {
+        top: -6px;
+    }
 
-  &:after {
-    bottom: -6px;
-  }
+    &:after {
+        bottom: -6px;
+    }
 }
 
 .icon-close {
-  background: 0;
-  margin-left: -14px;
-  width: 28px;
+    background: 0;
+    margin-left: -14px;
+    width: 28px;
 
-  &:before {
-    top: 0;
-    -webkit-transform: rotate(45deg);
-    transform: rotate(45deg);
-  }
+    &:before {
+        top: 0;
+        -webkit-transform: rotate(45deg);
+        transform: rotate(45deg);
+    }
 
-  &:after {
-    top: 0;
-    -webkit-transform: rotate(-45deg);
-    transform: rotate(-45deg);
-  }
+    &:after {
+        top: 0;
+        -webkit-transform: rotate(-45deg);
+        transform: rotate(-45deg);
+    }
 }
 
 .icon-angle-right {
-  background: 0;
-  border-color: rgb(0, 0, 0);
-  border-style: dashed;
-  border-width: 2px 1px 0 0;
-  box-sizing: border-box;
-  height: 6px;
-  left: 70%;
-  margin-left: -2px;
-  margin-top: -2px;
-  position: absolute;
-  top: 50%;
-  width: 6px;
-  -webkit-transform: rotate(45deg);
-  transform: rotate(45deg);
+    background: 0;
+    border-color: currentColor;
+    border-style: solid;
+    border-width: 1px 1px 0 0;
+    box-sizing: border-box;
+    height: 8px;
+    left: 50%;
+    margin-left: -4px;
+    margin-top: -4px;
+    position: absolute;
+    top: 50%;
+    width: 8px;
+    -webkit-transform: rotate(45deg);
+    transform: rotate(45deg);
 }
 
 .docs-nav-toggle {
-  .icon-angle-right {
-    height: 12px;
-    left: auto;
-    margin-left: 0;
-    margin-right: 9px;
-    margin-top: -6px;
-    right: 0;
-    width: 12px;
-  }
+    .icon-angle-right {
+        height: 12px;
+        left: auto;
+        margin-left: 0;
+        margin-right: 9px;
+        margin-top: -6px;
+        right: 0;
+        width: 12px;
+    }
 }
 
 .docs-section-item {
-  .icon-angle-right {
-    left: auto;
-    margin-left: 0;
-    margin-right: 15px;
-    right: 0;
-  }
+    .icon-angle-right {
+        left: auto;
+        margin-left: 0;
+        margin-right: 15px;
+        right: 0;
+    }
 }
diff --git a/src/sass/imports/_palettes.scss b/src/sass/imports/_palettes.scss
index 4571d18d0a..ac2cc9874b 100644
--- a/src/sass/imports/_palettes.scss
+++ b/src/sass/imports/_palettes.scss
@@ -1,57 +1,57 @@
 @each $palette in map-keys($theme-palettes) {
-  $palette-suffix: '#{$palette}';
-  $color-primary: map-deep-get($theme-palettes, $palette, 'primary');
-  $color-secondary: map-deep-get($theme-palettes, $palette, 'secondary');
+    $palette-suffix: '#{$palette}';
+    $color-primary: map-deep-get($theme-palettes, $palette, 'primary');
+    $color-secondary: map-deep-get($theme-palettes, $palette, 'secondary');
 
-  .palette-#{$palette-suffix} {
-    a:not(.button) {
-      color: $color-primary;
+    .palette-#{$palette-suffix} {
+        a:not(.button) {
+            color: $color-primary;
 
-      &:hover {
-        color: $gray-600;
-      }
-      }
+            &:hover {
+                color: $gray-600;
+            }
+        }
 
-    blockquote {
-      border-color: $color-primary;
-    }
+        blockquote {
+            border-color: $color-primary;
+        }
 
-    .line-left:after,
-    .button {
-      background: $color-primary;
-    }
+        .line-left:after,
+        .button {
+            background: $color-primary;
+        }
 
-    .has-gradient {
-      background: $color-primary;
-      background: -webkit-gradient(linear, left top, right top, from($color-secondary), to($color-primary));
-      background: linear-gradient(to right, $color-secondary, $color-primary);
-    }
+        .has-gradient {
+            background: $color-primary;
+            background: -webkit-gradient(linear, left top, right top, from($color-secondary), to($color-primary));
+            background: linear-gradient(to right, $color-secondary, $color-primary);
+        }
 
-    .button-secondary,
-    .button-icon:hover,
-    .button-icon:focus,
-    .button-icon:active,
-    .has-gradient .button:not(.button-secondary),
-    .menu-item.current,
-    #masthead a:not(.button):hover,
-    #colophon a:not(.button):hover,
-    .post.type-docs .hash-link:hover,
-    .post.type-docs .hash-link:focus,
-    #docs-menu a:hover,
-    #docs-menu .current,
-    #docs-menu .current-parent,
-    #page-nav li.active>a,
-    #page-nav a:hover {
-      color: $color-primary;
-    }
+        .button-secondary,
+        .button-icon:hover,
+        .button-icon:focus,
+        .button-icon:active,
+        .has-gradient .button:not(.button-secondary),
+        .menu-item.current,
+        #masthead a:not(.button):hover,
+        #colophon a:not(.button):hover,
+        .post.type-docs .hash-link:hover,
+        .post.type-docs .hash-link:focus,
+        #docs-menu a:hover,
+        #docs-menu .current,
+        #docs-menu .current-parent,
+        #page-nav li.active > a,
+        #page-nav a:hover {
+            color: $color-primary;
+        }
 
-    #docs-section-items {
-      .docs-item-link {
-        &:hover {
-          border-color: $color-primary;
-          color: $color-primary;
+        #docs-section-items {
+            .docs-item-link {
+                &:hover {
+                    border-color: $color-primary;
+                    color: $color-primary;
+                }
+            }
         }
-      }
-    }
     }
 }
diff --git a/src/sass/imports/_prism.scss b/src/sass/imports/_prism.scss
index 796b0f3c06..ca8230b323 100644
--- a/src/sass/imports/_prism.scss
+++ b/src/sass/imports/_prism.scss
@@ -8,33 +8,33 @@ https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javasc
 
 code[class*='language-'],
 pre[class*='language-'] {
-  -moz-tab-size: 4;
-  -o-tab-size: 4;
-  tab-size: 4;
-  -webkit-hyphens: none;
-  -moz-hyphens: none;
-  -ms-hyphens: none;
-  hyphens: none;
+    -moz-tab-size: 4;
+    -o-tab-size: 4;
+    tab-size: 4;
+    -webkit-hyphens: none;
+    -moz-hyphens: none;
+    -ms-hyphens: none;
+    hyphens: none;
 }
 
-:not(pre)>code[class*='language-'] {
-  background: $gray-700;
-  color: $gray-100;
+:not(pre) > code[class*='language-'] {
+    background: $gray-700;
+    color: $gray-100;
 }
 
 .token.comment,
 .token.prolog,
 .token.doctype,
 .token.cdata {
-  color: #8292a2;
+    color: #8292a2;
 }
 
 .token.punctuation {
-  color: #f8f8f2;
+    color: #f8f8f2;
 }
 
 .token.namespace {
-  opacity: 0.7;
+    opacity: 0.7;
 }
 
 .token.property,
@@ -42,12 +42,12 @@ pre[class*='language-'] {
 .token.constant,
 .token.symbol,
 .token.deleted {
-  color: #f92672;
+    color: #f92672;
 }
 
 .token.boolean,
 .token.number {
-  color: #ae81ff;
+    color: #ae81ff;
 }
 
 .token.selector,
@@ -56,7 +56,7 @@ pre[class*='language-'] {
 .token.char,
 .token.builtin,
 .token.inserted {
-  color: #a6e22e;
+    color: #a6e22e;
 }
 
 .token.operator,
@@ -65,80 +65,79 @@ pre[class*='language-'] {
 .language-css .token.string,
 .style .token.string,
 .token.variable {
-  color: #f8f8f2;
+    color: #f8f8f2;
 }
 
 .token.atrule,
 .token.attr-value,
 .token.function,
 .token.class-name {
-  color: #e6db74;
+    color: #e6db74;
 }
 
 .token.keyword {
-  color: #66d9ef;
+    color: #66d9ef;
 }
 
 .token.regex,
 .token.important {
-  color: #fd971f;
+    color: #fd971f;
 }
 
 .token.important,
 .token.bold {
-  font-weight: bold;
+    font-weight: bold;
 }
 .token.italic {
-  font-style: italic;
+    font-style: italic;
 }
 
 .token.entity {
-  cursor: help;
+    cursor: help;
 }
 
 div.code-toolbar {
-  position: relative;
-}
-
-div.code-toolbar>.toolbar {
-  position: absolute;
-  top: 0;
-  right: 0;
-}
-
-div.code-toolbar>.toolbar .toolbar-item {
-  display: block;
-}
-
-div.code-toolbar>.toolbar a {
-  border: 0;
-  cursor: pointer;
-}
-
-div.code-toolbar>.toolbar button {
-  background: none;
-  border: 0;
-  border-radius: 0;
-  box-shadow: none;
-  color: inherit;
-  font: inherit;
-  line-height: normal;
-  overflow: visible;
-  padding: 0;
-  user-select: none;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-}
-
-div.code-toolbar>.toolbar a,
-div.code-toolbar>.toolbar button,
-div.code-toolbar>.toolbar span {
-  background: $gray-600;
-  color: $gray-300 !important;
-  display: block;
-  font-size: 0.75em;
-  line-height: 1.5;
-  padding: 0.25em 0.5em;
-  text-decoration: none;
+    position: relative;
+}
+
+div.code-toolbar > .toolbar {
+    position: absolute;
+    top: 0;
+    right: 0;
+}
+
+div.code-toolbar > .toolbar .toolbar-item {
+    display: block;
+}
+
+div.code-toolbar > .toolbar a {
+    border: 0;
+    cursor: pointer;
+}
+
+div.code-toolbar > .toolbar button {
+    background: none;
+    border: 0;
+    border-radius: 0;
+    box-shadow: none;
+    color: inherit;
+    font: inherit;
+    line-height: normal;
+    overflow: visible;
+    padding: 0;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+}
+
+div.code-toolbar > .toolbar a,
+div.code-toolbar > .toolbar button,
+div.code-toolbar > .toolbar span {
+    background: $gray-600;
+    color: $gray-300 !important;
+    display: block;
+    font-size: 0.75em;
+    line-height: 1.5;
+    padding: 0.25em 0.5em;
+    text-decoration: none;
 }
diff --git a/src/sass/imports/_sections.scss b/src/sass/imports/_sections.scss
index df29491815..a6a0cc1ad0 100644
--- a/src/sass/imports/_sections.scss
+++ b/src/sass/imports/_sections.scss
@@ -1,337 +1,337 @@
 .block {
-  padding-top: 3.75em;
+    padding-top: 3.75em;
 
-  &:not(.block-hero) {
-    background: $gray-100;
-  }
+    &:not(.block-hero) {
+        background: $gray-100;
+    }
 
-  &:last-child {
-    padding-bottom: 3.75em;
-  }
+    &:last-child {
+        padding-bottom: 3.75em;
+    }
 }
 
 .block-image {
-  margin-bottom: 1.5em;
+    margin-bottom: 1.5em;
 }
 
 .block-header {
-  margin-bottom: 1.5em;
+    margin-bottom: 1.5em;
 }
 
 .block-title {
-  margin: 0;
+    margin: 0;
 }
 
 .block-subtitle {
-  color: $gray-500;
-  line-height: 1.5;
-  margin-bottom: 0;
+    color: $gray-500;
+    line-height: 1.5;
+    margin-bottom: 0;
 
-  &:not(:first-child) {
-    margin-top: 0.5em;
-  }
+    &:not(:first-child) {
+        margin-top: 0.5em;
+    }
 }
 
 .block-buttons,
 .grid-item-buttons {
-  -ms-flex-align: center;
-  align-items: center;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-  flex-wrap: wrap;
-  margin-bottom: 0.9375em;
-
-  a {
-    font-weight: bold;
-    text-decoration: none;
-  }
+    -ms-flex-align: center;
+    align-items: center;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: wrap;
+    flex-wrap: wrap;
+    margin-bottom: 0.9375em;
+
+    a {
+        font-weight: bold;
+        text-decoration: none;
+    }
 }
 
 .block-buttons {
-  -ms-flex-pack: center;
-  justify-content: center;
+    -ms-flex-pack: center;
+    justify-content: center;
 
-  a {
-    margin: 0 0.375em 0.75em;
-  }
+    a {
+        margin: 0 0.375em 0.75em;
+    }
 }
 
 .grid-item-buttons {
-  a {
-    margin: 0 0.75em 0.75em 0;
-  }
+    a {
+        margin: 0 0.75em 0.75em 0;
+    }
 }
 
 .has-gradient {
-  .block-subtitle {
-    color: inherit;
-  }
+    .block-subtitle {
+        color: inherit;
+    }
 }
 
 .block-text,
 .block-hero {
-  .block-buttons {
-    &:not(:first-child) {
-      margin-top: 1.875em;
+    .block-buttons {
+        &:not(:first-child) {
+            margin-top: 1.875em;
+        }
     }
-  }
 }
 
 // Content section
 .block-text {
-  .grid-item {
-    max-width: $container-sm;
-    text-align: center;
-  }
+    .grid-item {
+        max-width: $container-sm;
+        text-align: center;
+    }
 
-  .block-title {
-    font-size: 1.875em;
-  }
+    .block-title {
+        font-size: 1.875em;
+    }
 }
 
 @media only screen and (min-width: 641px) {
-  .block-text {
-    .block-content {
-      font-size: 1.125em;
-    }
+    .block-text {
+        .block-content {
+            font-size: 1.125em;
+        }
 
-    .block-title {
-      font-size: 2.125em;
+        .block-title {
+            font-size: 2.125em;
+        }
     }
-  }
 }
 
-@media only screen and (min-width: 1201px) {
-  .block-text {
-    .grid-item {
-      &:not(:only-child) {
-        -ms-flex: 0 0 50%;
-        flex: 0 0 50%;
-        max-width: 50%;
-      }
+@media only screen and (min-width: 801px) {
+    .block-text {
+        .grid-item {
+            &:not(:only-child) {
+                -ms-flex: 0 0 50%;
+                flex: 0 0 50%;
+                max-width: 50%;
+            }
+        }
     }
-  }
 
-  .block-body {
-    &:not(:only-child) {
-      text-align: left;
+    .block-body {
+        &:not(:only-child) {
+            text-align: left;
 
-      .block-buttons {
-        -ms-flex-pack: start;
-        justify-content: flex-start;
+            .block-buttons {
+                -ms-flex-pack: start;
+                justify-content: flex-start;
 
-        a {
-          margin-left: 0;
-          margin-right: 0.75em;
+                a {
+                    margin-left: 0;
+                    margin-right: 0.75em;
+                }
+            }
         }
-      }
     }
-  }
 }
 
 @media only screen and (min-width: 1001px) {
-  .block-image {
-    &:not(:only-child) {
-      padding-right: 2.5em;
+    .block-image {
+        &:not(:only-child) {
+            padding-right: 2.5em;
+        }
     }
-  }
 
-  .grid-swap {
-    .block-image {
-      &:not(:only-child) {
-        padding-left: 2.5em;
-        padding-right: 0.9375em;
-      }
+    .grid-swap {
+        .block-image {
+            &:not(:only-child) {
+                padding-left: 2.5em;
+                padding-right: 0.9375em;
+            }
+        }
     }
-  }
 }
 
 // CTA section
 .block-cta {
-  .has-gradient {
-    border-radius: $border-radius;
-    margin-bottom: 1.875em;
-    padding: 3.75em 3vw 1.875em;
-  }
-
-  .block-header {
-    max-width: $container-sm;
-    text-align: center;
-  }
+    .has-gradient {
+        border-radius: $border-radius;
+        margin-bottom: 1.875em;
+        padding: 2.75em 3vw 1.875em;
+    }
+
+    .block-header {
+        max-width: $container-sm;
+        text-align: center;
+    }
 
-  .block-title {
-    font-size: 1.875em;
-  }
+    .block-title {
+        font-size: 1.875em;
+    }
 
-  .block-subtitle {
-    font-size: 1.125em;
-  }
+    .block-subtitle {
+        font-size: 1.125em;
+    }
 }
 
 @media only screen and (min-width: 641px) {
-  .block-title {
-    font-size: 2.125em;
-  }
+    .block-title {
+        font-size: 2.125em;
+    }
 }
 
 @media only screen and (min-width: 801px) {
-  .block-cta {
-    .has-gradient {
-      padding-left: 7%;
-      padding-right: 7%;
-    }
+    .block-cta {
+        .has-gradient {
+            padding-left: 7%;
+            padding-right: 7%;
+        }
 
-    .block-header {
-      -ms-flex: 0 0 66.666%;
-      flex: 0 0 66.666%;
-      max-width: 66.666%;
-      text-align: left;
-    }
+        .block-header {
+            -ms-flex: 0 0 66.666%;
+            flex: 0 0 66.666%;
+            max-width: 66.666%;
+            text-align: left;
+        }
 
-    .block-buttons {
-      -ms-flex: 0 0 33.333%;
-      flex: 0 0 33.333%;
-      margin-top: 0;
-      max-width: 33.333%;
+        .block-buttons {
+            -ms-flex: 0 0 33.333%;
+            flex: 0 0 33.333%;
+            margin-top: 0;
+            max-width: 33.333%;
+        }
     }
-  }
 }
 
 // Grid section
 .block-grid {
-  .block-hero+& {
-    &:not(.has-header) {
-      background: 0;
-      padding-top: 0;
+    .block-hero + & {
+        &:not(.has-header) {
+            background: 0;
+            padding-top: 0;
+        }
     }
-  }
 
-  .block-header {
-    margin-bottom: 2em;
-    text-align: center;
-  }
+    .block-header {
+        margin-bottom: 2em;
+        text-align: center;
+    }
 
-  .block-title {
-    font-size: 1.875em;
-  }
+    .block-title {
+        font-size: 1.875em;
+    }
 
-  .grid-item {
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-direction: column;
-    flex-direction: column;
-    margin-bottom: 1.875em;
-  }
+    .grid-item {
+        display: -ms-flexbox;
+        display: flex;
+        -ms-flex-direction: column;
+        flex-direction: column;
+        margin-bottom: 1.875em;
+    }
 }
 
 .grid-item-inside {
-  background: #fff;
-  border: 1px solid $gray-300;
-  border-radius: $border-radius-sm;
-  box-shadow: $box-shadow;
-  box-sizing: border-box;
-  -ms-flex-positive: 1;
-  flex-grow: 1;
-  padding-bottom: 0.75em;
+    background: #fff;
+    border: 1px solid $gray-300;
+    border-radius: $border-radius-sm;
+    box-shadow: $box-shadow;
+    box-sizing: border-box;
+    -ms-flex-positive: 1;
+    flex-grow: 1;
+    padding-bottom: 0.75em;
 }
 
 .grid-item-image {
-  border-radius: $border-radius-sm $border-radius-sm 0 0;
-  display: block;
-  width: 100%;
-
-  img {
     border-radius: $border-radius-sm $border-radius-sm 0 0;
-  }
+    display: block;
+    width: 100%;
+
+    img {
+        border-radius: $border-radius-sm $border-radius-sm 0 0;
+    }
 }
 
 .grid-item-title {
-  font-size: 1.5em;
-  margin: 1em 0 0.5em;
-  padding-left: 1em;
-  padding-right: 1em;
-
-  &:first-child {
-    margin-top: 1.25em;
-  }
-
-  a {
-    color: inherit !important;
-    text-decoration: none;
-  }
+    font-size: 1.5em;
+    margin: 1em 0 0.5em;
+    padding-left: 1em;
+    padding-right: 1em;
+
+    &:first-child {
+        margin-top: 1.25em;
+    }
+
+    a {
+        color: inherit !important;
+        text-decoration: none;
+    }
 }
 
 .grid-item-content,
 .grid-item-buttons {
-  padding-left: 1.5em;
-  padding-right: 1.5em;
+    padding-left: 1.5em;
+    padding-right: 1.5em;
 }
 
 .grid-item-content {
-  margin-bottom: 1.25em;
+    margin-bottom: 1.25em;
 }
 
 .grid-item-buttons {
-  a {
-    &:not(.button) {
-      &:after {
-        font-size: 1.125em;
-        content: "\2192";
-        line-height: 1.5;
-        margin-left: 5px;
-      }
+    a {
+        &:not(.button) {
+            &:after {
+                font-size: 1.125em;
+                content: '\2192';
+                line-height: 1.5;
+                margin-left: 5px;
+            }
+        }
     }
-  }
 }
 
 @media only screen and (max-width: 1000px) {
-  .block-grid {
-    .grid-item {
-      margin-bottom: 4vw;
+    .block-grid {
+        .grid-item {
+            margin-bottom: 4vw;
+        }
     }
-  }
 }
 
 // Hero section
 .block-hero {
-  padding-bottom: 7.5em;
-  position: relative;
-  text-align: center;
+    padding-bottom: 7.5em;
+    position: relative;
+    text-align: center;
 
-  .block-header {
-    margin-bottom: 0.75em;
-  }
+    .block-header {
+        margin-bottom: 0.75em;
+    }
 
-  .block-title {
-    font-size: 2.25em;
-  }
+    .block-title {
+        font-size: 2.25em;
+    }
 
-  .block-content {
-    font-size: 1.125em;
-    line-height: 1.5;
-  }
+    .block-content {
+        font-size: 1.125em;
+        line-height: 1.5;
+    }
 
-  &+.block {
-    margin-top: -5em;
-    position: relative;
-  }
+    & + .block {
+        margin-top: -5em;
+        position: relative;
+    }
 }
 
 @media only screen and (min-width: 641px) {
-  .block-hero {
-    .block-title {
-      font-size: 3em;
-    }
+    .block-hero {
+        .block-title {
+            font-size: 3em;
+        }
 
-    .block-content {
-      font-size: 1.25em;
-    }
+        .block-content {
+            font-size: 1.25em;
+        }
 
-    .block-buttons {
-      a {
-        font-size: 1em;
-      }
+        .block-buttons {
+            a {
+                font-size: 1em;
+            }
+        }
     }
-  }
 }
diff --git a/src/sass/imports/_structure.scss b/src/sass/imports/_structure.scss
index c92d92ebe9..b97a2da484 100644
--- a/src/sass/imports/_structure.scss
+++ b/src/sass/imports/_structure.scss
@@ -1,38 +1,38 @@
 .site {
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  min-height: 110vh;
-  position: relative;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    min-height: 100vh;
+    position: relative;
 }
 
 .site-content {
-  box-sizing: border-box;
-  -ms-flex-positive: 1;
-  flex-grow: 1;
-  width: 100%;
+    box-sizing: border-box;
+    -ms-flex-positive: 1;
+    flex-grow: 1;
+    width: 100%;
 }
 
 .outer {
-  padding-left: $container-padding;
-  padding-right: $container-padding;
+    padding-left: $container-padding;
+    padding-right: $container-padding;
 }
 
 .inner {
-  margin-left: auto;
-  margin-right: auto;
-  max-width: $container;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: $container;
 }
 
 .inner-md {
-  margin-left: auto;
-  margin-right: auto;
-  max-width: $container-md;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: $container-md;
 }
 
 .inner-sm {
-  margin-left: auto;
-  margin-right: auto;
-  max-width: $container-sm;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: $container-sm;
 }
diff --git a/src/sass/imports/_tables.scss b/src/sass/imports/_tables.scss
index 6ee8b8ab5d..39fe6e9c5c 100644
--- a/src/sass/imports/_tables.scss
+++ b/src/sass/imports/_tables.scss
@@ -1,63 +1,63 @@
 table {
-  border-collapse: collapse;
-  border-spacing: 0;
-  line-height: 1.5;
-  margin: 0;
-  max-width: 100%;
-  text-align: left;
-  width: 100%;
+    border-collapse: collapse;
+    border-spacing: 0;
+    line-height: 1.5;
+    margin: 0;
+    max-width: 100%;
+    text-align: left;
+    width: 100%;
 }
 
 caption {
-  color: $gray-500;
-  font-size: 0.875em;
-  font-style: normal;
-  margin-bottom: 1em;
-  text-align: left;
+    color: $gray-500;
+    font-size: 0.875em;
+    font-style: normal;
+    margin-bottom: 1em;
+    text-align: left;
 }
 
 th,
 td {
-  border-bottom: 1px solid $gray-300;
-  padding: 0.5em 5px;
+    border-bottom: 1px solid $gray-300;
+    padding: 0.5em 5px;
 }
 
 th {
-  color: $gray-700;
-  font-weight: bold;
+    color: $gray-700;
+    font-weight: bold;
 }
 
-:not(.responsive-table)>table {
-  display: block;
-  margin: 1.875em 0;
-  overflow-x: auto;
-  -webkit-overflow-scrolling: touch;
+:not(.responsive-table) > table {
+    display: block;
+    margin: 1.875em 0;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
 
-  &:first-child {
-    margin-top: 0;
-  }
+    &:first-child {
+        margin-top: 0;
+    }
 
-  tbody,
-  thead {
-    width: 100%;
-  }
+    tbody,
+    thead {
+        width: 100%;
+    }
 
-  tr {
-    width: 100%;
-  }
+    tr {
+        width: 100%;
+    }
 
-  td {
-    min-width: 10em;
-  }
+    td {
+        min-width: 10em;
+    }
 }
 
 .responsive-table {
-  display: block;
-  margin: 1.875em 0;
-  overflow-x: auto;
-  width: 100%;
-
-  &:first-child {
-    margin-top: 0;
-  }
+    display: block;
+    margin: 1.875em 0;
+    overflow-x: auto;
+    width: 100%;
+
+    &:first-child {
+        margin-top: 0;
+    }
 }
diff --git a/src/sass/imports/_variables.scss b/src/sass/imports/_variables.scss
index 7aa32081f5..3219e73757 100644
--- a/src/sass/imports/_variables.scss
+++ b/src/sass/imports/_variables.scss
@@ -24,7 +24,7 @@ $border-radius: 5px;
 $border-radius-sm: 3px;
 
 // Box shadow
-$box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.13);
+$box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
 
 // Container max width
 $container: 1200px !default;
@@ -44,7 +44,7 @@ $theme-palettes: (
         secondary: #1ba65b
     ),
     navy: (
-        primary: #1b2024,
+        primary: #004e92,
         secondary: #000428
     ),
     violet: (