Animated png - by eCSSpert.com

dabblet.css

/**
 * Animated png - by eCSSpert.com
 */
@keyframes loading-spinner { 
0%, 8.32% { background-position: -0px -0px; }
8.33%, 16.65% { background-position: -15px -0px; }
16.66%, 24.99% { background-position: -30px -0px; }
25%, 33.32% { background-position: -45px -0px; }
33.33%, 41.65% { background-position: -60px -0px; }
41.66%, 49.99% { background-position: -75px -0px; }
50%, 58.32% { background-position: -90px -0px; }
58.33%, 66.65% { background-position: -105px -0px; }
66.66%, 74.99% { background-position: -120px -0px; }
75%, 83.32% { background-position: -135px -0px; }
83.33%, 91.65% { background-position: -150px -0px; }
91.66%, 99.99% { background-position: -165px -0px; }
}
.loading-spinner {
	background: url(http://cl.ly/0Q23162u212j080e2r39/tab-save-spinner-active.png) no-repeat;
	height: 14px;
	width: 14px;
	animation: loading-spinner 1.2s linear 0s infinite normal;
	position: absolute;
	left: 50%;
	top: 50%;
}

@-webkit-keyframes loading-dots { 0%, 19.99%, 100% { background-position: 0 0 } 20%, 39.99% { background-position: -30px 0 } 40%, 59.99% { background-position: -60px 0 } 60%,79.99% { background-position: -90px 0 } 80%, 99.99% { background-position: -120px 0 } }
@-firefox-keyframes loading-dots { 0%, 19.99%, 100% { background-position: 0 0 } 20%, 39.99% { background-position: -30px 0 } 40%, 59.99% { background-position: -60px 0 } 60%,79.99% { background-position: -90px 0 } 80%, 99.99% { background-position: -120px 0 } }
@-ms-keyframes loading-dots { 0%, 19.99%, 100% { background-position: 0 0 } 20%, 39.99% { background-position: -30px 0 } 40%, 59.99% { background-position: -60px 0 } 60%,79.99% { background-position: -90px 0 } 80%, 99.99% { background-position: -120px 0 } }
.loading-dots {
	background: url(http://dl.dropbox.com/u/3269118/loading.png) no-repeat;
	height: 27px;
	width: 28px;
	animation: loading-dots .7s linear 0s infinite normal;
	position: absolute;
	left: 50%;
	top: 36px;
}
.x {
	width: 500px;
	height: 100px;
	background: blue;
	position: relative;
}

dabblet.html

<div class="x">
	<div class="loading-spinner"></div>
</div>

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}