body, html { 
	background:#808080; 
}

#image {
	position:absolute;
}

#ctrlback { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; }
.ctrlitem { padding:2px 0px; width:100%; }
.ctrlitem span:nth-child(1) { margin-right:15px; }
.ctrlitem span:nth-child(2) { margin-right:15px; }
.ctrlitem span:nth-child(3) { margin-right:15px; }
.ctrlitem span:nth-child(4) label { margin-right:6px; }
.ctrlitem span:nth-child(5) { float:right; }
select, select.btn { width:120px; }

input[type='range'] {
	width:100px;
	vertical-align:2px;
	margin-left:2px;
}

.btn {
	width:72px;
}

select {
	height:26px;
}

.surround {
	width:150px;
	height:150px;
	border-width:50px;
	border-radius:50%;
	position:absolute;
	text-align:center;
	color:red;
	font-family:sans-serif;
	font-size:16px;
}

.surround div {
	width:50px;
	height:50px;
	border:none;
	border-radius:50%;
	position:relative;
	text-align:center;
}

.surround.on {
	border:50px solid rgba(127,127,255,0.4);
}
.surround.on div {
	background:rgba(255,255,127,0.4);
}
.surround.off {
	border:50px solid rgba(255,255,127,0.4);
}
.surround.off div {
	background:rgba(127,127,255,0.4);
}

.surround:hover:active {
	cursor:none; /* doesn't seem to work in Safari; it works UNTIL the mouse moves (tested with zoom-in) */
}