.ActiveUsers {
    background: #f4f2f1;
    border: 1px solid #d4d2d0;
    border-radius: 4px;
    padding: .5em 1.5em;
    white-space: nowrap;
    font-family: 'Raleway', Helvetica, sans-serif !important;
    width: 188px;
    margin: -1em 0 0 auto;
}

.ActiveUsers-value {
    display: inline-block;
    margin-right: -.25em
}

.ActiveUsers.is-increasing {
    -webkit-animation: a 3s;
    animation: a 3s
}

.ActiveUsers.is-decreasing {
    -webkit-animation: b 3s;
    animation: b 3s
}

@-webkit-keyframes a {
    10% {
        background-color: #ebffeb;
        border-color: rgba(0, 128, 0, .5);
        color: green
    }
}

@keyframes a {
    10% {
        background-color: #ebffeb;
        border-color: rgba(0, 128, 0, .5);
        color: green
    }
}

@-webkit-keyframes b {
    10% {
        background-color: #ffebeb;
        border-color: rgba(255, 0, 0, .5);
        color: red
    }
}

@keyframes b {
    10% {
        background-color: #ffebeb;
        border-color: rgba(255, 0, 0, .5);
        color: red
    }
}