@keyframes spin{

    100%{
        transform:rotate(360deg);
    }

}

.fade-up{

    opacity:0;
    transform:translateY(50px);

    transition:1s ease;

}

.fade-up.active{

    opacity:1;
    transform:translateY(0);

}

.zoom-in{

    opacity:0;
    transform:scale(0.8);

    transition:1s ease;

}

.zoom-in.active{

    opacity:1;
    transform:scale(1);

}

.slide-left{

    opacity:0;
    transform:translateX(-80px);

    transition:1s ease;

}

.slide-left.active{

    opacity:1;
    transform:translateX(0);

}

.slide-right{

    opacity:0;
    transform:translateX(80px);

    transition:1s ease;

}

.slide-right.active{

    opacity:1;
    transform:translateX(0);

}

.floating{
    animation:floating 4s ease-in-out infinite;
}

@keyframes floating{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-15px);
    }

    100%{
        transform:translateY(0px);
    }

}

.pulse{
    animation:pulse 2s infinite;
}

@keyframes pulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.05);
    }

    100%{
        transform:scale(1);
    }

}