/* Adjust for 3840px screen */
@media (min-width: 3840px) {
  .carousel-caption-left {
    left: 33%;
  }
  .banner {
    margin-top: 2%;
  }
  .carousaltop {
    margin-top: 2%;
  }
  .left img {
    width: 65%;
    padding-bottom: 169px;
  }
}
@media (min-width: 1920px) {
  .left img {
    width: 53%;
    padding-bottom: 169px;
  }
  .banner {
    margin-top: 3%;
  }
  .carousaltop {
    margin-top: 3%;
  }
  .carousel-caption-left {
    left: 16%;
  }
}
@media (min-width: 1440px), (min-width: 1024px), (min-width: 768px) {
  /* .banner-text {
    left: 5%;
  } */
}
@media (max-width: 1284px) {
  .left img {
    padding-bottom: 220px;
  }
}
@media (max-width: 1024px) {
  .left-col .text-block,
  .top-block .text-block,
  .bottom-block .text-block {
    right: 0;
    bottom: 20px;
    left: 40px;
  }
  .text-block h2 {
    font-size: 22px;
    line-height: 24px;
    margin: 0 0 10px;
  }
  .text-block p {
    font-size: 16px;
    padding-bottom: 11px;
  }
  .sustome-journey .card {
    height: 540px;
  }
  .medianewsection {
    margin-top: 0px;
  }
  .medianewsection .left {
    width: 100%;
  }
  .medianewsection .right {
    width: 100%;
  }
  .left {
    width: 501px;
    padding-left: 120px;
  }
  .left img {
    max-width: 62%;
    padding-bottom: 141px;
  }
  .right {
    width: 523px;
  }
  .overlay {
    width: calc(100% - 190px);
  }
  .overlay h2 {
    font-size: 22px;
    line-height: 28px;
    padding-bottom: 8px;
  }
  .overlay p {
    font-size: 16px;
    padding-bottom: 11px;
  }

  .carousel-caption-left {
    left: 11%;
  }
}
@media (max-width: 834px), (max-width: 912px) {
  .courtesytext {
    width: 71%;
    text-align: center;
  }
  .animationslide {
    position: relative;
    height: 410px;
  }
  .nav-menu ul {
    gap: 16px;
  }
  .right {
    width: 413px;
  }
  .left {
    width: 390px;
    padding-left: 60px;
  }
  .overlay.left-text {
    color: #313131;
    left: 60px;
    padding-top: 30px;
  }
  .overlay {
    width: calc(91% - 52px);
    left: 50px;
  }
  .img-back {
    right: 52px;
  }
  .img-middle {
    right: 119px;
  }
  .img-front {
    right: 46px;
  }
  .feturedhdng {
    width: 100%;
    display: block !important;
    text-align: center;
    white-space: normal;
    flex: 0 0 100%; /* Equivalent to col-12 */
    max-width: 100%;
    padding-bottom: 40px;
  }
  .feturedhdng p {
    width: 100%; /* full width */
    word-wrap: break-word;
    overflow-wrap: break-word; /* ensures text breaks properly */
    padding-right: 0;
  }
  .featuretab.col-md-8 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .feturedhdng h2 br {
    display: contents; /* Prevent the <br> from breaking the line */
  }

  .integration-free-solutions p {
    width: 100%;
    padding-bottom: 0;
  }
}

@media (max-width: 768px) {
  .left-col .text-block,
  .top-block .text-block,
  .bottom-block .text-block {
    right: 0;
    bottom: 20px;
    left: 20px;
    width: 100%;
  }
  .text-block {
    position: absolute;
    left: 26px; /* keep 3 col left space */
    right: 0;
    bottom: 20px; /* equal bottom spacing */
    top: auto; /* reset any desktop top values */
  }

  .text-block h2 {
    font-size: 20px;
    line-height: normal;
    padding-bottom: 10px;
    margin-bottom: 0;
  }
  .left-col .text-block p {
    padding-bottom: 0px;
  }
  .text-block p,
  .text-block span a {
    font-size: 16px;
    padding-bottom: 10px;
    margin-bottom: 0;
  }
  .ouradvantage {
    padding: 80px 0px;
  }
  .ouradvantage .row.gap-90 {
    --bs-gutter-x: 50px;
  }
  .bottomspacethirty {
    margin-bottom: 30px;
  }
  .topspacethirty {
    margin-top: 30px;
  }
  .row.gx-5.topspacethirty {
    margin-top: 30px;
  }
  .courtesytext {
    width: 91%;
  }
  .animationslide {
    position: relative;
    height: 390px;
  }
  /* home page whatsnew section */
  .profile-card img {
    width: 100%;
    height: auto;
  }
  .carousel-caption-left {
    left: 4%;
  }
  .carousel-caption-left h1,
  .carousel-caption-left h2 {
    font-size: 32px;
  }

  .banner {
    margin-top: 10%;
    height: 300px;
  }
  .carousaltop {
    margin-top: 10%;
  }

  .banner h1 {
    font-size: 32px;
    padding-left: 15px;
  }
  .whatsnew .container-fluid {
    grid-template-columns: 1fr;
    padding-left: 0;
    padding-right: 0;
  }
  .left {
    padding-left: 20px;
    padding-top: 24px;
    padding-bottom: 20px;
    width: inherit;
  }
  .medianewsection .left {
    padding-bottom: 0px;
    padding-top: 0;
  }
  .right {
    width: inherit;
  }
  .overlay {
    width: calc(100% - 40px);
    left: 26px;
  }
  .overlay h2 {
    font-size: 32px;
    padding-bottom: 8px;
    line-height: 36px;
  }
  .overlay p {
    font-size: 16px;
    padding-bottom: 11px;
  }

  .overlay.left-text {
    left: 26px;
    padding-top: 20px;
  }
  .top-row .image-container {
    max-width: 100%;
  }
  .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
    font-size: 14px;
    text-align: center;
  }

  /* .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
    font-size: 18px;
    white-space: nowrap;
   padding: 0.3rem 0.3rem; 
  }*/
  /* .curentopening .nav-item {
    padding: 0 9px 0 9px;
  } */
  .profile-card {
    padding: 0;
  }
  .profile-card img {
    object-fit: cover;
  }
  .g-5,
  .gx-5 {
    gap: 0 !important;
    --bs-gutter-x: 0;
  }
  .sliderbox .slide {
    flex-direction: column;
  }
  .sliderbox .slide-text {
    width: auto;
    order: 2;
    padding: 10px;
    text-align: center;
    margin: 20px;
  }
  .sliderbox .slide-img {
    width: auto;
    order: 1;
    padding: 10px;
  }
  .membership h2 {
    font-size: 32px;
  }
  .topspace {
    margin: 60px 0px;
  }
  .futuristicproduct {
    padding: 30px 17px;
  }
  .techplatform .futuristicproduct h2 {
    text-align: left;
  }
  .futuristicproduct h3 {
    font-size: 28px;
  }
  .row-gap {
    margin-bottom: 40px;
  }
  .no-left-padding .futuristicproduct {
    padding: 30px 17px;
  }
  .membership.worknospace p {
    width: auto;
  }
  .col-md-7.futuristicproduct.customerfocus {
    margin-top: 0;
  }
  .greybg {
    background-color: #ededed;
    margin-bottom: 0;
    padding: 50px 0;
  }
  .membership p {
    font-size: 16px;
  }

  .feature-category {
    font-weight: 500;
    font-size: 16px !important;
  }

  .ourPlanDelivery .feature-table td {
    font-size: 14px;
  }

  .ourPlanDelivery .icon {
    width: 15px;
    height: 15px;
  }

  .ourPlanDelivery .feature-table th {
    padding: 20px 10px;
    /* background-color: #f9f9f9; */
    font-size: 16px;
    font-weight: 500;
    font-family: "EB Garamond";
  }

  .ourPlanDelivery h2 {
    font-size: 32px;
    font-weight: 400;
    text-align: center;
    margin: 60px 0px 40px 0px;
  }
  /* CLIENTS CSS START */
  .casestudy-grid-container {
    grid-template-columns: 1fr; /* Single column on mobile */
  }

  .casestudey-item1,
  .casestudey-item2,
  .casestudey-item3 {
    grid-column: 1; /* Each item will take full width */
    grid-row: auto; /* Reset row spanning for mobile */
  }
  .casestudey-item1 img {
    height: auto;
  }
  .casestudies-icon-row img {
    width: 20%;
  }
  .membership-card {
    width: 180px;
    float: left;
    box-sizing: border-box;
    transform: none;
    transition: none;
    height: 184px;
  }
  .membership-card .icon-text img {
    width: 40%;
    height: auto;
    transform: none; /* Remove transform */
    transition: none; /* Remove transition */
    margin-right: 132px;
    margin-top: 27px;
  }
  .icon-text h4 {
    font-size: 13px;
    transform: none; /* Remove transform */
    transition: none; /* Remove transition */
    margin-right: 100px;
    margin-bottom: 30px;
  }
  .icon-text {
    transform: none; /* Remove transform */
    transition: none; /* Remove transition */
  }
  .membership-card:hover .icon-text img,
  .tablereserver.membership-card:hover .icon-text img,
  .voucher.membership-card:hover .icon-text img,
  .delivery.membership-card:hover .icon-text img {
    transform: none; /* Remove transform */
    transition: none; /* Remove transition */
    opacity: 1; /* Reset opacity */
  }
  .tablereserver.membership-card .icon-text img {
    margin-top: 40px;
    width: 50%;
    margin-right: 17px;
    margin-bottom: 11px;
  }
  .tablereserver .icon-text h4 {
    transform: none;
    /* margin-right: 60px; */
    margin-right: 6px;
    width: 100%;
  }
  .voucher.membership-card .icon-text img {
    margin-top: 60px;
    width: 37%;
    margin-left: 222px;
    margin-bottom: 11px;
  }
  .voucher .icon-text h4 {
    transform: none;
    margin-left: 5px;
    margin-bottom: 56px;
  }
  .delivery.membership-card .icon-text img {
    margin-top: 58px;
    width: 31%;
    margin-left: 233px;
    margin-bottom: 1px;
  }
  .delivery .icon-text h4 {
    transform: none;
    margin-left: -12px;
    margin-bottom: 56px;
  }
  .feturedlist {
    margin-top: 30px;
  }
  .text-overlay {
    top: 13%;
  }
  .img-front {
    width: 30%;
    right: 24px;
  }
  .img-middle {
    width: 30%;
    right: 87px;
  }
  .img-back {
    right: 92px;
    width: 67%;
  }
  .courtesytext {
    text-align: center;
  }
  .techproducts .img-front {
    right: 86px;
  }
  .techproducts .img-middle {
    right: 139px;
  }

  .cookie-consent-modal {
    text-align: center;
    flex-direction: column;
    padding: 1.5rem 1rem;
    .cookie-consent {
      width: 100%;
      .cookie-consent-heading {
        font-size: 18px;
      }
      .cookie-consent-content {
        font-size: 14px;
        margin-bottom: 1rem;
      }
    }
    .cookie-consent-btn {
      font-size: 14px;
      padding: 0.5rem 1rem;
    }
  }
  .restaurant h2 {
    padding-bottom: 40px;
    font-size: 32px;
  }
  .sustome-journey .customer-journey-title h3 {
    font-size: 36px;
    margin: 60px 0px 24px 0px;
  }
}
@media (max-width: 767px) {
  .ouradvantage .border-bottom {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .ouradvantage .rowtoppadding {
    margin-top: 0px;
  }
  .ouradvantage .listing p {
    margin-bottom: 0;
  }
  .knowmorehdng h4 {
    font-size: 32px;
  }
  .knowmorehdng {
    margin-top: 0px;
    margin-bottom: 20px;
  }
  .ctabutton.margintopforty {
    margin-top: 34px;
  }
  .ouradvantage {
    margin-top: 40px;
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .ouradvantage .hdng h4 {
    font-size: 32px;
  }
  .whatwedo {
    margin-top: 40px;
    padding: 0;
    background: #fff;
  }
  .whatwedo .hdng h4 {
    font-size: 32px;
  }
  .ouradvantage .rowtoppadding .col-md-6:first-child .d-flex {
    border-bottom: 1px solid #eaeaea;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .ouradvantage .rowtoppadding .col-md-6:nth-child(2) .d-flex {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .ouradvantage .row.gap-90 {
    --bs-gutter-x: 0px;
  }
  .kittyparty {
    margin: 40px 0 0 0;
}
}
@media (max-width: 765px) {
  .knowmore {
    margin-bottom: 60px;
  }
  .sustome-journey .card {
    height: 360px;
  }
  .banner .banner-text {
    align-items: flex-end;
    justify-content: center;
    padding: 0 10px 20px 10px;
    text-align: center;
  }
  .integration-free-solutions {
    margin-top: 40px;
    text-align: center;
  }
  .medianewsection .overlay.overlaywidth {
    width: calc(100% - 141px);
    left: 50px;
  }
  .medianewsection .overlay {
    left: 50px;
  }
  .servicessection p {
    padding: 9px 0px 0px;
  }
  .servicessection ul {
    padding: 9px 28px 0px;
  }
  .overlay h2 {
    font-size: 24px;
  }
  .whatsnew {
    margin-bottom: 60px;
  }
  iframe {
    width: 100%;
    height: 224px;
  }
  .feturedhdng h2 {
    font-size: 36px;
    text-align: center;
    display: block !important;
    white-space: nowrap;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .feturedhdng p {
    text-align: center;
  }
  .feturedhdng br {
    display: none; /* Hide <br> tag on mobile */
  }
  .feturedproducthp {
    padding: 20px 0;
    margin-bottom: 60px;
    margin-top: 40px;
  }
  .membership-card {
    width: 153px;
    height: 160px;
    margin-top: 0px;
  }
  .icon-text h4 {
    margin-right: 78px;
    margin-bottom: 30px;
  }
  .membership-card .icon-text img {
    width: 40%;
    margin-right: 130px;
    margin-top: 27px;
  }
  .tablereserver.membership-card .icon-text img {
    margin-top: 40px;
    width: 42%;
    margin-right: 17px;
    margin-bottom: 11px;
  }
  .tablereserver .icon-text h4 {
    transform: none;
    /* margin-right: 60px; */
  }
  .voucher.membership-card .icon-text img {
    margin-top: 57px;
    margin-left: 204px;
    margin-bottom: 11px;
  }
  .voucher .icon-text h4 {
    transform: none;
    margin-left: 3px;
  }
  .delivery.membership-card .icon-text img {
    margin-left: 212px;
  }
  .delivery .icon-text h4 {
    transform: none;
    margin-left: -16px;
  }
  .feturedlist {
    background: none;
  }
  .feturedlisthdng {
    text-align: center;
  }
  .feturedlisthdngbotmspace {
    margin-bottom: 20px;
  }

  .carousel-caption-left {
    top: auto;
    bottom: 10%;
    left: 50%;
    transform: translateX(-50%);
    max-width: 90%;
    text-align: center;
    width: 100%;
    padding: 0;
  }

  .carousel-caption-left h1,
  .carousel-caption-left h2 {
    text-align: center;
    font-size: 32px;
  }

  .tlc_hdng {
    font-size: 18px;
    margin-top: 40px;
  }
  .hmetechimg img {
    transform: inherit;
    width: 100%;
    margin-bottom: 0px;
  }
  .techplatform {
    margin-top: 40px;
  }
  .compliances,
  .securityandcompliance {
    margin-top: 0px;
  }
  .techplatform .row {
    margin-bottom: 40px;
  }
  /* ABOUTUS CSS START */
  .securityandcompliance {
    margin-top: 60px;
  }
  .aboutus .col-md-5.me-md-5 {
    text-align: center;
    margin-top: 16px;
  }
  .aboutus .col-md-5.ms-md-5 {
    text-align: center;
    margin-top: 16px;
  }
  .techplatform h2 {
    font-size: 28px;
    text-align: center;
    margin-top: 0px;
  }
  .techplatform p {
    text-align: center;
  }
  .compliances-logo ul li {
    max-width: 40%;
    padding-bottom: 30px;
  }
  .compliances-logo {
    margin-top: 20px;
  }
  .text-overlay {
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
  }

  .digitechbrand-heading h2 {
    font-size: 32px;
  }

  /* SERVICES CSS START */
  .integration-free-solutions h1 {
    font-size: 32px;
  }
  .integration-free-solutions h4 {
    font-size: 32px;
  }
  .services.integration-free-solutions p {
    font-size: 18px;
  }
  .servicestopmargin {
    /* margin-top: 5px; */
    margin-top: 36px;
  }
  .servicessection h3 {
    font-size: 28px;
  }
  .compliances-heading h2 {
    font-size: 32px;
    margin-bottom: 40px;
  }
  .services-capabilities {
    margin-top: 0px;
  }
  .bdr {
    display: none;
  }
  .innovate {
    margin-top: 60px;
  }
  .innovate h3 {
    font-size: 32px;
  }
  .innovate p {
    font-size: 16px;
  }

  /* DIGITECH CSS START */
  .digitech .col-md-6 {
    text-align: center;
    padding-top: 0px;
  }
  .tech-Platforms-logo.compliances-logo ul li {
    width: 30%;
  }
  .col-custom,
  .col-custom2,
  .col-custom6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .casestudies-icon-row img {
    width: 25%;
    margin-right: 2px;
  }
  .digitech.techplatform.casestudies img {
    max-width: 100%;
    margin-bottom: 30px;
  }
  .centeralign {
    justify-content: center;
  }
  .integration-free-solutions p {
    width: 90%;
  }
  /* CAREERS CSS START */
  .openning {
    margin-top: 45px;
  }
  .openning p {
    font-size: 16px;
  }
  .openning h4 {
    font-size: 32px;
  }
  .curentopening {
    margin-top: 30px;
  }
  .row.gx-5.topspacethirty {
    margin-top: 30px !important;
  }
  .jobopening.servicessection .row {
    margin-top: 0px;
  }
  .jobopening.servicessection .col-md-6 {
    margin-bottom: 30px;
  }
  .servicessection .row {
    margin-top: 10px;
  }

  .servicessection {
    margin-top: 60px;
  }

  /* CARRER CSS START */
  .knowmore-btn {
    margin-bottom: 30px;
  }
  .careerinner {
    margin-top: 40px;
  }
  .cta-button {
    margin: 24px auto 60px;
  }
  .jobprofile h2 {
    margin-top: 20px;
  }
  .allopening {
    margin-top: 40px;
  }
  .text-md-right {
    text-align: left;
  }

  .animationslide {
    display: flex;
    justify-content: center;
  }
  .logo-grid {
    text-align: center;
    margin-bottom: 10px;
  }
  .margintop404 {
    margin-top: 20%;
  }

  .techproducts .animationslide {
    height: 370px;
    margin-bottom: 10px;
  }
  /* .curentopening .nav-item {
    width: auto;
  } */
  .techbottommargin {
    margin-bottom: 40px;
  }
  .techplatform .row.techbottommarginsixty {
    margin-bottom: 60px;
  }
  .futuristicproduct ul {
    margin-bottom: 0;
  }
}

@media (max-width: 600px) {
  .techproducts .img-front {
    right: 136px;
  }
  .techproducts .img-middle {
    right: 229px;
  }
  .techproducts .animationslide {
    height: 490px;
    margin-bottom: 10px;
  }
  .animationslide {
    height: 500px;
  }
  .img-front {
    right: 56px;
  }
  .img-middle {
    right: 147px;
  }
  .img-back {
    right: 152px;
  }
}
@media (max-width: 480px) {
  .left-col .text-block,
  .top-block .text-block,
  .bottom-block .text-block {
    right: 0;
    bottom: 18px;
    left: 20px;
    width: 100%;
  }
  .text-block h2 {
    font-size: 18px;
    line-height: normal;
    padding-bottom: 5px;
    margin-bottom: 0;
  }
  .left-col .text-block p {
    padding-bottom: 0px;
  }
  .text-block p,
  .text-block span a {
    font-size: 14px;
    padding-bottom: 5px;
    margin-bottom: 0;
  }

  .banner {
    height: 323px;
    margin-top: 17%;
  }
  .carousaltop {
    margin-top: 16%;
  }
  .carousel-caption-left h1,
  .carousel-caption-left h2 {
    text-align: center;
    font-size: 25px;
  }
}
@media (max-width: 475px) {
    .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
          font-size: 14px;
        text-align: center;
        padding: 7px 0 7px 0px;
    }
  }
  .techproducts .animationslide {
    height: 350px;
    margin-bottom: 10px;
  }
  .techproducts .img-middle {
    right: 179px;
  }
  .techproducts .img-front {
    right: 114px;
  }
  .overlay h2 {
    font-size: 20px;
    line-height: normal;
  }
  .left img {
    padding-bottom: 130px;
  }
  .img-front {
    width: 27%;
    right: 44px;
  }
  .img-middle {
    width: 27%;
    right: 110px;
  }
  .img-back {
    width: 64%;
    right: 119px;
    top: 60px;
  }
  .membership-card {
    margin-right: 0;
    /* margin-left: 5px; */
    margin-left: 22px;
  }
  .margintop404 {
    margin-top: 30%;
  }
  .animationslide {
    height: 390px;
  }
}
@media (max-width: 430px) {
  .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
    font-size: 13px;
    padding: 5px 1%;
  }
}

@media (max-width: 390px) {
  .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
    font-size: 12px;
  }
  .animationslide {
    height: 350px;
  }
  .img-middle {
    right: 100px;
  }
  .img-back {
    right: 89px;
  }
}

@media (max-width: 360px) {
  .animationslide {
    height: 330px;
  }
  .membership-card {
    margin-left: 9px;
  }
}

@media (max-width: 344px) {
  .membership-card {
    margin-left: 22px;
  }
  .membership-card {
    width: 126px;
    height: 130px;
    margin-top: 0px;
  }
  .membership-card .icon-text img {
    margin-right: 112px;
  }
  .icon-text h4 {
    margin-right: 58px;
  }
  .delivery.membership-card .icon-text img {
    margin-left: 174px;
  }
  .voucher.membership-card .icon-text img {
    margin-left: 169px;
  }
  .tablereserver .icon-text h4 {
    margin-right: 11px;
  }
  .digitech-icon-row img {
    width: 30px;
  }
  .overlay {
    bottom: 9px;
  }
  .overlay h2 {
    font-size: 18px;
  }
  .overlay p {
    font-size: 14px;
  }
  .overlay span a {
    font-size: 14px;
  }
  .left img {
    padding-bottom: 114px;
  }
}
@media (max-width: 340px) {
  /* .text-overlay {
    top: 7%;
    width: 90%;
  } */
  .text-overlay h2 {
    font-size: 24px;
  }
  .text-overlay p {
    font-size: 14px;
  }
  .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
    font-size: 10px;
    text-align: center;
  }
}

@media (max-width: 320px) {
  .curentopening .nav-tabs .nav-link,
  .curentopening .nav-tabs .nav-link.active {
    font-size: 10px;
    padding: 0;
    margin: 0 auto;
  }
}