/**
 * EdGEL preloader spinner.
 *
 * Container should have .preloader class to hide all content while spinner is included.
 * Spinner markup is <div class="preloader-spinner"><div></div><div></div><div></div><div></div></div>
 * See preloader.js for example of how to show and hide the preloader.
 */

.preloader > :not(.preloader-spinner) {
  display: none;
}

.preloader-spinner {
  display: block;
  width: 50%;
  margin: 10% auto 0;
  text-align: center;
}

.preloader-spinner * {
  display: inline-block;
  width: 12%;
  padding-bottom: 12%;
  margin: 0 5%;
  background-color: #ccc;
  animation: preloader-bouncedelay 1.4s infinite ease-in-out both;
}

.preloader-spinner :nth-child(4n+1) {
  animation-delay: -.48s;
}

.preloader-spinner :nth-child(4n+2) {
  animation-delay: -.32s;
}

.preloader-spinner :nth-child(4n+3) {
  animation-delay: -.16s;
}

@keyframes preloader-bouncedelay {
  40% {
    transform: scale(1);
  }
  0%,
  80%,
  100% {
    transform: scale(0);
  }
}
