/************
 * launcher *
 ************/
.launch {
  position: absolute;
  left: calc(50% - var(--launch-size) / 2);
  top: 0px;
  --launch-size: 200px;
  --launch-total-w: 32.904;
  --launch-total-h: 27.23;
  width: var(--launch-size);
  height: var(--launch-size);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.launch > span {
  position: absolute;
  left: calc(var(--launch-x) * var(--launch-size) / var(--launch-total-w));
  top: calc(var(--launch-y) * var(--launch-size) / var(--launch-total-w));
  width: calc(var(--launch-w) * var(--launch-size) / var(--launch-total-w));
  height: calc(var(--launch-h) * var(--launch-size) / var(--launch-total-w));
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: var(--launch-i);
}
.launch > span.bottom {
  --launch-x: 10.455;
  --launch-y: 11.08;
  --launch-w: 17.414;
  --launch-h: 16.15;
  --launch-s: 0.5;
  --launch-i: url(/media/forms/launch-bottom.png);
}
.launch > span.left {
  --launch-x: 0;
  --launch-y: 6.561;
  --launch-w: 11.952;
  --launch-h: 11.084;
  --launch-s: -1;
  --launch-i: url(/media/forms/launch-left.png);
}
.launch > span.top {
  --launch-x: 10.116;
  --launch-y: 0;
  --launch-w: 7.364;
  --launch-h: 6.829;
  --launch-s: 2;
  --launch-i: url(/media/forms/launch-top.png);
}
.launch > span.right {
  --launch-x: 24.088;
  --launch-y: 5.083;
  --launch-w: 8.816;
  --launch-h: 8.176;
  --launch-s: -2;
  --launch-i: url(/media/forms/launch-right.png);
}
.launch > span {
  animation-name: launch-rotation;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 4s;
  --launch-animation-from: 0deg;
  --launch-animation-to: calc(var(--launch-s) * 360deg);
}
@keyframes launch-rotation {
  from {
    transform: rotate(var(--launch-animation-from)), -;
  }
  to {
    transform: rotate(var(--launch-animation-to));
  }
}