/*
---------------------------------------------------------------------------------------------
Acciones ajax
---------------------------------------------------------------------------------------------
*/

#ajax-actions{
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 10px 20px;
    background-color: #000;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.7);
    transition: 300ms;
    line-height: 20px;
    z-index: 9000;
}
#ajax-actions.show{
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}
#ajax-actions.error{
    background-color: rgba(255, 115, 115, 0.90);
}
#ajax-actions.loading{
    background-color: rgba(36, 85, 128, 0.90);
}
#ajax-actions.saving{
    background-color: rgba(36, 85, 128, 0.90);
}
#ajax-actions.success{
    background-color: rgba(0, 153, 32, 0.90);
}
#ajax-actions .fa{
    font-size: 18px;
    margin-right: 5px;
    line-height: 20px;
}

#ajax-actions.loading .error,
#ajax-actions.loading .success,
#ajax-actions.loading .saving{
    display: none;
}
#ajax-actions.saving .loading,
#ajax-actions.saving .error,
#ajax-actions.saving .success{
    display: none;
}
#ajax-actions.success .loading,
#ajax-actions.success .error,
#ajax-actions.success .saving{
    display: none;
}
#ajax-actions.error .loading,
#ajax-actions.error .success,
#ajax-actions.error .saving{
    display: none;
}
#ajax-actions .success .fa{
    transform: scale(0.7);
    opacity: 0;
    transition: 300ms;
}
#ajax-actions.success .success .fa{
    transform: scale(1);
    opacity: 1;
}

.fa-beat {
    animation:fa-beat 5s ease infinite;
}
@keyframes fa-beat {
    0% {
        transform:scale(1);
    }
    5% {
        transform:scale(1.25);
    }
    20% {
        transform:scale(1);
    }
    30% {
        transform:scale(1);
    }
    35% {
        transform:scale(1.25);
    }
    50% {
        transform:scale(1);
    }
    55% {
        transform:scale(1.25);
    }
    70% {
        transform:scale(1);
    }
}