html {
  min-height: 100%;
  margin: 0;
  padding: 0; }

body {
  background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f4f4f4));
  background: linear-gradient(-180deg, #ffffff 0%, #f4f4f4 100%);
  font-family: 'Roboto', sans-serif;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  margin: 0;
  padding: 0; }

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.container {
  max-width: 1240px;
  padding: 0 30px;
  margin: 40px auto 0; }
  @media screen and (max-width: 800px) {
    .container {
      margin: 30px auto 0; } }

.main .logo img {
  height: 45px;
  width: 100px; }
.main .info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .main .info .left {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    width: 490px;
    background-image: url(/assets/landing/phone-ec9aea23a3fe2c84a81267c3e05b33fa4d329885c1819c569a90881aa8f1a61b.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left top; }
    @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi) {
      .main .info .left {
        background-image: url(/assets/landing/phone@2x-9c733711275ea100229adf4fab46ca57c91a9b19ade7a8d20593023d82d44a98.png); } }
    @media screen and (max-width: 1100px) {
      .main .info .left {
        width: 400px;
        background-position: left center; } }
  .main .info .right {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    padding: 150px 0 200px 0; }
    @media screen and (max-width: 1100px) {
      .main .info .right {
        padding: 100px 0; } }
  @media screen and (max-width: 800px) {
    .main .info {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; }
      .main .info .left {
        width: 100%;
        height: 300px;
        background-position: center center;
        padding: 0; }
      .main .info .right {
        width: 100%;
        padding: 0 0 40px;
        text-align: center; } }
  .main .info .subtitle {
    color: #00c8b8;
    display: block;
    line-height: 27px;
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 20px; }
    @media screen and (max-width: 1100px) {
      .main .info .subtitle {
        font-size: 20px; } }
    .main .info .subtitle .soon {
      position: relative; }
      .main .info .subtitle .soon::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='89' height='5'%3E%3Cpath fill='%2300c8b8' d='M0 5l1.3652815-1.004692C34.163172-.1788101 66.116894-1.7922807 89 2.6582987l-.030893.7713015C65.272727.7683666 26.040979 2.2892898 0 5z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        content: '';
        display: inline-block;
        height: 5px;
        position: absolute;
        left: 3px;
        bottom: -7px;
        width: 89px; }
  .main .info .title {
    font-size: 64px;
    color: #000;
    margin: 0 0 20px;
    font-weight: bold; }
    @media screen and (max-width: 1100px) {
      .main .info .title {
        font-size: 44px; } }
    @media screen and (max-width: 800px) {
      .main .info .title {
        font-size: 36px; } }
  .main .info .description {
    font-size: 22px;
    color: #008cad; }
    @media screen and (max-width: 1100px) {
      .main .info .description {
        font-size: 20px; } }
.main .actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 2px solid rgba(216, 216, 216, 0.33);
  border-bottom: 2px solid rgba(216, 216, 216, 0.33);
  padding: 70px 30px; }
  .main .actions .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
    .main .actions .content .idnet-y8-logo {
      height: 64px;
      width: 120px; }
    .main .actions .content .text {
      margin-left: 30px; }
      .main .actions .content .text .black {
        color: #000;
        font-size: 30px;
        font-weight: bold;
        margin-bottom: 5px; }
        @media screen and (max-width: 1100px) {
          .main .actions .content .text .black {
            font-size: 26px; } }
      .main .actions .content .text .grey {
        color: #999;
        font-size: 22px;
        font-weight: normal; }
        @media screen and (max-width: 1100px) {
          .main .actions .content .text .grey {
            font-size: 18px; } }
  .main .actions .button {
    -webkit-transition: .3s;
    transition: .3s;
    background: -webkit-gradient(linear, left top, right top, from(#0e89ac), to(#00cdbe));
    background: linear-gradient(90deg, #0e89ac 0%, #00cdbe 100%);
    border-radius: 22px;
    -webkit-box-shadow: 0 6px 6px -6px rgba(0, 0, 0, 0.15);
            box-shadow: 0 6px 6px -6px rgba(0, 0, 0, 0.15);
    min-width: 220px;
    height: 44px;
    padding: 0 30px;
    color: #FFF;
    letter-spacing: .4px;
    text-align: center;
    text-transform: uppercase;
    line-height: 44px;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    margin-left: 20px; }
    .main .actions .button:hover {
      background: -webkit-gradient(linear, left top, right top, from(#0e89ac), color-stop(90%, #00cdbe));
      background: linear-gradient(90deg, #0e89ac 0%, #00cdbe 90%);
      -webkit-transform: translate(0, -2px);
          -ms-transform: translate(0, -2px);
              transform: translate(0, -2px); }
  @media screen and (max-width: 800px) {
    .main .actions {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      padding: 30px 0; }
      .main .actions .content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        text-align: center; }
        .main .actions .content .idnet-y8-logo {
          margin-bottom: 15px; }
        .main .actions .content .text {
          margin: 0 0 30px; }
          .main .actions .content .text .black {
            margin-bottom: 10px;
            font-size: 22px; }
          .main .actions .content .text .grey {
            font-size: 16px; }
      .main .actions .button {
        width: 100%;
        margin-left: 0; } }

.footer {
  font-size: 12px;
  font-weight: normal;
  color: #999;
  padding: 30px 0; }