button {
  position: relative;
  height: 50px;
  padding: 0 30px;
  border: 2px solid red;
  background: #e8e8e8;
  user-select: none;
  white-space: nowrap;
  transition: all .05s linear;
  color: red;
  font-family: inherit;
}

button:before, button:after {
  content: "";
  position: absolute;
  background: #e8e8e8;
  transition: all .2s linear;
}

button:before {
  width: calc(100% + 6px);
  height: calc(100% - 16px);
  top: 8px;
  left: -3px;
}

button:after {
  width: calc(100% - 16px);
  height: calc(100% + 6px);
  top: -3px;
  left: 8px;
}

button:hover {
  cursor: crosshair;
}

button:active {
  transform: scale(0.95);
}

button:hover:before {
  height: calc(100% - 32px);
  top: 16px;
}

button:hover:after {
  width: calc(100% - 32px);
  left: 16px;
}

button span {
  font-size: 15px;
  z-index: 3;
  position: relative;
  font-weight: 600;
}