@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap");

@tailwind base;
@tailwind components;
@tailwind utilities;

@font-face {
  font-family: "suisseIntl-bold";
  src: url("../fonts/SuisseIntl-Bold.woff");
}
@font-face {
  font-family: "suisseIntl-Light";
  src: url("../fonts/SuisseIntl-Light.woff");
}
@font-face {
  font-family: "suisseIntl-medium";
  src: url("../fonts/SuisseIntl-Medium.woff");
}
@font-face {
  font-family: "suisseIntl-regular";
  src: url("../fonts/SuisseIntl-Regular.woff");
}
@font-face {
  font-family: "suisseIntl-semiBold";
  src: url("../fonts/SuisseIntl-SemiBold.woff");
}

* {
  outline: none;
}

html {
  scroll-behavior: smooth;
}

.inter-tight {
  font-family: "Inter Tight", sans-serif;
}
.inter {
  font-family: "Inter", sans-serif;
}

.leading-111 {
  line-height: 111.111% !important;
}
.leading-120 {
  line-height: 120% !important;
}
.leading-122 {
  line-height: 122.727% !important;
}
.leading-130 {
  line-height: 130% !important;
}
.leading-133 {
  line-height: 133.333% !important;
}
.leading-140 {
  line-height: 140% !important;
}
.leading-142 {
  line-height: 142.857% !important;
}
.leading-155 {
  line-height: 155.556% !important;
}

.custom-container {
  max-width: 100%;
}
header .mega-menu {
  top: 87px !important;
}
.header-scroll {
  z-index: 999999 !important;
}
.header-scroll nav:before {
  content: "";
  position: absolute;
  width: 88.71%;
  margin: auto;
  background: rgba(255, 255, 255, 0.4);
  left: 0;
  right: 0;
  height: 67px;
  border-radius: 10px;
  backdrop-filter: blur(77px);
  z-index: -1;
  transition: all 0.5s ease-in-out;
}

#header .main-menu-wrap {
  border-radius: 12px;
  /* background: rgba(239, 239, 239, 0.90); */
  /* backdrop-filter: blur(77px); */
  /* padding-left: 15px;
  padding-right: 15px; */
  transition: all 0.6s;
}
/* #header nav{
padding-top: 0px;
} */
#header .container {
  padding-inline: 16px !important;
  /* max-width: 94%;
    transition: all 0.5s ease-in-out ; */
}
.main-menu-wrap {
  transition: all 0.6s;
}

.mega-menu {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px) scale(0.95);
  transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out,
    visibility 0.4s;
}

.menu-item:hover .mega-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.mobile-menu {
  transition: transform 0.3s ease-in-out;
}

.mobile-submenu {
  transition: transform 0.3s ease-in-out;
}

.overflow-hidden {
  overflow: hidden;
}

.carousel-container img {
  opacity: 0;
  transition: opacity 1s;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1rem;
}

.carousel-container img.active {
  opacity: 1;
}

.heading-custom {
  position: relative;
  display: inline-block;
}
.heading-custom::before {
  content: "";
  position: absolute;
  width: 120px;
  height: 20px;
  background-image: url("../images/title-under.svg");
  background-repeat: no-repeat;
  background-size: cover;
  bottom: -20px;
  left: 0;
  right: 0;
  margin: auto;
}
.after-end::before {
  margin-right: 20px;
  width: 100px;
  background-size: 100px;
}

.after-start::before {
  margin-left: 20px;
  width: 110px;
  background-size: 100px;
}
.industry-expert-effect::before {
  content: "";
  position: absolute;
  width: 112%;
  height: 100px;
  border-radius: 50px;
  background-image: url("../images/before.png");

  z-index: 999;
  top: -31px;
  left: -20px;
  background: linear-gradient(
    180deg,
    rgb(241, 241, 241, 1) 100%,
    rgb(251 250 250) 50%,
    rgb(251 250 250) 10%
  );
  filter: blur(15px);
}

.safari-website .industry-expert-effect::before {
  content: "";
  position: absolute;
  width: 132%;
  height: 100px;
  border-radius: 50px;
  top: -31px;
  left: -20px;
  z-index: 1;

  background: linear-gradient(
    180deg,
    rgba(241, 241, 241, 1) 100%,
    rgb(251, 250, 250) 50%,
    rgb(251, 250, 250) 10%
  );

  filter: blur(15px);
  transform: translateZ(0); /* Fix Safari filter/z-index issues */
  pointer-events: none;
}
.industry-expert-effect::after {
  content: "";
  position: absolute;
  width: 113%;
  height: 100px;
  border-radius: 50px;
  background-image: url("../images/after.png");
  z-index: 999;
  bottom: -38px;
  left: -26px;
  background: linear-gradient(
    180deg,
    rgb(241, 241, 241, 1) 100%,
    rgb(251 250 250) 50%,
    rgb(251 250 250) 10%
  );
  filter: blur(15px);
}

.safari-website .industry-expert-effect::after {
  content: "";
  position: absolute;
  width: 132%;
  height: 100px;
  border-radius: 50px;
  bottom: -31px;
  left: -30px;
  z-index: 1;

  background: linear-gradient(
    180deg,
    rgba(241, 241, 241, 1) 100%,
    rgb(251, 250, 250) 50%,
    rgb(251, 250, 250) 10%
  );

  filter: blur(15px);
  transform: translateZ(0); /* Fix Safari filter/z-index issues */
  pointer-events: none;
}
.heading-custom-line {
  position: relative;
  display: inline-block;
}
.heading-custom-line:before {
  content: "";
  position: absolute;
  width: 95px;
  height: 20px;
  background-image: url("../images/line-2.svg");
  background-repeat: no-repeat;
  background-size: 95px;
  bottom: -20px;
  left: 0;
  right: 0;
  margin: auto;
}
.line-after-end::before {
  margin-right: 20px;
  background-size: 90px;
  width: 90px;
}

.line-after-start::before {
  margin-left: 20px;
  background-size: 90px;
  width: 90px;
}

.progress-end {
  position: relative;
}
.progress-end:before {
  margin-right: 10px;
  background-size: 75px;
  width: 80px;
}

.custom-small-line:before {
  bottom: -14px;
  background-size: 70px;
  margin-left: 20px;
}

.connect-custom-line:before {
  bottom: -14px;
  background-size: 80px;
  left: 60px;
}
.api-inegration-span:before {
  bottom: -14px;
  background-size: 81px;
  left: 140px !important;
  margin-left: 0;
}

.request-demo-line::before {
  background-size: 90px;
  bottom: -15px;
  left: 10px;
}

.packedEverything:before {
  margin-right: 32px;
  width: 70px;
  background-size: 70px;
  bottom: -12px;
}

.bimReady:before {
  margin-left: 60px;
  width: 80px;
  background-size: 80px;
  bottom: -15px;
}

.dataSecurity:before {
  margin-right: 30px;
  bottom: -25px;
}

.background-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  transition: opacity 0.5s ease-in-out;
}

.background-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.background-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tab-content {
  display: none;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.tab-content.active {
  display: block;
  opacity: 1;
}

.tab-button {
  transition: all 0.3s ease;
  border-radius: 8px;
}

.tab-button.active {
  background: rgba(0, 0, 0, 0.56);
  color: #fff;
  font-weight: 600;
}
.tab-button.active:hover {
  background: rgba(0, 0, 0, 0.56);
  color: #fff;
}

.marquee-track {
  animation: scroll-left 130s linear infinite;
}

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

.active-tab {
  border-color: #ff0006 !important;
  font-family: "suisseIntl-medium" !important;
  color: #000 !important;
}

.tab-contents {
  display: flex;
  align-items: flex-start;
  transition: all 500ms ease-in-out;
  border-radius: 10px;
  position: absolute;
  list-style: none;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 30px 25px;
  gap: 40px;
}
.tab-contents:nth-child(1) {
  top: 90px;
  width: 98%;
  opacity: 0.12;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}
.tab-contents:nth-child(2) {
  top: 60px;
  width: 94%;
  opacity: 0.5;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}
.tab-contents:nth-child(3) {
  top: 33px;
  width: 85%;
  opacity: 0.12;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}
.tab-contents:nth-child(4) {
  top: 33px;
  width: 90%;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}
.tab-contents:nth-child(5) {
  top: 33px;
  width: 100%;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}

.tab-contents:nth-child(6) {
  top: 33px;
  width: 100%;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}

.tab-contents:nth-child(7) {
  top: 33px;
  width: 100%;
  margin: 0px auto !important;
  left: 0;
  right: 0;
}

.tab-contents.active {
  opacity: 1 !important;
  width: 98% !important;
  z-index: 1;
}

.monitor-cards {
  padding: 0px 25px 0px 43px;
}

#vimeo-container.scaled iframe {
  scale: 1.5;
  transform-origin: center;
}

#vimeo-container iframe {
  /* position: absolute; */
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  transform-origin: center;
}

.case-tab-button.active {
  background: #f7f7f7;
  border-color: #ff0006 !important;
}

::-webkit-scrollbar {
  display: none;
}

.container {
  padding: 0px 15px;
}

.rotating-words {
  /* display: inline-block; */
  display: inline;
  /* height: 1.15em; */
  overflow: hidden;
  vertical-align: bottom;
  position: relative;
  top: -43px;
}

.rotating-words span {
  display: block;
  /* height: 1.15em; */
  animation: topToBottom 9.5s linear infinite 0s;
  opacity: 0;
  overflow: hidden;
  position: absolute;
}

.rotating-words span:nth-child(2) {
  animation-delay: 2.5s;
  -ms-animation-delay: 2.5s;
  -webkit-animation-delay: 2.5s;
}
.rotating-words span:nth-child(2) {
  animation-delay: 2.5s;
  -ms-animation-delay: 2.5s;
  -webkit-animation-delay: 2.5s;
}
.rotating-words span:nth-child(3) {
  animation-delay: 5s;
  -ms-animation-delay: 5s;
  -webkit-animation-delay: 5s;
}
.rotating-words span:nth-child(4) {
  animation-delay: 7.5s;
  -ms-animation-delay: 7.5s;
  -webkit-animation-delay: 7.5s;
}

@-moz-keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    -moz-transform: translateY(40px);
  }
  10% {
    opacity: 0;
    -moz-transform: translateY(0px);
  }
  25% {
    opacity: 0;
    -moz-transform: translateY(0px);
  }
  30% {
    opacity: 1;
    -moz-transform: translateY(-40px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    -webkit-transform: translateY(40px);
  }
  10% {
    opacity: 1;
    -webkit-transform: translateY(0px);
  }
  25% {
    opacity: 1;
    -webkit-transform: translateY(0px);
  }
  30% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-ms-keyframes topToBottom {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 0;
    -ms-transform: translateY(-40px);
  }
  10% {
    opacity: 1;
    -ms-transform: translateY(0px);
  }
  25% {
    opacity: 1;
    -ms-transform: translateY(0px);
  }
  30% {
    opacity: 0;
    -ms-transform: translateY(40px);
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.we_Can {
  max-width: 460px;
}

@media (min-width: 1530px) {
  .container {
    max-width: 1440px !important;
  }
  .header-scroll nav:before {
    width: 1410px;
    height: 74px;
  }
}

@media (min-width: 1600px) {
  .container {
    max-width: 1440px !important;
  }
  .header-scroll nav:before {
    width: 90% !important;
    height: 74px;
  }
  .back-bg-box {
    max-width: 1680px !important;
  }
}
@media (min-width: 1700px) {
 .header-scroll nav:before {
    width: 90% !important;
  }
}
@media (min-width: 1800px) {
 .header-scroll nav:before {
    width: 89% !important;
  }
}

@media (min-width: 1900px) {
 .header-scroll nav:before {
    width: 84% !important;
  }
}
@media (min-width: 1950px) {
.header-scroll nav:before {
    width: 74% !important;
  }
}
@media (min-width: 2200px) {
  .header-scroll nav:before {
    width: 56% !important;
  }
  .back-bg-box {
    max-width: 1680px !important;
  }
}
@media (min-width: 3000px) {
  .header-scroll nav:before {
    width: 40% !important;
  }
}
@media (min-width: 1600px) {
  .container {
    max-width: 1440px !important;
  }
  .header-scroll nav:before {
    width: 1410px;
    height: 74px;
  }
}

@media (min-width: 1800px) {
  .container {
    max-width: 1600px !important;
  }
  .header-scroll nav:before {
    width: 1600px;
    height: 74px;
  }
  .sticky.new-sticky-box {
    top: 94px !important;
  }
  .featuers-banner .features-bg-box {
    left: 226px !important;
    top: -46px !important;
  }
  .animation-box .spiner-1 {
    left: 91px !important;
  }
  .animation-box .spiner-2 {
    left: 350px !important;
  }
  .slider-box::before {
    height: 608px !important;
    left: -309px !important;
    top: 201px !important;
  }
  .slider-box::after {
    height: 608px !important;
    top: 201px !important;
    left: 89% !important;
  }
  .safari-website-website.safari-website body {
  text-rendering: optimizeLegibility;
}
  .safari-website-website.safari-website .font-suisse_semibold {
    font-family: "suisseIntl-medium" !important;
    font-weight: 800 !important;
  }
  .safari-website-website.safari-website #header a {
    font-weight: 300 !important;
  }
  .safari-website-website.safari-website #vimeo-container iframe {
    border-radius: 20px;
    scale: 1;
  }
  .safari-website-website.safari-website .power-afari-box {
    margin-left: auto;
  }
}
.white-heading-box {
  /* background-color: rgba(255, 255, 255, 0.53); */
  width: fit-content;
  margin-inline: auto;
  padding-inline: 30px;
}

@media screen and (min-width: 1470px) and (max-width: 1535px) {
}
@media screen and (max-width: 1279px) {
  .rotating-words {
    top: -42px;
  }
  .we_Can .heading-custom::before {
    width: 95px;
    background-size: 80px;
    bottom: -30px;
  }
  .header-scroll nav:before {
    width: 994px;
    height: 67px;
  }
}

@media screen and (max-width: 1400px) {
  .header-scroll nav:before {
        width: 97%;
  }
}
@media screen and (max-width: 1300px) {
  .header-scroll nav:before {
        width: 88%;
  }
}
@media screen and (max-width: 1299px) {
  .header-scroll nav:before {
        width: 100%;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1279px) {
  .bimReady:before {
    width: 80px !important;
    background-size: 80px !important;
    bottom: -13px !important;
  }
}
#mobile-menu-button {
  color: #000 !important;
}
@media screen and (max-width: 1024px) {
  .section .content-card {
    z-index: 1;
    position: relative;
  }
  .section .card {
    position: relative;
  }
  .section .card h3 {
    line-height: 1.2;
  }
  .section.second .card::before {
    background: rgb(255 249 249 / 66%);
  }
  .section .card ul {
    justify-content: start;
  }
  .section .card ul li {
    align-items: baseline;
    text-align: start;
  }
  .section.first .card::before {
    border-radius: 30px;
  }
  .section .card::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgb(59 57 57 / 46%);
    border-radius: 24px;
  }
  .milston-banner::before {
    display: none;
  }
  .milston-banner h2 {
    margin-block-start: 0px !important;
  }
  .dekstop-image {
    overflow-x: hidden !important;
  }
  .career-tab-box {
    padding-left: 0px !important;
    width: 100% !important;
  }
  .led-image {
    display: none !important;
  }
  .tab-sticky-box {
    position: relative !important;
    height: auto !important;
  }
  #sliderBox .image-box {
    width: auto !important;
  }
  .tab-mobile-box {
    padding-top: 50px !important;
  }
  .logo-main-box .card {
    width: 22% !important;
  }
  .logo-main-box-2 .card {
    width: 22% !important;
  }
  .logo-main-box-3 .card {
    width: 22% !important;
  }
  .awardes-section-box .card {
    width: 31% !important;
  }
  .client-baner {
    padding-top: 100px !important;
  }
  .tab-faq-banner {
    padding-top: 100px !important;
  }
  #plugins {
    padding-top: 50px !important;
  }
  #bim {
    padding-top: 50px !important;
  }
  .customisation-box .card-image {
    height: auto !important;
  }
  .tab-tracking-heading {
    flex-wrap: wrap;
  }
  #analytics {
    padding-top: 50px !important;
  }
  .tab-margin-box {
    margin-top: 0px !important;
  }
  .projeact-ston-section {
    padding-top: 40px !important;
  }
  #powerful-comparison {
    margin-bottom: 50px !important;
    padding-bottom: 50px !important;
  }
  .ondimand-first-paddingbox {
    padding-block: 40px !important;
  }
  .ondimand-first-box {
    height: auto !important;
  }
  #on-click {
    gap: 50px !important;
  }
  .tab-image-animation-box {
    position: relative !important;
    top: -50px !important;
  }
  .globel-tab-image {
    width: 90% !important;
  }
  .manage-tab-card-box .card {
    width: 48% !important;
  }
  #globally-projects {
    margin-top: 20px !important;
  }
  .featuers-banner {
    height: auto !important;
  }
  .connteact-card {
    padding-inline: 0px !important;
  }
  .banner-tab-content {
    margin-inline: auto !important;
  }
  .power-afari-box {
    margin-left: 0px !important;
    padding-inline: 20px !important;
  }
  .power-afari-box h2 {
    text-align: center;
  }
  .tab-editer-box {
    min-height: 432px !important;
  }
  .api-box-for-tab #faq-wrapper {
    margin-right: 0px;
  }
  .api-banner-heading {
    margin-inline: auto;
  }
  .faq-tabs-box .faq-main-box .faqTabs {
    width: 100% !important;
    padding-right: 0px !important;
  }
  .faq-safari-box .faqTabs {
    padding-right: 0px !important;
    padding-block-end: 20px;
  }
  .ready-to-h2 .heading-custom-line:before {
    background-size: 60px;
    width: 60px;
    bottom: -17px;
  }

  .rotating-words {
    top: -33px;
  }
  .we_Can .heading-custom::before {
    width: 95px;
    background-size: 80px;
    bottom: -30px;
  }

  .api-inegration-span:before {
    bottom: -17px;
    background-size: 61px;
    left: 100px !important;
    margin-left: 0;
  }
  .api-box-for-tab {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    text-align: center;
  }
  .parameter-image {
    display: none !important;
  }
  .tab-icon-slider {
    top: -21px;
  }
  .overview-bg-box {
    top: -57px !important;
    left: -49px !important;
  }
  .feature-bg-video {
    margin-block-start: 100px;
  }
  .overview-bg-box.features-bg-box {
    left: 108px !important;
    top: 69px !important;
  }
  .animation-box .spiner-1 {
    position: absolute !important;
    left: 138px !important;
  }
  .animation-box .spiner-2 {
    position: absolute !important;
    left: 535px !important;
  }
  .tabvisual-box {
    height: 470px !important;
  }
}

@media screen and (max-width: 1023px) {
  .built-bg::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #00000061;
    background-repeat: no-repeat;
    background-size: cover;
  }
    .built-bg p {
      z-index: 1;
      position: relative;
    }

  .header-scroll .main-menu-wrap {
    padding: 7px 8px !important;
  }
  .header-scroll nav:before {
    width: 738px;
    height: 56px;
  }
  .header-scroll div#mobile-menu {
    top: 76px;
  }
  #maketingSwipes {
    transform: translate(0%, 104px) !important;
  }
}

@media screen and (max-width: 767px) {
  .prorges-befor::before {
    bottom: -21px !important;
  }
  .support-before::before {
    bottom: -22px !important;
  }
  .header-scroll .main-menu-wrap {
    padding: 7px 0px !important;
  }

  .marquee-track {
    animation: scroll-left 15s linear infinite;
  }

  .mobile-padding-hiring-box {
    padding-block: 50px !important;
    margin-bottom: 50px !important;
  }
  .faq-tabs-box {
    padding-block: 50px !important;
  }
  .awardes-section-box .card {
    width: 100% !important;
  }
  .logo-main-box .card {
    width: 45% !important;
  }
  .logo-main-box-2 .card {
    width: 45% !important;
  }
  .logo-main-box-3 .card {
    width: 45% !important;
  }
  .projeact-ston-section {
    padding-top: 0px !important;
  }
  #analytics {
    padding-top: 0px !important;
  }
  #powerful-comparison {
    margin-bottom: 0px !important;
  }
  .customisation-box .mobile-sub-heading-box {
    padding-bottom: 0px !important;
  }
  .manage-tab-card-box .card {
    width: 100% !important;
  }
  .mobile-tabing-code-button {
    overflow-x: scroll;
    justify-content: start !important;
  }
  .mobile-tabing-code-button button {
    flex-wrap: nowrap;
    white-space: nowrap;
    display: flex;
  }
  .tabvisual-box {
    height: auto !important;
  }
  .faq-tabs-box .faqTabs {
    display: block !important;
    width: 100% !important;
    padding-right: 0px !important;
  }
  .faq-main-box {
    flex-wrap: wrap;
  }
  .toltip-box-1 {
    bottom: 32px !important;
    left: 10% !important;
  }
  .toltip-box-2 {
    left: 10% !important;
  }
  .toltip-box-3 {
    left: 10% !important;
  }
  .toltip-box-4 {
    left: 10% !important;
  }
  .mob-inherit {
    position: unset;
  }
  .progress-end {
    position: relative;
  }

  .mob-inherit:before {
    margin-left: 0px;
  }
  .progress-end:before {
    margin-left: 50px;
  }
  .monitor-cards {
    padding: 0px 21px 0px 39px;
  }

  .header-scroll nav:before {
    width: 608px;
    height: 56px;
  }
  .header-scroll div#mobile-menu {
    top: 72px;
  }

  .rotating-words {
    top: -41px;
  }

  .connect-custom-line:before {
    bottom: -18px;
    background-size: 70px;
    left: 30px;
  }

  .api-inegration-span:before {
    bottom: -17px;
    background-size: 61px;
    left: 90px !important;
    margin-left: 0;
  }

  .request-demo-line::before {
    bottom: -18px;
    background-size: 60px;
    left: 10px !important;
  }

  .faqTabs {
    display: none;
  }
  #faqContainer {
    width: 100%;
  }

  .featuers-banner {
    height: auto !important;
  }
  .safari-website-website .logo-for-safari {
    overflow: hidden;
  }
  .we_Can .heading-custom::before {
    bottom: -15px;
  }
  .slider-box::before {
    display: none;
  }
  .slider-box::after {
    display: none;
  }
  .feature-bg-video {
    margin-block-start: 100px;
  }
  .overview-bg-box.features-bg-box {
    left: 59px !important;
    top: 89px !important;
  }
  .animation-box .spiner-2 {
    position: absolute !important;
    left: 178px;
  }
  .animation-box .spiner-1 {
    position: absolute !important;
    left: 46px;
  }
}

@media screen and (max-width: 640px) {
  .across-heading {
    line-height: 1.8;
  }
  .across-heading::before {
    bottom: -9px !important;
  }
  .aero-heading::before {
    bottom: -20px !important;
  }
  .header-scroll nav:before {
    width: 96%;
  }
  .visual-platform-h1 .heading-custom::before {
    width: 80px;
    background-size: 70px;
    bottom: -18px;
  }
  .rotating-words {
    top: -35px;
  }
  .connect-custom-line:before {
    background-size: 60px;
    left: 34px;
  }
  .heading-custom-line:before {
    bottom: -15px;
  }
}

.scale-1-2 {
  animation: scale-1-2 12s infinite;
}

/* @keyframes scale-1-2 {
  0%{
    scale: 1;
  }
  50%{
    scale: 1.1;
  }
  100%{
    scale: 1;
  }
} */

.visual-cards .card {
  /* margin:0px auto; */
}

.visual-cards .card {
  /* position: absolute;
  top: 0;
  left: 0;
  transition: all 0.5s ease;
  will-change: transform, opacity; */
}

.tab-btnsRActive {
  font-weight: 700 !important;
}

.visual-cards {
  /* top: 30px !important; */
  position: relative;
  top: 0px;
  z-index: 99999;
}

.card-container {
  perspective: 1000px;
}
.cardS {
  transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  transform-style: preserve-3d;
}
.cardS.active {
  z-index: 10;
  opacity: 1;
  transform: translateY(0) scale(1);
}
.cardS.prev {
  opacity: 0;
  transform: translateY(-100%) scale(0.9);
}
.cardS.next {
  opacity: 0;
  transform: translateY(100%) scale(0.9);
}

.masked-video {
  /* mask-image: url('../images/red-transparent.png');
  mask-size: cover;
  -webkit-mask-image: url('../images/red-transparent.png');
  -webkit-mask-size: cover; */
}

.masked-video:before {
  content: "";
  position: absolute;
  bottom: 200px;
  background: rgba(255, 255, 255, 1);
  width: 100%;
  height: 70px;
  left: 0;
  filter: blur(20px);
  z-index: 11;
}

textarea.editor {
  background: #000;
  resize: none;
  width: 99%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2px;
}
/* .CodeMirror {
  height: auto;
  font-size: 16px;
  background: #000;
  color: #d4d4d4;
  border: 1px solid #333;
  border-radius: 6px;
  line-height: 1.5;
  padding: 10px;
  margin-bottom: 2rem;
} */
.CodeMirror {
  height: auto;
  font-size: 16px;
  background: #1e1e1e;
  color: #d4d4d4;
  border: 1px solid #333;
  border-radius: 6px;
  line-height: 1.5;
  padding: 10px;
  margin-bottom: 2rem;
  overflow-x: hidden; /* Hide horizontal scroll */
  white-space: pre-wrap; /* Ensure wrapping */
}

.code-editor {
  height: 200px;
  overflow-x: hidden; /* Optional: just to be safe */
}

body .cm-s-dracula.CodeMirror {
  background: #000 !important;
  background-color: #000 !important;
  margin-bottom: 0px !important;
}

/* ..........monika yadav......... */
.we-can-box .after-start::before {
  margin-left: 5px;
  bottom: -28px;
}
/* ..............featuers-banner........ */
.featuers-banner {
  height: 550px;
  overflow: hidden;
}
.featuers-banner::before {
  /* content: '';
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  height: 67px;
  opacity: 0.3;
  background: #FF0006;
  filter: blur(100px);
  width: 60%; */
}
.image-background::before {
  content: "";
  position: absolute;
  margin: auto;
  left: 6%;
  right: 0;
  height: 60%;
  opacity: 0.3;
  background: #ff0006;
  filter: blur(142px);
  z-index: -1;
  top: 6%;
  width: 67%;
}
.featuers-banner .background-image {
  max-width: 976px;
  width: 100%;
  max-height: 614px;
  height: 100%;
  object-fit: cover;
  object-position: top;
  margin: auto;
}

.tab-content-main-box li {
  background-color: #fff;
  filter: drop-shadow(0px 13px 19px #bdbdbd);
}
.tab-content-main-box li:hover {
  position: relative;
  top: -10px;
  border: 1px solid #0052cc;
  transition: top all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.tab-content-main-box li.active {
  position: relative;
  top: -10px;
  border: 1px solid #0052cc;
  transition: all ease-in-out 0.5s;
  font-weight: 700;
}
.tab-main-image-box {
  filter: drop-shadow(0px 13px 19px #bdbdbd);
}

.scroll-left-to-right {
  animation: scrollLeftToRight 40s linear infinite;
  width: max-content;
}

@keyframes scrollLeftToRight {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(50%);
  }
}

.animate-scroll-right-to-left {
  width: max-content;
  animation: scrollRightToLeft 40s linear infinite;
}

@keyframes scrollRightToLeft {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.projeact-ston-section .after-end::before {
  margin-right: 20px !important;
}
.customisation-box::before {
  content: "";
  position: absolute;
  border-radius: 949px;
  opacity: 0.2;
  background: #ff0006;
  filter: blur(107px);
  display: block;
  width: 61%;
  height: 50%;
  z-index: -1;
  margin: auto;
  left: 21%;
  top: 28%;
}
.section-link:hover {
  border-color: #f00;
}
.section-link:hover p {
  color: #000;
}

.animate-direction-alternate-reverse {
  animation-direction: alternate-reverse;
}

.slider-box::before {
  content: "";
  position: absolute;
  width: 531px;
  height: 437px;
  transform: rotate(90deg);
  flex-shrink: 0;
  background: #fff;
  filter: blur(62px);
  left: -300px;
  right: 100%;
  top: 80px;
  z-index: 2;
}
.slider-box::after {
  content: "";
  position: absolute;
  width: 531px;
  height: 437px;
  transform: rotate(90deg);
  flex-shrink: 0;
  background: #fff;
  filter: blur(62px);
  right: 0;
  left: 82%;
  top: 57px;
  z-index: 1;
}
.top-shadow-box::before {
  content: "";
  position: absolute;
  background: #fff;
  filter: blur(36px);
  width: 100%;
  height: 200px;
  top: -82px;
  border: 0;
  left: 0;
  right: 0;
}

.platform-tab-btn.active {
  border-bottom-color: #ff0006;
  color: #000;
  font-weight: 615;
}
.platform-tab-content {
  transition: all 0.3s;
  height: 483px;
  min-height: 483px;
  border: 1px solid #fff;
  position: relative;
}
.platform-tab-content.active {
  transform: translateY(0px) scale(1) !important;
  transition: all 0.3s;
  opacity: 1;
}

.sectionActive {
  z-index: 11;
}

.platform-tab-content:nth-child(1) {
  transform: translateY(-65px) scale(0.85);
  transition: all 0.6s;
  transform-origin: center;
}

.platform-tab-content:nth-child(2) {
  transform: translateY(-40px) scale(0.87);
  transition: all 0.6s;
  transform-origin: center;
}
.platform-tab-content:nth-child(3) {
  transform: translateY(-17px) scale(0.89);
  transition: all 0.6s;
  transform-origin: center;
}
.platform-tab-content:nth-child(4) {
  transform: translateY(6px) scale(0.91);
  transition: all 0.6s;
  transform-origin: center;
}
.platform-tab-content:nth-child(5) {
  transform: translateY(30px) scale(0.93);
  transition: all 0.6s;
  transform-origin: center;
}
.platform-tab-content:nth-child(6) {
  transform: translateY(56px) scale(0.96);
  transition: all 0.6s;
  transform-origin: center;
}
.platform-tab-content:nth-child(7) {
  transform: translateY(85px) !important;
}

.platform-tab-content:nth-child(3).active {
  transform: translateY(20px) !important;
}
.platform-tab-content:nth-child(4).active {
  transform: translateY(40px) !important;
}
.platform-tab-content:nth-child(5).active {
  transform: translateY(60px) !important;
}
.platform-tab-content:nth-child(6).active {
  transform: translateY(80px) !important;
}

.platform-tab-content:nth-child(1).sectionActive ~ .platform-tab-content {
  opacity: 0;
}
.platform-tab-content:nth-child(2).sectionActive ~ .platform-tab-content {
  opacity: 0;
}
.platform-tab-content:nth-child(3).sectionActive ~ .platform-tab-content {
  opacity: 0;
}
.platform-tab-content:nth-child(4).sectionActive ~ .platform-tab-content {
  opacity: 0;
}
.platform-tab-content:nth-child(5).sectionActive ~ .platform-tab-content {
  opacity: 0;
}
.platform-tab-content:nth-child(6).sectionActive ~ .platform-tab-content {
  opacity: 0;
}

.platform-tab-content.active ~ .platform-tab-content {
  scale: 1;
  transform: translateY(0px);
}
.platform-tab-content > div {
  height: 100%;
}

.platform-tab-content:last-child.sectionActive {
  transform: translateY(54px) !important;
}

.tab-content:nth-child(3).sectionActive ~ .tab-content {
  transform: translateY(33px);
}

.platform-tab-content:nth-child(2).sectionActive {
  transform: translateY(-60px) !important;
  top: 150px;
}
.platform-tab-content:nth-child(3).sectionActive {
  transform: translateY(-50px) !important;
  top: 150px;
}
.platform-tab-content:nth-child(4).sectionActive {
  transform: translateY(-35px) !important;
  top: 150px;
}
.platform-tab-content:nth-child(5).sectionActive {
  transform: translateY(-20px) !important;
  top: 150px;
}

.platform-tab-content:nth-child(6).sectionActive {
  transform: translateY(0px) !important;
  top: 150px;
}

.toggle-faq.pb-4 {
  padding-bottom: 18px;
}
.features-bg-box {
  top: -37px !important;
  left: 182px !important;
}

.animation-box .spiner-1 {
  position: absolute !important;
  left: 69px;
}
.animation-box .spiner-2 {
  position: absolute !important;
  left: 268px;
}
.animation-box .spinner-wrap {
  position: relative;
  margin-top: -3px;
  z-index: 1;
}

.animation-box .spinner-item {
  /* background: red; */
  border: 30px solid #ff000610;
  border-radius: 50%;
  height: 20px;
  width: 20px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  animation: zoom 2s linear 0.75s infinite;
}

.animation-box .spinner-item--2 {
  animation-delay: 1.25s;
}

.animation-box .spinner-item--3 {
  animation-delay: 1.75s;
}

@keyframes zoom {
  0% {
    transform: translate(-50%, -50%) scale(0.2);
    opacity: 0;
  }
  50% {
    opacity: 0.9;
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
  }
}

.new-sticky-box {
  top: 87px !important;
}
.new-bg-color-box {
  padding-top: 100px !important;
  background-color: transparent !important;
}
.toltip-box {
  display: none;
}
.toltip-main-box:hover .toltip-box {
  display: block;
  transition: all 0.3s ease-in-out;
}

.toltip-box::before {
  content: "";
  position: absolute;
  width: 30px;
  height: 10px;
  background-image: url("../images/tooltip-arrow.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  top: 98%;
  left: 0%;
}

@media screen and (min-width: 767px) and (max-width: 1100px) {
  .image-border::before,
  .image-border2::before,
  .image-border3::before,
  .image-border4::before {
    top: 15% !important;
  }
  #mobile-menu {
    top: 82px !important;
  }
  .capture-line::before {
    background-size: 67px;
  }
  #maketingSwipes .sectionTitle .rounded-2xl {
    width: 100% !important;
  }
  .card-main-box {
    overflow: scroll;
  }
  .bimReady::before {
    bottom: -17px !important;
  }
  .tab-banner-question {
    padding-top: 100px !important;
  }
  .faq-tabs-box .faq-conetnt-box {
    padding-left: 0px !important;
  }

  .faq-conetnt-box {
    width: 100% !important;
  }
  .faq-main-box {
    flex-wrap: wrap;
  }
  .faq-main-box #tabList {
    display: flex;
    align-items: end;
    gap: 20px;
  }
  .faq-main-box ul li button {
    align-items: center !important;
    gap: 10px !important;
  }
  .faq-tab-content .f-main-box {
    justify-content: center;
  }
  .faq-tab-content .card {
    width: 47% !important;
  }
  .toltip-box-1 {
    bottom: 32px !important;
    left: 10% !important;
  }
  .toltip-box-2 {
    left: 10% !important;
  }
  .toltip-box-3 {
    left: 10% !important;
  }
  .toltip-box-4 {
    left: -10% !important;
  }
  
  .card-slider-box-tab {
    width: auto !important;
  }
  .industries-banner-before::before {
    display: none;
  }
  .industries-banner-before.milston-banner h2 {
    margin-block-start: 0;
  }
}

@media screen and (min-width: 767px) and (max-width: 1279px) {
    .industries-box-link .video-play div {
      padding: 20px;
    }
    .industries-box-link .video-play div img {
      width: 75%;
      margin-inline: auto;
    }
}

.industries-banner-before::before {
  height: 333px !important;
  top: -74px !important;
  filter: blur(40px) !important;
}

.leading-125 {
  line-height: 125% !important;
}
.space-y-12 > :not([hidden]) ~ :not([hidden]) {
}
.faq-tab-content .card {
  padding-bottom: 48px;
}
.faq-tabs-box .request-demo-line::before {
  bottom: -26px;
}
.logo-main-box {
  /* height: 342px; */
  height: 100%;
  overflow: hidden;
  transition: height 0.5s ease-in-out;
  will-change: transform;
}
.logo-main-box.expanded {
  /* height: auto; */
}

.arrow-icon {
  transition: height 0.5s ease-in-out;
}

.arrow-icon.rotated {
  transform: rotate(180deg);
}
.logo-main-box-2 {
  height: 372px;
  overflow: hidden;
  transition: height 0.5s ease-in-out;
}
.logo-main-box-2.expanded {
  height: auto;
}
.logo-main-box-3 {
  height: 372px;
  overflow: hidden;
  transition: height 0.5s ease-in-out;
  will-change: transform;
}
.logo-main-box-3.expanded {
  height: auto;
}
.show-more p {
  cursor: pointer;
}
.logo-main-box,
.logo-main-box-2,
.logo-main-box-3 {
  max-height: 372px;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
  will-change: transform;
}

.logo-main-box.expanded,
.logo-main-box-2.expanded,
.logo-main-box-3.expanded {
  max-height: 600px; /* adjust based on your content height */
  will-change: transform;
}

.arrow-icon {
  transition: transform 0.3s ease;
}

.arrow-icon.rotated {
  transform: rotate(180deg);
}

.client-baner .heading-custom::before {
  width: 88px;

  background-size: contain;
  bottom: -15px;
}

.faq-main-box .request-demo-line::before {
  left: 56%;
  bottom: -20px;
}
.safari-website-website .font-semibold {
  font-weight: 400 !important;
}
.safari-website-website h1.font-medium {
  font-weight: 600 !important;
}
.safari-website-website p.font-medium {
  font-weight: 400 !important;
}

.safari-website .font-suisse_semibold {
  font-family: "suisseIntl-regular";
  font-weight: 600 !important;
}
.safari-website .rotating-words {
  top: -44px;
}
.safari-website .visual-cards .font-suisse_semibold {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .heading-progress {
  font-weight: 900 !important;
}
.safari-website span.font-light {
  font-weight: 400;
}
.safari-website .safri-industry-heading {
  font-weight: 700 !important;
  letter-spacing: 0.2px;
}
.safari-website .right-side-projeact-buget .font-suisse_semibold {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .safari-website-ready-doucment-heading {
  font-weight: 500 !important;
}
.safari-website footer h4.font-suisse_semibold {
  font-weight: 599 !important;
}
.safari-website .pagination button.text-black {
  font-weight: 700 !important;
}
.safari-website .safari-website-demo-banner-heading.font-suisse_semibold {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .safri-list li {
  font-weight: 400;
}
.safari-website .safari-website-trusted-line {
  font-weight: 400;
}
.safari-website .safari-website-tab-contnet-box {
  max-width: 650px !important;
}
.safari-website .api-banner-heading {
  font-weight: 700 !important;
}
.safari-website .power-heading {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .toggle-faq.active {
  font-weight: 600 !important;
}
.safari-website .toggle-faq {
  font-weight: 400 !important;
}
.safari-website .feature-card-heading h3 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .realtime-code-heading {
  font-family: "suisseIntl-medium";

  font-weight: 500 !important;
}
.safari-website .demo-heading {
  font-family: "suisseIntl-medium";

  font-weight: 500 !important;
}
.safari-website .connect-card h3 {
  font-weight: 400 !important;
}
.safari-website .cases-sub-heading {
  letter-spacing: 0.5px;
  font-weight: 400;
}
.safari-website .user-case-box h4 {
  font-family: "suisseIntl-medium";
  font-weight: 100 !important;
}
.safari-website .user-case-box h3 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .why-progress-center h2 {
  font-family: "suisseIntl-medium";
  font-weight: 400 !important;
  letter-spacing: 0.1px;
}
.safari-website .why-progress-center h3 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .why-progress-center p span {
  font-weight: 600 !important;
}
.safari-website .security-heading h3 {
  font-weight: 600 !important;
}
.safari-website .security-sub-heading {
  font-weight: 600 !important;
}
.safari-website .devloper-buton-box a {
  font-weight: 300 !important;
}
.safari-website .ready-to-heading {
  font-weight: 600 !important;
}
.safari-website .permiter-content {
  font-weight: 200 !important;
}
.safari-website .compliance-heading {
  font-weight: 500 !important;
  font-family: "suisseIntl-medium";
}
.safari-website .standerd-heading {
  font-weight: 500 !important;
  font-family: "suisseIntl-medium";
  letter-spacing: 0.6px;
}
.safari-website .standers-right-part h3 {
  font-weight: 500 !important;
  font-family: "suisseIntl-medium";
}
.safari-website .conntect-main-heading {
  font-weight: 500 !important;
  font-family: "suisseIntl-medium";
  letter-spacing: 0.7px;
}
.safari-website .connteact-card h3 {
  font-weight: 600 !important;
}
.safari-website .faq-tab-box-main-box li button {
  font-weight: 500 !important;
  letter-spacing: 0.5px;
}
.safari-website .faq-tab-box-main-box h2 {
  font-family: "suisseIntl-medium";
  font-weight: 400 !important;
}
.safari-website .faq-tab-box-main-box button span {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .contact-heading {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .get-in-touch-content h2 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .get-in-touch-content p.font-semibold {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .contact-form-right h2 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .contact-form-right .grid span {
  font-weight: 200;
}
.safari-website .contact-form-right .flex span {
  font-weight: 600;
}
.safari-website .globel-box h3 {
  letter-spacing: 0.5px;
  font-weight: 600;
}
.safari-website .globel-box a {
  letter-spacing: 0.5px;
  font-weight: 300;
}
.safari-website .awardes-section-box p {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .card-section-box p {
  font-weight: 350;
}
.safari-website .card-section-box a p {
  font-weight: 600;
}
#btnTabs {
  padding-right: 0px;
}
.safari-website .main-heading {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .case-right-content-box h3 {
  font-family: "suisseIntl-medium";
  font-weight: 400 !important;
  letter-spacing: 0.5px;
}
.safari-website .case-right-content-box p.font-bold {
  font-weight: 500;
}
.safari-website .case-right-content-box ul li b {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .left-buget-box {
  letter-spacing: 0.5px;
}
.safari-website .ready-to-box-heading p {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .location-buget p.font-bold {
  font-weight: 600;
}
.safari-website .faq-safari-box .faqTabs {
  padding-right: 80px !important;
}
.safari-website .hiring-content-box h3 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website .hiring-content-box p span {
  letter-spacing: 0.1px;
}
.safari-website .blog-card-box .inner_cards h4 {
  letter-spacing: 0.3px;
}
.safari-website .blog-nav-box button {
  font-weight: 400;
}
.safari-website .blog-breadcrumbs span {
  font-weight: 400;
}
.safari-website .date-line {
  font-weight: 300;
}
.safari-website .blog-content-area label {
  font-weight: 600;
  letter-spacing: 0.5px;
}
.safari-website .more-blogs button {
  font-weight: 400;
  letter-spacing: 0.5px;
}
.safari-website #globally-projects h3 {
  font-family: "suisseIntl-medium";
  font-weight: 500 !important;
}
.safari-website #manage-assets h3 {
  font-weight: 600 !important;
}
.safari-website #on-demand h4 {
  font-weight: 500 !important;
}
.safari-website #on-demand h3 {
  font-weight: 500 !important;
}
.safari-website #plugins h4 {
  font-weight: 500 !important;
}
.safari-website .customisation-box h4 {
  font-weight: 500 !important;
}
.safari-website .header-scroll nav:before {
  background: rgba(228, 226, 226, 0.95);
}
.safari-website #analytics h4 {
  font-weight: 500 !important;
}
.safari-website #analytics .card-box span {
  font-weight: 400 !important;
}
.safari-website .logo-for-safari {
  overflow: hidden;
}
.safari-website #header button {
  font-weight: 500 !important;
}
/* .safari-website #header a{
    font-weight: 500 !important;
} */

.top-shadow-box h2 {
  z-index: 99099;
  position: relative;
}
.safari-website .home-banner video {
  border-radius: 16px;
}
.safari-website .new-sticky-box button {
  color: #b4adad !important;
}
.safari-website .new-sticky-box button.active {
  color: #000 !important;
}
.safari-website .we-can-box video {
  border-radius: 16px;
}
.safari-website .viseual-box-safari video {
  border-radius: 0px;
}
.safari-website video {
  border-radius: 16px;
}
.safari-website .safari-website-p {
  padding-right: 30px;
}
/* @media screen and (max-width: 1024px) {
  .safari-website #header a {
    font-weight: 500 !important;
  }
} */
.scroll-logos .first-logo-box {
  /* margin-left: 45%; */
  transition: margin-left all 0.1s ease-in-out;
}
.card-section-box a {
  border-radius: 16px;
}
.location-buget a {
  border-radius: 16px;
}
.blog-nav-box #grid .cards img {
  border-radius: 16px;
}
.more-blogs #grid .cards {
  border-radius: 16px;
}
.faq-safari-box .faqTabs {
  padding-right: 80px !important;
}
.milston-banner::before {
  content: "";
  position: absolute;
  background: #fff;
  filter: blur(32px);
  width: 100%;
  height: 280px;
  top: -60px;
  border: 0;
  left: 0;
  right: 0;
}
.milston-banner h2 {
  z-index: 99099;
  position: relative;
  margin-block-start: -124px;
}

.milston-banner p {
  z-index: 99099;
  position: relative;
}
.milston-banner .after-end::before {
  width: 88px;
  background-size: 64px;
  bottom: -15px;
}

@media screen and (max-width: 767px) {
  .container .milston-banner h2 {
    margin-block-start: 0px;
  }
  .faq-safari-box {
    padding-bottom: 0px !important;
  }
  .client-baner .heading-custom::before {
    width: 50px;
  }
  .logo-main-box.expanded,
  .logo-main-box-2.expanded,
  .logo-main-box-3.expanded {
    max-height: 1000px;
  }
  .awrds-lines::before {
    bottom: -17px;
  }
}

/* @keyframes image_reveal {
  0% {
    width: 0;
  }
  100% {
    width: 70%;
  }
}

.image-border::before,
.image-border2::before,
.image-border3::before,
.image-border4::before {
  content: '';
  position: absolute;
  left: 68%;
  top: 19%;
  width: 0;
  height: 9px;
  background-image: url('../images/connector-line.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left center;
  animation-fill-mode: forwards;
}

.image-border::before {
  animation: image_reveal 2s linear 0s forwards;
}

.image-border2::before {
  animation: image_reveal 2s linear 3s forwards;
}

.image-border3::before {
  animation: image_reveal 2s linear 8s forwards;
}

.image-border4::before {
  animation: image_reveal 2s linear 12s forwards;
} */

/* Border animation */
.image-border::before,
.image-border2::before,
.image-border3::before,
.image-border4::before {
  content: "";
  position: absolute;
  top: 20%;
  left: 69%;
  width: 0;
  height: 2px;
  border-bottom: 2px dashed red;
  /* animation: drawLine 1s linear forwards; */
}

.tlc-active .image-border::before,
.tlc-active .image-border2::before,
.tlc-active .image-border3::before,
.tlc-active .image-border4::before {
  animation: drawLine 1s linear forwards;
}

.tlc-active .image-border::before {
  animation-delay: 0s;
}
.tlc-active .image-border2::before {
  animation-delay: 1s;
}
.tlc-active .image-border3::before {
  animation-delay: 2s;
}
.tlc-active .image-border4::before {
  animation-delay: 3s;
}

@keyframes drawLine {
  0% {
    width: 0;
  }
  100% {
    width: 70%;
  }
}

/* Start triangle - appears only at start of animation */
.start-triangle {
  position: absolute;
  top: 17.5%;
  left: 67%;
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 8px solid red;
  opacity: 0;
  animation: showStart 0.2s forwards;
}

.image-border .start-triangle {
  animation-delay: 0s;
}
.image-border2 .start-triangle {
  animation-delay: 1s;
}
.image-border3 .start-triangle {
  animation-delay: 2s;
}
.image-border4 .start-triangle {
  animation-delay: 3s;
}

@keyframes showStart {
  to {
    opacity: 1;
  }
}

/* End triangle - appears at end of animation */
.end-triangle {
  position: absolute;
  top: 17.5%;
  left: calc(68% + 70%);
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 8px solid red;
  opacity: 0;
  animation: showEnd 0.2s forwards;
}

.tlc-active .image-border .end-triangle {
  animation-delay: 1s;
}
.tlc-active .image-border2 .end-triangle {
  animation-delay: 2s;
}
.tlc-active .image-border3 .end-triangle {
  animation-delay: 3s;
}
.tlc-active .image-border4 .end-triangle {
  animation-delay: 4s;
}

@keyframes showEnd {
  to {
    opacity: 1;
  }
}

@media (max-width: 768px) {
  .block {
    width: 100%;
  }}

@media (max-width: 998px) {
  .block {
    width: 100%;
  }
  .top-shadow-box h2{
    z-index: 1;
  }
}

div#maketingSwipes {
  position: relative;
  /* margin-top: 100px; */
  margin-bottom: 100px;
}
#maketingSwipes:before {
  content: "";
  width: inherit;
  height: 2px;
  border-top: 2px dotted #ed1c24;
  position: absolute;
  left: -130px;
  top: 7px;
}
.industries-tab-nav .tab-link.active span {
  color: #ff0006;
  font-weight: 600;
}
.industries-tab-nav .tab-link.active img {
  filter: invert(11%) sepia(99%) saturate(7489%) hue-rotate(0deg)
    brightness(101%) contrast(128%);
}

.industries-tab-nav {
  position: sticky;
  top: 100px;
}
.industries-tab-nav .tab-link .active-iocn {
  display: none;
}
.industries-tab-nav .tab-link.active .active-iocn {
  display: block;
  filter: none;
}
.industries-tab-nav .tab-link .without-active-icon {
  display: block;
}
.industries-tab-nav .tab-link.active .without-active-icon {
  display: none;
}
/* ....use for scroll slider........ */
#strip-w {
  overflow: hidden;
  width: 100%;
}

.strip-track {
  display: flex;
  width: max-content;
  animation: scroll-strip 20s linear infinite;
}

.strip-item {
  /* flex: 0 0 auto; */
  height: 360px;
  width: 400px;
  min-width: 400px;
  margin-right: 0;
  background-size: cover;
  padding-inline: 10px;
}

@keyframes scroll-strip {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
#wrapper {
  width: 100%;
  height: 390px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}
#top-oval {
  position: absolute;
  top: -26px;
  height: 70px;
  width: 103%;
  background: white;
  border-bottom-left-radius: 200%;
  border-bottom-right-radius: 200%;
  left: -20px;
  z-index: 2;
}
#bottom-oval {
  position: absolute;
  bottom: 30px;
  height: 70px;
  width: 103%;
  left: -20px;
  border-top-left-radius: 200%;
  border-top-right-radius: 200%;
  background: white;
  z-index: 2;
}

#strip-w {
  width: 100%;
  min-width: 100%;
  height: 400px;
  display: flex;
  flex-wrap: no-wrap;
  align-items: flex-start;
  overflow-x: auto;
  gap: 20px;
}
#strip-item img {
  height: 360px;
  width: 400px;
  min-width: 400px;
  margin-right: 0;
  background: green;
  background-size: cover;
}
.card-main-box::-webkit-scrollbar {
  display: none;
}

.across-heading::before {
      margin-left: 19px;
    background-size: 80px;
    bottom: -17px;
    
}

/* .card-main-box {
    width: 100vh;
    height: calc(100vw);
    overflow: scroll;
    transform: rotate(-90deg);
    transform-origin: center calc(50vh);
} */
.child-card {
  /* display: flex;
    flex-direction: column;
    height: auto;
        transform: rotate(90deg); */

  width: 30% !important;
  min-width: 292px;
}
#mainmaketingSwipes {
  /* transform: translate3d(0, 0, 0); */
  will-change: transform;
}
/* #mainmaketingSwipesInners {
    overflow: hidden;
  } */

@media screen and (min-width: 1800px) {
  #maketingSwipes:before {
    left: -10vw;
  }
}

@media screen and (min-width: 2200px) {
  #maketingSwipes:before {
    left: -30vw;
  }
  .milston-banner::before {
    filter: blur(32px);
    top: -75px;
  }
}

@media screen and (min-width: 2000px) {
  #maketingSwipes:before {
    left: -20vw;
  }
}

@media screen and (min-width: 1800px) {
  .child-card {
    min-width: 390px;
    padding-bottom: 13rem !important;
  }
}

@media screen and (max-width: 1023px) {
  div#maketingSwipes {
    margin-top: 0px;
    flex-direction: column;
    padding-left: 20px;
  }
  #maketingSwipes:before {
    width: 2px;
    height: 100%;
    border-left: 2px dotted #ed1c24;
    border-top: 0px;
    left: 0px;
    top: 0px;
  }
}

@media screen and (max-width: 767px) {
  #bottom-oval{
    width: 100% !important;
  }
  .TimeLapseCapture div::before {
    display: none;
  }
  .card-section-box {
    z-index: -1;
  }
  .industries-tab-nav {
    background-color: #fff;
    width: 100%;
    z-index: 2;
    padding-block: 10px;
    top: 70px !important;
  }
  #wrapper {
    height: 270px;
    margin-top: 26px;
  }
  #strip-w {
    width: 100%;
    min-width: 100%;
    height: 400px;
    padding-inline: 10px;
    overflow-x: scroll;
  }
  #strip-item img {
    height: 260px;
    width: 400px;
    min-width: 400px;
  }
  #top-oval {
    top: -26px;
    /* display: none; */
    left: -12px;
  }
  #bottom-oval {
    bottom: -34px;
    left: 0px;
  }
  .industries-tab-nav {
    display: none;
    align-items: center;
    white-space: nowrap;
    overflow-x: scroll;
    gap: 50px;
  }
  .child-card {
    min-width: 96%;
    margin-inline: 7px;
  }
}
div#mainmaketingSwipes {
  position: relative;
  top: 20px;
}

/* .platform-fratures-mainbox::before{
      bottom: -16px;
          background-size: 60px;
} */
.fancybox__container {
  z-index: 999999;
}
.contact-us-line::before {
  background-size: 80px;
  left: 56px;
  width: 100px;
}
.awrds-lines::before {
  bottom: -20px;
}
@media screen and (max-width: 426px) {
  .overview-bg-box.features-bg-box {
    left: 41px !important;
    width: 72%;
  }
}
@media screen and (max-width: 350px) {
  .mobile-dron {
    width: 100px !important;
    height: 100px !important;
  }
}
.aero-heading::before {
  margin-right: auto;
  margin-left: 32px;
  background-size: 80px;
}

.live-heading::before {
  margin-left: 75px;
}
.support-before::before{
      background-size: 75px;
          margin-inline-start: 70px;
}