/* NEW TIMER */
.flip-clock-wrapper ul {
	background: #FFC800 !important;
}
.flip-clock-wrapper ul li a div.up:after {
	background-color: #CCA30E !important;
	background-color: rgba(0, 0, 0, 0.1) !important;
}
.flip-clock-wrapper ul li a div div.inn {
	color: #000 !important;
	font-family: "Fira Sans Extra Condensed",Impact,sans-serif;
	text-shadow: 0 1px 1px rgba(0,0,0,0) !important;
	background-color: #FFC800 !important;
}
.flip-clock-dot {
	background: #CCA30E !important;
}
.glisten {
  position: relative;
  display: inline-block;
  overflow: hidden;
  mask-image: url('../../global/img/guarantee.png'); /* Use the image itself as a mask */
  -webkit-mask-image: url('../../global/img/guarantee.png'); /* WebKit mask for better compatibility */
	mask-size: cover; /* Ensure the mask covers the entire element */
  -webkit-mask-size: cover; /* WebKit version */
  mask-position: center; /* Ensure the mask is centered properly */
  -webkit-mask-position: center;
}
/* For scrolling down */
.glisten-active-down::after {
  content: "";
  position: absolute;
  top: 0;
  left: -150%;
  width: 200%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.5) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-30deg);
  animation: shineDown 4s forwards;
}

@keyframes shineDown {
  from {
    left: -150%;
  }
  to {
    left: 150%;
  }
}
/* For scrolling up */
.glisten-active-up::after {
  content: "";
  position: absolute;
  top: 0;
  left: 150%;
  width: 200%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.5) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-30deg);
  animation: shineUp 4s forwards;
}

@keyframes shineUp {
  from {
    left: 150%;
  }
  to {
    left: -150%;
  }
}