#unsupported-banner {
  height: 100%;
  width: 100%;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  background: rgb(27, 31, 35);
  color: rgb(224, 225, 227);

  font-family: Lato, sans-serif;
  font-size: 18px;
  text-align: center;
  line-height: 24px;
}

.unsupported #unsupported-banner {
  display: block;
  display: -ms-flexbox;
  display: flex;
}

.unsupported #root {
  display: none;
}

#unsupported-banner p {
  max-width: 376px;
  margin: 0 auto;
}

#unsupported-banner a {
  color: rgb(111, 165, 165);
  text-decoration: none;
}

#unsupported-banner p + p {
  margin-top: 20px;
}

.unsupported__art {
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
  margin-bottom: 40px;
}

.ie--no-svg .unsupported__art {
  display: none;
}

.unsupported__stands {
}

.unsupported__stand--moving {
  transform-origin: bottom right;
  animation: stand-bouncing 3s infinite ease-in;
}

@keyframes stand-bouncing {
  0% {
    transform: translate(-8px) rotate(45deg);
  }
  30% {
    transform: translate(-8px) rotate(30deg);
  }
  38% {
    transform: translate(-8px) rotate(33deg);
  }
  50% {
    transform: translate(-8px) rotate(30deg);
  }
  55% {
    transform: translate(-8px) rotate(31deg);
  }
  64% {
    transform: translate(-8px) rotate(30deg);
  }
  80% {
    transform: translate(-8px) rotate(30deg);
  }
  100% {
    transform: translate(-8px) rotate(45deg);
  }
}
