@font-face {
  font-family: Impact;
  src: url("../fonts/ofont.ru_Impact.ttf"); }

body {
  margin: 0;
  padding: 0;
  font-family: "Impact", sans-serif; }

h1, h2, h3, p {
  margin: 0;
  padding: 0; }

div {
  box-sizing: border-box; }

.container {
  max-width: 320px;
  margin: 0 auto;
  text-align: center; }

.header {
  background: url("../img/header_bg.png") no-repeat center;
  background-size: cover;
  padding-bottom: 24px; }
  .header .logo {
    padding-top: 24px;
    padding-bottom: 24px; }
  .header h2 {
    color: #FF0100;
    font-weight: normal;
    font-size: 24px;
    text-transform: uppercase; }
  .header .product-block {
    background: url("../img/header_bg_2.png") no-repeat center;
    background-size: 103% 101%;
    padding-top: 130px;
    padding-bottom: 10px;
    position: relative;
    z-index: 2;
    overflow: hidden; }
    .header .product-block:before {
      content: '';
      display: block;
      position: absolute;
      background: url("../img/header-pineapple.png") no-repeat;
      width: 154px;
      height: 145px;
      top: -32px;
      right: -32px; }
    .header .product-block img {
      padding-left: 52px; }
    .header .product-block span {
      color: #FFCF00;
      font-size: 36px;
      display: block;
      margin-top: -20px;
      text-transform: uppercase; }
  .header .order-block {
    background: #FFAFBD;
    box-shadow: 0px 4px 4px rgba(138, 37, 58, 0.7);
    border-radius: 0px 0px 10px 10px;
    position: relative;
    z-index: 1;
    margin-top: -6px; }
    .header .order-block .timer_title {
      font-style: normal;
      font-size: 24px;
      color: #FFFFFF;
      display: block;
      padding: 12px 0;
      font-family: sans-serif;
      font-weight: bold; }
    .header .order-block .timer {
      font-size: 32px;
      color: #E38199;
      padding-bottom: 40px; }
      .header .order-block .timer .hour0, .header .order-block .timer .min0, .header .order-block .timer .sec0 {
        background: #FFFFFF;
        border-radius: 39px 0px 0px 39px;
        padding: 4px;
        width: 28px;
        display: inline-block; }
      .header .order-block .timer .hour1, .header .order-block .timer .min1, .header .order-block .timer .sec1 {
        background: #FFFFFF;
        border-radius: 0px 39px 39px 0px;
        padding: 4px;
        width: 28px;
        display: inline-block; }
      .header .order-block .timer .colon {
        font-family: Roboto;
        font-weight: 900;
        font-size: 36px;
        color: #FFFFFF; }
      .header .order-block .timer .hour {
        position: relative; }
        .header .order-block .timer .hour:before {
          content: 'Horas';
          display: block;
          font-size: 14px;
          position: absolute;
          bottom: -24px;
          transform: translateX(-50%);
          left: 50%;
          color: #fff;
          font-family: sans-serif; }
      .header .order-block .timer .minute {
        position: relative; }
        .header .order-block .timer .minute:before {
          content: 'Minutos';
          display: block;
          font-size: 14px;
          position: absolute;
          bottom: -24px;
          transform: translateX(-50%);
          left: 50%;
          color: #fff;
          font-family: sans-serif; }
      .header .order-block .timer .second {
        position: relative; }
        .header .order-block .timer .second:before {
          content: 'Segundos';
          display: block;
          font-size: 14px;
          position: absolute;
          bottom: -24px;
          transform: translateX(-50%);
          left: 50%;
          color: #fff;
          font-family: sans-serif; }
    .header .order-block form div {
      position: relative;
      width: 256px;
      margin: 0 auto;
      margin-bottom: 16px; }
      /*.header .order-block form div:before {
        content: '';
        display: block;
        position: absolute;
        background: url("../img/input_img1.png");
        width: 20px;
        height: 20px;
        z-index: 1;
        top: 50%;
        transform: translateY(-50%);
        left: 5%; }
      .header .order-block form div:nth-child(3):before {
        background: url("../img/input_img2.png");
        width: 18px;
        height: 19px; }*/
    .header .order-block form input {
      width: 256px;
      color: #FFAFBD;
      background: #FFFFFF;
      border-radius: 63px;
      border: none;
      padding: 12px;
      padding-left: 15%;
      box-sizing: border-box;
      font-size: 18px;
      position: relative; }
      #inputName {
        background: #FFFFFF url(../img/input_img1.png) no-repeat 10px 12px;
      } 
      #inputPhone {
        background: #FFFFFF url(../img/input_img2.png) no-repeat 10px 12px;
      }
      .header .order-block form input::placeholder {
        font-size: 18px;
        color: #FFAFBD; }
    .header .order-block form .price {
      display: block;
      padding-bottom: 12px; }
    .header .order-block form .old {
      color: #260606;
      font-size: 18px; }
    .header .order-block form .line {
      text-decoration: line-through; }
    .header .order-block form .new {
      color: #FF0000;
      font-size: 24px;
      padding-bottom: 0; }
    .header .order-block form .new2 {
      color: #FF0000;
      font-size: 36px; }
    .header .order-block form button {
      font-weight: 900;
      font-size: 32px;
      line-height: 28px;
      width: 256px;
      height: 86px;
      background: linear-gradient(180deg, #ADD100 0%, #7B920A 100%);
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
      border-radius: 63px;
      color: #FFFFFF;
      border: none;
      margin-bottom: 16px;
      cursor: pointer;
      text-transform: uppercase; }
      .header .order-block form button span {
        font-size: 16px;
        display: block; }

.slider-block {
  background: linear-gradient(90deg, #FFAFBD -3.12%, #FFC3A0 96.88%);
  padding: 24px 0; }
  .slider-block .slide {
    display: flex !important;
    align-items: center;
    color: #FFFFFF;
    text-shadow: 0px 4px 4px rgba(204, 43, 73, 0.63);
    padding: 24px 0;
    text-align: left; }
    .slider-block .slide p {
      padding-left: 24px; }

.components {
  background: url("../img/components_bg.png") no-repeat center;
  background-size: cover;
  padding-bottom: 96px; }
  .components h2 {
    color: #ADD100;
    font-size: 24px;
    text-transform: uppercase;
    padding: 16px 0;
    font-weight: normal; }
  .components .description {
    color: #FFFFFF;
    font-size: 18px;
    background: #FF0000;
    border-top: 5px solid #FFFFFF;
    border-bottom: 5px solid #FFFFFF;
    padding: 12px 0;
    position: relative;
    width: 200px;
    margin: 0 auto;
    height: 140px; }
    .components .description:before {
      content: "";
      height: 0;
      width: 0;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: -30px;
      border-top: 65px solid transparent;
      border-left: 30px solid #FF0000;
      border-bottom: 65px solid transparent; }
    .components .description:after {
      content: "";
      height: 0;
      width: 0;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: -30px;
      border-top: 65px solid transparent;
      border-right: 30px solid #FF0000;
      border-bottom: 65px solid transparent; }
  .components .slider {
    padding: 16px 0;
    color: #FFFFFF; }
    .components .slider .slide {
      background: #ADD100;
      box-shadow: 0px 0px 10px rgba(255, 125, 0, 0.5);
      border-radius: 10px;
      padding-bottom: 24px;
      margin: 12px; }
      .components .slider .slide span {
        font-size: 24px;
        padding: 24px 0;
        display: block; }
      .components .slider .slide img {
        width: 100%; }
      .components .slider .slide p {
        font-size: 18px;
        padding: 16px; }

.steps {
  background: url("../img/steps_bg.png") no-repeat top;
  background-size: cover;
  margin-top: -52px;
  padding-top: 80px;
  padding-bottom: 32px; }
  .steps h2 {
    color: #8A2537;
    font-size: 24px;
    font-weight: normal; }
  .steps p {
    color: #8A2537;
    padding: 16px 0;
    font-family: sans-serif;
    font-size: 24px; }
    .steps p span {
      display: block;
      font-weight: bold; }
  .steps .img-wrap {
    background: url("../img/steps-img-wrap-bg.png") no-repeat center;
    padding: 60px 0 40px; }
    .steps .img-wrap img {
      padding-right: 48px; }
  .steps .step {
    margin: 186px 12px 0;
    background: #FFFFFF;
    border-radius: 20px;
    box-shadow: 0px 0px 10px rgba(204, 43, 88, 0.63);
    padding: 16px 32px;
    position: relative; }
    .steps .step p {
      font-size: 18px; }
    .steps .step span {
      display: inline;
      font-weight: bold; }
    .steps .step:before {
      content: '';
      display: block;
      position: absolute;
      background: url("../img/steps-block-bg1.png") no-repeat;
      width: 118px;
      height: 186px;
      top: -152px;
      left: 65px; }
    .steps .step:last-child:before {
      background: url("../img/steps-block-bg2.png") no-repeat;
      width: 126px;
      height: 184px;
      top: -152px; }

.recommendation {
  background: url("../img/recommendation_bg.png") no-repeat center;
  background-size: cover;
  padding-top: 160px;
  padding-bottom: 64px;
  position: relative;
  z-index: 2; }
  .recommendation .step {
    margin: 0 12px;
    background: #FFFFFF;
    border-radius: 20px;
    box-shadow: 0px 0px 10px rgba(204, 43, 88, 0.63);
    padding: 16px 32px;
    position: relative; }
    .recommendation .step p {
      padding: 16px 0;
      font-size: 18px;
      color: #8A2537;
      font-family: sans-serif; }
    .recommendation .step span {
      font-weight: bold; }
    .recommendation .step:before {
      content: '';
      display: block;
      position: absolute;
      background: url("../img/recommendation-step.png") no-repeat;
      width: 124px;
      height: 190px;
      top: -155px;
      left: 65px; }
  .recommendation-doctor {
    background: #FFFFFF;
    box-shadow: 0px 4px 4px rgba(0, 159, 209, 0.2);
    border-radius: 20px;
    margin: 24px 0;
    font-size: 18px;
    padding-bottom: 24px; }
    .recommendation-doctor h2 {
      font-size: 24px;
      color: #FFFFFF;
      font-weight: normal;
      background: #0060D1;
      border-radius: 20px 20px 0px 0px;
      padding: 24px; }
    .recommendation-doctor img {
      padding: 24px 0;
      margin: 0 auto;
      display: block; }
    .recommendation-doctor .doctor-name {
      font-family: sans-serif;
      font-weight: 900;
      padding: 0 24px 16px; }
    .recommendation-doctor p {
      padding: 8px 24px; }
    .recommendation-doctor .p_normal {
      font-family: sans-serif; }
    .recommendation-doctor .p_bold {
      font-family: Impact; }
    .recommendation-doctor .clinic-wrap {
      display: flex;
      justify-content: center;
      align-items: center; }
      .recommendation-doctor .clinic-wrap p {
        padding-left: 0;
        text-align: left;
        color: #0060D1; }
      .recommendation-doctor .clinic-wrap div {
        width: 50%; }

.detox {
  background: url("../img/detox_bg.png") no-repeat center;
  background-size: cover;
  padding-top: 80px;
  margin-top: -80px;
  position: relative;
  z-index: 1; }
  .detox p {
    padding: 24px;
    font-size: 18px;
    color: #8A2537;
    font-family: sans-serif; }
  .detox span {
    font-family: Impact; }

.advertising {
  background: #FF0100;
  padding: 16px 0; }
  .advertising p {
    color: #FFCF00;
    font-size: 24px;
    font-weight: normal;
    text-transform: uppercase; }
    .advertising p:last-child {
      color: #FFFFFF;
      padding-top: 12px; }
    .advertising p span {
      font-size: 32px; }

.comments {
  background: url("../img/comments_bg.png") no-repeat center;
  background-size: cover;
  padding-bottom: 24px; }
  .comments .slider {
    padding: 24px 0; }
    .comments .slider .comment {
      background: #FFFFFF;
      box-shadow: 0px 0px 10px rgba(138, 37, 58, 0.7);
      border-radius: 0px 0px 10px 10px;
      color: #8A2537;
      font-family: sans-serif;
      margin: 12px; }
      .comments .slider .comment img {
        width: 100%; }
      .comments .slider .comment span {
        font-size: 18px;
        font-weight: bold; }
      .comments .slider .comment p {
        padding: 24px; }

.order {
  background: url("../img/header_bg.png") no-repeat center;
  background-size: cover;
  padding-bottom: 24px; }
  .order .logo {
    padding-top: 24px;
    padding-bottom: 24px; }
  .order h2 {
    color: #FF0100;
    font-weight: normal;
    font-size: 24px;
    text-transform: uppercase; }
  .order .product-block {
    background: url("../img/footer_bg_2.png") no-repeat center;
    background-size: 103% 101%;
    padding-top: 130px;
    padding-bottom: 10px;
    position: relative;
    z-index: 2;
    overflow: hidden; }
    .order .product-block:before {
      content: '';
      display: block;
      position: absolute;
      background: url("../img/header-pineapple.png") no-repeat;
      width: 154px;
      height: 145px;
      top: -32px;
      left: -20px; }
    .order .product-block img {
      padding-right: 52px; }
    .order .product-block span {
      color: #FFCF00;
      font-size: 36px;
      display: block;
      margin-top: -20px;
      text-transform: uppercase; }
  .order .order-block {
    background: #FFAFBD;
    box-shadow: 0px 4px 4px rgba(138, 37, 58, 0.7);
    border-radius: 0px 0px 10px 10px;
    position: relative;
    z-index: 1;
    margin-top: -6px; }
    .order .order-block .timer_title {
      font-style: normal;
      font-size: 24px;
      color: #FFFFFF;
      display: block;
      padding: 12px 0;
      font-family: sans-serif;
      font-weight: bold; }
    .order .order-block .timer {
      font-size: 32px;
      color: #E38199;
      padding-bottom: 40px; }
      .order .order-block .timer .hour0, .order .order-block .timer .min0, .order .order-block .timer .sec0 {
        background: #FFFFFF;
        border-radius: 39px 0px 0px 39px;
        padding: 4px;
        width: 28px;
        display: inline-block; }
      .order .order-block .timer .hour1, .order .order-block .timer .min1, .order .order-block .timer .sec1 {
        background: #FFFFFF;
        border-radius: 0px 39px 39px 0px;
        padding: 4px;
        width: 28px;
        display: inline-block; }
      .order .order-block .timer .colon {
        font-family: Roboto;
        font-weight: 900;
        font-size: 36px;
        color: #FFFFFF; }
      .order .order-block .timer .hour {
        position: relative; }
        .order .order-block .timer .hour:before {
          content: 'Horas';
          display: block;
          font-size: 14px;
          position: absolute;
          bottom: -24px;
          transform: translateX(-50%);
          left: 50%;
          color: #fff;
          font-family: sans-serif; }
      .order .order-block .timer .minute {
        position: relative; }
        .order .order-block .timer .minute:before {
          content: 'Minutos';
          display: block;
          font-size: 14px;
          position: absolute;
          bottom: -24px;
          transform: translateX(-50%);
          left: 50%;
          color: #fff;
          font-family: sans-serif; }
      .order .order-block .timer .second {
        position: relative; }
        .order .order-block .timer .second:before {
          content: 'Segundos';
          display: block;
          font-size: 14px;
          position: absolute;
          bottom: -24px;
          transform: translateX(-50%);
          left: 50%;
          color: #fff;
          font-family: sans-serif; }
    .order .order-block form div {
      position: relative;
      width: 256px;
      margin: 0 auto;
      margin-bottom: 16px; }
    /*  .order .order-block form div:before {
        content: '';
        display: block;
        position: absolute;
        background: url("../img/input_img1.png");
        width: 20px;
        height: 20px;
        z-index: 1;
        top: 50%;
        transform: translateY(-50%);
        left: 5%; }
      .order .order-block form div:nth-child(3):before {
        background: url("../img/input_img2.png");
        width: 18px;
        height: 19px; }*/
    .order .order-block form input {
      width: 256px;
      color: #FFAFBD;
      background: #FFFFFF;
      border-radius: 63px;
      border: none;
      padding: 12px;
      padding-left: 15%;
      box-sizing: border-box;
      font-size: 18px;
      position: relative; }
      .order .order-block form input::placeholder {
        font-size: 18px;
        color: #FFAFBD; }
    .order .order-block form .price {
      display: block;
      padding-bottom: 12px; }
    .order .order-block form .old {
      color: #260606;
      font-size: 18px; }
    .order .order-block form .line {
      text-decoration: line-through; }
    .order .order-block form .new {
      color: #FF0000;
      font-size: 24px;
      padding-bottom: 0; }
    .order .order-block form .new2 {
      color: #FF0000;
      font-size: 36px; }
    .order .order-block form button {
      font-weight: 900;
      font-size: 32px;
      line-height: 28px;
      width: 256px;
      height: 86px;
      background: linear-gradient(180deg, #ADD100 0%, #7B920A 100%);
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
      border-radius: 63px;
      color: #FFFFFF;
      border: none;
      margin-bottom: 16px;
      cursor: pointer;
      text-transform: uppercase; }
      .order .order-block form button span {
        font-size: 16px;
        display: block; }

.footer {
  background: #ADD100;
  padding: 15px 0; }
  .footer .privacy a {
    font-family: sans-serif;
    color: #fff;
    text-decoration: none; }