html {
  overflow-y: auto !important;
}

.w-full {
  width: 100%;
}

.h-full {
  height: 100%;
}

.h-100vh {
  height: 100vh;
}

.w-half {
  width: 50%;
}

.pointer {
  cursor: pointer;
}

.flex-center {
  display: flex;
  justify-content: center !important;
  align-items: center !important;
}

.fit-content {
  width: fit-content;
}

.grid-12x9 {
  aspect-ratio: 4 / 3;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: repeat(9, minmax(0, 1fr));
}

.fade-enter-active, .fade-leave-active {
  transition: all 0.5s ease;
}

.fade-enter-from, .fade-leave-to {
  opacity: 0 !important;
}