/* --------- CRESCI ---------- */
@keyframes cresci {
    0% { transform: scale( 0 ); }
    100% { transform: scale( 1 ); }
}

/* --------- DONDOLA ---------- */
@keyframes dondolashort {
    0% { transform: rotate( -5deg ); }
    100% { transform: rotate( 5deg ); }
}
@keyframes dondola {
    0% { transform: rotate( -25deg ); }
    100% { transform: rotate( 25deg ); }
}
@keyframes dondolalong {
    0% { transform: rotate( -45deg ); }
    100% { transform: rotate( 45deg ); }
}

/* --------- PULSA ---------- */
@keyframes pulsashort {
    0% { transform: scale( 0.98 ); }
    100% { transform: scale( 1.02 ); }
}
@keyframes pulsa {
    0% { transform: scale( 0.93 ); }
    100% { transform: scale( 1.07 ); }
}
@keyframes pulsalong {
    0% { transform: scale( 0.85 ); }
    100% { transform: scale( 1.15 ); }
}

/* --------- DONDOLA ---------- */
@keyframes dondolashort {
    0% { transform: rotate( -5deg ); }
    100% { transform: rotate( 5deg ); }
}
@keyframes dondola {
    0% { transform: rotate( -25deg ); }
    100% { transform: rotate( 25deg ); }
}
@keyframes dondolalong {
    0% { transform: rotate( -45deg ); }
    100% { transform: rotate( 45deg ); }
}

/* --------- GALLEGGIA ---------- */
@keyframes galleggiashort {
    0% { transform: translateY( -5% ); }
    100% { transform: translateY( 5% ); }
}
@keyframes galleggia {
    0% { transform: translateY( -12% ); }
    100% { transform: translateY( 12% ); }
}
@keyframes galleggialong {
    0% { transform: translateY( -25% ); }
    100% { transform: translateY( 25% ); }
}

/* --------- ATTRAVERSA ---------- */
@keyframes attraversa {
    0% { transform: translateX( calc( -50vw - 50% - 100px ) ); }
    100% { transform: translateX( calc( +50vw + 50% + 100px ) ); }
}

/* --------- RISALI o AFFONDA ---------- */
@keyframes risali-o-affondashort {
    0% { transform: translateY( 70% ); }
    100% { transform: translateY( 0 ); }
}
@keyframes risali-o-affonda {
    0% { transform: translateY( 150% ); }
    100% { transform: translateY( 0 ); }
}
@keyframes risali-o-affondalong {
    0% { transform: translateY( 300% ); }
    100% { transform: translateY( 0 ); }
}

/* --------- RIMBALZA ---------- */
@keyframes saltellashort {
    0% {transform: translateY(0%);}
    20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-15px);}
    60% {transform: translateY(-7px);}
}
@keyframes saltella {
    0% {transform: translateY(0%);}
    20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-30px);}
    60% {transform: translateY(-15px);}
}
@keyframes saltellalong {
    0% {transform: translateY(0%);}
    20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-60px);}
    60% {transform: translateY(-30px);}
}

/* --------- ROTOLA ---------- */
@keyframes rotolashort {
    0% { transform: translateX( calc( -50vw - 50% - 50px ) ) rotate( -90deg ); }
    100% { transform: translateX( calc( +50vw + 50% + 50px ) )  rotate( 90deg ); }
}
@keyframes rotola {
    0% { transform: translateX( calc( -50vw - 50% - 50px ) ) rotate( -270deg ); }
    100% { transform: translateX( calc( +50vw + 50% + 50px ) )  rotate( 270deg ); }
}
@keyframes rotolalong {
    0% { transform: translateX( calc( -50vw - 50% - 50px ) ) rotate( -450deg ); }
    100% { transform: translateX( calc( +50vw + 50% + 50px ) )  rotate( 450deg ); }
}
/* --------- RUNS ---------- */
@keyframes girashort {
    0% { transform: rotate( 0deg ); }
    100% { transform: rotate( 360deg ); }
}
@keyframes gira {
    0% { transform: rotate( 0deg ); }
    100% { transform: rotate( 360deg ); }
}
@keyframes giralong {
    0% { transform: rotate( 0deg ); }
    100% { transform: rotate( 360deg ); }
}

/* --------- BRILLA ---------- */
@keyframes brillashort {
    0% { box-shadow: 0 0 -10px rgba(232,189,109,0.88); }
    50% { box-shadow: 0 0 50px rgba(232,189,109,0.88); }
    100% { box-shadow: 0 0 100px rgba(232,189,109,0); }
}
@keyframes brilla {
    0% { box-shadow: 0 0 -10px rgba(232,189,109,0.88); }
    50% { box-shadow: 0 0 200px rgba(232,189,109,0.88); }
    100% { box-shadow: 0 0 300px rgba(232,189,109,0); }
}
@keyframes brillalong {
    0% { box-shadow: 0 0 -10px rgba(232,189,109,0.88); }
    50% { box-shadow: 0 0 300px rgba(232,189,109,0.88); }
    100% { box-shadow: 0 0 700px rgba(232,189,109,0); }
}

@keyframes brilla1 {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
        box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
    }
    70% {
        -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
        box-shadow: 0 0 0 10px rgba(204,169,44, 0);
    }
    100% {
        -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
        box-shadow: 0 0 0 0 rgba(204,169,44, 0);
    }
}


/* AJAX - OPEN - PAGE */
/*esci*/
@keyframes exitToRight {
    0% { transform: translate(0,0); }
    100% { transform: translateX(100%); }
}
/*entra*/
@keyframes enterFromRight {
    0% { transform: translate(100%,0); }
    100% { transform: translateX(0); }
}
/*esci*/
@keyframes exitToLeft {
    0% { transform: translate(0,0); }
    100% { transform: translateX(-100%); }
}
/*entra*/
@keyframes enterFromLeft {
    0% { transform: translate(-100%,0); }
    100% { transform: translateX(0); }
}
/* -------------------- */
/*esci*/
@keyframes exitToTop {
    0% { transform: translate(0,0); }
    100% { transform: translateY(-100%); }
}
/*entra*/
@keyframes enterFromTop {
    0% { transform: translate(0,-100%); }
    100% { transform: translateY(0); }
}
/*esci*/
@keyframes exitToBottom {
    0% { transform: translate(0,0); }
    100% { transform: translateY(100%); }
}
/*entra*/
@keyframes enterFromBottom {
    0% { transform: translate(0,100%); }
    100% { transform: translateY(0); }
}
/* ---------------------- */

@keyframes exitToScaleBack {
    0% { transform: scale(1);}
    30% { opacity: 1; }
    99% { visibility: visible; }
    100% { transform: scale(0.5); opacity: 0; visibility: hidden;}
}
@keyframes exitToScaleFront {
    0% { transform: scale(1);}
    30% { opacity: 1; }
    99% { visibility: visible; }
    100% { transform: scale(1.3); opacity: 0; visibility: hidden;}
}

@keyframes enterFormScaleBack {
    0% { transform: perspective(1500px) translateZ(-500px); visibility: visible; opacity: 0;}
    100% { transform: perspective(1500px) translateZ(0); opacity: 1;}
}
@keyframes enterFormScaleFront {
    0% { transform: perspective(1500px) translateZ(500px); visibility: visible; opacity: 0;}
    100% { transform: perspective(1500px) translateZ(0); opacity: 1;}
}

/* ---------------------- */
@keyframes exitToFade {
    0% { opacity: 1;}
    100% { opacity: 0;}
}
@keyframes enterFromFade {
    0% { opacity: 0;}
    100% { opacity: 1;}
}



@keyframes exitQuit {
    0% { transform: scale(1); opacity: 1; visibility: visible;}
    100% { transform: scale(0.5); opacity: 0; visibility: hidden;}
}
@keyframes enterQuit {
    0% { transform: scale(0.5); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes loadAnim {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* flip */

@-webkit-keyframes flipOutRight {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
}
@keyframes flipOutRight {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(90deg); transform: perspective(1500px) translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInLeft {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
    to { -webkit-transform: perspective(1500px) translateZ(0px) rotateY(0deg); opacity: 1; }
}
@keyframes flipInLeft {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(-90deg); transform: perspective(1500px) translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
    to { -webkit-transform: perspective(1500px) translateZ(0px) rotateY(0deg); opacity: 1; }
}

@-webkit-keyframes flipOutLeft {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
}
@keyframes flipOutLeft {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(-90deg); transform: perspective(1500px) translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInRight {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
    to { -webkit-transform: perspective(1500px) translateZ(0px) rotateY(0deg); opacity: 1; }
}
@keyframes flipInRight {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateY(90deg); transform: perspective(1500px) translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
    to { -webkit-transform: perspective(1500px) translateZ(0px) rotateY(0deg); opacity: 1; }
}

@-webkit-keyframes flipOutTop {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}
@keyframes flipOutTop {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(90deg); transform: perspective(1500px) translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInBottom {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}
@keyframes flipInBottom {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(-90deg); transform: perspective(1500px) translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}

@-webkit-keyframes flipOutBottom {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}
@keyframes flipOutBottom {
    from { }
    to { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(-90deg); transform: perspective(1500px) translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInTop {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}
@keyframes flipInTop {
    from { -webkit-transform: perspective(1500px) translateZ(-1000px) rotateX(90deg); transform: perspective(1500px) translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}


/* --------- MODAL PopUp ANIMATIONS ---------- */
/*esci*/
@keyframes noneOut {
    0% { display: block; }
    100% { display: none; }
}
@keyframes noneIn {
    0% { display: none; }
    100% { display: block; }
}
@keyframes noneOutPopup {
    0% { display: block; }
    100% { display: none; }
}
@keyframes noneInPopup {
    0% { display: none; }
    100% { display: block; }
}
@keyframes exitToRightPopup {
    0% { transform: translate(0,0); }
    100% { transform: translateX(100vw); }
}
/*entra*/
@keyframes enterFromRightPopup {
    0% { transform: translate(100vw,0); }
    100% { transform: translateX(0); }
}
/*esci*/
@keyframes exitToLeftPopup {
    0% { transform: translate(0,0); }
    100% { transform: translateX(-100vw); }
}
/*entra*/
@keyframes enterFromLeftPopup {
    0% { transform: translate(-100vw,0); }
    100% { transform: translateX(0); }
}
/* -------------------- */
/*esci*/
@keyframes exitToTopPopup {
    0% { transform: translate(0,0); }
    100% { transform: translateY(-100vh); }
}
/*entra*/
@keyframes enterFromTopPopup {
    0% { transform: translate(0,-100vh); }
    100% { transform: translateY(0); }
}
/*esci*/
@keyframes exitToBottomPopup {
    0% { transform: translate(0,0); }
    100% { transform: translateY(100vh); }
}
/*entra*/
@keyframes enterFromBottomPopup {
    0% { transform: translate(0,100vh); }
    100% { transform: translateY(0); }
}
/* ---------------------- */

@keyframes exitToScaleBackPopup {
    0% { transform: scale(1);}
    30% { opacity: 1; }
    99% { visibility: visible; }
    100% { transform: scale(0.5); opacity: 0; visibility: hidden;}
}
@keyframes exitToScaleFrontPopup {
    0% { transform: scale(1);}
    30% { opacity: 1; }
    99% { visibility: visible; }
    100% { transform: scale(1.3); opacity: 0; visibility: hidden;}
}

@keyframes enterFormScaleBackPopup {
    0% { transform: translateZ(-500px); visibility: visible; opacity: 0;}
    100% { transform: translateZ(0); opacity: 1;}
}
@keyframes enterFormScaleFrontPopup {
    0% { transform: translateZ(500px); visibility: visible; opacity: 0;}
    100% { transform: translateZ(0); opacity: 1;}
}

/* ---------------------- */
@keyframes exitToFadePopup {
    0% { opacity: 1;}
    100% { opacity: 0;}
}
@keyframes enterFromFadePopup {
    0% { opacity: 0;}
    100% { opacity: 1;}
}



@keyframes exitQuitPopup {
    0% { transform: scale(1); opacity: 1; visibility: visible;}
    100% { transform: scale(0.5); opacity: 0; visibility: hidden;}
}
@keyframes enterQuitPopup {
    0% { transform: scale(0.5); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes loadAnimPopup {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* flip */

@-webkit-keyframes flipOutRightPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
}
@keyframes flipOutRightPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateY(90deg); transform: translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInLeftPopup {
    from { -webkit-transform: translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
    to { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; }
}
@keyframes flipInLeftPopup {
    from { -webkit-transform: translateZ(-1000px) rotateY(-90deg); transform: translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
    to { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; }
}

@-webkit-keyframes flipOutLeftPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
}
@keyframes flipOutLeftPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateY(-90deg); transform: translateZ(-1000px) rotateY(-90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInRightPopup {
    from { -webkit-transform: translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
    to { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; }
}
@keyframes flipInRightPopup {
    from { -webkit-transform: translateZ(-1000px) rotateY(90deg); transform: translateZ(-1000px) rotateY(90deg); opacity: 0.2; }
    to { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; }
}

@-webkit-keyframes flipOutTopPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}
@keyframes flipOutTopPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateX(90deg); transform: translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInBottomPopup {
    from { -webkit-transform: translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}
@keyframes flipInBottomPopup {
    from { -webkit-transform: translateZ(-1000px) rotateX(-90deg); transform: translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}

@-webkit-keyframes flipOutBottomPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}
@keyframes flipOutBottomPopup {
    from { }
    to { -webkit-transform: translateZ(-1000px) rotateX(-90deg); transform: translateZ(-1000px) rotateX(-90deg); opacity: 0.2; }
}

@-webkit-keyframes flipInTopPopup {
    from { -webkit-transform: translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}
@keyframes flipInTopPopup {
    from { -webkit-transform: translateZ(-1000px) rotateX(90deg); transform: translateZ(-1000px) rotateX(90deg); opacity: 0.2; }
}