@media screen and (max-width: 600px) {
    /* .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
      float: none;
      display: block;
      text-align: left;
    } */
   
  
    .text5{
        font-size: 19px !important;
      }
    
      .review-container{
        margin-left: 191px;
        margin-top: -33px;
      }
  
      .revenue-container{
        margin-top: -45px !important;
      }  
  
      .revenue {
      font-size: 14.789px !important;
  
  }
  
  .mobilebox{
    width:75% !important;
  }
  
    .experience-container{
      margin-top: 18px !important;
      margin-left: -27px;
    }
  
    .professionals-container{
      margin-top: 18px !important;
      margin-left: -27px;
    }
  
    .clients-container{
      margin-top: 18px !important;
      margin-left: -27px;
    }
     
  
  .semibold {
    
      font-size: 17px !important;
      }
  
  .w-6\/12 {
        width: 100%;
    }
  
  .chevron {
    width: 25px !important;
    height: 25px !important;
  }
  
  .text-black{
    font-size: 13px !important;
  }
  
  .testimonial {
    font-size: 17px !important;
  }
  }
  
  h1{
    text-align: center !important; 
    font-family: ui-monospace !important;
    font-size: xxx-large !important;
  }
  
  /* p{
    text-align: center; 
    color: rgb(176, 123, 236);
    font-size: 15px;
  } */
  
  @media (min-width: 1536px) {
      .container {
          max-width: 2000px !important;
      }
  }
  
  @media (max-width: 1536px) {
      .custom-width{
    width: 500px !important;
  }
      .custom-margin{
        width: 350px !important;
        margin-top: 385px !important;
        margin-left: 0px !important;
      }
  
      .resp{
        margin-right: -175px !important;
        margin-top: 134px !important;
        margin-left: -170px !important;
      }
      
      .resp1{
        margin-left: -54px !important;
        margin-top: 74px !important;
      }
  
      .respimg{
        width:187px !important;
      }
  
      .grid{
        height: 370px !important;
      }
  
      /* .inset-0 {
        top: 43px !important;
        right: 0;
        bottom: 0;
        left: 0;
    } */
  } 
  
  @media only screen and (min-width: 769px) and (max-width: 782px) {
  
    .grid {
      height: 275px !important;
    }
  
       .custom-width {
         width: 285px !important;
         margin-top: -3px;
         height: 600px;
       }
    
       .custom-margin {
         width: 199px !important;
         margin-top: 204px !important;
         margin-left: -145px !important;
       }
    
       .resp {
         /* margin-right: -175px !important; */
         margin-top: -750px !important;
         margin-left: 274px !important;
         width: 374px !important;
       }
    
       .resp1 {
         margin-left: 200px !important;
         margin-top: -782px !important;
         width: 134px !important;
       }
    
       .respimg {
         width: 254px !important;
       }
       
    .arrowimg {
      display: none;
    }
  
    .contain {
      margin-top: -100px;
    }
  
    /* .inset-0 {
        top: 43px !important;
        right: 0;
        bottom: 0;
        left: 0;
    } */
  
    .border-box {
      height: 275px !important;
    }
  
    .text5 {
      font-size: 24px !important;
    }
  
    .review-container {
      margin-left: 264px !important;
      margin-top: 5px !important;
    }
  
    .revenue-container {
      margin-top: -45px !important;
    }
  
    .revenue {
      font-size: 16.789px !important;
  
    }
  
    .professionals-container {
      margin-top: 40px !important;
      margin-left: -27px !important;
    }
  
  
    .semibold {
  
      font-size: 18px !important;
    }
  
    .w-6\/12 {
      width: 100%;
    }


         .inputonbox {
           position: absolute;
           top: -32px !important;
           left: 6% !important;
           width: 75% !important;
           height: 23px !important;
           padding: 10px;
           font-size: 13px;
           border: none;
           border-radius: 8px;
           box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
           text-align: left;
         }
  }
  
  
  @media only screen and (min-width: 783px) and (max-width: 968px) {
  
    .grid {
      height: 245px !important;
    }
  
           .custom-width {
             width: 283px !important;
             margin-top: -3px;
             height: 600px;
           }
      
           .custom-margin {
             width: 213px !important;
             margin-top: 203px !important;
             margin-left: -137px !important;
           }
      
           .resp {
             /* margin-right: -175px !important; */
             margin-top: -761px !important;
             margin-left: 342px !important;
             width: 396px !important;
           }
      
           .resp1 {
             margin-left: 255px !important;
             margin-top: -810px !important;
             width: 149px !important;
           }
      
           .respimg {
             width: 254px !important;
           }
  
    .arrowimg {
      display: none;
    }
  
    .contain {
      margin-top: -100px;
    }
  
    /* .inset-0 {
        top: 43px !important;
        right: 0;
        bottom: 0;
        left: 0;
    } */
  
    .border-box {
      height: 275px !important;
    }


        .inputonbox {
          position: absolute;
          top: -32px !important;
          left: 6% !important;
          width: 75% !important;
          height: 23px !important;
          padding: 10px;
          font-size: 13px;
          border: none;
          border-radius: 8px;
          box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
          text-align: left;
        }
  
    .text5 {
      font-size: 24px !important;
    }
  
    .review-container {
      margin-left: 264px !important;
      margin-top: 5px !important;
    }
  
    .revenue-container {
      margin-top: -45px !important;
    }
  
    .revenue {
      font-size: 16.789px !important;
  
    }
  
    .professionals-container {
      margin-top: 40px !important;
      margin-left: -27px !important;
    }
  
  
    .semibold {
  
      font-size: 18px !important;
    }
  
    .w-6\/12 {
      width: 100%;
    }
  }
  
  @media only screen and (min-width: 969px) and (max-width: 1008px) {
  
  .grid{
  height: 200px;
  }
  .custom-width {
    width: 369px !important;
    margin-top: -3px;
    height: 600px;
  }
  
  .custom-margin {
    width: 249px !important;
    margin-top: 279px !important;
    margin-left: -197px !important;
  }
  
  .resp {
    /* margin-right: -175px !important; */
    margin-top: -803px !important;
    margin-left: 379px !important;
    width: 496px !important;
  }
  
  .resp1 {
    margin-left: 258px !important;
    margin-top: -845px !important;
    width: 169px !important;
  }
  
  .respimg {
    width: 254px !important;
  }
  
  .arrowimg{
    display:none;
  }
  
  .contain{
    margin-top: -100px;
  }
  
  /* .inset-0 {
        top: 43px !important;
        right: 0;
        bottom: 0;
        left: 0;
    } */
  
  .border-box {
        height:275px !important;
      }
  
  .text5{
        font-size: 24px !important;
      }
    
  .review-container{
        margin-left: 264px !important;
        margin-top: 5px !important;
      }
  .revenue-container{
        margin-top: -45px !important;
      }  
  
  .revenue {
      font-size: 16.789px !important;
  
  }
  
  .professionals-container{
    margin-top: 40px !important;
    margin-left: -27px !important;
  }

    .inputonbox {
      position: absolute;
      top: -32px !important;
      left: 6% !important;
      width: 75% !important;
      height: 23px !important;
      padding: 10px;
      font-size: 16px;
      border: none;
      border-radius: 8px;
      box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
      text-align: left;
    }
     
  
  .semibold {
    
      font-size: 18px !important;
      }
  
  .w-6\/12 {
        width: 100%;
    }
  }
  
  
  @media only screen and (min-width: 1008px) and (max-width: 1024px) {
  
    .grid{
      height:200px;
    }
          .custom-width {
            width: 369px !important;
            margin-top: -3px;
            height: 600px;
          }
      
          .custom-margin {
            width: 249px !important;
            margin-top: 279px !important;
            margin-left: -197px !important;
          }
      
          .resp {
            /* margin-right: -175px !important; */
            margin-top: -803px !important;
            margin-left: 379px !important;
            width: 496px !important;
          }
      
          .resp1 {
            margin-left: 258px !important;
            margin-top: -845px !important;
            width: 169px !important;
          }
      
          .respimg {
            width: 254px !important;
          }

        .inputonbox{
          position: absolute;
            top: -32px !important;
            left: 6% !important;
            width: 75% !important;
            height: 23px !important;
            padding: 10px;
            font-size: 16px;
            border: none;
            border-radius: 8px;
            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
            text-align: left;
        }
  
      .arrowimg{
        display:none;
      }
  
      /* .inset-0 {
        top: 43px !important;
        right: 0;
        bottom: 0;
        left: 0;
    } */
  
    .border-box {
        height:290px !important;
      }
  
      .text5{
        font-size: 24px !important;
      }

            .font7 {
              font-size: 13px;         
            }
              
      
  }
  
  
    @media only screen and (min-width: 1024px) and (max-width: 1500px) {
      
      .grid{
      height:200px;
    }
       
      .semibold{
        margin-left:0px;
      }

        .exp {
          font-size: 24px !important;
        }
    
        .textexp {
          font-size: 12px !important;
        }


      .inputonbox{
        position: absolute;
          top: -43px !important;
          left: 6% !important;
          width: 75% !important;
          height: 32px !important;
          padding: 10px;
          font-size: 16px;
          border: none;
          border-radius: 8px;
          box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
          text-align: left;
      }
  
           .custom-width {
             width: 422px !important;
             margin-top: -3px;
             height: 600px;
           }
      
           .custom-margin {
             width: 279px !important;
             margin-top: 328px !important;
             margin-left: 60px !important;
           }
      
           .resp {
             /* margin-right: -175px !important; */
             margin-top: 94px !important;
             margin-left: -43px !important;
             width: 598px !important;
           }
      
           .resp1 {
             margin-left: 123px !important;
             margin-top: 48px !important;
             width: 194px !important;
           }
      
           .respimg {
             width: 254px !important;
           }
  
      .arrowimg{
        display:none;
      }
  
      .border-box {
        height:260px !important;
      }
  
      .inset-0 {
        top: 54px !important;
        right: 0;
        bottom: 0;
        left: 0;
    }
  
    .text5{
      font-size: 24px !important;
    }
  
    }  
  
  
    
    @media (max-width: 480px) {
      /* .footer{
        padding: 20px 20px !important;
      } */
    }
    
    @media (max-width: 480px) {
      /* .custom-width {
        width: 400px !important;
      } */
      .custom-margin {
        margin-left: -20px !important;
      }  
      .grid{
        width: 0px !important;
      }
      .revenue{
        margin-left: 0px !important;
      }
  
      .text5{
        font-size: 19px !important;
      }
      .vector-image {
        height: 100px !important;
      }
      .vectorit{
        margin-top: 24px;
        margin-left: -28px;
      }
      .exp {
        font-size: 24px !important;
      }
      .textexp{
        font-size: 12px !important;
      }
    }
  
        @media only screen and (min-width: 100px) and (max-width: 320px) {
          .mobilebanner1 {
              width: 77% !important;
            }
      .mobilebanner2{
        width: 77% !important;
      }
      .grid{
        height: 200px !important;
      }
            .text5 {
              color: #000 !important;
              font-family: "Zen Dots" !important;
              font-size: 25px !important;
              font-style: normal !important;
              font-weight: 400 !important;
              line-height: normal !important;
              align-self: stretch !important;
            }

            .inputonbox{
          top: -42px !important;
            left: 4% !important;
            width: 58% !important;
            height: 29px !important;
          }
                .revenue {
                  font-size: 12px !important;
                }
        
                .font7 {
                  font-size: 13px !important;
                }

          .textexp {
               font-size: 9px !important;
             }
      
             .exp {
               font-size: 23px !important;
             }
    }
  
    @media only screen and (min-width: 375px) and (max-width: 424px) {
      .mobilebanner1{
        width: 85% !important;
      }
      .mobilebanner2{
        width: 85% !important;
      }
      .grid{
        height: 200px !important;
      }

      .inputonbox{
          top: -47px !important;
          left: 3% !important;
          width: 66% !important;
          height: 33px !important;
      }
  
      .review-container {
        margin-left: 140px !important;
        margin-top: -33px !important;
      }
  
      .revenue-container {
        margin-top: -34px !important;
        margin-left: -34px !important;
    }
  
    .text5 {
      font-size: 14px !important;
  }
          .resp{
            /* margin-right: -175px !important; */
            margin-top: 0px !important;
            margin-left: 0px !important;
            width: 0px !important;
          }
          
          .resp1{
            margin-left: 0px !important;
            margin-top: 0px !important;
          }
      
          .respimg{
            width: 0px !important;
          } 
      
             .revenue{
        font-size:12px !important;
      }

            .font7 {
              font-size: 13px;
            }

                        .text5 {
                          color: #000 !important;
                          font-family: "Zen Dots" !important;
                          font-size: 26px !important;
                          font-style: normal !important;
                          font-weight: 400 !important;
                          line-height: normal !important;
                          align-self: stretch !important;
                        }
    }
  
    @media only screen and (min-width: 1530px) and (max-width: 1562px) {
      .custom-width{
    width: 569px !important;
    margin-top: -32px;
    height: 600px;
  }
      .custom-margin{
        width: 402px !important;
        margin-top: 405px !important;
        margin-left: 43px !important;
      }
  
      .resp{
        /* margin-right: -175px !important; */
        margin-top: 106px !important;
        margin-left: -103px !important;
        width: 807px !important;
      }
      
      .resp1{
        margin-left: 103px !important;
        margin-top: 52px !important;
      }
  
      .respimg{
        width: 254px !important;
      } 
  
      .grid{
        height: 524px !important;
      }
  
       .inset-0 {
        top: 12px !important;
        right: 0;
        bottom: 0;
        left: 0;
    }
  }
  
  @media only screen and (min-width: 1563px) and (max-width: 1920px) {
  
        .custom-width{
          width: 677px !important;
          margin-top: -90px;
          height: 600px;
        }
        .custom-margin{
          width: 750px !important;
          margin-top: 441px !important;
          margin-left: 104px !important;
        }
    
        .resp{
          /* margin-right: -175px !important; */
          width: 947px !important;
          margin-left: -73px !important;
          margin-top: 73px !important;
        }
        
        .resp1{
          margin-left: 155px !important;
          margin-top: 14px !important;
        }
    
        .respimg{
          width: 254px !important;
        } 
  
  }
  
  @media only screen and (min-width: 600px) and (max-width: 768px) {
      .custom-width {
        width: 400px !important;
      }
      .custom-margin {
        margin-left: -15px !important;
        margin-top: 477px !important;
      }
      .grid{
        width: 0px !important;
        height: 609px !important;
      }
      .revenue{
        margin-left: 0px !important;
      }
  
      .text5{
        font-size: 24px !important;
      }
      .resp{
        display:none !important;
      }
      .resp1{
        display:none !important;
      }
  
      .inset-0 {
        top: 54px !important;
        right: 0;
        bottom: 0;
        left: 0;
    }
  
    .review-container{
      margin-left: 353px !important;
      margin-top: -45px !important;
    }
    .revenue-container{
      margin-top: 25px !important;
    }  
  
    .revenue {
    font-size: 16.789px !important;
  
  }
  
  .professionals-container{
  margin-top: 48px;
  margin-left: -27px;
  }
   
  
  .semibold {
  
    font-size: 18px !important;
    }
    .w-6\/12 {
      width: 100%;
  }
  
  
    }
  
    h2{
      color: #000 !important;
      /* font-family: "Zen Dots"; */
      font-size: 53.174px !important;
      font-style: normal !important;
      font-weight: 400 !important;
      line-height: normal !important;
    }
  
    .revenue{
      color: #000;
      /* font-family: Gilroy-Medium; */
      font-size: 15.789px !important;
      font-style: normal;
      font-weight: 400;
      line-height: normal;
    }
  
    .semibold{
      color: #000;
    /* font-family: Gilroy-SemiBold; */
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    }
  
    .exp{
      color: var(--Primary-main-Violet, #8054E7) !important;
      text-align: center !important;
      font-family: Poppins !important;
      font-size: 29px !important;
      font-style: normal !important;
      font-weight: 600 !important;
      line-height: normal !important;
    }
  
    .textexp{
      color: #000;
      /* font-family: Gilroy-SemiBold; */
      font-size: 14px !important;
      font-style: normal;
      font-weight: 400;
      line-height: normal;
    }
  
    .text4{
      color: var(--Primary-main-Violet, #8054E7) !important;
      font-family: Syne !important;
      font-size: 35.207px !important;
      font-style: normal !important;
      font-weight: 500 !important;
      line-height: normal !important;
    }
  
    .text5{
      color: #000 !important;
      font-family: "Zen Dots" !important;
      font-size: 23px !important;
      font-style: normal !important;
      font-weight: 400 !important;
      line-height: normal !important;
      align-self: stretch !important;
    }
    .text6{
      color: #000;
      /* font-family: Gilroy-Medium; */
      font-size: 18px;
      font-style: normal;
      font-weight: 400;
      line-height: normal;
        }
  
      .text-xl {
        font-size: 18px;
      }
  
  
      .testimonial{
        color: #000;
        text-align: center;
        /* font-family: Gilroy-Medium; */
        font-size: 19px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
      }
  
        .row {
          display: flex;
          justify-content: space-between; 
          align-items: flex-start; 
        }
  
        .col-6 {
          width: 48%; 
        }
  
        .text4, .text5 {
          display: block; 
        }
  
  
  
        .flex {
    display: flex;
  }
  
  .justify-between {
    justify-content: space-between;
  }
  
  .gap-6 {
    gap: 1.5rem; /* Adjust spacing between cards */
  }
  
  .card {
    background: #fff;
    border-radius: 15px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    padding: 20px;
    text-align: left;
    width: 30%; /* Adjust card width */
    position: relative;
  }
  
  .card-title {
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .card-icon {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #f4f3fd;
    border-radius: 50%;
    padding: 10px;
  }
  
  .card-icon img {
    width: 20px;
    height: 20px;
  }
  
  .card-text {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #444;
  }
  
  /* Flex container for the boxes */
  .flex {
    display: flex;
    justify-content: space-between; 
    gap: 1.5rem; 
  }
  
  .border-box {
    border: 1px solid #ddd; 
    border-radius: 8px; 
    padding: 20px; 
    width: 105%;
    position: relative; 
    background-color: #fff; 
    /* height:200px !important; */
  }

  .border-boxnew {
    border: 1px solid #ddd; 
    border-radius: 8px; 
    padding: 20px; 
    width: 350px;
    position: relative; 
    background-color: #fff; 
    height: 210px !important;
    margin-right: 10px;
  }
  
  .box-header {
    display: flex;
    justify-content: space-between; 
    align-items: center;
    margin-bottom: 10px; 
  }
  
  .box-title {
    font-size: 1.25rem; 
    font-weight: bold; 
  }
  
  /* Icon styling */
  .box-icon {
    background: #f4f3fd;
    border-radius: 50%;
    padding: 10px; 
  }
  
  .box-icon img {
    width: 20px; 
    height: 20px;
  }
  
  .box-text {
    font-size: 0.875rem; 
    line-height: 1.5;
    color: #444; 
  }
  
  .zen{
    color: #000;
    font-family: "Zen Dots";
    font-size: 19px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  
  .font7{
    color: #000;
    /* font-family: Gilroy-Medium; */
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: justify;
  }
  
  .btnone{
    color: var(--white-black-gray-10, #FFF);
    text-align: center;
    font-family: "Zen Dots";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  
  .btnstyle{
    color: var(--white-black-gray-10, #FFF);
    text-align: center;
    font-family: "Zen Dots";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  
  .text8{
    color: var(--Primary-main-Violet, #8054E7) !important;
    font-family: Syne !important;
    font-size: 35.207px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: normal !important;
    text-transform: uppercase !important;
  }
  
  .text11{
      color: black;
      font-family: Syne;
      font-size: 35.207px;
      font-style: normal;
      font-weight: 500;
      line-height: normal;
  }
  
  .testimonial-slider {
    position: relative;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  
  .testimonial-wrapper {
    overflow: hidden;
    position: relative;
  }
  
  .testimonial-slide {
    width: 100%;
    transition: transform 0.3s ease-in-out;
    display: none; /* Hide slides by default */
  }
  
  .testimonial-slide.active {
    display: block; /* Show the active slide */
  }
  
  .chevrons {
    position: absolute;
    top: 90%;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    gap: 10px;
  }
  
  .chevron {
    cursor: pointer;
    justify-content: flex-end;
    width: 35px;
    height: 33px;
  }
  
  /* footer */
  /* .footer {
      color: #555;
      font-size: 0.95rem;
      background: var(--Primary-Bg-Light, #F3F3F3);
      display: flex;
  padding: 50px 80px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 74px;
  } */

     @media only screen and (min-width: 400px) and (max-width: 450px) {
       .responsive {
         height: 500px !important;
       }
  
       .textexp {
         font-size: 9px !important;
       }
  
       .exp {
         font-size: 23px !important;
       }
     }

 @media only screen and (min-width: 450px) and (max-width: 530px) {
     .responsive {
       height: 570px !important;
     }

             .textexp {
               font-size: 9px !important;
             }
      
             .exp {
               font-size: 23px !important;
             }
    }

    @media only screen and (min-width: 530px) and (max-width: 560px) {
      .responsive {
        height: 609px !important;
      }
    }

         @media only screen and (min-width: 561px) and (max-width: 600px) {
           .responsive {
             height: 658px !important;
           }
         }

@media (max-width: 320px) {
  .responsive {
      height: 387px !important;
    }

 .textexp {
   font-size: 9px !important;
 }

 .exp {
   font-size: 23px !important;
 }
}

@media only screen and (min-width: 321px) and (max-width: 399px) {
  .responsive {
    height: 471px !important;
  }

    .textexp {     
      font-size: 9px !important;
}

    .exp{
      font-size: 23px !important;
    }
  } 
  @media (max-width: 640px) {
  .sm\\:block {
    display: none;
  }
  
  .sm\\:hidden {
    display: block;
  }
  
  .grid {
    grid-template-columns: 1fr !important; 
  }
  
 
  
  .custom-margin{
    margin-top:-46px !important;
  }
  }
  
  #slider img {
    min-width: 40%;
  }
  @media only screen and (min-width: 768px) and (max-width: 1024px){
    #slider img {
    min-width: 80%;
  }
  }
  @media only screen and (min-width: 320px) and (max-width: 767px){
    .containerr {
      height: 487px !important;
    }
    #slider img {
      min-width: 50%;
    }
  }
  
  .swiper-container {
    overflow: hidden;
  }
  
  .swiper-wrapper {
    display: flex;
    flex-wrap: wrap; 
  }
  
  .swiper-slide {
    box-sizing: border-box;
    padding: 16px;
    width: 100%; 
    margin-bottom: 16px;
  }
  
  @media (min-width: 768px) {
    .swiper-wrapper {
      flex-wrap: nowrap; 
    }
  
    .swiper-slide {
      width: auto; 
    }
  }
  
  
   #slider img {
     min-width: 40%;
   }
  
   @media only screen and (min-width: 768px) and (max-width: 1024px) {
     #slider img {
       min-width: 80%;
     }
   }
  
   @media only screen and (min-width: 320px) and (max-width: 767px) {
     .containerr {
       height: 487px !important;
     }
  
     #slider img {
       min-width: 50%;
     }
            .revenue {
              font-size: 12px !important;
            }
      
            .font7 {
              font-size: 13px;
            }
   }
  
   @media only screen and (min-width: 1024px) and (max-width: 1096px) {
     .revenue {
       font-size: 18px !important;
     }
  
     .text5 {
       font-size: 35px !important;
     }

            .font7 {
              font-size: 10px !important;
      
            }
   }
  
   @media only screen and (min-width: 769px) and (max-width: 1023px) {
     .text5 {
       font-size: 30px !important;
     }
  
     .revenue {
       font-size: 18px !important;
     }

         .font7 {
           font-size: 11px !important;
        
         }
   }
  
   @media only screen and (min-width: 600px) and (max-width: 768px) {
     .text5 {
       font-size: 40px !important;
     }
  
     .vector-image {
       height: 100px !important;
     }
   }
  
   @media only screen and (min-width: 600px) and (max-width: 680px) {
     .revenue {
       font-size: 20px;
     }
  
     .text5 {
       font-size: 35px !important;
     }
   }
  
   @media only screen and (min-width: 601px) and (max-width: 620px) {
     .revenue {
       font-size: 18px !important;
     }
  
     .text5 {
       font-size: 32px !important;
     }
   }
  
   @media only screen and (min-width: 769px) and (max-width: 937px){
      .revenue {
        font-size:28px;
      }
      .text5{
        font-size:32px !important;
      }
    }
  
     @media only screen and (min-width: 425px) and (max-width: 769px) {
        .text5{
          font-size: 25px !important;
        }
        .revenue{
        font-size:12px !important;
      }

            .font7 {
              font-size: 13px;
            }
    }
  
   .vector-image {
     max-width: 100%;
     /* height:auto; */
   }
  
   @media (max-width: 768px) {
     .md\:col-2 {
       width: calc(33.33% - 20px);
       margin: 10px;
       flex-basis: 20.33% !important;
     }
   }
  
   #accordion-flush {
     border: 1px solid #ddd;
     border-radius: 8px;
     padding: 20px;
     max-width: 800px;
     margin: 0 auto; 
   }
  
   .w-6\/12 {
     width: 100% !important;
   }
  
   .overalldiv{
    padding-left: 64px;
    padding-right: 64px;
   }
  
  
   @media (max-width: 345px) {
    .overalldiv{
      padding-left: 20px;
      padding-right: 0px;
     }
   }

   
    .image-container {
      position: relative;
      /* Make the image container a positioning context */
    }
  
    .image-container img {
      width: 100%;
      /* Make the image fill the container */
      height: auto;
      /* Maintain aspect ratio */
    }
  
    .input-container {
      position: absolute;
      /* Position the input container over the image */
      bottom: 20px;
      /* Adjust the bottom position as needed */
      left: 20px;
      /* Adjust the left position as needed */
      background-color: rgba(255, 255, 255, 0.8);
      /* Semi-transparent background */
      padding: 10px;
      border-radius: 5px;
    }
  
    .input-container input {
      width: 100%;
      padding: 5px;
      border: none;
      border-bottom: 1px solid #ccc;
    }
  
    .input-container button {
      background-color: #007bff;
      color: #fff;
      border: none;
      padding: 5px 10px;
      border-radius: 5px;
      cursor: pointer;
    }