@font-face {
  font-family: 'Blanka';
  src: url('./fonts/blanka/Blanka.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

body {
  margin: 0px;
  overflow: hidden;
  background: hsl(0 0% 90%);
}

.paralelogram {
  --blur: 3rem;
  --box-blur: calc(0.5 * var(--blur));
  --in-blur: 1.5rem;
  --glow: var(--color);
  position: fixed;
  transform: rotate(32deg);
  background: hsl(0 0% 94%);
  border-radius: 16px;
  box-shadow: 
    /* --- glow --- */
    /* outside */  0 0 var(--box-blur) var(--glow),
    /* outside */  0 0 var(--in-blur) rgb(from var(--color) r g b / .5),
    /* inside */  inset 0 0 var(--in-blur) rgb(from var(--color) r g b / .55);
}

.text {
  font-family: "Blanka";
  font-size: 5em;
  letter-spacing: 0.2em;
  color: hsl(0 0% 85%);
  position: fixed;
  top: 50%;
  left: 50%;
  transform-origin: center;
  transform: translate(-50%, -110%);
  text-shadow: 2px 3px 7px rgba(0, 0, 0, 0.45);
}