.h5p-dragnbar-element.focused > .h5p-dragnresize-handle {
  position: absolute;
  top: -4px;
  left: -4px;
  width: 7px;
  height: 7px;
  cursor: nwse-resize;
  border: 1px solid #0099ff;
  background-color: #fff;
  z-index: 1;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.ne {
  left: auto;
  right: -4px;
  cursor: nesw-resize;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.sw {
  top: auto;
  bottom: -4px;
  cursor: nesw-resize;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.se {
  top: auto;
  left: auto;
  bottom: -4px;
  right: -4px;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.n {
  left: calc(50% - 3px);
  cursor: ns-resize;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.w {
  top: calc(50% - 3px);
  cursor: ew-resize;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.e {
  top: calc(50% - 3px);
  left: auto;
  right: -4px;
  cursor: ew-resize;
}

.h5p-dragnbar-element.focused > .h5p-dragnresize-handle.s {
  top: auto;
  left: auto;
  bottom: -4px;
  right: calc(50% - 3px);
  cursor: ns-resize;
}
