/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu72xKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
  }
  /* cyrillic */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu5mxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  }
  /* greek-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7mxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
  }
  /* greek */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4WxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0370-03FF;
  }
  /* vietnamese */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7WxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7GxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* cyrillic-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCRc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
  }
  /* cyrillic */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfABc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
  }
  /* greek-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCBc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
  }
  /* greek */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBxc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0370-03FF;
  }
  /* vietnamese */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCxc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
  }
  /* latin-ext */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfChc4AMP6lbBP.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
  /* latin */
  @font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBBc4AMP6lQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  @import url(https://fonts.google.com/specimen/Montserrat);
  * {
    margin: 0;
    padding: 0
  }
  :focus {
    outline: 0
  }
  img {
    border: none
  }
  html,body {
    -webkit-text-size-adjust: none
  }
  body {
    background-image: url(img/pattern.png);
    background-repeat: repeat;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    color: #fff;
    min-width: 300px;
  }
  ol,ul {
    list-style: none
  }
  a {
    color: #fff
  }
  .wrap {
    position: relative;
    padding: 0 15px
  }
  .slogan-box {
      padding: 25px 0 70px;
    text-align: center;
    max-width: 900px;
    margin: 0 auto
  }
  
  .slogan-box h3 {
      font-size: 50px;
      color: #ed2546;
      text-transform: uppercase;
      font-weight: 900;
  }
  /* .pics {
    text-align: center
  } */
  
  
  .pics {
      display: flex;
      justify-content: center;
      width: 100%;
  }
  .second-pic {
      transform: scale(1.5);
  }
  
  
  
  .pics img {
    margin: 10px;
    -webkit-box-shadow: 0px 0px 80px 10px rgba(255,255,255,0.3);
    -moz-box-shadow: 0px 0px 80px 10px rgba(255,255,255,0.3);
    box-shadow: 0px 0px 80px 10px rgba(255,255,255,0.3);
    border-radius: 50%;
    width: 230px;
  }
  
  .step {
    display: none
  }
  .step:first-child {
    display: block
  }
  .question {
    text-align: center;
    padding: 45px 0 30px;
  }
  .question h3 {
    font-size: 30px;
    font-weight: normal;
    margin-bottom: 25px;
  }
  .btn {
      min-width: 120px;
      display: inline-block;
      border-radius: 30px;
      padding: 10px 30px;
      font-size: 22px;
      font-weight: 400;
      color: #fff;
      text-decoration: none;
      transition: all 0.1s ease 0s;
      background: #ee3453;
      margin: 5px;
  }
  .btn:hover {
    position: relative;
    background-color: #ad2339;
  }
  .btn-no {
      background: transparent;
      border: 2px solid #ee3453;
      color: #ee3453;
  }
  .btn-no:hover {
      background: #ee3453;
      border: 2px solid transparent;
      color: #fff;
  }
  .final-step {
    max-width: 700px;
    margin: 0 auto;
    padding-bottom: 30px;
    text-align: center
  }
  .final-step h3 {
    font-size: 24px;
    font-weight: normal;
    margin-bottom: 15px;
    line-height: 1
  }
  .final-step ul {
    margin-bottom: 15px;
    text-align: left
  }
  .final-step ul li {
    font-size: 19px;
    margin-bottom: 5px;
    list-style: disc outside;
    color: #ed2546;
  }
  .final-step ul li p {
      color: #fff;
    }
  
  .pics .set-width {
      width: 230px;
  }
  .terms {
    font-size: 14px;
    color: #b70000;
    margin-bottom: 15px;
  }
  @media (max-width: 770px) {
    body {
      font-size:18px
    }
    .pics img {
      width: 140px
    }
    .question h3 {
      font-size: 24px
    }
    .btn {
      font-size: 24px
    }
  }
  @media (max-width: 415px) {
    body {
      font-size:12px
    }
    .pics img {
      width: 83px;
      margin: 12px;
      border-width: 2px
    }
    .question h3 {
      font-size: 18px;
      margin-bottom: 10px
    }
    .final-step h3 {
      font-size: 18px
    }
    .final-step ul li {
      font-size: 12px
    }
    .terms {
      font-size: 11px
    }
  }
  .step_mag {
    display: none;
  }

  .step_mag.active {
    display: block;
  }