.sponsors {
  margin: 2rem auto 3rem;
  max-width: 1100px;
  padding: 0 1rem;
}

.sponsors h2,
.sponsors p {
  text-align: center;
}

.sponsors h2 {
  margin-bottom: 0.5rem;
}

.sponsors p {
  margin: 0 0 1.75rem;
}

.sponsors-title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 0 2.25rem;
}

.sponsors-title a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem 1rem !important;
}

.sponsors-title img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: min(100%, 520px) !important;
  max-height: 520px !important;
  margin: 0 auto !important;
}

ul.sponsors-grid {
  list-style: none !important;
  list-style-type: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 2rem 2.5rem !important;
  max-width: 1000px;
}

ul.sponsors-grid > li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex: 0 1 280px !important;
  min-height: 120px !important;
}

ul.sponsors-grid > li img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 310px !important;
  margin: 0 auto !important;
}

/* Wider logos need more room */
ul.sponsors-grid > li:nth-child(3),
ul.sponsors-grid > li:nth-child(5) {
  flex-basis: 340px !important;
}

ul.sponsors-grid > li:nth-child(3) img,
ul.sponsors-grid > li:nth-child(5) img {
  max-height: 125px !important;
}

@media (max-width: 900px) {
  .sponsors-title img {
    max-height: 280px !important;
  }

  ul.sponsors-grid {
    gap: 1.5rem 2rem !important;
  }

  ul.sponsors-grid > li {
    flex: 0 1 240px !important;
  }

  ul.sponsors-grid > li img {
    max-height: 196px !important;
  }
}

@media (max-width: 640px) {
  .sponsors {
    padding: 0 0.75rem;
  }

  .sponsors-title img {
    max-height: 240px !important;
  }

  ul.sponsors-grid {
    gap: 1.25rem !important;
  }

  ul.sponsors-grid > li {
    flex: 1 1 100% !important;
    min-height: 100px !important;
  }

  ul.sponsors-grid > li img,
  ul.sponsors-grid > li:nth-child(3) img,
  ul.sponsors-grid > li:nth-child(5) img {
    max-height: 188px !important;
  }
}