/*
 * Animatable.co | Carrd CSS
 */

@font-face {
  font-family: "BriceBold";
  src: url("https://animatable.s3.amazonaws.com/brice.woff2") format("woff2"), url("https://animatable.s3.amazonaws.com/brice.woff") format("woff");
}


:root {
  --color-blue: #2D8CEB;
  --color-dark-gray: #333333;
  --color-mid-gray: #666666;
  --color-light-gray: #B1B1B1;
  --color-white: #ffffff;
}

.product-name {
  background: var(--color-white);
}

/* Headings */
.text-component.style-6 {
  font-family: "BriceBold", sans-serif;
}

.slide-button li a {
  position: relative;
  cursor: pointer;
  z-index: 1;
}

.slide-button li a::before,
.slide-button span::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s cubic-bezier(0.33, 1, 0.68, 1);
}

.slide-button li a:hover::before,
.slide-button span:hover::before {
  transform: scaleX(1);
}

.slide-button li a:not(:hover)::before,
.slide-button span:not(:hover)::before {
  /* **Snap-Out Transition (Applies on un-hover: scaleX(1) -> scaleX(0))** */
  transition: transform 0s;
}

.slide-button-black li a::before {
  background-color: #262626;
}

.slide-button-black li a:hover {
  color: #e0e0e0;
}

.slide-button-black li a:hover svg {
  fill: #e0e0e0 !important;
}

.slide-button-pink li a::before {
  background-color: #FE0096;
}

.slide-button-blue span::before {
  background-color: #1BCEFF;
}