

a.menu-icon {
  display: none;
}

.headerSection .headerContent .logo a img {
  max-width: 12em;
  width: 100%;
}

/* =============== common css ===============  */

h3 {
  font-size: 2.7em;
  line-height: 1.2;
  text-align: left;
  font-weight: 500;
}

h3 span {
  text-transform: uppercase;
  color: var(--theme-color);
  font-size: 1.8em;
  margin: 0.2em 0 0;
  line-height: 1em;
  display: block;
  -webkit-text-stroke: 2px;
  -webkit-text-fill-color: var(--white-color);
}

h3 span.themeColor {
  line-height: 1;
}

h3 span.noOutline {
  -webkit-text-stroke: 0;
  -webkit-text-fill-color: transparent;
  margin: 0;
}

h3 span.noOutline.whiteColor {
  -webkit-text-fill-color: var(--white-color);
}

/*  =============== GridBox ===============   */

.gridBox {
  display: grid;
  grid-template-columns: 50% 50%;
  grid-column-gap: 2em;
  align-items: flex-start;
}

.block {
  display: block;
}

.gridBox.alignCenter {
  align-items: center;
}

.gridBox.col1 {
  grid-template-columns: 100%;
  grid-row-gap: 4em;
}

.gridBox.col1-3 {
  grid-template-columns: 1fr 2fr;
  grid-column-gap: 4em;
}

.gridBox.col1-3.reverse {
  grid-template-columns: 2fr 1fr;
}

.gridBox.col1-3.reverse .ug-image {
  order: 2;
}

.gridBox.col1 h3,
body.casestudies-detail h3 {
  margin: 0 0 0.7em;
}


.gridBox.col1 {
  grid-row-gap: 0;
}

.gridBox.withImage {
  align-items: center;
}

.gridBox.withImage .rightContent {
  text-align: right;
}

/* =============== Life at moveo => Magnific Popup CSS  =============== */

.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box;
}

.mfp-container:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: pointer;
}

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  color: #ccc;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}

.mfp-preloader a {
  color: #ccc;
}

.mfp-preloader a:hover {
  color: #fff;
}

.mfp-s-ready .mfp-preloader {
  display: none;
}

.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: #fff;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace;
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
}

.mfp-close:active {
  top: 1px;
}

.mfp-close-btn-in .mfp-close {
  color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #fff;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #ccc;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
  margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
}

.mfp-arrow:before,
.mfp-arrow:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:after {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}

.mfp-arrow:before {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}

.mfp-arrow-left {
  left: 0;
}

.mfp-arrow-left:after {
  border-right: 17px solid #fff;
  margin-left: 31px;
}

.mfp-arrow-left:before {
  margin-left: 25px;
  border-right: 27px solid #3f3f3f;
}

.mfp-arrow-right {
  right: 0;
}

.mfp-arrow-right:after {
  border-left: 17px solid #fff;
  margin-left: 39px;
}

.mfp-arrow-right:before {
  border-left: 27px solid #3f3f3f;
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
  top: -40px;
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}

/* Main image in popup */

img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}

/* ===============  The shadow behind the image =============== */

.mfp-figure {
  line-height: 0;
}

.mfp-figure:after {
  content: "";
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}

.mfp-figure small {
  color: #bdbdbd;
  display: block;
  font-size: 12px;
  line-height: 14px;
}

.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #f3f3f3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

/* ====HEADER===========================================================*/

.headerSection {
  padding: 2.125em 0;
}

.headerSection .headerContent,
.headerSection .headerContent nav>ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.headerSection .headerContent nav li a {
  font-size: 1.1em;
  color: var(--raisinBlack-color);
  font-weight: 500;
  display: block;
  padding: 0 0.889em;
}

.headerSection .headerContent nav li a:hover,
.headerSection .headerContent nav li.active a,

.about-us .headerSection .headerContent nav li.nav-about a,
.services .headerSection .headerContent nav li.nav-services a,
.white-label .headerSection .headerContent nav li.white-label a,
.process .headerSection .headerContent nav li.nav-process a,
.work .headerSection .headerContent nav li.nav-work a,
.testimonials .headerSection .headerContent nav li.nav-work a,
.case-studies .headerSection .headerContent nav li.nav-work a,
.blog .headerSection .headerContent nav li.nav-blog a,
.resourcesWrap .headerSection .headerContent nav li.nav-blog a{
  color: var(--theme-color);
}


.headerSection .headerContent nav ul li.nav-contact a {
  color: var(--black-color);
  background-color: var(--theme-color);
  border-radius: 5px;
  font-weight: 400;
  text-transform: uppercase;
  padding: 0.75em 2em;
  margin: 0 0 0 2.5em;
  border: 2px solid transparent;
}

.headerSection .headerContent nav ul li.nav-contact a:hover {
  background-color: var(--dark-yellow-color);
  border-color: var(--dark-yellow-color);
}

.headerSection .headerContent nav ul li {
  position: relative;
}

.headerSection .headerContent nav ul li .dropdown {
  position: absolute;
  left: 0;
  top: 100%;
  width: 20em;
  padding: 1em 0 0;
  opacity: 0;
  visibility: hidden;
  margin: 2em 0 0;
  z-index: 9;
}

.headerSection .headerContent nav ul li:hover .dropdown {
  opacity: 1;
  visibility: visible;
  top: 100%;
  margin: 0;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList {
  margin: 0;
  padding: 0.5em 1.5em;
  background: var(--raisinBlack-color);
  border: none;
  border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  position: relative;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li a {
  min-width: 5em;
  color: var(--white-color);
  display: block;
  border-bottom: 0.05em solid rgba(255, 255, 255, 0.2);
  padding: 0.4em 0;
  font-size: 1.07em;
  font-weight: 400;
  line-height: 2;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li:last-child a {
  border: none;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList:after {
  bottom: 100%;
  left: 15%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: transparent;
  border-bottom-color: var(--night-rider);
  border-width: 0.7em;
  margin-left: -0.7em;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li .subDropdown ul.dropdownList:after {
  display: none;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li a:hover {
  color: var(--theme-color);
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li .subDropdown {
  position: relative;
  padding: 0.8em 0 0.8em 1em;
  width: auto;
  background-color: rgba(0, 0, 0, 0.2);
  margin: 0 -1.5em;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li .subDropdown .dropdownList {
  background-color: transparent;
  padding: 0;
}

.headerSection .headerContent nav ul li .dropdown ul.dropdownList li .subDropdown .dropdownList li a {
  padding: 0.5em 0.5em 0.5em 1.5em;
  font-size: 1em;
  line-height: 1.5em;
}

/* ====FOOTER SECTION===========================================================*/

.footerSection .footerTopSection {
  background-color: var(--white-color);
  padding: 4em 0;
  margin: 0;
}

.footerSection h2 {
  font-size: 3em;
  color: var(--raisinBlack-color);
  font-weight: 400;
  line-height: 1.3;
  text-align: left;
  position: relative;
}

.footerSection h2 span {
  font-weight: 600;
}

.footerSection h2:after {
  content: "";
  position: absolute;
  background-color: var(--gainsboro-color);
  display: block;
  width: 5em;
  height: 0.1em;
  margin: 0.3em 0 0;
}

.footerSection .footerTopSection .footerTopContent .footerGrid {
  display: grid;
  grid-template-columns: 1.5fr 2fr;
  grid-column-gap: 9em;
  align-items: center;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox h3 {
  font-weight: 700;
  font-size: 1.75em;
  color: var(--black-color);
  text-align: left;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox h3:after {
  content: "";
  background-color: var(--gainsboro-color);
  height: 5px;
  width: 2em;
  margin: 0.964em 0 1.5em;
  display: block;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox h5 {
  font-weight: 700;
  font-size: 1.5em;
  color: var(--black-color);
  text-align: left;
  margin: 0 0 0.5em;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox p {
  font-family: var(--proximaNova-font);
  font-size: 1.5em;
  color: var(--black-color);
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox h4 {
  font-weight: 400;
  font-size: 1.75em;
  color: var(--black-color);
  text-align: left;
  margin: 0 0 0.5em;
}
.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox h4 img{
  width: 1.15em;
  margin-right: 0.625rem;
}
.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox ul a {
  font-weight: 700;
  font-size: 1.5em;
  color: var(--black-color);
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox ul a:hover {
  color: var(--theme-color);
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-column-gap: 1.25em;
  margin: 1.75em 0 0;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset input[type="email"] {
  border: 1px solid var(--nobel-color);
  border-radius: 10px;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset input[type="submit"] {
  text-indent: -9999px;
  background-image: url(../images/send.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 2.5em;
  height: auto;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox .awardList {
  margin: 3.438em 0 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 2.5em;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox .awardList li img {
  max-width: 12em;
  width: 100%;
  object-fit: cover;
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox ul.letsTalkBox {
  display: flex;
  justify-content: space-between;
}
.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox ul.letsTalkBox li{
  display: flex;
  flex-direction: column;
  grid-gap: 1em;
  border-left: 2px solid #F6C006;
  padding-left: 1.875em;
}
.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox ul.letsTalkBox li h4{
  margin: 0;
}
.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox ul.letsTalkBox li .connect-way{
  display: flex;
  flex-wrap: wrap;
  grid-gap: 1em;
}
.footerSection .footerMiddleSection {
  background-color: var(--raisinBlack-color);
  padding: 2.5em 0;
}

.footerSection .footerMiddleSection .footerMiddleContent .socialBlock {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 1.75em;
}

.footerSection .footerMiddleSection .footerMiddleContent .socialBlock li a {
  display: inline-block;
  width: 3em;
  height: 3em;
  background-color: var(--black-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.footerSection .footerMiddleSection .footerMiddleContent .socialBlock li a img {
  height: 1.5em;
  object-fit: contain;
}

.footerSection .footerMiddleSection .footerMiddleContent .socialBlock li a:hover {
  background-color: var(--theme-color);
}

.footerSection .footerMiddleSection .footerMiddleContent .socialBlock li+li {
  margin: 0 0 0 1.375em;
}

.footerSection .footerMiddleSection .footerMiddleContent .footerNav ul {
  display: flex;
  justify-content: center;
  align-items: center;
}

.footerSection .footerMiddleSection .footerMiddleContent .footerNav ul li {
  display: flex;
  align-items: center;
}

.footerSection .footerMiddleSection .footerMiddleContent .footerNav ul li:not(:last-child):after {
  content: "";
  background-color: var(--white-color);
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  display: inline-block;
  margin: 0 1em;
}

.footerSection .footerMiddleSection .footerMiddleContent .footerNav ul li a {
  font-weight: 400;
  font-size: 1.25em;
  text-transform: capitalize;
  color: var(--white-color);
}

.footerSection .footerMiddleSection .footerMiddleContent .footerNav ul li a:hover {
  color: var(--theme-color);
}

.footerSection .footerBottomSection {
  background-color: var(--nightRider-color);
  padding: 1.25em 0;
}

.footerSection .footerBottomSection .footerBottomContent span.copyright {
  font-weight: 400;
  font-size: 1.125em;
  color: var(--white-color);
  line-height: 1.3;
}


/* ====INNER PAGE BANNER===========================================================*/

.innerBannerSection {
  background-color: var(--theme-color);
  padding: 2em 0;
  margin: 0 0 6em;
  position: relative;
  overflow: hidden;
  min-height: 300px;
  display: flex;
  align-items: center;
}

.innerBannerSection .innerBannerContent h1 {
  color: var(--white-color);
  font-size: 3.7em;
  font-weight: 500;
  text-align: center;
  line-height: 1.3;
}

.innerBannerSection .innerBannerContent p {
  color: var(--raisinBlack-color);
  padding: 0.2em 0 0;
  text-align: center;
  font-size: 1.5em;
  font-weight: 400;
  /* margin: 0.5em 0 0; */
  text-align: center;
  line-height: 1.4;
}

/* ====INNER SUB SECTION===========================================================*/

.innerSubSection h2 {
  font-size: 1.7em;
  font-weight: 500;
  text-align: left;
  margin-bottom: 1em;
  line-height: 1.5;
}

.innerSubSection>p {
  font-size: 1.4em;
  font-weight: 400;
  line-height: 1.8;
  padding: 0;
  padding-bottom: 2em;
  text-align: left;
}

.innerSubSection p:not(.innerSpacing):last-child {
  padding-bottom: 0;
}

.greyBgSection {
  background-color: #f5f9fc;
}

.themeBgSection {
  background-color: var(--theme-color);
}

/* ==ABOUT US PAGE===========================================================*/

.pssSection .innersubContent .gridBox {
  align-items: center;
}

.pssSection .leftContent h3 span {
  display: inline;
}

.pssSection .gridBox {
  grid-template-columns: 1fr 3fr;
}

.pacSection .gridBox {
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 2em;
}

.pacSection .gridBox .pacBox {
  background: linear-gradient(0deg, var(--white-color), var(--white-color));
  border: 0.780392px solid var(--linkWater-color);
  border-radius: 10px;
  text-align: center;
  position: relative;
  padding: 2em 2.5em;
  height: 100%;
}

.pacSection .gridBox .pacBox .pacIcon {
  background: url(../images/pac-sprite.png) no-repeat;
  width: 7em;
  height: 7em;
  margin: 0 auto 1.5em;
  background-size: cover;
}

.pacSection .gridBox .pacBox:first-child .pacIcon {
  background-position: left 0;
}

.pacSection .gridBox .pacBox:nth-child(2) .pacIcon {
  background-position: center 0;
}

.pacSection .gridBox .pacBox:last-child .pacIcon {
  background-position: right 0;
}

.pacSection .gridBox .pacBox h4 {
  font-size: 2em;
  font-weight: 600;
}

.pacSection .gridBox .pacBox p {
  font-size: 1.3em;
  text-align: center;
  color: var(--raisinBlack-color);
  padding: 0;
  line-height: 1.7;
  margin: 1.5em 0 0;
}

.pacSection .gridBox .pacBox p:after {
  content: "";
  width: 3em;
  height: 0.2em;
  background-color: var(--white-color);
  display: block;
  margin: 0.5em auto 0;
}

.pacSection .gridBox .pacBox:hover p:after {
  width: 4em;
}

.pacSection .gridBox .pacBox {
  position: relative;
  overflow: hidden;
}

.teamSection .teamContent .teamGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 1.5em;
  grid-row-gap: 6em;
}

.teamSection .teamContent .teamGrid .teamBox .teamHolder h3 {
  color: var(--white-color);
  font-size: 1.3em;
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
}

.teamSection .teamContent .teamGrid .teamBox {
  position: relative;
  -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, 0.48);
  -khtml-box-shadow: 0 0 7px rgba(0, 0, 0, 0.48);
  -moz-box-shadow: 0 0 7px rgba(0, 0, 0, 0.48);
  -ms-box-shadow: 0 0 7px rgba(0, 0, 0, 0.48);
  -o-box-shadow: 0 0 7px rgba(0, 0, 0, 0.48);
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.48);
  border-radius: 10px;
}

.teamSection .teamContent .teamGrid .teamBox .teamHolder {
  position: absolute;
  bottom: -44px;
  left: 30px;
  right: 30px;
  -webkit-box-shadow: 0 4px 7px rgba(192, 192, 192, 0.3);
  -khtml-box-shadow: 0 4px 7px rgba(192, 192, 192, 0.3);
  -moz-box-shadow: 0 4px 7px rgba(192, 192, 192, 0.3);
  -ms-box-shadow: 0 4px 7px rgba(192, 192, 192, 0.3);
  -o-box-shadow: 0 4px 7px rgba(192, 192, 192, 0.3);
  box-shadow: 0 4px 7px rgba(192, 192, 192, 0.3);
  -webkit-transition: all 220ms linear 0ms;
  -khtml-transition: all 220ms linear 0ms;
  -moz-transition: all 220ms linear 0ms;
  -ms-transition: all 220ms linear 0ms;
  -o-transition: all 220ms linear 0ms;
  transition: all 220ms linear 0ms;
}

.teamSection .teamContent .teamGrid .teamBox .teamHolder .teamHolderInner {
  position: relative;
  background-color: #fff;
  padding: 1em;
}

.teamSection .teamContent .teamGrid .teamBox .teamHolder .teamHolderInner {
  width: 100%;
  height: 100%;
  background-image: -webkit-linear-gradient(left, #f6c006, #9b6f45);
  background-image: -moz-linear-gradient(left, #f6c006, #9b6f45);
  background-image: -ms-linear-gradient(left, #f6c006, #9b6f45);
  background-image: -o-linear-gradient(left, #f6c006, #9b6f45);
  background-image: linear-gradient(left, #f6c006, #9b6f45);
}

.teamSection .teamContent .teamGrid .teamBox:hover .teamHolder .teamHolderInner:after {
  transform: scaleY(1);
  z-index: 1;
}

.teamSection .teamContent .teamGrid .teamBox .teamHolder span.designation {
  display: block;
  font-size: 1.1em;
  font-weight: 400;
  color: var(--white-color);
  text-align: center;
  margin: 0.5em 0 0;
}

.teamSection .teamContent .teamGrid .teamBox .teamFeatured {
  height: 100%;
}

.teamSection .teamContent .teamGrid .teamBox .teamFeatured img {
  width: 100%;
  height: 100%;
  border-radius: 10px;
}

.teamSection .teamContent .teamGrid .teamBox .teamHolder h3,
.teamSection .teamContent .teamGrid .teamBox .teamHolder .designation {
  position: relative;
  z-index: 2;
}

/* ====JOBS===========================================================*/

.servicesboxes {
  background: #f5f9fc;
  padding: 10em 0;
}

.servicesboxes.jobsbox .box {
  padding: 4.5em;
}

.jobsbox .servicesheading {
  margin: 0 0 0.3em;
}

.jobsbox.servicesboxes .box .righttext {
  width: 57%;
}

.jobsbox.servicesboxes .box .leftheading {
  width: 40%;
}

.servicesboxes .box {
  background: #fff;
  padding: 6em;
  position: relative;
  z-index: 1;
  margin: 0 0 8.125em;
}

.servicesboxes .box:before {
  content: "";
  position: absolute;
  left: -2em;
  top: 2.875em;
  display: block;
  z-index: 0;
  background: url(../images/servicebefore.png) no-repeat;
  width: 2em;
  height: 16.25em;
  background-size: 100%;
}

.servicesboxes .box:after {
  content: "";
  position: absolute;
  right: 1.5em;
  top: -1em;
  display: block;
  z-index: 0;
  background: url(../images/serviceafter.png) no-repeat;
  width: 24.68em;
  height: 1em;
  background-size: 100%;
}

.jobsbox.servicesboxes .box .leftheading {
  width: 40%;
}

.jobsbox.servicesboxes .box .righttext {
  width: 57%;
}

.leftheading {
  float: left;
}

.righttext {
  float: right;
}

.orange-button {
  background: var(--theme-color) none repeat scroll 0 0;
  border-radius: 0.1em;
  color: var(--black-color);
  display: inline-block;
  font-size: 1.375em;
  font-weight: 500;
  margin-top: 1.5em;
  padding: 0.95em 4.3em 0.85em;
  text-transform: uppercase;
  vertical-align: middle;
  border: none;
  cursor: pointer;
  width: auto;
  margin-top: 0;
}

.orange-button:hover {
  background-color: var(--dark-yellow-color);
  color: var(--black-color);
}

.servicesheading {
  font-size: 3em;
  color: var(--raisinBlack-color);
  font-weight: 600;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.3em;
  transition: 0.2s linear;
  -webkit-transition: 0.2s linear;
  text-align: left;
}

/* ====LIST===========================================================*/

.listingpara {
  display: grid;
  grid-template-columns: 1fr;
  grid-column-gap: 3em;
  margin: 1em 0 0;
}

.listingpara.withBtmMargin,
.withBtmMargin {
  margin: 0 0 1.5em;
}


.listingpara li {
  font-size: 1.2em;
  line-height: 1.8em;
  color: var(--raisinBlack-color);
  padding: 0 0 0 2em;
  display: block;
  position: relative;
  line-height: 1.6em;
  margin-bottom: 1em;
  text-align: left;
}

.listingpara>li>a {
  font-weight: 500;
}

.listingpara.list-grid {
  padding-bottom: 6em;
}

.listingpara.list-grid.col-2 {
  grid-template-columns: 1fr 1fr;
}

.listingpara.list-grid.col-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

.listingpara li:before {
  content: "";
  background: url(../images/list-arrow.png) no-repeat 0 0;
  position: absolute;
  width: 1em;
  height: 1em;
  right: 100%;
  background-size: 100% 100%;
  top: 5px;
  left: 0;
}

/* ====JOBS===========================================================*/

.jobSection .jobContent .jobListing .jobBox .jobTitle h2 {
  font-size: 2em;
  font-weight: 500;
  color: var(--raisinBlack-color);
  margin: 0 0 0.7em;
}

.jobSection .jobContent .jobListing .jobBox .jobTitle h2::after {
  content: "";
  background-color: var(--theme-color);
  width: 0;
  height: 0.1em;
  display: block;
  transition: width 0.5s ease-in-out;
}

.jobSection .jobContent .jobListing .jobBox:hover .jobTitle h2:after {
  width: 4em;
}

.jobSection .jobContent .jobListing .jobBox:hover h2,
.jobSection .jobContent .jobListing .jobBox:hover p,
.jobSection .jobContent .jobListing .jobBox:hover .listingpara li {
  color: var(--white-color);
}

.jobSection .jobContent .jobListing .jobBox .jobTitle p {
  font-size: 1.25em;
  text-align: center;
  color: var(--greyChateau-color);
  padding: 0;
  line-height: 1.1;
  margin: 0.5em 0 0;
  text-align: left;
}

.jobSection .jobContent .jobListing .jobBox::before {
  content: "";
  height: 0;
  width: 100%;
  position: absolute;
  background: transparent;
  left: 0px;
  bottom: 0px;
  right: 0px;
}

.jobSection .jobContent .jobListing .jobBox:hover:before {
  height: 100%;
  background: var(--raisinBlack-color);
}

.jobSection .jobContent .jobListing .jobBox:after {
  content: "";
  background-color: var(--theme-color);
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  clip-path: circle(18% at 100% 0);
}

.jobSection .jobContent .jobListing .jobBox:hover:after {
  content: none;
}

.jobSection .jobContent .jobListing .jobBox:hover .jobIcon {
  display: none;
}

.jobSection .jobContent .jobListing .jobBox .jobTitle .jobIcon {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 20;
}

.jobSection .jobContent .jobListing .jobBox .jobTitle .jobIcon img {
  max-width: 3.5em;
  width: 100%;
}

.jobSection .jobContent .jobListing .jobBox .jobTitle .themeButton:hover {
  background-color: var(--white-color);
  color: var(--black-color);
}

.jobSection .jobContent .jobListing .jobBox .jobTitle .themeButton:hover:before {
  background-color: var(--theme-color);
}

/* ====LIFE AT MOVEO===========================================================*/

.lifemoveogallery ul {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 1.5em;
  grid-row-gap: 1.5em;
}

.lifemoveogallery ul li img {
  max-width: 100%;
  width: 100%;
  height: 16em;
  border-radius: 10px;
  object-fit: cover;
}

.lifemoveogallery ul li .open_gallery {
  display: block;
  background: url(../images/ajax-loader.gif) no-repeat;
  background-position: center center;
  padding: 0 0.625em;
  /* height: 17.1em; */
  overflow: hidden;
  font-size: 1em;
}

/* ====SERVICES===========================================================*/

.serviceGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 2em;
  grid-row-gap: 2em;
}

.serviceGrid .serviceBox a {
  background: transparent;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  padding: 2em;
  position: relative;
  border: 0.780392px solid var(--linkWater-color);
  box-shadow: 2px 18px 19px rgba(0, 0, 0, 0.0568728);
  border-radius: 10px;
  display: inline-block;
  width: 100%;
  height: 100%;
}

.serviceGrid .serviceBox a .serviceImg {
  text-align: center;
  margin: 0 auto 2em;
  height: 10em;
  width: 7em;
  background-image: url(../images/services-sprite.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: cover;
  display: block;
}

.serviceGrid .serviceBox a .serviceImg.icon1 {
  background-position: 0 0;
}

.serviceGrid .serviceBox a .serviceImg.icon2 {
  background-position: -11em 0;
}

.serviceGrid .serviceBox a .serviceImg.icon3 {
  background-position: -19em 0;
  width: 14em;
}

.serviceGrid .serviceBox a .serviceImg.icon4 {
  background-position: -33em 0;
}

.serviceGrid .serviceBox a .serviceImg.icon5 {
  background-position: -45em 0;
}

.serviceGrid .serviceBox a .serviceImg.icon6 {
  background-position: -56em 0;
}

.serviceGrid .serviceBox a .serviceImg.icon7 {
  background-position: -67em 0;
}

.serviceGrid .serviceBox a h2 {
  color: var(--theme-color);
  font-size: 1.7em;
  font-weight: 500;
  margin: 0 0 0.7em;
  text-align: center;
}

.serviceGrid .serviceContent p {
  font-size: 1.2em;
  line-height: 1.7;
  text-align: center;
  padding-bottom: 0;
}

/* ====QUOTE SECTION===========================================================*/

.quoteSection {
  background-color: var(--theme-color);
}

.quoteSection .quoteContent {
  padding: 3em 0;
}

.quoteSection .quoteContent .quote i {
  font-size: 5em;
  color: var(--white-color);
  opacity: 0.5;
}

.quoteSection .quoteContent {
  position: relative;
}

.quote.center {
  text-align: center;
  margin: 0 0 0.1em;
}

.quoteTitle {
  font-size: 2em;
  font-weight: 400;
  text-align: center;
  line-height: 1.3;
}

.quoteTitle span.bold {
  font-weight: 500;
}

/* ===============  Gatsby page icons ===============  */

.vghicon h2,
.vgsicon li {
  position: relative;
}

.vghicon h2:before,
.vgsicon li:before {
  content: "";
  position: absolute;
  width: 2em;
  height: 2em;
  right: 100%;
  background-size: 2em;
  background-repeat: no-repeat;
  top: 0;
  margin: 0 1em 0 0;
}

.vgsicon li:before {
  width: 1.5em;
  height: 1.5em;
  margin: 0;
  background-size: contain;
}

.vghicon h2.fast:before {
  background-image: url(../images/booking.png);
}

.vghicon h2.seo:before {
  background-image: url(../images/seo.png);
}

.vghicon h2.datai:before {
  background-image: url(../images/data-integration.png);
}

.vghicon h2.userex:before {
  background-image: url(../images/userr.png);
}

.vghicon h2.hostm:before {
  background-image: url(../images/maintenance.png);
}

.vghicon h2.hsecure:before {
  background-image: url(../images/shield.png);
}

.vgsicon li.stack:before {
  background-image: url(../images/stack.png);
}

.vgsicon li.snapchat:before {
  background-image: url(../images/snapchat.png);
}

.vgsicon li.tinder:before {
  background-image: url(../images/tinder.png);
}

.vgsicon li.clubhouse:before {
  background-image: url(../images/clubhouse.png);
}

.vgsicon .revolut:before {
  background-image: url(../images/Revolut.png);
}

.vgsicon li.makit:before {
  background-image: url(../images/MAKit.png);
}

.vgsicon .oxylabs:before {
  background-image: url(../images/oxylab.png);
}

.vgsicon li.affirm:before {
  background-image: url(../images/Affirm.png);
}

.vghicon h2.progressivewa:before {
  background-image: url(../images/progressivewa.png);
}

.vghicon h2.staticsite:before {
  background-image: url(../images/staticsite.png);
}

.vghicon h2.customapp:before {
  background-image: url(../images/customapp.png);
}

.vghicon h2.enterprice:before {
  background-image: url(../images/enterprice.png);
}

/* ===============  Back to top button ===============  */

.backtop-button {
  position: fixed;
  bottom: 50px;
  right: 30px;
  height: 50px;
  width: 50px;
  background: var(--theme-color);
  border-radius: 50%;
  text-align: center;
  line-height: 1.5em;
  color: #fff;
  font-size: 32px;
  opacity: 0;
  display: none;
  z-index: 2;
}

.backtop-button.show {
  opacity: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.backtop-button.show:hover {
  color: var(--black-color);
}

.watch-slider {
  margin: 0;
  display: block;
  position: relative;
}

.weather-calcy {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.col-cell {
  display: table-cell;
  vertical-align: middle;
  padding: 0 2em;
}

.weather-calcy .col-cell.weather-calcy-right {
  text-align: right;
}

.weather-calcy .weather-calcy-right img {
  max-width: 30em;
  width: 100%;
}

.weather-calcy .weather-calcy-left h3 {
  font-size: 2.5em;
  color: var(--theme-color);
  font-weight: 500;
  text-transform: uppercase;
  margin: 0 0 0.3em;
  text-align: left;
}

.weather-calcy .weather-calcy-left p {
  line-height: 1.6em;
  margin: 0 0 1.6em;
}

.weather-calcy-feature {
  margin: 0;
}

.weather-calcy-feature h4 {
  color: #232323;
  font-size: 1.8em;
  text-align: left;
}

.calc-feature {
  margin: 2em 0 2.5em;
  width: 22em;
}

.calc-feature img {
  width: 100%;
}

.watch-slider .bx-controls-direction {
  display: none;
}

.weather-app-store {
  margin: 0;
}

.weather-app-store a {
  display: inline-block;
  width: 14em;
}

.weather-app-store a img {
  width: 100%;
}

.bx-pager.bx-default-pager {
  text-align: center;
}

.bx-pager-item {
  margin: 0 0.5em;
  padding: 0;
  display: inline-block;
  height: 1.3em;
  width: 1.3em;
}

.bx-pager-item a {
  display: block;
  background: #94a2ad;
  height: 100%;
  width: 100%;
  border: none;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  font-size: 0;
}

.bx-pager-item a.active {
  background: var(--theme-color);
}

.wetherslider_heading {
  display: block;
  text-align: center;
}

.wetherslider_heading h3 {
  color: var(--theme-color);
  font-size: 2.5em;
  margin: 0 0 0.5em;
}

.weather-left-image {
  width: 6em;
  background-image: url(../images/wetherslide-icon.png);
  background-repeat: no-repeat;
  background-size: 72em;
  display: inline-block;
  height: 5em;
  vertical-align: middle;
}

.weather-left-image.humidity {
  background-position: 0 0;
}

.weather-left-image.wind {
  background-position: -8.3em 0;
}

.weather-left-image.presure {
  background-position: -17em 0;
}

.calcy-second {
  display: grid;
  width: 100%;
  margin: 4em 0 0;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 7em;
}

.weather-calcy-left .weather-left-text:nth-child(2) {
  margin: 4em 0;
}

.calcy-second .weather-calcy-left,
.calcy-second .weather-calcy-right {
  /* width: 31%; */
  padding: 0 1em;
}

.calcy-second .weather-calcy-middle img {
  width: 100%;
}

.calcy-second .col-cell {
  vertical-align: top;
}

.status-text {
  margin: 0;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
}

.status-text h3 {
  font-size: 1.8em;
  color: #232323;
  text-align: left;
}

.status-text span {
  font-size: 1.5em;
  line-height: 1.8em;
}

.calcy-second .weather-calcy-right {
  text-align: center;
}

.wether-rifgt-iamge {
  margin: 1.5em auto;
  padding: 0;
  height: 5em;
  display: block;
  width: 18em;
  background: url(../images/wetherslide-icon.png) no-repeat;
  background-size: 70em;
  background-position: -25em 0;
}

.wether-info-icon {
  margin: 1em auto 1.5em;
  padding: 0;
  height: 3em;
  display: block;
  width: 18em;
  background: url(../images/wetherslide-icon.png) no-repeat;
  background-size: 70em;
  background-position: -45em 0;
}

.watch-slider h2 {
  font-size: 2.7em;
  text-align: center;
  margin: 0 0 2em;
}

.listingpara.list-grid.btmNone {
  padding-bottom: 0;
}

/* whymoveo-section start*/

.whymoveoGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 1.875em;
  grid-row-gap: 1.875em;
}

.whymoveoGrid .whymoveoBox {
  background: linear-gradient(0deg, var(--white-color), var(--white-color));
  box-shadow: 2px 18px 19px rgba(0, 0, 0, 0.0568728);
  border-bottom: 2px solid var(--theme-color);
  border-radius: 10px;
  padding: 2em 0;
  position: relative;
  overflow: hidden;
  padding: 2em;
  position: relative;
  z-index: 2;
}

.whymoveoGrid .whymoveoBox p {
  padding: 0;
  text-align: center;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon {
  background-image: url(../images/wm-sprite.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  width: 8em;
  height: 8em;
  margin: 0 auto 1em;
  background-size: cover;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon1 {
  background-position: 0 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon2 {
  background-position: -8em 0;
  width: 7em;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon3 {
  background-position: -15em 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon4 {
  background-position: -23em 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon5 {
  background-position: -30.9em 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon6 {
  background-position: -38.9em 0;
  width: 7em;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon7 {
  background-position: -46em 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon8 {
  background-position: -54em 0;
  width: 5.5em;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon9 {
  background-position: -60em 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon10 {
  background-position: -68em 0;
}

.whymoveoGrid .whymoveoBox .whymoveoIcon.icon11 {
  background-position: -76em 0;
}

/* =============== Whymoveo-section end =============== */

body.white-label .serviceSection {
  background-color: var(--theme-color);
}

body.white-label .serviceContent .serviceBlock {
  grid-template-columns: 1fr 1fr 1fr;
}

body.white-label .serviceSection .serviceContent .serviceBlock .serviceBox {
  border: 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon {
  background-image: url(../images/wps-sprite.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  width: 8em;
  height: 8em;
  margin: 0 auto 1em;
  background-size: cover;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon1 {
  background-position: 0 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon2 {
  background-position: -8em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon3 {
  background-position: -16em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon4 {
  background-position: -24em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon5 {
  background-position: -32em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon6 {
  background-position: -40em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon7 {
  background-position: -48em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon8 {
  background-position: -55.7em 0;
}

body.white-label .serviceSection .serviceContent .serviceBlock.noHover .serviceBox .serviceIcon.icon9 {
  background-position: -64.7em 0;
}

/* =============== Agile Process =============== */

.inner-contain.process-mobile-devlopment {
  border-bottom: 0.3em solid #f5f9fc;
}

.processicon {
  background: rgba(0, 0, 0, 0) url("../images/aglie-process-icon.png") no-repeat scroll 100% 50%;
  background-size: 14.188em 12.375em;
}

.paddingTop5 {
  padding-top: 4em;
}

.yellostrip {
  background: var(--theme-color);
  color: var(--white-color);
  font-size: 3.4em;
  display: inline-block;
  padding: 0.3em 0.5em 0.2em;
  margin-top: 0.3em;
  font-weight: 500;
}

.process-image {
  height: 20em;
  width: 20em;
  border-radius: 50%;
  background: #fff;
  position: relative;
  border: 2.188em solid var(--theme-color);
  text-align: center;
  position: relative;
  z-index: 3;
}

.process-imageYellow {
  height: 22.5em;
  width: 22.5em;
  border: none;
  line-height: 22.5em;
  position: relative;
  z-index: 1;
}

.process-imageblock h2 {
  font-size: 2em;
  color: var(--raisinBlack-color);
  text-transform: uppercase;
  font-weight: 500;
  line-height: normal;
  display: table-cell;
  padding-right: 1.2em;
}

.process-imageblock>div {
  display: table-cell;
}

.process-imageblock {
  position: relative;
  background: #ffe383;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  position: relative;
  z-index: 1;
}

.process-imageblock::after {
  background: rgba(0, 0, 0, 0) url("../images/arrow1.png") no-repeat scroll 0 0 / 100% auto;
  bottom: 0;
  content: "";
  display: block;
  height: 5.25em;
  left: 40%;
  margin-top: -1.7em;
  position: absolute;
  top: 100%;
  width: 2.75em;
  z-index: 9999;
}

.process-imageYellow-pattern {
  content: "";
  display: block;
  background: url(../images/small-circle.png) no-repeat 0 0;
  background-size: 100%;
  position: absolute;
  left: -2em;
  top: -2em;
  bottom: -2em;
  right: -2em;
  z-index: 0;
}

.process-image img {
  margin: 0 auto;
  vertical-align: bottom;
  display: inline-block;
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.-one .process-image img {
  width: 11.125em;
}

.-two .process-image img {
  width: 20.688em;
}

.-three .process-image img {
  width: 16.313em;
}

.-four .process-image img {
  width: 15.75em;
}

.-five .process-image img {
  width: 9.313em;
}

.-six .process-image img {
  width: 13.625em;
}

.-seven .process-image img {
  width: 16.75em;
}

.-eight .process-image img {
  width: 16.375em;
}

.-nine .process-image img {
  width: 14.875em;
}

.process-image.valign-m img {
  vertical-align: middle;
}

.processPath-section-content h2 {
  color: var(--raisinBlack-color);
  text-transform: uppercase;
  font-weight: 500;
  font-size: 3em;
  text-align: unset;
  padding: 0 0 0.5em;
}

.processPath-section-content strong {
  color: #999999;
  font-size: 2.25em;
  font-weight: 700;
  display: block;
  margin-bottom: 0.4em;
}

.processPath-section-content p {
  max-width: 34em;
}

.process-image-flow {
  height: 60em;
  width: 62.155em;
  border-radius: 30em;
  margin: 0 auto;
  border: none;
  float: left;
  position: relative;
  z-index: 1;
}

.process-image-flow::before {
  background: rgba(0, 0, 0, 0) url("../images/arrow-process.png") no-repeat scroll 0 0;
  content: "";
  display: block;
  height: 7em;
  left: 54%;
  position: absolute;
  top: -4.5em;
  width: 4em;
  z-index: 9;
  background-size: 100%;
}

.process-image-flow::after {
  background: rgba(0, 0, 0, 0) url("../images/circle-flow.png") no-repeat scroll 0 0;
  background-size: 100%;
  bottom: -6em;
  content: "";
  display: block;
  height: auto;
  left: -2.65em;
  position: absolute;
  right: -2.65em;
  top: -2.8em;
  width: auto;
  z-index: 0;
}

.process-flow-table {
  display: block;
  width: 100%;
  text-align: center;
  padding: 4.5em 0;
  position: relative;
  z-index: 1;
}

.process-flow-cell {
  display: inline-block;
  vertical-align: middle;
  padding: 0;
}

.process-flow-design {
  direction: ltr;
}

.process-image-flow .process-flow-design {
  height: 50%;
  background: #ffe383;
  border-radius: 30em 30em 0 0;
}

.process-image-flow .process-flow-development {
  height: 55%;
  background: #fff;
  border-radius: 0 0 30em 30em;
}

.process-image-flow img {
  margin: 0 auto;
}

.process-image-flow .-five-one img {
  width: 21em;
}

.process-image-flow .-five-two img {
  width: 19em;
}

.process-image-flow h2 {
  font-size: 2.5em;
  color: var(--raisinBlack-color);
  text-transform: uppercase;
  font-weight: 500;
}

.process-flow-design h2 {
  margin-left: 0.8em;
}

.process-flow-development h2 {
  margin-right: 0.8em;
}

.processPath-section {
  position: relative;
}

/* .processPath-section::before,
.processPath-section::after {
  background: rgba(0, 0, 0, 0) url("../images/process-flow.png") no-repeat
    scroll 0 0 / 100% auto;
  content: "";
  display: block;
  height: 19.813em;
  left: 10.3125em;
  position: absolute;
  right: 10.3125em;
  top: inherit;
  bottom: -9em;
  width: auto;
  display: none;
}

.processPath-section.-one::before {
  display: block;
  height: 19.813em;
} */

.processPath-section.-two::before {
  background-position: 0 18%;
  display: block;
  height: 24.438em;
}

.processPath-section.-three::before {
  background-position: 0 46%;
  display: block;
  height: 19.813em;
}

.processPath-section.-four::before {
  background-position: 0 63.7%;
  bottom: -3em;
  display: none;
  height: 12.5em;
}

.processPath-section.-five::before {
  background-position: 0 76%;
  bottom: inherit;
  display: block;
  height: 41em;
  left: 2.5em;
  top: -9em;
  z-index: 2;
}

.processPath-section.-six::before {
  background-position: 0 100%;
  bottom: inherit;
  display: block;
  height: 12.5em;
  left: 3em;
  top: 0;
}

.processPath-section.-six::after {
  background-position: 0 22%;
  display: block;
  height: 18.86em;
  z-index: 0;
}

.processPath-section.-seven::before {
  display: block;
  height: 19.813em;
}

.processPath-section.-eight::before {
  background-position: 0 22%;
  display: block;
  height: 18.86em;
}

.teamPath {
  bottom: -0.3em;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: center;
}

.teamPath img {
  margin: 0 auto;
  width: 21.875em;
}

.teamPath span {
  color: var(--white-color);
  display: block;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 1.688em;
}

.-two .teamPath {
  bottom: -1.65em;
}

.-two .teamPath img {
  width: 28em;
}

.-three .teamPath {
  bottom: -1.08em;
}

/* ===============  Intro Section ===============  */

.introSection .introContent {
  position: relative;
}

.introSection .introContent:before {
  content: "";
  position: absolute;
  left: -2em;
  top: 1em;
  display: block;
  z-index: 0;
  background: url(../images/servicebefore.png) no-repeat;
  width: 2em;
  height: 16.25em;
  background-size: 100%;
}

.introSection .introContent:after {
  content: "";
  position: absolute;
  right: 1.5em;
  bottom: 0;
  display: block;
  z-index: 0;
  background: url(../images/serviceafter.png) no-repeat;
  width: 24.68em;
  height: 1em;
  background-size: 100%;
}

.introSection .introContent {
  /* display: flex;
  justify-content: space-between;
  align-items: center; */
  display: grid;
  grid-template-columns: 1fr 2fr;
  align-items: center;
  grid-column-gap: 4em;
  background-color: var(--white-color);
  max-width: 60%;
  width: 100%;
  margin: 0 auto;
  padding: 1.5em 1.5em 0;
  box-shadow: 2px 18px 19px rgba(0, 0, 0, 0.0568728);
}

.introSection .introContent .leftImg img {
  height: 20em;
}

.introSection .introContent .rightIntro h2 {
  font-size: 3.5em;
  font-weight: 500;
  margin: 0 0 0.5em;
  color: var(--theme-color);
  text-align: left;
}

.introSection .introContent .rightIntro p {
  padding: 0 0 1.3em;
  line-height: 1.5;
}

.introSection .introContent .rightIntro h3 {
  font-size: 1.5em;
  font-weight: 500;
}

.introSection .introContent .rightIntro h3 a {
  color: var(--theme-color);
}

.introSection .introContent .rightIntro h3 a:hover {
  color: var(--raisinBlack-color);
}

/* =============== Testimonial =============== */
.fl {
  float: left;
  margin: 0 3em 1em 0;
}

.fr {
  float: right;
  margin: 0 0 1em 2em;
}

.clearfix {
  display: inline-block;
}

.checklist.clearfix {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-column-gap: 1em;
}

.testimonialbox {
  background: #f5f9fc;
  padding: 6em 0;
}

.testimonialbox .box {
  margin: 0 0 6em;
  display: flex;
  align-items: flex-start;
}

.testimonialbox .box.reverse {
  flex-direction: row-reverse;
}

.testimonialbox .box:last-child {
  margin: 0;
}

.testimonialtext.fr,
.testimonialtext.fl {
  background: var(--white-color);
  width: 66.43em;
  padding: 3.5em 3.5em 5em 3.5em;
}

.testimonial-title h3 {
  font-size: 4em;
  color: var(--theme-color);
}

.testimonialtext h4 {
  font-size: 2.25em;
  color: var(--raisinBlack-color);
  line-height: 1.4em;
  margin: 0 0 0.6em;
  font-weight: 500;
  text-align: left;
}

.testimonialtext p {
  margin: 0;
  font-size: 1.1em;
  color: var(--raisinBlack-color);
}

.testimonialclient.fl,
.testimonialclient.fr {
  background: var(--theme-color);
  text-align: center;
  width: 26.125em;
  padding: 2em;
  margin: 8em 0 0 0;
  position: relative;
  box-shadow: 2px 18px 19px rgba(0, 0, 0, 0.0568728);
}

.testimonialclient:before {
  content: "";
  width: 6.375em;
  height: 5.125em;
  display: block;
  background: url(../images/testimonial-sprite.png) no-repeat;
  position: absolute;
  background-size: 62.5em;
  background-position: right top;
  top: -8em;
  left: 0;
}

.testimonialclient:after {
  content: "";
  width: 6.375em;
  height: 5.125em;
  display: block;
  background: url(../images/testimonial-sprite.png) no-repeat;
  position: absolute;
  background-size: 62.5em;
  background-position: right -8em;
  top: -8em;
  right: 0;
}

.testimonialclient.fr:after {
  display: none;
}

.testimonialclient.fl:before {
  display: none;
}

.testimonialclient .image {
  background: url(../images/testimonial-sprite.png) no-repeat;
  width: 9.75em;
  height: 9.75em;
  background-size: 62.5em;
  margin: -6.6em auto 1.5em;
  border-radius: 50%;
  -webkit-border-radius: 50%;
}

.testimonialclient .image.client1 {
  background-position: -18.1em 0;
}

.testimonialclient .image.client2 {
  background-position: -31.125em 0;
}

.testimonialclient .image.client3 {
  background-position: -44.125em 0;
}

.testimonialclient .image.noclient {
  background-position: -18.1em -13.1em;
}

.testimonialclient .image.client4 {
  background-position: -31em -15em;
}

.testimonialclient .image.client5 {
  background-position: -44.4em -15em;
}

.testimonialclient .image.client6 {
  background-position: -30.8em -28.8em;
}

.testimonialclient h5 {
  font-size: 2em;
  line-height: 1em;
  color: var(--white-color);
  font-weight: 500;
  margin: 0 0 0.5em;
}

.testimonialclient p {
  margin: 0;
  font-size: 1em;
  color: var(--white-color);
  line-height: 1.2em;
  text-align: center;
}

.testimonialtext {
  position: relative;
}

/* =============== ios-development =============== */

.ourappexpertise {
  background: #f5f9fc;
  /* padding: 13em 0;
  position: relative;
  overflow: hidden; */
}

/* .expertiseround {
  background: #cfdae4;
  width: 41em;
  height: 41em;
  border-radius: 50%;
  margin: auto;
  position: relative;
} */


/* .expertiseround h3 {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  top: 45%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  font-size: 3em;
  font-weight: 500;
  color: var(--raisinBlack-color);
  line-height: 1.2em;
} */

.expertiseround .whiteroundicon {
  width: 9.75em;
  height: 9.75em;
  border-radius: 50%;
  position: absolute;
  background-image: url(../images/iosappdevelopment-icon.png);
  background-repeat: no-repeat;
  background-color: var(--white-color);
  background-size: 65em;
}

/* .expertiseround .whiteroundicon h6 {
  font-size: 1.25em;
  color: var(--raisinBlack-color);
  font-weight: 400;
  width: 7.9em;
}

.icon1 {
  right: 18%;
  top: -8%;
}

.expertiseround .whiteroundicon.icon1 h6 {
  text-align: center;
  margin-top: -2em;
}

.icon2 {
  right: -8%;
  top: 22%;
}

.expertiseround .whiteroundicon.icon2 h6 {
  text-align: center;
  margin-top: -2em;
  margin-left: 3em;
}

.icon3 {
  right: -7%;
  top: 58%;
}

.expertiseround .whiteroundicon.icon3 h6 {
  text-align: center;
  margin-top: -1em;
  margin-left: 6em;
}

.icon4 {
  right: 18%;
  top: 83%;
}

.expertiseround .whiteroundicon.icon4 h6 {
  text-align: center;
  margin-top: 8.4em;
}

.icon5 {
  right: 57%;
  top: 83%;
}

.expertiseround .whiteroundicon.icon5 h6 {
  text-align: center;
  margin-top: 8.4em;
}

.icon6 {
  left: -7%;
  top: 58%;
}

.expertiseround .whiteroundicon.icon6 h6 {
  text-align: center;
  margin-top: -1em;
  margin-left: -6em;
}

.icon7 {
  left: -8%;
  top: 22%;
}

.expertiseround .whiteroundicon.icon7 h6 {
  text-align: center;
  margin-top: -3em;
  margin-left: -5em;
}

.icon8 {
  left: 18%;
  top: -8%;
}

.expertiseround .whiteroundicon.icon8 h6 {
  text-align: center;
  margin-top: -2em;
}

.biground {
  background: #f1f4f7;
  border-radius: 50%;
  width: 108.5em;
  height: 108.5em;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 53%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

.secondbiground {
  background: #e6ecf1;
  border-radius: 50%;
  left: 9em;
  right: 9em;
  top: 9em;
  bottom: 9em;
  position: absolute;
}

.expertiseround-ios .icon1 {
  background-position: -11.6em -12em;
}

.expertiseround-ios .icon2 {
  background-position: -22.6em -12em;
}

.expertiseround-ios .icon3 {
  background-position: -34.6em -12em;
}

.expertiseround-ios .icon4 {
  background-position: -45em -12em;
}

.expertiseround-ios .icon5 {
  background-position: -55.5em -12em;
}

.expertiseround-ios .icon6 {
  background-position: 2.5em -24.5em;
}

.expertiseround-ios .icon7 {
  background-position: -7.5em -24.5em;
}

.expertiseround-ios .icon8 {
  background-position: -17.5em -24.5em;
} */

.expertiseround-hybridapp .icon1 {
  background-position: -11.6em -12em;
}

.expertiseround-hybridapp .icon2 {
  background-position: -22.6em -12em;
}

.expertiseround-hybridapp .icon3 {
  background-position: -34.6em -12em;
}

.expertiseround-hybridapp .icon4 {
  background-position: -45em -12em;
}

.expertiseround-hybridapp .icon5 {
  background-position: -55.5em -12em;
}

.expertiseround-hybridapp .icon6 {
  background-position: 2.5em -24.5em;
}

.expertiseround-hybridapp .icon7 {
  background-position: -7.5em -24.5em;
}

.expertiseround-hybridapp .icon8 {
  background-position: -17.5em -24.5em;
}

.expertiseround.expertiseround-and .whiteroundicon h6 {
  width: 11em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon1 h6 {
  margin-top: -3em;
  margin-left: -1em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon2 h6 {
  margin-top: -3em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon3 h6 {
  margin-top: -2em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon4 h6 {
  margin-left: -1em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon5 h6 {
  margin-left: -2em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon6 h6 {
  margin-left: -8em;
  margin-top: -2em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon7 h6 {
  margin-left: -6em;
  margin-top: -3em;
}

.expertiseround.expertiseround-and .whiteroundicon.icon8 h6 {
  margin-left: -2em;
  margin-top: -3em;
}

.expertiseround-and .icon1 {
  background-position: -12.3em 0;
}

.expertiseround-and .icon2 {
  background-position: -22.5em 0;
}

.expertiseround-and .icon3 {
  background-position: -33em 0;
}

.expertiseround-and .icon4 {
  background-position: -42.2em 0;
}

.expertiseround-and .icon5 {
  background-position: -52.3em 0;
}

.expertiseround-and .icon6 {
  background-position: 2.3em -12em;
}

.expertiseround-and .icon7 {
  background-position: -8.5em -12em;
}

.expertiseround-and .icon8 {
  background-position: -17.5em -12em;
}

.expertiseround.expertiseround-and .whiteroundicon {
  background-image: url(../images/androiddevelopment-icon.png);
  background-repeat: no-repeat;
  background-color: var(--white-color);
}

.expertiseround-web .whiteroundicon h6 {
  width: 8.9em;
}

.expertiseround-web .whiteroundicon.icon1 h6,
.expertiseround-web .whiteroundicon.icon4 h6 {
  margin-left: -0.5em;
}

.expertiseround-web .icon3,
.expertiseround-web .icon6 {
  top: 35%;
}

.expertiseround-web .whiteroundicon.icon3 h6 {
  margin-top: 8.3em;
}

.expertiseround-web .whiteroundicon.icon6 h6 {
  margin-top: 8.3em;
  margin-left: -6em;
}

.expertiseround-web .whiteroundicon.icon8 h6 {
  margin-top: -3em;
}

.expertiseround-web .whiteroundicon.icon5 h6,
.expertiseround-web .whiteroundicon.icon8 h6 {
  margin-left: -1em;
}

.expertiseround-web .icon1 {
  background-position: -13em 0;
}

.expertiseround-web .icon3 {
  background-position: -22em 0;
}

.expertiseround-web .icon4 {
  background-position: -31.8em 0;
}

.expertiseround-web .icon5 {
  background-position: -41.8em 0;
}

.expertiseround-web .icon6 {
  background-position: -51.2em 0;
}

.expertiseround-web .icon8 {
  background-position: 2em -12em;
}

.expertiseround.expertiseround-iphone .whiteroundicon h6 {
  width: 11em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon1 h6 {
  margin-top: -3em;
  margin-left: -1em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon2 h6 {
  margin-top: -3em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon3 h6 {
  margin-top: -2em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon4 h6 {
  margin-left: -1em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon5 h6 {
  margin-left: -2em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon6 h6 {
  margin-left: -8em;
  margin-top: -2em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon7 h6 {
  margin-left: -8em;
  margin-top: -3em;
}

.expertiseround.expertiseround-iphone .whiteroundicon.icon8 h6 {
  margin-left: -2em;
  margin-top: -3em;
}

.expertiseround-iphone .icon1 {
  background-position: -27.5em -12em;
}

.expertiseround-iphone .icon2 {
  background-position: -33em 0;
}

.expertiseround-iphone .icon3 {
  background-position: -37.5em -12em;
}

.expertiseround-iphone .icon4 {
  background-position: -42.2em 0;
}

.expertiseround-iphone .icon5 {
  background-position: -47.2em -12em;
}

.expertiseround-iphone .icon6 {
  background-position: -8.5em -12em;
}

.expertiseround-iphone .icon7 {
  background-position: -52.3em 0;
}

.expertiseround-iphone .icon8 {
  background-position: -17.5em -12em;
}

.expertiseround-reality .whiteroundicon h6 {
  width: 8.9em;
}

.expertiseround-reality .whiteroundicon.icon1 h6,
.expertiseround-reality .whiteroundicon.icon4 h6 {
  margin-left: -0.5em;
}

.expertiseround-reality .icon3,
.expertiseround-reality .icon6 {
  top: 35%;
}

.expertiseround-reality .whiteroundicon.icon3 h6 {
  margin-top: 7.3em;
  margin-left: 5em;
}

.expertiseround-reality .whiteroundicon.icon6 h6 {
  margin-top: 7.3em;
  margin-left: -6em;
}

.expertiseround-reality .whiteroundicon.icon8 h6,
.expertiseround-reality .whiteroundicon.icon1 h6 {
  margin-top: -3em;
}

.expertiseround-reality .whiteroundicon.icon5 h6,
.expertiseround-reality .whiteroundicon.icon8 h6 {
  margin-left: -1em;
}

.expertiseround.expertiseround-reality .whiteroundicon {
  background-image: url(../images/webappdevlopment-icon.png);
  background-repeat: no-repeat;
  background-color: var(--white-color);
}

.expertiseround-reality .icon1 {
  background-position: -13em 0;
}

.expertiseround-reality .icon3 {
  background-position: -22em 0;
}

.expertiseround-reality .icon4 {
  background-position: -31.8em 0;
}

.expertiseround-reality .icon5 {
  background-position: -41.8em 0;
}

.expertiseround-reality .icon6 {
  background-position: -51.2em 0;
}

.expertiseround-reality .icon8 {
  background-position: 2em -12em;
}

.expertiseround.expertiseround-iphone .whiteroundicon {
  background-image: url(../images/androiddevelopment-icon.png);
  background-repeat: no-repeat;
  background-color: var(--white-color);
}

.expertiseround.expertiseround-web .whiteroundicon {
  background-image: url(../images/webappdevlopment-icon.png);
  background-repeat: no-repeat;
  background-color: var(--white-color);
}

.expertiseround.expertiseround-applewatch .whiteroundicon {
  background-image: url(../images/applewatch-icon.png);
  background-repeat: no-repeat;
  background-color: var(--white-color);
}

.expertiseround-applewatch .icon8 {
  background-position: 1em -12em;
}

.casestudiesbox-col2 .box.casestudies-v1 {
  background-image: url(../images/nytevibe-casestudies-vertical.png);
  background-size: cover;
}

.casestudiesbox-col2 .box.casestudies-v2 {
  background-image: url(../images/fanzz-casestudies-vertical.png);
  background-size: cover;
}

.casestudiesbox .box:last-child {
  margin: 0;
}

.casestudiesbox-col2 .box {
  padding: 5em 0;
  text-align: center;
  background-repeat: no-repeat;
  background-position: 50% 100%;
  background-size: cover;
}

.casestudiesbox .box {
  -webkit-box-shadow: 1px 1px 4px 4px #e8ebee;
  box-shadow: 1px 1px 4px 4px #e8ebee;
  background-color: #fff;
  padding: 5.5em 4.1em;
  /* margin: 0 0 8em; */
}

.caselogo {
  text-align: center;
  margin: 0 auto 4em;
}

.caselogo {
  background: url('../images/casestudy-sprite.png') no-repeat;
  width: 25.375em;
  height: 7.75em;
  background-position: -38em 0;
  margin: 0 0 2em;
  background-size: 97em;
  max-width: 24em;
  width: 100%;
}

.casestudiesbox-col2 .caselogo {
  margin-left: auto;
  margin-right: auto;
  /* height: 7.5em;
  width: 18.75em; */
  height: 7.5em;
}

.casestudiesbox .box.casestudies-v1 .caselogo {
  background-position: -26em -16.5em;
  background-size: 74em auto;
}

.casestudiesbox .box.casestudies-v2 .caselogo {
  background-position: -35.5em -10.8em;
  background-size: 100em;
}

.casestudiesbox-col2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 6em;
}

.min-height {
  min-height: 10em;
}

.casestudiesbox-col2 .box h3 {
  font-size: 3.5em;
  color: var(--raisinBlack-color);
  text-transform: uppercase;
  font-weight: 500;
  line-height: 1.2em;
  margin: 0 0 1em;
  text-align: center;
}

.casestudiesbox .box a {
  background: var(--theme-color);
  font-size: 1.375em;
  color: var(--raisinBlack-color);
  font-weight: 500;
  padding: 1em 2em 1em;
  display: inline-block;
  text-transform: uppercase;
  border-radius: 0.45em;
}

.centerheadingcolor h3 {
  font-size: 4em;
  color: var(--theme-color);
  display: block;
  line-height: 1em;
  text-transform: uppercase;
  font-weight: 500;
  margin: 0 0 0.7em;
}

.casestudiesbox .box a i {
  margin-left: 0.4em;
}

.casestudiesbox .box a:hover {
  background: var(--raisinBlack-color);
  color: var(--white-color);
}

.download_app .btn-center {
  text-align: center;
}

.download_app {
  padding: 1em 0;
}

.download_app .btn-center a {
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.5em;
  width: 13em;
}

.tech-icon {
  background: url(../images/chatapplication-sprite.png) no-repeat 0 0 #fff;
  border-radius: 6em 0 6em 6em;
  float: left;
  height: 10.313em;
  margin-top: 5em;
  width: 18.625em;
  box-shadow: 0 0 3.75em rgba(65, 95, 163, 0.1);
  background-size: 49.375em;
  position: absolute;
  left: 0;
  top: 0;
}

/*  =============== Fanzz Page  ===============  */

.tech-icon.node {
  background-position: 4em -28em;
}

.tech-icon.native {
  background-position: -15.3em -28em;
}

.tech-icon.js {
  background-position: -32em -28em;
}

.tech-icon.redux {
  background-position: 5em -38.5em;
}

.tech-icon.redux {
  background-position: 5em -38.5em;
}

.tech-icon.sagas {
  background-position: -15.3em -38.2em;
}

.tech-icon.android {
  background-position: -32.5em -38.2em;
}

.technologieslist {
  margin: 0 5em;
  padding: 25em 0;
  position: relative;
}

.tech-icon.tech-icon1 {
  left: 5.625em;
}

.tech-icon.tech-icon2 {
  left: 33.5em;
}

.tech-icon.tech-icon3 {
  left: 62em;
}

.tech-icon.tech-icon4 {
  left: 11.2em;
  top: 16em;
}

.tech-icon.tech-icon5 {
  left: 39.8em;
  top: 16em;
}

.tech-icon.tech-icon6 {
  left: 68.4em;
  top: 16em;
}

.tech-icon.tech-icon7 {
  left: 5.625em;
  top: 32em;
}

.tech-icon.tech-icon8 {
  left: 33.5em;
  top: 32em;
}

.tech-icon.tech-icon9 {
  left: 62em;
  top: 32em;
}

.fanzzappcasestudies .rightimage.outsidewrapcase {
  margin: 0 -13em 0 0;
}

.fanzzappcasestudies .rightimage.outsidewrapcase img {
  width: 60em;
}

.fanzzapptechs .tech-icon.tech-icon4 {
  left: -8.8em;
}

.fanzzapptechs .tech-icon.tech-icon5 {
  left: 19.8em;
}

.fanzzapptechs .tech-icon.tech-icon6 {
  left: 48.4em;
}

.fanzzapptechs .tech-icon.tech-icon7 {
  left: 77em;
  top: 16em;
}

.fanzzapptechs .tech-icon.tech-icon8 {
  left: 5.625em;
}

.fanzzapptechs .tech-icon.tech-icon9 {
  left: 33.5em;
}

.fanzzapptechs .tech-icon.tech-icon10 {
  left: 62em;
  top: 32em;
}

.tech-icon.node {
  background-position: 4em -28em;
}

.tech-icon.native {
  background-position: -15.3em -28em;
}

.tech-icon.js {
  background-position: -32em -28em;
}

.tech-icon.redux {
  background-position: 5em -38.5em;
}

.tech-icon.redux {
  background-position: 5em -38.5em;
}

.tech-icon.sagas {
  background-position: -15.3em -38.2em;
}

.tech-icon.android {
  background-position: -32.5em -38.2em;
}

.tech-icon.obj-c {
  background-position: -14.5em -16em;
}

.tech-icon.json {
  background-position: 3.5em -5em;
}

.tech-icon.mysql {
  background-position: -34.5em 2em;
}

.tech-icon.html {
  background-position: -29.5em -6.2em;
}

.appscreenshort img {
  margin: 0 auto;
  width: 75em;
}

.appscreenshort {
  padding: 2em 0;
  text-align: center;
}


.back-button {
  text-align: center;
}

.back-button .contactbutton {
  font-size: 1.1em;
  text-transform: inherit;
  background: var(--raisinBlack-color);
}

.contactbutton {
  background: #ff5242;
  display: inline-block;
  vertical-align: top;
  /* float: right; */
  font-size: 1.1em;
  color: #fff;
  text-transform: uppercase;
  font-weight: 500;
  padding: 0.75em 1.2em;
  border-radius: 0.1em;
  margin: 3em 0 0 1.1em;
}

body.casestudies-detail .gridBox.withImage {
  grid-column-gap: 6em;
}

.whitelabelyellow {
  background: #ffe383;
  padding: 8em 0 3em;
}

.whitelabelyellow h6 {
  font-size: 1.8em;
  color: #000;
  font-weight: 500;
  line-height: 1.8em;
  margin: 0 0 3em;
  text-align: left;
}

.whitelabelyellow li {
  list-style: none;
  display: inline-block;
  vertical-align: top;
  width: 33%;
  text-align: center;
}

.whitelabelyellow li .icon {
  width: 8.75em;
  height: 7.8125em;
  background: url(../images/white-label-sprite.png) no-repeat;
  background-size: 95em;
  margin: 0 auto 0.5em;
}

.gridBox .rightContent img {
  max-width: 50em;
  width: 100%;
}

.quote {
  font-size: 2em;
  color: var(--theme-color);
  font-weight: 300;
  text-align: center;
  margin: 0 0 1em;
}

.ug-contain p {
  text-align: center;
}

/* ===============  Ultimate Guide ===============  */

body.resourcesWrap .innerSubSection .container,
body.resourcesWrap .innerSubContent .container {
  max-width: 1200px;
}

body.ultimate-guide-resources h3 {
  margin: 0 0 0.5em;
  text-align: center;
  text-transform: uppercase;
}

body.ultimate-guide-resources .innersubContent h6 {
  font-size: 1.8em;
  line-height: 1.5;
  margin: 0 0 0.7em;
}

body.ultimate-guide-resources .innersubContent h4 {
  margin: 0 0 1em;
}

body.ultimate-guide-resources .innersubContent h4 a {
  font-size: 1.5em;
  color: var(--theme-color);
  font-weight: 700;
}

.ug-number {
  color: var(--theme-color);
  font-weight: 700;
  font-size: 5em;
  display: table-cell;
  vertical-align: middle;
}

.ug-text {
  font-size: 2em;
  color: #000;
  display: inline-block;
  vertical-align: middle;
  line-height: 1.15;
  padding: 0.2em 0 0;
  font-weight: 700;
}

.ug-contain p {
  text-align: left;
}

.ugcmn-title {
  margin: 0 0 1.5em;
}

.ugcmn-title+.ug-image.my {
  margin: 0 0 3em !important;
}

.ug-image.withWidth {
  max-width: 25em;
  width: 100%;
}

.ugcmn-title.flex {
  display: flex;
  align-items: center;
}

.ugcmn-title.flex .ug-text {
  padding: 0;
}

.ugcmn-title.flex .ug-number {
  padding: 0 0.3em 0 0;
}

.load-switimg {
  padding: 3em 0 14em;
  display: block;
}

.load-switimg span {
  display: inline-block;
  position: relative;
  margin: 0 auto;
  width: 30%;
}

.pop_message {
  margin: 0;
  padding: 3em 1.5em;
  position: absolute;
  background: #fff;
  border: none;
  border-radius: 50%;
  -webkit-border-radius: 50%;
}

.pop_message.leftmessage-1 {
  left: -34em;
  top: 0;
  width: 28em;
  height: 28em;
}

.pop_message.leftmessage-2 {
  left: -30em;
  bottom: -12em;
  width: 28em;
  height: 28em;
}

.pop_message.rightmessage-1 {
  right: -36em;
  top: -4em;
  width: 34em;
  height: 34em;
}

.pop_message.rightmessage-2 {
  right: -30em;
  bottom: -14em;
  width: 27em;
  height: 27em;
}

.load-switimg span img {
  width: 100%;
}

.pop_message p {
  word-break: break-all;
  word-wrap: break-word;
  font-size: 1.3em;
  text-align: center;
}

.pop_message:after {
  margin: 0;
  position: absolute;
  background: url(../images/ultimate-guidesprite.png) no-repeat 0 0;
  content: "";
  width: 6em;
  height: 6em;
  background-size: 41em;
}

.pop_message.leftmessage-1:after {
  right: -4em;
  top: 8em;
  background-position: -13em -5em;
}

.pop_message.leftmessage-2:after {
  right: -4em;
  top: 7em;
  background-position: -20em -5em;
}

.pop_message.rightmessage-1:after {
  left: -5.5em;
  top: 45%;
  background-position: -26em -5em;
}

.pop_message.rightmessage-2:after {
  left: -3em;
  top: 3em;
  background-position: -33em -5em;
}

.process-simpler {
  margin: 3em 0;
}

.process-simpler .left-image img {
  max-width: 24em;
  width: 100%;
}

.process-simpler .listingpara li {
  margin: 0 0 1.5em;
}
.ug-image { text-align: center; margin: 0 0 2em; }

.ug-image img {
  display: inline-block;
  max-width: 100%;
  width: auto;
  height: auto;
}

.ug-image.withWidth.withBtmMargin {
  margin: 0 auto 2em;
}


.ug-image.my:not(.fl):not(.fr) {
  margin: 3em 0;
}

.ug-image.fl,
.ug-image.fr {
  width: 25em;
}
.ug-image.fl{
      margin: 2em 4em 2em 0;
}
.ug-image.fr {
    margin: 2em 0 2em 4em;
}
.checklist .ug-image img {
  max-width: 20em;
  width: 100%;
  margin: 0 0 0 auto;
}

.gridBox.res {
  grid-template-columns: 30em 30em;
  justify-content: center;
}

.list-post-detail {
  background: var(--black-color);
  padding: 2em 1.5em;
}

.list-post-detail p {
  color: var(--white-color);
}

.list-blog-wrap .feature-image img {
  max-width: 100%;
  width: 100%;
  object-fit: cover;
}

.overlay {
  background-color: var(--theme-color);
  display: inline-block;
  padding: 0.5em 1em;
}

.overlay span {
  font-size: 1em;
  font-weight: 500;
}

.list-post-detail h2,
.list-post-detail p {
  text-align: center;
}

.list-post-detail h2 {
  min-height: 2em;
  margin: 0 0 0.5em;
}

.feature-image {
  background-color: var(--white-color);
}

.feature-image img {
  max-width: 100%;
  width: 100%;
  height: 20em;
  object-fit: contain;
}

.gridBox.res {
  margin: 3em 0 0;
}

.code-box textarea {
  max-width: 100%;
  width: 100%;
  border: 1px solid var(--black-color);
}

ul.listingpara.withBg.full-coloumn li {
  padding: 1em;
  background-color: var(--white-color);
}

ul.listingpara.withBg.full-coloumn li:before {
  content: none;
  padding: 0;
  margin: 0;
}

ul.listingpara.withBg.full-coloumn li a {
  font-size: 1em;
  font-weight: 500;
  color: var(--theme-color);
}

.infographics-resource h3 {
  font-weight: 500;
  font-size: 1.7em;
  padding: 0 0 1em;
}

.infographic_contain h5 {
  font-size: 1.4em;
  line-height: 1.5em;
  font-weight: 500;
  margin: 0 0 0.5em;
  text-align: left;
}

.checklist-image {
  padding: 0 0 3em;
}

/* =============== Twitter embed =============== */
.twitt-embed {
  margin: 0 0 2em;
  display: flex;
  width: 100%;
  clear: both;
  justify-content: center;
}

.twitt-embed span {
    padding: 0 1em;
    width: 50%;
}
.twitt-embed span > div{
  height: 100%;
}

.video-frame {
  display: block;
  text-align: center;
  margin-bottom: 3em;
}

h4.title-design {
  font-size: 1.5em;
  font-weight: 500;
  background: #f2f2f2;
  padding: 0.6em 1em;
  text-align: left;
}

.ug-contain p b {
  padding: 0;
}

.ug-contain h5 {
  font-weight: 500;
  font-size: 1.4em;
  padding: 0 0 0.7em;
  color: #333;
  text-align: left;
}

.ug-contain .source-cl {
  text-align: center;
  font-size: .95em;
  margin: 1em 0 2em;
}

.OrDiv {
  display: block;
  float: right;
  margin: 1.75em 0 0;
  margin-left: 1.1em;
  color: #94a2ad;
  font-weight: 500;
  font-size: 1.1em;
}

.cta .OrDiv {
  display: inline-block;
  float: none;
  margin: 0 1.1em;
}

.cta .ctaBtn {
  display: flex;
  justify-content: center;
  align-items: center;
}

.cta img {
  margin-bottom: 1.5em;
}

.ctabutton h2 {
  font-size: 1.4em;
  line-height: 2.5em;
  color: var(--black-color);
  font-weight: 500;
  padding: 0;
}

.cta .call-button,
.cta .mail-button {
  position: relative;
  width: 6em;
  height: 6em;
  border: none;
  box-shadow: 0 0 0 0 rgba(246, 192, 6, 0.7);
  border-radius: 50%;
  background-color: var(--theme-color);
  background-image: url(../images/request-a-quote.png);
  background-size: 40%;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  -webkit-animation: ripple 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: ripple 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: ripple 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: ripple 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}

.cta .mail-button {
  background-image: url(../images/schedule-a-call.png);
}

.cta .call-button:hover,
.cta .mail-button:hover {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  animation: none;
}

@-webkit-keyframes ripple {
  to {
    box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
  }
}

@-moz-keyframes ripple {
  to {
    box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
  }
}

@-ms-keyframes ripple {
  to {
    box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
  }
}

@keyframes ripple {
  to {
    box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
  }
}

.contact-form {
  margin: 2em 0 0 0;
}

.contact-form .fieldset:nth-child(2n + 1) {
  clear: left;
}

.contact-form .fieldset {
  border: none;
  margin: 0 0 1.5em;
  padding: 0;
  float: none;
  width: 49%;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.contact-form .fieldset:nth-child(2n) {
  float: none;
  margin-right: 1em;
}

.contact-form .fieldset:after {
  content: "";
  display: block;
  clear: both;
}

.contact-form .fieldset input {
  display: block;
  width: 100%;
  border: 0;
  border: 1px solid #ccc;
  background: transparent;
  height: 3.1em;
  font-weight: 500;
  color: #000;
  padding: 0 0 0;
  font-size: 1.26em;
  outline: none;
  border-radius: 5px;
  padding: 0 0 0 1em;
}

.contact-form .fieldset input::placeholder,
.contact-form .fieldset textarea::placeholder {
  font-size: 1em;
}

.contact-form .selectbox select {
  color: var(--placeholder-color);
}

.footerSection .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset input[type="email"] {
  font-weight: 400;
  font-size: 0.7em;
  color: var(--placeholder-color);
  opacity: 1;
}

.contact-form .fieldset textarea {
  display: block;
  width: 100%;
  border: none;
  border: 1px solid #ccc;
  background: transparent;
  height: 8em;
  font-weight: 500;
  color: #000;
  font-size: 1.26em;
  resize: none;
  outline: none;
  border-radius: 5px;
  padding: 0.8em 0 0 1em;
  line-height: inherit;
}

.labelheading {
  padding: 0.8em 0 0;
  font-weight: 500;
  color: #000000;
  font-size: 1.26em;
  display: block;
  margin-bottom: 1em;
}

.checklbl {
  position: relative;
}

.checklbl input[type="checkbox"] {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
}

.checklbl {
  color: #000000;
  font-size: 1.26em;
  display: block;
  float: left;
  width: 20%;
}

.checklbl span:before {
  content: "";
  display: block;
  height: 1.2em;
  width: 1.2em;
  border: 0.063em solid #8b8895;
  background: none no-repeat center center #edf2f6;
  position: absolute;
  left: 0;
  top: 0;
}

.checklbl span {
  position: relative;
  padding-left: 2.25em;
  display: inline-block;
  margin: 0.80em 0;
  font-weight: 500;
}

.checklbl input[type="checkbox"]:checked+span:before {
  background-image: url(../images/check-icon.png);
  background-position: center;
  background-size: 1em;
}

.btn-center {
  text-align: center;
}

.connect-with {
  background: #ffe383;
  padding: 2em;
  margin-top: 2.750em;
  text-align: center;
}

.connect-with h5 {
  display: inline-block;
  vertical-align: middle;
  font-size: 1.875em;
  font-weight: 500;
  margin-right: 0.938em;
}

.connect-with .social {
  float: none;
  display: inline-block;
  vertical-align: middle;
  padding: 0.188em 0;
}

.contact-footer {
  display: block
}

.contact-footer>div:nth-child(3n + 1) {
  clear: left;
  display: block;
}

.contact-footer .block {
  width: 30%;
  min-height: 18em;
  float: left;
}

.address-block.block.last-block {
  float: right;
}

.contact-footer .block-center {
  padding-left: 7em;
  width: 40%;
  border-left: 0.250em solid #edf2f6;
  border-right: 0.250em solid #edf2f6;
}

.address-block h5 {
  font-size: 2.250em;
  color: #000;
  font-weight: 600;
  margin: 0 0 0.4em;
  color: #ff5242
}

.company-name {
  padding: 0.2em 0;
  font-size: 1.875em;
  text-align: center;
  display: inline-block;
  font-weight: 600;
  margin-bottom: 0.5em
}

.address-block address {
  font-size: 1.250em;
  color: #000;
  line-height: 1.8em;
  font-style: normal;
  font-weight: 500;
  padding: 0 0 2em;
  font-family: 'Work Sans', sans-serif;
}

.contat-way {
  float: right;
}

.contat-way li {
  padding: 0 0 0 5em;
  margin: 0 0 2.500em;
  position: relative;
}

.contat-way span {
  display: block;
  color: #94a2ad;
  font-size: 1.097em;
  font-weight: 500;
}

.contat-way a {
  font-size: 1.625em;
  color: #000;
  display: block;
  margin: 0 0 0.2em
}

.contat-way .icon {
  background-image: url("../images/homepage-sprite.png");
  background-repeat: no-repeat;
  background-size: 50.43em auto;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}

.contat-way .icon.icon-mail {
  background-position: -39.5em -0.7em;
  height: 3.1em;
  width: 4em;
  left: -1.5em
}

.contat-way .icon.icon-phone {
  background-position: -47.15em -0.5em;
  height: 3.4em;
  top: 0;
  width: 2.2em;
}

.contat-way .icon.icon-skype {
  background-position: -46.7em -7.8em;
  height: 3.06em;
  width: 3.2em;
}

.contact-form label.error {
  display: block;
  text-align: left;
  font-size: 1em;
  color: #f00;
  font-weight: 300;
  margin: 0.5em 0 0 0;
}

.contact-form .g-recaptcha label.error {
  left: 0;
  right: inherit;
  text-align: left;
}

.contact-form .fieldset.msgtextarea {
  width: 100%;
}

.fieldset.msgtextarea.captchacenter {
  margin: 1.2em 0 0 0;
}

.contact-form .selectbox {
  border: none;
  border: 1px solid #ccc;
  padding: 0 0 0 1em;
  position: relative;
  margin: 0.7em 0 0 0;
  font-family: 'Work Sans', sans-serif;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  overflow: hidden;

}

.contact-form .selectbox:after {
  content: "";
  position: absolute;
  right: 1.5em;
  top: 50%;
  transform: translateY(-50%);
  background-color: #fff;
  width: 0.3em;
  font-family: FontAwesome;
  font-size: 1.7em;
  text-align: center;
  color: #777;
  pointer-events: none;
}

.contact-form .selectbox select {
  border: medium none;
  color: #000;
  font-size: 1.26em;
  height: 3.1em;
  width: 100%;
  outline: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  font-weight: 500;
  background: #fff;
  padding: 0;
  font-weight: 400;
  color: var(--placeholder-color);
  opacity: 1;
}

.social {
  float: right;
  margin: 0;
}

.social li {
  display: inline-block;
  vertical-align: top;
  list-style: none;
  margin: 0 0.9em 0 0;
}

.social li:last-child {
  margin-right: 0;
}

.social li a {
  font-size: 1.2em;
  color: #fff;
  font-weight: normal;
  border-radius: 100%;
  width: 2em;
  height: 2em;
  display: flex;
  justify-content: center;
  align-items: center;
}

.social li a.gplus {
  background: #dd4b39
}

.social li a.linkedin {
  background: #007ab9
}

.social li a.twitter {
  background: #55acee
}

.social li a.fb {
  background: #3b5998
}

.social li a.insta {
  background: #2c6189;
}

.social li a.gplus:hover,
.social li a.linkedin:hover,
.social li a .twitter:hover,
.social li a.fb:hover,
.social li a.insta:hover {
  background: #333
}

/* =============== Site Map =============== */

.sitemap-icon {
  background: rgba(0, 0, 0, 0) url("../images/sitemap-icon.png") no-repeat scroll 5.5em 1.8em / 9em auto;
}

.sitemap_contain {
  padding: 6em 0;
  background: #edf2f6;
}

.sitemap_list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sitemap_list>li {
  margin: 1.5em 0 0;
  padding: 0 0 0.5em 1em;
  display: block;
  position: relative;
}

.sitemap_list>li:before {
  content: "";
  background: url(../images/list-arrow.png) no-repeat 0 0;
  position: absolute;
  width: 0.75em;
  height: 0.70em;
  right: 100%;
  background-size: 100% 100%;
  top: 10px;
  font-size: 1.375em;
  line-height: 1.8em;
}

.sitemap_list>li>a {
  font-size: 1.375em;
  line-height: 1.8em;
  color: #000;
  font-weight: 500;
}

.inner_maplist {
  margin: 1em 0 1em 1em;
}

.inner_maplist li {
  padding: 0 0 0.5em 1em;
  display: block;
  position: relative;
}

.inner_maplist li:before {
  content: "";
  background: url(../images/list-arrow.png) no-repeat 0 0;
  position: absolute;
  width: 0.75em;
  height: 0.70em;
  right: 100%;
  background-size: 100% 100%;
  top: 0.6em;
  font-size: 1.2em;
  line-height: 1.8em;
}

.inner_maplist li a {
  font-size: 1.2em;
  line-height: 1.8em;
  color: #444;
}

.sitemap_list .coloumn {
  column-count: 2;
  column-gap: 2em;
  width: 65%;
}

.disclaimer_contain {
  padding: 6em 0;
  background: #edf2f6;
}

.disclaimer_contain h3 {
  font-size: 2em;
  margin: 0 0 1.5em;
  font-weight: 700;
}

.listingpara.no-col {
  column-count: 1;
}

.disclaimer-icon {
  background: rgba(0, 0, 0, 0) url("../images/disclaimer.png") no-repeat scroll 2em 1.5em / 12em auto;
}


.tech-icon {
  background: url(../images/chatapplication-sprite.png) no-repeat 0 0 #fff;
  border-radius: 6em 0 6em 6em;
  float: left;
  height: 10.313em;
  margin-top: 5em;
  width: 18.625em;
  box-shadow: 0 0 3.750em rgba(65, 95, 163, 0.1);
  background-size: 49.375em;
  position: absolute;
  left: 0;
  top: 0;
}

.tech-icon.xmpp {
  background-position: 4em 3em;
}

.tech-icon.php {
  background-position: -16em 3em;
}

.tech-icon.mysql {
  background-position: -34.5em 2em;
}

.tech-icon.json {
  background-position: 3.5em -5em;
}

.tech-icon.java {
  background-position: -13.5em -7em;
}

.tech-icon.html {
  background-position: -29.5em -6.2em;
}

.tech-icon.sqllight {
  background-position: 4.5em -18em;
}

.tech-icon.obj-c {
  background-position: -14.5em -16em;
}

.tech-icon.ios-8 {
  background-position: -32.5em -18em;
}

.tech-icon.androidkitkat {
  background-position: -32.5em -60em;
}

.tech-icon.ios-9 {
  background-position: -14.5em -60.3em;
}

.tech-icon.tech-icon2 {
  left: 33.5em;
}

.tech-icon.tech-icon3 {
  left: 62em;
}

.tech-icon.tech-icon4 {
  left: 11.2em;
  top: 16em;
}

.tech-icon.tech-icon5 {
  left: 39.8em;
  top: 16em;
}

.tech-icon.tech-icon6 {
  left: 68.4em;
  top: 16em;
}

.tech-icon.tech-icon7 {
  left: 5.625em;
  top: 32em;
}

.tech-icon.tech-icon8 {
  left: 33.5em;
  top: 32em;
}

.tech-icon.tech-icon9 {
  left: 62em;
  top: 32em;
}

.barkilyapptechs .tech-icon.tech-icon7 {
  left: 51.85em;
  top: 32em;
}

.barkilyapptechs .tech-icon.tech-icon8 {
  left: 23.2em;
  top: 32em;
}

.tech-icon.node {
  background-position: 4em -28em;
}

.download_app .btn-center a {
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.5em;
  width: 13em;
}

.download_app .btn-center a.veiw_web {
  background: #000;
  height: 3em;
  line-height: 3em;
  padding: 0 2.5em;
  width: auto;
  color: #fff;
  border-radius: 0.3em;
  font-size: 1.2em;
  font-weight: 500;
  border: 2px solid transparent;
}

.download_app .btn-center a.veiw_web:hover {
  color: var(--black-color);
  background-color: transparent;
  border: 2px solid var(--black-color);
}

.tech-icon.laravel {
  background-position: 1em -49em;
}

.tech-icon.jquery {
  background-position: -15.3em -47.2em;
}

.tech-icon.googlemaps {
  background-position: -33em -46.5em;
}

.tech-icon.socialft {
  background-position: 5em -60em;
}

.awesometechs .technologieslist {
  padding-bottom: 9em;
}

.bannericon.casestudies {
  background: url(../images/casestudy-sprite.png) no-repeat;
  background-size: 97.3em;
  background-position: 3.5em 1em;
}

.casestudiesbox {
  padding: 6em 0;
}

.casestudiesbox .box {
  -webkit-box-shadow: 1px 1px 4px 4px #e8ebee;
  box-shadow: 1px 1px 4px 4px #e8ebee;
  background: #fff;
  padding: 5.5em 4.1em;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* margin: auto 0 0; */
}

.casestudiesbox .box:last-child {
  margin: 0;
}


.casestudiesbox {
  padding: 6em 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 2em;
  grid-row-gap: 2em;
}

.casestudiesbox .box h3 {
  font-size: 2.5em;
  color: var(--black-color);
  text-transform: uppercase;
  font-weight: 500;
  line-height: 1.2em;
  margin: 0 0 1em;
  text-align: center;
}

.casestudiesbox .box h3 br {
  display: none;
}

.casestudiesbox .box.casestudies2 .caselogo {
  background-position: -71.65em 0;
}

.casestudiesbox .box.casestudies3 .caselogo {
  background-position: -71.65em -12.5em;
}

.casestudiesbox .box.casestudies4 .caselogo {
  background-position: -37.5em -11em;
}

.casestudiesbox .box.casestudies5 .caselogo {
  background-position: -31em -18em;
  background-size: 80em auto;
}

.casestudiesbox .box.casestudies6 .caselogo {
  background-position: -71em -20.9em;
}

.casestudiesbox .box .caselogo.hwyhaulApp {
  background: url(../images/hwyhaul-logo2.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.wesTracking {
  background: url(../images/wes-tracking-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.sneakyLinks {
  background: url(../images/sneakylinks-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.spaceCar {
  background: url(../images/space-car-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.mylo {
  background: url(../images/mylo-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.skyQuestt {
  background: url(../images/skyquest-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.guidedByGlow {
  background: url(../images/guided-by-glow-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.pattrnApp {
  background: url(../images/pattrn-app-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}

.casestudiesbox .box .caselogo.vrmaker {
  background: url(../images/thevrmaker-logo.png) no-repeat;
  background-size: contain;
  background-position: center center;
}




/* .ourappexpertise,.load-switimg{
    display: none;
  } */


.processPath {
  margin: 8em 0 0;
}

.processPath-grid {
  display: flex;
  align-items: center;
}

.processPath-grid.reverse {
  flex-direction: row-reverse;
}

.processPath-grid.reverse .processPath-section-content {
  text-align: right;
}

.inner-contain.process-mobile-devlopment {
  border-bottom: 0;
}

.processPath .processPath-section+.processPath-section {
  margin: 4em 0 0;
}

.processPath-grid .processPath-cols.processPathImg-cols {
  padding-right: 3em;
}

.processPath-grid.reverse .processPath-cols.processPathImg-cols {
  padding-right: 0;
  padding-left: 3em;
}

.weather-calcy-right {
  padding: 0 0 0 4em;
}

.biground {
  display: none;
}

.expertiseround h3 {
  position: static;
  display: block;
}

.expertiseround {
  height: auto;
  width: auto;
  background: inherit;
  padding-bottom: 4em;
}

.expertiseround-applewatch .icon1 {
  background-position: -16em -2em;
}

.expertiseround-applewatch .icon3 {
  background-position: -28em -1em;
}

.expertiseround-applewatch .icon4 {
  background-position: -39em -1em;
}

.expertiseround-applewatch .icon5 {
  background-position: -50em -1em;
}

.expertiseround-applewatch .icon6 {
  background-position: -61em -1em;
}

.expertiseround-applewatch .icon8 {
  background-position: 0.5em -14em;
}

.expertiseround .whiteroundicon {
  position: relative;
  background-size: auto;
}

.expertiseround h3 {
  text-align: center;
}

.expertiseround-wrap {
  display: grid;
  grid-template-columns: 10em 10em 10em 10em 10em 10em;
  grid-column-gap: 3em;
  grid-row-gap: 4em;
  margin: 4em 0 0;
  justify-content: center;
}

.expertiseround-wrap .whiteroundicon {
  margin: 0 auto;
}

.expertiseround .whiteroundicon h6 {
  font-size: 1em;
}

.watch-list li+li {
  margin: 8em 0 0;
}

.exIcon {
  background-color: var(--white-color);
  width: 10em;
  height: 10em;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 23px 24px rgb(0 0 0 / 6%);
}

.exIcon img {
  max-width: 5em;
  width: 100%;
}

.exIcon.small img {
  max-width: 3em;
}

.expertiseround-wrap h6 {
  color: var(--black-color);
  font-weight: 500;
  font-size: 1.3em;
  margin: 1.5em 0 0;
  line-height: 1.3;
}

.video-frame.fixedHeight iframe {
  height: 300px;
}

.loadSwitImage {
  text-align: center;
  margin: 2em 0;
}

.loadSwitWrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 2em;
  grid-row-gap: 2em;
  margin: 3em 0 0;
}

.loadSwitItem {
  padding: 2em;
  position: relative;
  border: 0.780392px solid var(--linkWater-color);
  box-shadow: 2px 18px 19px rgb(0 0 0 / 6%);
  border-radius: 10px;
}

.loadSwitItem p {
  text-align: center;
}

.loadSwitItem p br {
  display: none;
}

.btn-center a {
  display: inline-block;
}

.btn-center a img {
  max-width: 16em;
}


.casestudies-detail .withWidth {
  text-align: right;
}

.casestudies-detail .withWidth img {
  max-width: 35em;
  width: 100%;
}

.techWrap {
  display: grid;
  grid-template-columns: 14em 14em 14em 14em;
  grid-column-gap: 3em;
  grid-row-gap: 3em;
  justify-content: center;
  margin: 3em 0 0;
}

.techWrap .techIcon {
  border: 1px solid var(--linkWater-color);
  box-shadow: 2px 23px 24px rgb(0 0 0 / 6%);
  border-radius: 6em 0 6em 6em;
  display: flex;
  justify-content: center;
  padding: 1em;
}

.techWrap .techIcon img {
  width: 6em;
  height: 4em;
  object-fit: contain;
}

.thankYouSection .thankYouContent h2 {
  font-size: 1.7em;
  padding: 0.3em 0;
}

/* ====START CASE STUDY DETIALS PAGE===========================================================*/
.row {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}
.case-studies-detail-page{
  overflow-x: hidden;
}
.case-studies-detail-page .headerSection,
body.work .headerSection {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1025;
}

.case-studies-detail-page .headerSection .headerContent nav li a,
body.work .headerSection .headerContent nav li a{
  color: var(--white-color);
}

.case-studies-detail-page .headerSection .headerContent nav li a:hover,
body.work .headerSection .headerContent nav li a:hover{
  color: var(--theme-color);
}

.case-studies-detail-page .headerSection .headerContent nav ul li.nav-contact a:hover,
body.work .headerSection .headerContent nav li.nav-contact > a{
  color: var(--black-color);
}

.case-studies-detail-page .headerSection .headerContent .logo a,
body.work .headerSection .headerContent .logo a{
  position: relative;
  display: block;
  background-image: url('../images/logo_home_white.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}

.case-studies-detail-page .headerSection .headerContent .logo a img,
body.work .headerSection .headerContent .logo a img{
  opacity: 0;
}

.csd-hero-banner {
  position: relative;
  width: 100%;
  min-height: 58.4em;
  padding-top: 12.5em;
  z-index: 150;
  margin-bottom: 9.375em;
}

.csd-hero-banner .wave-img {
  position: absolute;
  left: 0;
  bottom: 100px;
  width: 100%;
  user-select: none;
  pointer-events: none;
  z-index: -1;
}

.csd-hero-banner:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  width: 100%;
  height: 8.125em;
  background-image: url('../images/wave-shape.png');
  background-size: 100% 100%;
  background-position: -10.6em;
  user-select: none;
  pointer-events: none;
  z-index: -1;  
}

.csd-hero-banner .placeholder-img {
  position: absolute;
  top: 20%;
  right: 6%;
  max-width: 60%;
  z-index: -1;
  user-select: none;
  pointer-events: none;
}

.csd-hero-banner .placeholder-bg {
  position: absolute;
  top: 135px;
  left: 0;
  width: 100%;
  height: 58%;
  background-repeat: repeat;
  background-position: top left;
  z-index: -1;
  user-select: none;
  pointer-events: none;
}

.csd-hero-banner .placeholder-bg.mylo {
  width: 50%;
  right: 20%;
  left: auto;
}

.csd-hero-banner .csd-hero-row {
  display: flex;
  justify-content: space-between;
  max-width: 70rem;
  margin: 0 auto;  
  position: relative;
}
.csd-hero-banner.desktop .csd-hero-row{
  max-width: 100%;
}

.csd-hero-banner .content {
  margin-top: 6.25em;
  width: 40%;
}

.csd-hero-banner .content .title {
  font-size: 5em;
  font-weight: 900;
  color: var(--white-color);
  text-align: left;
  line-height: 1;
  padding: 0;
  margin: 0 0 1.5rem;
}
.csd-hero-banner .content .title strong{
  font-weight: 900;
}
.csd-hero-banner .content .title span{
  font-weight: 400;
}
.csd-hero-banner .content .sub-title {
  font-size: 1.5625em;
  font-weight: 500;
  color: var(--white-color);
}


.csd-hero-banner .content .logo-circle {
  display: inline-block;
  width: 27.875em;
  height: 27.875em;
  object-fit: contain;
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  margin-top: 5.25em;
}

.csd-hero-banner .image{
  position: absolute;
  top: 0;
  right: -6.25em;
}
.csd-hero-banner.desktop .image{
  right: 0;
  text-align: right;
  width: 58%;
}

.csd-hero-banner .iphone {
  width: 36.375em;
  margin-top: -2.12em;
}
.csd-hero-banner .desktop {
  width: 100%;
  margin-top: 5em;
}

.sec-py {
  position: relative;
  padding: 6.25em 0;
}

.sec-title {
  position: relative;
  max-width: 772px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  padding-right: 72px;
  padding-left: 72px;
}

.sec-title p {
  font-size: 1.125em;
  font-weight: 700;
  line-height: normal;
  color: var(--black-color);
  padding-bottom: 0;
  margin-bottom: 0.875rem;
}

.sec-title h5 {
  font-size: 2.6875em;
  font-weight: 700;
  line-height: normal;
  color: var(--black-color);
  margin-bottom: 0;
}

.sec-title.white p,
.sec-title.white h5 {
  color: var(--white-color);
}

.sec-title .decor-img1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 5.9375em;
  height: 4.9em;
  -webkit-mask-image: url(../images/csd-title-props1.png);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  -webkit-mask-position: center center;
}

.sec-title .decor-img2 {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 2.5625em;
  height: 2.1875em;
  -webkit-mask-image: url(../images/csd-title-props2.png);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  -webkit-mask-position: center center;
}

.text-uppercase {
  text-transform: uppercase;
}

.fonts-style-view {
  display: flex;
  justify-content: center;
  text-align: center;
  margin: 4.25em 0 3.125em;
}

ul.theme-colors {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0;
  margin-bottom: 4.375em;
  grid-gap: 10%;
}

.theme-colors li {
  position: relative;
  display: block;
  width: 10em;
  height: 10em;
  border-radius: 50%;
}

.theme-colors li.shadow {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.theme-colors li p {
  position: absolute;
  top: 100%;
  padding: 0;
  margin: 0;
  width: 100%;
  text-align: center;
  font-size: 1.75em;
  color: #4A4A4A;
  font-weight: 500;
  text-transform: uppercase;
  line-height: normal;
  margin-top: 1.5em;
}

ul.project-lang-list {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

ul.project-lang-list li {
  width: 10em;
  height: 5em;
  margin: 0 3vw;
  margin-top: 50px;
}

ul.project-lang-list li img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.csd-project-sec {
  position: relative;
  padding-bottom: 100px;
  overflow: hidden;
}
.csd-project-sec .sec-title{
  min-height: 92px;
}
.csd-project-sec .sub-title {
  font-size: 1.3125em;
  font-weight: 400;
  color: var(--white-color);
  text-align: center;
  padding-bottom: 0;
  margin: 1.5rem auto 2.5rem;
  max-width: 60em;
  line-height: 142.857%; /* 142.857% */
  font-family: var(--proximaNova-font);
}

.projects-design-sec .row {
  align-items: center;
  justify-content: space-between;
  padding: 3.75em 0;
}

.projects-design-sec.desktop .row {
  margin-bottom: 2.5em;
}

.projects-design-sec.desktop .row:last-child {
  margin-bottom: 0;
}
.projects-design-sec .row > .col-6{
  max-width: 45%;
}

.projects-design-sec .row:nth-child(odd) .imgCol {
  text-align: right;
  padding-right: 3.125em;
}

.projects-design-sec .row:nth-child(even) {
  flex-direction: row-reverse;
}

.projects-design-sec .row:nth-child(even) .contentCol {
  padding-right: 3.125em;
}

.projects-design-sec .ss-img {
  max-width: 34.75em;
}

.projects-design-sec .content {
  position: relative;
  max-width: 28.75em;
  margin-bottom: 6.25em;
  z-index: 150;
}
.projects-design-sec .content-inner{
  position: relative;
}
.projects-design-sec .content-inner::before {
  content: '';
  width: 9.375em;
  height: 9.375em;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  position: absolute;
  left: -3.125em;
  top: 0;
  pointer-events: none;
  z-index: -1;
}

.projects-design-sec .row:nth-child(even) .content-inner::before {
  left: auto;
  right: -3.125em;
}

.projects-design-sec .content .decrImg {
  width: 6em;
  margin-left: auto;
  margin-bottom: 2em;
}

.projects-design-sec .row:nth-child(odd) .content .decrImg img {
  transform: rotateY(180deg);
}

.projects-design-sec .content h5 {
  font-size: 2.6875em;
  line-height: normal;
  font-weight: 700;
  color: var(--white-color);
  text-align: left;
  padding-top: 0.45em;
  margin-top: 0;
  margin-bottom: 0.4em;
  text-transform: uppercase;
}

.projects-design-sec .content p {
  font-size: 1.125em;
  font-weight: 400;
  line-height: 166.667%;
  color: var(--white-color);
  text-align: left;
  padding-bottom: 0;
  margin-bottom: 0;
}

.projects-design-sec .row:nth-child(even) .content {
  margin-left: auto;
  text-align: right;
}

.projects-design-sec .row:nth-child(even) .content .decrImg {
  margin-left: 0;
}

.projects-design-sec .row:nth-child(even) .content p,
.projects-design-sec .row:nth-child(even) .content h5 {
  text-align: right;
}

.app-store-sec {
  position: relative;
  background-color: #F2F2F2;
  text-align: center;
}

.app-store-sec::before {
  content: '';
  position: absolute;
  left: 50%;
  top: -98px;
  transform: translateX(-50%);
  border: 50px solid transparent;
  border-bottom-color: #F2F2F2;
  z-index: 1;
  pointer-events: none;
}

.app-store-sec .app-store-btn {
  display: inline-block;
  max-width: 250px;
}

.app-store-sec .app-store-btn+.app-store-btn {
  margin-left: 40px;
}

.app-store-sec .app-link-btn {
  position: relative;
  display: inline-block;
  padding: 20px 60px;
  background-color: #F44A42;
  border: 2px solid #F44A42;
  border-radius: 30px;
  color: var(--white-color);
  font-size: 18px;
  font-weight: 500;
  margin-top: 50px;
  transition: 0.3s;
}

.app-store-sec .app-link-btn:hover {
  color: #F44A42;
  background-color: transparent;
}

/* ====END CASE STUDY DETIALS PAGE=============================================================*/

/* ====FOOTER SECTION===========================================================*/

.footerSectionNew .footerTopSection {
  background-image: url(../images/footer-background.webp);
  background-repeat: no-repeat;
  background-position: 100% 100%;
  background-size: cover;
  padding: 5.313em 0 4.688em 0;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 2fr;
  grid-column-gap: 7.625em;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h3 {
  font-weight: 700;
  font-size: 1.75em;
  color: var(--black-color);
  text-align: left;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h3:after {
  content: "";
  background-color: var(--gainsboro-color);
  height: 5px;
  width: 2em;
  margin: 0.964em 0 1.5em;
  display: block;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h5 {
  font-weight: 700;
  font-size: 1.5em;
  color: var(--black-color);
  text-align: left;
  margin: 0 0 0.5em;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox p {
  font-family: var(--proximaNova-font);
  font-size: 1.5em;
  color: var(--black-color);
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h4 {
  font-weight: 400;
  font-size: 1.75em;
  color: var(--black-color);
  text-align: left;
  margin: 0 0 0.5em;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox ul a {
  font-weight: 700;
  font-size: 1.5em;
  color: var(--black-color);
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox ul a:hover {
  color: var(--theme-color);
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-column-gap: 1.25em;
  margin: 1.75em 0 0;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset input[type="email"] {
  border: 1px solid var(--nobel-color);
  border-radius: 10px;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset input[type="submit"] {
  text-indent: -9999px;
  background-image: url(../images/send.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 2.5em;
  font-size: 1.5em;
  padding: 1em 2em;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .awardList {
  margin: 3.438em 0 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 2.5em;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .awardList li img {
  max-width: 12em;
  width: 100%;
  object-fit: cover;
}

.footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox ul.letsTalkBox li+li {
  margin: 4.875em 0 0;
}

.footerSectionNew .footerMiddleSection {
  background-color: var(--raisinBlack-color);
  padding: 2.5em 0;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .socialBlock {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 1.75em;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .socialBlock li a {
  display: inline-block;
  width: 3em;
  height: 3em;
  background-color: var(--black-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .socialBlock li a:hover {
  background-color: var(--theme-color);
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .socialBlock li+li {
  margin: 0 0 0 1.375em;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul {
  display: flex;
  justify-content: center;
  align-items: center;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li {
  display: flex;
  align-items: center;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li:not(:last-child):after {
  content: "";
  background-color: var(--white-color);
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  display: inline-block;
  margin: 0 1em;
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li a {
  font-weight: 400;
  font-size: 1.25em;
  text-transform: capitalize;
  color: var(--white-color);
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li a:hover {
  color: var(--theme-color);
}

.footerSectionNew .footerMiddleSection .footerMiddleContent .socialBlock li a img {
  height: 1.5em;
  object-fit: contain;
}

.footerSectionNew .footerBottomSection {
  background-color: var(--nightRider-color);
  padding: 1.25em 0;
}

.footerSectionNew .footerBottomSection .footerBottomContent span.copyright {
  font-weight: 400;
  font-size: 1.125em;
  color: var(--white-color);
  line-height: 1.5;
}

/* START FOOTER RESPONSIVE VIEWS */
@media only screen and (max-width: 1280px) {
  .footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li {
    margin: 1em 0 0;
  }

  .footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li a {
    font-size: 1em;
  }

  .footerSectionNew .footerBottomSection .footerBottomContent span.copyright {
    font-size: 1em;
  }
  .csd-hero-banner .image{
    right: -5.25em;
  }
}

@media only screen and (max-width: 1024px) {
  .footerSectionNew .footerTopSection {
    padding: 4.5em 0 4em 0;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h3 {
    font-size: 1.5em;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h5,
  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox p {
    font-size: 1.3em;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox h4 {
    font-size: 1.3em;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox ul a {
    font-size: 1.3em;
  }

  .footerSectionNew:not(.innerFooter) .footerTopSection .footerTopContent .footerGrid .footerBox ul.letsTalkBox li+li {
    margin: 4em 0 0;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid {
    grid-template-columns: 1fr 1fr;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox:nth-child(3) {
    grid-column: 1 / span 2;
    padding: 3em 0 0;
  }

  .footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul {
    flex-wrap: wrap;
  }
}

@media only screen and (max-width: 767px) {
  .footerSectionNew .footerTopSection .footerTopContent .footerGrid {
    display: block;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox {
    width: 100%;
  }

  .footerSectionNew .footerMiddleSection .footerMiddleContent .footerNav ul li:not(:last-child):after {
    width: 0;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm {
    display: flex;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset {
    margin: 1em 0 0;
    flex: 1;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset+fieldset {
    flex: inherit;
  }

  .footerSectionNew .footerTopSection .footerTopContent .footerGrid .footerBox .subscriberBox .newsletterForm fieldset input[type="submit"] {
    font-size: 1.1em;
    height: 100%;
  }
  .csd-hero-banner .image{
    right:0;
  }
}

@media only screen and (max-width: 400px) {}

/* END FOOTER RESPONSIVE VIEWS */

/* ====START THEME TABS===========================================================*/
.tab-menu {
  margin-top: 34px;
}

.tab-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
}

.tab-menu ul li {
  max-width: 100%;
  min-width: 200px;
  margin: 0 5px;
}

.tab-menu ul li:first-child {
  margin-left: 0;
}

.tab-menu ul li:last-child {
  margin-right: 0;
}

.tab-menu ul li a {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.44px;
  font-weight: 600;
  padding: 18px 10px;
  display: block;
  text-decoration: none;
  transition: 0.5s all;
  background: var(--theme-color);
  border: 2px solid var(--theme-color);
  border-bottom: 0;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  text-align: center;
}

.tab-menu ul li a:hover {
  color: var(--black-color);
  background: #ffd132;
  border-color: #ffd132;
  text-decoration: none;
}

.tab-menu ul li a.active {
  color: var(--black-color);
  background: var(--white-color);
  border-color: var(--white-color);
  text-decoration: none;
}

.tab-box {
  display: none;
}

.tab-main-box {
  background: var(--white-color);
  padding: 1rem;
  border: 2px solid var(--white-color);
  margin-top: -2px;
  border-radius: 20px;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1), -5px -5px 10px rgba(0, 0, 0, 0.1);
}

/* ====END THEME TABS===========================================================*/

/* ====PROJECT DETAILS SECTION===========================================================*/
.csd-project-details-sec {
  position: relative;
  min-height: calc(500px + 18vw);
  background-color: var(--white-color);
  overflow: hidden;
  z-index: 150;
}

.csd-project-details-sec .clipPath {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(400px + 15vw);
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 80%, 0 50%);
  clip-path: polygon(0 0, 100% 0, 100% 80%, 0 50%);
  z-index: -1;
}

.csd-project-details-sec .tab-main-box {
  position: relative;
  min-height: calc(400px + 5vw);
  z-index: 150;
}

.csd-project-details-sec .tab-main-box::before {
  content: "";
  width: 100px;
  height: 100px;
  background-color: var(--white-color);
  border-radius: 50%;
  position: absolute;
  left: -50px;
  top: 70px;
  z-index: -1;
}

.csd-project-details-sec .tab-box p {
  font-size: 17px;
  margin-bottom: 1rem;
  padding-bottom: 0;
  line-height: 1.6;
  color: var(--black-color);
}

.csd-project-details-sec .tab-box ul,
.csd-project-details-sec .tab-box ol {
  padding-left: 17px;
}

.csd-project-details-sec .circle {
  position: absolute;
  top: 170px;
  right: -300px;
  max-width: 600px;
}

.csd-hero-art{
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: -2;
  background-attachment: fixed;
  opacity: 1;
}
.hero-art-repeart{
  background-size: contain;
  background-repeat: repeat;
}
.csd-hero-row .app-icons {
    position: absolute;
    top: 1.375em;
    right: 2.5em;
    left: 2.5em;
    display: flex;
    justify-content: space-between;
    z-index: 1;
}
.csd-hero-row .app-icons a{
  pointer-events: none;
  width: 4.5em;
  height: 4.5em;
}
.csd-hero-row .app-icons a svg{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.app-project-bg{
  background-size: cover;
  background-position: center;
}


/* ====END PROJECT DETAILS SECTION=======================================================*/

