﻿*, :after, :before {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-transform: translateX(var(--tw-translate-x)) translateY(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));
  border-color: currentColor;
  --tw-blur: var(--tw-empty);
  --tw-brightness: var(--tw-empty);
  --tw-contrast: var(--tw-empty);
  --tw-grayscale: var(--tw-empty);
  --tw-hue-rotate: var(--tw-empty);
  --tw-invert: var(--tw-empty);
  --tw-saturate: var(--tw-empty);
  --tw-sepia: var(--tw-empty);
  --tw-drop-shadow: var(--tw-empty);
  --tw-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.button {
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
  position: relative;
  white-space: nowrap;
  box-sizing: border-box;
  border-radius: clamp(2.2rem, 1.25vw, 1.88rem);
  color: rgba(57, 115, 102, var(--tw-text-opacity));
  --shift: 100ms;
  --timing: 600ms;
  --arrow-pos: 83%;
  --content-pos: 50%;
  --tw-bg-opacity: 1;
  --cliping-size: 13%;
  --tw-text-opacity: 1;
  --cliping-pos-x: 37%;
  --ease-in-out-expo: cubic-bezier(0.19,1,0.22,1);
  --ease-in-out-circ: cubic-bezier(0.785,0.135,0.15,0.86);
}
.button .icon {
  width: max(1vw, 14px);
  min-width: max(1vw, 14px);
  margin-right: max(0.625vw, 10px);
}
.button .second-icon {
  top: 50%;
  left: -10%;
  opacity: 0;
  margin-right: 0;
  position: absolute;
  --tw-translate-y: -50%;
  transform: var(--tw-transform);
}
.button .second-icon svg, .button .second-icon img {
  stroke: currentColor;
}
.button .button-content {
  width: 100%;
  height: 100%;
  display: flex;
  visibility: hidden;
  align-items: center;
}
.button .button-container {
  top: 0;
  left: 0;
  width: 200%;
  height: 100%;
  display: flex;
  position: absolute;
  --tw-translate-x: -50%;
  transform: var(--tw-transform);
}
.button .button-container .button-text {
  z-index: 3;
  width: 50%;
  height: 100%;
  display: flex;
  flex-shrink: 0;
  color: #880a28;
  position: relative;
  align-items: center;
  --tw-bg-opacity: 1;
  --tw-text-opacity: 1;
  box-sizing: border-box;
  background-color: white;
  padding-left: clamp(1rem, 1.04vw, 1.56rem);
  border-radius: clamp(2.2rem, 1.25vw, 1.88rem);
  border: max(0.063vw, 1px) solid #f6acbe;
}
.button .button-container .button-inner {
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
  align-items: center;
  box-sizing: border-box;
  justify-content: center;
  background-color: #880a28;
  padding-left: clamp(1rem, 1.04vw, 1.56rem);
  padding-right: clamp(1rem, 1.04vw, 1.56rem);
}
.button .button-container .button-in-wrapper {
  color: white;
  z-index: 4;
  width: 50%;
  height: 100%;
  flex-shrink: 0;
  position: relative;
  pointer-events: none;
  --tw-text-opacity: 1;
  border-radius: clamp(2.2rem, 1.25vw, 1.88rem);
}
.button .button-container .button-out-wrapper {
  top: 0;
  left: 50%;
  width: 50%;
  z-index: 4;
  height: 100%;
  color: white;
  position: absolute;
  isolation: isolate;
  --tw-bg-opacity: 1;
  pointer-events: none;
  --tw-text-opacity: 1;
  background-color: #880a28;
  border-radius: clamp(2.2rem, 1.25vw, 1.88rem);
}
.button::after, .button:after {
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  border-width: 1px;
  position: absolute;
  pointer-events: none;
  --tw-border-opacity: 1;
  border-radius: clamp(2.2rem, 1.25vw, 1.88rem);
  border-color: rgba(57, 115, 102, var(--tw-border-opacity));
}
@media screen and (min-width: 768px) {
  .button.enter .second-icon {
    opacity: 1;
    left: var(--arrow-pos);
    transition: left 0.8s var(--ease-in-out-circ), opacity step-end 0.45s;
    transition-delay: 0.2s;
  }
  .button.enter .button-container .button-out-wrapper {
    -webkit-animation: var(--timing) button-translate-out-wrapper var(--ease-in-out-circ) forwards;
    animation: var(--timing) button-translate-out-wrapper var(--ease-in-out-circ) forwards;
  }
  .button.enter .button-container .button-out-wrapper .button-inner {
    -webkit-animation: calc(var(--timing) - var(--shift)) button-translate-content var(--ease-in-out-circ) forwards;
    animation: calc(var(--timing) - var(--shift)) button-translate-content var(--ease-in-out-circ) forwards;
    -webkit-animation-delay: var(--shift);
    animation-delay: var(--shift);
  }
  .button.leave .button-container {
    -webkit-animation: var(--timing) button-translate-container var(--ease-in-out-expo) forwards;
    animation: var(--timing) button-translate-container var(--ease-in-out-expo) forwards;
  }
  .button.leave .button-container .button-out-wrapper {
    transform: translate3d(var(--cliping-pos-x), 0, 0) scale(1);
    -webkit-clip-path: circle(var(--cliping-size));
    clip-path: circle(var(--cliping-size));
  }
}

.white .button-container .button-text {
  color: white;
  background-color: #880a28;
}
.white .button-container .button-inner {
  background-color: white;
}
.white .button-container .button-in-wrapper {
  color: #880a28;
}
.white .button-container .button-in-wrapper .button-inner {
  border: max(0.063vw, 1px) solid #f6acbe;
  border-radius: clamp(2.2rem, 1.25vw, 1.88rem);
}
.white .button-container .button-out-wrapper {
  color: #880a28;
  background-color: white;
}
.white::after, .white:after {
  border-color: rgba(57, 115, 102, var(--tw-border-opacity));
}

.tabWrapper {
  position: relative;
}
.tabWrapper .tabBtn {
  width: 100%;
  height: 100%;
  display: flex;
  cursor: pointer;
  border-bottom: 0;
  align-items: center;
  justify-content: center;
}
.tabWrapper .tabBtn .img {
  width: max(1.25vw, 17.5px);
  margin-right: max(0.625vw, 8.75px);
}
@media screen and (min-width: 768px) {
  .tabWrapper .tabBtn:hover .img {
    -webkit-animation: 1s bounce ease-out;
    -moz-animation: 1s bounce ease-out;
    -o-animation: 1s bounce ease-out;
    animation: 1s bounce ease-out;
  }
}
.tabWrapper .tabSelected {
  top: 50%;
  z-index: 1;
  position: absolute;
  box-sizing: border-box;
  transform: translateY(-50%);
  height: max(2.625vw, 36.75px);
  border-radius: max(1.375vw, 19.25px);
  border: max(0.063vw, 1px) solid #df7e95;
  box-shadow: inset 0 max(0.188vw, 2.632px) max(0.375vw, 5.25px) rgba(136, 10, 40, 0.1215686275);
}

.typeWrapper {
  width: 100%;
  display: flex;
  position: relative;
  padding-bottom: max(0.625vw, 8.75px);
  border-bottom: max(0.063vw, 1px) solid #707070;
}
.typeWrapper .type {
  display: flex;
  cursor: pointer;
  position: relative;
  align-items: center;
  margin-right: max(2.5vw, 35px);
  padding-right: max(0.125vw, 2px);
}
.typeWrapper .type svg {
  fill: black;
  display: block;
  width: max(1.25vw, 17.5px);
  height: max(1.25vw, 17.5px);
  margin-right: max(0.625vw, 8.75px);
}
.typeWrapper .type .font20 {
  color: black;
  font-family: "Inter-Bold";
  margin-right: max(0.75vw, 10.5px);
}
.typeWrapper .type .count {
  color: black;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  justify-content: center;
  height: max(1.25vw, 17.5px);
  font-family: "Inter-Regular";
  width: max(1.938vw, 27.132px);
  border-radius: max(0.75vw, 10.5px);
  border: max(0.063vw, 1px) solid black;
}
.typeWrapper .type:last-child {
  margin-right: 0;
}
.typeWrapper .type:hover svg, .typeWrapper .type.select svg {
  fill: #880A28;
}
.typeWrapper .type:hover .font20, .typeWrapper .type.select .font20 {
  color: #880A28;
}
.typeWrapper .type:hover .count, .typeWrapper .type.select .count {
  color: #880A28;
  border-color: #880A28;
}
.typeWrapper .line {
  top: 100%;
  position: absolute;
  background-color: #880A28;
  height: max(0.188vw, 2.632px);
  margin-top: max(-0.063vw, -1px);
  border-radius: max(1.875vw, 26.25px);
}

.text_shadows {
  --color-primary: #f6aca2;
  --color-quinary: #ee6352;
  --color-tertiary: #f28b7d;
  --color-secondary: #f49b90;
  --color-quaternary: #f07a6a;
  animation: shadows-in 1.2s ease-in forwards, move-in 1.2s ease-in forwards;
}

@-webkit-keyframes button-translate-content {
  0% {
    -webkit-transform: translateZ(0);
  }
  to {
    -webkit-transform: translate3d(var(--content-pos), 0, 0);
  }
}
@keyframes button-translate-content {
  0% {
    transform: translateZ(0);
  }
  to {
    transform: translate3d(var(--content-pos), 0, 0);
  }
}
@-webkit-keyframes button-translate-container {
  0% {
    -webkit-transform: translate(-50%);
  }
  to {
    -webkit-transform: translate(0);
  }
}
@keyframes button-translate-container {
  0% {
    transform: translate(-50%);
  }
  to {
    transform: translate(0);
  }
}
@-webkit-keyframes button-translate-out-wrapper {
  0% {
    -webkit-transform: translateZ(0);
    clip-path: circle(100%);
  }
  to {
    -webkit-transform: translate3d(var(--cliping-pos-x), 0, 0);
    clip-path: circle(var(--cliping-size));
  }
}
@keyframes button-translate-out-wrapper {
  0% {
    transform: translateZ(0);
    clip-path: circle(100%);
  }
  to {
    transform: translate3d(var(--cliping-pos-x), 0, 0);
    clip-path: circle(var(--cliping-size));
  }
}
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(0px);
  }
  16.66% {
    -webkit-transform: translateY(-10px);
  }
  33.32% {
    -webkit-transform: translateY(0px);
  }
  41.64% {
    -webkit-transform: translateY(-3px);
  }
  49.96% {
    -webkit-transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
  }
}
@keyframes bounce {
  0% {
    transform: translateY(0px);
  }
  16.66% {
    transform: translateY(-10px);
  }
  33.32% {
    transform: translateY(0px);
  }
  41.64% {
    transform: translateY(-3px);
  }
  49.96% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(0px);
  }
}
@keyframes bounce3sdelay {
  0% {
    transform: translateY(0px);
  }
  90% {
    transform: translateY(0px);
  }
  93.32% {
    transform: translateY(-10px);
  }
  96.64% {
    transform: translateY(0px);
  }
  99.16% {
    transform: translateY(-3px);
  }
  99.96% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(0px);
  }
}
@keyframes shadows-out {
  0% {
    text-shadow: none;
  }
  10% {
    text-shadow: 3px 3px 0 var(--color-secondary);
  }
  20% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary);
  }
  30% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary);
  }
  40% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary), 12px 12px 0 var(--color-quinary);
  }
  50% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary), 12px 12px 0 var(--color-quinary);
  }
  60% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary), 12px 12px 0 var(--color-quinary);
  }
  100% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary), 12px 12px 0 var(--color-quinary);
  }
}
@keyframes shadows-in {
  0% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary), 12px 12px 0 var(--color-quinary);
  }
  10% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary), 9px 9px var(--color-quaternary);
  }
  20% {
    text-shadow: 3px 3px 0 var(--color-secondary), 6px 6px 0 var(--color-tertiary);
  }
  30% {
    text-shadow: 3px 3px 0 var(--color-secondary);
  }
  40% {
    text-shadow: none;
  }
  100% {
    text-shadow: none;
  }
}
@keyframes move-out {
  0% {
    transform: translate(0px, 0px);
  }
  40% {
    transform: translate(-12px, -12px);
  }
  100% {
    transform: translate(-12px, -12px);
  }
}
@keyframes move-in {
  0% {
    transform: translate(-12px, -12px);
  }
  40% {
    transform: translate(0px, 0px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}
@keyframes popout {
  0% {
    transform: scale(0) translateY(0);
  }
  25% {
    transform: scale(0) translateY(0);
  }
  50% {
    transform: scale(1) translateY(-10px);
  }
  100% {
    transform: scale(1) translateY(0px);
  }
}
@keyframes move-up {
  0% {
    transform: translateY(0px) rotate(0deg);
  }
  15.38% {
    transform: translateY(-20px) rotate(20deg);
  }
  38.45% {
    transform: translateY(-40px) rotate(-15deg);
  }
  57.68% {
    transform: translateY(-70px) rotate(16deg);
  }
  84.6% {
    transform: translateY(-90px) rotate(-12deg);
  }
  100% {
    transform: translateY(0px) rotate(0deg);
  }
}
@keyframes move-right {
  0% {
    transform: translate(0px, 0px) rotate(0deg);
  }
  21% {
    transform: translate(20px, 50px) rotate(-7deg);
  }
  46% {
    transform: translate(-20px, 80px) rotate(7deg);
  }
  77% {
    transform: translate(10px, 20px) rotate(-1deg);
  }
  100% {
    transform: translate(0px, 0px) rotate(0deg);
  }
}
@keyframes move-left {
  0% {
    transform: translate(0px, 0px) rotate(0deg);
  }
  20% {
    transform: translate(20px, -30px) rotate(-7deg);
  }
  45% {
    transform: translate(-20px, 20px) rotate(7deg);
  }
  70% {
    transform: translate(10px, 80px) rotate(-1deg);
  }
  100% {
    transform: translate(0px, 0px) rotate(0deg);
  }
}
@keyframes wave {
  25% {
    transform: rotate(-25deg);
  }
  50% {
    transform: rotate(0deg);
  }
  75% {
    transform: rotate(25deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes hover-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    -moz-transform: translateX(3px) rotate(2deg);
    -ms-transform: translateX(3px) rotate(2deg);
    -o-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    -moz-transform: translateX(-3px) rotate(-2deg);
    -ms-transform: translateX(-3px) rotate(-2deg);
    -o-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    -moz-transform: translateX(3px) rotate(2deg);
    -ms-transform: translateX(3px) rotate(2deg);
    -o-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    -moz-transform: translateX(-3px) rotate(-2deg);
    -ms-transform: translateX(-3px) rotate(-2deg);
    -o-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    -moz-transform: translateX(2px) rotate(1deg);
    -ms-transform: translateX(2px) rotate(1deg);
    -o-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    -moz-transform: translateX(-2px) rotate(-1deg);
    -ms-transform: translateX(-2px) rotate(-1deg);
    -o-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    -moz-transform: translateX(2px) rotate(1deg);
    -ms-transform: translateX(2px) rotate(1deg);
    -o-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    -moz-transform: translateX(-2px) rotate(-1deg);
    -ms-transform: translateX(-2px) rotate(-1deg);
    -o-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    -moz-transform: translateX(1px) rotate(0);
    -ms-transform: translateX(1px) rotate(0);
    -o-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    -moz-transform: translateX(-1px) rotate(0);
    -ms-transform: translateX(-1px) rotate(0);
    -o-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes float {
  0% {
    transform: translateX(-12.45px);
  }
  50% {
    transform: translateX(-6.225px);
  }
  100% {
    transform: translateX(-12.45px);
  }
}
@-o-keyframes spinnerRotate {
  from {
    -ms-transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
  }
}
@-moz-keyframes spinnerRotate {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-ms-keyframes spinnerRotate {
  from {
    -ms-transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
  }
}
@-webkit-keyframes spinnerRotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spinnerRotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
