.ui-knob {
  position: relative;
  display:  inline-block;
  overflow: visible;
  width:  70px;
  height: 70px;
  padding: 0px;

  border:1px solid #ddd;
  border-radius:50px;

  /* center the div */
  top:50%;
  left:50%;

  border-width: 0;
  background: none;
  font-weight: bold;
  text-shadow: 0 1px 1px #f6f6f6;
  color: #444;
}

.ui-knob-indicator {
  position: absolute;
  display: block;
  z-index: 10;
  margin: 0;
  padding: 0px;
  border-radius:50px;
  /* Due to a display bug with anti-aliasing */

  border: 1px solid black;
  background: black;
  cursor: pointer;
  font-weight: bold;
  color: #111111;
  text-shadow: 0 1px 1px  black;
}

.rotate-knob.ui-knob {
  background: #333;
  background-image: -webkit-gradient(linear,left top,left bottom, color-stop(0, #333), color-stop(1, #222));
  background-image: -moz-linear-gradient(top, #333, #222);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#333', EndColorStr='#222')";
}

.position-rotate-knob.ui-knob {
  background: #333;
  background-image: -webkit-gradient(linear,left top,left bottom, color-stop(0, #333), color-stop(1, #222));
  background-image: -moz-linear-gradient(top, #333, #222);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#333', EndColorStr='#222')";
}



.position-rotate-css-knob .ui-knob-indicator {
  margin-top: 5px;
  margin-left: 5px;
  width: 10px;
  height: 10px;
}