@import url('css2.css');

:root {
  --primary_color: #314E7B;
  --white: #ffffff;
  --black: #000000;
  --dblack: #3B3B3B;
  --main-black: #000000;
  --border-color: #707070;
  --blue: #5E8ECA;
  --light-gery: #f0f0f0;
  --lblue: #B3B6CB;
  --lborder: #eeeeee;
  --orange: #EE6A20;
  --lgreen: #5ABED9;
  --voilet: #7781AF;
  --green: #3BB449;
  --card-box: #EFF0F4;
  --header: #888888;
  --circle-border: #0171B5;
  --dblue: #0384D1;
  --content: #9a9a9a;
  --link-blue: #008AFC;
  --font-family: "Inter Tight", sans-serif;
  --f14: 14px;
  --f15: 15px;
  --f16: 16px;
  --f20: 20px;
  --f22: 22px;
  --f28: 28px;
  --f36: 36px;
  --f40: 40px;
  --f50: 50px;
  --f60: 48px;
  --font-weight4: 300;
  --font-weight5: 500;
  --font-weight6: 600;
  --font-weight7: 700;
  --font-weight8: 800;
  --font-weight9: 900;
}

.error {
  color: red !important
}

html {
  scroll-behavior: smooth
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  outline: 0
}

html {
  overflow-x: hidden
}

body {
  color: var(--black);
  font-family: var(--font-family);
  height: 100%;
  font-weight: 300
}

.fixed-banner {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover
}

html {
  scroll-behavior: smooth
}

p {
  padding: 0;
  margin: 0 0;
  font-size: 16px
}

iframe {
  width: 100%
}

::placeholder {
  font-size: 16px;
  color: #757d85;
  opacity: 1;
  font-weight: 400
}

.filter-option-inner-inner {
  font-size: var(--f16);
  color: #757d85
}

.form-control {
  box-shadow: none;
  padding: 13px 25px;
  border-radius: 8px;
  color: #757d85;
  font-size: var(--f16);
  height: 60px;
  background: 0 0;
  border-color: #a6a5a5
}

.app-devMain .formWrapper .form-control,
.contactPage-sec .contact-FormBox .formSide .form-control,
.human-cloudSec .solutions-form .form-control,
.solutionContct .form-control {
  border-color: #a6a5a5
}

#duration.form-select {
  border-radius: 8px;
  border: 1px solid #a6a5a5
}

.apply-jobForm .form-control {
  padding: 13px 25px
}

.form-control:focus,
.form-control:hover {
  background: var(--white) !important
}

.relative {
  position: relative
}

label {
  font-size: 16px
}

.label {
  font-size: 16px !important
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  padding: 0;
  margin: 0
}

.h1,
h1 {
  font-size: 36px
}

.h2,
h2 {
  font-size: 30px
}

.h3,
h3 {
  font-size: 25px
}

.h4,
h4 {
  font-size: 17px;
  font-weight: 500
}

.h5,
h5 {
  font-size: 16px;
  font-weight: 500
}

.h6,
h6 {
  font-size: 15px;
  font-weight: 500
}

.btn {
  padding: 12px 22px;
  transition: .3s ease-in-out;
  font-size: var(--f18);
  text-transform: capitalize;
  font-weight: var(--font-weight5) !important;
  outline: 0 !important
}

.btn-primary {
  background-color: var(--link-blue);
  border-color: var(--link-blue);
  border-radius: 50px;
  color: var(--white);
  text-transform: capitalize
}

input.btn-primary:focus {
  color: var(--white) !important
}

.btn-primary:active input,
.btn-primary:focus input {
  color: var(--link-blue) !important
}

.btn-primary:active svg path {
  color: var(--link-blue);
  fill: var(--link-blue)
}

.btn-primary:focus svg path {
  fill: var(--link-blue)
}

.btn-primary:hover {
  color: var(--white) !important
}

.btn-primary-outline {
  background: 0 0;
  border-color: var(--link-blue);
  color: var(--link-blue);
  border-radius: 50px;
  font-weight: var(--font-weight5)
}

.btn svg {
  margin-left: 27px;
  transition: all .3s ease-in-out
}

.btn:hover svg {
  transform: rotate(45deg)
}

.btn-primary:active,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
  background-color: var(--white);
  border-color: var(--link-blue);
  color: var(--link-blue) !important
}

#contactPage .btn-primary:active {
  background-color: transparent;
  color: var(--white) !important
}

.btn-secondary {
  background-color: var(--white);
  border-color: var(--border-color);
  border-radius: 50px;
  color: var(--black)
}

.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary:hover,
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show>.btn-secondary.dropdown-toggle {
  background-color: var(--primary_color);
  border-color: var(--primary_color);
  color: var(--white)
}

.btn:hover {
  color: var(--circle-border)
}

.btn-blue:hover {
  background: var(--white);
  border-color: var(--blue);
  color: var(--blue)
}

.btn-blue:hover svg path {
  fill: var(--blue)
}

.btn-orange {
  background-color: var(--orange);
  color: var(--white);
  border-radius: 50px
}

.btn-orange:hover {
  background-color: var(--white);
  border-color: var(--orange);
  color: var(--orange)
}

.btn-orange:hover svg path {
  fill: var(--orange)
}

.btn-green {
  background-color: var(--green);
  color: var(--white);
  border-radius: 50px
}

.btn-green:hover {
  background-color: var(--white);
  color: var(--green);
  border-color: var(--green)
}

.btn-primary-circle {
  color: var(--circle-border);
  font-size: var(--f16);
  font-weight: var(--font-weight6);
  text-transform: capitalize;
  transition: .3s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center
}

.btn-primary-circle i {
  margin-left: 16px;
  border: 1px solid var(--circle-border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 42px;
  height: 42px;
  flex: 0 0 42px
}

.btn-primary-circle i svg {
  transition: .3s ease-in-out
}

.btn-primary-circle:hover i {
  background-color: var(--circle-border)
}

.btn-primary-circle:hover i svg {
  transform: rotate(45deg)
}

.btn-primary-circle:hover i svg path {
  fill: var(--white)
}

.btn-primary-circle.text-white i {
  border: 1px solid var(--white)
}

.btn-primary-circle.text-white:hover i {
  border: 1px solid var(--circle-border)
}

.btn-white-circle {
  color: var(--white);
  font-size: var(--f16);
  font-weight: var(--font-weight6);
  text-transform: capitalize;
  transition: .3s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center
}

.btn-white-circle i {
  margin-left: 16px;
  border: 1px solid var(--white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px
}

.btn-white-circle i svg {
  transition: .3s ease-in-out
}

.btn-white-circle:hover i {
  background-color: var(--circle-border)
}

.btn-white-circle:hover i svg {
  transform: rotate(45deg)
}

.btn-white-circle:hover i svg path {
  fill: var(--white)
}

.btn-white-circle:hover {
  color: var(--white)
}

.btn-primary-circle,
.btn-white-circle {
  padding: 0
}

@-webkit-keyframes autofill {
  to {
    background: 0 0
  }
}

input:-webkit-autofill {
  -webkit-animation-name: autofill;
  -webkit-animation-fill-mode: both
}

.btn-blue {
  background-color: var(--link-blue);
  color: var(--white);
  border-radius: 50px
}

.bg-default {
  background-color: var(--default);
  border-radius: 15px
}

.bg-primary {
  background-color: var(--primary_color);
  border-radius: 15px
}

.btn-outline {
  background-color: transparent;
  border-color: var(--link-blue);
  border-radius: 50px;
  padding: 13px 32px;
  color: var(--link-blue) !important;
  font-size: 18px
}

.btn-outline:hover {
  background-color: var(--link-blue);
  color: var(--white) !important;
  border-color: var(--link-blue) !important
}

.btn-outline:hover svg path {
  fill: var(--white)
}

.btn-white-outline {
  background-color: transparent;
  border-color: var(--white);
  border-radius: 50px;
  padding: 13px 32px;
  color: var(--white);
  font-size: 18px
}

.btn-white-outline:hover {
  background-color: var(--link-blue);
  border-color: var(--link-blue);
  color: var(--white)
}

.bg-gray {
  background-color: var(--greytext)
}

.text-primary {
  color: var(--primary_color)
}

.text-default {
  color: var(--default)
}

.text-black {
  color: var(--black)
}

.bgwhite {
  background: var(--white);
  box-shadow: 0 5px 25px #00000008;
  border-radius: 15px;
  padding: 25px
}

dl,
ol,
ul {
  margin-top: 0;
  margin-bottom: 0
}

ul {
  list-style: none;
  padding-left: 0
}

a {
  text-decoration: none
}

.form-control:focus {
  color: var(--black);
  border-color: #fff0;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgb(13 110 253 / 0%);
  background: var(--lgrey);
  border: 2px solid var(--link-blue)
}

.form-check-inline {
  display: inline-block;
  margin-right: 1rem;
  margin: 0;
  padding: 0
}

.white-space-nowrap {
  white-space: nowrap
}

img {
  max-width: 100%;
  height: auto
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0
}

.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100vw;
  height: 100vh;
  background-color: #000
}

.ml-auto {
  margin-left: auto
}

.arrow {
  width: 12px
}

.mt-44 {
  margin-top: 44px
}

.mt-35 {
  margin-top: 35px
}

.title-f60.heading-black,
.title-f60.heading-black.splitting .char:after {
  color: var(--main-black) !important
}

[data-scroll] {
  opacity: 1;
  will-change: transform, scale, opacity;
  transform: translateY(3.8rem) scale(.93);
  transition: all 1.5s cubic-bezier(.165, .84, .44, 1)
}

[data-scroll=in] {
  opacity: 1;
  transform: translateY(0) scale(1)
}

.splitting .char {
  color: transparent
}

.splitting .char:after {
  visibility: visible;
  color: var(--link-blue);
  opacity: 0;
  transform: translateY(30%);
  transition: all .6s cubic-bezier(.175, .885, .32, 1.275);
  transition-delay: calc(.2s + (.04s * var(--char-index)))
}

[data-scroll=in] .char:after {
  opacity: 1;
  transform: translateY(0)
}

.header .section-title {
  font-size: var(--f60);
  color: var(--primary_color);
  line-height: 60px
}

.section {
  padding: 60px 0
}

.contactFaq {
  padding-top: 140px !important
}

.section-tech {
  padding: 80px 0
}

.page-main-wrapper {
  overflow: hidden;
  position: relative;
  margin: 0 auto
}

.navbar-brand {
  width: 100%;
  max-width: 300px;
  padding: 0
}

nav.navbar {
  position: fixed;
  width: 100%;
  padding: 0;
  z-index: 11;
  left: 0
}

nav.navbar .container::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  opacity: .2
}

.header-apply-btn {
  display: none
}

.navbar .nav-link {
  color: var(--white);
  font-size: var(--f18);
  font-family: var(--font-family);
  font-weight: var(--font-weight4);
  position: relative;
  padding: 31px 0 !important;
  margin: 0 .5rem
}

.nav-item.dropdown {
  position: initial
}

.navbar .dropdown .nav-link::after {
  content: '';
  background: url('/assets/img/svg/arrowDown-white.svg') no-repeat;
  position: absolute;
  top: 40px;
  right: -16px;
  width: 10px;
  height: 7px
}

.navbar .nav-item:not(:last-child) {
  padding-right: 20px
}

.navbar-nav .dropdown-menu {
  min-width: inherit;
  width: 100%;
  padding: 2rem 2rem 1rem;
  border: none;
  border-radius: 0
}

.navbar .dropdown.show>.dropdown-menu {
  display: block;
  margin: 0;
  padding: 30px 0 50px;
  border: none;
  border-radius: 0
}

.navbar-nav .dropdown-menu.show {
  visibility: visible;
  opacity: 1
}

.navbar .navbar-nav .dropdown-menu {
  left: 0;
  top: 83px
}

.navbar .nav-item .btn-blue {
  background: var(--link-blue);
  transition: all .3s ease-in-out;
  padding: 6px 18px
}

.navbar .nav-item .btn-blue:hover {
  background: var(--white);
  color: #0171b5
}

.fix-dropdown .dropdown-menu .dropdown-item,
.single-menuList p.header-title {
  color: var(--blue) !important;
  font-weight: 500;
  font-size: var(--f14);
  margin-bottom: 0;
  position: relative
}

.fix-dropdown .dropdown-menu .dropdown-item {
  padding: .75rem 1rem
}

.fix-dropdown .dropdown-menu .dropdown-item:before {
  position: absolute;
  content: '';
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 0;
  height: 1.5px;
  background-color: var(--primary_color);
  transition-duration: .4s
}

.fix-dropdown .dropdown-menu .dropdown-item.active:before,
.fix-dropdown .dropdown-menu .dropdown-item:hover:before {
  width: 100%
}

.menuList-content .header-title {
  margin-bottom: 16px !important
}

p.header-title a {
  color: var(--main-black) !important;
  font-size: var(--f22);
  font-weight: var(--font-weight5)
}

.menuList-content ul.productList li:not(:last-child) {
  margin-bottom: 8px
}

.menuList-content ul.productList a {
  font-size: var(--f16);
  color: var(--main-black) !important;
  font-weight: var(--font-weight4);
  opacity: .7
}

.menuList-content ul.productList a:hover {
  color: var(--link-blue) !important;
  opacity: 1
}

.socialHeader-box {
  background: transparent linear-gradient(90deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat padding-box;
  border-radius: 15px;
  padding: 30px 80px;
  display: flex;
  align-items: center;
  justify-content: space-between
}

.socialHeader-box .socialHeader-left {
  gap: 40px;
  align-items: center
}

.socialHeader-left .content p {
  font-size: var(--f22);
  font-weight: var(--font-weight5);
  line-height: 1.4
}

.socialHeader-left .content span {
  font-size: var(--f16);
  font-weight: var(--font-weight4)
}

.socialHeader-right .socialImages a:not(:last-child) img {
  margin-right: 30px
}

p.header-title a:hover {
  color: var(--black) !important
}

.single-menuList p {
  font-size: 13px;
  color: var(--black)
}

.single-menuList:not(:last-child) {
  margin-bottom: 24px
}

.single-menuList .menuList-ico {
  flex-shrink: 0;
  margin-right: 17px
}

.feature-menu-content p {
  font-size: var(--f15);
  margin-top: 19px
}

.navbar .navbar-nav .nav-link:before {
  position: absolute;
  content: '';
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 0;
  height: 2px;
  background-color: var(--link-blue);
  transition-duration: .4s
}

.navbar .navbar-nav .nav-item .nav-link.active:before,
.navbar .navbar-nav .nav-item:hover .nav-link:before {
  width: 100%
}

.navbar .dropdown-menu .container {
  border-bottom: 0
}

.mobile-menuImg {
  display: none
}

.nav-item.dropdown.fix-dropdown {
  position: relative
}

.dropdown-item:hover {
  background-color: var(--white)
}

.fix-dropdown .dropdown-menu {
  min-width: 180px;
  padding: 10px 0 0 !important
}

.dropdown-menu .dropdown-item:hover,
.menuList-content a:hover h5 {
  color: var(--black) !important
}

.footer-main .container,
.navbar .container {
  max-width: 1440px
}

.main-section {
  padding-top: 148px
}

.title-f60 {
  font-size: 54px;
  color: var(--white);
  font-weight: 300;
  max-width: 610px
}

.single-menuList {
  margin-bottom: 56px
}

.menuList-content .dropdown li {
  position: relative;
  margin-bottom: 5px;
  padding-left: 18px
}

.menuList-content .dropdown li::before {
  content: '';
  position: absolute;
  top: 6px;
  left: 0;
  background: url('/assets/img/svg/down-arrow.svg') no-repeat;
  width: 10px;
  height: 7px;
  transform: rotate(-90deg)
}

.menuList-content .dropdown li a {
  font-size: 12px;
  color: var(--black) !important;
  width: 100%;
  position: relative
}

.menuList-content .dropdown li a:before {
  position: absolute;
  content: '';
  left: 50%;
  transform: translateX(-50%);
  bottom: -3px;
  width: 0;
  height: 1.5px;
  background-color: var(--primary_color);
  transition-duration: .4s
}

.menuList-content .dropdown li a.active:before,
.menuList-content .dropdown li:hover a:before {
  width: 100%
}

.menuList-content .dropdown li a:hover {
  color: var(--primary_color) !important
}

.container.banner-bg::before {
  content: '';
  position: absolute;
  top: 0;
  background: url('/assets/img/banner-bg.webp') no-repeat;
  background-position: 100% 155px;
  height: 100%;
  width: 100%;
  right: 0
}

.banner-content h1.banner-title {
  font-size: 35px;
  color: var(--white);
  font-weight: 400;
  line-height: 48px
}

.banner-content h1.banner-title strong {
  font-size: 80px;
  color: var(--primary_color);
  font-weight: var(--font-weight4);
  line-height: 80px;
  text-transform: uppercase
}

.bannerImg .vr-img {
  width: 265px;
  position: absolute;
  left: 36px;
  z-index: 2
}

.bannerImg .mobile1 {
  width: 279px;
  margin-top: 165px;
  transition-delay: .3s;
  transition: cubic-bezier(.075, .82, .165, 1)
}

.bannerImg .mobile2 {
  width: 322px;
  position: absolute;
  top: 36px;
  right: 92px;
  transition-delay: .8s;
  transition: cubic-bezier(.075, .82, .165, 1)
}

.banner-cta {
  margin-top: 38px;
  display: flex;
  align-items: center
}

.banner-cta .btn:not(:last-child) {
  margin-right: 14px
}

.banner-cta .btn {
  padding: 12px 24px;
  font-size: 18px
}

.btn-secondary:hover svg path {
  fill: var(--white)
}

.banner-bg .row {
  position: relative;
  z-index: 1
}

.bgCircle {
  width: 360px;
  height: 360px;
  background: var(--lblue);
  border-radius: 50%;
  opacity: .2;
  position: absolute;
  left: -200px;
  top: 70%
}

.content-sec .content-title .section-title p.full-content-title,
.content-sec .section-title .full-content-title {
  font-size: 50px !important;
  font-weight: 300;
  line-height: 70px !important;
  color: var(--black)
}

.content-sec-btn {
  margin-top: 20px
}

.text-highlight {
  color: var(--primary_color)
}

.content-sec span.sub-title {
  font-size: 42px;
  font-weight: 500;
  margin-bottom: 32px
}

.service-spectrum .section-title h3 {
  font-size: var(--f50);
  color: var(--primary_color);
  font-weight: var(--font-weight5);
  line-height: 58px
}

.service-spectrum.excellence .section-title h3 {
  color: var(--white) !important;
  font-size: var(--f40) !important
}

.service-spectrum .content-title p,
.tech p,
.third-level-service-sec .content-title p {
  font-size: var(--f16)
}

.advatnages .title-f60.splitting .char:after {
  color: var(--black)
}

.service-spectrum .spectrumLine1 {
  position: absolute;
  top: -524px;
  right: -575px;
  width: 816px;
  height: 816px;
  border: 1px solid var(--light-gery);
  border-radius: 50%
}

.service-spectrum .spectrumLine2 {
  position: absolute;
  top: -374px;
  right: -423px;
  width: 519px;
  height: 519px;
  border: 1px solid var(--light-gery);
  border-radius: 50%
}

#spectrum.fixed .accordion-section {
  top: 150px !important
}

#spectrum .accordion-section .wrapper .item::before {
  content: '';
  position: absolute;
  top: 25px;
  left: 30px;
  width: 2px;
  height: 87%;
  background-color: #717171
}

#spectrum .accordion-section .wrapper .item.active::before {
  background-color: var(--primary_color)
}

.dotImg {
  width: 11px;
  height: 11px;
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: 50%;
  position: absolute;
  left: 25px;
  z-index: 1
}

.dotImg span img {
  width: 19px;
  transform: rotate(90deg);
  display: none
}

#spectrum .item.active .dotImg {
  width: 37px;
  height: 37px;
  left: 12px;
  background-color: var(--primary_color);
  z-index: 1;
  margin-top: 0
}

#spectrum .item.active .dotImg span {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 6px
}

#spectrum .item.active .dotImg span img {
  display: block
}

.blue-dot .dotImg {
  background-color: var(--primary_color);
  margin-top: 10px
}

.spacer {
  background-color: teal
}

.wrapper {
  width: 100%;
  padding-bottom: 0
}

#spectrum .item {
  max-width: 390px;
  border-radius: 5px;
  overflow: hidden;
  border-radius: 0;
  padding-bottom: 12px;
  padding-top: 12px;
  margin-left: 60px
}

#spectrum .item:not(:last-child) {
  border-bottom: 1px solid var(--lborder)
}

#spectrum .item .accordion-left-content {
  max-width: 390px
}

#spectrum .item .header {
  background-color: var(--white)
}

#spectrum .item .header p.sec-title {
  font-size: 20px;
  margin: 0;
  font-weight: 700
}

#spectrum .item.active .header p.sec-title {
  font-size: 28px;
  line-height: 32px
}

#spectrum .item .content {
  background-color: var(--white)
}

#spectrum .item .content p {
  margin: 0;
  padding: 10px 0;
  font-size: var(--f16)
}

#spectrum .wrapper {
  position: relative
}

.mt-77 {
  margin-top: 10px
}

.mdCircle {
  width: 329px;
  height: 329px;
  left: 41px;
  top: 220px
}

.accordion-img img {
  position: absolute;
  top: 0;
  z-index: 1
}

.signleAccordion {
  display: flex;
  align-items: center
}

.accordion-imgRight {
  position: absolute;
  top: 0;
  right: 0
}

.accordionLeftContent {
  max-width: 390px
}

.accordion-imgRight {
  width: calc(100% - 500px)
}

.signleAccordion .accordion-imgRight {
  display: none;
  opacity: 0;
  visibility: hidden
}

.signleAccordion.active .accordion-imgRight {
  display: block;
  opacity: 1;
  visibility: visible
}

.scrollImg {
  position: relative;
  z-index: 1;
  border-radius: 15px
}

.circle-portfolio {
  position: absolute;
  bottom: 0;
  left: -65px;
  width: 406px;
  height: 406px;
  border: 1px solid var(--light-gery);
  border-radius: 50%
}

.portfolio-sec .row {
  position: relative;
  z-index: 2
}

.portfolio-sec .banner-cta {
  justify-content: flex-end
}

.portfolio-single-wrapper .tag-wrapper {
  position: absolute;
  top: 18px;
  left: 13px;
  z-index: 2
}

.portfolio-single-wrapper .portfolio-tag {
  color: var(--white);
  padding: 5px 15px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: var(--font-weight5);
  z-index: 1;
  background-color: rgba(255, 255, 255, .2);
  text-transform: uppercase;
  display: inline-block;
  text-wrap: nowrap
}

.portfolio-single-wrapper .cta-action {
  position: absolute;
  top: 44%;
  right: 0;
  left: 0;
  align-items: center;
  justify-content: center;
  display: flex;
  opacity: 0;
  visibility: hidden
}

.header-apply-btn .btn-blue svg,
.portfolio-single-wrapper .cta-action svg {
  transform: rotate(-35deg);
  transition: all .3s ease-in-out;
  margin-left: 5px
}

.header-apply-btn .btn-blue:hover svg,
.portfolio-single-wrapper .cta-action:hover svg {
  transform: rotate(0)
}

.portfolio-single-wrapper:hover .cta-action {
  display: flex;
  opacity: 1;
  visibility: visible
}

.portfolio-heading {
  margin-top: 24px;
  text-align: center
}

.portfolio-heading h4,
.portfolio-heading p {
  font-size: var(--f24);
  font-weight: var(--font-weight4);
  text-align: left;
  color: var(--black)
}

.portfolioImg {
  position: relative
}

.portfolioImg img {
  width: 100%;
  border-radius: 15px
}

.tag-wrapper .portfolio-tag:not(:last-child) {
  margin-right: 8px
}

.section.client-sec {
  padding-top: 16px;
  padding-bottom: 30px;
  margin-left: 0;
  border-bottom: 1px solid #e5e5e5
}

.client-sec p.client-heading {
  font-size: var(--f24);
  font-weight: var(--font-weight5);
  color: var(--main-black);
  position: relative;
  padding-bottom: 30px;
  padding-top: 30px
}

.client-logo {
  width: 200px
}

.swiper-slide .client-logo img {
  opacity: .4
}

.swiper-slide-active .client-logo img {
  opacity: 1
}

.xlCircle {
  width: 505px;
  height: 505px;
  left: inherit;
  right: -250px;
  top: 0;
  opacity: .1
}

.current-opening {
  padding-bottom: 70px
}

.current-opening .header p {
  font-size: 24px;
  font-weight: 300;
  margin-bottom: 16px;
  line-height: 34px
}

.current-opening .header h2,
.current-opening .header h3 {
  font-size: 46px !important;
  line-height: 60px;
  font-weight: 300;
  color: var(--main-black)
}

.current-opening .header h3 {
  margin-bottom: 53px
}

.formSide {
  padding: 80px;
  border-radius: 15px;
  background-image: none;
  background: transparent linear-gradient(87deg, #dbeafd78 0, #d0fae663 100%) 0 0 no-repeat
}

.current-opening .header .section-title span {
  display: block
}

.joinUs-sec .content-title p {
  font-size: var(--f20);
  color: var(--content)
}

#footer {
  background-color: #fff;
  background-image: radial-gradient(at 46% 0, #fff 0, transparent 50%), radial-gradient(at 0 98%, #ffffd1 0, transparent 50%), radial-gradient(at 100% 100%, hsla(180, 67%, 63%, .68) 0, transparent 50%)
}

.footer .footer-main {
  padding: 132px 0 40px;
  color: var(--white);
  border-bottom: 1px solid rgba(0, 0, 0, .1)
}

.footer .footer-logo img {
  width: 100px
}

.fottercontentLeft {
  display: flex;
  gap: 65px;
  width: 100%
}

.socialIcons li a {
  color: var(--border-color);
  width: 33px;
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15)
}

.socialIcons li a:hover {
  color: var(--primary_color)
}

.socialIcons li {
  margin-top: 20px
}

.socialIcons li:not(:last-child) {
  margin-right: 10px
}

.footer .footer-content h4 {
  font-size: var(--f18);
  color: var(--main-black);
  font-weight: var(--font-weight5);
  margin-bottom: 12px;
  line-height: normal
}

.footer .footer-content a {
  color: var(--main-black)
}

.footer .footer-content li a {
  font-size: 16px;
  color: var(--main-black);
  font-weight: 300;
  position: relative;
  padding-bottom: 5px;
}

.footer .subFooter .siteLink li a {
  color: var(--black);
  font-size: 14px;
  font-weight: var(--font-weight4)
}

.copyRight span {
  font-size: 14px;
  color: #9eacc1
}

.footer .footer-content li a:hover,
.footer-content h5 a:hover {
  color: var(--link-blue);
  opacity: 1
}

.footer .subFooter .siteLink li a:hover {
  color: var(--link-blue)
}

.footer-content h5 a {
  position: relative
}

.footer .footer-content li a:after,
.footer-content h5 a:after,
.subFooter .siteLink li a::after {
  display: block;
  content: '';
  transform: scaleX(0);
  transition: transform .3s ease-in-out;
  width: 100%;
  position: absolute;
  max-width: 100%;
  bottom: 0;
  left: 0;
  border-radius: 0;
  height: 1px;
  font-size: 16px;
  right: 0;
  margin: 0 auto;
  background-color: var(--blue)
}

.footer .footer-content li a:hover:after,
.footer-content h5 a:hover::after,
.subFooter .siteLink li a:hover::after {
  transform: scaleX(1)
}

.footer .footer-content li:not(:last-child) {
  margin-bottom: 16px
}

.footer .subFooter {
  padding: 30px 0
}

.footer .subFooter .siteLink ul {
  display: flex;
  align-items: center;
  justify-content: center
}

.footer .subFooter .siteLink li:not(:last-child) {
  margin-right: 20px
}

.footer .subFooter .copyRight {
  margin-top: 10px
}

.footer .subFooter .siteLink li {
  position: relative
}

.footer .subFooter .siteLink li:not(:last-child):before {
  content: '';
  position: absolute;
  top: 6px;
  right: -12px;
  width: 1px;
  height: 14px;
  background-color: var(--border-color)
}

.text-highlight {
  position: relative;
  background-position: left;
  background-size: 0 100%;
  background-image: linear-gradient(#f0f0f0, #f0f0f0);
  background-repeat: no-repeat;
  transition: background-size 1s;
  padding: 4px
}

.in-view .text-highlight {
  background-size: 100% 100%
}

.breadcrumb-item a {
  font-size: 14px;
  color: var(--white)
}

.breadcrumb-item span {
  color: var(--white);
  font-size: 14px
}

.inner-section .container {
  text-align: left;
  position: relative;
  z-index: 2
}

.inner-section {
  text-align: right
}

.inner-section.banner-section img {
  width: 100%;
  height: 712px
}

.banner-content p {
  max-width: 360px
}

.content-sec .orangeLogo {
  max-width: 200px
}

.content-sec .ornage-text {
  color: var(--orange)
}

.bgCircle.orangeCircle {
  left: -120px;
  top: -60px;
  background: var(--orange);
  opacity: .1
}

.assistanceCarousel .swiper-pagination {
  text-align: left
}

.formOuter-wrapper {
  padding-bottom: 168px
}

.formOuter-wrapper .bgCircle {
  top: -44%;
  left: -170px
}

.formOuter-wrapper .form-box {
  padding: 70px 75px 38px 36px;
  background: var(--blue);
  border-radius: 15px;
  z-index: 2;
  position: relative
}

.formOuter-wrapper .formContent {
  color: var(--white)
}

.formOuter-wrapper .formContent h3 {
  font-size: 70px;
  font-weight: 700;
  line-height: 76px;
  margin-bottom: 20px
}

.formOuter-wrapper .formContent p {
  max-width: 480px;
  font-size: var(--f20);
  line-height: 27px
}

.formWrapper form .form-group {
  margin-bottom: 20px
}

.formWrapper span {
  color: #e8f2ff;
  opacity: .45;
  font-size: var(--f14)
}

.formWrapper .formBtn {
  margin-top: 48px
}

.formWrapper .formBtn .btn {
  width: auto;
  padding: 12px 20px 12px 24px;
  color: var(--white);
  font-weight: var(--font-weight5)
}

.formWrapper .formBtn .btn input {
  background: 0 0;
  border: none;
  color: var(--white) !important
}

.section.portfolio-sec.ui-portfolio {
  padding-top: 90px
}

.midCircle {
  width: 262px;
  height: 262px;
  left: inherit;
  right: -170px;
  top: -110px
}

.processSLider-outer .single-stepProcess .process-circle {
  width: 211px;
  height: 211px;
  border-radius: 50%;
  opacity: .84;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: .3s ease-in-out
}

.processSLider-outer .single-stepProcess .circle-dblue {
  background-color: var(--primary_color)
}

.processSLider-outer .single-stepProcess .circle-blue {
  background-color: var(--blue)
}

.processSLider-outer .single-stepProcess .circle-lgreen {
  background-color: var(--lgreen)
}

.processSLider-outer .single-stepProcess .circle-voilet {
  background-color: var(--voilet)
}

.processSLider-outer .single-stepProcess .process-circle span {
  font-size: var(--f20);
  font-weight: 700;
  color: var(--white)
}

.process-hoverContent {
  display: none;
  color: var(--white)
}

.process-hoverContent h3 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 14px
}

.process-hoverContent p {
  font-size: 14px;
  line-height: 15px
}

.single-stepProcess .process-circle.active {
  transform: scale(1.2);
  width: 344px;
  height: 344px;
  position: relative;
  z-index: 2;
  border: 2px solid var(--white)
}

.single-stepProcess .process-circle.active span {
  display: none
}

.single-stepProcess .process-circle.active .process-hoverContent {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  padding: 0 20px
}

.mt-150 {
  margin-top: 150px
}

.mt-100 {
  margin-top: 100px
}

.ourProcess.service-spectrum .spectrumLine1 {
  right: inherit;
  left: -400px;
  top: 0
}

.ourProcess.service-spectrum .spectrumLine2 {
  right: inherit;
  left: -300px;
  top: 130px
}

.ourProcess .row.mt-100 {
  height: 400px
}

.swiper-slider:not(:last-child) {
  margin-bottom: 50px
}

.our-approach {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 150px;
  max-width: 744px
}

.value img {
  min-height: 90px;
  max-height: 90px
}

.value h4 {
  font-size: 32px;
  font-weight: var(--font-weight4);
  color: var(--main-black)
}

.value {
  padding: 20px 45px
}

.inner-banner-content {
  position: absolute;
  top: 123px
}

.breadcrum-sec li {
  display: inline-block;
  font-size: 14px;
  color: var(--white);
  opacity: .7
}

.breadcrum-sec li:last-of-type {
  opacity: 1
}

.inner-banner-content h1.banner-title {
  font-size: 54px;
  font-weight: 300;
  line-height: 70px;
  margin-bottom: 20px;
  text-transform: capitalize
}

.solution-banner .inner-banner-content h1.banner-title {
  color: var(--white)
}

.inner-banner-content p {
  font-size: 24px;
  max-width: 650px;
  line-height: 34px;
  color: var(--white);
  opacity: .7
}

.inner-banner-content .banner-cta {
  margin-top: 64px
}

.global-clientele header.section-title {
  margin-top: 32px
}

.breadcrumb-item+.breadcrumb-item::before {
  color: var(--white)
}

.background-blue .breadcrumb-item+.breadcrumb-item::before {
  color: var(--white)
}

.swiper-container {
  overflow: hidden;
  position: relative
}

.tech {
  background: url('/assets/img/techBg.webp');
  background-size: cover
}

.tech .row {
  margin-bottom: 0 !important
}

.tech p {
  font-size: var(--f22);
  line-height: 1.4
}

.testi-content p {
  font-size: 28px;
  line-height: 35px
}

.testi-content h4 {
  font-size: var(--f24);
  font-weight: var(--font-weight4);
  color: var(--black);
  margin-top: 40px !important
}

.testi-content p::after {
  content: '';
  width: 65px;
  height: 65px;
  background: url('/assets/img/svg/quote-right.svg') no-repeat;
  position: absolute;
  bottom: 55px;
  display: block;
  background-size: cover;
  right: 300px;
  z-index: -1;
  display: none
}

.digitalCircle {
  top: -160px;
  left: -120px
}

.xsCircle {
  width: 223px;
  height: 223px;
  top: 140px
}

.digital-serviceCircle {
  left: inherit;
  right: -370px;
  top: 0
}

.test-col .section.testi {
  margin-bottom: 0
}

.tech .swiper-wrapper {
  align-items: center
}

.testi-slider {
  overflow: hidden;
  border-radius: 15px;
  padding-bottom: 130px
}

.testi-content {
  padding: 70px 150px 0 70px;
  padding-bottom: 0;
  position: relative;
  left: 180px
}

.test-img {
  width: 150px;
  height: 150px;
  object-fit: cover
}

.testi-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: 70px
}

.swiper-pagination.testi-pagination {
  bottom: 100px
}

.bubble-sec {
  padding-bottom: 138px
}

.jsonImg {
  max-width: 950px;
  margin: 0 auto
}

video#backgroundVideo {
  position: relative;
  z-index: 2;
  width: 100%
}

#closeButton {
  position: absolute;
  top: 1px;
  right: 1px;
  z-index: 3;
  width: 50px;
  height: 50px;
  border-radius: 0;
  border: none;
  background: var(--white)
}

#closeButton i {
  font-size: 22px
}

#playVideo {
  width: 60px;
  height: 60px;
  background-color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%
}

#playVideo i {
  font-size: 30px;
  color: var(--black)
}

.videoSec .our-approach {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  top: 0
}

.swiper-pagination .swiper-pagination-bullet:not(:last-child) {
  margin-right: 50px !important;
  position: relative
}

.swiper-pagination .swiper-pagination-bullet {
  position: relative;
  width: 11px;
  height: 11px;
  background: var(--white);
  border: 1px solid #717171;
  opacity: 1
}

span.swiper-pagination-bullet:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 3px;
  right: -56px;
  height: 1px;
  width: 55px;
  background: #717171;
  z-index: 8
}

.swiper-pagination .swiper-pagination-bullet-active {
  background: var(--primary_color);
  opacity: 1
}

.swiper-pagination .swiper-pagination-bullet-active::after {
  opacity: 1
}

.green-text {
  color: var(--green)
}

.greenLogo {
  max-width: 170px
}

.bgCircle.greenCircle {
  left: -120px;
  top: -60px;
  background: var(--green);
  opacity: .1
}

.assistanceSec {
  margin-bottom: 50px
}

.assistanceSec h3.section-title {
  color: var(--black);
  font-weight: 300
}

.assistanceCircle {
  width: 505px;
  height: 505px;
  left: inherit;
  right: 0
}

.assistanceCarousel {
  overflow: hidden;
  padding-bottom: 78px
}

.assistanceCarousel .swiper-slide {
  background-color: var(--blue);
  padding: 43px 33px 37px 57px;
  border-radius: 15px
}

.assistaceContent {
  max-width: 295px
}

.assistaceContent p {
  color: var(--white);
  font-size: var(--f22);
  line-height: 28px
}

.assistanceCarousel .swiper-pagination {
  bottom: 0 !important
}

.neuro-transform.service-spectrum .spectrumLine1 {
  left: -430;
  top: 25%;
  right: inherit
}

.neuro-transform.service-spectrum .spectrumLine2 {
  left: -450px;
  top: 30%;
  right: inherit
}

.homeClient .pbmit-tag-wrapper {
  max-width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center
}

.homeClient .pbmit-tag-wrapper img {
  object-fit: contain;
  filter: grayscale(100%)
}

.homeClient .pbmit-tag-wrapper img:hover {
  filter: grayscale(0%);
  cursor: pointer
}

.great-place .content-title p {
  font-size: var(--f60);
  line-height: 1.1
}

.great-place-img img {
  width: 153px;
  padding-left: 20px
}

.greatplcCircle {
  top: 0;
  left: -120px
}

.section-title h3 {
  font-size: var(--f60);
  color: var(--primary_color);
  font-weight: var(--font-weight7);
  line-height: 60px
}

.content-title p {
  font-size: var(--f22)
}

.teamCircle {
  top: 50px;
  left: -115px
}

.team-row h4 {
  font-size: 28px;
  font-weight: var(--font-weight7)
}

.team-row p {
  font-size: 28px
}

.contact-banner .content-title p {
  font-size: var(--f40);
  max-width: 940px;
  margin-top: 25px;
  line-height: 52px;
  color: var(--black)
}

.contact-socials li {
  margin-top: 0
}

.contact-socials ul {
  justify-content: space-around
}

.marker-img img {
  width: 17px
}

.contactCircle {
  top: 550px;
  left: -170px;
  z-index: -1
}

.contact-socials .fa-brands {
  font-size: 20px
}

.leaderCircle {
  width: 286px;
  height: 286px;
  right: 10px;
  left: auto;
  top: -60px
}

.workCircle {
  top: -170px;
  left: -170px;
  width: 438px;
  height: 438px
}

.inner-banner-content p.mob-p {
  max-width: 430px
}

.teammemCircle {
  width: 218px;
  height: 218px;
  left: auto;
  right: -70px;
  top: 350px
}

.mob-dev-content span {
  font-size: 30px;
  font-weight: 700
}

.mobCircle {
  top: -40px;
  left: -120px
}

.logo-row img {
  filter: grayscale(100%)
}

.logo-row img:hover {
  filter: grayscale(0%);
  cursor: pointer
}

.mob-dev-assis h3 {
  font-weight: 300;
  font-size: 56px
}

.excellence .container {
  background: url('/assets/img/begin-transformation.png');
  background-size: cover;
  background-position: center;
  padding: 50px 60px;
  border-radius: 8px;
  color: #fff
}

.excellence p {
  font-size: 18px
}

.conCircle {
  width: 388px;
  height: 388px;
  top: 350px;
  left: -100px
}

.approach-slider {
  padding-bottom: 70px
}

.approach-card {
  background-color: var(--card-box);
  border: none;
  height: 100%;
  padding: 10px 10px 30px 10px
}

.approach-card h4 {
  font-size: 36px;
  font-weight: var(--font-weight7);
  line-height: 1.1;
  margin-bottom: 30px
}

.approach-card h6 {
  font-size: var(--f16);
  font-weight: 300
}

.start-with-excellence {
  padding: 109px 0 205px
}

.approachSLider-wrapper {
  padding-top: 64px
}

.knowledge-hubSec h3 {
  color: var(--black) !important
}

.approachSLider-wrapper .swiper-slide {
  opacity: .3
}

.approachSLider-wrapper .swiper-slide.swiper-slide-active,
.approachSLider-wrapper .swiper-slide.swiper-slide-next {
  opacity: 1
}

.logo-outer-wrapper {
  padding: 70px 0 180px
}

.borderLine {
  position: relative
}

.borderLine:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 18px;
  border: 1px dashed #c5c5c5;
  width: 90%;
  height: 1px
}

.borderLine:nth-child(odd):before {
  content: '';
  position: absolute;
  top: 12px;
  right: 0;
  border: 1px dashed #c5c5c5;
  width: 1px;
  height: 90%
}

.third-level-service-sec .latest-service-wrapper {
  padding: 20px 30px;
  margin-bottom: 30px;
  min-height: 200px
}

.latest-service-wrapper .pillar_title h3 {
  font-size: 22px;
  color: var(--primary_color);
  line-height: 28px;
  padding-bottom: 10px
}

.third-level-service-sec .latest-service-wrapper .btn-cta {
  position: absolute;
  bottom: 20px
}

.current-opening .formWrapper form {
  width: 100%
}

.excellence {
  padding-top: 53px !important
}

.mobileFixed-btn {
  position: fixed;
  bottom: 120px;
  right: 20px;
  z-index: 4;
  border-radius: 50%
}

.buttonFixed img {
  max-width: 100px
}

.location-link {
  color: var(--blue);
  text-decoration: underline
}

#spectrum .accordion-section .wrapper .item:nth-last-child():before {
  height: 100%
}

.orb-w {
  z-index: -2;
  justify-content: center;
  align-items: center;
  display: flex;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0
}

.orb-outline-r {
  width: 100%;
  height: 100%;
  position: absolute
}

.orb-outline-w {
  z-index: -2;
  width: 80vh;
  height: 80vh;
  position: absolute
}

.orb-outline-w.is-2 {
  width: 100vh;
  height: 100vh
}

.orb-outline {
  z-index: -2;
  width: 100%;
  height: 100%;
  border: 1px dashed rgba(111, 111, 111, .2);
  border-radius: 100%;
  position: absolute;
  transform: scale(1)
}

.orb-outline.is-2 {
  width: 100vh;
  height: 100vh
}

.dynamic-div {
  background: #00000082;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 4
}

.swiper-pagination {
  z-index: 2 !important
}

.acc-car .text {
  line-height: 1.4;
  overflow: hidden;
  padding-bottom: 20px;
  color: rgba(255, 255, 255, .7)
}

.accordions {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 20vh
}

.accordion {
  padding: 25px 30px 10px;
  border-radius: 15px;
  box-shadow: 0 30px 30px -10px rgba(0, 0, 0, .3)
}

.acc-car .spacer {
  height: 70vh
}

#grid_container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column
}

.title__number {
  font-weight: 300;
  font-size: 20px;
  line-height: normal;
  color: var(--white);
  width: 100%;
  position: relative
}

.text__wrapper {
  overflow: hidden;
  max-width: 144rem;
  margin: 0 auto;
  height: 47rem;
  padding-left: 3rem;
  overflow: visible
}

.text--heading {
  font-weight: 700;
  font-size: 42px;
  line-height: 50px;
  color: var(--white)
}

.text--sub-heading {
  font-weight: 300;
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 0;
  color: var(--white)
}

.scroll-accordion {
  margin: 0 auto;
  padding: 0 2rem;
  width: 100%
}

.illustration {
  width: 100%;
  height: 100%;
  margin-left: 225px
}

.last:before {
  display: none
}

.scroll-accordion {
  background-color: #6ec8fd;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  margin-top: -10px;
  padding-bottom: 10px
}

.scroll-accordion:nth-of-type(2),
.scroll-accordion:nth-of-type(5) {
  background-color: #0099f4
}

.scroll-accordion:nth-of-type(3),
.scroll-accordion:nth-of-type(6) {
  background-color: #0072b5
}

.scroll-accordion:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px
}

.solution-trigger-btn {
  margin-top: 34px
}

.btn-white {
  background-color: var(--white);
  color: var(--blue);
  border-radius: 50px
}

.btn-white:hover {
  color: var(--black)
}

.btn-white:hover svg path {
  fill: var(--black)
}

.tabs.line-blue span.another-line {
  width: 3px;
  height: 100%;
  background-color: #473d8d;
  position: absolute;
  top: 18px;
  left: -13px;
  border-radius: 5px
}

.tabs.line-blue .dot {
  background-color: #314e7b
}

.why-choose-content .btn-secondary {
  margin-bottom: 15px
}

.xxlcricle {
  right: 0;
  margin: 0 auto;
  display: block;
  left: 250px;
  top: unset;
  bottom: -90px;
  opacity: .1
}

.current-opening {
  position: relative;
  z-index: 1
}

.section.client-sec #backgroundImage {
  width: 100%
}

.movers {
  animation: 3s infinite alternate mover
}

@keyframes mover {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }

  100% {
    transform: translateY(30px)
  }
}

.movers2 {
  animation: 1.5s infinite alternate mover
}

@keyframes mover {
  0% {
    -webkit-transform: translateY(0)
  }

  100% {
    transform: translateY(30px)
  }
}

.portfolio-heading .splitting .char:after {
  color: var(--black) !important
}

.black-color .char:after {
  color: var(--black) !important
}

.white-color .char:after {
  color: var(--white) !important
}

.section.client-sec .client-heading .char:after {
  color: var(--black) !important
}

.workplace-slider img {
  width: 100%
}

a.scroll-to-top.show {
  display: none
}

.client-carousel {
  position: relative
}

.client-carousel::after,
.client-carousel::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 25%;
  height: 100%;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0, #fff 100%);
  z-index: 2;
  display: none
}

.case-slider .client-carousel::after,
.case-slider .client-carousel::before {
  content: none
}

.client-carousel::after {
  right: 0;
  left: inherit;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, #fff 95%)
}

.btn:focus {
  box-shadow: none
}

.breadcrumb-item+.breadcrumb-item::before {
  content: var(--bs-breadcrumb-divider, "|");
  padding-left: .3rem
}

.inner-spectrum .sidebar-navbar header,
.why-chooseSec .sidebar-navbar header {
  margin-bottom: 64px !important
}

.blog-btn {
  transition: all .3s ease-in-out;
  display: none
}

.blog-btn .btn {
  justify-content: flex-start;
  transition: all .3s ease-in-out
}

.blog-detail {
  padding: 20px 0 !important
}

.blog-card:hover .blog-btn {
  display: block
}

.blog-card:hover .blog-detail h4 {
  color: var(--primary_color)
}

.blog-card:hover .blog-tag {
  background-color: var(--link-blue);
  color: var(--white);
  font-weight: 300
}

.blog-card img {
  transition: all .3s ease-in-out
}

.blog-card:hover img {
  transform: scale(1.1);
  overflow: hidden
}

.blog-img-wrapper {
  overflow: hidden;
  border-radius: 15px;
  height: 204px
}

.inner-section {
  padding-bottom: 20px !important;
  height: 750px
}

.banner-content h1.banner-title {
  text-align: left
}

.tech {
  margin: 40px 0
}

.testi-content span {
  font-size: 14px
}

.carousel-indicators [data-bs-target] {
  background-color: var(--primary_color)
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
  display: none
}

.logo-outer-wrapper.mob-dev-logos .swiper-slide {
  text-align: center
}

.common-textSec p {
  margin-bottom: 1rem;
  font-size: 20px !important
}

.common-textSec ul {
  list-style: disc;
  padding-left: 30px
}

.common-textSec ul li {
  font-size: 20px;
  margin-bottom: 1rem;
  color: var(--black)
}

.tabs .why-choose-content .list-content {
  display: none
}

.value p {
  line-height: 26px
}

.tech-slider .swiper-slide img {
  max-width: 63px;
  width: 100%
}

.content-title.neurotal-content h4 {
  font-size: 26px;
  padding-bottom: 10px;
  color: var(--content)
}

.fixedScroll-content.neurotal h4 {
  font-size: 50px;
  line-height: 60px;
  padding-bottom: 20px;
  color: #fff
}

.service-spectrum.testi.neurocrm img {
  object-fit: contain;
  height: auto;
  width: 100%;
  max-width: 150px
}

.slider-qute {
  display: flex;
  gap: 15px
}

.slider-qute img {
  position: relative;
  top: 8px
}

.advatnages .advantges-content p {
  font-size: 24px;
  line-height: 34px
}

.advantages-content {
  background-color: #d5e5f2
}

.our-team-opening .btn-primary-circle {
  justify-content: left;
  max-width: 340px;
  width: 100%
}

.circle-left {
  justify-content: left;
  max-width: 150px;
  width: 100%;
  margin-top: 25px
}

.footer-mobile-link {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: auto;
  z-index: 10;
  display: none
}

.footer-mobile-menu {
  position: relative;
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  padding: 15px 15px;
  border-radius: 40px 40px 0 0;
  filter: drop-shadow(0 -5pt 25pt #00000080)
}

.footer-mobile-menu ul {
  display: flex;
  gap: 65px;
  padding: 0;
  justify-content: center
}

.footer-mobile-menu ul li a {
  color: var(--black);
  font-size: 14px;
  cursor: default;
  pointer-events: none
}

.footer-mobile-menu ul li a span img {
  width: 100%;
  max-width: 20px
}

.footer-mobile-menu ul li a span {
  margin: 0 auto;
  text-align: center;
  display: block;
  padding-bottom: 10px
}

.slider-content {
  display: flex;
  justify-content: space-between;
  align-items: center
}

.contact-number {
  display: flex;
  gap: 20px;
  align-items: center
}

.slider-content h3 {
  font-size: 14px;
  font-weight: 400;
  color: #fff;
  line-height: 40px
}

.contact-number span img {
  width: 20px
}

.slider-content h4 {
  color: #fff;
  font-size: 14px;
  line-height: 22px
}

.slider-dropdown ul li {
  padding-bottom: 5px
}

.slider-dropdown {
  opacity: 0;
  visibility: hidden;
  background-color: var(--link-blue);
  padding: 25px 35px 85px;
  margin-bottom: 0;
  border-radius: 40px 40px 0 0;
  position: absolute;
  bottom: -600px;
  width: 100%;
  transition-duration: .3s
}

.slider-dropdown.active {
  opacity: 1;
  visibility: visible;
  bottom: 0
}

.tech-slider .swiper-pagination {
  display: none
}

.inner-banner-content {
  position: absolute;
  top: 123px;
  width: 100%;
  left: 0;
  right: 0;
  max-width: 1400px;
  margin: 0 auto
}

.inner-banner-content .inner-content {
  text-align: center;
  width: 100%;
  margin-top: 150px
}

.inner-banner-content .inner-content p {
  font-size: 18px;
  max-width: 850px;
  line-height: 24px;
  text-align: center;
  width: 100%;
  margin: 0 auto
}

.banner-content-img {
  margin-top: -30px;
  position: relative
}

.heading .tag[data-scroll] {
  opacity: 1;
  will-change: unset;
  transform: none !important;
  transition: none !important
}

.service-spectrum-level {
  width: 100%;
  background: url('/assets/img/gradient-bg-2.webp') no-repeat;
  background-position: center;
  background-size: cover
}

.service-spectrum-level .content-title p {
  color: var(--white);
  opacity: .7;
  line-height: 34px
}

.service-spectrum-level .header .splitting .char:after {
  visibility: visible;
  color: #fff
}

.service-content-wrapper {
  display: flex;
  gap: 15px;
  align-items: start;
  padding-bottom: 45px;
  width: 100%;
  max-width: 550px
}

.service-content-wrapper .countValue span {
  color: #fff;
  opacity: .3;
  font-size: 18px
}

.service-content-wrapper .service-content h3,
.service-content-wrapper .service-content h5 {
  color: #fff;
  font-size: 32px;
  line-height: normal;
  padding-bottom: 16px;
  font-weight: 400
}

.service-content-wrapper .service-content .splitting .char:after {
  color: #fff
}

.service-content-wrapper .service-content p {
  font-size: 20px;
  line-height: 26px;
  color: #ffff;
  font-weight: 400;
  opacity: .7
}

.service-content-wrapper .section-btn .btn-primary-circle {
  justify-content: left;
  padding-top: 41px;
  color: #fff;
  visibility: hidden;
  opacity: 0;
  padding-top: 24px !important
}

.service-content-wrapper .section-btn .btn-primary-circle i {
  border: 1px solid var(--white)
}

.service-content-wrapper:hover .section-btn .btn-primary-circle {
  visibility: visible;
  opacity: 1
}

.service-content-wrapper:hover .section-btn .btn-primary-circle i {
  background-color: #fff
}

.service-content-wrapper:hover .section-btn .btn-primary-circle svg path {
  fill: #314e7b
}

.service-content-wrapper:hover .section-btn .btn-primary-circle svg {
  transform: rotate(45deg)
}

.technology-logo {
  background-color: var(--white) !important;
  background: 0 0;
  padding: 60px 0
}

.productWhy_choose {
  background: url('/assets/img/bgCircle.webp') no-repeat;
  background-position: center -650px;
  background-size: cover
}

.productWhy_choose .content-title p {
  color: var(--main-black);
  line-height: 34px;
  opacity: .7;
  font-weight: 300
}

.productWhy_choose .sidebarNav.sidebar-navbar .title-f60 {
  color: var(--main-black);
  font-weight: 300
}

.productWhy_choose .sidebarNav.sidebar-navbar p {
  color: #fff;
  margin-top: 26px
}

.productWhy_choose .why-chosse-card .splitting .char:after {
  color: var(--main-black)
}

.productWhy_choose .why-chosse-card p {
  color: var(--main-black);
  opacity: .7;
  font-size: 20px
}

.banner-cta.bg-blue .btn-primary-circle {
  color: #fff
}

.banner-cta.bg-blue .btn-primary-circle i {
  border: 1px solid var(--white)
}

.productWhy_choose .why-chosse-card h4 {
  color: var(--main-black);
  margin: 32px 0 16px !important
}

.whychose {
  bottom: 100px !important;
  top: unset
}

.sucess-stories {
  background-color: #e5f0f8;
  background: transparent linear-gradient(88deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat padding-box
}

.sucess-stories h3,
.sucess-stories h3.splitting .char:after {
  color: var(--main-black)
}

.sucess-stories .testi-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: 110px
}

.sucess-stories .testi-slider.sucess-slider {
  width: 100%;
  margin: 0 auto
}

.sucess-stories .testi-slider.sucess-slider .testi-content p {
  font-size: 20px;
  line-height: 26px
}

.sucess-stories .testi-slider.sucess-slider .testi-content .col-md-3 p {
  line-height: 22px;
  font-size: var(--f16);
  margin-top: 10px
}

.slider-content-story {
  display: flex;
  justify-content: space-between;
  align-items: self-start;
  gap: 25px
}

.technology-logo .tech-slider {
  padding-top: 35px
}

.service-spectrum-level .services-content {
  padding-top: 35px
}

.slider-content-story img {
  width: 100%;
  max-width: 70px
}

.heartbeat.skyblue {
  bottom: 100px;
  top: unset;
  left: -80px
}

.heartbeat.darkblue {
  right: -170px;
  bottom: 130px;
  top: unset
}

.countValue.dots span {
  opacity: 1
}

.countValue.dots span img {
  width: 100%;
  max-width: 25px;
  position: relative;
  top: 5px
}

.productWhy_choose .value {
  padding: 20px 45px 20px 0
}

.btn {
  white-space: nowrap
}

.accordion-section .content-title {
  margin-left: 0
}

.outer-spec-wrapper {
  position: relative;
  z-index: 2
}

.tab-content img {
  width: 100%;
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
  text-align: right;
  z-index: 1;
  position: relative;
  border-radius: 15px
}

.images-card {
  text-align: right
}

.tabs-content-container .tab-content.active-tab {
  display: block;
  position: relative
}

.tabs-container {
  display: block;
  position: relative;
  left: 0
}

.tabs {
  background: #fff0;
  cursor: unset !important;
  border: none;
  border-radius: 3px;
  width: 100%;
  height: auto;
  margin: 0;
  padding-left: 0
}

.tabs-container .tabs.active-tab {
  background-color: #fff0;
  font-weight: 600
}

.tabs--loader {
  width: 2px;
  height: 30px;
  background-color: var(--primary_color);
  position: absolute;
  top: 12px;
  left: -4px;
  transform: scaleY(0);
  transform-origin: top;
  animation-name: line-loader;
  animation-timing-function: linear;
  border-radius: 5px
}

@keyframes line-loader {
  0% {
    transform: scaleY(0);
    transform-origin: top
  }

  100% {
    transform: scaleY(1);
    transform-origin: top
  }
}

button.tabs.active-tab {
  display: block
}

.cards-why-choose {
  display: flex;
  border-radius: 5px;
  transition: .3s ease-out;
  position: relative;
  border: none;
  padding: 10px 0;
  padding-left: 13px
}

.cards-why-choose h3 {
  font-size: 18px;
  font-weight: 700;
  line-height: 30px;
  color: #333;
  text-align: left
}

.tabs .why-choose-content .list-content {
  display: none
}

.why-choose-content ul li {
  font-weight: 300;
  list-style: none
}

.cards-why-choose p {
  font-weight: 300;
  line-height: 24px;
  color: #616161;
  margin: 0;
  padding: 16px 0;
  font-size: 16px;
  text-align: left
}

.why-choose-icon {
  margin-right: 5px;
  width: 10%
}

.why-choose-content {
  width: 90%;
  padding-left: 0;
  text-align: left
}

.tabs-container .tabs.active-tab .why-choose-content {
  padding-left: 0
}

.cards-why-choose .pbmit-contentbox {
  padding: 0;
  border: 0
}

.cards-why-choose .pbmit-static-box-style-1 .pbmit-ihbox-btn a::after {
  line-height: 50px;
  margin-left: 0;
  color: #b8bfc2
}

.tab-content {
  display: none
}

.tabs-content-container .tab-content.active-tab .images-card img {
  transition-duration: .2s
}

.tabs-container .tabs.active-tab .cards-why-choose .why-choose-content h3 {
  font-size: 22px;
  line-height: 32px;
  color: var(--primary_color)
}

.tabs-container .tabs .cards-why-choose .why-choose-content h3 {
  font-size: 21px;
  margin-bottom: 8px;
  font-weight: var(--font-weight4);
  color: var(--content);
  cursor: pointer
}

.tabs-content-slider p {
  font-size: 20px;
  color: var(--content);
  font-weight: var(--font-weight4);
  line-height: 26px
}

.tabs-content-slider .btn-primary-circle {
  justify-content: flex-start;
  margin-top: 14px;
  padding-left: 0;
  font-size: 14px
}

.images-card {
  position: relative;
  top: 50%;
  left: 0;
  width: 100%;
  animation: fadeInOut .9s linear
}

@keyframes fadeInOut {
  0% {
    opacity: 0;
    transform: translateY(100%)
  }

  50% {
    opacity: .5;
    transform: translateY(50%)
  }

  100% {
    opacity: 1;
    transform: translateY(0)
  }
}

.tabs-content-slider {
  position: relative;
  top: 50%;
  left: 55px;
  width: 100%;
  height: auto;
  animation: fadeInOut .9s linear;
  text-align: left;
  margin-top: 34px
}

@keyframes fadeInOut {
  0% {
    opacity: 0;
    transform: translateY(100%)
  }

  50% {
    opacity: .5;
    transform: translateY(50%)
  }

  100% {
    opacity: 1;
    transform: translateY(0)
  }
}

.content-tabs {
  display: flex;
  align-items: center;
  gap: 40px
}

.scrollFixed {
  background-color: #000;
  background-image: radial-gradient(at 77% 36%, hsla(311, 0%, 0%, .62) 0, transparent 50%), radial-gradient(at 0 6%, hsla(337, 71%, 49%, .57) 0, transparent 50%), radial-gradient(at 43% 59%, hsla(289, 0%, 0%, .34) 0, transparent 50%), radial-gradient(at 12% 93%, #1b0736 0, transparent 50%), radial-gradient(at 90% 90%, #1d073b 0, transparent 50%), radial-gradient(at 91% 9%, #5918a4 0, transparent 50%)
}

.wrapper {
  max-width: 1400px;
  margin: auto;
  position: relative
}

.scroller {
  display: flex
}

.images {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100vh
}

.images .image-block {
  position: absolute;
  top: 70px;
  right: 10%;
  width: 80%;
  height: 70%;
  overflow: hidden;
  opacity: 1;
  border-radius: 15px
}

.images .image-block img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: none
}

.images .first-image {
  opacity: 1
}

.texts {
  position: relative;
  width: 50%;
  margin-right: auto
}

.texts .text-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 100vh;
  padding: 105px 96px 96px 42px;
  box-sizing: border-box;
  border-left: 1px solid rgba(255, 255, 255, .15);
  border-right: 1px solid rgba(255, 255, 255, .15)
}

.texts .text-block p+p {
  margin-top: 2rem
}

.scrollFixed {
  padding: 140px 0 80px
}

.fixedScroll-content {
  max-width: 500px
}

.fixedScroll-tag span {
  padding: 5px 12px;
  border-radius: 50px;
  background: rgba(255, 255, 255, .1);
  color: var(--white);
  font-size: 14px
}

.fixedScroll-content h3 {
  font-size: var(--f50);
  line-height: 60px;
  color: var(--white);
  margin-bottom: 16px;
  font-weight: var(--font-weight4);
  margin-bottom: 40px
}

.fixedScroll-content p {
  font-size: 20px;
  font-weight: var(--font-weight4);
  color: var(--white);
  line-height: 34px
}

.fixedScroll-content a {
  justify-content: flex-start;
  margin-top: 64px
}

.fixedScroll-tag {
  margin-bottom: 32px
}

.wrapper {
  visibility: visible
}

.formcta {
  display: flex;
  justify-content: center;
  align-items: center
}

.select_form {
  position: relative
}

.select_form::after {
  content: '';
  background: url(/assets/img/svg/downArrow-white.svg) no-repeat;
  position: absolute;
  top: 24px;
  right: 26px;
  width: 14px;
  height: 7px
}

.field-duration label {
  margin-bottom: 20px !important
}

.banner-contentImg {
  max-width: 185px
}

.rotationBanner .banner-image {
  position: absolute;
  top: 0;
  right: 30px
}

.rotationBanner .inner-banner-content {
  top: 20px
}

.reveal {
  visibility: hidden;
  position: relative;
  overflow: hidden
}

.reveal img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transform-origin: left
}

.case-studiesBanner p {
  font-size: 32px;
  margin-top: 32px;
  max-width: 100%
}

.case-studyArrow {
  margin-top: 0;
  position: relative
}

.big-image {
  width: 100%;
  padding: 120px 0 0
}

.digital-content-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 14px
}

.objective-section {
  margin-top: -400px;
  padding: 400px 0 140px
}

.solution-wrapper h3 {
  color: #fff
}

.project-wrapper h2 {
  max-width: 100%;
  margin-bottom: 24px
}

.projectintro-content p {
  font-size: var(--f24);
  color: var(--black);
  line-height: 34px
}

.containerProduto .containerAround {
  display: flex
}

.containerProduto .containerAround .scrollGaleria {
  width: 50%;
  padding: 0
}

.containerProduto .containerAround .scrollGaleria img {
  padding-top: 5px;
  width: 100%;
  object-fit: cover
}

.containerProduto .containerAround .infoProduto {
  width: 50%;
  padding: 3rem 0 3rem 3rem;
  text-align: center
}

.containerProduto .containerAround .infoProduto .productHead {
  margin-top: 2rem
}

.containerProduto .containerAround .infoProduto .productHead h1 {
  font-weight: 700;
  font-size: 6rem;
  line-height: 1;
  color: #1e1e61
}

.containerProduto .containerAround .infoProduto .productHead p {
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1;
  color: #b6b6eb
}

.containerProduto .containerAround .infoProduto .productDescription {
  margin-top: 2rem
}

.containerProduto .containerAround .infoProduto .productDescription h4 {
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 21px;
  color: #b6b6eb
}

.containerProduto .containerAround .infoProduto .productDescription p {
  font-weight: 300;
  font-size: 1rem;
  line-height: 19px;
  color: #626273
}

.containerProduto .containerAround .infoProduto .productSpecification {
  margin-top: 2rem
}

.containerProduto .containerAround .infoProduto .productSpecification h4 {
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 21px;
  color: #b6b6eb
}

.containerProduto .containerAround .infoProduto .productSpecification ul {
  padding-top: 1rem
}

.containerProduto .containerAround .infoProduto .productSpecification li,
.containerProduto .containerAround .infoProduto .productSpecification ul {
  font-weight: 300;
  font-size: 1rem;
  line-height: 19px;
  color: #626273
}

.containerProduto .containerAround .infoProduto .productColors {
  margin-top: 2rem
}

.containerProduto .containerAround .infoProduto .productColors h4 {
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 21px;
  color: #b6b6eb
}

.containerProduto .containerAround .infoProduto .productColors .listaCores {
  padding-top: 1rem;
  display: flex;
  gap: 10px
}

.containerProduto .containerAround .infoProduto .productColors .listaCores .cor img {
  border-radius: 50%;
  width: 25px;
  height: 25px;
  object-fit: cover
}

.containerProduto .containerAround .infoProduto .productComponents {
  margin-top: 2rem
}

#infoProduto .solutionImg-wrapper {
  margin-top: 90px
}

.containerProdutoIsolado {
  height: 70vh;
  background-color: red
}

.center-content-banner {
  max-width: 1170px;
  left: 0;
  right: 0;
  margin: auto;
  padding: 0 15px
}

.portfolio-details {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 80px
}

.portfolio-cta {
  text-align: right
}

.portfolio-banner {
  width: 100%;
  left: 0
}

.portfolio-btn .button {
  border: none;
  font-size: 20px;
  margin: 0 15px;
  font-weight: var(--font-weight4);
  color: var(--main-black);
  cursor: pointer;
  background-color: transparent;
  position: relative;
  padding-bottom: 15px
}

.portfolio-btn .button.is-checked,
.portfolio-btn .button:hover {
  color: var(--link-blue);
  font-weight: var(--font-weight5)
}

.portfolio-btn .button:after {
  position: absolute;
  content: '';
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 0;
  height: 2px;
  background-color: var(--link-blue);
  transition-duration: .4s
}

.portfolio-btn .button.is-checked:after,
.portfolio-btn .button:hover:after {
  width: 100%
}

.grid .portfolio-single-wrapper .tag-wrapper {
  left: 18px
}

.sticky-nav-tabs {
  background-color: transparent
}

.slider-caseStudies .swiper-wrapper {
  margin-left: 100px
}

.m-casestudies .header h2.title-f60 {
  color: var(--white)
}

.m-casestudies .portfolio-heading .splitting .char:after,
.m-casestudies .splitting .char:after {
  color: var(--white) !important
}

.case-slider::before {
  content: '';
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 650px
}

.word-txt1 .title {
  color: #ffd166;
  text-transform: uppercase;
  line-height: 6vw
}

@-webkit-keyframes can {
  0% {
    transform: translateY(0)
  }

  26.6666666667% {
    transform: translateY(0);
    opacity: 1
  }

  33.3333333333% {
    transform: translateY(-100%);
    opacity: 0
  }

  33.3343333333% {
    transform: translateY(100%);
    opacity: 0
  }

  33.3363333333% {
    transform: translateY(100%);
    opacity: 1
  }

  93.3333333333% {
    transform: translateY(100%)
  }

  100% {
    transform: translateY(0)
  }
}

@keyframes can {
  0% {
    transform: translateY(0)
  }

  26.6666666667% {
    transform: translateY(0);
    opacity: 1
  }

  33.3333333333% {
    transform: translateY(-100%);
    opacity: 0
  }

  33.3343333333% {
    transform: translateY(100%);
    opacity: 0
  }

  33.3363333333% {
    transform: translateY(100%);
    opacity: 1
  }

  93.3333333333% {
    transform: translateY(100%)
  }

  100% {
    transform: translateY(0)
  }
}

@-webkit-keyframes will {
  0% {
    transform: translateY(0)
  }

  26.6666666667% {
    transform: translateY(0)
  }

  33.3333333333% {
    transform: translateY(-100%)
  }

  60% {
    transform: translateY(-100%);
    opacity: 1
  }

  66.6666666667% {
    transform: translateY(-200%);
    opacity: 0
  }

  66.6676666667% {
    transform: translateY(0)
  }

  66.6696666667% {
    transform: translateY(0);
    opacity: 1
  }

  100% {
    transform: translateY(0)
  }
}

@keyframes will {
  0% {
    transform: translateY(0)
  }

  26.6666666667% {
    transform: translateY(0)
  }

  33.3333333333% {
    transform: translateY(-100%)
  }

  60% {
    transform: translateY(-100%);
    opacity: 1
  }

  66.6666666667% {
    transform: translateY(-200%);
    opacity: 0
  }

  66.6676666667% {
    transform: translateY(0)
  }

  66.6696666667% {
    transform: translateY(0);
    opacity: 1
  }

  100% {
    transform: translateY(0)
  }
}

@-webkit-keyframes thrive {
  0% {
    transform: translateY(-300%)
  }

  0.0001% {
    transform: translateY(0)
  }

  26.6666666667% {
    transform: translateY(0)
  }

  33.3333333333% {
    transform: translateY(-100%)
  }

  60% {
    transform: translateY(-100%)
  }

  66.6666666667% {
    transform: translateY(-200%)
  }

  93.3333333333% {
    transform: translateY(-200%);
    opacity: 1
  }

  100% {
    transform: translateY(-300%);
    opacity: 0
  }
}

@keyframes thrive {
  0% {
    transform: translateY(-300%)
  }

  0.0001% {
    transform: translateY(0)
  }

  26.6666666667% {
    transform: translateY(0)
  }

  33.3333333333% {
    transform: translateY(-100%)
  }

  60% {
    transform: translateY(-100%)
  }

  66.6666666667% {
    transform: translateY(-200%)
  }

  93.3333333333% {
    transform: translateY(-200%);
    opacity: 1
  }

  100% {
    transform: translateY(-300%);
    opacity: 0
  }
}

.word {
  display: flex;
  grid-column: 2;
  grid-row: auto
}

.word span {
  display: inline-block
}

.can span:first-child {
  -webkit-animation: can 10s ease-in-out both 50ms infinite;
  animation: can 10s ease-in-out both 50ms infinite
}

.will span:first-child {
  -webkit-animation: will 10s ease-in-out both 50ms infinite;
  animation: will 10s ease-in-out both 50ms infinite
}

.thrive span:first-child {
  -webkit-animation: thrive 10s ease-in-out both 50ms infinite;
  animation: thrive 10s ease-in-out both 50ms infinite
}

.can span:nth-child(2) {
  -webkit-animation: can 10s ease-in-out both .1s infinite;
  animation: can 10s ease-in-out both .1s infinite
}

.will span:nth-child(2) {
  -webkit-animation: will 10s ease-in-out both .1s infinite;
  animation: will 10s ease-in-out both .1s infinite
}

.thrive span:nth-child(2) {
  -webkit-animation: thrive 10s ease-in-out both .1s infinite;
  animation: thrive 10s ease-in-out both .1s infinite
}

.can span:nth-child(3) {
  -webkit-animation: can 10s ease-in-out both .15s infinite;
  animation: can 10s ease-in-out both .15s infinite
}

.will span:nth-child(3) {
  -webkit-animation: will 10s ease-in-out both .15s infinite;
  animation: will 10s ease-in-out both .15s infinite
}

.thrive span:nth-child(3) {
  -webkit-animation: thrive 10s ease-in-out both .15s infinite;
  animation: thrive 10s ease-in-out both .15s infinite
}

.can span:nth-child(4) {
  -webkit-animation: can 10s ease-in-out both .2s infinite;
  animation: can 10s ease-in-out both .2s infinite
}

.will span:nth-child(4) {
  -webkit-animation: will 10s ease-in-out both .2s infinite;
  animation: will 10s ease-in-out both .2s infinite
}

.thrive span:nth-child(4) {
  -webkit-animation: thrive 10s ease-in-out both .2s infinite;
  animation: thrive 10s ease-in-out both .2s infinite
}

.can span:nth-child(5) {
  -webkit-animation: can 10s ease-in-out both .25s infinite;
  animation: can 10s ease-in-out both .25s infinite
}

.will span:nth-child(5) {
  -webkit-animation: will 10s ease-in-out both .25s infinite;
  animation: will 10s ease-in-out both .25s infinite
}

.thrive span:nth-child(5) {
  -webkit-animation: thrive 10s ease-in-out both .25s infinite;
  animation: thrive 10s ease-in-out both .25s infinite
}

.can span:nth-child(6) {
  -webkit-animation: can 10s ease-in-out both .3s infinite;
  animation: can 10s ease-in-out both .3s infinite
}

.will span:nth-child(6) {
  -webkit-animation: will 10s ease-in-out both .3s infinite;
  animation: will 10s ease-in-out both .3s infinite
}

.thrive span:nth-child(6) {
  -webkit-animation: thrive 10s ease-in-out both .3s infinite;
  animation: thrive 10s ease-in-out both .3s infinite
}

.can span:nth-child(7) {
  -webkit-animation: can 10s ease-in-out both .35s infinite;
  animation: can 10s ease-in-out both .35s infinite
}

.will span:nth-child(7) {
  -webkit-animation: will 10s ease-in-out both .35s infinite;
  animation: will 10s ease-in-out both .35s infinite
}

.thrive span:nth-child(7) {
  -webkit-animation: thrive 10s ease-in-out both .35s infinite;
  animation: thrive 10s ease-in-out both .35s infinite
}

.can span:nth-child(8) {
  -webkit-animation: can 10s ease-in-out both .4s infinite;
  animation: can 10s ease-in-out both .4s infinite
}

.will span:nth-child(8) {
  -webkit-animation: will 10s ease-in-out both .4s infinite;
  animation: will 10s ease-in-out both .4s infinite
}

.thrive span:nth-child(8) {
  -webkit-animation: thrive 10s ease-in-out both .4s infinite;
  animation: thrive 10s ease-in-out both .4s infinite
}

.can span:nth-child(9) {
  -webkit-animation: can 10s ease-in-out both .45s infinite;
  animation: can 10s ease-in-out both .45s infinite
}

.will span:nth-child(9) {
  -webkit-animation: will 10s ease-in-out both .45s infinite;
  animation: will 10s ease-in-out both .45s infinite
}

.thrive span:nth-child(9) {
  -webkit-animation: thrive 10s ease-in-out both .45s infinite;
  animation: thrive 10s ease-in-out both .45s infinite
}

.can span:nth-child(10) {
  -webkit-animation: can 10s ease-in-out both .5s infinite;
  animation: can 10s ease-in-out both .5s infinite
}

.will span:nth-child(10) {
  -webkit-animation: will 10s ease-in-out both .5s infinite;
  animation: will 10s ease-in-out both .5s infinite
}

.thrive span:nth-child(10) {
  -webkit-animation: thrive 10s ease-in-out both .5s infinite;
  animation: thrive 10s ease-in-out both .5s infinite
}

.title {
  display: grid;
  grid-template-columns: repeat(2, -webkit-max-content);
  grid-template-columns: repeat(2, max-content);
  grid-template-rows: auto;
  overflow: hidden;
  max-height: 5vw
}

.center-content-banner p {
  font-size: 22px;
  max-width: 720px;
  line-height: 24px
}

.key-hights {
  padding-right: 50px
}

.keypoints {
  gap: 32px
}

.key-blocks p {
  font-size: 18px;
  line-height: 1.3
}

.solutions-formblock {
  padding-left: 50px
}

.engage-content h4,
.solutions-form h4 {
  font-size: var(--f22);
  font-weight: var(--font-weight5)
}

.solutions-form {
  box-shadow: rgba(0, 0, 0, .1) 0 0 21px;
  padding: 50px;
  border-radius: 15px
}

.keyfocus-section {
  background-color: var(--primary_color)
}

.keyfocus-section .keys {
  padding: 20px 60px 20px 20px
}

.box {
  counter-increment: item
}

.box::before {
  content: counter(item);
  content: '0' counter(item) '/';
  content: counter(item) < 10 ? '0' counter(item): counter(item);
  color: rgba(255, 255, 255, .5)
}

.focus-content h4 {
  line-height: 1
}

.keyfocus-section p {
  color: rgba(255, 255, 255, .7)
}

.syndicates-desc {
  border-top: 1px solid var(--border-color);
  position: relative
}

.pie-wrap {
  height: 3px;
  width: 0;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  background-color: var(--primary_color)
}

.ready_start_item-syndicates.active .pie-wrap {
  animation: 2.5s spin linear 0s forwards
}

@keyframes spin {
  from {
    width: 0
  }

  to {
    width: 100%
  }
}

.ways-to-engage .title-f60 {
  max-width: 100%;
  margin-bottom: 50px
}

.ways-to-engage .horizontal .item {
  flex-direction: row;
  flex: 0 0 1440px;
  max-width: 1440px;
  align-items: center
}

.ways-to-engage .engaged-boxImg {
  flex: 0 0 440px;
  max-width: 440px;
  margin-right: 139px
}

.ways-to-engage .engagedContent h4 {
  font-size: 28px;
  font-weight: var(--font-weight5);
  margin-bottom: 16px
}

.ways-to-engage .engagedContent p {
  font-size: 20px;
  font-weight: 300;
  color: rgba(0, 0, 0, .7);
  line-height: 28px
}

.human-cloudSec .splitting .char:after,
.human-cloudSec .title-f60 {
  color: var(--white)
}

.humanCloud-focusArea .splitting .char:after,
.humanCloud-focusArea .title-f60 {
  color: var(--black)
}

.ways-to-engage.challenge-wrapper .pin-wrap::before {
  display: none
}

.engagedContent .engaged-btn {
  margin-top: 22px
}

.engagedContent .engaged-btn .btn {
  justify-content: flex-start
}

.engagedContent {
  flex: 0 0 550px;
  max-width: 550px
}

.blog-detail {
  padding: 20px
}

.blog-tag {
  color: var(--primary_color);
  padding: 5px 15px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: var(--font-weight5);
  z-index: 1;
  background-color: rgba(49, 78, 123, .1);
  text-transform: uppercase
}

.blog-tag:not(:last-child) {
  margin-right: 16px
}

.blog-detail h4 {
  font-size: 28px;
  font-weight: var(--font-weight4);
  line-height: 1.3
}

.blog-detail p {
  font-size: 18px;
  color: #707070;
  line-height: 1.4
}

.swiper-pagination .swiper-pagination-bullet {
  background: 0 0;
  border: none
}

.swiper-pagination .swiper-pagination-bullet:not(:last-child) {
  margin-right: 35px !important
}

.swiper-pagination span.swiper-pagination-bullet::after {
  content: '';
  position: absolute;
  bottom: -20px;
  left: 0;
  height: 1px;
  width: 50px;
  background: rgba(0, 0, 0, .2);
  z-index: 7;
  top: auto !important
}

.swiper-pagination-bullet b {
  position: absolute;
  bottom: -21px;
  left: 0;
  z-index: 8;
  width: 0;
  height: 3px;
  background-color: #333
}

.swiper-pagination-bullet-active b {
  animation-name: countingBar;
  animation-duration: 5s;
  animation-timing-function: ease-in;
  animation-iteration-count: 1;
  animation-direction: alternate;
  animation-fill-mode: forwards
}

@keyframes countingBar {
  0% {
    width: 0
  }

  100% {
    width: 50px
  }
}

.career-title {
  max-width: 560px
}

.great-place-career p {
  font-size: var(--f40);
  font-weight: 300;
  line-height: 1.1
}

.solutions-formblock label {
  color: var(--content);
  font-size: 15px;
  margin-bottom: 5px;
  margin-left: 10px
}

.solutions-formblock .form-control {
  padding: 13px 20px !important;
  height: 50px
}

.solutions-formblock textarea.form-control {
  height: 90px;
  border-radius: 15px
}

.form-select {
  border-radius: 60px
}

button.uploadCustom {
  padding: 13px 20px;
  width: 100%;
  border-radius: 45px;
  background-color: var(--white);
  text-align: left;
  color: #757d85;
  border: 1px solid #ced4da
}

.addMore-field .btn {
  color: var(--blue)
}

.step-container {
  position: relative;
  text-align: center;
  transform: translateY(-43%)
}

.step-circle {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid #007bff;
  line-height: 30px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  cursor: pointer
}

.step-line {
  position: absolute;
  top: 16px;
  left: 50px;
  width: calc(100% - 100px);
  height: 2px;
  background-color: #007bff;
  z-index: -1
}

#multi-step-form {
  overflow-x: hidden
}

.why-join-wrapper header {
  margin-bottom: 80px
}

.joinBox-content h3 {
  margin: 16px 0 16px;
  font-size: 28px;
  font-weight: var(--font-weight5);
  line-height: 32px
}

.joinBox-content p {
  font-size: var(--f20);
  line-height: 26px;
  font-weight: var(--font-weight4)
}

.joinSingle-box {
  max-width: 365px
}

.joiningForm-wrapper {
  margin: 120px auto 0;
  max-width: 1200px;
  width: 100%;
  padding: 56px 76px;
  box-shadow: 0 3px 50px #0000001A;
  border-radius: 15px
}

.multiForm-heading h3 {
  text-align: center
}

.joiningForm-wrapper .progress,
.step-container {
  display: none !important
}

.multiForm-heading {
  margin-bottom: 48px
}

.form-actionCTA {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 56px
}

.joiningForm-wrapper .form-group {
  margin-bottom: 24px
}

.joiningForm-wrapper .form-group label {
  margin-left: 20px
}

.joiningForm-wrapper .form-group .form-control,
.joiningForm-wrapper .form-select {
  margin-top: 8px;
  height: 60px
}

.more-field {
  color: var(--blue);
  font-size: var(--f14)
}

.more-field:last-of-type {
  margin-top: 10px
}

.mobile-hide {
  margin-top: 46px
}

.delete-field svg {
  max-width: 15px
}

.delete-field {
  color: red
}

.drop-zone {
  max-width: 100%;
  height: 200px;
  padding: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 20px;
  cursor: pointer;
  color: #ccc;
  border: 1px dashed #ced4da;
  border-radius: 15px
}

.drop-zone__input {
  display: none
}

.drop-zone__thumb {
  width: 100%;
  height: 100%;
  border-radius: 15px;
  overflow: hidden;
  background-color: #ccc;
  background-size: cover;
  position: relative
}

.drop-zone__thumb::after {
  content: attr(data-label);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 5px 0;
  color: #fff;
  background: rgba(0, 0, 0, .75);
  font-size: 14px;
  text-align: center
}

.clutch-rating {
  margin: 50px 0 0 96px
}

.human-cloud-header {
  padding: 24px 0 !important
}

.formBtn .btn-primary-circle i {
  position: absolute;
  top: 2px;
  left: inherit;
  right: 75px;
  display: flex;
  align-items: center;
  justify-content: center
}

.banner-content-img .col-lg-10 {
  flex: 0 0 100%;
  width: 100%
}

.inner-section.errorbanner {
  padding-bottom: 0 !important
}

.inner-banner-content.error-banner-content .inner-content,
.inner-banner-content.error-banner-content .inner-content p {
  text-align: left;
  margin: 0
}

.inner-banner-content.error-banner-content h1 {
  text-transform: uppercase
}

.inner-banner-content.error-banner-content h1.title-f60 {
  max-width: 100%
}

.inner-banner-content.error-banner-content p {
  font-size: 20px;
  line-height: 26px;
  color: var(--content);
  max-width: 450px
}

.result-impactImg {
  margin-bottom: 32px
}

.result-impactContent h4 {
  margin-bottom: 16px !important
}

.recimg-container img {
  border-radius: 15px
}

.solutionImg-wrapper.recimg-container img {
  border-radius: 0
}

.banner-contentImg .recimg-container.text-center {
  text-align: left !important;
  border-radius: 0 !important;
  clip-path: none !important
}

.banner-contentImg .recimg-container.text-center img {
  border-radius: 0
}

.blog-btn a.btn {
  justify-content: flex-start !important
}

.nav-item.contact {
  padding-right: 0 !important
}

.singleFixed-sec .texts .text-block {
  min-height: 90vh
}

.m-casestudies .portfolio-heading p {
  color: var(--white)
}

.sticky-nav-tabs {
  display: none !important
}

label .error {
  color: #ff1f1f
}

.human-cloudSec .key-hights .keypoint-img img {
  max-width: 48px
}

.solution-singleContent ul {
  list-style: disc;
  padding-left: 16px;
  margin-top: 16px
}

.solution-singleContent ul li {
  margin-bottom: 10px;
  line-height: 24px;
  color: var(--white);
  opacity: .7
}

.thank-you-wrapper {
  background: var(--primary_color)
}

.thankYou-outer {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh
}

.thankYou-outer .thanyou-content {
  max-width: 570px;
  margin: 0 auto;
  text-align: center;
  color: var(--white)
}

.thanyou-content h1 {
  font-size: 80px;
  font-weight: var(--font-weight5);
  text-transform: uppercase;
  margin-bottom: 40px
}

.thanyou-content p {
  font-size: 28px;
  line-height: 36px;
  opacity: .7
}

.actionBTN {
  gap: 48px;
  margin-top: 40px
}

.actionBTN .thankyou-action a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px
}

.actionBTN .thankyou-action h2 {
  font-size: var(--f16)
}

.case-studiesBanner h1.banner-title,
.info-intro {
  max-width: 800px
}

#contactPage {
  scroll-margin: 400px;
  border-top: 1px solid rgba(0, 0, 0, .1)
}

.home-mainBanner {
  display: flex;
  align-items: center;
}

.home-mainBanner .banner_image {
  position: absolute;
  top: 66px
}

.contact-socials ul li img {
  padding: 1px;
  border-radius: 50px
}

#cookie-banner {
  background-color: var(--link-blue);
  padding: 20px 0;
  color: var(--white);
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 999 !important
}

#cookie-banner .cokkie-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px
}

.cokkie-content a {
  text-decoration: underline
}

.cokkie-content p {
  font-size: 14px;
  line-height: 1.4
}

.cokkie-btn {
  display: flex;
  gap: 20px
}

.cokkie-btn .btn {
  background-color: var(--white);
  color: var(--link-blue);
  border-radius: 50px;
  padding: 10px 16px;
  font-size: 14px
}

.g-recaptcha {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px
}

.engaged-boxImg img {
  border-radius: 15px
}

.the-human-cloud .portfolio-details {
  padding-top: 0
}

.the-human-cloud h1.banner-title {
  margin-top: 0
}

.result-impactImg img {
  height: 65px
}

.challengeBox-img img {
  height: 55px
}

.countValue.dots {
  max-width: 20px;
  width: 100%
}

.tel-col {
  display: flex;
  align-items: center;
  gap: 20px
}

.tel-col .form-control1,
.tel-col select {
  border: 0
}

select:focus-visible {
  outline: 0
}

.menu-toggle {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: var(--link-blue);
  box-shadow: 4px 4px 2px 1px rgba(0, 0, 0, .2);
  position: absolute;
  z-index: 5;
  bottom: 30px;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center
}

.menu-toggle .fa {
  color: #fff;
  font-size: 2em;
  display: inline-block;
  vertical-align: middle;
  transition: .4s;
  cursor: pointer;
  margin: 14px 0;
  max-width: 24px
}

.menu-toggle.open .fa {
  transform: rotate(180deg)
}

.btn-app {
  width: 330px;
  border-radius: 25px;
  position: absolute;
  background-color: var(--link-blue);
  color: #fff;
  text-align: center
}

.btn-app .fa {
  line-height: 2.5em
}

.open .btn-app {
  box-shadow: 4px 4px 2px 1px rgba(0, 0, 0, .2)
}

.menu-line {
  position: absolute;
  z-index: 2
}

.menu-line .btn-app {
  bottom: 0;
  right: 0;
  transition: .3s;
  transition-delay: 0.5s
}

.menu-line.open .btn-app {
  bottom: 100px
}

.mobileFixed-btn .btn-app img {
  max-width: 24px;
  width: 100%;
  height: 100%;
  margin: 0 auto
}

.mobileFixed-btn .popup-wrapper {
  padding: 32px
}

.singlePopup.social a {
  width: 100%
}

.singlePopup,
.singlePopup.social a {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.singlePopup:not(:last-child) {
  margin-bottom: 28px
}

.mobileFixed-btn .popup-left {
  gap: 15px
}

.menu-line {
  opacity: 0;
  visibility: hidden;
  display: none
}

.menu-line.open {
  opacity: 1;
  visibility: visible;
  display: block
}

.menu-toggle .fa-close {
  display: none
}

.menu-toggle.open .fa {
  display: none
}

.menu-toggle.open .fa-close {
  display: block;
  max-width: 20px
}

.bootstrap-select .dropdown-item.active,
.bootstrap-select .dropdown-item:active,
.bootstrap-select .dropdown-menu li a span.text,
.bootstrap-select.show-tick .dropdown-menu li a span.text {
  color: #757d85;
  opacity: 1
}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  height: auto;
  padding: 5px 15px
}

.bootstrap-select .btn-light {
  background-color: transparent;
  border-color: transparent;
  padding: 0
}

.bootstrap-select .dropdown-toggle.btn-light:focus:focus {
  outline: 0 !important;
  box-shadow: none
}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 65px !important;
  padding: 0
}

.bootstrap-select .dropdown-menu {
  width: 220px
}

.bootstrap-select .dropdown-menu .inner.show {
  overflow-x: hidden;
  max-height: 130px !important
}

.bootstrap-select .dropdown-menu.show {
  max-height: 200px !important
}

.bootstrap-select .dropdown-menu.show .dropdown-item.active {
  background-color: var(--link-blue) !important
}

.bootstrap-select .dropdown-menu.show .dropdown-item.active span {
  color: var(--white);
  opacity: 1
}

.form-control.b_services .dropdown.bootstrap-select {
  width: 100% !important
}

.dropdown-toggle::after {
  display: none !important
}

.bs-searchbox input {
  height: 36px !important;
  padding: 10px !important
}

.bootstrap-select .dropdown-toggle .filter-option {
  position: relative !important
}

.tel-col .filter-option::after {
  content: '';
  position: absolute;
  top: 7px;
  background: url(/assets/img/svg/downArrow-white.svg) no-repeat !important;
  width: 14px;
  height: 7px;
  z-index: 2;
  right: 5px
}

.select_form:hover::after {
  background: url(/assets/img/svg/downArrow-white.svg) no-repeat
}

#contactPage .select_form .bootstrap-select .dropdown-toggle .filter-option {
  top: -4px
}

.accordion-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%
}

.accordion-open ul {
  max-height: 0;
  overflow: hidden;
  transition: max-height 1s ease-out 0s;
  display: block
}

.singlePopup1 {
  margin-bottom: 12px !important
}

.callOption {
  cursor: pointer
}

.callOption ul {
  margin-top: 16px
}

.callOption.open ul {
  height: auto;
  max-height: 500px;
  transition: max-height 1s ease-in 0s !important;
  display: block;
  margin-bottom: 16px
}

.callOption ul li:not(:last-child) {
  margin-bottom: 16px
}

.popup-right img {
  transition: all .3s ease-in-out
}

.callOption.open .popup-right img {
  transform: rotate(90deg)
}

.inner-banner-content .inner-content .banner-subtitle {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 25px
}

@media all and (max-width:767px) {

  .businessEnquiry p,
  .list-content p,
  .marker-img {
    height: auto !important
  }

  .tel-col {
    gap: 5px
  }
}

.app-devMain .title-f60 {
  max-width: 100%
}

.app-devMain .container {
  position: absolute;
  top: 135px;
  left: 0;
  right: 0
}

.app-devMain header .title-f60 {
  font-size: 74px;
  line-height: 75px;
  margin-bottom: 24px;
  color: var(--black)
}

.app-devMain header p {
  font-size: 18px;
  line-height: 24px
}

.app-devMain .banner-cta {
  margin-left: 10px
}

.app-devMain .solutions-formblock form .form-group {
  margin-bottom: 20px
}

.app-devMain .solutions-formblock form .form-group input,
.app-devMain .solutions-formblock form .form-group select {
  height: 60px;
  border-radius: 50px
}

.app-devMain .solutions-formblock .solutions-form {
  max-width: 460px;
  margin: 0 auto
}

.bg-light {
  background: #e5f0f8
}

.bg-light h3.title-f60 {
  color: var(--black) !important
}

.bg-light.productWhy_choose .content-title p {
  color: var(--black)
}

.bg-light.productWhy_choose .why-chosse-card .splitting .char:after,
.bg-light.productWhy_choose .why-chosse-card h4,
.bg-light.productWhy_choose .why-chosse-card p {
  color: var(--black) !important
}

.bg-light.productWhy_choose .why-chosse-card img {
  filter: none
}

.tel-col .tel-number input {
  width: 100%;
  height: auto !important;
  background: 0 0
}

.select_form .bootstrap-select .dropdown-toggle .filter-option {
  top: -3px
}

.thankyou-wrapper {
  padding: 200px 0 100px
}

.thankyou-wrapper .thanyou-content {
  max-width: 690px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center
}

.thankyou-wrapper .thanyou-content h1 {
  font-size: 68px;
  font-weight: 600;
  color: var(--link-blue)
}

.thankyou-wrapper .thanyou-content p {
  color: #333;
  opacity: 1
}

.thankyou-wrapper .social-wrapper ul {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%
}

.thankyou-social {
  margin-top: 64px
}

.thankyou-social p {
  font-size: 24px;
  opacity: .7 !important
}

.thankyou-social .social-wrapper ul li a span {
  text-transform: uppercase;
  letter-spacing: 2px
}

.you-are-here {
  background: #0171b5;
  padding: 100px 0;
  color: var(--white)
}

.you-are-here h2 {
  margin-bottom: 24px
}

.you-are-here h2,
.you-are-here h2.splitting .char:after {
  color: var(--white)
}

.you-are-here header p {
  font-size: 24px;
  opacity: .7
}

.you-are-content {
  max-width: 390px
}

.you-are-content h3 {
  font-size: 28px;
  font-weight: 500;
  margin: 24px 0 16px
}

.you-are-content p {
  font-size: 20px;
  line-height: 28px;
  opacity: .7
}

.banner-bullets {
  margin-top: 24px
}

.banner-bullets ul {
  padding-left: 18px;
  margin-top: 16px
}

#appDev-form .banner-bullets .banner-points p.list-bullet {
  background-color: #f5fafd;
  border-radius: 22px;
  padding: 13px 25px;
  line-height: normal !important;
  color: var(--link-blue);
  font-size: 18px;
  font-weight: 400
}

.banner-points .col-md-6:not(:last-child) p {
  margin-bottom: 10px
}

.banner-points p img {
  max-width: 12px;
  height: 8px !important;
  margin-right: 14px
}

.linkedSec-img-des {
  background: url('/assets/img/linkedImg-desktop.webp') no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 28px;
  padding: 56px 77px
}

.linkedSec-img-des .header h3 {
  margin-bottom: 20px;
  color: var(--link-blue);
  font-weight: 500;
  font-size: 50px;
  line-height: 60px
}

.linkedSec-img-des .header h3 span {
  color: var(--link-blue)
}

.linkedSec-img-des .header p {
  font-size: 20px;
  font-weight: 500;
  line-height: 26px
}

.linkedSec-img-des .ctaAction {
  margin-top: 28px
}

.linkedSec-img-des .ctaAction a {
  justify-content: flex-start;
  width: fit-content
}


video {
  clip-path: inset(0)
}

.banner_image video {
  clip-path: inset(0);
  mix-blend-mode: screen
}

.inner-banner-content.banner-solutions {
  position: relative;
  top: 30px
}

.new-portPage .inner-banner-content.banner-solutions {
  position: relative;
  top: 15px
}

.inner-banner-content h1.banner-title .highlight-heading .char:after {
  color: #017dd7
}

.solution-banner-img {
  position: absolute;
  top: -140px;
  right: -275px
}

.solution-cta {
  display: flex;
  gap: 42px
}

.client-logos-section {
  background-color: var(--link-blue)
}

.client-logos-section .heading {
  font-size: 26px
}

.solution-clientele {
  background-color: #f8f8f8
}

.solutions-formblock textarea.form-control {
  border-radius: 8px !important
}

.key-functions {
  padding: 30px 35px 30px 35px;
  height: 100%;
  position: relative;
  border-radius: 15px;
  background: #fffFFF1A 0 0 no-repeat padding-box;
  border: 1px solid #fffFFF33;
  min-height: 360px
}

.key-functions .focusBtn {
  position: absolute;
  bottom: 30px;
  left: 35px
}

.focusArea-Box .swiper-wrapper {
  margin-bottom: 60px
}

.focusArea-Box .swiper-pagination .swiper-pagination-bullet {
  background: rgba(255, 255, 255, .5)
}

.focusArea-Box .swiper-pagination .swiper-pagination-bullet-active {
  background: var(--white)
}

.solutionContct.forthLevel .row {
  align-items: center !important
}

.key-functions .btn-primary-circle {
  justify-content: flex-start
}

.key-functions h4 {
  margin: 24px 0 16px;
  font-size: 32px;
  font-weight: var(--font-weight4);
  color: var(--white)
}

.key-functions p {
  font-size: 20px;
  font-weight: var(--font-weight4);
  line-height: 26px;
  color: rgba(255, 255, 255, .7)
}

.key-functions .splitting .char {
  color: var(--black);
  font-size: 22px
}

.key-functions .section-btn {
  position: absolute;
  bottom: 20px
}

.solutionWhy_choose {
  background-image: url(/assets/img/solution-pages/neurotal/whychoose-star-icon.webp);
  background-repeat: no-repeat;
  background-size: 35%;
  background-position: right -25% center
}

.solutionWhy_choose p {
  color: rgba(0, 0, 0, .7);
  font-size: 20px;
  line-height: 26px
}

.solution-dash-cta {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  display: flex;
  justify-content: flex-end;
  padding: 30px 90px;
  position: relative;
  border-radius: 15px;
  position: relative
}

.solution-dash-cta::before {
  content: '';
  position: absolute;
  top: -70px;
  left: 0;
  background: url('/assets/img/solution-pages/neurotal/neurotelStar.png') no-repeat;
  width: 270px;
  height: 270px
}

.sol-inner-cta {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 100px
}

.cta-title {
  font-size: 26px
}

.solution-opening {
  background-image: url(/assets/img/solution-pages/neurotal/star-icon.webp);
  background-repeat: no-repeat;
  background-size: 35%;
  background-position: right -15% center
}

.current-opening.solution-opening .header .section-title span {
  height: auto;
  color: var(--black)
}

.current-opening.solution-opening .section-title {
  color: var(--black)
}

.background-blue {
  background-color: #000;
  background-image: radial-gradient(at 26% 13%, #070108 0, transparent 50%), radial-gradient(at 35% 52%, #000 0, transparent 50%), radial-gradient(at 0 0, #0b2183 0, transparent 50%), radial-gradient(at 81% 65%, #000 0, transparent 50%), radial-gradient(at 8% 71%, #030d39 0, transparent 50%), radial-gradient(at 60% 6%, #050623 0, transparent 50%), radial-gradient(at 99% 100%, #580d56 0, transparent 50%);
  padding-bottom: 220px !important;
  padding-top: 85px
}

.background-blue .breadcrumb-item a,
.background-blue .breadcrumb-item span {
  color: #fff
}

.background-blue .banner-cta .btn {
  padding: 12px 24px;
  color: #fff;
  font-size: 18px
}

.background-blue .inner-banner-content h1.banner-title,
.background-blue .splitting .char:after {
  color: #fff;
  font-size: 54px;
  line-height: 70px
}

.inner-content-row {
  margin-top: 50px
}

.background-blue .inner-banner-content h1.banner-title {
  margin-top: 0
}

.banner-content-img.banimg-content {
  margin-top: -150px
}

.background-blue .btn-primary-circle i {
  color: #fff;
  border: 1px solid var(--white)
}

.baner-rightContent {
  display: flex;
  justify-content: flex-end
}

.technology-logo {
  display: none
}

.key-functions img {
  height: 65px
}

.banimg-container img {
  border-radius: 15px
}

.thumbLogo {
  max-width: 240px;
  width: 100%;
  margin-bottom: 24px
}

.neuroCRM-thumbLogo {
  max-width: 140px
}

.signedgeThumb {
  max-width: 180px;
  height: 26px
}

.thumbLogo img {
  width: 100% !important;
  height: 100% !important
}

.bg-humanSec {
  background: var(--black)
}

.human-cloudSec.bg-humanSec .solutions-form {
  background: var(--white)
}

.humanCloud-focusArea {
  padding-bottom: 0 !important
}

.humanCloud-focusArea p {
  font-size: var(--f20)
}

.humanCloud-focusArea .key-functions p {
  color: rgba(0, 0, 0, .7);
  font-size: var(--f20) !important
}

.bg-humanSec .btn-white-circle:hover i {
  background-color: transparent
}

.human-cloudSec.bg-humanSec {
  background-image: url('/assets/img/solution-pages/human-cloud/humanCloud-pattern.webp');
  background-size: 25%;
  background-position: right -6% center !important
}

.humanCloud-focusArea {
  background-image: url('/assets/img/solution-pages/human-cloud/humanCloud-white-pattern.webp');
  background-size: 25% !important;
  background-position: right -6% center !important
}

.neuroCRM-bg {
  background-image: url('/assets/img/solution-pages/neuroCRM/neuroCRM-pattern.webp');
  background-position: right -3% center !important;
  background-size: 25% !important
}

.pos-right {
  color: #fff;
  background-repeat: no-repeat;
  background-size: auto;
  background-position: right -15% center
}

.neuropattern {
  background-image: url('/assets/img/solution-pages/neuroCRM/neuro-pattern2.webp');
  background-size: 25%;
  background-position: right -3% center
}

.technology-logo.focus-area {
  display: block
}

.nitro-pattern {
  background-image: none
}

.faqSec header h2 {
  max-width: 100%;
  text-align: center;
  padding-bottom: 64px
}

.faqSec .faq-contentWrapper .accordion {
  box-shadow: none;
  padding: 0
}

.faqSec .faq-contentWrapper .accordion .accordion-item {
  border: none
}

.faqSec .faq-contentWrapper .accordion .accordion-item:not(:last-child) {
  margin-bottom: 24px
}

.accordion-button:not(.collapsed) {
  box-shadow: none;
  color: var(--black)
}

.faq-contentWrapper .accordion-item .accordion-header .accordion-button {
  font-size: 19px;
  font-weight: 500;
  line-height: 26px;
  padding: 20px 40px 20px 32px;
  background: #e5f0f8;
  border-radius: 15px !important
}

.faq-contentWrapper .accordion-item.active .accordion-button {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important
}

.faqSec .faq-contentWrapper .accordion .accordion-body {
  background: #e5f0f8;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding: 0 32px 32px
}

.faqSec.solutionFaq .accordion-button::after {
  transform: rotate(90deg);
  background-image: url('/assets/img/svg/white-arrow.svg')
}

.faqSec .accordion-button::after {
  background-image: url('/assets/img/svg/accordionIco.svg');
  width: 18px;
  height: 12px;
  background-size: contain;
  background-position: bottom;
  position: absolute;
  top: 27px;
  right: 18px
}

.faqSec .faq-contentWrapper .accordion .accordion-body p {
  font-size: 16px;
  line-height: 22px
}

.captcha-box img {
  position: absolute;
  top: 16px;
  right: 20px;
  mix-blend-mode: exclusion
}

.captcha-box input {
  padding-right: 106px
}

.app-dev-rightHeader .navbar-collapse ul .cta-appDev a {
  padding: 10px 24px !important;
  background: #f2f8fb;
  border-radius: 50px;
  border-color: #d9eaf5
}

.phone-tel.phone-tel {
  color: var(--black);
  opacity: 1
}

.cta-appDev:hover .nav-link::before {
  content: none
}

.cta-appDev span {
  margin-right: 8px
}

.app-dev-rightHeader.navbar .nav-link {
  color: var(--black)
}

.cta-appDev.contact-tel a {
  background: var(--link-blue) !important;
  color: var(--white) !important
}

.solution-opening .header p {
  color: var(--black)
}

.app-dev-rightHeader .contact-tel {
  display: none;
  transition: all .3s cubic-bezier(.075, .82, .165, 1)
}

.app-dev-rightHeader.affix .contact-tel {
  display: block
}

.appsubmitBtn {
  max-width: 100% !important;
  background: var(--link-blue);
  color: var(--white);
  border-radius: 50px
}

.appsubmitBtn input {
  color: var(--white) !important
}

#appDev-form .header p {
  font-size: 36px;
  line-height: 44px;
  color: var(--black)
}

#appDev-form .header p span {
  color: var(--link-blue)
}

#appDev-form .banner-bullets p {
  font-size: 18px !important;
  line-height: 56px !important;
  font-weight: 700;
  position: relative;
  color: var(--black)
}

.appDev-logos .clientLogo.logo-row img {
  padding: 0
}

.app-devMain .captcha-box img {
  width: 100px;
  height: 30px !important
}

form .form-control.b_services {
  padding: 0 !important
}

form .form-control.b_services .dropdown-toggle {
  padding: 13px 25px;
  z-index: 2
}

.human-cloudSec.bg-humanSec form#formID .formBtn1 {
  margin-top: 48px
}

.faq-contentWrapper .accordion .col-md-6:not(:last-child) {
  margin-bottom: 24px
}

.humanCloud-focusArea p {
  color: rgba(0, 0, 0, .7)
}

#refresh {
  background: 0 0;
  border: none;
  font-size: 14px;
  font-weight: var(--font-weight5);
  color: var(--blue);
  float: right;
  position: absolute;
  right: 0;
  bottom: -24px;
  text-decoration: underline
}

.faq-contentWrapper .accordion-item.active .accordion-button.collapsed {
  border-bottom-left-radius: 20px !important;
  border-bottom-right-radius: 20px !important
}

.text-danger {
  font-size: 12px;
  color: var(--white) !important
}

.accordion-body a {
  color: var(--link-blue);
  font-weight: 500
}

.formWrapper .form-control:focus {
  border: 2px solid var(--link-blue)
}

.full-contentBtn {
  margin-top: 54px
}

.product_List-sec {
  background-color: #000;
  background-image: radial-gradient(at 26% 13%, #070108 0, transparent 50%), radial-gradient(at 35% 52%, #000 0, transparent 50%), radial-gradient(at 0 0, #0b2183 0, transparent 50%), radial-gradient(at 81% 65%, #000 0, transparent 50%), radial-gradient(at 8% 71%, #030d39 0, transparent 50%), radial-gradient(at 60% 6%, #050623 0, transparent 50%), radial-gradient(at 99% 100%, #580d56 0, transparent 50%)
}

.product_List-sec header {
  padding-bottom: 40px
}

.product-lestSide {
  display: flex;
  align-items: center;
  gap: 25px
}

.single-product_List {
  padding: 40px 0;
  transition: all .2s ease-in-out
}

.single-product_List:not(:last-child) {
  border-bottom: 1px solid #16161f
}

.product-lestSide .productName h4 {
  color: var(--white);
  font-size: 32px;
  font-weight: 300
}

.single-product_List .product-content p {
  font-size: 20px;
  font-weight: var(--font-weight4);
  color: var(--white);
  line-height: 1.4
}

.single-product_List .product-content .productBtn {
  transition: all .1s ease-in-out;
  margin-top: 32px;
  transition-duration: .5s
}

.single-product_List.active .product-content .productBtn {
  visibility: visible;
  opacity: 1
}

.tech-product-sec {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat
}

.tech-product-sec header h3.title-f60 {
  max-width: 100%;
  text-align: center;
  color: var(--main-black)
}

.tech-productList {
  display: flex;
  flex-wrap: wrap
}

.single_TechProduct {
  background: rgba(255, 255, 255, .5);
  border-radius: 15px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative
}

.no-margin {
  margin-right: 0
}

.single_TechProduct .techImage {
  margin-bottom: 38px
}

.single_TechProduct p {
  position: absolute;
  bottom: 32px;
  font-size: var(--f20);
  font-weight: var(--font-weight4);
  color: var(--black)
}

.tech-productBtn {
  margin-top: 36px;
  text-align: center
}

.tech-productBtn .btn-gradient {
  background: transparent linear-gradient(257deg, #008afc 0, #c231ab 100%) 0 0 no-repeat;
  padding: 28px 48px;
  border: none
}

.tech-productBtn .btn-gradient:hover {
  color: var(--white)
}

.tech-productBtn .btn-gradient:hover svg path {
  fill: var(--white)
}

.fixed-content {
  background: url('/assets/img/gradient-bg1.webp') no-repeat;
  background-position: center;
  background-size: cover;
  padding-bottom: 104px
}

.fixed-content .full-content-title {
  font-size: 54px;
  line-height: 70px;
  color: var(--white);
  font-weight: 300
}

.homepageFixed .full-content-title {
  font-size: 54px;
  line-height: 70px;
  color: var(--white);
  font-weight: 300;
  margin-bottom: 107px
}

hr {
  background-color: var(--white);
  opacity: .15;
  margin: 0
}

.banner_topSpace {
  background: radial-gradient(circle, rgba(167, 240, 241, .5) 0, #fff 50%);
  width: 100%;
  overflow: hidden;
  margin: 0 auto
}

.portfolio-outer-wrapper header h3.title-f60 {
  color: var(--main-black);
  margin-bottom: 60px
}

.home-mainBanner {
  background-color: #000;
  background-image: radial-gradient(at 39% 31%, #000 0, transparent 50%), radial-gradient(at 0 0, #580d56 0, transparent 50%), radial-gradient(at 86% 69%, #000 0, transparent 50%), radial-gradient(at 25% 71%, #000 0, transparent 50%), radial-gradient(at 78% 100%, #0b2183 0, transparent 50%), radial-gradient(at 28% 99%, #0c2182 0, transparent 50%), radial-gradient(at 99% 1%, #050623 0, transparent 50%)
}

.ways-to-engage .horizontal .fixedPortfolio-heading {
  max-width: 500px !important;
  flex: 0 0 500px !important;
  display: flex;
  flex-direction: column
}

.portfolioOuter-sec .ways-to-engage .horizontal .item {
  align-items: flex-start;
  flex: 0 0 942px;
  max-width: 942px
}

.ways-to-engage .horizontal .item.fixedPortfolio-heading h3 {
  color: var(--main-black)
}

.home-mainBanner .banner-content {
  max-width: 600px
}

.home-mainBanner .banner-title span {
  font-weight: 600;
  color: var(--link-blue);
  background: none;
  background-clip: border-box;
  -webkit-background-clip: inherit;
  -webkit-text-fill-color: inherit
}

.home-mainBanner .bannerCta {
  display: flex;
  gap: 24px;
}

.home-mainBanner .banner-content p {
  color: var(--white);
  max-width: 100%;
  margin-top: 25px;
  font-size: 24px;
  line-height: 1.6;
}

.bannerProduct-detail {
  padding-top: 74px
}

.bannerProduct-detail .inner-detail span {
  color: var(--link-blue);
  font-size: var(--f40);
  font-weight: var(--font-weight7)
}

.bannerProduct-detail {
  display: flex;
  gap: 64px
}

.bannerProduct-detail .inner-detail {
  max-width: 236px;
  width: 100%
}

.bannerProduct-detail .inner-detail p {
  margin: 16px 0 0;
  color: var(--white);
  font-size: var(--f18);
  line-height: 26px;
  font-weight: 300
}

.banner-title span {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent
}

.navbar.affix {
  background-color: var(--main-black)
}

.sing_portfolio-detail .port-detail {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  background: transparent linear-gradient(180deg, #00000000 0, #000 100%) 0 0 no-repeat padding-box;
  padding: 40px 40px 48px 40px;
  width: 100%;
  border-radius: 15px
}

.port-detail .detailLeft {
  max-width: 530px
}

.port-detail .detailLeft .portMain {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px
}

.port-img img {
  border-radius: 15px
}

.port-detail .detailLeft .heading h4 {
  color: var(--white);
  font-size: var(--f28);
  font-weight: var(--font-weight5)
}

.port-tag {
  display: flex;
  white-space: nowrap;
  flex-wrap: wrap;
  gap: 5px
}

.port-tag span {
  padding: 6px 12px;
  background: #ffffff2e;
  border-radius: 50px;
  color: var(--white);
  font-size: var(--f14)
}

.port-detail .detailLeft .port-desc p {
  font-size: var(--f18);
  font-weight: 300;
  color: var(--white);
  opacity: .7;
  line-height: 1.4
}

.portBtn a {
  padding: 9px 15px;
  font-size: var(--f14);
  font-weight: var(--font-weight5)
}

.portfolioOuter-sec .engaged-box.item .all-portfolio-wrapper .port-detail {
  width: 100%;
  height: 100%;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  background-color: #000;
  background-image: radial-gradient(at 39% 31%, #000 0, transparent 50%), radial-gradient(at 0 0, #580d56 0, transparent 50%), radial-gradient(at 86% 69%, #000 0, transparent 50%), radial-gradient(at 25% 71%, #000 0, transparent 50%), radial-gradient(at 78% 100%, #0b2183 0, transparent 50%), radial-gradient(at 28% 99%, #0c2182 0, transparent 50%), radial-gradient(at 99% 1%, #050623 0, transparent 50%)
}

.homeClient .swiper-slide img {
  filter: grayscale(100%)
}

.homeClient .swiper-slide img:hover {
  filter: grayscale(0)
}

.service-spectrum-level .service-content-wrapper .section-btn {
  opacity: 0;
  visibility: hidden;
  transition: all .3s ease-in-out;
  margin-top: 32px
}

.service-spectrum-level .service-content-wrapper:hover .section-btn {
  opacity: 1;
  visibility: visible
}

.ClientSlider .left_side-slider {
  text-align: left
}

.ClientSlider .left_side-slider .thumbLogo-img {
  max-width: 120px;
  margin-bottom: 24px
}

.ClientSlider .left_side-slider .description p {
  font-size: var(--f16);
  font-weight: var(--font-weight5)
}

.right_side-slider {
  position: relative
}

.right_side-slider .img-description {
  position: absolute;
  top: 16px;
  left: 32px;
  right: 32px;
  text-align: left
}

.right_side-slider .img-description .sldierBtn {
  margin: 36px 0;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: all .3s ease-in-out
}

.ClientSlider .swiper-slide:hover .img-description .sldierBtn {
  opacity: 1;
  visibility: visible
}

.right_side-slider .img-description .port-tag span {
  font-size: 12px
}

.right_side-slider .img-description .sldierBtn .btn {
  font-size: var(--f14);
  font-weight: var(--font-weight5);
  padding: 10px 17px
}

.right_side-slider .img-description .proName span {
  color: var(--white);
  font-size: var(--f18);
  font-weight: var(--font-weight4)
}

.faqSec .title-f60 {
  color: var(--main-black)
}

.productWhy_choose .row.mt-5 {
  margin-top: 80px !important
}

.submenu-wrapper {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  padding: 22px 0;
  opacity: 0;
  visibility: hidden;
  transition: all .3s ease-in-out;
  position: fixed;
  width: 100%;
  top: 0
}

.submenu-wrapper.menuSticky {
  opacity: 1;
  visibility: visible;
  z-index: 12
}

.submenu-wrapper .submenu-inner-wrapper {
  display: flex;
  align-items: center;
  gap: 64px
}

.submenu-wrapper .submenu-list {
  width: 100%
}

.submenu-wrapper .submenu-list ul {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-align: center;
  gap: 26px
}

.submenu-wrapper .submenu-list .submenu-link {
  font-size: var(--f14);
  color: var(--main-black);
  font-weight: var(--font-weight5);
  transition: all .3s ease-in-out
}

.submenu-wrapper .submenu-list .submenu-link.tabbing-active {
  color: var(--link-blue) !important
}

.submenu-wrapper .submenu-list .submenu-link:hover {
  color: var(--link-blue)
}

.banner-backBtn svg,
.submenu-inner-wrapper .backBtn svg {
  margin-left: 0;
  transform: rotate(225deg);
  margin-right: 8px
}

.banner-backBtn svg {
  transform: rotate(270deg)
}

.banner-backBtn {
  margin-bottom: 24px
}

.banner-backBtn:hover svg {
  transform: rotate(225deg)
}

.banner-backBtn .btn-outline {
  color: var(--white) !important;
  border-color: var(--white)
}

.ClientSlider {
  left: 200px;
  overflow: visible
}

.global-clientele .ClientSlider {
  left: 0
}

.tech-productBtn .btn {
  font-size: 20px !important
}

#contactPage .header {
  margin-top: 80px;
  margin-right: 80px
}

.portfolioOuter-sec .ways-to-engage .horizontal .item.lastFixed-port {
  flex: 0 0 480px !important;
  max-width: 480px !important
}

.nav-item .solution-gradientBox {
  background: transparent linear-gradient(90deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat padding-box;
  padding: 64px 44px;
  border-radius: 15px
}

.solution-gradientBox.carrer-box {
  display: flex;
  align-items: flex-start;
  justify-content: space-between
}

.solution-gradientBox.carrer-box .carrerBox {
  max-width: 635px
}

.solution-gradientBox.carrer-box .greatPlace-logo {
  max-width: 130px
}

.nav-item .solution-gradientBox p {
  font-size: 48px;
  line-height: 60px;
  font-weight: 300;
  margin-bottom: 56px
}

.nav-item .solution-gradientBox .inner-content p {
  font-size: var(--f28);
  font-weight: var(--font-weight5);
  line-height: 36px;
  margin-bottom: 16px
}

.nav-item .solution-gradientBox .inner-content span {
  font-size: var(--f20);
  line-height: 30px;
  color: rgba(0, 0, 0, .7)
}

.nav-item .solution-gradientBox .header-navBtn {
  margin-top: 32px
}

.solutions-menuList {
  height: 100%;
  margin-left: 48px
}

.solutions-menuList.carrer-menuList {
  margin-left: 0
}

.solutions-menuList .solutionInner .solution-singleProduct {
  padding: 22px 24px;
  border: 1px solid #e5e5e5;
  border-radius: 15px;
  margin-bottom: 40px
}

.solution-singleProduct a {
  display: flex;
  align-items: flex-start;
  justify-content: space-between
}

.solution-singleProduct a .menu-tiltArrow {
  max-width: 32px;
  height: 32px;
  display: flex;
  flex-shrink: 0
}

.solution-singleProduct a .menu-tiltArrow img {
  transition: all .3s ease-in-out;
  width: 100%;
  height: 100%
}

.solution-singleProduct a .menu-tiltArrow img.hoverArrow {
  display: none;
  transition: all .3s ease-in-out
}

.solution-singleProduct:hover a .menu-tiltArrow img.normalArrow {
  display: none
}

.solution-singleProduct:hover a .menu-tiltArrow img.hoverArrow {
  display: block;
  transform: rotate(0)
}

.solution-singleProduct a:hover .menu-tiltArrow img {
  transform: rotate(45deg);
  transition: all .3s ease-in-out
}

.solutionInner .solution-singleProduct .solution-name p {
  font-size: var(--f22);
  font-weight: var(--font-weight5);
  margin-bottom: 16px
}

.solutionInner .solution-singleProduct .solution-name span {
  font-size: var(--f16);
  font-weight: var(--font-weight4);
  color: rgba(0, 0, 0, .7)
}

.solutionInner .solution-singleProduct:hover .solution-name span {
  color: var(--link-blue);
  opacity: 1
}

.solutions-menuList .socialHeader-right {
  position: absolute;
  bottom: 64px;
  right: 0;
  padding-top: 50px;
  border-top: 1px solid #aba9a938;
  width: 100%;
  text-align: right
}

.solution-gradientBox.carrer-box p.carrer-heading {
  margin-bottom: 32px;
  font-size: 48px;
  line-height: 60px
}

.solution-gradientBox.carrer-box p {
  font-size: 21px;
  line-height: 30px;
  margin-bottom: 22px
}

p.carrer-bottom-heading {
  font-size: 32px !important;
  font-weight: var(--font-weight6) !important
}

.solution-gradientBox.carrer-box .header-navBtn {
  margin-top: 78px
}

.socialHeader-box.carerHeader-box {
  background: 0 0
}

.carer-drop hr {
  margin: 4px 0 14px;
  background-color: #959494
}

.header-navBtn .btn:hover,
.socialBtn .btn:hover {
  background: var(--link-blue);
  color: var(--white) !important
}

.header-navBtn .btn:hover svg path,
.socialBtn .btn:hover svg path {
  fill: var(--white)
}

.back-to-top {
  background-color: var(--link-blue);
  text-decoration: none;
  cursor: pointer;
  width: 56px;
  height: 56px;
  z-index: 1;
  position: fixed;
  right: 75px;
  bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 100%;
  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .4);
  transform: rotate(-45deg)
}

.backtotop-wrapper svg {
  height: 20px;
  max-width: 30px;
  width: 100%
}

.back-to-top:hover {
  background-color: var(--link-blue)
}

.back-to-top:active {
  box-shadow: none;
  background-color: var(--primary_color)
}

.back-to-top svg.icon__arrow-up {
  fill: white;
  width: 32px;
  height: 32px
}

.rotationBanner {
  background-position: center;
  background-size: cover;
  height: 900px;
  padding-top: 102px
}

.revlonBanner {
  background: url('/assets/img/portfolioBanner/revlon-banner.webp') no-repeat
}

.nikonBanner {
  background: url('/assets/img/portfolioBanner/my-nikon.webp') no-repeat
}

.bigbiteBanner {
  background: url('/assets/img/portfolioBanner/big-bite-loyalty.webp') no-repeat
}

.hhflBanner {
  background: url('/assets/img/portfolioBanner/herohousing.webp') no-repeat
}

.leonardoBanner {
  background: url('/assets/img/portfolioBanner/leonardo-olive-oil.webp') no-repeat
}

.mTractorBanner {
  background: url('/assets/img/portfolioBanner/mahindra-tractors.webp') no-repeat
}

.kfcEngagementBanner {
  background: url('/assets/img/portfolioBanner/kfc-engagement.webp') no-repeat
}

.lifreeBanner {
  background: url('/assets/img/portfolioBanner/lifree.webp') no-repeat
}

.mamyPokoBanner {
  background: url('/assets/img/portfolioBanner/mamyPoko.webp') no-repeat
}

.marsBanner {
  background: url('/assets/img/portfolioBanner/mars-wrigley.webp') no-repeat
}

.mccainBanner {
  background: url('/assets/img/portfolioBanner/mcCain.webp') no-repeat
}

.whirlpoolBanner {
  background: url('/assets/img/portfolioBanner/Whirlpool.webp') no-repeat
}

.sofyBanner {
  background: url('/assets/img/portfolioBanner/Sofy.webp') no-repeat
}

.havellsBanner {
  background: url('/assets/img/portfolioBanner/havells.webp') no-repeat
}

.wildlifeBanner {
  background: url('/assets/img/portfolioBanner/wildlife-sos.webp') no-repeat
}

.QMSBanner {
  background: url('/assets/img/portfolioBanner/Panasonic-QMS.webp') no-repeat
}

.twentyfourBanner {
  background: url('/assets/img/portfolioBanner/24Seven-App.webp') no-repeat
}

.healiusBanner {
  background: url('/assets/img/portfolioBanner/healius.webp') no-repeat
}

.kanataBanner {
  background: url('/assets/img/portfolioBanner/kanata.webp') no-repeat
}

.motherDairyBanner {
  background: url('/assets/img/portfolioBanner/mother-dairy.webp') no-repeat
}

.kfcRecruitmentBanner {
  background: url('/assets/img/portfolioBanner/kfc-recruitment.webp') no-repeat
}

.ceroBanner {
  background: url('/assets/img/portfolioBanner/mahindra-cero.webp') no-repeat
}

.serviceGenieBanner {
  background: url('/assets/img/portfolioBanner/mahindra-service-genie.webp') no-repeat
}

.sevenElevenBanner {
  background: url('/assets/img/portfolioBanner/7-Eleven-App.webp') no-repeat
}

.panasonicEBanner {
  background: url('/assets/img/portfolioBanner/panasonic-eCarewiz.webp') no-repeat
}

.panasonicPromeetBanner {
  background: url('/assets/img/portfolioBanner/panasonic-promeet.webp') no-repeat
}

.kfcWebsiteBanner {
  background: url('/assets/img/portfolioBanner/kfc-website.webp') no-repeat
}

.panasonicSignedgeBanner {
  background: url('/assets/img/portfolioBanner/panasonic-signEdge.webp') no-repeat
}

.portfolioBanner-leftContent .banner-backBtn .btn-outline {
  padding: 13px 24px;
  font-size: 14px;
  font-weight: var(--font-weight5) !important
}

.rotationBanner .banner-backBtn {
  margin-bottom: 48px
}

.portfolioBanner-leftContent .portfolio_banner-description {
  margin-top: 32px
}

.portfolioBanner-leftContent .portfolio_banner-description .banner-title {
  max-width: 515px
}

.banner-info {
  margin-top: 52px;
  max-width: 505px
}

.banner-info .info-intro:not(:last-child) {
  margin-right: 87px
}

.banner-info .info-intro small {
  display: block;
  font-size: 24px;
  font-weight: var(--font-weight4);
  color: var(--white);
  margin-bottom: 16px
}

.banner-info .info-intro span {
  font-size: var(--f22);
  font-weight: var(--font-weight4);
  color: var(--white);
  line-height: 30px
}

.portfolioBanner-rightContent .portfolio-desc-type {
  padding: 32px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 146px
}

.portfolioBanner-rightContent .portfolio-desc-type {
  border-bottom: 1px solid var(--white)
}

.rotationBanner .row {
  align-items: flex-end
}

.portfolioBanner-rightContent .portfolio-desc-type p,
.portfolioBanner-rightContent .portfolio-desc-type span {
  color: var(--white)
}

.portfolioBanner-rightContent .portfolio-desc-type p {
  font-size: var(--f24);
  font-weight: var(--font-weight4)
}

.portfolioBanner-rightContent .portfolio-desc-type span {
  font-size: var(--f22);
  font-weight: 300;
  text-align: right;
  line-height: 30px
}

.portfolio-banner-arrow {
  position: absolute;
  bottom: 77px;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 40px;
  width: 100%;
  margin: 0 auto
}

.project-wrapper h2.title-f60,
.project-wrapper h2.title-f60.splitting .char {
  color: var(--main-black)
}

.centerVideo {
  margin-top: 140px;
  z-index: 1;
  box-shadow: 0 0 50px #0000001A;
  border-radius: 15px
}

.centerVideo video {
  border-radius: 15px
}

.objective-content header.header h2 {
  color: var(--white);
  margin-bottom: 40px
}

.challenge-wrapper .horizontal-outer {
  margin-top: 90px
}

.challenge-wrapper .horizontal-outer h3 {
  color: var(--black)
}

.challenge-wrapper h3 {
  margin-bottom: 80px
}

.challengeBox-img {
  max-width: 86px;
  width: 100%
}

.challengeBox-content h4 {
  font-size: 32px;
  font-weight: var(--font-weight4);
  margin: 32px 0 16px;
  line-height: 40px
}

.challengeBox-content p {
  font-size: 20px;
  color: rgba(0, 0, 0, .7);
  line-height: 26px
}

.challengeImg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  background: var(--white)
}

.pin-spacer {
  height: auto;
  position: relative
}

.pin-wrap {
  width: auto
}

.challenge-wrapper .animation-wrap,
.challenge-wrapper .pin-wrap {
  display: flex;
  position: relative;
  z-index: 1;
  height: auto;
  top: 0 !important
}

.result-impact .pin-spacer .pin-wrap {
  min-height: 560px !important
}

section.result-impact.challenge-wrapper .item {
  position: relative;
  padding: 50px 40px;
  flex: 0 0 600px;
  height: calc(100vh - 500px);
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  line-height: 1.7;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 0
}

.challenge-box.item .innerChallengeBox {
  max-width: 380px
}

.challengeHeading {
  position: absolute;
  left: 785px
}

.challnge-scrollBox {
  margin-top: 180px
}

.challenge-lastBox {
  flex: 0 0 750px
}

.challenge-wrapper .animation-wrap.to-right {
  counter-reset: item;
  float: left;
  margin-left: 260px !important
}

.challenge-wrapper .animation-wrap.to-left {
  counter-reset: item 11;
  float: right
}

.challenge-box.item {
  margin-top: 95px
}

.solution-container {
  background-color: #000;
  background-image: radial-gradient(at 77% 36%, hsla(311, 0%, 0%, .62) 0, transparent 50%), radial-gradient(at 0 6%, hsla(337, 71%, 49%, .57) 0, transparent 50%), radial-gradient(at 43% 59%, hsla(289, 0%, 0%, .34) 0, transparent 50%), radial-gradient(at 12% 93%, #1b0736 0, transparent 50%), radial-gradient(at 90% 90%, #1d073b 0, transparent 50%), radial-gradient(at 91% 9%, #5918a4 0, transparent 50%)
}

.solution-container header {
  border-bottom: none
}

.solution-container .solution-singleContent {
  border-top: 1px solid rgba(255, 255, 255, .15);
  padding: 32px 0 48px;
  max-width: 640px
}

.solution-container header {
  margin-bottom: 0;
  padding-bottom: 48px
}

.solution-wrapper .title-f60 {
  margin-bottom: 32px
}

.solution-wrapper header p {
  font-size: var(--f24);
  font-weight: 300;
  color: rgba(255, 255, 255, .7)
}

.solution-wrapper .solution-singleContent h3 {
  font-size: 32px;
  color: var(--white);
  margin-bottom: 16px;
  font-weight: var(--font-weight4)
}

.solution-wrapper .solution-singleContent p {
  font-size: var(--f20);
  line-height: 26px;
  color: rgba(255, 255, 255, .7)
}

.solution-wrapper .solution-singleContent:not(:last-child) {
  margin-bottom: 40px
}

.digital-tranform-content h4 {
  font-size: var(--f24);
  line-height: normal;
  color: var(--white);
  opacity: .7;
  font-weight: 300
}

.digital-tranform-content ul {
  padding-top: 112px
}

.digital-content-wrapper .countValue span {
  color: rgba(255, 255, 255, .3);
  position: relative;
  top: 6px;
  font-weight: var(--font-weight5);
  font-size: var(--f18)
}

.digital-tranform-content ul li:not(:last-child) .digital-content-wrapper {
  margin-bottom: 32px;
  padding-bottom: 32px;
  border-bottom: 2px solid rgba(255, 255, 255, .2)
}

.digital-tranform-content ul li .digital-content h5 {
  font-size: 32px;
  color: var(--white);
  margin-bottom: 16px;
  font-weight: 400
}

.digital-tranform-content ul li .digital-content p {
  font-size: var(--f20);
  line-height: 26px;
  color: var(--white);
  opacity: .7
}

.result-impact header h3 {
  width: 100%;
  max-width: 100%;
  color: var(--black)
}

.result-impact .result-desc p {
  font-size: var(--f20);
  font-weight: 300;
  color: var(--black);
  line-height: 34px
}

.result-impact header p {
  font-size: 24px;
  color: var(--content)
}

.result-impact .row {
  margin-bottom: 80px
}

section.result-impact .item.resultImpact-lastBox {
  border: none;
  border-radius: 0;
  flex: 0 0 470px
}

section.result-impact .item {
  position: relative;
  padding: 36px 30px;
  flex: 0 0 440px;
  height: calc(100vh - 320px);
  display: flex;
  align-items: flex-start;
  line-height: 1.7;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid rgba(11, 96, 176, .3);
  border-radius: 15px;
  background-color: transparent;
  flex-direction: column;
  margin-right: 40px
}

.result-impactContent h4 {
  font-size: 32px;
  color: var(--black);
  line-height: 40px;
  margin-bottom: 16px;
  font-weight: var(--font-weight4)
}

.result-impactContent p {
  font-size: 20px;
  color: rgba(0, 0, 0, .7);
  font-weight: 300
}

.projectintro-content p:first-child {
  margin-bottom: 16px
}

.portfolio-caseslider {
  padding-bottom: 0
}

.protfolio-slider-wrapper {
  margin-top: 64px
}

.m-casestudies {
  background-color: #000;
  background-image: radial-gradient(at 26% 13%, #070108 0, transparent 50%), radial-gradient(at 35% 52%, #000 0, transparent 50%), radial-gradient(at 0 0, #0b2183 0, transparent 50%), radial-gradient(at 81% 65%, #000 0, transparent 50%), radial-gradient(at 8% 71%, #030d39 0, transparent 50%), radial-gradient(at 60% 6%, #050623 0, transparent 50%), radial-gradient(at 99% 100%, #580d56 0, transparent 50%)
}

.thankyou-wrapper {
  padding-top: 150px
}

.portfolioOuter-sec .challenge-wrapper .horizontal-outer {
  margin-top: 0
}

.ourportfolio-section {
  padding-top: 64px
}

section.new-portPage {
  padding: 75px 0 140px !important
}

section.new-portPage .inner-banner-content h1.banner-title {
  font-size: 54px;
  line-height: 70px;
  max-width: 700px;
  margin: 48px auto 32px
}

a.gradient-before {
  position: relative;
  display: block
}

a.gradient-before::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background: transparent linear-gradient(0deg, #fffFFF00 0, #000 100%) 0 0 no-repeat padding-box;
  height: 85px;
  width: 100%;
  z-index: 1;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px
}

.ourportfolio-section .portfolio-single-wrapper .cta-action a::before {
  display: none
}

section.project-wrapper.portfolio-projectIntro {
  background: radial-gradient(circle, rgba(167, 240, 241, .5) 0, #fff 50%);
  background-position: -300px -300px
}

.portfolioBanner-rightContent {
  margin-top: 24px
}

.horizontal-line {
  position: absolute;
  bottom: 0;
  left: 42%;
  width: 50%;
  height: 2px;
  background-color: #000;
  transform: translateX(0)
}

.challenge-wrapper .pin-wrap::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 42%;
  background: rgba(0, 0, 0, .2);
  width: 100%;
  height: 1px
}

.filter-row {
  position: relative
}

.filter-row::after {
  content: '';
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 1px
}

.ourportfolio-section::before {
  content: '';
  position: absolute;
  top: 140px;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background: rgba(0, 0, 0, .1)
}

.techportProducts {
  border-radius: 15px;
  background-color: #000;
  background-image: radial-gradient(at 26% 13%, #070108 0, transparent 50%), radial-gradient(at 35% 52%, #000 0, transparent 50%), radial-gradient(at 0 0, #0b2183 0, transparent 50%), radial-gradient(at 81% 65%, #000 0, transparent 50%), radial-gradient(at 8% 71%, #030d39 0, transparent 50%), radial-gradient(at 60% 6%, #050623 0, transparent 50%), radial-gradient(at 99% 100%, #580d56 0, transparent 50%)
}

.techportProducts.sing_portfolio-detail .port-detail {
  position: relative;
  overflow: hidden
}

.techportProducts.sing_portfolio-detail .portMain {
  width: 100%
}

.inner-banner-custome {
  background-position: center;
  background-size: cover;
  padding-bottom: 220px !important;
  padding-top: 85px;
  height: 750px
}

.about-banner-new {
  background: url('/assets/img/second-level-banner/about-Us-banners/aboutUs-banner.webp') no-repeat;
  background-size: cover
}

.about-sec2 {
  padding-top: 0 !important;
  background: radial-gradient(circle, rgba(167, 240, 241, .5) 0, #fff 50%);
  width: 100%;
  overflow: hidden;
  background-position: 300px center
}

.about-sec2 .content-title {
  padding-top: 90px
}

.json-sec {
  padding-top: 0
}

.aboutPortfolio-sec .title-f60 {
  max-width: 100%
}

.contact-banner-new {
  background: url('/assets/img/second-level-banner/contact-us/contactUs-banner.webp') no-repeat;
  background-size: cover
}

.contact-banner-new .inner-content-row {
  margin-top: 186px
}

.contact-banner-new .content-right {
  max-width: 570px
}

.contact-sec2 {
  padding-bottom: 70px
}

.contact-sec2 .current-opening {
  padding: 0
}

.contact-sec2 .header {
  margin-top: 0 !important
}

.contact-sec2 .contact-FormBox {
  padding: 60px;
  background: var(--white);
  box-shadow: 0 10px 25px #0000000D;
  border-radius: 15px;
  margin-top: -150px
}

.contact-sec2 .formSide {
  padding: 0 80px;
  background-color: var(--white);
  background-image: none
}

.getintouch-wrapper {
  background: radial-gradient(circle, rgba(167, 240, 241, .5) 0, #fff 50%);
  width: 100%;
  overflow: hidden;
  background-position: -240px 190px;
  padding-top: 70px
}

.getintouch-wrapper h2.title-f60 {
  color: var(--black);
  text-align: center;
  max-width: 100%;
  margin-bottom: 56px
}

.getintouch-content {
  display: block
}

.tabbing-location-wrapper .nav {
  justify-content: center
}

.tabbing-location-wrapper .nav-pills {
  margin-bottom: 90px
}

.tabbing-location-wrapper .nav-pills .nav-link {
  font-size: var(--f22);
  color: var(--black);
  white-space: nowrap;
}

.tabbing-location-wrapper .nav-pills .nav-item:not(:last-child) {
  margin-right: 40px
}

.tabbing-location-wrapper .nav-pills .nav-link.active {
  background-color: var(--white);
  color: var(--link-blue);
  font-weight: var(--font-weight5);
  border-bottom: var(--link-blue) 2px solid;
  border-radius: 0
}

.officeDetail-wrapper .ofc-address {
  font-size: var(--f20);
  margin-bottom: 16px;
  color: var(--black);
  margin-left: 44px
}

.officeDetail-wrapper .office-details .icons {
  max-width: 24px;
  height: 24px
}

.officeDetail-wrapper .office-details {
  display: flex;
  gap: 24px;
  margin-bottom: 24px
}

.officeDetail-wrapper .office-details .icons img {
  width: 100%;
  height: 100%;
  border-radius: 0
}

.officeDetail-wrapper .office-details .details a,
.officeDetail-wrapper .office-details .details p {
  font-size: var(--f22);
  line-height: 34px;
  color: var(--black);
  font-weight: 300
}

.space-bottom {
  margin-bottom: 48px !important
}

.location-map {
  overflow: hidden
}

.location-map iframe {
  border-radius: 15px
}

.getintouch-btn {
  margin-top: 40px;
  margin-left: 44px
}

.getintouch-social {
  padding-top: 140px;
  gap: 75px
}

.getintouch-social .socialContact-content {
  max-width: 775px;
  width: 100%
}

.getintouch-social .socialContact-content p {
  font-size: var(--f20);
  line-height: 34px;
  color: rgba(0, 0, 0, .7)
}

.career-banner-new {
  background: url('/assets/img/second-level-banner/careers-banners/carrer-bg.webp') no-repeat
}

.opportunityList {
  padding-left: 100px
}

.trending-opportunity-wrapper .title-f60 {
  color: var(--black)
}

.trending-opportunity-wrapper header p {
  font-size: var(--f20);
  line-height: 32px;
  color: rgba(0, 0, 0, .7)
}

.searchBox-wrapper {
  margin-bottom: 40px
}

.searchBox-wrapper .searchIco {
  position: absolute;
  top: 25px;
  left: 36px
}

.searchBox-wrapper .crossIco {
  position: absolute;
  top: 25px;
  right: 36px;
  cursor: pointer
}

.searchBox-wrapper input {
  height: 68px;
  padding-left: 70px;
  padding-right: 70px;
  font-size: 18px
}

.searchBox-wrapper input::placeholder {
  font-size: 18px;
  color: rgba(0, 0, 0, .3)
}

.position-countList span {
  font-size: var(--f20);
  color: rgba(0, 0, 0, .7)
}

.jobListing-list .singleJob-detail {
  padding: 24px 32px 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 24px 0 0
}

.jobListing-list .singleJob-detail:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, .2)
}

.singleJob-detail .jobTitle h3 {
  font-size: var(--f24);
  font-weight: var(--font-weight4);
  margin-bottom: 16px;
  color: var(--black)
}

.singleJob-detail a {
  width: 100%
}

.singleJob-detail .jobExp {
  display: flex;
  align-items: center;
  gap: 48px
}

.singleJob-detail .jobExp .job-tag {
  display: flex;
  align-items: center;
  gap: 8px
}

.singleJob-detail .jobExp .job-tag span {
  font-size: var(--f20);
  font-weight: var(--font-weight4);
  color: rgba(0, 0, 0, .7)
}

.jobMain-heading {
  padding-top: 84px;
  background: transparent linear-gradient(90deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat padding-box;
  border-radius: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 3
}

.jobMain-heading .singleJob-detail {
  margin-top: 0;
  padding: 24px 0 24px
}

.job-heading {
  margin-bottom: 16px;
  gap: 20px
}

.job-heading a {
  width: auto
}

.jobPoints {
  padding-bottom: 48px;
  padding-top: 200px
}

.jobMain-heading .jobTitle h1 {
  font-size: 28px;
  margin-bottom: 0;
  line-height: 1.4;
  font-weight: var(--font-weight5)
}

.jobPoint-heading {
  font-size: 28px;
  font-weight: var(--font-weight5);
  margin-bottom: 16px;
  line-height: 1.4
}

.job-point-wrapper p,
.job-point-wrapper ul li {
  font-size: 18px;
  font-weight: var(--font-weight5);
  line-height: 28px;
  color: rgba(0, 0, 0, .7);
  position: relative
}

.jobPoint-list {
  margin-top: 38px
}

.job-point-wrapper ul li {
  padding-left: 52px
}

.job-point-wrapper ul li::before {
  content: '';
  background: url('/assets/img/svg/blue-tick.svg') no-repeat;
  background-position: center;
  background-size: cover;
  width: 32px;
  height: 32px;
  position: absolute;
  left: 0
}

.job-point-wrapper ul li:not(:last-child) {
  margin-bottom: 24px
}

p.sub-detail {
  max-width: 1170px;
  width: 100%;
  margin-top: 45px
}

.job-point-wrapper {
  padding: 64px 0
}

.job-point-wrapper:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, .2)
}

.jobForm-heading .job-heading a {
  gap: 14px;
  display: flex
}

.jobForm-heading .job-heading a span {
  font-size: 22px;
  font-weight: var(--font-weight4);
  color: rgba(0, 0, 0, .7)
}

.apply-jobForm {
  padding: 260px 0 165px
}

.apply-jobForm form .form-control.b_services .dropdown-toggle {
  padding: 19px 25px;
  color: #757d85
}

.apply-jobForm .job-form {
  max-width: 985px;
  width: 100%;
  margin: 0 auto
}

.job-form form .form-group {
  margin-bottom: 24px
}

.custom-upload-cv {
  border: 1px solid #ced4da;
  border-radius: 50px;
  position: relative;
  height: 60px;
  padding: 18px 39px
}

#custom-button,
#videocustom-button {
  padding: 17px 45px;
  color: #fff;
  background-color: #047dd6;
  border: 1px solid #047dd6;
  border-radius: 50px;
  height: 54px;
  cursor: pointer;
  position: absolute;
  top: 2px;
  right: 2px
}

#custom-button:hover {
  background-color: var(--white);
  color: #047dd6;
  border-color: #047dd6
}

#custom-text {
  font-family: sans-serif;
  color: #757d85;
  font-size: 14px
}

.videoUpload-wrapper {
  margin-top: 50px
}

.videoUpload-wrapper span {
  font-size: var(--f24);
  font-weight: var(--font-weight5);
  line-height: 34px
}

.videoUpload-wrapper p {
  font-size: 32px;
  color: #047dd6;
  font-weight: var(--font-weight5)
}

.videoUpload-box {
  background: #047DD61A;
  border-radius: 15px;
  border: 2px dashed #047dd6;
  padding: 30px;
  margin-top: 26px;
  align-items: center;
  margin-bottom: 32px
}

.videoUpload-box .overlay {
  background: #0171b5c7;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  z-index: 1
}

.videoUpload-box .overlay .overlay-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  width: 100%;
  justify-content: center
}

.progressBar-box {
  width: 100%;
  max-width: 720px
}

.videoUpload-box .overlay .overlay-content p {
  font-size: var(--f24);
  font-weight: var(--font-weight5);
  margin-bottom: 32px;
  color: var(--white)
}

.progressBar-box .progress {
  height: 8px;
  border-radius: 6px
}

.progressBar-box .progress .progress-bar {
  background-color: #004577
}

.videoUpload-box .videoImg {
  text-align: center
}

.videoUpload-box .videoImg video {
  mix-blend-mode: darken
}

.videoUpload-box p {
  font-size: 22px;
  font-weight: var(--font-weight5);
  margin-bottom: 22px;
  color: var(--black)
}

#videocustom-button {
  position: relative;
  left: 0;
  right: 0;
  border-radius: 15px;
  height: 60px;
  font-size: 18px;
  text-transform: capitalize
}

.video-customUpload {
  margin-bottom: 6px
}

.videoUpload-box small {
  font-size: var(--f14);
  font-weight: var(--font-weight5);
  color: #047dd6
}

.upload-video-box {
  padding-bottom: 32px;
  border-bottom: 2px solid rgba(4, 125, 214, .14)
}

.drop-file {
  margin-top: 24px
}

.drop-file p {
  font-size: 18px;
  font-weight: var(--font-weight5);
  color: rgba(0, 0, 0, .7)
}

.uploadVideo-right {
  max-width: 300px;
  margin: 20px auto 0;
  text-align: center
}

input[type=checkbox] {
  position: relative;
  border: 1px solid #ced4da;
  border-radius: 8px !important;
  background: 0 0;
  cursor: pointer;
  line-height: 0;
  margin: 0 .6em 0 0;
  outline: 0;
  padding: 0 !important;
  vertical-align: text-top;
  height: 28px;
  width: 28px;
  -webkit-appearance: none
}

input[type=checkbox]:hover {
  opacity: 1
}

input[type=checkbox]:checked {
  background-color: #047dd6;
  opacity: 1
}

input[type=checkbox]:before {
  content: '';
  position: absolute;
  right: 50%;
  top: 50%;
  width: 7px;
  height: 12px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  margin: -1px -1px 0 -1px;
  transform: rotate(45deg) translate(-50%, -50%);
  z-index: 2
}

.checkform-field {
  margin-bottom: 40px
}

.checkform-field .form-group {
  display: flex;
  align-items: center
}

.checkform-field label {
  font-size: var(--f16);
  font-weight: var(--font-weight5);
  color: rgba(0, 0, 0, .7)
}

.job-formCta {
  margin-top: 50px;
  width: fit-content
}

.job-formCta .btn {
  justify-content: flex-start;
  font-size: 18px !important
}

#formSubmit .modal-dialog {
  max-width: 720px;
  text-align: center
}

#formSubmit .modal-content {
  border-radius: 15px
}

#formSubmit .modal-header {
  padding: 36px 40px;
  background: #f4f6fe;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px
}

#formSubmit .modal-header .btn-close {
  background: url('/assets/img/svg/modal-cross.svg') rgba(80, 164, 226, .1);
  background-repeat: no-repeat;
  background-position: center
}

#formSubmit .modal-body {
  padding: 60px 0 40px
}

#formSubmit .modal-body .modal-formText h1 {
  color: #0b60b0;
  margin-bottom: 16px
}

#formSubmit .modal-body .modal-formText p {
  font-size: var(--f22);
  color: var(--black)
}

#formSubmit .modal-footer {
  padding: 32px 0 64px
}

#formSubmit .modal-footer p {
  color: #047dd6;
  font-size: 40px;
  text-align: center;
  width: 100%;
  font-weight: 700;
  margin: 0
}

.bottom-apply {
  margin-top: 48px
}

.bottom-apply .btn {
  justify-content: flex-start
}

nav.career-header {
  background: var(--black)
}

.navbar.career-header .dropdown .nav-link::after {
  background: url('/assets/img/svg/arrowDown-white.svg') no-repeat
}

.trouble-form p {
  font-size: 22px;
  color: var(--black)
}

.trouble-form p a {
  color: var(--link-blue);
  text-decoration: underline
}

.discover-banner-new {
  background: url('/assets/img/second-level-banner/careers-banners/discover-banner.webp') no-repeat
}

.discoverFixed {
  background-color: #000;
  background-image: radial-gradient(at 26% 13%, #070108 0, transparent 50%), radial-gradient(at 35% 52%, #000 0, transparent 50%), radial-gradient(at 0 0, #0b2183 0, transparent 50%), radial-gradient(at 81% 65%, #000 0, transparent 50%), radial-gradient(at 8% 71%, #030d39 0, transparent 50%), radial-gradient(at 60% 6%, #050623 0, transparent 50%), radial-gradient(at 99% 100%, #580d56 0, transparent 50%)
}

.discoverFixed .btn-outline {
  border-color: var(--white);
  color: var(--white) !important
}

.statement-wrapper {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat
}

.statement-wrapper .statement-content .title-f60 {
  max-width: 100%;
  margin-top: 32px;
  color: var(--black);
  font-weight: 300
}

.statement-wrapper .statement-content span {
  font-size: 42px;
  font-weight: 300;
  color: var(--black)
}

.fostering-banner-new {
  background: url('/assets/img/second-level-banner/careers-banners/fostering-innovation.webp') no-repeat
}

.success-banner-new {
  background: url('/assets/img/second-level-banner/careers-banners/success-stories.webp') no-repeat
}

.opportunity-wrapper-success {
  padding-bottom: 0
}

.opportunity-wrapper-success .title-f60 {
  color: var(--black)
}

.opportunity-wrapper-success .banner-cta {
  margin-top: 64px
}

.opportunity-wrapper-success .content-title p {
  line-height: 34px
}

.navbar.affix .dropdown .nav-link::after {
  background: url('/assets/img/svg/arrowDown-white.svg') no-repeat
}

.bgBlack {
  background-color: var(--black)
}

.threeBoxsec {
  padding-top: 180px
}

.threeBoxsec header {
  margin-bottom: 80px
}

.threeBoxsec .title-f60 {
  color: var(--white);
  max-width: 100%
}

.threeBoxsec header p {
  color: var(--white);
  max-width: 1070px;
  margin: 32px auto 0;
  font-size: var(--f24);
  line-height: 34px
}

.performance-sec .title-f60 {
  color: var(--black);
  max-width: 100%;
  margin-bottom: 32px
}

.performance-sec header p {
  line-height: 34px;
  max-width: 1094px;
  font-size: var(--f24)
}

.performance-sec .row {
  justify-content: space-between
}

.performance-sec .row .value {
  max-width: 660px;
  padding: 24px 0 48px;
  border-bottom: 1px solid rgba(0, 0, 0, .15);
  height: 180px
}

.performance-sec .why-chosse-card h4 {
  font-size: 32px;
  margin-bottom: 16px;
  color: var(--black)
}

.solutionFixed {
  background-color: #017dd7;
  background-image: none
}

.solutionFixed .btn-outline {
  color: var(--white) !important;
  border-color: var(--white)
}

.solutionFaq {
  padding-top: 140px;
  padding-bottom: 140px !important
}

.solutionFaq .title-f60 {
  color: var(--white)
}

.solutionFaq .faq-contentWrapper .accordion .accordion-body,
.solutionFaq .faq-contentWrapper .accordion-item .accordion-header .accordion-button {
  background: #fffFFF1A 0 0 no-repeat padding-box;
  color: var(--white)
}

.solutionFaq .accordion-item {
  background-color: transparent
}

.solutionFaq .accordion-button:not(.collapsed)::after {
  background-image: url('/assets/img/svg/white-arrow.svg');
  transform: rotate(-90deg);
  width: 18px;
  height: 12px
}

.solutionContct .row {
  align-items: flex-start !important
}

.solutionContct header {
  margin-top: 0 !important;
  max-width: 622px
}

.solutionContct .btn-primary {
  max-width: 185px
}

.solutionContct .btn-primary svg {
  transition: all .3s ease-in-out
}

.solutionContct .btn-primary:hover svg {
  transform: rotate(45deg)
}

.neurotelBanner::after {
  content: '';
  position: absolute;
  top: -48px;
  right: -48px;
  background: url('/assets/img/solution-pages/neurotal/bannerStar.svg') no-repeat;
  width: 877px;
  height: 829px
}

.solution-banner {
  height: 900px;
  padding-top: 85px
}

.banner-content-img.banimg-content.solutionImg-top {
  margin-top: -270px
}

.solutionLogos {
  padding: 54px 0
}

.solutionGlobal-partners {
  z-index: 0;
  overflow: hidden
}

.solutionGlobal-partners .sub-title {
  color: var(--white)
}

.solutionGlobal-partners .full-content-title {
  color: var(--white) !important;
  max-width: 100% !important;
  margin-top: 32px
}

.solutionContct .btn-primary input {
  padding-right: 0 !important;
  max-width: 155px
}

.solutionGlobal-partners::after {
  content: '';
  position: absolute;
  top: -230px;
  right: 0;
  background: radial-gradient(circle, rgba(167, 240, 241, .2) 0, rgba(0, 0, 0, .1) 50%);
  width: 1073px;
  height: 1073px;
  z-index: -1
}

.solutionGlobal-partners .content-title {
  max-width: 1270px
}

.solutionContct form .form-control.b_services .dropdown-toggle {
  padding: 17px 25px
}

.no-border {
  border-bottom: none !important;
  padding-bottom: 0
}

.engageWrapper.bg-humanSec {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat
}

.ways-to-engage .title-f60 {
  color: var(--black) !important
}

.ways-to-engage .horizontal .item {
  display: flex
}

.homeFixed-portfolio .ways-to-engage .horizontal .item {
  padding-left: 40px
}

.solution-pageWrapper {
  background-color: #000;
  background-image: radial-gradient(at 26% 13%, #070108 0, transparent 50%), radial-gradient(at 35% 52%, #000 0, transparent 50%), radial-gradient(at 0 0, #0b2183 0, transparent 50%), radial-gradient(at 81% 65%, #000 0, transparent 50%), radial-gradient(at 8% 71%, #030d39 0, transparent 50%), radial-gradient(at 60% 6%, #050623 0, transparent 50%), radial-gradient(at 99% 100%, #580d56 0, transparent 50%);
  background-attachment: fixed
}

.bgWhite {
  background-color: var(--white)
}

.industries-content header {
  margin-top: 0 !important
}

.inner-section .banner-tag {
  margin-top: 40px
}

.inner-section .banner-tag img {
  max-width: fit-content;
  height: 100% !important
}

.inner-section .banner-tag img:not(:last-child) {
  margin-right: 40px
}

textarea.form-control {
  min-height: 100px
}

.expertValue .bgGradient {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: transparent linear-gradient(88deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat padding-box;
  border-radius: 15px;
  padding: 34px 60px 34px 108px
}

.expertValue .expretDigit .digitalValue {
  max-width: 190px;
  text-align: center
}

.expertValue .expretDigit .digitalValue .digitValue,
.expertValue .expretDigit .digitalValue h4 {
  font-size: 54px;
  margin-bottom: 21px;
  color: var(--black);
  font-weight: 300;
  display: block
}

.expertValue .expretDigit .digitalValue span {
  font-size: 20px;
  font-weight: var(--font-weight4);
  color: var(--black)
}

.expertValue .expretDigit {
  display: flex;
  align-items: center;
  gap: 108px
}

.choose-automotiveCompany .ways-to-engage .title-f60 {
  color: var(--white) !important;
  margin-bottom: 16px !important
}

.choose-automotiveCompany .ways-to-engage p {
  color: rgba(255, 255, 255, .7);
  font-size: var(--f24);
  line-height: 34px;
  max-width: 1063px
}

.choose-automotiveCompany .ways-to-engage .engagedContent h4 {
  color: var(--white);
  margin-bottom: 16px;
  line-height: 38px
}

.choose-automotiveCompany .ways-to-engage .engagedContent p {
  color: rgba(255, 255, 255, .7)
}

.innovative-tech-wrapper {
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat
}

.innovative-tech-wrapper header .title-f60 {
  color: var(--main-black)
}

.innovative-tech-wrapper .header-box {
  margin-bottom: 50px
}

.innovative-tech-wrapper .key-functions {
  background: rgba(255, 255, 255, .5)
}

.innovative-tech-wrapper .key-functions h4 {
  color: var(--black)
}

.innovative-tech-wrapper .key-functions p {
  color: var(--black)
}

.technologyStack-wrapper {
  padding-bottom: 0
}

.technologyStack-wrapper .title-f60 {
  color: var(--black);
  max-width: 100%;
  margin-bottom: 16px
}

.technologyStack-wrapper header p {
  font-size: var(--f24);
  color: rgba(0, 0, 0, .7);
  max-width: 955px;
  line-height: 34px
}

.technologyStack-wrapper header {
  margin-bottom: 40px
}

.technologyStack-wrapper .techStackLogo-content {
  display: block
}

.technologyStack-wrapper .techStackLogo-content .swiper-slide img {
  max-width: 130px;
  height: 100px;
  filter: none;
  padding: 16px 20px
}

.technologyStack-wrapper .tabbing-location-wrapper .nav-pills .nav-item:not(:last-child) {
  margin-right: 24px
}

.technologyStack-wrapper .tabbing-location-wrapper .nav-pills .nav-link {
  padding: 8px 0;
  color: rgba(0, 0, 0, .5)
}

.technologyStack-wrapper .tabbing-location-wrapper .nav-pills .nav-link.active {
  color: var(--black);
  border-bottom: 2px solid var(--black)
}

.technologyStack-wrapper .tabbing-location-wrapper .nav {
  justify-content: flex-start
}

.apply-jobForm .select_form::after {
  background: url('/assets/img/svg/down-arrow.svg') no-repeat
}

span.small-text {
  display: block;
  font-size: 24px
}

.industryFaq {
  padding-bottom: 0
}

footer .detailContact p {
  color: rgba(0, 0, 0, .7);
  font-size: var(--f16);
  margin-bottom: 8px
}

footer .detailContact .contact {
  margin-bottom: 8px
}

.footerSub-list .footer-list ul li:not(:last-child) {
  margin-bottom: 16px
}

textarea {
  resize: none
}

.faqSec {
  padding-bottom: 0
}

.site-pageHeading .section-title h1 {
  color: var(--black)
}

.banner-title.splitting .word .char:first-child {
  text-transform: uppercase
}

.b-lower .word .char {
  text-transform: lowercase !important
}

.industry-sec {
  padding: 140px 0 100px !important
}

.industry-sec .title-f60,
.industry-sec .title-f60.splitting .char:after {
  color: var(--white) !important
}

.industry-sec .singleIndustry {
  margin-bottom: 64px
}

.industry-sec .singleIndustry .inddustryImg img {
  border-radius: 15px;
  width: 100%;
}

.singleIndustry .inddustryImg img {
  width: 100%;
}

.industry-column-wrapper .industryName {
  margin-top: 16px
}

.industry-column-wrapper .industryName .industrydesc {
  display: block;
  font-size: var(--f16);
  opacity: .7;
  margin-top: 8px;
}

.industry-column-wrapper .industryName span {
  color: var(--white);
  font-size: var(--f22)
}

.industry-column-wrapper {
  margin-top: 64px
}

.contact-FormBox .select_form::after,
.solutionContct .select_form::after,
.solutionContct .tel-col .filter-option::after,
.solutions-formblock .tel-col .filter-option::after {
  background: url('/assets/img/svg/down-arrow.svg') no-repeat !important
}

.select_form:hover::after,
.tel-col:hover .filter-option::after {
  background: url('/assets/img/svg/down-arrow.svg') no-repeat !important
}

.challenge-wrapper .pin-wrap.pinned .challengeImg {
  top: 100px !important
}

.cultureBox {
  background: var(--white)
}

.cultureBox.solutionGlobal-partners::after {
  display: none
}

.cultureBox .threeBoxsec {
  padding-top: 0
}

.cultureBox .key-functions h4,
.cultureBox .key-functions p,
.cultureBox .title-f60,
.cultureBox header p {
  color: var(--black)
}

.cultureBox .key-functions {
  border: 1px solid #1a191933
}

.cultureBox p.sub-heading {
  font-size: var(--f24);
  line-height: 34px
}

.culture-together {
  padding-bottom: 0
}

.culture-together .title-f60 {
  color: var(--black)
}

.culture-together .content-title p {
  color: var(--black)
}

.neurtal-content {
  background-image: url(/assets/img/neurotal-baner.webp);
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: auto
}

.culture-together.neurtal-content {
  padding-bottom: 140px
}

.cultureBox .boxCta {
  position: absolute;
  bottom: 30px
}

.advantageBox .key-functions {
  min-height: 470px
}

.culture-banner-new {
  background: url('/assets/img/third-level-banner/career/ourCulture-banner.webp') no-repeat
}

.advantage-banner-new {
  background: url('/assets/img/third-level-banner/career/theAdvantage-banner.webp') no-repeat
}

.advantage-success-wrapper {
  padding-top: 0
}

.aboutBox .row {
  display: grid;
  grid-auto-flow: column
}

.aboutBox .row .col-md-4 {
  width: 100%
}

.aboutBox .key-functions p {
  margin-bottom: 40px
}

.service-spectrum-level {
  padding: 140px 0 95px
}

.banner-backBtn {
  display: inline-block
}

.productIcon img {
  max-width: 73px;
  height: 73px;
  width: 100%
}

.productGif {
  max-width: 450px;
  margin-left: auto;
  position: relative
}

.gif-wrapper {
  position: relative
}

.gif-wrapper::before {
  content: '';
  position: absolute;
  background: url('https://cdn-icons-png.freepik.com/512/1069/1069313.png') no-repeat;
  background-position: center;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 30px;
  height: 30px;
  margin: auto;
  z-index: 1;
  background-size: cover
}

.productGif .gif-wrapper img {
  max-width: 450px;
  border-radius: 15px
}

#gifOpen .modal-dialog {
  top: 10%;
  max-width: 1050px
}

#gifOpen .modal-dialog .modal-content {
  border-radius: 30px;
  height: 564px
}

#gifOpen .modal-dialog .modal-body {
  padding: 0
}

#gifOpen .modal-dialog .modal-body iframe {
  border-radius: 15px
}

body.modal-open {
  padding: 0 !important
}

.thank-you-wrapper .footer {
  display: none
}

.app-devMain .text-danger,
.contact-FormBox .text-danger,
.solutionContct .text-danger {
  color: red !important
}

.app-dev-rightHeader {
  background: #000
}

.app-devMain .banner-tag img {
  max-width: 150px
}

.app-devMain .select_form::after,
.app-devMain .tel-col .filter-option::after,
.contactPage-sec .formSide .tel-col .filter-option::after {
  background: url('/assets/img/svg/down-arrow.svg') no-repeat !important
}

.app-devMain .select_form .filter-option {
  top: 2px !important
}

.app-landing-logo .swiper-wrapper,
.app-landing-port .swiper-wrapper {
  height: auto
}

.app-landingForm .col-lg-6.content-side {
  display: none
}

.app-landingForm .formSide {
  width: 100%
}

.app-devMain .formcta {
  display: block
}

#netcore-footer .fottercontentLeft {
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  height: 100%
}

#netcore-footer .fottercontentLeft .footer-list ul {
  display: flex;
  gap: 30px;
  justify-content: center;
  align-items: center
}

#netcore-footer .footer-content h4 {
  font-size: 20px;
  text-align: center
}

#netcore-footer .footer-content li {
  margin-bottom: 16px
}

#netcore-footer .footer-content li a {
  font-size: 16px;
  color: var(--black)
}

.secondUL {
  margin-top: 10px
}

.netCore-banner {
  height: 100%
}

.tel-number {
  width: 100%
}

.BlogSec {
  padding-bottom: 0
}

.productWhy_choose {
  padding-bottom: 60px
}

.inner-section.app-devMain {
  height: 100%
}

.logo-outer-wrapper .swiper-wrapper {
  height: auto
}

.solutionLogos .clientLogo.logo-row {
  display: flex
}

.solutionLogos .clientLogo.logo-row img {
  max-width: 100px;
  height: 100%
}

.contact-sec2 .contact-FormBox #contactPage {
  padding-top: 0 !important
}

.rfpSec .common-textSec h1 {
  color: var(--black);
  max-width: 100%;
  margin-bottom: 32px
}

.rfp-form {
  margin-top: 32px
}

.rfp-form .form-control {
  border-color: #ced4da
}

.rfp-form h2 {
  font-size: var(--f24);
  font-weight: var(--font-weight4);
  margin-bottom: 24px;
  line-height: normal
}

.rfp-form label {
  margin-bottom: 16px
}

.rfp-form input[type=checkbox] {
  max-width: 24px;
  height: 24px
}

.rfp-form .form-check label {
  margin-bottom: 0
}

.rfp-form .form-control:focus {
  border: 2px solid #e7e7e7
}

.projectBudget {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap
}

#datepicker,
#datepicker1 {
  cursor: pointer
}

#datepicker .fa-calendar::before,
#datepicker1 .fa-calendar::before {
  color: var(--black)
}

#datepicker .input-group-append,
#datepicker1 .input-group-append {
  position: absolute;
  right: 0;
  height: 100%;
  background: 0 0;
  z-index: 4
}

#datepicker .input-group-append .input-group-text,
#datepicker1 .input-group-append .input-group-text {
  display: flex !important;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: 0 0 !important;
  border: 0
}

#datepicker span,
#datepicker1 span {
  opacity: 1
}

#datepicker input,
#datepicker1 input {
  border-top-right-radius: 8px !important;
  border-bottom-right-radius: 8px !important
}

.form-check {
  display: flex;
  align-items: center
}

.form-check span {
  color: var(--border-color)
}

.datepicker td,
.datepicker th,
.datepicker-switch {
  font-size: 12px;
  font-weight: var(--font-weight4)
}

.datepicker-switch {
  font-weight: var(--font-weight5) !important
}

.form-check-input[type=radio] {
  margin-top: 0
}

.popup-section .popup-wrapper {
  z-index: 999;
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .6)
}

.track-project-wrapper .heading-box {
  position: fixed;
  bottom: 350px;
  right: -115px;
  padding: 16px 24px;
  background: var(--link-blue);
  color: var(--white);
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  transform: rotate(-90deg);
  z-index: 5;
  cursor: pointer;
  opacity: 1;
  visibility: visible;
  transition: all .5s ease-in-out
}

.track-project-wrapper .heading-box p {
  font-size: var(--f24)
}

.track-project-wrapper .track-detail {
  background: var(--link-blue);
  padding: 32px 24px;
  position: fixed !important;
  bottom: 240px;
  right: -100%;
  max-width: 470px;
  border-radius: 24px;
  z-index: 4;
  transition: all .5s ease-in-out;
  position: relative
}

.track-project-wrapper .heading-wrapper {
  display: flex;
  align-items: center;
  gap: 8px
}

.track-project-wrapper.open .heading-box {
  opacity: 0;
  visibility: hidden
}

.track-project-wrapper.open .track-detail {
  right: 8px
}

.track-project-wrapper .track-detail .track-heading {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.track-project-wrapper .track-heading .heading-wrapper h5 {
  font-size: var(--f24);
  color: var(--white);
  font-weight: var(--font-weight4)
}

.track-project-wrapper .track-detail .crossIco {
  cursor: pointer
}

.clockIco svg path,
.track-project-wrapper .track-detail .crossIco svg path {
  stroke: var(--white)
}

.track-project-wrapper .track-detail p {
  max-width: 350px;
  color: var(--white);
  margin: 16px 0 32px;
  font-size: 18px;
  line-height: 1.6
}

.track-project-wrapper .trackBtn a:hover {
  background: var(--white);
  color: var(--link-blue)
}

.track-project-wrapper .trackBtn a:hover svg path {
  fill: var(--link-blue)
}

.siteLogo {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 24px
}

.siteLogo a {
  width: 100%
}

.siteLogo a img {
  height: 24px
}

.site-banner-logo {
  margin-left: 24px
}

.site-banner-logo span {
  display: block;
  color: var(--white);
  font-size: 12px;
  margin-bottom: 8px
}

.inner-section.banner-section .site-banner-logo img {
  height: 100%;
  width: 150px
}

.ni-data .countValue {
  opacity: 0;
  visibility: hidden
}

.ni-data .content-logo {
  max-width: 150px
}

.ni-data .content-logo img {
  width: 100%
}

.orangeBtn .btn {
  background: #ff6900;
  border-color: #ff6900
}

.industry_horizontal.choose-automotiveCompany .container {
  text-align: center
}

.industry_horizontal.choose-automotiveCompany .title-f60 {
  font-size: 36px
}

.industry_horizontal.choose-automotiveCompany .ways-to-engage p {
  font-size: var(--f18);
  max-width: 100%
}

.industry_horizontal .challenge-wrapper .horizontal-outer {
  margin-top: 48px
}

.homeForm .formSide {
  background-image: none;
  background: transparent linear-gradient(87deg, #dbeafd78 0, #d0fae663 100%) 0 0 no-repeat
}

.homeForm .formSide .form-control {
  border-color: #a6a5a5
}

.homeForm .select_form::after,
.homeForm .tel-col .filter-option::after {
  background: url('/assets/img/svg/down-arrow.svg') no-repeat !important
}

.chatbot-button {
  position: fixed;
  bottom: 80px;
  right: 20px;
  background-color: transparent;
  border: none;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  font-size: 16px;
  z-index: 1001;
  animation: bounce 2s infinite ease-in-out;
  width: 172px;
  height: 80px;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
}

.chatbot-button img {
  position: relative;
  z-index: 12;
  margin-left: auto;
  box-shadow: 0 4px 6px rgba(0, 0, 0, .2);
  border-radius: 100px;
  width: 60px;
  height: 60px;
  background-color: var(--link-blue);
  border: 2px solid var(--white);
}

.chatbot-button.chatbox-visible .chatbot-cards {
  opacity: 0;
  visibility: hidden;
}

@keyframes bounce {

  0%,
  100% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-5px)
  }
}

.chatbot-container {
  background-color: var(--white);
  position: fixed;
  bottom: 80px;
  right: 90px;
  width: 350px;
  height: 500px;
  display: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, .3);
  border-radius: 10px;
  overflow: hidden;
  z-index: 1002;
  transition: all .3s ease-in-out
}

.chatbot-container.chatbox-visible {
  display: block;
}

.chatbot-container iframe {
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 10px
}

.chatbot-cards {
  max-width: 225px;
  background-color: var(--white);
  padding: 12px 24px 12px 12px;
  border-radius: 15px;
  position: fixed;
  z-index: 11;
  right: 40px;
  opacity: 1;
  visibility: visible;
  transition-duration: .3s;
  box-shadow: 0 5px 25px #0000001A;
}

.chatbot-cards p {
  margin: 0;
  font-size: 12px;
}

.chatbotclose-ico {
  position: absolute;
  top: 20px;
  right: 15px;
  z-index: 12;
  cursor: pointer;
  background-color: transparent;
  border: none;
}

.flutter_tech.performance-sec .row {
  justify-content: flex-start;
}

.flutter_tech.performance-sec .why-chosse-card {
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 1rem;
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  border-radius: 20px;
  padding: 30px;
  margin-bottom: 40px;
  height: auto;
}

.flutter_tech.performance-sec .why-chosse-card h4 {
  font-size: 18px;
  font-weight: 300;
  margin-bottom: 0;
}

.flutter_tech.performance-sec .why-chosse-card .ico {
  flex: 0 0 23px;
  max-width: 23px;
}

@media all and (min-width:1800px) {

  .footer-main .container,
  .navbar .container {
    max-width: 1440px !important
  }

  .durationSpace label {
    margin-bottom: 18px !important
  }

  .container {
    max-width: 1440px
  }

  .center-content-banner {
    max-width: 1440px !important
  }

  .bannerImg .mobile1 {
    position: relative;
    left: 76px
  }

  .bannerImg .vr-img {
    left: 315px
  }

  .main-section {
    height: 100vh
  }

  .banner-content {
    transform: scale(1);
    position: relative;
  }

  .banner-content h1.banner-title strong {
    font-size: 80px;
    line-height: 86px
  }

  .banner-content h1.banner-title {
    font-size: 54px;
    line-height: 70px
  }

  .banner-cta {
    position: relative
  }

  .content-title p,
  .service-spectrum .content-title p,
  .tech p,
  .third-level-service-sec .content-title p {
    font-size: 24px;
    color: var(--black)
  }

  .tabs-container .tabs.active-tab .cards-why-choose .why-choose-content h3 {
    font-size: 22px !important
  }

  .cards-why-choose p {
    font-size: 22px !important;
    line-height: 32px !important
  }

  .text--heading {
    font-size: 54px !important;
    line-height: 54px !important
  }

  .text--sub-heading {
    font-size: 28px !important;
    line-height: 34px !important
  }

  section.result-impact .item {
    height: 100%
  }

  .content-sec .section-title .full-content-title {
    font-size: 54px;
    max-width: 100%
  }

  .current-opening p {
    font-size: 30px
  }

  .current-opening h3 {
    font-size: 78px !important
  }

  .client-carousel .swiper-container {
    overflow: visible
  }

  .title-f60 {
    font-size: 54px;
    line-height: 65px
  }

  .mt-77 {
    margin-top: 68px
  }

  .great-place.content-sec .section-title .full-content-title {
    max-width: 100%
  }

  .unlock-data {
    font-size: 24px !important
  }

  .btn-primary-circle i {
    margin-left: 10px
  }

  .homepageFixed .pin-spacer .images .image-block {
    top: -25px
  }
}

@media all and (min-width:1550px) {
  .center-content-banner {
    max-width: 1440px !important
  }
}

@media all and (max-width:1550px) {
  p.header-title a {
    font-size: var(--f18) !important
  }

  .solutionContct .btn-primary {
    max-width: 170px
  }

  .menuList-content ul.productList a {
    font-size: var(--f14) !important
  }

  .socialHeader-left .content p {
    font-size: var(--f18)
  }

  .formSide {
    padding: 40px
  }

  .socialHeader-left .content span {
    font-size: var(--f14)
  }

  .single-menuList {
    margin-bottom: 36px !important
  }

  .socialHeader-box {
    padding: 30px 36px
  }

  .socialHeader-right .socialImages a:not(:last-child) img {
    margin-right: 16px
  }

  .navbar-brand {
    max-width: 250px
  }

  .navbar .nav-link {
    padding: 33px 0 !important
  }

  .navbar .dropdown .nav-link::after {
    top: 40px
  }

  .footer-main .container,
  .navbar .container {
    max-width: 1170px !important
  }
  .footer .footer-content li:not(:last-child) {
    margin-bottom: 12px
  }

  .navbar .nav-link {
    font-size: 14px
  }

  .menuList-content .dropdown li::before {
    top: 7px
  }

  .navbar .navbar-nav .dropdown-menu {
    top: 80px
  }

  .inner-banner-content {
    top: 95px
  }

  .section {
    padding: 60px 0
  }

  .contactFaq {
    padding-top: 60px !important
  }

  .container {
    max-width: 1170px
  }

  .banner-content {
    position: relative;
    transform: scale(1);
    padding: 75px 0 30px;
  }

  .bannerImg .mobile1 {
    position: relative;
    left: 54px;
    margin-top: 150px;
    width: 209px
  }

  .bannerImg .mobile2 {
    width: 270px
  }

  .banner-content h1.banner-title strong {
    font-size: 63px;
    line-height: 79px
  }

  .banner-content h1.banner-title {
    font-size: 42px;
    line-height: 54px
  }

  .banner-cta {
    margin-top: 22px;
    position: relative
  }

  .banner-cta .btn {
    font-size: 12px
  }

  .btn-primary-circle i,
  .btn-white-circle i {
    max-width: 32px;
    height: 32px;
    margin-left: 7px
  }

  .main-section {
    height: 100vh
  }

  .content-sec .content-title .section-title p.full-content-title,
  .content-sec .section-title .full-content-title {
    font-size: 40px !important;
    line-height: 1.5 !important
  }

  .advatnages .advantges-content p,
  .projectintro-content p,
  .service-spectrum .content-title p,
  .tech p,
  .third-level-service-sec .content-title p {
    font-size: 20px !important;
    line-height: 26px !important
  }

  .text--sub-heading {
    font-size: 26px;
    line-height: 32px
  }

  .tabs-content-slider {
    left: 39px !important;
    margin-top: 0 !important
  }

  .tabs-content-slider p {
    font-size: 16px !important;
    line-height: 22px !important
  }

  .tabs-content-slider .btn-primary-circle {
    margin-top: 4px !important;
    font-size: 14px !important
  }

  .tabs-container .tabs .cards-why-choose .why-choose-content h3 {
    font-size: 17px !important;
    margin-bottom: 0 !important
  }

  .cards-why-choose {
    padding: 6px 8px 6px 19px !important
  }

  .tabs--loader {
    left: 5px !important;
    height: 20px !important;
    width: 2px !important
  }

  .portfolio-heading h4,
  .portfolio-heading p {
    font-size: 16px;
    color: var(--black)
  }

  .client-sec p.client-heading {
    font-size: 16px
  }

  .client-carousel {
    margin-top: 50px !important
  }

  .homeClient .client-carousel {
    margin-top: 0 !important
  }

  .testi-content {
    left: 110px;
    padding: 70px
  }

  .btn,
  .btn-primary-circle {
    font-size: 14px !important
  }

  .client-testi.action-cta {
    padding-top: 0 !important
  }

  .section.client-sec {
    padding-bottom: 34px
  }

  .texts .text-block {
    padding: 30px 48px 96px 48px !important
  }

  .fixedScroll-content h3 {
    font-size: 40px !important;
    line-height: 45px !important
  }

  .fixedScroll-content p {
    line-height: 1.4 !important
  }

  .btn-white-circle {
    font-size: 14px !important
  }

  .current-opening .header h2,
  .current-opening .header h3 {
    font-size: 34px !important;
    line-height: 48px
  }

  .current-opening .header h3 {
    margin-bottom: 40px
  }

  .current-opening .header p {
    font-size: 24px !important
  }

  .current-opening .header .section-title {
    font-size: 64px
  }

  .formWrapper .form-control {
    height: 50px;
    padding: 13px 25px
  }

  .fottercontentLeft {
    gap: 32px
  }

  .unlock-data {
    font-size: 19px !important
  }

  .bannerImg {
    margin-top: 30px
  }

  .scrollFixed .wrapper {
    max-width: 1170px
  }

  .great-place .content-sec .section-title .full-content-title {
    font-weight: 300
  }

  .section-title h3,
  .service-spectrum .section-title h3,
  .title-f60 {
    font-size: 42px;
    line-height: 54px
  }

  p.title-f60 {
    font-size: 42px !important;
    line-height: 54px !important
  }

  .text--sub-heading {
    font-size: 22px !important;
    line-height: 28px !important
  }

  .mt-77 {
    margin-top: 45px
  }

  .down-arrow {
    position: relative
  }

  .down-arrow img {
    max-width: 35px
  }

  .inner-banner-content h1.banner-title {
    font-size: 42px;
    line-height: 54px;
    margin-bottom: 12px
  }

  .inner-banner-content p.mob-p {
    margin-top: 0 !important
  }

  .inner-banner-content .banner-cta {
    margin-top: 26px
  }

  .inner-section .banner-tag img {
    max-width: 100px
  }

  .inner-section .banner-tag img:not(:last-child) {
    margin-right: 26px
  }

  .testi-content p {
    font-size: 23px;
    line-height: 30px
  }

  .blog-detail h4 {
    font-size: 20px !important;
    line-height: 28px !important
  }

  .blog-detail p {
    font-size: 14px !important
  }

  .images .image-block {
    width: 70% !important;
    height: 65% !important;
    right: 20% !important;
    top: -30px !important
  }

  .singleFixed-sec .images .image-block {
    top: -6px !important
  }

  .homepageFixed .images .image-block {
    top: 0 !important
  }

  .footer .footer-content h4 {
    font-size: 16px
  }

  .banner-backBtn svg {
    margin-left: 0 !important
  }

  .rotationBanner {
    height: 780px;
    background-position: -250px center
  }

  .reveal img {
    max-width: 550px
  }

  .rotationBanner .banner-image {
    right: 80px !important
  }

  .rotationBanner .banner-backBtn {
    margin-bottom: 24px
  }

  .portfolioBanner-leftContent .portfolio_banner-description {
    margin-top: 16px
  }

  .banner-info {
    margin-top: 26px
  }

  .banner-info .info-intro small {
    font-size: var(--f20)
  }

  .banner-info .info-intro span {
    font-size: var(--f18)
  }

  .portfolioBanner-rightContent .portfolio-desc-type {
    padding: 16px 0
  }

  .portfolioBanner-rightContent .portfolio-desc-type p {
    font-size: var(--f20)
  }

  .portfolioBanner-rightContent .portfolio-desc-type span {
    font-size: var(--f16);
    line-height: 26px
  }

  .solution-wrapper .title-f60 {
    margin-bottom: 16px
  }

  .solution-wrapper header p {
    font-size: var(--f20)
  }

  .solution-container header {
    padding-bottom: 32px
  }

  .solution-container .solution-singleContent {
    padding: 24px 0;
    max-width: 510px
  }

  .objective-content header.header h2 {
    margin-bottom: 0
  }

  .digital-tranform-content ul {
    padding-top: 56px
  }

  .digital-tranform-content ul li:not(:last-child) .digital-content-wrapper {
    margin-bottom: 20px;
    padding-bottom: 20px
  }

  .case-studiesBanner p {
    font-size: 26px !important
  }

  .digital-tranform-content h4 {
    font-size: 20px !important
  }

  .digital-tranform-content ul li .digital-content h5 {
    font-size: 22px !important
  }

  .digital-tranform-content ul li .digital-content p {
    font-size: 16px !important;
    line-height: 22px !important
  }

  .challengeHeading {
    left: 626px
  }

  .challenge-wrapper .animation-wrap.to-right {
    margin-left: 206px !important
  }

  .challengeImg {
    max-width: 560px;
    top: 0 !important
  }

  .challnge-scrollBox {
    margin-top: 120px
  }

  section.result-impact.challenge-wrapper .item {
    flex: 0 0 480px;
    height: calc(100vh - 420px)
  }

  .challenge-box.item .innerChallengeBox {
    max-width: 350px
  }

  .challenge-box.item {
    margin-top: 50px
  }

  .challengeBox-content h4,
  .solutionContent-wrapper header p {
    font-size: 22px !important;
    line-height: 26px !important
  }

  .challengeBox-content p,
  .result-impactContent p,
  .solution-wrapper .solution-singleContent p {
    font-size: 16px !important;
    line-height: 24px !important
  }

  .case-slider::before {
    height: 480px !important
  }

  .result-impact header {
    margin: 0 auto 30px !important
  }

  .result-impact header p,
  .result-impactContent h4 {
    font-size: 22px !important;
    margin-bottom: 10px !important
  }

  .result-impact header h3 {
    margin-bottom: 0
  }

  section.result-impact .item.resultImpact-lastBox {
    border: none;
    border-radius: 0;
    flex: 0 0 350px
  }

  .result-impactContent h4 {
    line-height: 1.4
  }

  .result-impact .row {
    margin-bottom: 60px
  }

  section.result-impact .item {
    height: calc(100vh - 260px)
  }

  .solution-wrapper .solution-singleContent h3 {
    font-size: 22px !important;
    line-height: 26px !important
  }

  .objImg {
    max-width: 500px;
    width: 100%
  }

  .case-slider .pbmit-tag-wrapper img,
  .singleImg img {
    max-width: 960px
  }

  .inner-banner-content {
    max-width: 1150px;
    margin: 0 auto
  }

  .service-content-wrapper .service-content h3,
  .service-content-wrapper .service-content h5 {
    font-size: 24px
  }

  .service-content-wrapper .service-content p {
    font-size: 16px;
    opacity: .7
  }

  .countValue.dots span img {
    top: 0
  }

  .bluescricle {
    top: unset;
    bottom: 100px;
    left: -100px
  }

  .darkbcircle {
    right: -170px;
    bottom: 100px;
    top: unset
  }

  .test-img {
    width: 120px;
    height: 120px;
    object-fit: cover
  }

  .sucess-stories .testi-slider.sucess-slider .testi-content p {
    font-size: 18px;
    line-height: 26px
  }

  .content-title p,
  .productWhy_choose .content-title p {
    font-size: 20px !important;
    line-height: 26px !important
  }

  .productWhy_choose .why-chosse-card p {
    font-size: 16px;
    line-height: 26px
  }

  .portfolio-details {
    padding-top: 0 !important
  }

  .testi-content h4 {
    font-size: 18px
  }

  .testi-content .col-md-2 p {
    font-size: 16px !important;
    line-height: 20px !important
  }

  .case-studiesBanner h1.banner-title,
  .info-intro {
    max-width: 600px !important
  }

  .home-mainBanner .banner_image {
    top: 34px !important
  }

  .solution-clientele {
    padding: 90px 0 !important
  }

  .background-blue .inner-banner-content h1.banner-title,
  .background-blue .splitting .char:after {
    font-size: 50px !important;
    line-height: 58px !important
  }

  .pos-right {
    background-position: right -3% center !important
  }

  .app-devMain header .title-f60 {
    font-size: 56px !important;
    line-height: 66px !important
  }

  .app-devMain header p {
    font-size: 32px !important;
    line-height: 40px !important
  }

  .app-devMain img {
    height: 800px !important
  }

  #appDev-form .banner-points .list-bullet {
    font-size: 13px !important;
    line-height: normal !important
  }

  .linkedSec-img-des {
    padding: 40px 60px !important
  }

  .linkedSec-img-des .header h3 {
    font-size: 44px !important;
    line-height: 50px !important
  }

  .linkedSec-img-des .header p {
    font-size: 16px !important;
    line-height: 22px !important
  }

  .solutions-formblock {
    padding-left: 14px !important
  }

  .bannerProduct-detail {
    padding-top: 48px !important
  }


  .portfolioOuter-sec .horizontal .animation-wrap.to-right {
    margin-left: 195px !important
  }

  .portfolioOuter-sec .ways-to-engage .horizontal .item {
    flex: 0 0 645px !important;
    max-width: 645px !important
  }

  .portfolioOuter-sec .challenge-wrapper .pin-wrap::before {
    display: none
  }

  .ways-to-engage .horizontal .item.fixedPortfolio-heading {
    flex: 0 0 365px !important;
    max-width: 365px !important
  }

  .port-detail .detailLeft .heading h4 {
    font-size: var(--f22) !important
  }

  .port-tag span {
    font-size: 12px !important
  }

  .port-detail .detailLeft .port-desc p {
    font-size: var(--f16) !important
  }


  .single_TechProduct .techImage {
    max-width: 120px;
    height: 120px
  }

  .single_TechProduct .techImage img {
    height: 100%
  }

  .homepageFixed .full-content-title {
    font-size: 42px !important;
    line-height: 54px !important
  }

  .home-mainBanner .banner-content {
    max-width: 550px !important
  }

  .sing_portfolio-detail .port-detail {
    border-radius: 15px !important;
    padding: 20px 20px 24px !important
  }

  .product-lestSide .productIcon {
    max-width: 60px
  }

  .scrollFixed {
    padding: 80px 0 !important
  }

  .btn {
    padding: 9px 16px
  }

  .btn svg {
    margin-left: 16px
  }

  .single_TechProduct span {
    font-size: var(--f16) !important
  }

  .product-lestSide .productName h4 {
    font-size: 28px !important
  }

  .inner-banner-content p {
    font-size: 20px
  }

  .content-sec span.sub-title {
    font-size: 36px
  }

  .value h4 {
    font-size: 24px
  }

  .tech-productBtn .btn {
    font-size: 18px !important
  }

  .single_TechProduct p {
    font-size: 16px !important
  }

  .portfolioOuter-sec .ways-to-engage .horizontal .item.lastFixed-port {
    flex: 0 0 360px !important;
    max-width: 360px !important
  }

  .nav-item .solution-gradientBox {
    padding: 32px !important
  }

  .nav-item .solution-gradientBox p,
  .solution-gradientBox.carrer-box p.carrer-heading {
    font-size: 36px !important;
    line-height: 48px !important;
    margin-bottom: 28px !important
  }

  .nav-item .solution-gradientBox .inner-content p {
    font-size: 26px !important;
    line-height: 36px !important;
    margin-bottom: 16px !important
  }

  .solutionInner .solution-singleProduct .solution-name p {
    font-size: var(--f18) !important;
    margin-bottom: 8px !important
  }

  .solutions-menuList .solutionInner .solution-singleProduct {
    margin-bottom: 28px !important
  }

  .solutions-menuList .socialHeader-right {
    padding-top: 24px
  }

  .solution-gradientBox.carrer-box p {
    font-size: var(--f18) !important;
    line-height: 28px !important;
    max-width: 535px
  }

  .solution-gradientBox.carrer-box .greatPlace-logo {
    max-width: 100px
  }

  .solution-gradientBox.carrer-box .header-navBtn {
    margin-top: 48px !important
  }

  .solutionInner .solution-singleProduct .solution-name span {
    font-size: var(--f14) !important
  }

  .right_side-slider .img-description .sldierBtn {
    margin: 18px 0
  }

  section.new-portPage .inner-banner-content h1.banner-title {
    margin: 24px auto 16px
  }

  .ourportfolio-section {
    padding: 40px 0
  }

  .portfolio-element-section {
    margin-top: 50px !important
  }

  section.new-portPage {
    padding: 75px 0 120px !important;
    height: 550px
  }

  .ourportfolio-section::before {
    top: 116px
  }

  .officeDetail-wrapper .office-details .details a,
  .officeDetail-wrapper .office-details .details p {
    font-size: var(--f18)
  }

  .solution-banner {
    height: 770px
  }

  .performance-sec .row .value {
    max-width: 550px
  }

  .key-functions h4,
  .performance-sec .why-chosse-card h4 {
    font-size: 24px
  }

  .performance-sec header p,
  .threeBoxsec header p {
    font-size: var(--f20);
    line-height: 28px
  }

  .performance-sec header p {
    max-width: 930px
  }

  .key-functions p,
  .solutionWhy_choose p {
    font-size: var(--f16)
  }

  .solutionContct header {
    max-width: 550px
  }

  .solutionGlobal-partners .content-title {
    max-width: 1026px
  }

  .threeBoxsec {
    padding-top: 120px
  }

  .solutionGlobal-partners::after {
    top: -320px
  }

  .inner-banner-custome {
    height: 550px
  }

  .contact-sec2 .formSide {
    padding: 0 32px
  }

  .tabbing-location-wrapper .nav-pills .nav-link {
    font-size: var(--f20)
  }

  .contact-banner-new .inner-content-row {
    margin-top: 74px
  }

  .advantage-banner-new,
  .culture-banner-new {
    background-position: top;
    background-size: cover;
    width: 100%
  }

  .productIcon img {
    max-width: 60px;
    height: 60px
  }

  .thankyou-wrapper {
    padding-top: 140px
  }

  .inner-section.app-devMain {
    height: 900px
  }

  .socialIcons li a {
    width: 26px;
    height: 26px
  }
}

@media all and (min-width:1440px) and (max-width:1599) {
  .container {
    max-width: 1160px
  }
}

@media(max-width:1366px) {
  .navbar .dropdown .nav-link::after {
    top: 38px
  }

  .inner-section.banner-section img {
    height: 485px
  }

  .inner-banner-content h1.banner-title {
    font-size: 55px;
    line-height: 65px
  }

  .home-mainBanner .banner_image {
    top: 30px !important
  }

  .banner-content {
    padding-top: 70px;
  }

  .home-mainBanner .banner-content .banner-cta a {
    width: auto
  }

  .banner-content h1.banner-title strong {
    line-height: 70px
  }

  .bannerImg .mobile1 {
    width: 185px;
    margin-top: 100px;
    left: 20px
  }

  .bannerImg .mobile2 {
    width: 200px;
    top: 30px;
    right: 190px
  }

  .current-opening .header .section-title {
    line-height: 48px
  }

  section.result-impact .item {
    height: calc(100vh - 150px)
  }

  .xsCircle {
    width: 223px;
    height: 223px;
    top: 140px;
    left: -100px
  }

  .digital-serviceCircle {
    left: inherit;
    right: -250px;
    top: 0
  }

  .third-level-service-sec .latest-service-wrapper {
    padding: 20px 30px;
    margin-bottom: 30px;
    min-height: 240px
  }

  .btn-primary-circle i,
  .btn-white-circle i {
    margin-left: 10px;
    max-width: 28px;
    height: 28px
  }

  .formBtn .btn-primary-circle i {
    width: 37px
  }

  .banner-cta .btn,
  .btn {
    font-size: 12px
  }

  .unlock-data {
    font-size: 18px !important
  }

  .tabs-content-slider p {
    line-height: 28px
  }

  .test-img {
    width: 90px;
    height: 90px
  }

  .solution-wrapper .solution-singleContent h3 {
    line-height: 28px !important
  }

  .portfolio-details {
    padding-top: 0
  }

  .banner-cta .btn {
    width: auto
  }

  .contact-banner-new .inner-content-row {
    margin-top: 85px
  }

  section.result-impact .item {
    height: calc(100vh - 225px)
  }

  section.result-impact .item.resultImpact-lastBox {
    flex: 0 0 200px
  }

  .navbar .navbar-nav .dropdown-menu {
    overflow-y: auto;
    height: 500px
  }

  .thankyou-wrapper {
    padding-top: 140px
  }

  .industry_horizontal.choose-automotiveCompany .title-f60 {
    font-size: 32px;
    line-height: normal
  }

  .industry_horizontal.choose-automotiveCompany .ways-to-engage p {
    font-size: var(--f16);
    max-width: 100%;
    line-height: 1.4
  }

  .ways-to-engage .engaged-boxImg {
    flex: 0 0 380px;
    max-width: 380px;
    margin-right: 100px
  }

  .choose-automotiveCompany .ways-to-engage .engagedContent h4 {
    font-size: 26px;
    line-height: 36px
  }
}

@media(min-width:991px) {
  .navbar-nav .dropdown-menu {
    min-width: inherit;
    width: 100%;
    padding: 30px 0 50px;
    border: none;
    margin: 0;
    display: block;
    opacity: 0;
    visibility: hidden;
    transition-duration: .5s;
    border-radius: 0
  }

  .navbar .dropdown.show>.dropdown-menu {
    margin: 0;
    padding: 30px 0 50px;
    border: none;
    border-radius: 0;
    opacity: 1;
    visibility: visible
  }
}

@media(max-width:991px) {
  .tab-content img {
    width: calc(100% - 10px)
  }
}

@media(min-width:768px) {
  .inner-section.banner-section.errorbanner img.errimg-web {
    display: block
  }

  .inner-section.banner-section.errorbanner img.errimg-mob {
    display: none
  }

  .error-banner-content .inner-content {
    padding-left: 50px
  }

  .flutter_tech.performance-sec .why-chosse-card {
    min-height: 125px;
  }
}

@media(max-width:767px) {
  .tabs .why-choose-content .list-content .video-customize {
    display: block
  }

  .service-spectrum .tabs-content-container.tabsimages-second {
    display: none
  }

  .tabs-container:before {
    height: 93%
  }

  .tabs-container .tabs .cards-why-choose .why-choose-content h3 {
    font-size: 16px
  }

  .tabs-container .tabs.active-tab .cards-why-choose .why-choose-content h3 {
    font-size: 22px
  }

  [data-scroll=out] {
    opacity: 1;
    will-change: transform, scale, opacity;
    transform: translateY(1rem) scale(.93);
    transition: all 1.5s cubic-bezier(.165, .84, .44, 1)
  }

  .why-choose-content {
    padding: 0 25px
  }

  .illustration {
    margin-left: 0
  }

  .splitting .char:after {
    visibility: visible;
    color: var(--primary_color);
    opacity: 0;
    transform: translateY(30%);
    transition: all .6s cubic-bezier(.175, .885, .32, 1.275);
    transition-delay: calc(.2s + (.02s * var(--char-index)))
  }

  [data-scroll=in] .char:after {
    opacity: 1;
    transform: translateY(0)
  }

  .current-opening .formWrapper form {
    z-index: 4
  }

  .text__wrapper.hidden {
    display: none
  }

  .text__wrapper {
    padding-left: 0;
    height: auto !important;
    opacity: 1 !important
  }

  .pin-spacer {
    width: 100% !important
  }

  .wrapper-scroll.relative {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    height: auto !important;
    max-height: unset !important;
    transform: unset !important;
    width: 100% !important;
    max-width: unset !important
  }

  .title__number {
    font-weight: 300;
    font-size: 18px
  }

  .scroll-accordion .title__number:before {
    content: "+";
    position: absolute;
    right: 0;
    top: 10px;
    font-size: 20px;
    line-height: 0
  }

  .scroll-accordion.accrordion-active .title__number:before {
    content: "-";
    position: absolute;
    right: 0;
    top: 10px;
    font-size: 30px;
    display: flex;
    align-items: center;
    line-height: 0
  }

  .scroll-accordion {
    padding: 7px 2rem;
    margin: 0 auto;
    margin-top: -7px
  }

  .accordion-section .content-title {
    margin-left: 0
  }

  .inner-section.banner-section.errorbanner img.errimg-web {
    display: none
  }

  .inner-section.banner-section.errorbanner img.errimg-mob {
    display: block;
    position: relative !important;
    height: auto
  }

  .inner-banner-content.error-banner-content .btn-primary-circle {
    justify-content: flex-start
  }

  .app-devMain {
    height: 1400px
  }

  .app-devMain.netCore-banner {
    height: 1160px;
    padding-bottom: 0 !important
  }

  .section.app-devImg {
    padding-bottom: 0 !important
  }

  .awardWrapper {
    padding: 0
  }

  .app-devMain header .title-f60 {
    font-size: 26px !important;
    line-height: 32px !important
  }

  .app-devMain .key-hights {
    padding-left: 0;
    margin-bottom: 24px
  }

  .app-devMain .container .row {
    margin: 0
  }

  .app-devMain .container {
    top: 60px !important
  }

  .app-devMain .solutions-formblock {
    padding-right: 0
  }

  .inner-section.app-devMain {
    height: 1450px
  }

  .portfolio-new.section {
    padding-left: 32px !important;
    padding-right: 32px !important
  }

  .portfolio-new .fixedPortfolio-heading {
    margin-left: 0 !important;
    margin-bottom: 32px
  }

  .flutter_tech.performance-sec {
    padding-bottom: 0 !important;
  }
}

.blurimg img,
.blurimg video {
  filter: blur(15px)
}

#intentPopup .modal-content {
  border-radius: 15px
}

#intentPopup .popup-content {
  max-width: 800px;
  width: 100%
}

#intentPopup .popup-content {
  padding: 48px 24px;
  position: relative;
  background: transparent linear-gradient(87deg, #dbeafd 0, #d0fae6 100%) 0 0 no-repeat;
  border-radius: 15px
}

.popup-content {
  text-align: center
}

.popup-content h4 {
  font-size: 42px;
  font-weight: var(--font-weight4);
  margin-bottom: 28px;
  color: var(--black)
}

.popup-content p {
  font-size: var(--f24);
  margin-bottom: 16px;
  color: var(--black);
  font-weight: 500
}

.popup-content span {
  font-size: var(--f22);
  color: var(--content)
}

.popupBtn {
  margin-top: 48px
}

.popupBtn .btn-gradient {
  background: transparent linear-gradient(257deg, #008afc 0, #c231ab 100%) 0 0 no-repeat;
  padding: 16px 26px;
  font-size: 16px !important;
  border-radius: 50px;
  color: var(--white)
}

.closeicon {
  position: absolute;
  top: 10px;
  right: 20px;
  cursor: pointer
}

.popup-section .exit-intent-popup {
  display: none
}

.popup-section .exit-intent-popup.visible {
  display: block
}

.popup-section {
  width: 100%
}

.popup-section .popup-wrapper {
  z-index: 999;
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .6)
}

.popup-section .popup-wrapper .popWrap {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center
}

.track-project-wrapper .heading-box {
  position: fixed;
  bottom: 348px;
  right: -116px;
  background: var(--link-blue);
  color: var(--white);
  padding: 16px 24px;
  transform: rotate(-90deg);
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  z-index: 4
}

.portfolio-new .fixedPortfolio-heading {
  margin-left: 185px
}

.last-newPortfolio .port-detail {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center
}

.portfolioNew .swiper-button-prev {
  transform: rotate(0)
}

.portfolioNew .swiper-button-next,
.portfolioNew .swiper-button-prev {
  background: #fff;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: .7
}

.portfolioNew .swiper-button-next:after,
.portfolioNew .swiper-button-prev:after {
  font-size: 18px;
  color: var(--black) !important
}

.portfolioNew .swiper-button-next:hover,
.portfolioNew .swiper-button-prev:hover {
  opacity: 1
}

.grecaptcha-badge {
  display: none;
}

.stats-column {
  margin-top: 90px;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 20px;
  padding: 25px 0;
}

.stats-column .column {
  padding: 0 0 0 75px;
  position: relative;
  flex: 0 0 220px;
  max-width: 220px;
}

.stats-column .column img {
  position: absolute;
  top: 10px;
  left: 0;
  max-width: 65px;
}

.stats-column .column h3 {
  color: var(--black);
  font-size: 36px;
  font-weight: var(--font-weight6);
}

.stats-column .column p {
  margin: 0;
  font-size: var(--f16);
  line-height: 26px;
  font-weight: 300;
}

.stats-column .column:after {
  position: absolute;
  content: '';
  right: -36%;
  top: 0;
  width: 1px;
  height: 100%;
  background-color: rgba(0, 0, 0, .2);
}

.stats-column .column:last-child:after {
  display: none;
}

.track-project-wrapper {
  display: none;
}

.industrySec.background-blue {
  padding-bottom: 60px !important;
}

.industrySec.background-blue .title-f60 {
  color: var(--white);
}

.industrySec.background-blue p {
  color: var(--white);
  font-size: var(--f16);
  opacity: .7;
}

.industrySec.background-white {
  padding-bottom: 60px !important;
}

.industrySec.background-white .title-f60 {
  color: var(--black);
}

.industrySec.background-white p {
  color: var(--black);
  font-size: var(--f16);
  opacity: .7;
}

.industrySec.background-white .industry-column-wrapper .industryName span {
  color: var(--black);
}