@import "tailwindcss";

h1 {
  @apply text-6xl pb-4;
}

h2 {
  @apply text-5xl pb-4;
}

h3 {
  @apply text-4xl pb-4;
}

h5 {
  @apply text-3xl pb-4;
}

card {
  @apply flex flex-col bg-gray-800 max-w-md rounded-xl shadow-lg outline;
}

card > top {
  @apply text-3xl font-bold text-center text-gray-50;
}

card > bottom {
  @apply flex text-gray-50 p-3 justify-stretch *:flex-1 gap-2;
}

card > middle {
  @apply flex flex-col text-xl bg-gray-800 p-6 gap-4;
}

label {
  @apply font-bold text-white;
}

input {
  @apply shadow-sm outline rounded-sm p-1 bg-gray-200;
}

button {
  @apply rounded-sm shadow-sm bg-gray-100 text-gray-950 p-3;
}