/*loader css*/
.loading{
    width: 100px;
    height: 100px;
    margin: 0 auto;
    position: fixed;
    top: 40%;
    left: 50%;
    transform: translate(-60%, -50%);
    z-index: 999999999;
  }
  .loading::before,.loading::after{
    content: '';
    background-color: #000;
    position: absolute;
    border-radius: 50%;
    inset: 0;
  }
  .loading::before{
    --animation-delay:0ms;
  }
  .loading::after{
    background-color: red;
    transform: scale(0);
    inset: 5px;
    --animation-delay:500ms;
  }
  .loading::before,.loading::after{
    animation: scale 1s infinite;
    animation-delay: var(--animation-delay);
  }
  @keyframes scale{
    from{
      transform: scale(0);
      opacity: 1;
    }
    to{
      transform: scale(1);
      opacity: 0;
    }
  }