:root {
  --main-color: #f1f3f6;
  --shadow-color: rgba(55, 84, 170, 0.15);
}
body {
  background: var(--main-color);
}

.btn {
  width: 5rem;
  height: 5rem;
  background: var(--main-color);
  border-radius: 20%;
  box-shadow:
    inset 0 0 15px rgba(55, 84, 170, 0),
    inset 0 0 20px rgba(255, 255, 255, 0),
    10px 10px 18px var(--shadow-color),
    -10px -10px 22px #fff,
    inset 0px 0px 4px rgba(255, 255, 255, 0.2);
  transition:
    box-shadow 0.28s cubic-bezier(0.2, 0.65, 0.25, 1),
    transform 0.28s cubic-bezier(0.2, 0.65, 0.25, 1);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  cursor: pointer;
  margin: auto;
}

.btn:active {
  box-shadow:
    inset 7px 7px 15px var(--shadow-color),
    inset -6px -6px 16px rgba(255, 255, 255, 0.78),
    0px 0px 4px rgba(255, 255, 255, 0.2),
    5px 5px 22px #fff;
  transform: scale(0.9);
}
