HEX
Server: Apache/2.4.52 (Ubuntu)
System: Linux spn-python 5.15.0-89-generic #99-Ubuntu SMP Mon Oct 30 20:42:41 UTC 2023 x86_64
User: arjun (1000)
PHP: 8.1.2-1ubuntu2.20
Disabled: NONE
Upload Files
File: /var/www/html/Michigan-Care/wp-content/themes/michigan-care/scss/receieve.scss
@import "partials";
.receive-wrap {
  background: #fafcf5;
  padding: 100px 0px;
  @media($sm-1679){
    padding: 80px 0px;
  }
  @media($sm-1481){
    padding: 60px 0px;
  }
  @media($sm-1199){
    padding: 36px 0px;
  }
  .receiver-inner {
    // display: flex;
    // align-items: center;
    justify-content: space-between;

    @media ($sm-579) {
      flex-wrap: wrap;
    }
  }
  .card-wrap {
    width: calc(100% / 2 - 50px);
    margin-right: 100px;

    @media ($sm-1199) {
      width: 49%;
      margin-right: 0px;
    }
    @media ($sm-579) {
      width: 100%;
      margin-bottom: 26px;
      padding: 0px 24px;
    }

    &:last-child {
      // width: calc(100%/2);
      margin-right: 0px;
      @media($sm-579){
        margin-bottom: 0px;
      }
    }
    .card-inner {
      background: #ffffff;
      border-radius: 16px;
      padding: 70px 100px;

      @media ($sm-1679) {
        padding: 50px 80px;
      }
      @media ($sm-1481) {
        padding: 40px 60px;
      }
      @media ($sm-1199) {
        padding: 20px;
      }
    }
    .card-title {
      font-family: 'capraia_regularregular';
      font-weight: 400;
      font-style: Italic;
      font-size: 27px;
      text-align: center;
      color: #3D5751;
      padding-bottom: 20px;
      
      // @media ($sm-1679) {
      //   font-size: 25px;
      // }
      // @media ($sm-1481) {
      //   font-size: 23px;
      // }
      // @media ($sm-1199) {
      //   font-size: 21px;
      // }
      // @media ($sm-991) {
      //   font-size: 19px;
      // }
      // @media ($sm-767) {
      //   font-size: 17px;
      // }
      span {
        font-family: "Manrope", sans-serif;
        font-weight: 700;
        font-style: normal;
        font-size: 24px;
        text-align: center;
        display: block;
        // @media ($sm-1679) {
        //   font-size: 22px;
        // }
        // @media ($sm-1481) {
        //   font-size: 20px;
        // }
        // @media ($sm-1199) {
        //   font-size: 18px;
        // }
        // @media ($sm-991) {
        //   font-size: 16px;
        // }
        // @media ($sm-767) {
        //   font-size: 14px;
        // }
      }
    }

    .icon-wrp {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;

      .icon-sec {
         width: 48%;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 20px 0px;
        @media ($sm-1281) {
          width: 48%;
        }
        @media ($sm-579) {
          // width: 100%;
        }
        .icon {
          width: 66px;
          height: 66px;
          text-align: center;
          margin-bottom: 12px;
          img {
            width: 100%;
            height: 100%;
          }
        }
        .txt {
          font-family: $font-sequel-medium-body;
          color: #3d5751;
          font-size: 14px;
         
          letter-spacing: 0%;
          text-align: center;
          max-width: 120px;
          // @media($sm-1679){
          //   font-size: 13px;
          //   line-height: 19px;
          // }
          @media($sm-991){
            // font-size: 12px;
            // line-height: 18px;
          }
          @media($sm-767){
            font-size: 13px;
          }
          @media($sm-579){
            font-size: 14px;
          }

          span{
             display: block;
          }
        }
      }
    }
  }
}

.best-care {
  padding: 100px 0px;
  @media($sm-1679){
    padding: 80px 0px;
  }
  @media($sm-1481){
    padding: 60px 0px;
  }
  @media($sm-1199){
    padding: 40px 0px;
  }

    @media($sm-579){
      // padding: 0px 0px;
      padding-bottom: 48px;
    }
  
  .topsec {
    display: flex;

    .title {
      font-family: "Manrope", sans-serif;
      font-weight: 600;
      color: #3d5751;
      font-size: 36px;
      line-height: 39px;
      width: 34%;
      margin-left: -32px;
      @media ($sm-1679) {
        margin-left: -28px;
        font-size: 35px;
        line-height: 40px;
      }
      @media ($sm-1481) {
        margin-left: -24px;
        font-size: 34px;
        line-height: 38px;
      }
      @media ($sm-1199) {
        margin-left: 0px;
        font-size: 33px;
        line-height: 36px;
      }
      @media ($sm-991) {
        margin-left: 0px;
        width: 50%;
        font-size: 32px;
        line-height: 32px;
      }
      @media($sm-767){
        font-size: 26px;
        line-height: 28px;
        padding-bottom: 40px;
      }
      @media ($sm-579) {
        width: 100%;
        font-size: 24px;
        line-height: 32px;
        padding: 30px 0px 40px 45px;
      }
      span {
        color: #c9daaf;
        font-weight: 400;
        font-style: Italic;
 
        font-family: 'capraia_regularregular';
      }
    }
    .best-care-inner{
      display: flex;
      justify-content: flex-end;
      align-items: flex-end;
      width: 100%;
      margin-top: -77px;
      @media($sm-1199){
        margin-top: -110px;
      }
      @media($sm-767){
        margin-top: 0px;
      }
      @media ($sm-579) {
        margin-top: 0px;
        flex-wrap: wrap;
        padding-left: 0px;
        padding-right: 0px;
      }
      .prgrm-txt {
        width: 38%;
        margin-right: 60px;

        @media ($sm-991) {
          width: 50%;
          margin-right: 30px;
        }
        @media ($sm-579) {
          width: 100%;
          margin-right: 0px;
          margin-bottom: 24px;
          margin-top: 30px;
          padding: 48px;
        }
      }
      .rt-img {
        width: 340px;
        margin-right: 110px;

        @media ($sm-991) {
          width: 50%;
          margin-right: 0px;
        }
        @media ($sm-579) {
          width: 100%;
          height: unset;
        }
        img {
          width: 100%;
          object-fit: cover;
          border-radius: 16px;
            @media ($sm-579) {
                height: 100%;
            }
        }
        // flex: 1;
      }
    }

    .prgrm-txt {
      background: #fafcf5;
      padding: 48px;
      border-radius: 16px;
      @media ($sm-1679) {
        padding: 44px;
      }
      @media ($sm-1481) {
        padding: 40px;
      }
      @media ($sm-1199) {
        padding: 35px;
      }
      @media($sm-991){
        padding: 30px;
      }
      @media($sm-767){
        padding: 20px;
      }
      @media($sm-579){
        padding: 20px;
      }
      .subtitle {
        font-family: "Manrope", sans-serif;
        font-weight: 700;
        font-style: Bold;
        font-size: 24px;
        line-height: 34px;
        color: #3D5751;
        margin-bottom: 10px;
        // @media ($sm-1679) {
        //   font-size: 22px;
        //   line-height: 30px;
        // }
        // @media ($sm-1481) {
        //   font-size: 20px;
        //   line-height: 28px;
        // }
        // @media ($sm-1199) {
        //   font-size: 18px;
        //   line-height: 26px;
        // }
        // @media ($sm-991) {
        //   font-size: 16px;
        //   line-height: 24px;
        // }
        // @media ($sm-767) {
        //   font-size: 14px;
        //   line-height: 22px;
        // }
        span{
          @media($sm-579){
            display: block;
          }
          @media(max-width:330px){
            display: unset;
          }
        }
      }
      .sub-content {
        font-family: $font-sequel-medium-body;
        font-size: 14px;
        line-height: 24px;
        color: #000000;
        @media ($sm-1679) {
          // font-size: 13px;
        }

        @media ($sm-991) {
        //   font-size: 12px;
        }
      }
    }
  }

  .bottom-sec {
    display: flex;
    margin-top: 60px;
    // align-items: center;
    justify-content: space-between;
    @media ($sm-1679) {
      margin-top: 50px;
    }
    @media ($sm-1481) {
      margin-top: 40px;
    }
    @media ($sm-1199) {
      margin-top: 30px;
    }
    @media ($sm-579) {
      // width: 100%;
      flex-wrap: wrap;
      margin-top: 24px;
      padding: 0;
    }

    .wh-chose-img {
      width: 338px;
      // height: 207px;
      border-radius: 16px;
      @media($sm-579){
        padding: 0px;
      }
      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 16px;
      }

      @media ($sm-991) {
        width: 35%;
        // height: 200px;
      }
      @media ($sm-579) {
        width: 100%;
        height: 222px;
           order: 2;
      }
    }
    .wh-txt {
      flex: 1;
      margin-left: 40px;
      background: #f7f5c8;
      padding: 48px;
      border-radius: 16px;
          display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;

      @media ($sm-1679) {
        padding: 38px;
        margin-left: 30px;
      }
      @media ($sm-1481) {
        padding: 28px;
        margin-left: 20px;
      }
      @media ($sm-1199) {
        padding: 20px;
      }
      @media ($sm-579) {
        width: 100%;
        margin-left: 0;
        margin-top: 0px;
           order: 1;
        padding: 48px;
        margin-bottom: 24px;
      }
      .why-title {
        font-family: "Manrope", sans-serif;
        font-weight: 700;
        font-size: 24px;
        line-height: 32px;
        padding-bottom: 16px;
        color: #3D5751;
        // @media ($sm-1679) {
        //   font-size: 22px;
        //   line-height: 30px;
        // }
        // @media ($sm-1481) {
        //   font-size: 20px;
        //   line-height: 28px;
        // }
        // @media ($sm-1199) {
        //   font-size: 18px;
        //   line-height: 26px;
        // }
        // @media ($sm-991) {
        //   font-size: 16px;
        //   line-height: 24px;
        // }
        // @media ($sm-767) {
        //   font-size: 14px;
        //   line-height: 22px;
        // }
      }
      .why-content {
        font-size: 14px;
        line-height: 22px;
        font-family: $font-sequel-medium-body;
        @media ($sm-991) {
          // font-size: 13px;
        }
      }
    }
  }
}

.care-help {
  background: #eef7e8;
  padding: 120px 0;
   @media($sm-1679){
    padding: 80px 0px;
  }
  @media($sm-1481){
    padding: 60px 0px;
  }
  @media($sm-1199){
    padding: 40px 0px;
  }
  @media($sm-579){
    padding: 72px 0px;
  }
  .help-row {
    align-items: center;
    justify-content: center;
     @media($sm-579){
            padding: 0px 35px !important;
      }

    .help-wrp {
      @media ($sm-991) {
        width: calc(100% / 2 - 20px);
      }

      @media (max-width: 680px) {
        width: 100%;
      }
     
    }
  }
  .help-title-box {
    margin-bottom: 24px;
    margin-bottom: 70px;
    @media($sm-1679){
        margin-bottom: 50px;
    }
    @media($sm-1481){
        margin-bottom: 40px;
    }
    @media($sm-1199){
        margin-bottom: 30px;
    }
    @media($sm-579){
      text-align: left !important;
      padding-left: 35px;
      padding-right: 35px;
    }
    .help-main {
      font-style: italic;
      color: #3d5751;
      font-size: 36px;
      font-family: 'capraia_regularregular';
      // @media ($sm-1679) {
      //   font-size: 32px;
      // }
      // @media ($sm-1481) {
      //   font-size: 28px;
      // }
      // @media ($sm-1199) {
      //   font-size: 26px;
      // }
      // @media ($sm-991) {
      //   font-size: 24px;
      // }

      // @media ($sm-767) {
      //   font-size: 22px;
      // }
      @media($sm-579){
            max-width: 167px;
      }
    }
    .help-sub {
      font-size: 24px;
      font-family: "Manrope", sans-serif;
      color: #3d5751;
      text-align: center;
      font-weight: 700;
      @media ($sm-1679) {
        font-size: 22px;
      }
      @media ($sm-1481) {
        font-size: 20px;
      }
      @media ($sm-1199) {
        font-size: 18px;
      }
      @media ($sm-991) {
        font-size: 16px;
      }
      @media ($sm-767) {
        font-size: 14px;
      }
      @media($sm-579){
        display: none;
      }

      span{
        display: block;
      }
    }
  }

  .help-img-box {
    @media (max-width: 680px) {
      height: 315px;
      margin-bottom: 30px;
    }

    img {
      width: 100%;
      border-radius: 16px;
      height: 100%;
      object-fit: cover;
    }
  }

  .help-list {
    margin-left: 40px;
    @media (max-width: 680px) {
      margin-left: 0px;
    }

    .help-item {
      padding: 8px 0;

      cursor: pointer;
      transition: 0.2s;

      &.active {
        border-top: 1px solid #c9daaf;
        border-bottom: 1px solid #c9daaf;
        padding: 24px 0px;
        // @media($sm-1679){
        //     padding: 22px 0px;
        // }
        // @media($sm-1481){
        //     padding: 20px 0px;
        // }
        // @media($sm-1199){
        //     padding: 18px 0px;
        // }
      }

      &.active .help-item-title {
        color: #3d5751;
      }

      .help-item-title {
        font-size: 24px;
        color: #98a7a3;
        font-family: "Manrope", sans-serif;
        font-weight: 700;
        margin-bottom: 0;
        // @media ($sm-1679) {
        //   font-size: 22px;
        // }
        // @media ($sm-1481) {
        //   font-size: 20px;
        // }
        // @media ($sm-1199) {
        //   font-size: 18px;
        // }
        // @media ($sm-1481) {
        //   font-size: 16px;
        // }
      }

      .help-item-desc {
        font-size: 14px;
        font-family: $font-sequel-medium-body;
        color: #3d5751;
        margin-top: 6px;
        display: none;
        // @media ($sm-1679) {
        //   font-size: 13px;
        // }
        // @media ($sm-1481) {
        //   font-size: 12px;
        // }
      }

      &.active .help-item-desc {
        // display: block;
      }
    }
  }
}