.background-loader{ 
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10000;
    background: rgba(34, 34, 34, 0.5);
    width: 100%;
    height: 100vh;
    align-items: center;
    display: flex;
  }
  
  .loader {
    margin: 100px auto;
    font-size: 13px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: load5 1.1s infinite ease;
    animation: load5 1.1s infinite ease;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
  }
  @-webkit-keyframes load5 {
    0%,
    100% {
      box-shadow: 0em -2.6em 0em 0em #555555, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #42424280, -1.8em -1.8em 0 0em #494949b3;
    }
    12.5% {
      box-shadow: 0em -2.6em 0em 0em #494949b3, 1.8em -1.8em 0 0em #555555, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #42424280;
    }
    25% {
      box-shadow: 0em -2.6em 0em 0em #42424280, 1.8em -1.8em 0 0em #494949b3, 2.5em 0em 0 0em #555555, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    37.5% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #42424280, 2.5em 0em 0 0em #494949b3, 1.75em 1.75em 0 0em #555555, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    50% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #42424280, 1.75em 1.75em 0 0em #494949b3, 0em 2.5em 0 0em #555555, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    62.5% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #42424280, 0em 2.5em 0 0em #494949b3, -1.8em 1.8em 0 0em #555555, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    75% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #42424280, -1.8em 1.8em 0 0em #494949b3, -2.6em 0em 0 0em #555555, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    87.5% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #42424280, -2.6em 0em 0 0em #494949b3, -1.8em -1.8em 0 0em #555555;
    }
  }
  @keyframes load5 {
    0%,
    100% {
      box-shadow: 0em -2.6em 0em 0em #555555, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #42424280, -1.8em -1.8em 0 0em #494949b3;
    }
    12.5% {
      box-shadow: 0em -2.6em 0em 0em #494949b3, 1.8em -1.8em 0 0em #555555, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #42424280;
    }
    25% {
      box-shadow: 0em -2.6em 0em 0em #42424280, 1.8em -1.8em 0 0em #494949b3, 2.5em 0em 0 0em #555555, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    37.5% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #42424280, 2.5em 0em 0 0em #494949b3, 1.75em 1.75em 0 0em #555555, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    50% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #42424280, 1.75em 1.75em 0 0em #494949b3, 0em 2.5em 0 0em #555555, -1.8em 1.8em 0 0em #bdbdbd33, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    62.5% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #42424280, 0em 2.5em 0 0em #494949b3, -1.8em 1.8em 0 0em #555555, -2.6em 0em 0 0em #bdbdbd33, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    75% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #42424280, -1.8em 1.8em 0 0em #494949b3, -2.6em 0em 0 0em #555555, -1.8em -1.8em 0 0em #bdbdbd33;
    }
    87.5% {
      box-shadow: 0em -2.6em 0em 0em #bdbdbd33, 1.8em -1.8em 0 0em #bdbdbd33, 2.5em 0em 0 0em #bdbdbd33, 1.75em 1.75em 0 0em #bdbdbd33, 0em 2.5em 0 0em #bdbdbd33, -1.8em 1.8em 0 0em #42424280, -2.6em 0em 0 0em #494949b3, -1.8em -1.8em 0 0em #555555;
    }
  }