@charset "utf-8";
/* CSS Document */

/* Define a custom CSS property '--num' that can be animated as an integer */
@property --num {
  syntax: "<integer>";
  initial-value: 0;
  inherits: false;
}

/* Base style for number animation elements */
/* Initializes --num to 0 and resets the CSS counter 'num' to that value */
.number-animation {
  --num: 0;
  counter-reset: num var(--num);
	text-align: center;
	font-size: 2.0rem;

	
	

}

/* Use the ::after pseudo-element to display the current value of the counter */
.number-animation::after {
  content: counter(num);
}

/* Keyframe animations to animate --num from 0 up to the target number */
/* Example animation from 0 to 50 */
@keyframes counter--440 {
  from {
    --num: 0;
  }
  to {
    --num: 440;
  }
}

/* You can add more animations for different target numbers as needed */

/* Animation classes that apply the corresponding keyframe animations */
.animate--440 {
  animation: counter--440 3s ease forwards;
}


@keyframes counter--17 {
  from {
    --num: 0;
  }
  to {
    --num: 17;
  }
}

/* You can add more animations for different target numbers as needed */

/* Animation classes that apply the corresponding keyframe animations */
.animate--17 {
  animation: counter--17 4s ease forwards;
}


@keyframes counter--128 {
  from {
    --num: 0;
  }
  to {
    --num: 128;
  }
}

/* You can add more animations for different target numbers as needed */

/* Animation classes that apply the corresponding keyframe animations */
.animate--128 {
  animation: counter--128 5s ease forwards;
}