@import url("./custom-fonts.css");

/* scrollbar css start */

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {
  background-color: #17557a;
}

html {
  scroll-behavior: auto;
}

/* scrollbar css end */

p {
  line-height: inherit !important;
}

.height_auto img {
  height: auto !important;
}

.full_width img {
  max-width: none !important;
  width: 100% !important;
}

.form-error-message {
  color: #d9534f;
  font-size: 14px;
}

/* country dropdown css starts */

.iti__country-name {
  font-size: 18px;
  color: #000000;
}

.iti__dial-code {
  font-size: 18px;
}

.iti__country-list::-webkit-scrollbar {
  width: 6px;
}

.iti__country-list::-webkit-scrollbar-track {
  background-color: #f5f5f5;
}

.iti__country-list::-webkit-scrollbar-thumb {
  background-color: #17557a;
}

.iti--separate-dial-code {
  width: 100%;
}

.tab-ctn {
  cursor: pointer;
}

/* country dropdown css ends */
.exp-btns {
  /* Define which properties should transition smoothly */
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease,
    box-shadow 0.3s ease;
  /* Add any other default styling here */
}
.exp-btns {
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.exp-btns.active {
}

.flex_1 {
  flex: 1 !important;
}

/* LEFT */
.slide-animation-left-in {
  opacity: 0 !important;
  transform: translate3d(-150px, 0, 0) !important;
  transition:
    opacity 2s ease-out,
    transform 2s ease-out !important;
  will-change: transform, opacity;
}

/* RIGHT */
.slide-animation-right-in {
  opacity: 0 !important;
  transform: translate3d(150px, 0, 0) !important;
  transition:
    opacity 2s ease-out,
    transform 2s ease-out !important;
  will-change: transform, opacity;
}

/* ACTIVE */
.slide-animation-left-in.is-visible,
.slide-animation-right-in.is-visible {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

.solutions-hero-section.about-us-hero::before {
  background-position: calc(100% - 100px) center !important;
}

.si-heading h1,
.si-heading p {
  font-family: "Stevie Sans", Arial, sans-serif !important;
  font-weight: 700 !important;
  font-style: normal !important;
}

@media only screen and (min-width: 1280px) {
  #spend-visibility-hero::before {
    background-position: calc(100% - 150px) top;
  }

  .blog-border-rt {
    border-top: 1px solid #e9eaec !important;
    /* border-right: 1px solid #E9EAEC; */
    border-bottom: 1px solid #e9eaec !important;
    border-left: 1px solid #e9eaec !important;
    border-top-left-radius: 12px !important;
    /* border-top-right-radius: 12px; */
    /* border-bottom-right-radius: 12px; */
    border-bottom-left-radius: 12px !important;
  }

  .blog-border-lt {
    border-top: 1px solid #e9eaec !important;
    border-right: 1px solid #e9eaec !important;
    border-bottom: 1px solid #e9eaec !important;
    /* border-left: 1px solid #E9EAEC; */
    /* border-top-left-radius: 12px; */
    border-top-right-radius: 12px !important;
    border-bottom-right-radius: 12px !important;
    /* border-bottom-left-radius: 12px; */
  }
}

@media only screen and (min-width: 768px) {
  .section-left-intrude {
    width: calc(100% + 60px + max(0px, (100vw - 1600px) / 2));
    margin-right: -60px;
    margin-left: calc(-1 * max(0px, (100vw - 1600px) / 2));
  }

  .section-right-intrude {
    width: calc(100% + 60px + max(0px, (100vw - 1600px) / 2));
    margin-left: -60px;
    margin-right: calc(-1 * max(0px, (100vw - 1600px) / 2));
  }
}

@media only screen and (max-width: 568px) {
  .section-left-intrude {
    margin-bottom: -40px;
  }

  .section-right-intrude {
    margin-top: -40px;
  }
}