ul.ldn{position: fixed;top:50%;left: 50%;transform: translate(-50%,-50%);margin: 0px;padding: 0px;display: flex; z-index:2;}
ul.ldn li.chargin{list-style: none;width: 50px;height: 50px;border-radius: 50%;background-color: #fff;animation: animate 1.6s ease-in-out infinite;margin: 0px;padding: 0;}
@keyframes animate{
  0%, 40%, 100%
  {
    transform: scale(0.2);
  }
  20%
  {
    transform: scale(1);
  }
}
ul.ldn li.chargin:nth-child(1){animation-delay:-1.4s;background-color: #e4bc29;/* box-shadow: 0 0 50px #ffff00;  */}
ul.ldn li.chargin:nth-child(2){animation-delay:-1.2s;background-color: #deb82d;/* box-shadow: 0 0 50px #76ff30;  */}
ul.ldn li.chargin:nth-child(3){animation-delay:-1s;background-color: #ceab2a;/* box-shadow: 0 0 50px #f06292;  */}
ul.ldn li.chargin:nth-child(4){animation-delay:-0.8s;background-color: #bf9f27;/* box-shadow: 0 0 50px #4fc3f7;  */}
.backg{background-color: rgba(0,0,0,.1);position: fixed;top: 0;height: 100vh;width: 100%;z-index: 2;left:0}