Pulsing "Working" graphic

by nathanziarek

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<div class="working"><i class="fa fa-circle-thin"></i></div>

CSS

.fa-circle-thin {
    line-height: 20px;
    font-size: 1em;
    text-align: center;
    width: 20px;
    color: #999;
}

.working .fa-circle-thin {
    -webkit-animation: pulse .5s; /* Chrome, Safari, Opera */
    animation: pulse .5s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes pulse {
    0% { font-size: 1em; }
    100% { font-size: .5em; }
}