#turns {
 width: 40px;
 background-color: silver; 
 border-radius: 25%;  
 border: gray 1px solid;
 text-align: center;
 position:absolute;    
 top: 4px;
 left: 85px;
 font-size: smaller;
}

#lockon {
 width: 49px;
 height: 23px;
 background: url('lock1.png') no-repeat center;
 background-size: cover;
 position: absolute; 
 top: 185px;
 left: 90px;
 cursor: grab;
}


#lockoff {
 width: 49px;
 height: 23px;
 background: url('lock2.png') no-repeat center;
 background-size: cover;
 position: absolute; 
 top: 185px;
 left: 90px;
 cursor: grab;
 display: none;
}

#alap {
 width: 213px;
 height: 213px;
 margin:auto;
 margin-top: 10px;
 margin-bottom: 5px;
 background: url('alap.png') no-repeat center;
 background-size: cover;
 border-radius: 50%;
 position: relative; 
 cursor: default;
 touch-action: none; /* Necessary for preventing mobile phone default action*/
 -webkit-user-select: none;  /* Safari */ 
 -khtml-user-select: none;
 -moz-user-select: none;
 -o-user-select: none;
 user-select: none;   /* Standard syntax */
 -ms-user-select: none; /* IE 10 and IE 11 */
}  


#knob {
  position: absolute; 
  top: 25px;  
  left: 28px;
  width: 160px;
  height: 160px;
  background: url('potmeter.png') no-repeat center;
  background-size: cover;
  border-radius: 50%;
  cursor: grab;
  transform: rotate(0deg);
}

#dial {
  font-size: 16px;
  width: 40px;
}