how-it-works section finished

docs/assets/scripts/Vendor.js

@@ -0,0 +1 @@
+!function(e){var n={};function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:o})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(t.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var r in e)t.d(o,r,function(n){return e[n]}.bind(null,r));return o},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=1)}([,function(e,n,t){"use strict";t.r(n);t(2)},function(e,n){!function(e,n,t,o){var r=[],s={_version:"3.11.3",_config:{classPrefix:"",enableClasses:!0,enableJSClass:!0,usePrefixes:!0},_q:[],on:function(e,n){var t=this;setTimeout((function(){n(t[e])}),0)},addTest:function(e,n,t){r.push({name:e,fn:n,options:t})},addAsyncTest:function(e){r.push({name:null,fn:e})}},a=function(){};a.prototype=s,a=new a;var i=[];var l=t.documentElement,f="svg"===l.nodeName.toLowerCase();!function(){var e,n,t,o,s,l;for(var f in r)if(r.hasOwnProperty(f)){if(e=[],(n=r[f]).name&&(e.push(n.name.toLowerCase()),n.options&&n.options.aliases&&n.options.aliases.length))for(t=0;t<n.options.aliases.length;t++)e.push(n.options.aliases[t].toLowerCase());for(o=typeof n.fn==="function"?n.fn():n.fn,s=0;s<e.length;s++)1===(l=e[s].split(".")).length?a[l[0]]=o:(a[l[0]]&&(!a[l[0]]||a[l[0]]instanceof Boolean)||(a[l[0]]=new Boolean(a[l[0]])),a[l[0]][l[1]]=o),i.push((o?"":"no-")+l.join("-"))}}(),function(e){var n=l.className,t=a._config.classPrefix||"";if(f&&(n=n.baseVal),a._config.enableJSClass){var o=new RegExp("(^|\\s)"+t+"no-js(\\s|$)");n=n.replace(o,"$1"+t+"js$2")}a._config.enableClasses&&(e.length>0&&(n+=" "+t+e.join(" "+t)),f?l.className.baseVal=n:l.className=n)}(i),delete s.addTest,delete s.addAsyncTest;for(var u=0;u<a._q.length;u++)a._q[u]();e.Modernizr=a}(window,window,document)}]);

docs/assets/styles/style.css

@@ -0,0 +1,951 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+/* Document
+   ========================================================================== */
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+html {
+  line-height: 1.15;
+  /* 1 */
+  -webkit-text-size-adjust: 100%;
+  /* 2 */ }
+
+/* Sections
+   ========================================================================== */
+/**
+ * Remove the margin in all browsers.
+ */
+body {
+  margin: 0; }
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+main {
+  display: block; }
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0; }
+
+/* Grouping content
+   ========================================================================== */
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+hr {
+  box-sizing: content-box;
+  /* 1 */
+  height: 0;
+  /* 1 */
+  overflow: visible;
+  /* 2 */ }
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+pre {
+  font-family: monospace, monospace;
+  /* 1 */
+  font-size: 1em;
+  /* 2 */ }
+
+/* Text-level semantics
+   ========================================================================== */
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+a {
+  background-color: transparent; }
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+abbr[title] {
+  border-bottom: none;
+  /* 1 */
+  text-decoration: underline;
+  /* 2 */
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+  /* 2 */ }
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+b,
+strong {
+  font-weight: bolder; }
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+code,
+kbd,
+samp {
+  font-family: monospace, monospace;
+  /* 1 */
+  font-size: 1em;
+  /* 2 */ }
+
+/**
+ * Add the correct font size in all browsers.
+ */
+small {
+  font-size: 80%; }
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline; }
+
+sub {
+  bottom: -0.25em; }
+
+sup {
+  top: -0.5em; }
+
+/* Embedded content
+   ========================================================================== */
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+img {
+  border-style: none; }
+
+/* Forms
+   ========================================================================== */
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit;
+  /* 1 */
+  font-size: 100%;
+  /* 1 */
+  line-height: 1.15;
+  /* 1 */
+  margin: 0;
+  /* 2 */ }
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+button,
+input {
+  /* 1 */
+  overflow: visible; }
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+button,
+select {
+  /* 1 */
+  text-transform: none; }
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button; }
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0; }
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText; }
+
+/**
+ * Correct the padding in Firefox.
+ */
+fieldset {
+  padding: 0.35em 0.75em 0.625em; }
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+legend {
+  box-sizing: border-box;
+  /* 1 */
+  color: inherit;
+  /* 2 */
+  display: table;
+  /* 1 */
+  max-width: 100%;
+  /* 1 */
+  padding: 0;
+  /* 3 */
+  white-space: normal;
+  /* 1 */ }
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+progress {
+  vertical-align: baseline; }
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+textarea {
+  overflow: auto; }
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box;
+  /* 1 */
+  padding: 0;
+  /* 2 */ }
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto; }
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+[type="search"] {
+  -webkit-appearance: textfield;
+  /* 1 */
+  outline-offset: -2px;
+  /* 2 */ }
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none; }
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  /* 1 */
+  font: inherit;
+  /* 2 */ }
+
+/* Interactive
+   ========================================================================== */
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+details {
+  display: block; }
+
+/*
+ * Add the correct display in all browsers.
+ */
+summary {
+  display: list-item; }
+
+/* Misc
+   ========================================================================== */
+/**
+ * Add the correct display in IE 10+.
+ */
+template {
+  display: none; }
+
+/**
+ * Add the correct display in IE 10.
+ */
+[hidden] {
+  display: none; }
+
+@font-face {
+  font-family: "CocogooseNormal";
+  src: url("../media/fonts/cocogoose/Cocogoose_medium.ttf") format("truetype"); }
+
+@font-face {
+  font-family: "CocogooseLight";
+  src: url("../media/fonts/cocogoose/Cocogoose_light.ttf") format("truetype"); }
+
+@font-face {
+  font-family: "CocogooseBold";
+  src: url("../media/fonts/cocogoose/Cocogoose_bold.ttf") format("truetype"); }
+
+@font-face {
+  font-family: "CocogooseExtra";
+  src: url("../media/fonts/cocogoose/Cocogoose_extraBold.ttf") format("truetype"); }
+
+@font-face {
+  font-family: "BS-regular";
+  src: url("../media/fonts/bahnschrift/BS_Static_Regular.ttf") format("truetype"); }
+
+@font-face {
+  font-family: "BS-light";
+  src: url("../media/fonts/bahnschrift/BS_Static_Light.ttf") format("truetype"); }
+
+@font-face {
+  font-family: "BS-bold";
+  src: url("../media/fonts/bahnschrift/BS_Static_Bold.ttf") format("truetype"); }
+
+* {
+  box-sizing: border-box; }
+
+body {
+  position: relative;
+  font-family: 'roboto', sans-serif;
+  color: #333; }
+
+img {
+  max-width: 100%;
+  height: auto; }
+
+.site-header {
+  position: fixed;
+  width: 100%;
+  z-index: 2;
+  transition: background-color .3s ease-out; }
+  .site-header--is-expanded {
+    background-color: orange;
+    padding-bottom: 18px; }
+  @media (min-width: 800px) {
+    .site-header {
+      position: absolute;
+      position: fixed;
+      background-color: rgba(0, 0, 0, 0.4); } }
+  @media (min-width: 800px) {
+    .site-header__btn-container {
+      padding: 32px 0px 32px 0px;
+      float: right; } }
+  .site-header__language {
+    position: absolute;
+    top: 10px;
+    left: -5px;
+    border-radius: 15px;
+    overflow: hidden;
+    width: 25px;
+    height: 25px; }
+    @media (min-width: 800px) {
+      .site-header__language {
+        position: unset;
+        margin: 40px 20px 0px 0px;
+        float: right; } }
+  .site-header__menu-icon {
+    width: 20px;
+    height: 19px;
+    position: absolute;
+    z-index: 10;
+    top: 10px;
+    right: 10px; }
+    .site-header__menu-icon::before {
+      content: "";
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 20px;
+      height: 3px;
+      background: #FFF;
+      transform-origin: 0 0;
+      transition: transform .3s ease-out; }
+    .site-header__menu-icon__middle {
+      position: absolute;
+      top: 8px;
+      left: 0;
+      width: 20px;
+      height: 3px;
+      background: #FFF;
+      transition: all .3s ease-out;
+      transform-origin: 0 50%; }
+    .site-header__menu-icon::after {
+      content: "";
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 20px;
+      height: 3px;
+      background: #FFF;
+      transform-origin: 0 100%;
+      transition: transform .3s ease-out; }
+    @media (min-width: 800px) {
+      .site-header__menu-icon {
+        display: none; } }
+  .site-header__menu-icon--close-x::before {
+    transform: rotate(45deg) scaleX(1.25); }
+  .site-header__menu-icon--close-x .site-header__menu-icon__middle {
+    transform: scaleX(0);
+    opacity: 0; }
+  .site-header__menu-icon--close-x::after {
+    transform: rotate(-45deg) scaleX(1.25) translateY(1px); }
+  .site-header__menu-content {
+    opacity: 0;
+    transform: scale(1.2);
+    transtion: all .3s ease-out;
+    position: relative;
+    z-index: -10;
+    padding-top: 90px;
+    text-align: center;
+    display: none; }
+    .site-header__menu-content--is-visible {
+      display: block;
+      transform: scale(1);
+      opacity: 1;
+      z-index: 1; }
+    @media (min-width: 800px) {
+      .site-header__menu-content {
+        display: inline;
+        opacity: 1;
+        z-index: 1;
+        padding-top: 0;
+        transform: scale(1); } }
+  .site-header__logo {
+    position: absolute;
+    top: -1px;
+    padding: 5px 15px;
+    left: 50%;
+    transform-origin: 50% 0%;
+    transform: translateX(-50%) scale(0.8);
+    transition: transform .3s ease-out;
+    background-color: rgba(0, 0, 0, 0.5); }
+    .site-header__logo--orange-bg {
+      transition: background-color .3s ease-out;
+      background-color: orange; }
+    @media (min-width: 800px) {
+      .site-header__logo {
+        padding: 0;
+        top: 3px;
+        position: relative;
+        float: left;
+        left: auto;
+        transform: translateX(0);
+        background-color: rgba(0, 0, 0, 0); } }
+
+.primary-nav {
+  padding-top: 10px; }
+  @media (min-width: 800px) {
+    .primary-nav {
+      padding: 22px 0px; } }
+  @media (min-width: 800px) {
+    .primary-nav--pull-right {
+      float: right; } }
+  .primary-nav ul {
+    margin: 0;
+    padding: 0; }
+    .primary-nav ul::after {
+      content: "";
+      clear: both;
+      display: table; }
+  .primary-nav li {
+    list-style: none;
+    display: inline-block;
+    padding-right: 7px;
+    padding-top: 10px; }
+    @media (min-width: 800px) {
+      .primary-nav li {
+        float: left;
+        display: block;
+        padding-right: 20px; } }
+  .primary-nav li:last-child {
+    padding-right: 0; }
+    @media (min-width: 800px) {
+      .primary-nav li:last-child {
+        padding-right: 20px; } }
+  .primary-nav a {
+    color: #fff;
+    font-weight: 400;
+    text-decoration: none;
+    display: block;
+    padding: 5px 8px;
+    font-size: .8rem;
+    background: rgba(0, 0, 0, 0.5);
+    border-radius: 30px; }
+    @media (min-width: 800px) {
+      .primary-nav a {
+        background: transparent;
+        font-size: 1.10rem;
+        padding: 12px 0; }
+        .primary-nav a.is-current-link {
+          color: #fabb69; } }
+
+.btn {
+  background-color: #00ab00;
+  color: #fff;
+  text-decoration: none;
+  padding: .75rem 1.2rem;
+  display: inline-block;
+  border-radius: 30px; }
+  .btn--l-margin {
+    margin-left: 20px; }
+  .btn--medium {
+    margin-bottom: 1.5rem; }
+    @media (min-width: 530px) {
+      .btn--medium {
+        font-size: 1.1rem; } }
+  .btn--large {
+    padding: 1.1rem 1.9rem; }
+    @media (min-width: 530px) {
+      .btn--large {
+        font-size: 1.25rem; } }
+
+.large-hero {
+  border-bottom: 10px solid orange;
+  text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
+  position: relative; }
+  .large-hero__image {
+    display: block; }
+  .large-hero__text-content {
+    position: absolute;
+    top: 50%;
+    left: 0px;
+    width: 100%;
+    transform: translateY(-50%);
+    text-align: center; }
+    @media (min-width: 800px) {
+      .large-hero__text-content {
+        padding-top: 60px; } }
+  .large-hero__title {
+    font-family: "CocogooseBold";
+    color: white;
+    font-size: 2.2rem;
+    margin: 0; }
+    @media (min-width: 530px) {
+      .large-hero__title {
+        font-size: 3.2rem; } }
+    @media (min-width: 800px) {
+      .large-hero__title {
+        font-size: 4.8rem; } }
+  .large-hero__subtitle {
+    font-weight: 400;
+    color: white;
+    font-size: 1.3rem;
+    margin: 0; }
+    @media (min-width: 530px) {
+      .large-hero__subtitle {
+        font-size: 1.8rem; } }
+    @media (min-width: 800px) {
+      .large-hero__subtitle {
+        font-size: 2.4rem; } }
+  .large-hero__description {
+    color: #FFF;
+    font-weight: 00;
+    font-size: 1.1rem;
+    max-width: 50rem;
+    margin-left: auto;
+    margin-right: auto; }
+    @media (min-width: 530px) {
+      .large-hero__description {
+        font-size: 1.3rem; } }
+    @media (min-width: 800px) {
+      .large-hero__description {
+        font-size: 1.875rem; } }
+
+.wrapper {
+  overflow: hidden;
+  padding-left: 18px;
+  padding-right: 18px;
+  max-width: 1300px;
+  margin-left: auto;
+  margin-right: auto; }
+  .wrapper--medium {
+    max-width: 976px; }
+  .wrapper--centered {
+    text-align: center; }
+    @media (min-width: 1200px) {
+      .wrapper--centered {
+        text-align: left; } }
+  .wrapper--small {
+    max-width: 750px; }
+
+.page-section {
+  position: relative; }
+  .page-section--t-margin-external {
+    margin-top: -70px; }
+  @media (min-width: 800px) {
+    .page-section--b-margin-external {
+      margin-bottom: -140px; } }
+  .page-section--tb-padding {
+    padding: 1.2rem 0; }
+    @media (min-width: 800px) {
+      .page-section--tb-padding {
+        position: unset;
+        padding: 4.5rem 0; } }
+  .page-section--t-padding {
+    padding-top: 5.2rem; }
+    @media (min-width: 800px) {
+      .page-section--t-padding {
+        position: unset;
+        padding-top: 4.5rem; } }
+    .page-section--t-padding-larger {
+      padding-top: 5.2rem; }
+      @media (min-width: 800px) {
+        .page-section--t-padding-larger {
+          position: unset;
+          padding-top: 6rem; } }
+  .page-section--b-padding-small {
+    padding-bottom: 1rem; }
+    @media (min-width: 800px) {
+      .page-section--b-padding-small {
+        position: unset;
+        padding-top: 3.8rem; } }
+  .page-section--b-margin {
+    margin-bottom: 70px; }
+    @media (min-width: 800px) {
+      .page-section--b-margin {
+        margin-bottom: -140px; } }
+  .page-section--red {
+    background-color: #FF3D04;
+    color: #fff; }
+  .page-section--darkGreen {
+    background-color: #6F9C3D;
+    color: #fff; }
+  .page-section--lightGreen {
+    background-color: #A5C90F;
+    color: #fff; }
+
+.headline {
+  margin: auto; }
+  .headline strong {
+    font-weight: 800; }
+  .headline--lt-margin {
+    margin-top: -5px; }
+    @media (min-width: 1200px) {
+      .headline--lt-margin {
+        margin-left: 55px; } }
+  .headline--s-width {
+    max-width: 500px; }
+    @media (min-width: 800px) {
+      .headline--s-width {
+        max-width: 1000px; } }
+  .headline__title {
+    font-weight: 400;
+    font-size: 1.6rem; }
+    @media (min-width: 800px) {
+      .headline__title {
+        font-size: 2.1rem; } }
+  .headline__subtitle {
+    font-weight: 300;
+    font-size: 1.3rem; }
+    @media (min-width: 800px) {
+      .headline__subtitle {
+        font-size: 1.6rem; } }
+  .headline--centered {
+    text-align: center; }
+  .headline--lightGreen {
+    color: #A5C90F; }
+  .headline--orange {
+    color: #FF9F2F; }
+  .headline--b-margin {
+    margin-bottom: 2.5rem; }
+    @media (min-width: 800px) {
+      .headline--b-margin {
+        margin-bottom: 4.5rem; } }
+  .headline a {
+    font-weight: 400; }
+
+.row {
+  /* Begin Equal Height Rules */ }
+  .row::after {
+    content: "";
+    clear: both;
+    display: table; }
+  .row--large-only {
+    display: none; }
+    @media (min-width: 1200px) {
+      .row--large-only {
+        display: inline-block; } }
+  .row--gutters {
+    margin-right: -60px; }
+  .row--gutters > div {
+    padding-right: 60px; }
+  @media (min-width: 1200px) {
+    .row__medium-3--larger {
+      float: left;
+      width: 30%; }
+    .row__medium-4 {
+      float: left;
+      width: 33.33%; }
+    .row__medium-6 {
+      float: left;
+      width: 50%; }
+    .row__medium-8 {
+      float: right;
+      width: 66.66%; }
+    .row__medium-9--smaller {
+      float: right;
+      width: 70%; } }
+  @media (min-width: 800px) {
+    .flexbox .row--equal-height-at-medium {
+      display: flex; } }
+  .flexbox .row--equal-height-at-medium > div {
+    float: none;
+    display: flex; }
+  @media (min-width: 800px) {
+    .flexbox .row--equal-height-at-large {
+      display: flex; } }
+  .flexbox .row--equal-height-at-large > div {
+    float: none;
+    display: flex; }
+
+.generic-content-container--t-b-margin {
+  margin-top: 4rem;
+  margin-bottom: 2.5rem; }
+  @media (min-width: 1200px) {
+    .generic-content-container--t-b-margin {
+      margin-top: 5rem;
+      margin-bottom: 0px; } }
+
+.generic-content-container--t-center {
+  text-align: center; }
+
+.generic-content-container p {
+  font-weight: 300;
+  line-height: 1.25;
+  margin: 0;
+  font-size: 1.1rem; }
+  @media (min-width: 800px) {
+    .generic-content-container p {
+      margin: 0 0 1.8rem 0;
+      font-size: 1.4rem; } }
+
+.generic-content-container p a {
+  font-weight: 700; }
+
+.video-container {
+  position: relative;
+  padding-bottom: 63.15%;
+  height: 0;
+  overflow: hidden;
+  box-shadow: -3px 3px 10px #000000ba;
+  margin-right: -18px;
+  margin-left: -18px; }
+  @media (min-width: 530px) {
+    .video-container {
+      padding-bottom: 60%; } }
+  @media (min-width: 800px) {
+    .video-container {
+      padding-bottom: 59%; } }
+  @media (min-width: 1200px) {
+    .video-container {
+      padding-bottom: 56.25%;
+      margin-right: 0px;
+      margin-left: 0px; } }
+
+.video-container video {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%; }
+
+.how-it-works {
+  margin-bottom: 2.5rem; }
+  .how-it-works strong {
+    font-weight: 800; }
+  .how-it-works--atSmall-centered {
+    text-align: center; }
+    @media (min-width: 1200px) {
+      .how-it-works--atSmall-centered {
+        text-align: left; } }
+  .how-it-works--atSmall-t-margin {
+    margin-top: 6rem !important; }
+    @media (min-width: 800px) {
+      .how-it-works--atSmall-t-margin {
+        margin-top: 4rem !important; } }
+    @media (min-width: 1200px) {
+      .how-it-works--atSmall-t-margin {
+        margin-top: 100px; } }
+  .how-it-works--centered {
+    position: absolute;
+    top: 0px;
+    width: 100%;
+    text-align: center; }
+  @media (min-width: 530px) {
+    .how-it-works--t-margin {
+      margin-top: 10px; } }
+  @media (min-width: 800px) {
+    .how-it-works--t-margin {
+      margin-top: -45px; } }
+  .how-it-works__last-section {
+    padding: 3rem 0px 50px 0px;
+    background-color: rgba(255, 255, 255, 0.9); }
+    @media (min-width: 1200px) {
+      .how-it-works__last-section {
+        padding: 100px 0px 50px 0px; } }
+  .how-it-works p {
+    font-weight: 300;
+    line-height: 1.25;
+    margin: 0;
+    font-size: 1.2rem; }
+    @media (min-width: 800px) {
+      .how-it-works p {
+        margin: 0 0 1.8rem 0;
+        font-size: 1.4rem; } }
+  .how-it-works__title {
+    font-weight: 300;
+    font-size: 1.7rem;
+    margin-bottom: 45px; }
+    @media (min-width: 800px) {
+      .how-it-works__title {
+        margin-top: 10px;
+        font-size: 2.1rem; } }
+  .how-it-works__title-small {
+    font-weight: 300;
+    font-size: 1.4rem;
+    margin-bottom: 45px; }
+    @media (min-width: 800px) {
+      .how-it-works__title-small {
+        margin-top: 10px;
+        font-size: 2.1rem; } }
+  .how-it-works__img--small-only {
+    display: inline-block;
+    margin: 10px 0px; }
+    @media (min-width: 1200px) {
+      .how-it-works__img--small-only {
+        display: none; } }
+  .how-it-works__icon--1 {
+    width: 150px; }
+    @media (min-width: 800px) {
+      .how-it-works__icon--1 {
+        width: 200px; } }
+    @media (min-width: 1200px) {
+      .how-it-works__icon--1 {
+        width: 225px;
+        margin-left: 80px; } }
+  .how-it-works__icon--2 {
+    width: 100px;
+    margin-right: .8rem;
+    margin-bottom: -35px; }
+  .how-it-works__icon--3 {
+    width: 100px;
+    margin-right: .8rem;
+    margin-bottom: -30px;
+    margin-top: 1.2rem; }
+    @media (min-width: 800px) {
+      .how-it-works__icon--3 {
+        margin-top: 3.2rem; } }
+    @media (min-width: 1200px) {
+      .how-it-works__icon--3 {
+        margin-top: 0rem; } }
+  .how-it-works__icon--4 {
+    width: 100px;
+    margin-bottom: -30px;
+    margin-right: 20px; }
+
+.arrow {
+  width: 0;
+  height: 0;
+  border-left: 70px solid transparent;
+  border-right: 70px solid transparent; }
+  .arrow--about {
+    position: absolute;
+    bottom: -60px;
+    z-index: 1;
+    left: 50%;
+    transform: translateX(-50%); }
+    @media (min-width: 800px) {
+      .arrow--about {
+        position: relative;
+        bottom: -40px;
+        left: 50%;
+        transform: translateX(-50%); } }
+    @media (min-width: 1200px) {
+      .arrow--about {
+        position: relative;
+        bottom: -70px;
+        left: 50%;
+        transform: translateX(-50%); } }
+  .arrow--how-it-works-1 {
+    position: absolute;
+    bottom: -60px;
+    z-index: 1;
+    left: 50%;
+    transform: translateX(-50%); }
+    @media (min-width: 800px) {
+      .arrow--how-it-works-1 {
+        position: relative;
+        bottom: -30px;
+        left: 50%;
+        transform: translateX(-50%); } }
+    @media (min-width: 1200px) {
+      .arrow--how-it-works-1 {
+        position: relative;
+        bottom: -30px;
+        left: 70%;
+        transform: translateX(-50%); } }
+  .arrow--how-it-works-2 {
+    position: absolute;
+    bottom: -60px;
+    z-index: 1;
+    left: 50%;
+    transform: translateX(-50%); }
+    @media (min-width: 800px) {
+      .arrow--how-it-works-2 {
+        position: relative;
+        bottom: 0px;
+        left: 50%;
+        transform: translateX(-50%); } }
+    @media (min-width: 1200px) {
+      .arrow--how-it-works-2 {
+        position: relative;
+        bottom: 0px;
+        left: 50%;
+        transform: translateX(-50%); } }
+  .arrow--red {
+    border-top: 85px solid #FF3D04; }
+  .arrow--darkGreen {
+    border-top: 85px solid #6F9C3D; }
+  .arrow--lightGreen {
+    border-top: 85px solid #A5C90F; }
+
+.footer {
+  position: absolute;
+  bottom: -40px;
+  width: 100%;
+  background-color: #FF3D04;
+  color: white;
+  text-align: center; }
+
+/*# sourceMappingURL=style.css.map */