bookends 0.6.0 → 2.0.0

data/fixtures/dummy-jekyll/_sass/_header.scss

@@ -0,0 +1,780 @@
+// Header
+//
+// - Navigation
+// - Logo
+// - Hero
+
+#header {
+  background-color: #3B2F63;
+  background-image: -webkit-radial-gradient(50% top, circle, rgba(84,90,182,0.6) 0%, rgba(84,90,182,0) 75%),-webkit-radial-gradient(right top, circle, #794aa2 0%, rgba(121,74,162,0) 57%);
+  background-image: radial-gradient(circle at 50% top, rgba(84,90,182,0.6) 0%,rgba(84,90,182,0) 75%),radial-gradient(circle at right top, #794aa2 0%,rgba(121,74,162,0) 57%);
+  background-repeat: no-repeat;
+  // Show only the top of the gradient when rendering
+  // a header without hero
+  background-size: 100% 1000px;
+  color: lighten($primary-color, 30%);
+  margin: 0;
+  display: inline-block;
+  vertical-align: top;
+  width: 100%;
+}
+
+#navigation {
+  $padding-nav: 20px;
+  $padding-nav-inner: 7px;
+  $color-link: #F2EEFF;
+  $font-size: 14px;
+  $font-size-sm: (($font-size / 1px) - 1) + px;
+  $font-size-xs: (($font-size / 1px) - 2) + px;
+  $dropdown-width: 180px;
+  $dropdown-padding: 16px;
+
+  position: relative;
+  font-size: $font-size;
+  -webkit-font-smoothing: antialiased;
+  font-weight: 600;
+  line-height: 1;
+
+  *,
+  *:before,
+  *:after {
+    @include box-sizing(border-box);
+  }
+
+  ul {
+    position: relative;
+    padding: 0;
+    margin: 0;
+    list-style: none;
+  }
+
+  li {
+    float: left;
+    margin: 0;
+    padding: 0 10px;
+
+    @include tablet-landscape {
+      float: none;
+      padding: 0;
+    }
+
+    &.has-dropdown {
+
+      > a {
+
+        //Caret
+        &:after {
+          content: "";
+          display: inline-block;
+          position: relative;
+          top: -1px;
+          @include size(10px 6px);
+          margin-left: 5px;
+          background-image: url(components/nav-dropdown-caret.svg);
+          background-repeat: no-repeat;
+          opacity: .5;
+        }
+      }
+
+      //Dropdown hover
+      &:hover {
+
+        .dropdown {
+          visibility: visible;
+          opacity: 1;
+          margin-top: 3px;
+          @include transition-delay(0s);
+        }
+
+        > a {
+          color: #fff;
+
+          &:after {
+            opacity: 1;
+          }
+        }
+      }
+
+    }
+
+    a {
+      text-decoration: none;
+      &:hover {
+        text-decoration: none;
+      }
+    }
+
+    > a {
+      display: inline-block;
+      padding: $padding-nav-inner 0;
+      text-decoration: none;
+      color: fade-out($color-link, .4);
+
+      &:hover {
+        color: #fff;
+      }
+
+      &:focus {
+        outline: 0;
+      }
+
+      &.highlight {
+        background: fade-out(black, .8);
+        border-radius: $border-radius;
+        color: white;
+        padding: 6px 12px;
+
+        &:hover {
+          background: rgba(0, 0, 0, 0.3);
+        }
+      }
+    }
+  }
+
+  .dropdown {
+    margin-top: 0;
+    font-size: $font-size-sm;
+    min-width: 200px;
+
+    @include screen(min-width, $tablet-landscape-threshold) {
+      position: absolute;
+      max-width: $dropdown-width;
+      background: #fff;
+      border-radius: 4px;
+      z-index: 2;
+      padding: $dropdown-padding/2 $dropdown-padding;
+      overflow: visible;
+      box-shadow: 0 2px 7px fade-out(#000, .825);
+    }
+
+    // Hit area
+    &:after {
+      content: "";
+      position: absolute;
+      top: -3px;
+      left: 0;
+      background: transparent;
+      height: 3px;
+      width: 100%;
+    }
+
+    // Transition
+    visibility: hidden;
+    opacity: 0;
+    @include transition(visibility 0s 0.15s, opacity 0.15s, margin-top .15s);
+
+    li a {
+      color: #444;
+      font-weight: 400;
+
+      &:hover {
+        color: $primary-color;
+      }
+
+      &.addons:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5RjtzdHJva2U6Izc5NTg5Rjt9PC9zdHlsZT48dGl0bGU+QWRkb25zPC90aXRsZT48ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz48ZyBpZD0iUGFnZS0xIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj48ZyBpZD0iQWRkb25zIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIj48ZyBpZD0iSW1wb3J0ZWQtTGF5ZXJzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMC4wMDAwMDAsIDQuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TTGF5ZXJHcm91cCI+PHBhdGggaWQ9IkZpbGwtMSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCIgY2xhc3M9InN0MCIgZD0iTS0xNzksMzc4LjdjLTQuNS0yLjQtMTEuNS0yLjQtMTYsMGMtMy41LDEuOC00LDQuMi00LDUuNWMwLDEuMywwLjUsMy42LDQsNS41YzAsMCwwLDAsMCwwYzIuMiwxLjIsNS4xLDEuOCw4LDEuOGMyLjksMCw1LjgtMC42LDgtMS44YzMuNS0xLjgsNC00LjIsNC01LjVDLTE3NSwzODMtMTc1LjUsMzgwLjYtMTc5LDM3OC43TC0xNzksMzc4Ljd6IE0tMTgwLjgsMzg2LjJjLTMuNCwxLjgtOSwxLjgtMTIuNCwwYy0xLjItMC42LTEuOS0xLjQtMS45LTJjMC0wLjYsMC43LTEuNCwxLjktMmMzLjQtMS44LDktMS44LDEyLjQsMGMxLjIsMC42LDEuOSwxLjQsMS45LDJDLTE3OC45LDM4NC44LTE3OS42LDM4NS42LTE4MC44LDM4Ni4yTC0xODAuOCwzODYuMnoiLz48cGF0aCBpZD0iRmlsbC0yIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIiBjbGFzcz0ic3QwIiBkPSJNLTE5NSwzNjAuOUMtMTk1LDM2MC45LTE5NSwzNjAuOS0xOTUsMzYwLjljMi4zLDEuMiw1LjEsMS44LDgsMS44YzIuOSwwLDUuOC0wLjYsOC0xLjhjMy41LTEuOCw0LTQuMiw0LTUuNWMwLTEuMy0wLjUtMy42LTQtNS41Yy00LjUtMi40LTExLjUtMi40LTE2LDBjLTMuNSwxLjgtNCw0LjItNCw1LjVDLTE5OSwzNTYuNy0xOTguNSwzNTkuMS0xOTUsMzYwLjlMLTE5NSwzNjAuOXogTS0xOTMuMiwzNTMuNWMzLjQtMS44LDktMS44LDEyLjQsMGMxLjIsMC42LDEuOSwxLjQsMS45LDJjMCwwLjYtMC43LDEuNC0xLjksMmMtMy40LDEuOC05LDEuOC0xMi40LDBjLTEuMi0wLjYtMS45LTEuNC0xLjktMkMtMTk1LDM1NC44LTE5NC4zLDM1NC4xLTE5My4yLDM1My41TC0xOTMuMiwzNTMuNXoiLz48cGF0aCBpZD0iRmlsbC0zIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIiBjbGFzcz0ic3QwIiBkPSJNLTE3MS4zLDM3NS4zQy0xNzEuMywzNzUuMy0xNzEuMywzNzUuMy0xNzEuMywzNzUuM2MyLjIsMS4yLDUuMSwxLjgsOCwxLjhzNS44LTAuNiw4LTEuOGMzLjUtMS44LDQtNC4yLDQtNS41YzAtMS4zLTAuNS0zLjYtNC01LjVjLTQuNS0yLjQtMTEuNS0yLjQtMTYsMGMtMy41LDEuOC00LDQuMi00LDUuNUMtMTc1LjMsMzcxLTE3NC43LDM3My40LTE3MS4zLDM3NS4zTC0xNzEuMywzNzUuM3ogTS0xNjkuNCwzNjcuOGMzLjQtMS44LDktMS44LDEyLjQsMGMxLjIsMC42LDEuOSwxLjQsMS45LDJjMCwwLjYtMC43LDEuNC0xLjksMmMtMy40LDEuOC05LDEuOC0xMi40LDBjLTEuMi0wLjYtMS45LTEuNC0xLjktMkMtMTcxLjMsMzY5LjItMTcwLjYsMzY4LjQtMTY5LjQsMzY3LjhMLTE2OS40LDM2Ny44eiIvPjxwYXRoIGlkPSJGaWxsLTQiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiIGNsYXNzPSJzdDAiIGQ9Ik0tMjE4LjcsMzc1LjRDLTIxOC43LDM3NS40LTIxOC43LDM3NS40LTIxOC43LDM3NS40YzIuMywxLjIsNS4xLDEuOCw4LDEuOGMyLjksMCw1LjgtMC42LDgtMS44YzMuNS0xLjgsNC00LjIsNC01LjVjMC0xLjMtMC41LTMuNi00LTUuNWMtNC41LTIuNC0xMS41LTIuNC0xNiwwYy0zLjUsMS44LTQsNC4yLTQsNS41Qy0yMjIuNywzNzEuMi0yMjIuMiwzNzMuNS0yMTguNywzNzUuNEwtMjE4LjcsMzc1LjR6IE0tMjE2LjksMzY3LjljMy40LTEuOCw5LTEuOCwxMi40LDBjMS4yLDAuNiwxLjksMS40LDEuOSwyYzAsMC42LTAuNywxLjQtMS45LDJjLTMuNCwxLjgtOSwxLjgtMTIuNCwwYy0xLjItMC42LTEuOS0xLjQtMS45LTJDLTIxOC44LDM2OS4zLTIxOCwzNjguNS0yMTYuOSwzNjcuOUwtMjE2LjksMzY3Ljl6Ii8+PHBhdGggaWQ9IkZpbGwtNSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCIgY2xhc3M9InN0MCIgZD0iTS0xMzMuNCwzODUuM0MtMTMzLjQsMzg1LjItMTMzLjQsMzg1LjItMTMzLjQsMzg1LjNsMC0xMi42YzAtNi42LTMuNi0xMi44LTkuMy0xNi4xbC0zNS0yMC4yYy01LjctMy4zLTEyLjktMy4zLTE4LjYsMGwtMzUsMjAuMmMtNS43LDMuMy05LjMsOS41LTkuMywxNi4xdjQwLjRjMCw2LjYsMy42LDEyLjgsOS4zLDE2LjFsMzUsMjAuMmMyLjksMS43LDYuMSwyLjUsOS4zLDIuNXM2LjQtMC44LDkuMy0yLjVsMzUtMjAuMmM1LjctMy4zLDkuMy05LjUsOS4zLTE2LjF2LTI3LjdDLTEzMy40LDM4NS40LTEzMy40LDM4NS4zLTEzMy40LDM4NS4zTC0xMzMuNCwzODUuM3ogTS0yMjkuMywzNjBsMzUtMjAuMmMyLjMtMS4zLDQuOC0yLDcuMy0yczUuMSwwLjcsNy4zLDJsMzUsMjAuMmM0LjUsMi42LDcuMyw3LjUsNy4zLDEyLjd2MTIuN2MtMC4xLDQuMi0yLjMsNy45LTYsMTBsLTM0LjksMjAuMWMtNS40LDMuMS0xMi4yLDMuMS0xNy42LDBsLTM0LjktMjAuMWMtMy45LTIuMy02LjItNi41LTUuOS0xMS4xYzAsMCwwLDAsMC0wLjF2LTExLjZDLTIzNi42LDM2Ny41LTIzMy44LDM2Mi42LTIyOS4zLDM2MEwtMjI5LjMsMzYweiBNLTEzNy4zLDQxMy4xYzAsNS4yLTIuOCwxMC4xLTcuMywxMi43bC0zNSwyMC4yYy00LjUsMi42LTEwLjEsMi42LTE0LjcsMGwtMzUtMjAuMmMtNC41LTIuNi03LjMtNy41LTcuMy0xMi43di0xNy42YzEuMSwxLjMsMi41LDIuNCw0LDMuM2wzNC45LDIwLjFjMy4zLDEuOSw3LjEsMi45LDEwLjgsMi45YzMuNywwLDcuNS0xLDEwLjgtMi45bDM0LjktMjAuMWMxLjUtMC45LDIuOS0yLDQtMy4zVjQxMy4xTC0xMzcuMyw0MTMuMXoiLz48L2c+PC9nPjwvZz48L3N2Zz4=);
+        background-size: cover;
+      }
+
+      &.buttons:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5RjtzdHJva2U6Izc5NTg5Rjt9PC9zdHlsZT48dGl0bGU+QnV0dG9uczwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+PGcgaWQ9IlBhZ2UtMSIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+PGcgaWQ9IkJ1dHRvbnMiIHNrZXRjaDp0eXBlPSJNU0FydGJvYXJkR3JvdXAiPjxnIGlkPSJJbXBvcnRlZC1MYXllcnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzLjAwMDAwMCwgNC4wMDAwMDApIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIj48cGF0aCBpZD0iRmlsbC0xIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIiBjbGFzcz0ic3QwIiBkPSJNLTE0OCwzNTUuM2wtMzMtMTkuMWMtNS41LTMuMS0xMi4yLTMuMS0xNy43LDBsLTMzLDE5LjFjLTUuNSwzLjEtOC44LDktOC44LDE1LjN2MzguMmMwLDYuMywzLjQsMTIuMiw4LjgsMTUuM2wyMi42LDEzLjFjMC45LDAuNSwyLjEsMC4yLDIuNy0wLjdjMC41LTAuOSwwLjItMi4xLTAuNy0yLjdsLTIyLjYtMTMuMWMtNC4yLTIuNC02LjktNy02LjktMTEuOXYtMzguMmMwLTQuOSwyLjYtOS41LDYuOS0xMS45bDMzLTE5LjFjNC4yLTIuNCw5LjUtMi40LDEzLjcsMGwzMywxOS4xYzQuMiwyLjQsNi45LDcsNi45LDExLjl2MzguMmMwLDQuOS0yLjYsOS41LTYuOSwxMS45bC0yMi42LDEzLjFjLTAuOSwwLjUtMS4zLDEuNy0wLjcsMi43YzAuNCwwLjYsMSwxLDEuNywxYzAuMywwLDAuNy0wLjEsMS0wLjNsMjIuNi0xMy4xYzUuNC0zLjEsOC44LTksOC44LTE1LjN2LTM4LjJDLTEzOS4yLDM2NC4zLTE0Mi42LDM1OC41LTE0OCwzNTUuMyIvPjxwYXRoIGlkPSJGaWxsLTIiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiIGNsYXNzPSJzdDAiIGQ9Ik0tMTY5LjcsMzk5LjljMC40LDAuNCwwLjksMC42LDEuNCwwLjZzMS0wLjIsMS40LTAuNmMwLjgtMC44LDAuOC0yLDAtMi44bC0yMS42LTIxLjZjLTAuMi0wLjItMC40LTAuMy0wLjYtMC40Yy0wLjUtMC4yLTEtMC4yLTEuNSwwYy0wLjIsMC4xLTAuNSwwLjItMC42LDAuNGwtMjEuNiwyMS42Yy0wLjgsMC44LTAuOCwyLDAsMi44YzAuOCwwLjgsMiwwLjgsMi44LDBsMTguMi0xOC4ydjY4LjNjMCwxLjEsMC45LDIsMiwyYzEuMSwwLDItMC45LDItMnYtNjguM0wtMTY5LjcsMzk5LjkiLz48L2c+PC9nPjwvZz48L3N2Zz4=);
+        background-size: cover;
+      }
+
+      &.buildpacks:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5RjtzdHJva2U6Izc5NTg5Rjt9PC9zdHlsZT48dGl0bGU+QnVpbGRwYWNrczwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+PGcgaWQ9IlBhZ2UtMSIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+PGcgaWQ9IkJ1aWxkcGFja3MiIHNrZXRjaDp0eXBlPSJNU0FydGJvYXJkR3JvdXAiPjxnIGlkPSJJbXBvcnRlZC1MYXllcnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDUuMDAwMDAwLCA2LjAwMDAwMCkiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiPjxwYXRoIGlkPSJGaWxsLTEiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiIGNsYXNzPSJzdDAiIGQ9Ik0tMTU0LjIsMzc0LjZ2LTIyLjVjMC0yLjYtMS40LTUuMS0zLjctNi40bC0xOS41LTExLjJjLTIuMy0xLjMtNS4xLTEuMy03LjQsMGwtMTkuNSwxMS4yYy0yLjMsMS4zLTMuNywzLjgtMy43LDYuNHYyMi41YzAsMi42LDEuNCw1LjEsMy43LDYuNGwxOS41LDExLjNjMS4xLDAuNywyLjQsMSwzLjcsMWMxLjMsMCwyLjYtMC4zLDMuNy0xbDE5LjUtMTEuM0MtMTU1LjYsMzc5LjctMTU0LjIsMzc3LjItMTU0LjIsMzc0LjZMLTE1NC4yLDM3NC42eiBNLTE1OC4xLDM3NC42YzAsMS4yLTAuNywyLjQtMS43LDNsLTE5LjUsMTEuMmMtMS4xLDAuNi0yLjQsMC42LTMuNSwwbC0xOS41LTExLjJjLTEuMS0wLjYtMS43LTEuOC0xLjctM3YtMjIuNWMwLTEuMiwwLjctMi40LDEuNy0zbDE5LjUtMTEuM2MwLjUtMC4zLDEuMS0wLjUsMS43LTAuNWMwLjYsMCwxLjIsMC4yLDEuNywwLjVsMTkuNSwxMS4zYzEuMSwwLjYsMS43LDEuOCwxLjcsM1YzNzQuNkwtMTU4LjEsMzc0LjZ6Ii8+PHBhdGggaWQ9IkZpbGwtMiIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCIgY2xhc3M9InN0MCIgZD0iTS0xNjYuNywzNDkuMmwtMTItNy4xYy0xLjUtMC45LTMuMy0wLjktNC44LDBsLTExLjksNy4xYy0xLDAuNi0xLjYsMS43LTEuNiwyLjljMCwxLjIsMC42LDIuMywxLjYsMi45aDBsMTIsNy4xYzAuNywwLjQsMS42LDAuNiwyLjQsMC42YzAuOCwwLDEuNy0wLjIsMi40LTAuN2wxMS45LTcuMWMxLTAuNiwxLjYtMS43LDEuNi0yLjlDLTE2NS4xLDM1MC45LTE2NS43LDM0OS44LTE2Ni43LDM0OS4yTC0xNjYuNywzNDkuMnogTS0xODAuNywzNTguN2MtMC4zLDAuMi0wLjYsMC4yLTAuOCwwbC0xMS4xLTYuN2wxMS4xLTYuNmMwLjMtMC4yLDAuNi0wLjIsMC44LDBsMTEuMSw2LjdMLTE4MC43LDM1OC43TC0xODAuNywzNTguN3oiLz48cGF0aCBpZD0iRmlsbC0zIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIiBjbGFzcz0ic3QwIiBkPSJNLTE5MCw0MDAuOWwtMTkuNS0xMS4zYy0yLjMtMS4zLTUuMS0xLjMtNy40LDBsLTE5LjUsMTEuM2MwLDAsMCwwLDAsMGMtMi4zLDEuMy0zLjcsMy44LTMuNyw2LjR2MjIuNWMwLDIuNiwxLjQsNS4xLDMuNyw2LjRsMTkuNSwxMS4yYzEuMSwwLjcsMi40LDEsMy43LDFzMi42LTAuMywzLjctMWwxOS41LTExLjJjMi4zLTEuMywzLjctMy44LDMuNy02LjR2LTIyLjVDLTE4Ni4zLDQwNC42LTE4Ny43LDQwMi4yLTE5MCw0MDAuOUwtMTkwLDQwMC45eiBNLTE5MC4yLDQyOS44YzAsMS4yLTAuNywyLjQtMS43LDNsLTE5LjUsMTEuM2MtMS4xLDAuNi0yLjQsMC42LTMuNSwwbC0xOS41LTExLjNjLTEuMS0wLjYtMS43LTEuOC0xLjctM3YtMjIuNWMwLTEuMiwwLjctMi40LDEuNy0zbDE5LjUtMTEuMmMxLjEtMC42LDIuNC0wLjYsMy41LDBsMTkuNSwxMS4yYzEuMSwwLjYsMS43LDEuOCwxLjcsM1Y0MjkuOEwtMTkwLjIsNDI5Ljh6Ii8+PHBhdGggaWQ9IkZpbGwtNCIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCIgY2xhc3M9InN0MCIgZD0iTS0xOTguOCw0MDQuNGwtMTItNy4xYy0xLjUtMC45LTMuMy0wLjktNC44LDBsLTExLjksNy4xYy0xLDAuNi0xLjYsMS43LTEuNiwyLjljMCwxLjIsMC42LDIuMywxLjYsMi45bDEyLDcuMWMwLjcsMC40LDEuNiwwLjYsMi40LDAuNmMwLjgsMCwxLjctMC4yLDIuNC0wLjdsMTEuOS03LjFjMS0wLjYsMS42LTEuNywxLjYtMi45Uy0xOTcuOCw0MDUtMTk4LjgsNDA0LjRMLTE5OC44LDQwNC40eiBNLTIxMi44LDQxMy45Yy0wLjMsMC4yLTAuNiwwLjItMC44LDBsLTExLjEtNi43bDExLjEtNi42YzAuMy0wLjIsMC42LTAuMiwwLjgsMGwxMS4xLDYuN0wtMjEyLjgsNDEzLjlMLTIxMi44LDQxMy45eiIvPjxwYXRoIGlkPSJGaWxsLTUiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiIGNsYXNzPSJzdDAiIGQ9Ik0tMTI1LjgsNDAwLjlsLTE5LjUtMTEuM2MtMi4zLTEuMy01LjEtMS4zLTcuNCwwbC0xOS41LDExLjNjMCwwLDAsMCwwLDBjLTIuMywxLjMtMy43LDMuOC0zLjcsNi40djIyLjVjMCwyLjYsMS40LDUuMSwzLjcsNi40bDE5LjUsMTEuMmMxLjEsMC43LDIuNCwxLDMuNywxczIuNi0wLjMsMy43LTFsMTkuNS0xMS4yYzIuMy0xLjMsMy43LTMuOCwzLjctNi40di0yMi41Qy0xMjIuMSw0MDQuNi0xMjMuNSw0MDIuMi0xMjUuOCw0MDAuOUwtMTI1LjgsNDAwLjl6IE0tMTI2LDQyOS44YzAsMS4yLTAuNywyLjQtMS43LDNsLTE5LjUsMTEuM2MtMS4xLDAuNi0yLjQsMC42LTMuNSwwbC0xOS41LTExLjNjLTEuMS0wLjYtMS43LTEuOC0xLjctM3YtMjIuNWMwLTEuMiwwLjctMi40LDEuNy0zbDE5LjUtMTEuMmMxLjEtMC42LDIuNC0wLjYsMy41LDBsMTkuNSwxMS4yYzEuMSwwLjYsMS43LDEuOCwxLjcsM1Y0MjkuOEwtMTI2LDQyOS44eiIvPjxwYXRoIGlkPSJGaWxsLTYiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiIGNsYXNzPSJzdDAiIGQ9Ik0tMTM0LjYsNDA0LjRsLTEyLTcuMmMtMS41LTAuOS0zLjMtMC45LTQuOCwwbC0xMS45LDcuMWMtMSwwLjYtMS42LDEuNy0xLjYsMi45czAuNiwyLjMsMS42LDIuOWwxMiw3LjFjMC43LDAuNCwxLjYsMC42LDIuNCwwLjZjMC44LDAsMS43LTAuMiwyLjQtMC43bDExLjktNy4xYzEtMC42LDEuNi0xLjcsMS42LTIuOUMtMTMzLDQwNi4xLTEzMy42LDQwNS0xMzQuNiw0MDQuNEwtMTM0LjYsNDA0LjR6IE0tMTQ4LjUsNDEzLjljLTAuMywwLjItMC42LDAuMi0wLjgsMGwtMTEuMS02LjdsMTEuMS02LjZjMC4zLTAuMiwwLjYtMC4yLDAuOCwwbDExLjEsNi43TC0xNDguNSw0MTMuOUwtMTQ4LjUsNDEzLjl6Ii8+PC9nPjwvZz48L2c+PC9zdmc+);
+        background-size: cover;
+      }
+      &.platform:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5RjtzdHJva2U6Izc5NTg5Rjt9PC9zdHlsZT48dGl0bGU+QnVpbGRwYWNrczwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+PGc+PGc+PGc+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0xNzcsNDU2LjVjLTMuNywwLTcuNC0xLTEwLjctMi45bC0zNS41LTIwLjVjLTQuNi0yLjYtNy41LTcuMy03LjgtMTIuNmMtMC4zLTUuMywyLTEwLjMsNi4yLTEzLjRjMC42LTAuNSwxLjYtMC4zLDIsMC4zYzAuNSwwLjYsMC4zLDEuNi0wLjMsMmMtMy40LDIuNS01LjMsNi42LTUsMTAuOWMwLjMsNC4zLDIuNiw4LjEsNi4zLDEwLjJsMzUuNSwyMC41YzUuNywzLjMsMTIuOCwzLjMsMTguNSwwbDM1LjUtMjAuNWMzLjgtMi4yLDYuMS01LjksNi4zLTEwLjNjMC4yLTQuMy0xLjctOC40LTUuMS0xMC45Yy0wLjYtMC41LTAuOC0xLjQtMC4zLTJjMC41LTAuNiwxLjQtMC44LDItMC4zYzQuMiwzLjEsNi42LDguMSw2LjMsMTMuNGMtMC4zLDUuMy0zLjIsMTAtNy44LDEyLjZsLTM1LjUsMjAuNUMtMTY5LjYsNDU1LjYtMTczLjMsNDU2LjUtMTc3LDQ1Ni41eiIvPjwvZz48L2c+PGc+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0xNzcsNDMzLjljLTMuNywwLTcuNC0xLTEwLjctMi45bC0zNS41LTIwLjVjLTQuNi0yLjYtNy41LTcuNC03LjgtMTIuN2MtMC4zLTUuMywyLjEtMTAuMyw2LjMtMTMuNGMwLjYtMC41LDEuNi0wLjMsMiwwLjNjMC41LDAuNiwwLjMsMS42LTAuMywyYy0zLjQsMi41LTUuNCw2LjYtNS4xLDEwLjljMC4yLDQuNCwyLjUsOC4xLDYuMywxMC4zbDM1LjUsMjAuNWM1LjcsMy4zLDEyLjgsMy4zLDE4LjUsMGwzNS41LTIwLjVjMy43LTIuMiw2LTUuOCw2LjMtMTAuMWMwLjMtNC4yLTEuNS04LjMtNC44LTEwLjljLTAuNi0wLjUtMC43LTEuNC0wLjMtMmMwLjUtMC42LDEuNC0wLjgsMi0wLjNjNC4xLDMuMiw2LjMsOC4yLDUuOSwxMy40Yy0wLjQsNS4zLTMuMiw5LjgtNy44LDEyLjRsLTM1LjUsMjAuNUMtMTY5LjYsNDMzLTE3My4zLDQzMy45LTE3Nyw0MzMuOXoiLz48L2c+PC9nPjxnPjxnPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0tMTc3LDQxMS4zYy0zLjcsMC03LjQtMS0xMC43LTIuOWwtMzUuNS0yMC41Yy00LjktMi44LTcuOC03LjktNy44LTEzLjVjMC01LjYsMi45LTEwLjcsNy44LTEzLjVsMCwwbDM1LjUtMjAuNWM2LjYtMy44LDE0LjgtMy44LDIxLjQsMGwzNS41LDIwLjVjNC45LDIuOCw3LjgsNy45LDcuOCwxMy41YzAsNS42LTIuOSwxMC43LTcuOCwxMy41bC0zNS41LDIwLjVDLTE2OS42LDQxMC40LTE3My4zLDQxMS4zLTE3Nyw0MTEuM3ogTS0yMjEuNywzNjMuNWMtNCwyLjMtNi4zLDYuNC02LjMsMTFjMCw0LjYsMi40LDguNyw2LjMsMTFsMzUuNSwyMC41YzUuNywzLjMsMTIuOCwzLjMsMTguNSwwbDM1LjUtMjAuNWM0LTIuMyw2LjMtNi40LDYuMy0xMWMwLTQuNi0yLjQtOC43LTYuMy0xMWwtMzUuNS0yMC41Yy01LjctMy4zLTEyLjgtMy4zLTE4LjUsMEwtMjIxLjcsMzYzLjV6Ii8+PC9nPjwvZz48Zz48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNLTE4OS40LDQzOS42Ii8+PC9nPjwvZz48L2c+PGc+PGc+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0yMTguOCwzNzguN2MtMS41LDAtMi44LTEuMi0yLjgtMi44YzAtMS41LDEuMi0yLjgsMi44LTIuOGMxLjUsMCwyLjgsMS4yLDIuOCwyLjhDLTIxNiwzNzcuNC0yMTcuMiwzNzguNy0yMTguOCwzNzguN3ogTS0yMTguOCwzNzQuOWMtMC41LDAtMSwwLjQtMSwxYzAsMC41LDAuNCwxLDEsMWMwLjUsMCwxLTAuNCwxLTFDLTIxNy44LDM3NS40LTIxOC4yLDM3NC45LTIxOC44LDM3NC45eiIvPjwvZz48L2c+PGc+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0yMTAuOCwzODMuM2MtMS41LDAtMi44LTEuMi0yLjgtMi44YzAtMS41LDEuMi0yLjgsMi44LTIuOHMyLjgsMS4yLDIuOCwyLjhDLTIwOCwzODItMjA5LjMsMzgzLjMtMjEwLjgsMzgzLjN6IE0tMjEwLjgsMzc5LjVjLTAuNSwwLTEsMC40LTEsMWMwLDAuNSwwLjQsMSwxLDFjMC41LDAsMS0wLjQsMS0xQy0yMDkuOSwzODAtMjEwLjMsMzc5LjUtMjEwLjgsMzc5LjV6Ii8+PC9nPjwvZz48L2c+PGc+PGc+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0yMTguOCw0MjUuOGMtMS41LDAtMi44LTEuMi0yLjgtMi44YzAtMS41LDEuMi0yLjgsMi44LTIuOGMxLjUsMCwyLjgsMS4yLDIuOCwyLjhDLTIxNiw0MjQuNi0yMTcuMiw0MjUuOC0yMTguOCw0MjUuOHogTS0yMTguOCw0MjIuMWMtMC41LDAtMSwwLjQtMSwxYzAsMC41LDAuNCwxLDEsMWMwLjUsMCwxLTAuNCwxLTFDLTIxNy44LDQyMi41LTIxOC4yLDQyMi4xLTIxOC44LDQyMi4xeiIvPjwvZz48L2c+PGc+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0yMTAuOCw0MzAuNGMtMS41LDAtMi44LTEuMi0yLjgtMi44YzAtMS41LDEuMi0yLjgsMi44LTIuOHMyLjgsMS4yLDIuOCwyLjhDLTIwOCw0MjkuMi0yMDkuMyw0MzAuNC0yMTAuOCw0MzAuNHogTS0yMTAuOCw0MjYuN2MtMC41LDAtMSwwLjQtMSwxczAuNCwxLDEsMWMwLjUsMCwxLTAuNCwxLTFTLTIxMC4zLDQyNi43LTIxMC44LDQyNi43eiIvPjwvZz48L2c+PC9nPjxnPjxnPjxnPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0tMjE4LjgsNDAyLjVjLTEuNSwwLTIuOC0xLjItMi44LTIuOGMwLTEuNSwxLjItMi44LDIuOC0yLjhjMS41LDAsMi44LDEuMiwyLjgsMi44Qy0yMTYsNDAxLjMtMjE3LjIsNDAyLjUtMjE4LjgsNDAyLjV6IE0tMjE4LjgsMzk4LjhjLTAuNSwwLTEsMC40LTEsMXMwLjQsMSwxLDFjMC41LDAsMS0wLjQsMS0xUy0yMTguMiwzOTguOC0yMTguOCwzOTguOHoiLz48L2c+PC9nPjxnPjxnPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0tMjEwLjgsNDA3LjFjLTEuNSwwLTIuOC0xLjItMi44LTIuOHMxLjItMi44LDIuOC0yLjhzMi44LDEuMiwyLjgsMi44Uy0yMDkuMyw0MDcuMS0yMTAuOCw0MDcuMXogTS0yMTAuOCw0MDMuNGMtMC41LDAtMSwwLjQtMSwxczAuNCwxLDEsMWMwLjUsMCwxLTAuNCwxLTFTLTIxMC4zLDQwMy40LTIxMC44LDQwMy40eiIvPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=);
+        background-size: cover;
+      }
+      &.postgres:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5Rjt9PC9zdHlsZT48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNLTE4NC40LDQwNC44di01OC41YzAtMC44LTAuNy0xLjUtMS41LTEuNWMtMzQuNiwwLTUxLjUsNi4xLTUxLjUsMTguNmMwLDE2LjksMjIuMSw0Mi45LDUxLjUsNDIuOUMtMTg1LjEsNDA2LjMtMTg0LjQsNDA1LjYtMTg0LjQsNDA0Ljh6Ii8+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0xNjguMSwzNDQuOGMtMC44LDAtMS41LDAuNy0xLjUsMS41djkzLjNjMCw0LjItMi44LDYuOS01LjMsOGMtMi42LDEuMS02LjQsMS4xLTkuNC0xLjljLTAuNi0wLjYtMS41LTAuNi0yLjEsMHMtMC42LDEuNSwwLDIuMWMyLjMsMi4zLDUuMiwzLjQsOC4xLDMuNGMxLjUsMCwzLTAuMyw0LjUtMC45YzQuNC0xLjgsNy4yLTUuOSw3LjItMTAuN3YtMzMuM2MyOC42LTAuOSw1MC0yNi4zLDUwLTQyLjlDLTExNi42LDM1MC45LTEzMy40LDM0NC44LTE2OC4xLDM0NC44eiBNLTE2Ni42LDQwMy4zdi01NS41YzMxLjIsMC4yLDQ3LDUuNCw0NywxNS42Qy0xMTkuNiwzNzguOC0xNDAuNSw0MDIuNC0xNjYuNiw0MDMuM3oiLz48L2c+PC9zdmc+);
+        background-size: cover;
+      }
+      &.redis:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5Rjt9PC9zdHlsZT48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNLTE4NC41LDMzNi41Yy0yMC4zLDAtMzUsMTQuNy0zNSwzNWMwLDE2LjUsOS44LDI5LjMsMjQuMywzMy42bC0yOS43LDUwYy0wLjMsMC41LTAuMywxLDAsMS41czAuOCwwLjgsMS4zLDAuOGgzOS4xYzAuOCwwLDEuNS0wLjcsMS41LTEuNXYtNTAuOFYzOTB2LTUyQy0xODMsMzM3LjItMTgzLjYsMzM2LjUtMTg0LjUsMzM2LjV6Ii8+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0xMjguMyw0NTUuNmwtMjYuMy01MmMxMi42LTUuMSwyMC45LTE3LjIsMjAuOS0zMi40YzAtMjAuMy0xNC43LTM1LTM1LTM1Yy0wLjgsMC0xLjUsMC43LTEuNSwxLjVzMC43LDEuNSwxLjUsMS41YzE4LjYsMCwzMiwxMy41LDMyLDMycy0xMy41LDMyLTMyLDMyYy0wLjgsMC0xLjUsMC43LTEuNSwxLjVzMC43LDEuNSwxLjUsMS41YzQsMCw3LjgtMC42LDExLjMtMS43TC0xMzEsNDU3YzAuMywwLjUsMC44LDAuOCwxLjMsMC44YzAuMiwwLDAuNS0wLjEsMC43LTAuMkMtMTI4LjMsNDU3LjMtMTI4LDQ1Ni40LTEyOC4zLDQ1NS42eiIvPjwvZz48L3N2Zz4=);
+        background-size: cover;
+      }
+      &.connect:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5RjtzdHJva2U6Izc5NTg5Rjt9PC9zdHlsZT48dGl0bGU+QnVpbGRwYWNrczwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0xMjUuNywzNjguMmMwLTAuMSwwLTAuMy0wLjEtMC40YzAtMC4xLTAuMS0wLjItMC4xLTAuMmMtMC4xLTAuMS0wLjEtMC4zLTAuMi0wLjRjMC0wLjEtMC4xLTAuMS0wLjEtMC4yYy0wLjEtMC4xLTAuMi0wLjMtMC4zLTAuNGMwLDAsMCwwLTAuMSwwYy0wLjEtMC4xLTAuMy0wLjMtMC41LTAuNGwtNDkuNy0yOS4xYy0wLjEtMC4xLTAuMi0wLjEtMC40LTAuMmMtMC4xLDAtMC4yLTAuMS0wLjMtMC4xYy0wLjEsMC0wLjIsMC0wLjMsMGMtMC4zLDAtMC42LDAtMC45LDBjLTAuMSwwLTAuMiwwLTAuMywwYy0wLjEsMC0wLjIsMC4xLTAuMywwLjFjLTAuMSwwLTAuMiwwLjEtMC40LDAuMmwtNDkuNywyOS4xYy0wLjEsMC4xLTAuMiwwLjItMC4zLDAuMmMtMC4xLDAuMS0wLjIsMC4xLTAuMiwwLjJjLTAuMSwwLjEtMC4xLDAuMi0wLjIsMC4yYy0wLjEsMC4xLTAuMiwwLjItMC4yLDAuM2MwLDAuMS0wLjEsMC4yLTAuMSwwLjJjLTAuMSwwLjEtMC4xLDAuMy0wLjIsMC40YzAsMC4xLDAsMC4yLDAsMC4zYzAsMC4xLTAuMSwwLjMtMC4xLDAuNHYzOC4xdjE5LjZjMCwwLjIsMCwwLjUsMC4xLDAuN2MwLDAuMSwwLjEsMC4yLDAuMSwwLjNjMCwwLjEsMC4xLDAuMiwwLjEsMC4zYzAuMSwwLjEsMC4yLDAuMiwwLjMsMC4zYzAuMSwwLjEsMC4xLDAuMSwwLjIsMC4yYzAuMSwwLjEsMC4yLDAuMSwwLjIsMC4yYzAuMSwwLjEsMC4yLDAuMiwwLjMsMC4ybDE2LjQsOS41YzAuMSwwLjEsMC4zLDAuMSwwLjQsMC4yYzAuMSwwLDAuMSwwLjEsMC4yLDAuMWwzMi43LDE4LjhjMC4xLDAuMSwwLjMsMC4xLDAuNCwwLjJjMC4xLDAsMC4xLDAuMSwwLjIsMC4xYzAuMiwwLjEsMC40LDAuMSwwLjcsMC4xczAuNSwwLDAuNy0wLjFjMC4xLDAsMC4xLTAuMSwwLjItMC4xYzAuMS0wLjEsMC4zLTAuMSwwLjQtMC4ybDMyLjctMTguOGMwLDAsMCwwLDAuMSwwYzAuMi0wLjEsMC40LTAuMSwwLjYtMC4ybDE2LjQtOS41YzAuMS0wLjEsMC4yLTAuMiwwLjMtMC4yYzAuMS0wLjEsMC4yLTAuMSwwLjItMC4yYzAuMS0wLjEsMC4xLTAuMSwwLjItMC4yYzAuMS0wLjEsMC4yLTAuMiwwLjMtMC4zYzAuMS0wLjEsMC4xLTAuMiwwLjEtMC4zYzAtMC4xLDAuMS0wLjIsMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjUsMC4xLTAuN3YtMTkuNnYtMzguMUMtMTI1LjYsMzY4LjQtMTI1LjcsMzY4LjMtMTI1LjcsMzY4LjJ6IE0tMTM3LjksNDA5LjFsLTYuOCw0bC0xMS41LTYuNWwxMS41LTYuNWwxMS4xLDYuNUwtMTM3LjksNDA5LjF6IE0tMTU5LDQxMS4xbDExLjYsNi41djEzLjVsLTExLjYtNi41VjQxMS4xeiBNLTE0Miw0MzF2LTEzLjRsMC41LTAuM2wxMC42LTYuMXYxMy40TC0xNDIsNDMxeiBNLTE3OCwzNTUuOWwtOC41LTQuOWwtMi43LTEuNmwxMS4yLTYuOWwxMS4yLDYuOWwtMi44LDEuNkwtMTc4LDM1NS45eiBNLTE5MS44LDM1NC4xbDExLjEsNi40djEyLjlsLTExLjEtNi41VjM1NC4xeiBNLTE3NS40LDM2MC41bDExLjEtNi40VjM2N2wtMTEuMSw2LjVWMzYwLjV6IE0tMTk3LDM1My42djE0LjljMCwwLjksMC41LDEuOCwxLjMsMi4zbDE2LjQsOS41YzAsMCwwLDAsMCwwYzAsMCwwLDAsMCwwYzAuMSwwLjEsMC4zLDAuMSwwLjQsMC4yYzAuMSwwLDAuMiwwLjEsMC4zLDAuMWMwLjIsMC4xLDAuNSwwLjEsMC43LDAuMWMwLjIsMCwwLjUsMCwwLjctMC4xYzAuMSwwLDAuMi0wLjEsMC4zLTAuMWMwLjEsMCwwLjMtMC4xLDAuNC0wLjJjMCwwLDAsMCwwLDBjMCwwLDAsMCwwLDBsMTYuNC05LjVjMC44LTAuNSwxLjMtMS4zLDEuMy0yLjN2LTE0LjlsMjUuNCwxNC45bC01LjEsMi45TC0xNzgsMzk0bC0zOC4yLTIxLjlsLTYuMi0zLjZMLTE5NywzNTMuNnogTS0xOTcsNDExLjJ2MTMuNGwtMTEuNiw2LjV2LTEzbDMuMi0xLjlMLTE5Nyw0MTEuMnogTS0yMTEuMyw0MTMuNWwtMTEuMy02LjlsMTEuMy02LjVsMTEuNiw2LjVMLTIxMS4zLDQxMy41eiBNLTIyNS4xLDQyNC42di0xMy4zbDExLjEsNi44VjQzMUwtMjI1LjEsNDI0LjZ6IE0tMTkzLjEsNDI4LjVjMC44LTAuNSwxLjMtMS4zLDEuMy0yLjN2LTE5LjZjMCwwLDAsMCwwLDBjMCwwLDAsMCwwLDBjMC0wLjEsMC0wLjMtMC4xLTAuNGMwLTAuMSwwLTAuMiwwLTAuM2MwLTAuMi0wLjEtMC4zLTAuMi0wLjVjMC0wLjEsMC0wLjEtMC4xLTAuMmMtMC4xLTAuMS0wLjItMC4zLTAuMy0wLjRjMC0wLjEtMC4xLTAuMS0wLjEtMC4yYy0wLjEtMC4xLTAuMi0wLjEtMC4yLTAuMmMtMC4xLTAuMS0wLjItMC4yLTAuMy0wLjJjMCwwLDAsMCwwLDBsLTE2LjktOS41Yy0wLjgtMC41LTEuOC0wLjQtMi42LDBsLTEyLjQsNy4ydi0yOC45bDIyLjYsMTNsMjEuOCwxMi41djUxLjVsLTI1LjItMTQuNUwtMTkzLjEsNDI4LjV6IE0tMTc1LjQsMzk4LjZsMjEuNC0xMi4zbDIzLjEtMTMuMlY0MDJsLTEyLjQtNy4yYy0wLjgtMC41LTEuOC0wLjUtMi42LDBsLTE2LjksOS41YzAsMCwwLDAsMCwwYzAsMCwwLDAsMCwwYy0wLjEsMC4xLTAuMiwwLjItMC4zLDAuM2MtMC4xLDAuMS0wLjEsMC4xLTAuMiwwLjJjLTAuMSwwLjEtMC4yLDAuMi0wLjMsMC4zYy0wLjEsMC4xLTAuMSwwLjEtMC4yLDAuMmMtMC4xLDAuMS0wLjEsMC4zLTAuMiwwLjRjMCwwLjEtMC4xLDAuMS0wLjEsMC4yYy0wLjEsMC4yLTAuMSwwLjUtMC4xLDAuN3YxOS42YzAsMSwwLjUsMS44LDEuMywyLjNsMTIuOCw3LjJsLTI1LjIsMTQuNVYzOTguNnoiLz48L3N2Zz4=);
+        background-size: cover;
+      }
+      &.enterprise:before {
+        opacity: .9;
+        content: '';
+        display: inline-block;
+        height: 24px;
+        width: 24px;
+        vertical-align: middle;
+        margin-right: 8px;
+        position: relative;
+        top: -2px;
+        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iLTI0MSAzMzMgMTI4IDEyOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtMjQxIDMzMyAxMjggMTI4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6Izc5NTg5RjtzdHJva2U6Izc5NTg5Rjt9PC9zdHlsZT48dGl0bGU+QnVpbGRwYWNrczwvdGl0bGU+PGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+PHBhdGggY2xhc3M9InN0MCIgZD0iTS0xNDcuNiw0MjQuNkMtMTQ3LjYsNDI0LjUtMTQ3LjYsNDI0LjUtMTQ3LjYsNDI0LjZsMC0zMWMwLDAsMCwwLDAtMC4xYzAtMC4xLDAtMC4xLDAtMC4yYzAtMC4xLDAtMC4xLDAtMC4yYzAtMC4xLDAtMC4xLDAtMC4xYzAuMi0wLjgsMC0xLjctMC43LTIuMmwtMTIuNS04LjhjMC0wLjEsMC0wLjEsMC0wLjJ2LTE5LjJjMC0wLjYtMC4zLTEuMS0wLjctMS41bC0xNC45LTEyLjFjMCwwLDAsMC0wLjEsMHYtMTAuMmMwLTEuMS0wLjktMi0yLTJzLTIsMC45LTIsMlYzNDljMCwwLDAsMC0wLjEsMGwtMTQuOSwxMi4xYy0wLjUsMC40LTAuNywwLjktMC43LDEuNXYxOS4ybC0xNC43LDkuM2MtMC42LDAuNC0wLjksMS0wLjksMS43djMxLjdjLTUuOCwwLTEwLjYsNC43LTEwLjYsMTAuNmMwLDUuOCw0LjcsMTAuNiwxMC42LDEwLjZzMTAuNi00LjcsMTAuNi0xMC42YzAtNC41LTIuOC04LjMtNi43LTkuOGMwLTAuMSwwLTAuMiwwLTAuNHYtMzFsMTEuNy03LjRWNDIxYzAsMS4xLDAuOSwyLDIsMnMyLTAuOSwyLTJ2LTU0LjJsMTIuNiw4LjhjMC4zLDAuMiwwLjcsMC40LDEuMSwwLjRjMC40LDAsMC44LTAuMSwxLjEtMC40bDEyLjYtOC44djEzLjdjLTAuMSwwLjEtMC4yLDAuMS0wLjMsMC4ybC0xNC41LDEwLjJjLTAuNywwLjUtMSwxLjQtMC43LDIuMmMwLDAsMCwwLDAsMC4xYzAsMC4xLDAsMC4xLDAsMC4yYzAsMC4xLDAsMC4yLDAsMC4zYzAsMCwwLDAuMSwwLDAuMXYwYzAsMCwwLDAsMCwwdjQyLjdjLTUuMSwwLjgtOSw1LjEtOSwxMC40YzAsNS44LDQuNywxMC42LDEwLjYsMTAuNnMxMC42LTQuNywxMC42LTEwLjZjMC01LTMuNS05LjItOC4yLTEwLjN2LTM5LjNsMTEuOCw3LjdjMCwwLjEtMC4xLDAuMy0wLjEsMC41djExLjdjMCwxLjEsMC45LDIsMiwyczItMC45LDItMnYtMTEuN2MwLTAuMiwwLTAuNC0wLjEtMC41bDkuNS03LjJ2MjdjMCwwLjEsMCwwLjIsMCwwLjRjLTQuNSwxLjItNy45LDUuMy03LjksMTAuMmMwLDUuOCw0LjcsMTAuNiwxMC42LDEwLjZjNS44LDAsMTAuNi00LjcsMTAuNi0xMC42Qy0xMzguMiw0MjkuNi0xNDIuMyw0MjUuMS0xNDcuNiw0MjQuNnogTS0yMDUuMSw0MzUuMWMwLDMuNy0zLDYuNy02LjcsNi43cy02LjctMy02LjctNi43YzAtMy43LDMtNi42LDYuNy02LjZTLTIwNS4xLDQzMS40LTIwNS4xLDQzNS4xeiBNLTE3OC41LDM3MS42bC0xMi42LTguOWwxMi42LTEwLjJsMTIuNywxMC4yTC0xNzguNSwzNzEuNnogTS0xNjQsMzg0LjZsMTIsOC40bC0xMC45LDguM2wtMTIuOS04LjRMLTE2NCwzODQuNnogTS0xNzIuMiw0NDYuOGMwLDMuNy0zLDYuNy02LjYsNi43cy02LjYtMy02LjYtNi43YzAtMy43LDMtNi42LDYuNi02LjZTLTE3Mi4yLDQ0My4xLTE3Mi4yLDQ0Ni44eiBNLTE0OC44LDQ0MS43Yy0zLjcsMC02LjYtMy02LjYtNi43YzAtMy43LDMtNi42LDYuNi02LjZjMy43LDAsNi43LDMsNi43LDYuNkMtMTQyLjEsNDM4LjctMTQ1LjEsNDQxLjctMTQ4LjgsNDQxLjd6Ii8+PC9zdmc+);
+
+        background-size: cover;
+      }
+    }
+
+    p a {
+      color: #222;
+    }
+
+    &.more {
+      width: 160%;
+      max-width: 160%;
+      position: absolute;
+      left: 0;
+      right: 0;
+      display: block;
+      padding: $dropdown-padding/2 0 $dropdown-padding 0;
+
+      .more-title {
+        color: #999;
+        display: block;
+        font-size: 11px;
+        text-transform: uppercase;
+        letter-spacing: .05em;
+        margin: 12px 0 $dropdown-padding/2;
+        padding-bottom: ceil($dropdown-padding/1.5);
+        border-bottom: 1px solid #ddd;
+      }
+
+      section {
+        display: inline-block;
+        float: left;
+        height: 100%;
+        margin: 0;
+        padding: 0 $dropdown-padding;
+
+        @include tablet() {
+          float: none;
+          height: auto;
+          padding: 0;
+          margin: 12px 0;
+        }
+
+        > ul {
+          padding-left: 1px;
+          padding-right: 1px;
+        }
+      }
+
+      .more-resources,
+      .more-languages {
+        width: 25%;
+
+        @include tablet {
+          width: 100%;
+        }
+      }
+
+      .more-blog {
+        width: 50%;
+
+        @include tablet {
+          width: 100%;
+        }
+
+        a {
+          color: $primary-color;
+        }
+
+        h3 {
+          margin-top: 13px;
+          margin-bottom: 2px;
+          padding: 0;
+          font-size: 16px;
+          line-height: 1.4em;
+          text-align: left;
+        }
+
+        p {
+          font-size: $font-size-sm;
+          line-height: 1.4;
+          color: #333;
+          font-weight: 500;
+
+          a {
+            color: #333;
+            font-weight: 600;
+
+            &:hover {
+              color: $primary-color;
+            }
+          }
+        }
+
+        .blog-date {
+          margin: 1px 0;
+          color: #888;
+          font-size: $font-size-xs;
+        }
+      }
+
+      .btn-inline {
+        margin: 5px 0;
+        font-size: $font-size-xs;
+        padding-left: 1.5em;
+        padding-right: 1.5em;
+        border: 1px solid $primary-color;
+      }
+    }
+
+    li {
+      float: none;
+      white-space: nowrap;
+      padding: 0;
+    }
+
+  }
+
+  .main-nav {
+    float: left;
+    margin: 7px 0 0 15px;
+  }
+
+  @include tablet-landscape {
+    .nav-more {
+      display: none;
+    }
+  }
+
+  .tool-nav {
+    float: right;
+    margin: ($padding-nav-inner + 1) 0 0 $padding-nav;
+
+    li {
+      font-size: $font-size-sm;
+      padding: 0 ceil($padding-nav-inner/2);
+      margin: 0 10px;
+      &:last-child {
+        padding-right: 0;
+        margin-right: 0;
+      }
+    }
+  }
+
+  .user {
+
+    li {
+      font-size: $font-size;
+    }
+
+    > span {
+      color: lighten($primary-color, 10%);
+      color: fade-out(#fff, .8);
+      margin: 0 .2em;
+    }
+
+    &.logged-in {
+      > a:first-child {
+        margin-right: 12px;
+      }
+    }
+  }
+
+
+
+  .nav-wrapper {
+    @include tablet-landscape {
+      display: none;
+      overflow: auto;
+    }
+  }
+
+  &.active {
+
+    .nav-wrapper {
+
+      $nav-wrapper-bg: fade-out(darken($primary-color, 45%), .05);
+
+      display: block;
+      position: fixed;
+      z-index: 11;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      background-color: $nav-wrapper-bg;
+
+      &:before {
+        content: "";
+        width: 100%;
+        position: fixed;
+        top: 0;
+        left: 0;
+        height: 100px;
+        z-index: 0;
+        @include linear-gradient($nav-wrapper-bg 50%, fade-out($nav-wrapper-bg, 1) 100%, $fallback: transparent);
+      }
+    }
+
+    #logo {
+      position: fixed;
+      z-index: 12;
+
+      a {
+        @include mobile-landscape {
+          overflow: hidden;
+          width: 40px;
+        }
+      }
+    }
+
+    .main-nav {
+      position: relative;
+      width: 100%;
+      padding: 100px 40px;
+      font-size: 1.5em;
+      margin: 0;
+      z-index: -1;
+
+      @include mobile-landscape {
+        padding: 100px 20px;
+      }
+
+    }
+
+    .tool-nav {
+      position: fixed;
+      top: 20px;
+      right: 70px;
+      margin: 8px 0 0 0;
+
+      @include mobile-landscape {
+        width: 100%;
+        padding-left: 150px;
+      }
+
+      li {
+        float: right;
+        margin: 0 16px 0 0;
+        padding: 0;
+
+        @include mobile-landscape {
+          float: none;
+        }
+
+        &.user {
+          margin-top: -2px;
+
+          @include mobile-landscape {
+            position: fixed;
+            bottom: 0;
+            width: 100%;
+            left: 0;
+            padding: 15px;
+            background-color: fade-out(#000, .05);
+          }
+        }
+      }
+    }
+
+    .dropdown {
+      margin-top: 8px;
+      margin-bottom: 16px;
+      visibility: visible;
+      opacity: 1;
+      width: 100%;
+
+      li {
+        display: block;
+        font-size: 1.25em;
+
+        a {
+          color: fade-out(white, .2);
+          font-weight: 500;
+
+          &:hover {
+            color: $secondary-color;
+          }
+        }
+      }
+
+      &.more {
+        margin-top: 35px;
+        text-align: left;
+        position: relative;
+
+        .more-title {
+          color: $primary-color;
+          border-bottom: 1px solid $primary-color;
+        }
+
+        .btn-default {
+          background: transparent;
+          color: white;
+        }
+
+        .more-blog {
+
+          h3,
+          h3 a {
+            color: white;
+          }
+
+          p {
+            color: fade-out(#fff, .2);
+
+            a {
+              color: #fff;
+            }
+          }
+        }
+      }
+
+    }
+
+
+    li {
+
+      &.has-dropdown {
+
+        .dropdown {
+          margin-top: 8px;
+          margin-bottom: 16px;
+
+          &.more {
+            margin-bottom: 0;
+          }
+        }
+
+        > a {
+          &:after {
+            display: none;
+          }
+        }
+      }
+
+      > a {
+        color: fade-out(white, .1);
+
+        &:hover {
+          color: white;
+        }
+
+        &.highlight {
+          background: $primary-color;
+          padding: 9px 12px;
+        }
+      }
+
+      .more-link {
+        display: none;
+      }
+    }
+
+    .mobile-nav {
+      position: fixed;
+    }
+
+  }
+
+  .mobile-nav {
+    display: none;
+    position: absolute;
+    top: 32px;
+    right: 23px;
+    z-index: 12;
+
+    @include tablet-landscape {
+      display: block;
+    }
+  }
+
+  .site-search {
+    position: relative;
+    display: block;
+    float: right;
+    margin-top: -2px;
+    margin-right: -10px;
+
+    @include mobile-landscape {
+      float: none;
+    }
+
+    .gsc-input input.gsc-input {
+      width: 145px !important;
+      background: fade-out(#fff, .9) !important;
+      color: white;
+      color: fade-out(white, .5);
+      font-size: 13px !important;
+      @include transition(.15s ease-in-out);
+      -webkit-font-smoothing: subpixel-antialiased;
+
+      @include mobile-landscape {
+        width: 100% !important;
+      }
+
+      &:hover {
+        box-shadow: 0;
+      }
+
+      &:focus {
+        background: fade-out(#fff, .1) !important;
+        color: #222;
+
+        @include screen(min-width, 1110px) {
+          width: 200px !important;
+        }
+      }
+    }
+
+    .gsc-search-button {
+      // Temporary
+      input {
+        display: none;
+      }
+    }
+  }
+}
+
+#logo {
+  float: left;
+  font-size: 1em;
+  margin: 0;
+
+  a {
+    @include hide-text;
+    @include size(143px 40px);
+    background-image: url(logo.svg);
+    display: block;
+    background-repeat: no-repeat;
+  }
+}
+
+.prop-label {
+  display: block;
+  float: left;
+  padding: .7em 0 0 .8em;
+  font-size: 1.25em;
+  font-weight: 400;
+}
+
+#hero {
+  @include background-image(radial-gradient(0% bottom, ellipse, rgba(118, 72, 160, 0.7) 0%, rgba(118, 72, 160, 0) 60%),
+                            radial-gradient(90% bottom, ellipse, rgba(82, 63, 140, 1) 0%, rgba(82, 63, 140, 0) 40%));
+
+  color: lighten($primary-color, 30%);
+
+  .wrapper {
+    padding-bottom: 5.625em;
+    padding-top: 4em;
+  }
+
+  .button {
+    @include background-image(linear-gradient(#FFFFFF, #E7E4EE));
+    background-color: white;
+    color: darken($primary-color, 10%);
+    display: inline-block;
+    min-width: 240px;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
+  }
+
+  h1,
+  h2 {
+    -webkit-font-smoothing: antialiased;
+  }
+
+  h1 {
+    margin: 0;
+    color: white;
+    font-size: 2em;
+  }
+
+  h2 {
+    color: inherit;
+    font-weight: 400;
+    line-height: 1.5em;
+    margin: 0.4em 0 2em;
+  }
+
+  small {
+    display: block;
+    margin-top: 0.4em;
+  }
+}
+
+body.purple {
+  background-color: #3B2F63;
+  @include background-image(radial-gradient(50% top, circle, rgba(84, 90, 182, 0.6) 0%, rgba(84, 90, 182, 0) 75%),
+                            radial-gradient(right top, circle, rgba(121, 74, 162, 1) 0%, rgba(121, 74 ,162, 0) 57%));
+  background-repeat: no-repeat;
+  background-size: 100% 1000px;
+  color: lighten($primary-color, 30%);
+  margin: 0;
+  padding: 0;
+
+  #header {
+    background: transparent;
+  }
+
+  .page-content {
+    background: transparent;
+  }
+}