@keyframes installing {
    0% {background: repeating-linear-gradient(red, red 10px, cyan 10px, cyan 30px, red 30px, red 40px);}
    5% {background: repeating-linear-gradient(red, red 8px, cyan 8px, cyan 28px, red 28px, red 40px);}
    10% {background: repeating-linear-gradient(red, red 6px, cyan 6px, cyan 26px, red 26px, red 40px);}
    15% {background: repeating-linear-gradient(red, red 4px, cyan 4px, cyan 24px, red 24px, red 40px);}
    20% {background: repeating-linear-gradient(red, red 2px, cyan 2px, cyan 22px, red 22px, red 40px);}
    25% {background: repeating-linear-gradient(cyan, cyan 20px, red 20px, red 40px);}
    30% {background: repeating-linear-gradient(cyan, cyan 18px, red 18px, red 38px, cyan 38px, cyan 40px);}
    35% {background: repeating-linear-gradient(cyan, cyan 16px, red 16px, red 36px, cyan 36px, cyan 40px);}
    40% {background: repeating-linear-gradient(cyan, cyan 14px, red 14px, red 34px, cyan 34px, cyan 40px);}
    45% {background: repeating-linear-gradient(cyan, cyan 12px, red 12px, red 32px, cyan 32px, cyan 40px);}
    50% {background: repeating-linear-gradient(cyan, cyan 10px, red 10px, red 30px, cyan 30px, cyan 40px);}
    55% {background: repeating-linear-gradient(cyan, cyan 8px, red 8px, red 28px, cyan 28px, cyan 40px);}
    60% {background: repeating-linear-gradient(cyan, cyan 6px, red 6px, red 26px, cyan 26px, cyan 40px);}
    65% {background: repeating-linear-gradient(cyan, cyan 4px, red 4px, red 24px, cyan 24px, cyan 40px);}
    70% {background: repeating-linear-gradient(cyan, cyan 2px, red 2px, red 22px, cyan 22px, cyan 40px);}
    75% {background: repeating-linear-gradient(red, red 20px, cyan 20px, cyan 40px);}
    80% {background: repeating-linear-gradient(red, red 18px, cyan 18px, cyan 38px, red 38px, red 40px);}
    85% {background: repeating-linear-gradient(red, red 16px, cyan 16px, cyan 36px, red 36px, red 40px);}
    90% {background: repeating-linear-gradient(red, red 14px, cyan 14px, cyan 34px, red 34px, red 40px);}
    100% {background: repeating-linear-gradient(red, red 12px, cyan 12px, cyan 32px, red 32px, red 40px);}
}

@keyframes loading {
    0% {background: repeating-linear-gradient(blue, blue 5px, yellow 5px, yellow 15px, blue 15px, blue 20px);}
    5% {background: repeating-linear-gradient(blue, blue 4px, yellow 4px, yellow 14px, blue 14px, blue 20px);}
    10% {background: repeating-linear-gradient(blue, blue 5px, yellow 5px, yellow 13px, blue 13px, blue 20px);}
    15% {background: repeating-linear-gradient(blue, blue 4px, yellow 4px, yellow 12px, blue 12px, blue 20px);}
    20% {background: repeating-linear-gradient(blue, blue 1px, yellow 1px, yellow 11px, blue 11px, blue 20px);}
    25% {background: repeating-linear-gradient(yellow, yellow 10px, blue 10px, blue 20px);}
    90% {background: repeating-linear-gradient(yellow, yellow 14px, blue 14px, blue 19px, yellow 19px, yellow 20px);}
    95% {background: repeating-linear-gradient(yellow, yellow 8px, blue 8px, blue 18px, yellow 18px, yellow 20px);}
    100% {background: repeating-linear-gradient(yellow, yellow 7px, blue 7px, blue 17px, yellow 17px, yellow 20px);}
    45% {background: repeating-linear-gradient(yellow, yellow 6px, blue 6px, blue 16px, yellow 16px, yellow 20px);}
    50% {background: repeating-linear-gradient(yellow, yellow 5px, blue 5px, blue 15px, yellow 15px, yellow 20px);}
    55% {background: repeating-linear-gradient(yellow, yellow 4px, blue 4px, blue 14px, yellow 14px, yellow 20px);}
    60% {background: repeating-linear-gradient(yellow, yellow 3px, blue 3px, blue 13px, yellow 13px, yellow 20px);}
    65% {background: repeating-linear-gradient(yellow, yellow 4px, blue 4px, blue 12px, yellow 12px, yellow 20px);}
    70% {background: repeating-linear-gradient(yellow, yellow 1px, blue 1px, blue 11px, yellow 11px, yellow 20px);}
    75% {background: repeating-linear-gradient(blue, blue 10px, yellow 10px, yellow 20px);}
    80% {background: repeating-linear-gradient(blue, blue 14px, yellow 14px, yellow 19px, blue 19px, blue 20px);}
    30% {background: repeating-linear-gradient(blue, blue 8px, yellow 8px, yellow 18px, blue 18px, blue 20px);}
    35% {background: repeating-linear-gradient(blue, blue 7px, yellow 7px, yellow 17px, blue 17px, blue 20px);}
    40% {background: repeating-linear-gradient(blue, blue 6px, yellow 6px, yellow 16px, blue 16px, blue 20px);}
}


.installing {
  position: absolute;
  top:0;
  left:0;
  z-index: 10000;
  width: 100%;
  height:100%;
  animation-name: installing;
  animation-duration: 0.25s;
  animation-iteration-count: 1;
}

.loading {
  position: absolute;
  top:0;
  left:0;
  z-index: 10000;
  width: 100%;
  height:100%;
  animation-name: loading;
  animation-duration: 0.25s;
  animation-iteration-count: 1;
}
