my first dabblet

dabblet.css

/**
 * my first dabblet
 */
body{
	background: #444;
	margin: 200px auto;
	width:1000px;
	}
#play-but{
	float:left;
	width:0;
	height:0;
	margin-top:1px;
	border-top: 9px solid transparent;
	border-left: 18px solid #FFF;
	border-bottom: 9px solid transparent;
}


#prog-bar{
	float:left;
	width: 600px;
	height: 20px;
	line-height: 20px;
	background: #3d3d3d;
	border-radius: 3px;
	border: 1px solid #f3f3f3;
	margin-left:10px;
	


	}
#track{
	width:18px;
	height: 18px;
	background: #ededed;
	display:block;
	margin-top:1px;
	
	
	
	}
 #prog-bar:target #track{
-webkit-animation: play 10s ;
}

	@-webkit-keyframes play{
		0%{margin-left:0}
		100%{margin-left:550px}

	}

dabblet.html

<a id="play-but" href="#prog-bar"></a>
<div id="prog-bar">
	<span id="track"></span>
</div>

settings.json

{"view":"split","seethrough":"","prefixfree":"1","page":"all"}