.fade-in{
	opacity:0;
	transition: opacity 1s ease-out;
}
.fade-in.is-visible{
	opacity:1
}
.fade-in-down{
	opacity:0;
	transform: translateY(150px);
	transition: opacity 1s ease-out, transform 0.5s ease-out;
}
.fade-in-down.is-visible{
	opacity:1;
	transform: translateY(0);
}
.fade-in-up{
	opacity:0;
	transform: translateY(-150px);
	transition: opacity 1s ease-out, transform 0.5s ease-out;
}
.fade-in-up.is-visible{
	opacity:1;
	transform: translateY(0);
}
.fade-in-left{
	opacity:0;
	transform: translateX(-150px);
	transition: opacity 1s ease-out, transform 0.5s ease-out;
}
.fade-in-left.is-visible{
	opacity:1;
	transform: translateX(0);
}
.fade-in-right{
	opacity:0;
	transform: translateX(150px);
	transition: opacity 1s ease-out, transform 0.5s ease-out;
}
.fade-in-right.is-visible{
	opacity:1;
	transform: translateX(0);
}

/* CONTEGGIO NUMERI */
	@property --num {
	  syntax: "<integer>";
	  initial-value: 0; /* Il valore iniziale del contatore */
	  inherits: false;
	}
	.stat-box{
		counter-reset: num var(--num);
	}
	.stat-box::after {
	  content: counter(num);
	}
	@keyframes count-250 {
	  from {
		--num: 0;
	  }
	  to {
		--num: 270;
	  }
	}
	@keyframes count-2000 {
	  from {
		--num: 0;
	  }
	  to {
		--num: 1359;
	  }
	}
	@keyframes count-1200 {
	  from {
		--num: 0;
	  }
	  to {
		--num: 890;
	  }
	}
	@keyframes count-7 {
	  from {
		--num: 0;
	  }
	  to {
		--num: 7;
	  }
	}
	.count-250.is-visible {
	  animation: count-250 2s ease-out forwards; /* 2 secondi di durata */
	}
	.count-2000.is-visible {
	  animation: count-2000 3s ease-in-out forwards; /* 3 secondi per il numero più grande */
	}
	.count-1200.is-visible {
	  animation: count-1200 2.5s ease-in-out forwards; /* 3 secondi per il numero più grande */
	}
	.count-7.is-visible {
	  animation: count-7 1.5s linear forwards;
	}