code {
  @apply text-sm;
}
.btn {
  @apply font-bold py-2 px-4 rounded;
}
.btn-blue {
  @apply bg-blue-500 text-white;
}
.btn-blue:hover {
  @apply bg-blue-700;
}
.btn {
  @apply font-bold py-2 px-4 rounded;
}
.btn-purple {
  @apply bg-purple-500 text-white;
}
.btn-purple:hover {
  @apply bg-purple-700;
}
.btn-green {
  @apply bg-green-500 text-white;
}
.btn-green:hover {
  @apply bg-green-700;
}
.dark .invert-on-dark {
  filter: invert(1) brightness(1.8);
}
main ul > li > ul {
  /* hacky: ensure nested lists in page content don't have extra margin-top. This should probably be
     fixed in Nextra in the long run */
  margin-top: 0 !important;
}
.hero-image-bg {
  background: linear-gradient(90deg, #0c8d65 0%, #0c3091 100%);
}
.hero-image-bg:hover {
  background: linear-gradient(90deg, #18ecaa 0%, #1249de 100%);
}

.fix-flex-col {
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 640px) {
  .fix-flex-col {
    flex-direction: row;
  }
}
@media (min-width: 768px) {
  .fix-flex-col {
    flex-direction: column;
    justify-content: flex-start;
  }
}
@media (min-width: 1024px) {
  .fix-flex-col {
    flex-direction: row;
  }
}
.fix-width-auto {
  width: 100%;
}
@media (min-width: 640px) {
  .fix-width-auto {
    width: auto;
  }
}
@media (min-width: 768px) {
  .fix-width-auto {
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .fix-width-auto {
    width: auto;
  }
}