html, body {
  overflow-x: hidden;
  color: #fff; }

body {
  background: linear-gradient(90deg, #ffb88c, #de6262, #0abfbc, #24c6dc, #ffb88c);
  background-size: 1400% 300%;
  -webkit-animation: AnimationName 20s ease infinite;
  -moz-animation: AnimationName 20s ease infinite;
  animation: AnimationName 20s ease infinite; }

@-webkit-keyframes AnimationName {
  0% {
    background-position: 0% 0%; }
  50% {
    background-position: 50% 100%; }
  100% {
    background-position: 100% 0%; } }

@-moz-keyframes AnimationName {
  0% {
    background-position: 0% 0%; }
  50% {
    background-position: 50% 100%; }
  100% {
    background-position: 100% 0%; } }

@keyframes AnimationName {
  0% {
    background-position: 0% 0%; }
  50% {
    background-position: 50% 100%; }
  100% {
    background-position: 100% 0%; } }

* {
  font-family: 'Open Sans', sans-serif; }

.container {
  max-width: 600px;
  margin: 0 auto;
  padding-bottom: 120px; }

.header {
  text-align: center;
  padding: 80px 0;
  margin-top: 120px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 50px; }
  .header .header-text {
    font-size: 3em;
    font-weight: lighter;
    letter-spacing: .2em; }
  .header .header-subtext {
    font-size: 1.4em;
    margin-top: 20px;
    opacity: 0.8; }

.features {
  text-align: center;
  opacity: 0.8;
  margin-bottom: 80px;
  font-size: 1.2em; }
  .features .feature {
    margin-bottom: 100px; }
    .features .feature .feature-icon svg {
      margin-top: 60px;
      stroke: none;
      fill: #fff; }
      .features .feature .feature-icon svg#write-icon {
        transform: scale(2);
        -webkit-transform: scale(2);
        -moz-transform: scale(2);
        -ms-transform: scale(2);
        -o-transform: scale(2); }
      .features .feature .feature-icon svg#control-icon {
        margin-top: 10px;
        transform: scale(0.8);
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        margin-bottom: -50px; }
      .features .feature .feature-icon svg#campgaign-icon {
        transform: scale(3);
        -webkit-transform: scale(3);
        -moz-transform: scale(3);
        -ms-transform: scale(3);
        -o-transform: scale(3);
        fill: none;
        stroke: #fff; }

.header-email {
  padding: 30px;
  margin: 30px auto;
  border-radius: 3px;
  max-width: 150px;
  font-weight: bold;
  border: 2px solid rgba(0, 0, 0, 0.2);
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  cursor: pointer; }
  .header-email a {
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    color: #fff;
    text-decoration: none; }
  .header-email:hover {
    background-color: #fff;
    border-color: transparent;
    -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15); }
    .header-email:hover a {
      color: rgba(0, 0, 0, 0.3); }

.faq {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 50px;
  background-color: #fff;
  border-radius: 3px;
  padding: 50px;
  -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15); }
  .faq .faq-header {
    font-size: 1.5em;
    font-weight: lighter;
    color: rgba(0, 0, 0, 0.3); }
  .faq .faq-item {
    margin: 30px 0; }
    .faq .faq-item .question {
      font-weight: lighter;
      font-size: 1.2em;
      margin-bottom: 10px;
      color: rgba(0, 0, 0, 0.5); }
    .faq .faq-item .answer {
      color: rgba(0, 0, 0, 0.8);
      line-height: 1.8em; }
      .faq .faq-item .answer b {
        opacity: 0.9; }

.bottom-call {
  text-align: center;
  font-size: 2em;
  margin-top: 100px;
  padding-bottom: 20px;
  font-weight: lighter; }