@import url("https://fonts.googleapis.com/css?family=Eczar|Lato&display=swap");
/* line 7, ../scss/styles.scss */
html,
body {
  margin: 0;
  padding: 0;
}

/* line 13, ../scss/styles.scss */
body {
  background-color: #000;
  font-family: 'Lato', sans-serif;
  margin: 0;
  color: #ddd;
}
/* line 18, ../scss/styles.scss */
body a {
  color: #ddd;
}

/* line 23, ../scss/styles.scss */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Eczar', serif;
  margin: 0;
  padding: 0;
  line-height: 2;
}

/* line 33, ../scss/styles.scss */
p {
  line-height: 1.6;
}

/* line 38, ../scss/styles.scss */
ul li {
  line-height: 1.4;
}

/* line 43, ../scss/styles.scss */
section {
  box-sizing: border-box;
}
/* line 45, ../scss/styles.scss */
section > div {
  max-width: 960px;
  margin: 0 auto;
  display: block;
}

/* line 52, ../scss/styles.scss */
#introduction {
  min-height: 100vh;
  color: #ddd;
  padding: 2em 0;
}
/* line 58, ../scss/styles.scss */
#introduction img.logo {
  margin-top: 2em;
}
/* line 62, ../scss/styles.scss */
#introduction .backdrop {
  background-color: rgba(0, 0, 0, 0.7);
  padding: 2em;
  margin: 6em 2em 6em 2em;
}
@media (max-width: 768px) {
  /* line 52, ../scss/styles.scss */
  #introduction {
    background-image: url("../images/road_leading_to_sunset.jpg");
  }
}
@media (min-width: 768px) {
  /* line 72, ../scss/styles.scss */
  #introduction::after {
    background-image: url("../images/road_leading_to_sunset.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
  }
}

@media only screen and (min-width: 768px) {
  /* line 84, ../scss/styles.scss */
  .mobile-only {
    display: none;
  }
}
/* line 89, ../scss/styles.scss */
img {
  max-width: 100%;
}

/* line 93, ../scss/styles.scss */
#what-is-the-clearinghouse {
  background: #020024;
  background: linear-gradient(23deg, #020024 0%, #090979 35%, #00d4ff 100%);
}
/* line 97, ../scss/styles.scss */
#what-is-the-clearinghouse > div {
  color: #ddd;
  padding: 2em;
}
/* line 101, ../scss/styles.scss */
#what-is-the-clearinghouse > div img {
  margin-top: 6em;
  display: none;
}
@media only screen and (min-width: 768px) {
  /* line 112, ../scss/styles.scss */
  #what-is-the-clearinghouse > div img {
    display: none;
  }
}

/* line 121, ../scss/styles.scss */
#what-do-i-do {
  margin: 4em 0;
  padding: 0;
  color: #111;
}
/* line 125, ../scss/styles.scss */
#what-do-i-do a {
  color: #111;
}
/* line 129, ../scss/styles.scss */
#what-do-i-do h2 {
  padding: 2em 1em 0 1.25em;
}
/* line 133, ../scss/styles.scss */
#what-do-i-do h3 {
  padding: 2em 1em 0 1.5em;
}
/* line 138, ../scss/styles.scss */
#what-do-i-do .backdrop p {
  padding: 0 2em;
}
/* line 144, ../scss/styles.scss */
#what-do-i-do .backdrop {
  background-color: rgba(221, 221, 221, 0.9);
}
@media only screen and (min-width: 768px) {
  /* line 149, ../scss/styles.scss */
  #what-do-i-do .backdrop {
    background-color: rgba(221, 221, 221, 0.9);
    margin: 0;
    padding: 4em;
  }
}
/* line 156, ../scss/styles.scss */
#what-do-i-do::after {
  background-image: url("../images/trucks.jpg");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* line 165, ../scss/styles.scss */
#key-points,
#additional-notes {
  background: #a7a5cd;
  background: linear-gradient(112deg, #a7a5cd 0%, #ffffb9 35%, #b9f3ff 100%);
  padding: 4em 2em;
  color: #333;
}
/* line 172, ../scss/styles.scss */
#key-points a,
#additional-notes a {
  color: #333;
}
@media only screen and (max-width: 768px) {
  /* line 176, ../scss/styles.scss */
  #key-points ul,
  #additional-notes ul {
    padding-left: 0;
    margin-left: 0;
    margin: 0;
  }
}
/* line 182, ../scss/styles.scss */
#key-points ul li,
#additional-notes ul li {
  padding-bottom: 1em;
  margin-left: 0;
  padding-left: 0;
}

/* line 190, ../scss/styles.scss */
#additional-notes {
  background: #d0d0d0;
  background: -moz-linear-gradient(59deg, #d0d0d0 0%, #005c88 16%, #270088 100%);
  background: -webkit-linear-gradient(59deg, #d0d0d0 0%, #005c88 16%, #270088 100%);
  background: linear-gradient(59deg, #d0d0d0 0%, #005c88 16%, #270088 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d0d0d0",endColorstr="#270088",GradientType=1);
  color: #ddd;
}

@media (min-width: 768px) {
  /* line 199, ../scss/styles.scss */
  .grid-fifty-fifty {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

/* line 206, ../scss/styles.scss */
.call-to-action {
  text-align: center;
  border: solid 1px rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* line 216, ../scss/styles.scss */
ul#table-of-contents > li > a {
  font-size: 18px;
  line-height: 1.6;
  font-family: 'Eczar', serif;
}

/* line 223, ../scss/styles.scss */
.enroll-button {
  -moz-box-shadow: inset 0px 1px 0px 0px #a4e271;
  -webkit-box-shadow: inset 0px 1px 0px 0px #a4e271;
  box-shadow: inset 0px 1px 0px 0px #a4e271;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
  background: -moz-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: -webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: -o-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: -ms-linear-gradient(top, #89c403 5%, #77a809 100%);
  background: linear-gradient(to bottom, #89c403 5%, #77a809 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
  background-color: #89c403;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #74b807;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  padding: 20px 60px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #528009;
}
/* line 248, ../scss/styles.scss */
.enroll-button:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77a809), color-stop(1, #89c403));
  background: -moz-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: -webkit-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: -o-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: -ms-linear-gradient(top, #77a809 5%, #89c403 100%);
  background: linear-gradient(to bottom, #77a809 5%, #89c403 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809', endColorstr='#89c403',GradientType=0);
  background-color: #77a809;
}
/* line 258, ../scss/styles.scss */
.enroll-button:active {
  position: relative;
  top: 1px;
}

@media (min-width: 768px) {
  /* line 264, ../scss/styles.scss */
  .wrapper {
    /* The height needs to be set to a fixed value for the effect to work.
     * 100vh is the full height of the viewport. */
    height: 100vh;
    /* The scaling of the images would add a horizontal scrollbar, so disable x overflow. */
    overflow-x: hidden;
    /* Enable scrolling on the page. */
    overflow-y: auto;
    /* Set the perspective to 2px. This is essentailly the simulated distance from the viewport to transformed objects.*/
    perspective: 2px;
  }
}

@media (min-width: 768px) {
  /* line 278, ../scss/styles.scss */
  .section {
    /* Needed for children to be absolutely positioned relative to the parent. */
    position: relative;
    /* The height of the container. Must be set, but it doesn't really matter what the value is. */
    min-height: 100vh;
    /* For text formatting. */
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media (min-width: 768px) {
  /* line 292, ../scss/styles.scss */
  .parallax::after {
    /* Display and position the pseudo-element */
    content: " ";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    /* Move the pseudo-element back away from the camera,
     * then scale it back up to fill the viewport.
     * Because the pseudo-element is further away, it appears to move more slowly, like in real life. */
    transform: translateZ(-1px) scale(1.5);
    /* Force the background image to fill the whole element. */
    background-size: 100%;
    /* Keep the image from overlapping sibling elements. */
    z-index: -1;
  }
}