html,
body {
  width: 100vw;
  overflow-x: hidden;
}
.section01 {
  position: relative;
  h1 {
    font-size: 24px;
    line-height: 28px;
    font-weight: 600;
    max-width: 250px;
    color: #252424;
    margin: 0 0 32px;
  }
  p {
    max-width: 271px;
    a {
      font-weight: 600;
    }
  }
}

.section02 {
  padding: 189px 0;
  h2 {
    font-size: 32px;
    line-height: 36px;
    font-weight: 400;
    max-width: 257px;
    margin: 0;
    .color {
      color: #4fb5a3;
    }
  }
}
.section03 {
  padding: 120px 0;
  h2,
  p {
    max-width: 374px;
  }
  .bt-default {
    margin-top: 42px;
  }
}

@media (min-width: 768px) {
  .section01 {
    background: url(https://essentialnutrition-upload-files.s3.us-east-1.amazonaws.com/site-begenerous/como-ajudar/back-como-ajudar-01.jpg)
      center top no-repeat;
    .row {
      height: 680px;
      align-items: center;
    }
  }
  .section02 {
    background: #f2efed
      url(https://essentialnutrition-upload-files.s3.us-east-1.amazonaws.com/site-begenerous/como-ajudar/back-como-ajudar-02.jpg)
      center top no-repeat;
    height: 1231px;
    .text01 {
      max-width: 244px;
      margin: 59px 0 0 600px;
    }
    .text02 {
      max-width: 277px;
      margin: 202px 0 0 259px;
    }
    .text03 {
      max-width: 246px;
      margin: -23px 0 0 728px;
    }
  }
  .section03 {
    .row {
      align-items: center;
    }
  }
}
@media (max-width: 767px) {
  .section01 {
    .container {
      padding: 60px 30px 120px;
    }
    .img-fluid {
      width: 100%;
    }
  }
  .section02 {
    background: #f2efed;
    padding: 0 0 120px;
    h2 {
      margin: 120px 15px 32px;
    }
    .box_text {
      background: #f2efed
        url(https://essentialnutrition-upload-files.s3.us-east-1.amazonaws.com/site-begenerous/como-ajudar/back-como-ajudar-02-mobile.png)
        center top no-repeat;
      background-size: 100%;
      position: relative;
      margin: 60px auto 0;
      padding-top: 163px;
      height: 1003px;
      max-width: 345px;
    }
    p {
      text-align: center;
    }
    .text01 {
      max-width: 272px;
      margin: 0 auto;
    }
    .text02 {
      max-width: 272px;
      margin: 193px auto 0;
    }
    .text03 {
      max-width: 272px;
      margin: 177px auto 0;
    }
  }
  .section03 {
    padding: 0 0 120px;
    .container {
      padding: 0;
    }
    .col-md-5 {
      padding: 60px 45px 0;
    }
    h2,
    p {
      max-width: 295px;
    }
  }
}

@media (max-width: 340px) {
  .section02 {
    .box_text {
      padding-top: 42vw;
      height: 268vw;
    }
    p {
      font-size: 15px;
      line-height: 18px;
    }
    .text01 {
      max-width: 217px;
    }
    .text02 {
      max-width: 234px;
      margin: 51.5vw auto 0;
    }
    .text03 {
      max-width: 236px;
      margin: 47.3vw auto 0;
    }
  }
}