  /* Overlay that covers whole viewport */
  .loading {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: black; /* semi-transparent black */
    z-index: 10000;
    display: none; /* hidden initially */
    
    /* flex center spinner */
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* Spinner container */
  .spinner {
    width: 50px;
    height: 40px;
    font-size: 10px;
    text-align: center;
  }

  /* Each animated bar */
  .spinner > div {
    background-color: #00ff00; /* Bright green */
    height: 100%;
    width: 6px;
    display: inline-block;
    margin: 0 2px;

    animation: sk-stretchdelay 1.2s infinite ease-in-out;
  }

  .spinner .rect2 { animation-delay: -1.1s; }
  .spinner .rect3 { animation-delay: -1.0s; }
  .spinner .rect4 { animation-delay: -0.9s; }
  .spinner .rect5 { animation-delay: -0.8s; }

  @keyframes sk-stretchdelay {
    0%, 40%, 100% { transform: scaleY(0.4); }
    20% { transform: scaleY(1.0); }
  }
  
  
