/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 19 2025 | 10:15:45 */
/* combina tipo: animated fadeIn slow | normal | fast */
/* fadeIn/fadeOut | slideIn/slideOut | bounceIn/bounceOut | flipIn/flipOut | buzzIn/buzzOut */

/* BASE */
.animated {
  animation-fill-mode: both;
  animation-timing-function: ease-in;
  opacity: 0;                 /* nascosti di default */
}

/* TEMPI */
.fast   { animation-duration: 0.7s; }
.normal { animation-duration: 1.2s; }
.slow   { animation-duration: 1.5s; }

/* --- FADE --- */
.fadeIn.visible { animation-name: fadeIn; }
.fadeOut.visible { animation-name: fadeOut; }

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes fadeOut {
  from { opacity: 1; }
  to   { opacity: 0; }
}

/* --- SLIDE --- */
.slideIn.visible { animation-name: slideIn; }
.slideOut.visible { animation-name: slideOut; }

@keyframes slideIn {
  from { transform: translateY(50%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
@keyframes slideOut {
  from { transform: translateY(0); opacity: 1; }
  to   { transform: translateY(50%); opacity: 0; }
}

/* --- BOUNCE --- */
.bounceIn.visible { animation-name: bounceIn; }
.bounceOut.visible { animation-name: bounceOut; }

@keyframes bounceIn {
  0%   { transform: scale(0.5); opacity: 0; }
  60%  { transform: scale(1.2); opacity: .8; }
  80%  { transform: scale(0.9); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes bounceOut {
  20%  { transform: scale(0.9); }
  50%  { transform: scale(1.1); opacity: 1; }
  100% { transform: scale(0.3); opacity: 0; }
}

/* --- FLIP --- */
.flipIn.visible { 
  animation-name: flipIn;  
  backface-visibility: visible !important;
}
.flipOut.visible { 
  animation-name: flipOut;  
  backface-visibility: visible !important;
}

@keyframes flipIn {
  from { transform: rotateY(90deg); opacity: 0; }
  to   { transform: rotateY(0deg); opacity: 1; }
}
@keyframes flipOut {
  from { transform: rotateY(0deg); opacity: 1; }
  to   { transform: rotateY(90deg); opacity: 0; }
}

/* ------ BUZZ ------ */
.buzzIn.visible {
  animation-name: buzzIn;
  backface-visibility: visible !important;
}
.buzzOut.visible {
  animation-name: buzzOut;
  backface-visibility: visible !important;
}

@keyframes buzzIn {
  0%   { transform: scale(0.8) rotate(0deg); opacity: 0; }
  20%  { transform: scale(1.05) rotate(2deg); opacity: 1; }
  40%  { transform: scale(0.95) rotate(-2deg); }
  60%  { transform: scale(1.02) rotate(1deg); }
  80%  { transform: scale(0.98) rotate(-1deg); }
  100% { transform: scale(1) rotate(0); opacity: 1; }
}
@keyframes buzzOut {
  0%   { transform: scale(1) rotate(0); opacity: 1; }
  20%  { transform: scale(0.9) rotate(2deg); }
  40%  { transform: scale(0.95) rotate(-2deg); }
  100% { transform: scale(0.8) rotate(0); opacity: 0; }
}