*, *:before, *:after {
  box-sizing: border-box; }

body {
  background-color: #F5F7F7;
  color: #6B757B;
  font-size: 16px; }

.hero-img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #F5F7F7;
  background-image: url(../images/bg_hero.png);
  -webkit-mask-image: linear-gradient(black 50%, transparent 100%);
          mask-image: linear-gradient(black 50%, transparent 100%); }

.hero-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1; }

.hero {
  text-align: center;
  position: relative;
  padding: 64px 0; }
  @media (min-width: 640px) {
    .hero {
      padding: 128px 0; } }

.hero-logo {
  background-color: #fff;
  display: inline-block;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.36);
  border-radius: 3px; }

.hero-logo_img {
  padding: 8px 16px;
  display: block; }

.hero-title {
  font-size: 24px;
  color: #333A3E;
  font-weight: 400; }
  @media (min-width: 640px) {
    .hero-title {
      font-size: 32px; } }

.hero-description {
  font-size: 16px;
  color: #6B757B;
  line-height: 1.5; }
  @media (min-width: 640px) {
    .hero-description {
      font-size: 18px; } }

.container {
  max-width: 960px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px; }
  @media (min-width: 640px) {
    .container {
      padding-left: 32px;
      padding-right: 32px; } }

.highlight {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 128px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }
  @media (min-width: 640px) {
    .highlight {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row; } }

.highlight-img {
  max-width: 100%;
  display: block; }

@media (min-width: 640px) {
  .highlight-message {
    padding-left: 32px; } }

.highlight-title {
  font-size: 20px;
  color: #333A3E;
  font-weight: 400; }
  @media (min-width: 640px) {
    .highlight-title {
      font-size: 26px; } }

.highlight-description {
  line-height: 2; }

.legal_terms {
  padding-top: 16px;
  padding-bottom: 16px;
  background: rgba(255, 255, 255, 0.64);
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.16);
  line-height: 2; }
  @media (min-width: 640px) {
    .legal_terms {
      padding-top: 48px;
      padding-bottom: 48px; } }

.legal_terms-title {
  font-weight: bold;
  color: #333A3E; }

.footer {
  padding-top: 24px;
  padding-bottom: 24px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.16);
  font-size: 14px; }
  .footer::after {
    display: table-cell;
    clear: both; }

.footer-more_info_link {
  text-decoration: none;
  color: #333A3E;
  font-weight: bold;
  margin-bottom: 16px;
  display: block; }
  @media (min-width: 640px) {
    .footer-more_info_link {
      display: inline-block;
      margin-bottom: 0; } }

@media (min-width: 640px) {
  .footer-contact_links {
    float: right; } }

.footer-contact_link {
  font-size: 14px;
  color: #6B757B;
  text-decoration: none;
  display: block;
  margin-bottom: 16px; }
  @media (min-width: 640px) {
    .footer-contact_link {
      display: inline-block;
      margin-bottom: 0; }
      .footer-contact_link + .footer-contact_link {
        padding-left: 32px; } }
  .footer-contact_link img {
    vertical-align: middle;
    padding-right: 4px; }
