#animation { float: left; margin-right: 10px; }

#notes {font-size: 80%;}

#area {
	background: #ccc;
	height: 20px;
	width: 500px;
}
 
#knob {
	height: 20px;
	width: 20px;
	background: #000;
}


#area2 {
	background: #ccc;
	height: 10px;
	width: 250px;
}
 
#knob2 {
	height: 10px;
	width: 10px;
	background: #000;
}
 

#progress {
        background-color: black;
        position: fixed;
	width: 200px;
	height: 15px;
	padding: 2px;
	border: 2px solid #dfdfdf;
}
 
#progress .bar {
	width: 0px;
	text-align: center;
	font-size: 10px;
	height: 15px;
	background: #2a2a2f;
	color: #fff;
	font-weight: bold;
}

#control {
display:inline;
}

#gotoStart {
background: #000000 url(Icons/gotoStart.png) no-repeat ; width: 29px; height: 21px;}

#stepBack {
margin-left: 29px;
margin-top: -21px;
background: #000000 url(Icons/stepBack.png) no-repeat ; width: 30px; height: 21px;}

#play {margin-left: 59px;
margin-top: -21px;
background: #000000 url(Icons/play.png) no-repeat ; width: 29px; height: 21px;}
#stop {margin-left: 59px;
margin-top: -21px;
background: #000000 url(Icons/stop.png) no-repeat ; width: 29px; height: 21px;
visibility: hidden;
}
#stepForward {margin-left: 88px;
margin-top: -21px;
background: #000000 url(Icons/stepForward.png) no-repeat ; width: 29px; height: 21px;}
#gotoEnd {margin-left: 117px;
margin-top: -21px;
background: #000000 url(Icons/gotoEnd.png) no-repeat ; width: 30px; height: 21px;}