@-webkit-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-moz-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-ms-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-o-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-webkit-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@-moz-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@-ms-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@-o-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@font-face {
  font-family: 'Lazer 84';
  src: url("../fonts/Lazer84.eot");
  src: url("../fonts/Lazer84.eot?#iefix") format("embedded-opentype"), url("../fonts/Lazer84.woff2") format("woff2"), url("../fonts/Lazer84.woff") format("woff"), url("../fonts/Lazer84.ttf") format("truetype"), url("../fonts/Lazer84.svg#Lazer84") format("svg");
  font-weight: normal;
  font-style: normal; }
/*# sourceMappingURL=grid.scss.map */
@font-face {
  font-family: 'Lazer 84';
  src: url("../fonts/Lazer84.eot");
  src: url("../fonts/Lazer84.eot?#iefix") format("embedded-opentype"), url("../fonts/Lazer84.woff2") format("woff2"), url("../fonts/Lazer84.woff") format("woff"), url("../fonts/Lazer84.ttf") format("truetype"), url("../fonts/Lazer84.svg#Lazer84") format("svg");
  font-weight: normal;
  font-style: normal; }
@-webkit-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-moz-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-ms-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-o-keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@keyframes rotate {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-webkit-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@-moz-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@-ms-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@-o-keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
@keyframes dots {
  0% {
    content: ''; }
  33% {
    content: '.'; }
  66% {
    content: '..'; }
  100% {
    content: '...'; } }
.lazy-loaded {
  background: transparent !important; }

.matrix ul {
  list-style-type: square;
  margin-left: 25px; }
@media (min-width: 769px) {
  .matrix {
    flex-wrap: wrap;
    display: flex;
    margin: 0 10%;
    justify-content: space-between;
    z-index: 100;
    align-items: baseline; } }
@media (min-width: 769px) {
  .matrix .desc-group {
    z-index: 100;
    width: 30%;
    padding: 2rem 0 2rem 0;
    min-height: 12rem;
    display: inline-flex;
    flex-direction: column;
    justify-content: flex-start; }
    .matrix .desc-group h1 {
      margin: 0 auto; }
    .matrix .desc-group .icon {
      align-self: center; } }
@media (min-width: 1160px) {
  .matrix .desc-group {
    padding: 2.5rem 0 2.5rem 0;
    min-height: 12rem; } }
@media (min-width: 1441px) {
  .matrix .desc-group {
    padding: 3rem 0 3rem 0;
    min-height: 16rem; } }
@media (max-width: 768px) {
  .matrix .desc-group {
    padding: 1rem 0 1rem 0;
    min-height: 10rem; } }
.matrix .desc-group img {
  min-height: 50px;
  margin-bottom: 25px;
  height: 6rem; }
  @media (max-width: 768px) {
    .matrix .desc-group img {
      display: none; } }
@media (min-width: 769px) {
  .matrix .desc-group:nth-of-type(1), .matrix .desc-group:nth-of-type(2) {
    border-bottom: 2px black dashed; } }
@media (min-width: 769px) {
  .matrix .desc-group:nth-of-type(1), .matrix .desc-group:nth-of-type(3) {
    margin-right: 15%; } }
@media (min-width: 769px) {
  .matrix .desc-group:nth-of-type(2), .matrix .desc-group:nth-of-type(4) {
    margin-left: 15%; } }
.matrix .matrix-paragraph {
  border: 3px dashed #f1da36;
  margin: 0rem 50px 1rem 50px;
  font-size: 1.1rem;
  line-height: 1.05rem;
  font-family: "brandon-grotesque";
  text-align: left;
  padding: .25rem .5rem;
  background: white; }
  .matrix .matrix-paragraph h4 {
    font-family: "brandon-grotesque";
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 0.5rem; }
@media (max-width: 768px) {
  .matrix .desc-group {
    display: none; } }
@media (min-width: 769px) {
  .matrix .mobile-group {
    display: none; } }

.section-mobile-only .matrix-flex {
  margin: 10px 75px 10px 75px;
  font-size: 1.1rem;
  line-height: 1rem;
  font-family: "brandon-grotesque";
  text-align: left;
  background: white;
  text-align: center; }
  .section-mobile-only .matrix-flex h4 {
    font-family: "brandon-grotesque";
    font-size: 1.1rem;
    font-weight: 400;
    margin-bottom: 0.5rem; }
.section-mobile-only .matrix-flex-item img {
  max-height: 40px;
  max-height: 6vh; }
.section-mobile-only .matrix-flex {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  min-height: 50vh; }
.section-mobile-only .matrix-flex-item {
  margin: 0.61rem 0 0 0; }
.section-mobile-only .matrix-flex-item img {
  display: block;
  margin: 0.25rem auto; }

* {
  margin: 0;
  padding: 0; }
  *:focus {
    outline: 0; }

.hidden {
  display: none !important; }

@media (max-width: 768px) {
  html, body {
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
    height: 100%; } }

body {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  cursor: default;
  overflow-x: hidden;
  letter-spacing: 0.01em;
  font-size: 14px; }

h1 {
  font-weight: 900;
  font-family: "brandon-grotesque"; }

#face {
  position: fixed;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 999;
  pointer-events: none;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%); }
  @media (max-width: 768px) {
    #face {
      width: 65%; } }
  @media (min-width: 769px) {
    #face {
      width: 35%; } }
  @media (min-width: 768px) and (max-width: 1023px) {
    #face {
      width: 65%; } }
  #face #backdrop {
    width: 100%; }
    #face #backdrop.spin {
      -webkit-animation: spin 2s infinite;
      -moz-animation: spin 2s infinite;
      -ms-animation: spin 2s infinite;
      -o-animation: spin 2s infinite;
      animation: spin 2s infinite; }
@-webkit-keyframes spin {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  25% {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg); }
  50% {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg); }
  75% {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg); }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-moz-keyframes spin {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  25% {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg); }
  50% {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg); }
  75% {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg); }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-ms-keyframes spin {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  25% {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg); }
  50% {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg); }
  75% {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg); }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@-o-keyframes spin {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  25% {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg); }
  50% {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg); }
  75% {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg); }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
@keyframes spin {
  0% {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); }
  25% {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg); }
  50% {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg); }
  75% {
    transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg); }
  100% {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg); } }
  #face #character {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%); }

.form .success {
  font-family: "brandon-grotesque";
  font-size: 1.5rem;
  text-align: left; }

#loading {
  position: fixed;
  z-index: 988;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 1;
  background: #15ffc9;
  -webkit-transition: ease 0.25s;
  -moz-transition: ease 0.25s;
  -ms-transition: ease 0.25s;
  -o-transition: ease 0.25s;
  transition: ease 0.25s; }
  #loading.exit {
    opacity: 0;
    pointer-events: none; }

#claphands {
  z-index: 10;
  position: fixed;
  bottom: 10%;
  left: 0;
  width: 33%; }
  @media (max-width: 768px) {
    #claphands {
      display: none; } }
  #claphands.hidden {
    display: none !important; }

.clap {
  font-family: "Lazer 84"; }
  @media (max-width: 768px) {
    .clap {
      text-align: center;
      font-size: 40px;
      margin-top: 20px; } }
  @media (min-width: 769px) {
    .clap {
      font-size: 115px;
      transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
      -webkit-transform: rotate(-10deg);
      left: -40vw;
      position: absolute;
      right: 0;
      top: -90px; } }

.content-container .section {
  height: 100vh;
  text-align: center;
  overflow: hidden; }
  @media (min-width: 769px) {
    .content-container .section .headline {
      position: absolute;
      left: 0;
      right: 0;
      margin: 0 auto;
      bottom: 60px; } }
  .content-container .section .headline h1 {
    text-align: center; }
  @media (max-width: 768px) {
    .content-container .section .logo {
      width: 65%;
      margin: 25px 25px 0 25px; } }
  @media (min-width: 769px) {
    .content-container .section .logo {
      margin-top: 50px;
      width: 600px; } }
  .content-container .section .graphic {
    z-index: -1;
    position: absolute; }
    @media (max-width: 768px) {
      .content-container .section .graphic {
        left: 0; } }
    @media (min-width: 769px) {
      .content-container .section .graphic {
        right: 0; } }
    @media (max-width: 768px) {
      .content-container .section .graphic.bear {
        bottom: -45%;
        width: 100%; } }
    @media (min-width: 769px) {
      .content-container .section .graphic.bear {
        height: 80%;
        right: -10%;
        bottom: 0; } }
    @media (max-width: 768px) {
      .content-container .section .graphic.disco {
        bottom: -35%;
        width: 100%; } }
    @media (min-width: 769px) {
      .content-container .section .graphic.disco {
        right: -10%;
        width: 50%;
        bottom: -20%; } }
    @media (max-width: 768px) {
      .content-container .section .graphic.pizza {
        bottom: -7%;
        width: 75%;
        margin: 0 auto;
        right: 0; } }
    @media (min-width: 769px) {
      .content-container .section .graphic.pizza {
        height: 80%;
        right: -5%;
        width: 50%;
        bottom: 0; } }
    .content-container .section .graphic.bird {
      right: -15%;
      bottom: -35px; }
      @media (max-width: 768px) {
        .content-container .section .graphic.bird {
          display: none; } }
      @media (min-width: 768px) and (max-width: 1023px) {
        .content-container .section .graphic.bird {
          right: -25%; } }
  .content-container .section .alt-color-bg {
    position: absolute;
    top: -200vh;
    left: 25vw;
    bottom: 0;
    right: 0;
    width: 200vw;
    z-index: -4;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg); }
    @media (max-width: 768px) {
      .content-container .section .alt-color-bg {
        display: none; } }
  .content-container .section .claphands {
    z-index: -1;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 33%;
    display: none; }
    @media (max-width: 768px) {
      .content-container .section .claphands {
        display: none; } }
  .content-container .section .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -3;
    background-size: cover !important;
    background-position: center !important; }
  .content-container .section:nth-of-type(1) {
    background-color: #ed145b; }
    .content-container .section:nth-of-type(1) .bg-img {
      background: url("https://astroshed.s3.amazonaws.com/clapboss.com/assets/img/bg/screen1_bg1.png"); }
    .content-container .section:nth-of-type(1) .alt-color-bg {
      background: -webkit-linear-gradient(to right, #fff200 50%, #06d3f8 50%);
      /* For Safari 5.1 to 6.0 */
      background: -o-linear-gradient(to right, #fff200 50%, #06d3f8 50%);
      /* For Opera 11.1 to 12.0 */
      background: -moz-linear-gradient(to right, #fff200 50%, #06d3f8 50%);
      /* For Firefox 3.6 to 15 */
      background: linear-gradient(to right, #fff200 50%, #06d3f8 50%);
      /* Standard syntax */ }
    @media (max-width: 768px) {
      .content-container .section:nth-of-type(1) .logo {
        margin-top: 50px; } }
    @media (max-width: 768px) {
      .content-container .section:nth-of-type(1) .headline {
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
        bottom: 120px; } }
    .content-container .section:nth-of-type(1) .headline h1 {
      color: #fff200;
      font-size: 40px; }
      @media (max-width: 768px) {
        .content-container .section:nth-of-type(1) .headline h1 {
          font-size: 20px; } }
    .content-container .section:nth-of-type(1) #down {
      color: #fff200;
      position: absolute;
      bottom: 20px;
      left: 0;
      right: 0;
      margin: 0 auto;
      cursor: pointer;
      font-size: 40px; }
      @media (min-width: 769px) {
        .content-container .section:nth-of-type(1) #down {
          bottom: 20px;
          -webkit-animation: hover-non-mobile 1s infinite;
          -moz-animation: hover-non-mobile 1s infinite;
          -ms-animation: hover-non-mobile 1s infinite;
          -o-animation: hover-non-mobile 1s infinite;
          animation: hover-non-mobile 1s infinite; } }
      @media (max-width: 768px) {
        .content-container .section:nth-of-type(1) #down {
          bottom: 80px;
          -webkit-animation: hover-mobile 1s infinite;
          -moz-animation: hover-mobile 1s infinite;
          -ms-animation: hover-mobile 1s infinite;
          -o-animation: hover-mobile 1s infinite;
          animation: hover-mobile 1s infinite; } }
@-webkit-keyframes hover-mobile {
  0% {
    bottom: 80px; }
  50% {
    bottom: 85px; }
  100% {
    bottom: 80px; } }
@-moz-keyframes hover-mobile {
  0% {
    bottom: 80px; }
  50% {
    bottom: 85px; }
  100% {
    bottom: 80px; } }
@-ms-keyframes hover-mobile {
  0% {
    bottom: 80px; }
  50% {
    bottom: 85px; }
  100% {
    bottom: 80px; } }
@-o-keyframes hover-mobile {
  0% {
    bottom: 80px; }
  50% {
    bottom: 85px; }
  100% {
    bottom: 80px; } }
@keyframes hover-mobile {
  0% {
    bottom: 80px; }
  50% {
    bottom: 85px; }
  100% {
    bottom: 80px; } }
@-webkit-keyframes hover-non-mobile {
  0% {
    bottom: 20px; }
  50% {
    bottom: 25px; }
  100% {
    bottom: 20px; } }
@-moz-keyframes hover-non-mobile {
  0% {
    bottom: 20px; }
  50% {
    bottom: 25px; }
  100% {
    bottom: 20px; } }
@-ms-keyframes hover-non-mobile {
  0% {
    bottom: 20px; }
  50% {
    bottom: 25px; }
  100% {
    bottom: 20px; } }
@-o-keyframes hover-non-mobile {
  0% {
    bottom: 20px; }
  50% {
    bottom: 25px; }
  100% {
    bottom: 20px; } }
@keyframes hover-non-mobile {
  0% {
    bottom: 20px; }
  50% {
    bottom: 25px; }
  100% {
    bottom: 20px; } }
  .content-container .section:nth-of-type(2) {
    background-color: #06d3f8; }
    .content-container .section:nth-of-type(2) .bg-img {
      background: white; }
    .content-container .section:nth-of-type(2) .headline h1 {
      color: #4a2169;
      font-size: 85px;
      text-shadow: -3px 3px #15ffc9; }
      @media (max-width: 768px) {
        .content-container .section:nth-of-type(2) .headline h1 {
          font-size: 40px;
          text-shadow: -3px 3px #15ffc9; } }
    .content-container .section:nth-of-type(2) .headline .clap {
      color: #4a2169;
      text-shadow: -4px 6px #15ffc9; }
  .content-container .section:nth-of-type(3) {
    background-color: #ed145b; }
    .content-container .section:nth-of-type(3) .bg-img {
      background: white; }
    .content-container .section:nth-of-type(3) h1 {
      color: #fff200;
      font-size: 85px;
      text-shadow: -6px 6px #4a2169; }
      @media (max-width: 768px) {
        .content-container .section:nth-of-type(3) h1 {
          font-size: 40px;
          text-shadow: -3px 3px #4a2169; } }
    .content-container .section:nth-of-type(3) .clap {
      color: #fff200;
      text-shadow: -4px 6px #4a2169; }
  .content-container .section:nth-of-type(4) {
    background-color: #4a2169; }
    .content-container .section:nth-of-type(4) .bg-img {
      background: white; }
    .content-container .section:nth-of-type(4) h1 {
      color: #15ffc9;
      font-size: 85px;
      text-shadow: -6px 6px #131211; }
      @media (max-width: 768px) {
        .content-container .section:nth-of-type(4) h1 {
          font-size: 40px;
          text-shadow: -3px 3px #131211; } }
    .content-container .section:nth-of-type(4) .clap {
      color: #15ffc9;
      text-shadow: -4px 6px #131211; }
  .content-container .section.section-description {
    background-color: #ffffff; }
    .content-container .section.section-description .bg-img {
      background: white; }
    @media (min-width: 768px) and (max-width: 1023px) {
      .content-container .section.section-description::after, .content-container .section.section-description::before {
        top: 60vh; } }
    .content-container .section.section-description .socket {
      z-index: 2; }
      @media (max-width: 768px) {
        .content-container .section.section-description .socket {
          width: 30%;
          margin-top: 15px; } }
      @media (min-width: 769px) {
        .content-container .section.section-description .socket {
          height: 80vh;
          position: absolute;
          bottom: -100px;
          left: 0;
          right: 0;
          margin: 0 auto; } }
      @media (min-width: 768px) and (max-width: 1023px) {
        .content-container .section.section-description .socket {
          height: 70vh; } }
    @media (max-width: 768px) {
      .content-container .section.section-description .tagline {
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
        bottom: 80px;
        line-height: 2; } }
    .content-container .section.section-description .tagline h1 {
      color: black; }
      @media (max-width: 768px) {
        .content-container .section.section-description .tagline h1 {
          font-size: 20px;
          font-weight: 600; } }
  .content-container .section.section-opt-in {
    background-color: #06d3f8;
    box-sizing: border-box; }
    .content-container .section.section-opt-in .alt-color-bg {
      background-color: #4a2169; }
    @media (min-width: 769px) {
      .content-container .section.section-opt-in {
        padding: 0 50px; }
        .content-container .section.section-opt-in .bg-img {
          background: white; } }
    .content-container .section.section-opt-in .form {
      z-index: 999; }
      @media (min-width: 769px) {
        .content-container .section.section-opt-in .form {
          background: white;
          box-shadow: -20px 20px #15ffc9;
          padding: 50px;
          width: 50%;
          margin: 60px auto; }
          .content-container .section.section-opt-in .form.success {
            padding: 25px; }
          .content-container .section.section-opt-in .form .tagline {
            color: black; }
            .content-container .section.section-opt-in .form .tagline h1 {
              font-weight: 100;
              text-align: left;
              border-bottom-color: #bfbfbf !important; }
              .content-container .section.section-opt-in .form .tagline h1 b {
                font-weight: 600; }
              .content-container .section.section-opt-in .form .tagline h1.success {
                margin-bottom: 0;
                padding: 0; }
            .content-container .section.section-opt-in .form .tagline h2 {
              font-weight: normal; }
          .content-container .section.section-opt-in .form input {
            border-color: #14e06e;
            color: #14e06e; }
            .content-container .section.section-opt-in .form input::-webkit-input-placeholder {
              /* Chrome/Opera/Safari */
              color: rgba(20, 224, 110, 0.5); }
            .content-container .section.section-opt-in .form input::-moz-placeholder {
              /* Firefox 19+ */
              color: rgba(20, 224, 110, 0.5); }
            .content-container .section.section-opt-in .form input:-ms-input-placeholder {
              /* IE 10+ */
              color: rgba(20, 224, 110, 0.5); }
            .content-container .section.section-opt-in .form input:-moz-placeholder {
              /* Firefox 18- */
              color: rgba(20, 224, 110, 0.5); }
          .content-container .section.section-opt-in .form button {
            width: 110px;
            margin: 0 0 0 auto;
            height: 45px; } }
      @media (max-width: 768px) {
        .content-container .section.section-opt-in .form {
          background: rgba(255, 255, 255, 0.7);
          padding: 1rem;
          width: 80%;
          margin: 0 auto;
          margin-top: 40px;
          color: black; }
          .content-container .section.section-opt-in .form .tagline {
            text-align: left;
            font-weight: bold; }
            .content-container .section.section-opt-in .form .tagline h1 {
              margin: 10px 0;
              text-align: center;
              font-weight: 400;
              border-color: rgba(255, 255, 255, 0.5); }
            .content-container .section.section-opt-in .form .tagline h2 {
              font-weight: 300; }
          .content-container .section.section-opt-in .form input {
            border-color: white; }
            .content-container .section.section-opt-in .form input::-webkit-input-placeholder {
              /* Chrome/Opera/Safari */
              color: rgba(0, 0, 0, 0.5); }
            .content-container .section.section-opt-in .form input::-moz-placeholder {
              /* Firefox 19+ */
              color: rgba(0, 0, 0, 0.5); }
            .content-container .section.section-opt-in .form input:-ms-input-placeholder {
              /* IE 10+ */
              color: rgba(0, 0, 0, 0.5); }
            .content-container .section.section-opt-in .form input:-moz-placeholder {
              /* Firefox 18- */
              color: rgba(0, 0, 0, 0.5); }
          .content-container .section.section-opt-in .form button {
            width: 100%;
            margin: 0 auto;
            height: 65px; } }
      .content-container .section.section-opt-in .form .tagline h1 {
        font-size: 24px;
        line-height: 1.25;
        border-bottom: 2px dotted;
        padding-bottom: 15px;
        margin-bottom: 15px; }
        .content-container .section.section-opt-in .form .tagline h1 b {
          font-weight: 600; }
        .content-container .section.section-opt-in .form .tagline h1.success {
          border-bottom: 0; }
      .content-container .section.section-opt-in .form .tagline h2 {
        font-family: "brandon-grotesque";
        text-align: left;
        font-size: 18px; }
        .content-container .section.section-opt-in .form .tagline h2 b {
          font-weight: 600; }
      .content-container .section.section-opt-in .form input {
        display: block;
        width: 100%;
        border: 0;
        border-bottom: 2px solid;
        margin: 30px 0;
        font-size: 20px;
        background-color: transparent;
        padding-bottom: 5px;
        font-family: "brandon-grotesque";
        border-radius: 0; }
      .content-container .section.section-opt-in .form button {
        display: block;
        background-color: #14e06e;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        color: white;
        border: 0;
        font-family: "brandon-grotesque";
        font-size: 20px;
        font-weight: bold;
        cursor: pointer;
        float: right;
        display: inline-block; }
      .content-container .section.section-opt-in .form button:disabled {
        background-color: gray; }
      .content-container .section.section-opt-in .form .error-msg {
        font-family: "brandon-grotesque";
        float: left;
        font-size: 1rem;
        color: red;
        font-weight: bold; }
      .content-container .section.section-opt-in .form h3 {
        right: 125px; }
        @media (min-width: 768px) and (max-width: 1023px) {
          .content-container .section.section-opt-in .form h3 {
            right: 100px; } }
        @media (min-width: 769px) {
          .content-container .section.section-opt-in .form h3 {
            position: absolute;
            color: white;
            font-family: "brandon-grotesque";
            font-size: 26px;
            width: 150px;
            top: 33vh; } }
        @media (max-width: 768px) {
          .content-container .section.section-opt-in .form h3 {
            display: none; } }
    .content-container .section.section-opt-in .team {
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0; }
      .content-container .section.section-opt-in .team.hidden {
        display: none; }
      @media (min-width: 769px) {
        .content-container .section.section-opt-in .team {
          width: 50%;
          margin: 0 auto; } }
      @media (max-width: 768px) {
        .content-container .section.section-opt-in .team {
          width: 100%; } }
    .content-container .section.section-opt-in .love {
      position: absolute;
      left: 50px;
      bottom: 80px;
      width: 200px; }
      @media (max-width: 768px) {
        .content-container .section.section-opt-in .love {
          display: none; } }
    .content-container .section.section-opt-in .footer {
      font-family: "brandon-grotesque";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #020e28;
      height: 65px;
      line-height: 65px; }
      .content-container .section.section-opt-in .footer a {
        color: white;
        text-decoration: none;
        font-weight: bold; }
      .content-container .section.section-opt-in .footer span {
        color: white;
        margin: 0 10px;
        font-weight: 100; }
      @media (max-width: 768px) {
        .content-container .section.section-opt-in .footer {
          text-align: center; } }
      @media (min-width: 769px) {
        .content-container .section.section-opt-in .footer {
          text-align: left;
          padding-left: 50px; } }
      .content-container .section.section-opt-in .footer .rights {
        color: white; }
        @media (max-width: 768px) {
          .content-container .section.section-opt-in .footer .rights {
            display: none; } }
        @media (min-width: 769px) {
          .content-container .section.section-opt-in .footer .rights {
            position: absolute;
            right: 50px;
            top: 0; } }

#pp-nav {
  left: 30px;
  width: 75px; }
  @media (max-width: 768px) {
    #pp-nav {
      left: 20px; } }
  #pp-nav.hidden {
    display: none; }
  #pp-nav li {
    width: 22.5px;
    height: 33.75px; }
    @media (max-width: 768px) {
      #pp-nav li {
        width: 22.5px;
        height: 41.25px; } }
    #pp-nav li a span {
      height: 15px;
      width: 15px;
      background: #ffffff;
      opacity: 0.6;
      border: 0; }
    #pp-nav li a.active span {
      background: #ffffff;
      opacity: 1; }
  #pp-nav.invert li a span {
    background: #898989; }
  #pp-nav.invert li a.active span {
    background: #252525; }

/*# sourceMappingURL=style.css.map */