/* Create Custom "Colour Matrix" to use within the bootstrap utility classes
----------------------------------------------------------------------------- */
/* 
    Expanded spacing options 
    For example the margin and padding classes now have extended capability (.mb-8 now outputs margin-bottom: 3rem)
*/
/*
    This variable affects the `.h-*` and `.w-*` classes.
    You can now do w-25 or h-80 and have it output width: 25% or height: 80%
*/
/*
    Components variables
    When you create the component you should create the variables with colors for this compontnt
*/
/*
  Custom Components Variables
*/
/*
    We have no variables for alt buttons
    Because the styles depends on the design and can be unique for each project
*/
.primary-hero {
  background-color: #F7F8FD;
}
.primary-hero-item {
  padding-top: 130px;
  padding-bottom: 130px;
}
.primary-hero-item-image-wrap {
  text-align: center;
}
.primary-hero-item-image img {
  width: 100%;
  height: auto;
  max-width: 400px;
}
.primary-hero-item-form-wrap {
  background: #F9F9F9;
  box-shadow: 0 16px 24px 0 rgba(14, 43, 92, 0.16);
  border-radius: 16px;
}
.primary-hero-item-content-center {
  text-align: center;
}
.primary-hero-item-content-center [class^=col-] {
  margin: auto;
}
.primary-hero-item-content-center .primary-hero-item-links {
  justify-content: center;
}
.primary-hero .swiper-pagination {
  bottom: 40px;
}
@media (max-width: 1199.98px) {
  .primary-hero-item {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .primary-hero-item.swiper-slide {
    padding-bottom: 75px;
  }
  .primary-hero .swiper-pagination {
    bottom: 32px;
  }
}

/*# sourceMappingURL=primary-hero.css.map */