.varicon.varicon-refresh:before
{
    display: block;

    width: 28px;
    height: 28px;

    content: ' ';

    background-image: url('../../images/icons/refresh.svg');
    background-size: 28px 28px;
}

.varicon.varicon-spin:before
{
    -webkit-animation-name: spin;
       -moz-animation-name: spin;
        -ms-animation-name: spin;
            animation-name: spin;
    -webkit-animation-duration: 4000ms;
       -moz-animation-duration: 4000ms;
        -ms-animation-duration: 4000ms;
            animation-duration: 4000ms;
    -webkit-animation-timing-function: linear;
       -moz-animation-timing-function: linear;
        -ms-animation-timing-function: linear;
            animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
       -moz-animation-iteration-count: infinite;
        -ms-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
}

@-webkit-keyframes spin
{
    from
    {
        -webkit-transform: rotate(0deg);
    }
    to
    {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin
{
    from
    {
        transform: rotate(0deg);
    }
    to
    {
        transform: rotate(360deg);
    }
}