.absolute {
  position: absolute
}

.relative {
  position: relative
}

.right-20 {
  right: 5rem
}

.top-3 {
  top: 0.75rem
}

.z-10 {
  z-index: 10
}

.flex {
  display: flex
}

.h-14 {
  height: 3.5rem
}

.h-16 {
  height: 4rem
}

.h-24 {
  height: 6rem
}

.h-32 {
  height: 8rem
}

.h-40 {
  height: 10rem
}

.w-14 {
  width: 3.5rem
}

.w-24 {
  width: 6rem
}

.w-32 {
  width: 8rem
}

.w-40 {
  width: 10rem
}

.w-64 {
  width: 16rem
}

.cursor-pointer {
  cursor: pointer
}

.items-center {
  align-items: center
}

.justify-center {
  justify-content: center
}

.overflow-hidden {
  overflow: hidden
}

.rounded-full {
  border-radius: 9999px
}

.rounded-md {
  border-radius: 0.375rem
}

.bg-sky-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(2 132 199 / var(--tw-bg-opacity))
}

.bg-sky-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(3 105 161 / var(--tw-bg-opacity))
}

.bg-sky-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(7 89 133 / var(--tw-bg-opacity))
}

.bg-sky-900 {
  --tw-bg-opacity: 1;
  background-color: rgb(12 74 110 / var(--tw-bg-opacity))
}

.p-2 {
  padding: 0.5rem
}

.font-extrabold {
  font-weight: 800
}

.text-sky-50 {
  --tw-text-opacity: 1;
  color: rgb(240 249 255 / var(--tw-text-opacity))
}

.duration-500 {
  transition-duration: 500ms
}

.group:hover .group-hover\:-right-12 {
  right: -3rem
}

.group:hover .group-hover\:top-12 {
  top: 3rem
}

.group:hover .group-hover\:scale-150 {
  --tw-scale-x: 1.5;
  --tw-scale-y: 1.5;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.group:hover .group-hover\:opacity-50 {
  opacity: 0.5
}