.relative {
  position: relative
}

.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem
}

.flex {
  display: flex
}

.h-\[50px\] {
  height: 50px
}

.w-\[150px\] {
  width: 150px
}

.cursor-pointer {
  cursor: pointer
}

.items-center {
  align-items: center
}

.justify-center {
  justify-content: center
}

.overflow-hidden {
  overflow: hidden
}

.rounded-xl {
  border-radius: 0.75rem
}

.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity))
}

.text-\[\#fff\] {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity))
}

.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms
}

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

.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.before\:absolute::before {
  content: var(--tw-content);
  position: absolute
}

.before\:-left-full::before {
  content: var(--tw-content);
  left: -100%
}

.before\:top-0::before {
  content: var(--tw-content);
  top: 0px
}

.before\:z-\[-1\]::before {
  content: var(--tw-content);
  z-index: -1
}

.before\:h-full::before {
  content: var(--tw-content);
  height: 100%
}

.before\:w-full::before {
  content: var(--tw-content);
  width: 100%
}

.before\:rounded-xl::before {
  content: var(--tw-content);
  border-radius: 0.75rem
}

.before\:bg-gradient-to-r::before {
  content: var(--tw-content);
  background-image: linear-gradient(to right, var(--tw-gradient-stops))
}

.before\:from-\[\#009b49\]::before {
  content: var(--tw-content);
  --tw-gradient-from: #009b49 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 155 73 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.before\:to-\[rgb\(105\2c 184\2c 141\)\]::before {
  content: var(--tw-content);
  --tw-gradient-to: rgb(105,184,141) var(--tw-gradient-to-position)
}

.before\:transition-all::before {
  content: var(--tw-content);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms
}

.before\:duration-500::before {
  content: var(--tw-content);
  transition-duration: 500ms
}

.before\:ease-in-out::before {
  content: var(--tw-content);
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
}

.hover\:scale-105:hover {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  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))
}

.hover\:shadow-lg:hover {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.hover\:before\:left-0:hover::before {
  content: var(--tw-content);
  left: 0px
}