button-3 {
  align-items: center;
  place-items: center;
  text-align: center;
  width: 10em;
  position: relative;
  height: 3.5em;

  border: 3px ridge var(--btn3-border, #149cea);
  outline: none;
  background-color: var(--btn3-fill, #151515);
  color: var(--btn3-font-color, white);
  transition: 1s;
  border-radius: 0.3em;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: var(--btn-3-margin, 0rem);
}

button-3::after {
  content: "";
  position: absolute;
  top: -10px;
  left: 3%;
  width: 95%;
  height: 40%;
  background-color: var(--btn3-fill, #151515);
  transition: 0.5s;
  transform-origin: center;
}

button-3::before {
  content: "";
  transform-origin: center;
  position: absolute;
  top: 80%;
  left: 3%;
  width: 95%;
  height: 40%;
  background-color: var(--btn3-fill, #151515);
  transition: 0.5s;
}

button-3:hover::before,
button-3:hover::after {
  transform: scale(0);
}

button-3:hover {
  box-shadow: inset 0px 0px 25px var(--btn3-color, #1479ea);
}