Scale, Fade and Spin

Scale and fade in and spin thereafter.

HTML

Only needs to run in FF.
<div></div>

CSS

div {
    width: 100px;
    height: 100px;
    background: transparent;
    border: solid 10px blue;
    border-radius: 50%;
    border-top: solid 10px transparent;
    border-bottom: solid 10px transparent;
    -moz-animation-name:  transformAnim, transformIn, fadeIn;
    -moz-animation-duration: 1s, 1s, 1s;
    -moz-animation-timing-function: linear, ease-in, ease-in;
    -moz-animation-delay: 1s, 0, 0;
    -moz-animation-iteration-count: infinite, 1, 1;
    -moz-animation-direction: normal, normal, normal;
    -moz-animation-play-state: running, running, running;
}
@-moz-keyframes transformIn {
    from {
        -moz-transform: scale(2) rotate(0deg);
    }
    to {
        -moz-transform: scale(1) rotate(360deg);
    }
}
@-moz-keyframes transformAnim {
    from {
        -moz-transform: rotate(0deg);
    }
    to {
        -moz-transform:  rotate(360deg);
    }
}
@-moz-keyframes fadeIn {
    from {
        opacity: 0.0;
    }
    to {
        opacity: 1.0;
    }
}