custom.css

:root {
  --ifm-color-primary: #138cd3;
  --ifm-color-primary-dark: #117ebe;
  --ifm-color-primary-darker: #1077b3;
  --ifm-color-primary-darkest: #0c5a87;
  --ifm-color-primary-light: #159ae8;
  --ifm-color-primary-lighter: #1e9feb;
  --ifm-color-primary-lightest: #3dacee;
}

.navbar__inner {
  max-width: 1400px;
  margin: 0 auto;
}

.navbar__title {
  white-space: normal;
  word-break: break-word;
}

.footer__logo {
  max-width: 4rem;
  max-height: 4rem;
}

main details {
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding: 1rem 1rem 0;
  border: 0.15rem solid var(--ifm-color-emphasis-300);
  border-radius: var(--ifm-pagination-nav-border-radius);
}

main details summary {
  margin-bottom: 1rem;
  outline: none;
  /* Make it look like a link to notify user that it's clickable */
  text-decoration: underline;

  /* Refer to #309 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

main details summary:hover {
  cursor: pointer;
  /* Hide the underline on hover */
  text-decoration: none;
}
main details:hover {
  border-color: var(--ifm-pagination-nav-color-hover);
}

.homePageBtns {
  display: grid;
  gap: 20px;
}
@media (min-width: 480px) {
  .homePageBtns {
    grid-template-columns: 1fr 1fr;
  }
}