:root {
  --navbar-height: 56px;
}

.svg-container {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.svg-responsive {
    width: 75%;
    height: auto;
}

.top-5 {
  top: 5%;
}

@media (min-width: 768px) {
    .custom-max-width {
      max-width: 60%;
    }

    #home, #consumer-interaction {
      padding-top: var(--navbar-height);
      height: calc(100vh - var(--navbar-height));
      display: flex;
      align-items: center;
  }
}

@media (max-width: 768px) {
  .vh-50-sm {
    min-height: 50vh;
  }
}

.vh-90-sm {
  min-height: 90vh;
}

.w-200 {
  width: 200px;
}

.w-150 {
  width: 150px;
}

.dot-point::before {
  content: "• ";
  color: inherit;
  margin-right: 5px;
}

.isotope-nav.active {
  color: rgb(236, 41, 123);
  border: 1px solid rgb(236, 41, 123);
  border-radius: 1.2rem;
}

.required::after {
  content: " *" !important;
  color: red !important;
  margin-left: 4px !important;
  font-weight: bold !important;
}