.home-start-block
  h1
    padding: 20px 16px
    background-color: $mobileGray
    margin: 0
    +semibold
    font-size: 20px
    line-height: 24px
    color: $grey
    span
      +semibold
      font-size: 20px
      line-height: 24px

  .tips-list
    padding: 20px 30px
    h2
      +bold
      color: $blue
      font-size: 16px
      line-height: 18px
      padding: 0 0 0 20px

    ul
      li
        +regular
        position: relative
        padding: 0 0 0 20px
        color: $lightGreyFont
        font-size: 13px
        line-height: 16px

        &:before
          content: '-'
          color: $lightGreyFont
          font-size: 13px
          line-height: 16px
          width: 20px
          height: 100%
          display: inline-block
          position: absolute
          top: 0
          left: 0

    .btn-holder
      background-color: $blue
      border-radius: 8px
      height: 40px
      margin: 25px 0 0 20px
      a
        +flex(center, center)
        height: 100%
        text-decoration: none
        +regular
        font-size: 15px
        line-height: 15px
        color: white
        position: relative

        &:before
          content: '›'
          +semibold
          color: white
          font-size: 28px
          line-height: 40px
          position: absolute
          right: 25px
          top: 0px

        span
          color: white
          text-decoration: none
          +regular
          font-size: 15px
          line-height: 15px

  .customer-login
    display: block
    background-color: $mobileGray
    padding: 15px 9px 35px
    text-decoration: none
    .placeholder
      border: 2px solid #E9EDF0
      +flex(flex-start, center)
      height: 80px
      position: relative
      max-width: 450px
      margin: auto
      .icon
        width: 60px
        height: 80px
        +flex(center, center)
        &:after
          +icon-sprite-mobile(-30px -110px, 24px, 24px)
          display: block
          content: ''
      p
        width: calc(100% - 100px)
        color: $lightGreyFont
        +regular
        font-size: 13px
        line-height: 15px
        strong
          display: block
          +semibold
          color: $grey

      &:after
        content: '›'
        +semibold
        color: $light-grey
        font-size: 28px
        line-height: 80px
        position: absolute
        right: 17px
        top: 0px
        height: 100%
        +flex(center,center)


  .full-review-block
    background-color: $mobileGray
    display: block
    position: relative
    height: 200px
    padding: 15px 16px
    text-decoration: none

    .sven-filter
      position: absolute
      height: 240px
      bottom: 0
      right: 25px
      img
        height: 100%
    .review-info
      height: 100%
      background-color: white
      border-radius: 10px
      text-decoration: none
      padding: 15px 160px 15px 10px

      .title
        +bold
        font-size: 14px
        color: $blue
        line-height: 17px
        display: block
        text-align: center
      .grade
        display: block
        text-align: center
        color: $blue
        +semibold
        font-size: 54px
        line-height: 58px
        margin: 5px 0 8px

      .stars
        display: block
        text-align: center
        margin-bottom: 5px
        .star
          display: inline-block
          height: 16px
          +icon-sprite-mobile(-50px -10px, 17px, 16px)
          width: 17px
          &.half
            +icon-sprite-mobile(-30px -10px, 17px, 16px)

          &.full
            +icon-sprite-mobile(-10px -10px, 17px, 16px)

      .num_reviews
        display: block
        text-align: center
        color: $blue
        +regular
        font-size: 16px
        line-height: 16px

  .payment-methods
    background-color: $mobileGray
    padding: 0 16px

    .placeholder
      padding: 8px 0
      background-color: white
      border-radius: 10px
      text-align: center

  .selling-points-mobile
    padding: 15px 16px
    background-color: $mobileGray
    .placeholder
      background-color: white
      border-radius: 10px
      +flex(center, center)
      padding: 30px 10px
      ul
        li
          +semibold
          font-size: 15px
          line-height: 16px
          color: $green
          display: block
          margin-bottom: 8px
          &:last-of-type
            margin-bottom: 0

          &:before
            content: ''
            display: inline-block
            margin-right: 10px
            +icon-sprite-mobile(-70px -90px, 16px, 16px)
            position: relative
            top: 3px

+media-query(430px)
  .home-start-block
    .full-review-block
      .sven-filter
        right: 5px
      .review-info
        padding-right: 130px
        .grade
          font-size: 45px
          line-height: 52px


+media-query(330px)
  .home-start-block
    .full-review-block
      .sven-filter
        height: 220px

      .review-info
        padding-right: 95px