 
@media only screen and (min-width: 1242px)
{

  .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: 200px;
      display: block;
  }
   
  @keyframes svg-animation {
      0% {
        height: 500px;
        }
        100% {
        height: 50px;
        }
  }
    
    
    .desktop-version.fixed .background-cover{
    height: 300px;
    }
    
    
      .desktopSVG {
        position: absolute;
        left: 0;
        top: 760px;
        right: 0;
        margin: auto;
        z-index: -1;
      }

      .desktopSVG1 {
        position: absolute;
        left: 0;
        top: 4746px;
        right: 0;
        margin: auto;
        z-index: -1;
      }
     

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


    /* main content css */

  .wrapper{
    height: 5370px;
  }
    .main-content {
        width: 1242px;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
    }

    .video-box{
        position: absolute;
        top: 80px;
        width: 1242px;
        min-height: 680px;
        left: 0px;
    }

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

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

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

    }
    .metaverse-heading{
      position: absolute;
      top: 907px;
      left: 0px;
      min-height: 160.14px;
      text-align: center;
      width: 100%;
    }

    .metaverse-heading h2{
      width: 55%;
    }
      
 
       .custom-bi-quote::before {
         font-size: 25px;
         color: #a120d1;
     }
       
    

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

     .meta-box1{
      position: absolute;
      top: 1070px;
      left: 80px;
      width: 380px;
    }


.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-box2{
  position: absolute;
  top: 1153px;
  left: 780px;
  width: 380px;
  min-height: 179px;
}
      

    .meta-box3{
      position: absolute;
      top: 1476px;
      left: 330px;
      width: 587px;
      min-height: 188px;
    }

    .our-mission{
      position: absolute;
      top: 1808px;
      left: 0px;
      width: 100%;
      text-align: center;
      font-size: 15px;
      line-height: 20.25px;
      min-height: 180px;
      flex-direction: column;    
    }
  .our-mission .h1{
    width: 50%;
    }
      .group-img{
        position: absolute;
        top: 1990px;
        left: 0px;
        width: 100%;
        justify-content: space-evenly;
        max-height: 327px;
        height: 327px;
      }

      .make-your-life{
        position: absolute;
        top: 2539px;
        left: 0px;
        width: 100%;
        text-align: center;
        min-height: 225px;
      }
    .make-your-life .h1{
      max-width: 50%;
      }

    .toast1 .custom-toast{
        position: absolute;
        top: 2881px;
        left: 127px;
        width: 253.67px;
        min-height: 126.88px;
        z-index: 99;
        background: #fff;
        max-width: 253.67px;
    }

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

    .trizetto-img {
        position: relative;
        left: 16px;
        top: 13px;
        max-height: 67px;
        max-width: 190px;
    }
.simplify-img{
    position: absolute;
    top: 2769px;
    left: 288px;
    z-index: -1;
    max-height: 299px;
    max-width: 558px;
}
.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: 337px;
  min-height: 56px;
  border-radius: 12px;
  position: absolute;
  top: 2769px;
  left: 569px;
  font-size: 15px;
  line-height: 20.25px;
  display: flex;
  align-items: center;
  padding: 10px;
  gap: 10px;
}

.simplify-block-img{
    border: 1px solid green;
    border-radius: 50%;
}

.simplify-line{
    position: absolute;
    top: 2788px;
    left: 893px;
}

.simplify-line-img{
  display: none;
}
.toast2 .custom-toast{
    position: absolute;
    top: 2879px;
    left: 727px;
    width: 316px;
    min-height: 200.93px;
    z-index: 99;
    max-width: 316px;
}

.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: 313px;
        position: absolute;
        top: 3200px;
        min-width: 1242px;
    }
  
    .connect-business .h1{
        position: relative;
        text-align: center;
        color: #fff;
        top: 0px;
    }

    .connect-business .get-started{
        position: relative;
        width: 170px;
        min-height: 40px;
        border-radius: 10px;
        top: 0px;
    }

    .think-of-us-img{
        position: absolute;
        top: 3563px;
        left: 584px;
        max-width: 571px;
        max-height: 699px;
        height: 699px;
    }

    .thinkbox{
      position: absolute;
      top: 3759px;
      left: 86px;
      width: 652px;
      min-height:327px;
      font-size: 15px;
      line-height: 20px;
      font-family: "Gellix Chello Regular";
    }

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

    .thinkbox .custom-bi-quote
    {
      position:relative;
      bottom:10px;
    }

    .OFG-heading{
      position: absolute;
      top: 4568px;
      left: 196px;
      width: 83%;
      min-height: 154px;
}

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

     .find-out-more{
     position: absolute;
     top: 4723px;
     left: 196px;
     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: 4674px;
        left: 760px;
        width: 284.22px;
        min-height: 133.5px;
        z-index: 99;
        background: #fff;
        max-width: 100%;
    }
  
    .toast3 .custom-toast-header {
        padding: 4px 0.75rem;
        background-color: #A120D1 !important;
    }

    .ofg-bank-img{
        position: relative;
        top: 28.5px;
        left: 13px;
        max-width: 232px;
        max-height: 38px;
    }

    
      .media-query {
        background-color: #A120D1;
        min-height: 313px;
        position: absolute;
        top: 5077px;
        min-width:1242px;
    }

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

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

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

    .tabletSVG{
      display: none;
    }
}

@media only screen and (min-width: 1242px)
{
  .connect-business, .media-query {
      width: 100%;
  }
}

@media only screen and (min-width: 769px)
{
  .connect-business, .media-query {
      width: 100%;
  }
}
@media only screen and (max-width: 768px)
{
  .connect-business, .media-query {
      width: 100%;
  }
}



