.resize-handle {
  position: absolute;
  z-index: 10;
}

.resize-top {
  top: 0;
  left: 12px;
  width: calc(100% - 24px);
  height: 8px;
  cursor: ns-resize;
}

.resize-bottom {
  left: 12px;
  bottom: 0;
  width: calc(100% - 24px);
  height: 8px;
  cursor: ns-resize;
}

.resize-left {
  left: 0;
  top: 12px;
  width: 8px;
  height: calc(100% - 24px);
  cursor: ew-resize;
}

.resize-right {
  right: 0;
  top: 12px;
  width: 8px;
  height: calc(100% - 24px);
  cursor: ew-resize;
}

.resize-corner-tl {
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
}

.resize-corner-tr {
  top: 0;
  right: 0;
  width: 16px;
  height: 16px;
  cursor: nesw-resize;
}

.resize-corner-bl {
  bottom: 0;
  left: 0;
  width: 16px;
  height: 16px;
  cursor: nesw-resize;
}

.resize-corner-br {
  right: 0;
  bottom: 0;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
}