.sansation-light {
  font-family: "Sansation", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.sansation-regular {
  font-family: "Sansation", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.sansation-bold {
  font-family: "Sansation", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.sansation-light-italic {
  font-family: "Sansation", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.sansation-regular-italic {
  font-family: "Sansation", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.sansation-bold-italic {
  font-family: "Sansation", sans-serif;
  font-weight: 700;
  font-style: italic;
}

body {
  font-family: "Sansation", sans-serif;
  padding-top: 100px;
  overflow-x: hidden;
}

.ff-sans {
  font-family: "Sansation", sans-serif;
}

p {
  font-family: "Saira", sans-serif;
}

.ff-saira {
  font-family: "Saira", sans-serif;
}

a {
  text-decoration: none;
  color: inherit;
}

a:hover {
  color: #d21034;
}

.btn-contact a:hover {
  background-color: white;
  border: 1px solid red;
}

ul {
  list-style-image: url("./images/shield-icon.svg");
}

.fixed-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  height: 80px;
  background-color: white;
}

.bg-gradient-form {
  background: linear-gradient(
    287.47deg,
    #02263f 2.39%,
    #6c081b 49.52%,
    #162038 90.51%
  );
}

.container-pages {
  width: 1080px;
}
.form-control:focus {
  box-shadow: none !important;
  outline: none !important;
  border: none;
}

.bg-sphere-1 {
  background-image: url("./images/1.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.bg-sphere-2 {
  background-image: url("./images/2.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-sphere-3 {
  background-image: url("./images/3.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-sphere-4 {
  background-image: url("./images/4.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.privacy-ul {
  list-style-type: disc;
  padding-left: 1.5em;
  list-style-image: none;
}
.fixed-header a.active {
  color: #d21034;
  font-weight: 600;
}
.w-200 {
  width: 200px;
}

.h-130 {
  height: 130px;
}

.w-455 {
  width: 455px;
}

.h-550 {
  height: 550px;
}

.primary-red {
  color: #d21034;
}

.primary-blue {
  color: #02263f;
}

.primary-red-bg {
  background-color: #d21034;
}

.primary-blue-bg {
  background-color: #02263f;
}

.gray-col {
  color: #7d7d7d;
}

.bg-contact-form {
  background-color: #f0f0f0;
}
.gray-bg {
  background-color: #f0f0f0;
}

.light-gray-col {
  color: #dde6ec;
}

.footer-bg {
  background: #202325;
}
.rounded-25 {
  border-radius: 25px;
}

.cursor-pointer {
  cursor: pointer;
}

.text-feature {
  width: 50%;
  margin-left: auto;
  text-align: right;
}

.text-feature-right {
  width: 50%;
  margin-right: auto;
  text-align: left;
}

.w-367 {
  width: 367px;
}

.h-206 {
  height: 206px;
}

.pattern-bg-2 {
  background-image: url("./images/patern2.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.pattern-bg-1 {
  background-image: url("./images/patern1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.btn-primary-red {
  background-color: #d21034;
  color: white;
  border: 0;
  border-radius: 50rem;
  /* padding: 0.5rem; */
}

.video-wh {
  width: 763px;
  height: 429px;
}

#mobileMenu.collapse {
  transition: none;
}

#mobileMenu {
  position: fixed;
  top: 70px;
  left: 0;
  width: 100%;
  height: calc(100vh - 70px);
  background: white;
  z-index: 1040;
  overflow-y: auto;

  transform: translateY(-100%);
  opacity: 0;
  transition:
    transform 0.35s ease,
    opacity 0.25s ease;
}

#mobileMenu.show {
  transform: translateY(0);
  opacity: 1;
}

.w-md-75 {
  width: 75%;
}

#introduction,
#howItWorks,
#aboutApp,
#forOrganisations {
  scroll-margin-top: 80px;
}

.position-relative {
  position: relative;
}

.text-absolute {
  position: absolute;
  bottom: 0;
  width: 367px;
  background: #02263fcc;
}

.fs-18 {
  font-size: 18px;
}

.fs-16 {
  font-size: 16px;
}

.fs-24 {
  font-size: 24px;
}

.fs-48 {
  font-size: 48px;
}

.fs-32 {
  font-size: 32px;
}

/* .timeline-col::after {
  content: "";
  position: absolute;

  top: 12.5px;
  left: calc(8.333%);
  transform: translateX(-50%);
  width: 2px;
  height: calc(100% - 12.5px);

  background-color: #d21034;
} */

.timeline-item .col-2 {
  position: relative;
}

.timeline-item .col-2::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 100%;
  background: #d21034;
}

.timeline-dot {
  position: relative;
  z-index: 2;
}

.timeline-item:last-child .timeline-dot {
  background-color: #7d7d7d;
}

.timeline-item:last-child > .col-2::after {
  background-color: #e2e3e3;
}

.timeline-item:nth-last-child(2) .col-2::after {
  background: linear-gradient(to bottom, #d21034 50%, #e2e3e3 50%);
}
.form-width {
  width: 1075px;
}

.padding-form {
  padding: 50px 200px 50px 200px;
}

.blend-mode-multiply {
  mix-blend-mode: multiply;
}

.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item.active {
  background-color: transparent !important;
  color: #d21034 !important;
}

.dropdown-item:hover {
  background-color: transparent !important;
}

a.download-app {
  color: white;
}
@media screen and (max-width: 768px) {
  .w-md-75 {
    width: 100%;
  }

  .video-wh {
    width: 100%;
    height: auto;
  }
  .w-367 {
    width: 100%;
  }

  .text-absolute {
    width: 100%;
  }

  .form-width {
    width: 100%;
  }

  .padding-form {
    padding: 50px 20px 50px 20px;
  }
}

@media screen and (max-width: 1024px) {
  .h-206 {
    height: 100%;
  }

  .w-367 {
    width: 100%;
  }
  .text-absolute {
    width: 100%;
  }
}