.ui360,
.sm2-360ui {
	/* Size of circle and container. Replace instances of this value in this file with new size. */
	width:50px;
	height:50px;
}
.ui360,
.ui360 * {
	position:relative;
	vertical-align:middle;
}
.ui360 {
	width:auto;
	margin:-5px 0 0 -10px;
	/* margin-bottom:-18px; approximate "line height" we want */
	/* margin-left:62px; 50px, with a few off */
}
.ui360 a {
	line-height:5px;
}
.sm2-360ui {
	position:relative;
	display:inline-block; /* firefox 3 et al */
	/* margin-left:-90px; */
	float:left; /* firefox 2 needs this, inline-block would work with fx3 and others */
	*float:left; /* IE 6+7 */
	*display:inline;
	*clear:left;
	background:url('../img/audio-360-sm.png') no-repeat 5px 5px;
}
.sm2-360ui.sm2_playing,
.sm2-360ui.sm2_paused {
	z-index:10;	/* bump on top when active */
	background:none;
}
.ui360 .sm2-canvas {
	position:absolute;
	left:0px;
	top:0px;
}
.ui360 .sm2-timing {
	position:absolute;
	display:block;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	margin:0px;
	font:11px "helvetica neue",helvetica,monaco,lucida,terminal,monospace;
	color:#666;
	text-align:center;
	line-height:90px;
}
.ui360 .sm2-timing.alignTweak {
	text-indent:1px; /* devious center-alignment tweak for Safari (might break things for others.) */
}
.ui360 .sm2-cover {
	position:absolute;
	left:0px;
	top:0px;
	z-index:2;
	display:none;
}
.ui360 .sm2-360btn {
	position:absolute;
	top:50%;
	left:50%;
	width:22px;
	height:22px;
	margin-left:-11px;
	margin-top:-11px;
	cursor:pointer;
	z-index:3;
}
.ui360 .sm2-360btn-default {}
.ui360 .sm2-360data {
	display:inline-block;
	font-family:"helvetica neue",helvetica,sans-serif;
}
.ui360 .sm2-360ui.sm2_playing .sm2-cover,
.ui360 .sm2-360ui.sm2_paused .sm2-cover {
	display:block;
}
.ui360 .sm2-360btn {
	background:url('../img/audio-controls-sm.png') no-repeat 0 0; /* sprites */
	cursor:pointer;
}

.ui360 .sm2-360btn-default {
  background-position:-100px 100px;
}

.ui360 .sm2-360btn-default,
.ui360 .sm2-360ui.sm2_paused .sm2-360btn {}
.ui360 .sm2-360ui.sm2_playing .sm2-360btn {
	background-position:-22px 0;
}
.ui360 .sm2-360btn-default:hover,
.ui360 .sm2-360ui.sm2_paused .sm2-360btn:hover {
	background-position:0 -22px;
}
.ui360 .sm2-360ui.sm2_playing .sm2-360btn:hover,
.ui360 .sm2-360btn-playing:hover {
	background-position:-22px -22px;
}
.ui360 .sm2-360ui.sm2_playing .sm2-timing {
	visibility:hidden;
}
.ui360 .sm2-360ui.sm2_buffering .sm2-timing {
	visibility:hidden;
}
.ui360 .sm2-360ui .sm2-timing,
.ui360 .sm2-360ui .sm2-360btn:hover + .sm2-timing,
.ui360 .sm2-360ui.sm2_paused .sm2-timing {
	visibility:hidden;
}
.ui360 .sm2-360ui.sm2_dragging .sm2-timing,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover + .sm2-timing {
	/* paused + dragging */
	visibility:hidden;
}
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover,
.ui360 .sm2-360ui.sm2_dragging .sm2-360btn-playing:hover {
	/* don't let pause button show on hover when dragging (or paused and dragging) */
	/* background-image:none; */
}
.ui360 .sm2-360ui.sm2_buffering .sm2-360btn,
.ui360 .sm2-360ui.sm2_buffering .sm2-360btn:hover {
	 background:url('../img/icon-loading-spinner-lg.gif') no-repeat 50% 50%;
	 opacity:0.5;
	 visibility:visible;
}