.ImgBlock1 {
      padding-top: 20px;
    }

    .tg-three-steps {
      width: 90%;
      padding-left: 20px;
    }

    .card-serves-lable {
      display: flex;
      justify-content: space-between;
      font-weight: bold;
    }

    /* //slick styles start */

    .slick-dots li button:before {
      opacity: 1 !important;
      color: #fff;
      font-size: 20px;
    }

    .slick-dots li.slick-active button:before {
      color: black !important;
      font-size: 20px !important;
    }

    .slick-prev,
    .slick-next {
      background-color: transparent !important;
      color: #333333;
      border-radius: 50%;
      width: 40px;
      height: 40px;
    }

    .slick-prev:hover,
    .slick-prev:focus,
    .slick-next:hover,
    .slick-next:focus {
      color: transparent;
      outline: none;
      background: #333333;
    }

    .slick-prev:before,
    .slick-next:before {
      font-family: 'slick';
      font-size: 32px;
      line-height: 1.4;
      opacity: 0.75;
      color: black;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    .slick-slider {
      user-select: unset;
    }

    .slick-list {
      height: 440px;
    }

    .slick-dots {
      position: relative;
    }

    .slick-initialized .slick-slide {
      margin: -6px;
    }

    .slick-dots li button {
      border-radius: 50%;
      margin: -1px;
      color: black;
      background: black;
      border: 1px solid black;
    }

    /* //slick styles end */
    .nav-tabs>li.active>a,
    .nav-tabs>li.active>a:focus,
    .nav-tabs>li.active>a:hover {
      color: #555;
      cursor: default;
      background-color: #fff;
      /* border-bottom: 1px solid #ddd; */
      border-bottom-color: white;
      font-size: 20px;
      font-weight: 700;
    }

    .nav-tabs>li>a {
      color: black;

    }

    .ImgBlock {
      display: flex;
      justify-content: center;

    }


    .imgWidth {
      width: 500px;
    }

    .pt5 {
      padding-top: 6rem;
      padding-bottom: 8rem;
    }

    .pt51 {
      padding-top: 10rem;
      padding-bottom: 5rem;
    }




    .p15 {
      padding: 15px;
    }

    .pb-15 {
      padding-bottom: 5rem;
    }

    .get10ref {
      padding-bottom: 3rem;
    }

    .main_heading_text {
      font-size: 3rem;
      text-align: center;
      font-weight: 700;
      color: #324815;
    }

    .whatismealblock .h3 {
      text-align: center;
      font-size: 1.6rem;
      /* font-size: 2.1rem; */
      line-height: 2.25rem;
      font-weight: 700;
      text-transform: capitalize;
      color: #324815;
    }


    .copy-text {
      position: relative;
      /* padding: 10px; */
      background: #fff;
      /* border: 1px solid #ddd; */
      border-radius: 10px;
      display: flex;
      /* text-aligen:center; */
    }

    .copy-text input.text {
      padding: 10px;
      font-size: 18px;
      color: #555;
      border: none;
      outline: none;
      text-align: center;
      background: white;
    }

    .copy-text button {
      padding: 10px;
      background: #5784f5;
      color: #fff;
      font-size: 18px;
      border: none;
      outline: none;
      border-radius: 10px;
      cursor: pointer;
    }

    .howItWSection1 {
      position: relative;
      background-image: url('assets/tailer-cutting-master-background-patern.svg');

    }


    .howItWSection1::before {
      content: ' ';
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 60%;
      z-index: 0;
      opacity: 0.1;
      background-size: cover;
      background-image: url('assets/tailer-cutting-master-background-patern.svg');
      background-size: cover;
      background-position: 52% 28.999999999999996%;
      background-attachment: scroll;
      background-repeat: no-repeat;
      background: #e5e0e0;

    }

    .copy-text button:active {
      background: #809ce2;
    }

    .copy-text button:before {
      content: "Copied";
      position: absolute;
      top: -45px;
      right: 0px;
      background: #5c81dc;
      padding: 8px 10px;
      border-radius: 20px;
      font-size: 15px;
      display: none;
    }

    .copy-text button:after {
      content: "";
      position: absolute;
      top: -20px;
      right: 25px;
      width: 10px;
      height: 10px;
      background: #5c81dc;
      transform: rotate(45deg);
      display: none;
    }

    .copy-text.active button:before,
    .copy-text.active button:after {
      display: block;
    }


    .rule {
      display: flex;
    }

    .rule-number {
      font-weight: bold;
      margin-bottom: 10px;
      color: #324815;
    }

    .rule-description {
      margin-left: 20px;
    }

    .rule-note {
      font-style: italic;
      margin-top: 10px;
    }

    .flex-container {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .Heroflex-container {
      position: relative;
      top: -4px;
      width: 100%;
    }

    .h1Text {
      margin-bottom: 30px;
      text-align: left;
      font-weight: 900 !important;
      font: normal normal normal 42px/50px Proxima Nova;
      letter-spacing: 0px;
      font-size: 40px;
      letter-spacing: 0px;
      color: #151414e8;
      opacity: 1;

    }


    .h11Text {
      margin-bottom: 20px;
      color: white;
      font-weight: 700;
      width: 100%;
      text-align: left;
      font: normal normal bold 28px/40px Proxima Nova;
      letter-spacing: 0px;
      opacity: 1;
    }

    .h5Text {
      text-align: left;
      /* font-weight: bold !important; */
      font: normal normal normal 42px/50px Proxima Nova;
      letter-spacing: 0px;
      color: #E0284B;
    }

    .pText {
      font-size: 2rem;
      margin-bottom: 1rem;
      color: #fff;
    }

    .p3Text {
      font-size: 18px;
      font-family: 'Proxima Nova';
      line-height: 2.75rem;

    }

    .whatismealblock .p3Text {
      font-size: 18px;
      font-family: 'Proxima Nova';
      line-height: 35px;
      padding: 0px 0px;
      margin: 0px;
      color: #324815;
    }

    .referelCodeBlock {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .uniqueref {

      justify-content: center;
      align-items: center;
      border: 4px rgb(0, 128, 128) dashed;
      padding: 10px;

    }

    .howItWSection {

      background-size: cover;
      background-position: 52% 28.999999999999996%;
      background-attachment: scroll;
      background-repeat: no-repeat;
      top: 0px;
      opacity: 0.9;
    }

    .vegmeal123 {
      padding-bottom: 5rem;

      width: 100%;
    }


    .vegmeal123_innerblock {
      display: flex;
      justify-content: center;
    }



    .vegmeal_number {

      text-align: left;
      font: normal normal bold 57px/27px Proxima Nova;
      letter-spacing: 0px;
      color: white;
      opacity: 1;
      margin: 18px 3px;

    }

    .vegmeal_line {

      height: 80px;
      border: 1px solid #D0D0D0;


      margin: 20px 20px;
    }

    .vegmeal123 {
      padding-bottom: 5rem;

      width: 100%;
    }


    .vegmeal123_innerblock {
      display: flex;
      justify-content: center;
    }



    .eclipseImages {
      display: none;
    }

    .heroBckground {
      background-attachment: scroll;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center center;
      margin-top: 112px;

    }




    .Heroflex-container img.hero-img {
      width: 106%;

    }

    .mostlovedVegmeal {
      padding-bottom: 2rem;
      width: 100%
    }

    .browseTodaymenuH1 {
      width: 100%;
      line-height: 40px;
      margin-bottom: 60px;

    }

    .card-slider-block {
      background: #fff;
      margin: 1rem 0rem;
      background: #FFFFFF 0% 0% no-repeat padding-box;
      box-shadow: 0px 3px 6px #00000029;
      opacity: 1;
      height: 430px;
      margin-bottom: 30px;
    }

    .deliverydet-table h3 {
      margin: 0 0 15px 0;
    }

    .cardstyles {
      top: 1648px;
      left: 303px;
      width: 381px;
      height: 29px;
      font: normal normal bold 26px/27px Proxima Nova;
      letter-spacing: 0px;
      color: #324815;
      opacity: 1;



    }

    input[type=text] {
      width: 100%;
      padding: 8px 20px;
      margin: 8px 0;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
    }

    .cust-head {
      margin-top: 12px;
      font-family: 'Pathway Gothic One', sans-serif;
      font-size: 18px;
      color: black;
      margin-bottom: 6px;
    }

    .form-group>h6 {
      text-align: center;
      font-weight: bold;
    }


    .image-card-slider .card-title {
      color: #324815;
      font-weight: 700;
      font-size: 20px;
    }

    #dynamicContent .carditemBlock {
      height: 520px;
    }

    @media (min-width: 992px) {
      #dynamicContent .carditemBlock {
        height: 430px;
      }
    }

    @media (min-width: 768px) {
      #dynamicContent .carditemBlock {
        height: 370px;
      }
    }



    .carditemBlock {
      height: 356px;
      display: flex;
      align-items: center;
      background: #FFFFFF 0% 0% no-repeat padding-box;
      box-shadow: 0px 3px 6px #00000029;
      border: 1px solid #EEF7E4;
      opacity: 1;
      margin: 14px 0px;
    }

    @media (min-width: 1200px) {
      #dynamicContent .carditemBlock {
        height: 356px;
      }
    }


    /* Responsive Design */
    @media (max-width:320px) {

      .card-resources,
      .card-resources1 {
        height: 530px !important;
      }
    }



    @media (max-width: 992px) {


      .tg-meal-card {
        height: 260px;
      }
    }

    /* // slick styles */

    .card-slider .slick-dots {
      padding: 30px 0px 10px 0px;
      margin-left: -15px;
    }

    .card-slider .slick-next {
      position: absolute;
      right: -50px;
    }

    .card-slider .slick-prev {
      position: absolute;
      left: -50px;
    }

    /* slick styles end  */

    .textCuttingMaster {
      width: 100%;
      text-align: center;
      margin-top: 3rem;
    }

    .textCuttingMastera123 {
      width: 60%;
      text-align: center
    }


    #dynamicContent .carditemBlock {
      height: 430px;
    }

    @media (min-width : 1200px) {


      #dynamicContent .carditemBlock {
        height: 356px;
      }


    }


    @media screen and (-webkit-device-pixel-ratio: 2) and (device-height: 568px) and (device-width: 320px) {
      .cust-head {
        font-size: 16px;
      }
    }

    @media only screen and (min-width: 677px) and (max-width: 991px) {
      input[type=text] {
        width: 99%;
      }
    }


    @media (min-width: 1400px) {

      .container,
      .container-lg,
      .container-md,
      .container-sm,
      .container-xl,
      .container-xxl {
        max-width: 1270px;
      }
    }



    /* background images */

    .bac_kDrod_Img {
      width: 100%;
      /* height: 100%; */
      z-index: 99;
      position: relative;
      background: #ffffff;
      overflow-x: hidden;
    }

    .bac_kDrod_Img::before {
      content: "";
      display: block;
      top: 0;
      left: 0;
      width: 100%;
      position: absolute;
      height: 100%;
      background-image: url("assets/tailer-cutting-master-background-patern.svg");
      background-size: cover;
      background-repeat: no-repeat;
      z-index: -2;
      opacity: 0.3;
    }

    @media only screen and (min-width: 1024px) {
      .deask_Top_MD {
        width: 105%;
        height: 404px;
        /* Your CSS styles for screens with 1024px or more */
      }
    }

    /* 12-10-24 */
    .container_top_text {
      position: relative;
      text-align: center;
      color: #fff;
      font-size: 23px;
      margin-top: -30px;
      font-weight: 700;
    }

    .text_of_top1 {
      top: 9%;
      position: absolute;

    }

    .text_of_top1:hover {
      color: #387ae6;

    }

    .text_of_top2 {
      top: 20%;
      position: absolute;

    }

    .text_of_top2:hover {
      color: #387ae6;

    }

    .text_of_top3 {
      top: 30%;
      position: absolute;

    }

    .text_of_top3:hover {
      color: #387ae6;

    }

    .text_of_top4 {
      top: 41%;
      position: absolute;

    }

    .text_of_top4:hover {
      color: #387ae6;

    }

    .text_of_top5 {
      top: 53%;
      position: absolute;

    }

    .text_of_top5:hover {
      color: #387ae6;

    }

    .text_of_top6 {
      top: 64%;
      position: absolute;

    }

    .text_of_top6:hover {
      color: #387ae6;

    }

    .text_of_top7 {
      top: 74%;
      position: absolute;

    }

    .text_of_top7:hover {
      color: #387ae6;

    }


    /* 01-29-25  mobile view */
    @media only screen and (max-width: 425px) {
      .container_top_text {
        position: relative;
        text-align: center;
        color: #fff;
        font-size: 10px;
        margin-top: -30px;
        font-weight: 700;
      }
    }


    /* Default Styles */

    /* Media Query for 320px */
    @media screen and (min-width: 320px) {
      .Heroflex-container img.hero-img {
        margin-top: 13px;
      }
    }

    /* Media Query for 375px */
    @media screen and (min-width: 375px) {
      .Heroflex-container img.hero-img {
        margin-top: 13px;
      }
    }

    /* Media Query for 420px */
    @media screen and (min-width: 420px) {
      .Heroflex-container img.hero-img {
        margin-top: 13px;
        font-size: 10px;
      }
    }

    @media screen and (min-width: 720px) {
      .Heroflex-container img.hero-img {
        margin-top: 13px;
      }
    }

    @media screen and (min-width: 1020px) {
      .Heroflex-container img.hero-img {
        margin-top: 0px;
      }
    }

    @media screen and (min-width: 420px) {
      .MediAQerS {
        font-size: 10px;
      }
    }

    @media screen and (min-width: 1020px) {
      .MediAQerS {
        font-size: 25px;
      }
    }

    .card i, .card img {
  position: relative; /* instead of absolute unless necessary */
  z-index: 1; /* ensures they don't overlap text */
}