body,
main {
    overflow-x: hidden
}

main {
    position: relative;
    padding-top: 120px;
    width: 100vw
}

.floating-mobile,
.img-mobile,
.testimonial-panel,
main .products .gridlines li:last-child::after,
main .products .gridlines li:last-child::before,
main .products .gridlines li:nth-child(2)::after,
main .products .slider-wrap .products-carousel .owl-dots,
main .services .services-carousel-grid .owl-dots {
    display: none
}

main .hero .left-part .content-wrap .digi-button-1:hover:after,
main .products .slider-wrap .products-carousel .item .item-wrap .digi-button-3:hover:after {
    transform: scaleX(1);
    transform-origin: center left
}

.catelogue,
.panel .item,
.scrollspy-tab-container .right-content,
.subpage.cases-page .bg-wrap,
.subpage.cases-page .cases-banner,
.subpage.client-page .bg-wrap,
.subpage.client-page .client-banner,
.subpage.contact-page .contact-banner,
.subpage.product-details-page .product-details-banner .banner-box-wrap,
.subpage.services-page .service-banner .banner-row,
.subpage.services-page .service-banner-3 .box-wrapper .slider-div,
main .banner-section .gridlines li {
    position: relative
}

.heading-type-2 h2 span,
.ourWorksNo h2,
.subpage.cases-page .cases-banner .subtitle a,
.subpage.cases-page .customers h2.heading span,
.subpage.client-page .client-banner .subtitle a,
.subpage.client-page .customers h2.heading span,
.subpage.contact-page .contact-banner .subtitle a,
main .banner-section .gridlines li .let-work-btn:hover,
main .csc .para-1 .brand,
main .csc h2.heading span,
main .customers h2.heading span,
main .expertise h2.heading span,
main .services h2.heading span,
main .specialized .grids-wrap .gridx .bx-8 .bxwrap .view-btn:hover,
main .specialized .grids-wrap .gridx .bx-9 .bxwrap .view-btn:hover {
    color: #5a4ac0
}

.project-section-head h2 span.cl2 .sphere img,
.subpage.about-page .about-banner .second-sec .box.box-2 .count-box .triangle-1 img,
.subpage.about-page .about-banner .second-sec .box.box-3 .sphere-box .sphere,
.subpage.cases-page .bg-wrap .shape-wrap img,
.subpage.cases-page .cases-banner .sphere-box img,
.subpage.cases-page .count-sec .count-wrap .shape-1 img,
.subpage.cases-page .count-sec .count-wrap .shape-4 img,
.subpage.cases-page .count-sec .count-wrap .shape-5 img,
.subpage.cases-page .customers h2.heading .cube-box img,
.subpage.cases-page .shape-box img,
.subpage.client-page .bg-wrap .shape-wrap img,
.subpage.client-page .client-banner .sphere-box img,
.subpage.client-page .count-sec .count-wrap .shape-1 img,
.subpage.client-page .count-sec .count-wrap .shape-4 img,
.subpage.client-page .count-sec .count-wrap .shape-5 img,
.subpage.client-page .customers h2.heading .cube-box img,
.subpage.client-page .shape-box img,
.subpage.contact-page .contact-banner .sphere-box img,
.subpage.product-details-page .product-details-banner .banner-box-wrap .shape-box-a1 img,
.subpage.services-page .count-sec .count-wrap .shape-1 img,
.subpage.services-page .count-sec .count-wrap .shape-4 img,
.subpage.services-page .count-sec .count-wrap .shape-5 img,
.subpage.services-page .service-banner .box-wrapper .shape-box-a1 img,
.subpage.services-page .service-banner .box-wrapper .shape-box-a3 img,
.subpage.services-page .service-banner .box-wrapper .text-div .leaf-box-3 img,
.subpage.services-page .service-banner .box-wrapper .text-div .shape-box-1 img,
.subpage.services-page .service-banner-2 .box-wrapper .leaf-box-3 img,
.subpage.services-page .service-banner-2 .box-wrapper .shape-box-a1 img,
.subpage.services-page .service-banner-2 .box-wrapper .shape-box-a3 img,
.subpage.services-page .service-banner-2 .box-wrapper .text-div .shape-box-1 img,
main .banner-section .content-wrap .content--layout-3 .bgx-3 .brain-box img,
main .csc .count-wrap .shape-1 img,
main .csc .count-wrap .shape-4 img,
main .csc .count-wrap .shape-5 img,
main .we-are h2 span.cl2 .sphere img,
main .we-are-2 .shape img,
main .we-are-2 .shape-5 img {
    width: 100%;
    animation: 5s linear infinite float
}

.project-section-head h2 span.cl1 .webotix-round img,
.projects-section .webotix-round img,
.we-are-section .webotix-round img,
main .expertise .webotix-round img,
main .we-are h2 span.cl1 .webotix-round img,
main .we-are-2 .webotix-round img {
    animation: 15s linear infinite spin;
    width: 100%
}

.award-overlay,
.sticky-sentinel,
.stripe-overlay,
main .banner-section .content-wrap {
    pointer-events: none
}

.award-image:hover .award-overlay,
.menu-item.active span,
.project-card:hover .project-overlay,
main .banner-section .content__related-item:focus .content__related-img,
main .banner-section .content__related-item:hover .content__related-img {
    opacity: 1
}

.para,
main .csc .para-1 {
    font-weight: 300;
    font-size: 1.25rem
}

main .csc .para-1 b,
main .we-are .para b {
    font-weight: 500
}

.subpage.cases-page .customers .arrow-down img,
.subpage.client-page .customers .arrow-down img,
main .csc .arrow-down img,
main .customers .arrow-down img,
main .expertise .arrow-down img,
main .services .arrow-down img {
    height: 100%;
    max-height: 60px
}

main .we-are {
    position: relative;
    background: #fff
}

.panels2-container,
main .services,
main .we-are {
    padding: 0
}

.brand,
.text-purple2,
main .we-are .para .brand {
    color: #5a4ac0 !important
}

main .we-are-2 h2 {
    display: block;
    margin: auto auto 1rem;
    font-weight: 600;
    position: relative;
    text-align: center;
    font-size: 42px;
    z-index: 8
}

main .we-are-2 p {
    line-height: inherit;
    text-align: left;
    font-size: 1.3rem;
    font-weight: 400;
    line-height: inherit
}

.colored-text,
main .we-are-2 h2 span {
    color: #5b4ac0
}

main .we-are-2 .webotix-round {
    width: 80px;
    display: flex;
    justify-content: center;
    position: relative;
    left: 0;
    top: 0
}

main .we-are-2 .shape-5 {
    position: absolute;
    max-width: 100px;
    left: -115px;
    bottom: 0
}

main .we-are-2 .webotix-round img {
    margin-bottom: 20px
}

main .products {
    padding: 0;
    position: relative;
    background: #fff
}

main .products .slider-wrap .products-carousel .item .item-wrap .digi-button-3:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: scaleX(0);
    z-index: 0;
    transition: transform .8s cubic-bezier(.075, .82, .165, 1);
    transform-origin: center right;
    background-color: #fff
}

.heading-type-2 h2,
main .customers h2.heading,
main .expertise h2.heading,
main .services h2.heading {
    text-align: center;
    font-weight: 600;
    font-size: 2rem
}

main .lets-make .bg-wrap .left-box .action-btn:before,
main .services .services-carousel-grid .item .item-wrap .digi-button-3:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: scaleX(0);
    z-index: 0;
    transition: transform .8s cubic-bezier(.075, .82, .165, 1);
    transform-origin: center right;
    background-color: #5a4ac0
}

main .services .services-carousel-grid .item .item-wrap .digi-button-3:hover:after {
    transform: scaleX(1.1);
    transform-origin: center left
}

main .lets-make {
    padding-top: 0;
    background: #fff;
    position: relative;
    z-index: 10;
    clear: both
}

main .lets-make .bg-wrap {
    background: url("../images//bg-2.webp") 0 0/cover;
    display: flex;
    padding: 120px 100px;
    color: #fff;
    align-items: center;
    justify-content: space-between;
    position: relative
}

main .lets-make .bg-wrap .left-box .action-btn:hover:before {
    transform: scaleX(1.2);
    transform-origin: center left
}

.card-project .content,
.mwg_effect031,
.relProjects_section .owl-carousel .isotope-item .img_iso img,
.scrollspy-tab-container .tabs-container,
.subpage.about-page .about-banner .second-sec .box img,
.subpage.about-page .customers .customer-carousel .profile .img-wrap img,
.subpage.case-details-page .case-details-section .img-wrap img,
.subpage.case-details-page .lets-make .bg-wrap .cube-wrap .cube,
.subpage.product-details-page .products-wrap .item-box .item-wrap .arrow-round img,
.subpage.product-details-page .values-live .img-wrap img,
.subpage.products-page .products-wrap .item-box .item-wrap .arrow-round img,
.subpage.services-page .products-wrap .item-box .item-wrap .arrow-round img,
.subpage.services-page .service-banner-3 .box-wrapper .slider-div .slider-img-div .layer,
.subpage.services-page .values-live .content-box-wrap .content-text .img-box-3 img,
.testimonial img,
.work-listing .container_gallery_iso .iso-container .isotope-item .img_iso img {
    width: 100%
}

@media screen and (max-width:1199px) {
  main .we-are {
          display: flex;
          flex-direction: column;
          align-items: center;
          font-size: 65px;
          text-align: center
      }
}

@media screen and (max-width:991px) {
  main,
      main .banner-section {
          opacity: 1
      }
}

@media screen and (max-width:767px) {
  .rellax,
      .rellax-h {
          transform: translate3d(0, 0, 0) !important
      }
}

@media screen and (max-width:767px) {
  main .lets-make .bg-wrap {
          flex-wrap: wrap;
          padding: 70px 20px
      }
}

@media (max-width:426px) {
  .floatingbtn,
      main .we-are h2 span.cl2.api-title2 {
          display: none !important
      }
}

@media (max-width:426px) {
  .bg-text {
          top: -74px !important
      }
}

.accordion-icon {
    display: inline-block;
    transition: transform .3s
}

.section-subtitle.projectlist,
.section-title.projectlist,
.stat-block,
.subpage .concers .heading,
.subpage.product-details-page .concers .heading,
.team-card {
    text-align: center
}

.footer-design p,
.relProjects_section .owl-carousel .isotope-item .img_iso .overlay .bottom .industry,
.work-listing .container_gallery_iso .iso-container .isotope-item .img_iso .overlay .bottom .industry {
    font-size: 1rem
}

@media screen and (max-width:991px) {
  main .lets-make .bg-wrap {
          padding: 70px 50px
      }
}

@media screen and (max-width:767px) {
  main .lets-make {
          padding-top: 50px
      }
}

@media screen and (max-width:767px) {
  main .lets-make .bg-wrap {
          padding: 40px 20px
      }
}

@media screen and (max-width:767px) {
  .right-part .accordion-header {
          font-size: 20px !important
      }
}

@media screen and (max-width:767px) {
  .services-box-wrap {
          margin-bottom: 80px !important
      }
}

@media screen and (min-width:1300px) {
  * {
          scrollbar-width: auto;
          scrollbar-color: #5a4ac0 #fff
      }
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.floatingbtn {
    position: fixed;
    right: 6%;
    top: 20%;
    z-index: 10;
    transform: rotate(270deg);
    transform-origin: right center;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem
}

.floatingbtn ul {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: row;
    background: rgb(89 74 192 / 79%);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
    border-radius: 1rem;
    border: 1px solid rgba(255, 255, 255, .3);
    box-shadow: 2px 3px 10px 4px rgba(0, 0, 0, .1), inset 1px 1px 0 rgb(255 255 255 / 50%), inset 0 -1px 0 rgb(0 0 0 / 10%), inset 0 0 10px 5px rgb(0 0 0 / 2%);
    position: relative;
    overflow: hidden
}

.floatingbtn li:hover {
    background-color: #000;
    background: linear-gradient(-45deg, #242424, #594ac0, #388dae, #492794);
    background-size: 400% 400%;
    animation: 15s infinite gradient
}

.floatingbtn li {
    list-style: none;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .3)
}

.floatingbtn a {
    display: block;
    padding: 1.3rem 1rem;
    text-decoration: none;
    color: #fff;
    font-size: 1.2rem;
    height: 100%;
    width: 100%
}

@media screen and (min-width:768px) {
  .floatingbtn {
          right: 1%;
          top: -2%
      }
}

@media screen and (min-width:1024px) {
  .floatingbtn {
          top: -60%
      }
}

.dropdown-menu,
.has-submenu>ul {
    display: none;
    overflow-y: auto;
    list-style: none
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    right: -114px;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .1);
    padding: 0;
    margin: 0;
    min-width: 160px;
    z-index: 1000;
    max-height: 500px;
    scrollbar-width: thin
}

.card-container,
.card-project,
.catelogue-item,
.full-card,
.image-cell,
.right-section,
.splide__track,
.ts-slider-card {
    overflow: hidden
}

.dropdown-menu li a {
    padding: 10px 15px;
    white-space: nowrap;
    color: #333
}

.custom-h2 .cl1,
.custom-h2 .cl2,
.custom-h2 .cl3,
.dropdown:hover .dropdown-menu,
.has-submenu:hover>ul {
    display: block
}

.accordion-body ul.list-box {
    list-style: none;
    padding-left: 0;
    margin: 0
}

.accordion-body ul.list-box>li {
    position: relative;
    margin: 10px 0
}

.accordion-body ul.list-box a {
    text-decoration: none;
    transition: color .3s;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700
}

.accordion-body ul.list-box a:hover {
    color: #007bff;
    transition: color .3s ease-in-out;
    text-decoration: underline
}

.menu-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    text-decoration: none
}

.menu-link img {
    vertical-align: middle
}

@keyframes gradient {

    0%,
    100% {
        background-position: 0 50%
    }

    50% {
        background-position: 100% 50%
    }
}

@media (max-width:768px) {
  .shape-2 {
          display: none !important
      }
}

@media (max-width:768px) {
  .bg-text {
          position: absolute !important;
          left: 50%;
          transform: translateX(-50%) !important;
          width: 100%;
          text-align: center;
          z-index: 2
      }
}

@media (max-width:768px) {
  .floatingbtn a {
          font-size: .9rem;
          padding: .6rem .8rem
      }
}

@media (max-width:768px) {
  .floatingbtn ul {
          border-radius: .7rem
      }
}

@media (min-width:521px) and (max-width:768px) {
  .dropdown-menu {
          right: -54px !important
      }
}

.button-call,
.expertise-content,
.expertise-slide,
.service-card,
.side-bar-panel,
.social a,
.ts-slider-card .title p {
    align-content: center
}

@media (max-width:950px) {
  .floating-mobile {
          display: flex;
          position: fixed;
          width: auto;
          z-index: 99;
          left: 0;
          right: 0;
          flex-direction: row;
          justify-content: center;
          bottom: 28px
      }
}

@media (max-width:950px) {
  .floating-mobile ul {
          display: flex;
          flex-direction: row;
          width: 52%;
          margin: 0 auto;
          border-radius: 16px;
          padding: 0;
          justify-content: center;
          background: rgb(78 53 233 / 23%);
          box-shadow: 0 4px 30px rgba(0, 0, 0, .1);
          backdrop-filter: blur(1.4px);
          -webkit-backdrop-filter: blur(6.4px);
          border: 1px solid rgba(255, 255, 255, .32)
      }
}

@media (max-width:950px) {
  .floating-mobile li {
          list-style: none;
          padding: 13px 43px;
          width: 100%;
          text-align: center
      }
}

@media (max-width:950px) {
  .floating-mobile a {
          color: #000
      }
}

@media (max-width:950px) {
  .floating-mobile svg {
          color: #000;
          fill: white;
          width: 20px;
          height: 20px
      }
}

@media (max-width:950px) {
  main .we-are-2 h2 {
          display: block;
          margin: auto;
          font-weight: 600;
          position: relative;
          text-align: center;
          font-size: 2rem;
          z-index: 8;
          text-transform: capitalize
      }
}

@media (max-width:950px) {
  .catelogue-shadow:before {
          display: none
      }
}

@media (max-width:950px) {
  .we-are-2 p {
          font-size: 1rem !important
      }
}

@media (max-width:400px) {
  main .we-are-2 h2 {
          display: block;
          margin: auto;
          font-weight: 600;
          position: relative;
          text-align: center;
          font-size: 2rem;
          z-index: 8;
          text-transform: capitalize
      }
}

@media (max-width:400px) {
  .catelogue-shadow:before {
          display: none
      }
}

@media (max-width:400px) {
  .we-are-2 p {
          font-size: 1rem !important
      }
}

.leayer-bg-position .scroller:before {
    content: "";
    bottom: 0;
    width: 100%;
    height: 200px;
    position: absolute;
    display: block;
    z-index: 1;
    background: #fff;
    background: -webkit-linear-gradient(180deg, rgba(255, 255, 255, 0) 0, #fff 44%);
    background: -moz-linear-gradient(180deg, rgba(255, 255, 255, 0) 0, #fff 44%);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, #fff 100%)
}

.awards-section .shape-2,
.relatedProjects_section .shape-2 img,
.relatedProjects_section .shape-5 img,
.relatedProjects_section .sphere img,
.team-culture-section .shape-2 img,
.team-culture-section .shape-5 img,
.team-culture-section .sphere img,
.we-are-2 .shape-2 img,
.we-are-2 .shape-5 img,
.we-are-2 .sphere img {
    animation: 5s linear infinite float
}

@keyframes scroll {
    to {
        transform: translate(calc(-50% - .5rem))
    }
}

html {
    scroll-behavior: smooth
}

.vr-card:before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: .6rem;
    height: .6rem;
    display: block;
    background-color: #5a4abf;
    border-radius: 10px
}

@media (max-width:1200px) {
  main .we-are-2 .shape-5 {
          left: 20px;
          top: 25px
      }
}

@media (max-width:1200px) {
  main .we-are-2 h2 {
          font-size: 2.75em
      }
}

@keyframes scroll-indicator-pulse {

        0%,
        100% {
            opacity: .6;
            transform: translateY(-50%) translateX(0)
        }

        50% {
            opacity: 1;
            transform: translateY(-50%) translateX(4px)
        }
    }

@keyframes servicesslide {
    0% {
        transform: translateX(calc(0 + 50px))
    }

    100% {
        transform: translateX(-100%)
    }
}

@keyframes servicesslidealt {
    0% {
        transform: translateX(calc(0 + 50px))
    }

    100% {
        transform: translateX(-100%)
    }
}

.headingtype2 h2 {
    display: block;
    margin: auto;
    font-weight: 600;
    position: relative;
    text-align: center;
    font-size: 4rem;
    z-index: 8
}

.card-container,
.expertise-slide,
.full-card,
.heading-type-2,
.left-section,
.product-catelogue-type-3,
.right-section,
.stats-3col {
    position: relative
}

.heading-type-2 {
    display: block;
    width: 100%;
    text-align: center;
    padding: 20px 0
}

@keyframes scroll-left {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(-50%)
    }
}

.left-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-self: flex-start
}

.left-content p {
    margin-bottom: 12px
}

@media (max-width:991px) {
  .left-content {
          padding: 25px
      }
}

@media (max-width:768px) {
  main .we-are-2 h2 {
          font-size: 1.75em;
          margin-bottom: 15px
      }
}

@media (max-width:768px) {
  .left-content {
          padding: 18px
      }
}

@keyframes autoScroll {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(-50%)
    }
}

.team-culture-section .shape-5,
.we-are-2 .shape-5 {
    width: auto;
    height: 55px;
    display: flex;
    justify-content: center;
    position: relative;
    left: 41%;
    z-index: 10
}

.section-title {
    font-size: 32px;
    font-weight: 700;
    color: #111
}

.section-subtitle {
    font-size: 16px;
    color: #666;
    margin-top: 5px
}

.lets-make .bg-wrap {
    background: url(../images//bg-2.webp) 0 0/cover;
    display: flex;
    padding: 120px 100px;
    color: #fff;
    align-items: flex-start;
    justify-content: space-between;
    position: relative
}

@media (max-width:992px) {
  .lets-make .bg-wrap {
          flex-direction: column;
          padding: 60px 40px !important;
          gap: 40px
      }
}

.button-call h6,
.button-call p,
.founder-highlight p {
    margin: 0
}

.footer-design .text-dark p:hover,
.footer-design a {
    text-decoration: none !important;
    font-size: 1rem !important
}

.button-call {
    background-color: #fff;
    padding: 10px;
    width: 100%;
    height: auto;
    color: #5a4abf;
    display: block;
    position: relative;
    border-radius: 10px;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    border: 2px solid #5a4abf
}

.social a,
.social a:hover {
    border-radius: 2rem;
    padding: 5px;
    transition-duration: 1s
}

.footer-design .title {
    color: #5a4abf;
    font-size: 1.3rem !important
}

.footer-design p a {
    left: 0;
    position: relative;
    transition-duration: .7s;
    color: #7b6ce0 !important
}

.footer-design .text-dark p:hover {
    left: 5px;
    color: #7c70ce !important;
    position: relative;
    transition-duration: .2s
}

.footer-design .text-dark p:hover a {
    color: #5a4abf !important
}

.space-y-3 {
    padding-top: 3rem
}

.social a {
    list-style: underline;
    color: #000;
    display: flex;
    justify-content: center;
    align-items: center
}

.social a:hover {
    background-color: #5041a8;
    background-repeat: round
}

.social a:hover img {
    filter: invert(1)
}

.social img {
    width: 1.5rem
}

.social {
    margin: 0;
    padding: 0;
    display: flex
}

.social li {
    list-style: none;
    padding: 0 3px
}

@media (max-width:600px) {
  .lets-make .bg-wrap {
          padding: 40px 20px !important
      }
}

@media (max-width:480px) {
  main .we-are-2 .shape-5 {
          left: 20px;
          top: 100px
      }
}

@media (max-width:480px) {
  .left-content {
          padding: 14px
      }
}