@import "bootstrap-overrides";
@import "bootstrap";
@import "clear-margin-padding";
@import "colors";
@import "fonts";
@import "borders";

.hero-image {
  background-image: url(image-path("hero.png"));
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding-top: 50px;
  padding-bottom: 50px;
}

.hero-text {
  color: $white;
  text-align: center;
}

.hero-description {
  max-width: 588px;
  margin: auto;
  font-size: 20px;
}

img.framework-wheel {
  width: 442px;
  max-width: 100%;
}

.welcome-controls {
  @extend .py-5;
}

.btn-secondary {
  @include button-variant($black, transparent, $white,
    $gray-1, transparent, $white,
    $black, $black, $white,
    $gray-2, transparent, $white);
}

#landing-accordion {
  max-width: 550px;
}

footer {
  color: $white;
  .btn {
    @extend .font-bitter;
    @extend .font-size-14;
    @extend .weight-700;
  }
}
.footer-content {
  margin: auto;
  max-width: 792px;
}