.cropme-wrapper
  width: 100%
  height: 100%
.cropme-container
  position: relative
  overflow: hidden
  margin: 0 auto
  img 
    width: initial !important
    cursor: move
    opacity: 0
    touch-action: none
#img 
  border: 5px solid #f00

.viewport 
  box-sizing: content-box !important
  position: absolute
  border-style: solid
  margin: auto
  top: 0
  bottom: 0
  right: 0
  left: 0
  box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, 0.5)
  z-index: 0
  pointer-events: none
  &.circle 
    border-radius: 50%

.cropme-slider,.cropme-rotation-slider
  text-align: center
  input
    -webkit-appearance: none
    &:disabled
      opacity: 0.5
    &::-webkit-slider-runnable-track
      height: 3px
      background: rgba(0, 0, 0, 0.5)
      border-radius: 3px
    &::-webkit-slider-thumb
      -webkit-appearance: none
      height: 16px
      width: 16px
      border-radius: 50%
      background: #ddd
      margin-top: -6px
    &:focus
      outline: none