@media only screen and (min-width: 768px) and (max-width:1241px)
{

  .desktop-version .background-cover{
      animation: svg-animation 2s 0.8s backwards;
      width: 100%;
      position: fixed;
      bottom: 0px;
      right: 15px;
      z-index: -1;
      background-color:white;
      height: 281px;
      display: block;
  }
   
  @keyframes svg-animation {
      0% {
        height: 500px;
        }
        100% {
        height: 50px;
        }
  }
    
    
    .desktop-version.fixed .background-cover{
    height: 300px;
    }
    
    
 
    .tabletSVG{
      position: absolute;
      left: 0;
      top: 740px;
      right: 0;
      margin: auto;
      z-index: -1;
    }
     


    h4{
        font-size: 16px;
    line-height: 18px;
    }


    /* main content css */
  
  .wrapper{
    height: 4560px;
  }

    .main-content {
        width: 760px;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
    }

    img.nurses, img.driver, img.builder, img.man-with-flask {
      max-height: 214px;
  }

    .video-box{
        position: absolute;
        top: 60px;
        width: 720px;
        min-height: 680px;
        left: 20px;
    }

    .video-box-content{
        position: relative;
        align-items: center;
        top: 30px;
    }

    .line{
      position: absolute;
      top: 740px;
      height: 1px;
      min-width: 760px;
      background: #A120D1;
      width: 100%;

    }
    .metaverse-heading{
      position: absolute;
      top: 887px;
      left: 0px;
      width: 100%;
      min-height: 140px;
      text-align: center;
      font-size: 22px;
    line-height: 24px;
    }

    .metaverse-heading h2{
      width: 75%;
    }


    .tooltip-box {
      box-sizing: border-box;
      background: #fff;
      box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.1);
      min-height: 170px;
      border-radius: 35px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      line-height: 24px;
      font-family: "Gellix Chello SemiBold", sans-serif;
      padding: 20px;
    }
    
    
    .tooltip-box::after{
      content: "";
        position: absolute;
        width: 0;
        height: 0;
        right: 60px;
        top: 100%;
        margin-top: -2px;
        box-sizing: border-box;
        border: 1em solid black;
        border-color: transparent transparent #fff #fff;
        transform-origin: 0 0;
        transform: rotate(-45deg);
        box-shadow: -4px 5px 3px 0px rgb(0 0 0 / 10%);
      }

.meta-box1{
  position: absolute;
  top: 1028px;
  left: 20px;
  width: 290px;
  max-width: 100%;
}
   
      
 
       .custom-bi-quote::before {
         font-size: 25px;
         color: #a120d1;
     }
       
     .tooltip-box-icon {
      position: absolute;
      right: 52px;
      top: calc(100% + 36px);
     }
.meta-box2{
  position: absolute;
  top: 1117px;
  left: 466px;
  width: 274px;
  max-width: 100%;
  min-height: 160px;
}

      
    .meta-box3{
      position: absolute;
      top: 1427px;
      left: 20px;
      width: 523px;
      max-width: 100%;
      min-height: 155px;
    }
    
    
      .our-mission{
        position: absolute;
        top: 1749px;
        left: 0px;
        width: 760px;
        text-align: center;
        min-height: 132px;
        flex-direction: column;
      }

      .our-mission .h1{
        width: 75%;
      }
      .group-img{
        position: absolute;
        top: 1886px;
        left: 0px;
        width: 100%;
        justify-content: space-evenly;
        height: 214px;
        max-height: 214px;
      }
      .make-your-life{
        position: absolute;
        top: 2341px;
        left: 0px;
        width: 100%;
        text-align: center;
        min-height: 145px;
      }

      .make-your-life .h1{
        max-width: 75%;
      }


    .toast1 .custom-toast{
        position: absolute;
        top: 2593px;
        left: 20px;
        width: 210px;
        min-height: 105px;
        z-index: 99;
        background: #fff;
    }

    .toast1 .custom-toast-header {
        padding: 4px 0.75rem;
        background-color: #A120D1 !important;
    }

    .trizetto-img {
        position: relative;
        left: 0px;
        top: 10px;
        max-height: 55px;
        max-width: 157px;
    }
.simplify-img{
  position: absolute;
  top: 2489px;
  left: 133px;
  z-index: -1;
  max-height: 247px;
  max-width: 461.6px;
}

.simplify-block{
  background-color: #fff;
  box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
  margin: 0px 0px 0px 0px;
  border: 1px solid white;
  z-index: 1;
  width: 229px;
  min-height: 65px;
  border-radius: 12px;
  position: absolute;
  top: 2490px;
  left: 405px;
  font-size: 14px;
  line-height: 20.25px;
  padding: 0px 10px;
  text-indent: 0px;
  display: flex;
}


.simplify-block-img{
  position: relative;
  top: -9px;
  border: 2px solid green;
  border-radius: 50%;
  left: -6px;
}

.simplify-line{
    position: absolute;
    top: 2516px;
    left: 634px;
}

.simplify-line-img{
  display: none;
}

.toast2 .custom-toast{
  position: absolute;
  top: 2591px;
  left: 476px;
  width: 262px;
  min-height: 162.93px;
  z-index: 99;
max-width: 261px;
}

.toast2 .custom-toast-header {
    padding: 6px 0.75rem;
    background-color: #A120D1 !important;
}

.toast2 .custom-toast-body{
    padding: 15px 8.26px 8px 21.85px;
    min-height: auto;
    background: #fff;
    border-radius: 10px;
}

.revenue{
    font-size: 15px;
    line-height: 20px;
    color: #000000;
}

.custom-toast-text{
  font-family: "Gellix Chello", sans-serif;
  font-size: 15px;
  line-height: 20px;
  color: #000000;
  margin: 0px;
}

.toast-ul{
  padding-left: 16px;
  margin-bottom: 0px;
  }

  ::marker{
    color: #a120d1;
  }
    .connect-business{
        background-color: #A120D1;
        min-height: 225px;
        position: absolute;
        top: 2797px;
        min-width: 760px;
    }
  
    .connect-business .h1{
        position: relative;
        text-align: center;
        color: #fff;
        top: 0px;
    }

    .connect-business .get-started{
        position: relative;
        background-color: white;
        color: #a120d1;
        width: 170px;
        min-height: 40px;
        border: none;
        border-radius: 10px;
        top: 0px;
    }

    .think-of-us-img{
        position: absolute;
        top: 3062px;
        left: 334px;
        max-width: 406px;
        max-height: 497px;
    }

    .thinkbox{
      position: absolute;
      top: 3203px;
      left: 20px;
      width: 473px;
      min-height: 263px;
      font-size: 14px;
      line-height:18.9px;
      font-family: "Gellix Chello Regular";
    }

    .thinkbox.tooltip-box::after{
        position: absolute;
        left: 30px;
      }

    .thinkbox .tooltip-box-icon {
      position: absolute;
      left: 33px;
      top: calc(100% + 36px);
     }
    


      .OFG-heading{
        position: absolute;
        top: 3870px;
        left: 20px;
        width: 83%;
        min-height: 107px;
      }

      .OFG-heading .h1{
        max-width: 56%;
      }


     .find-out-more{
     position: absolute;
     top: 3980px;
     left: 20px;
     font-family: "Gellix Chello Bold", sans-serif;
     font-size: 14px;
     line-height: 16px;
     outline: none;
     border: none;
     padding: 12px 28px;
     width: 165px;
     border-radius: 6px;
     background-color: #a120d1;
     min-height: 46px;
    }

     .toast3 .custom-toast {
        position: absolute;
        top: 3940px;
        left: 456px;
        width: 284.22px;
        min-height: 133.5px;
        z-index: 99;
        background: #fff;
        max-width: 284.22px;
    }
  
    .toast3 .custom-toast-header {
        padding: 4px 0.75rem;
        background-color: #A120D1 !important;
    }

    .ofg-bank-img{
        position: relative;
        top: 28.5px;
        left: 13px;
    }

    
      .media-query {
        background-color: #A120D1;
        min-height: 225px;
        position: absolute;
        top: 4334px;
        min-width:760px;
    }

    .media-query .h1{
      position: relative;
      text-align: center;
      color: #fff;
      padding: 0px 176px;
    }

    .media-query .get-in-touch{
      position: relative;
      background-color: white;
      color: #a120d1;
      width: 170px;
      min-height: 40px;
      border: none;
      border-radius: 10px;
      top: 0px;
    }

    .footer-container {
      width: 760px;
      margin: auto;
  }
    .mobileSVG {
        display: none;
    }
.mobileSVG1{
  display: none;
}

.desktopSVG {
  display: none;
  } 
.desktopSVG1{
  display:none;
}
    
}