html {
  font-size: 3vw;
  font-family: "Open Sans", sans-serif;
}

body {
  width: 25vw;
  margin: auto;
  background-color: lightblue;
  text-align: center;
  display: flex;
}

.wrapper {
  width: 50vw;
  background: #fff;
  border-radius: 1vw;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 1vw 1vw 1vw 1vw rgba(31, 38, 135, 0.4);

}

.wrapper .header {
  font-weight: bold;
  font-size: 3vw;
  margin: auto;
  display: block;
}

.wrapper .button {
  padding: 12px 26px;
  border: 0;
  font-size: 16px;
  transition: all 150ms ease-in-out;

  border-radius: 8px;
  box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.07) 0 1px 1px, rgba(0, 0, 0, 0.07) 0 2px 2px, rgba(0, 0, 0, 0.07) 0 4px 4px;
  font-weight: 600;

  color: #fff;
  box-shadow: rgba(32, 27, 92, 0.8) 0px 0px 0px 1px, rgba(255, 255, 255, 0.7) 0 0 3px 0 inset, 0 1px 2px 0 rgba(0, 0, 0, .5);

  background-image: radial-gradient(53% 87% at 44% 90%, rgba(255, 255, 255, 0.36) 0%, transparent 100%), linear-gradient(80deg, #5044E5 0%, #463CCA 100%);
}

.wrapper .button-49:hover {
  filter: brightness(1.1)
}

.wrapper .button-49:active {
  transform: scale(.95);
}