.ml-container{position:relative;width:60%;max-width:500px;height:20px;background:radial-gradient(circle,#1b2735,#090a0f);border-radius:30px;overflow:hidden;box-shadow:0 8px 20px rgba(0,0,0,.5);box-sizing:border-box;border:1px solid #313131}.ml-bar{position:absolute;top:0;left:0;height:100%;width:0;background:linear-gradient(90deg,#00f260,#0575e6);border-radius:30px;box-shadow:0 0 15px #00f260,0 0 30px #0575e6}.ml-bar,.ml-bar--determinate{transition:width .25s ease-out}.ml-bar--determinate{animation:none}.ml-bar:before{content:"";width:200%;height:200%;background:radial-gradient(circle,hsla(0,0%,100%,.15),transparent);opacity:.5;animation:ml-ripple 3s infinite}.ml-bar:before,.ml-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ml-text{font-size:10px;font-weight:700;letter-spacing:1px;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.7);z-index:2}.ml-particles{position:absolute;width:100%;height:100%;overflow:hidden}.ml-particle{position:absolute;width:4px;height:4px;background:#fff;border-radius:50%;opacity:.6;animation:ml-float 5s ease-in-out infinite}.ml-particle:first-child{top:10%;left:20%;animation-delay:0s}.ml-particle:nth-child(2){top:30%;left:70%;animation-delay:1s}.ml-particle:nth-child(3){top:50%;left:50%;animation-delay:2s}.ml-particle:nth-child(4){top:80%;left:40%;animation-delay:1.5s}.ml-particle:nth-child(5){top:90%;left:60%;animation-delay:2.5s}@keyframes ml-grow{0%{width:0}to{width:40%}}@keyframes ml-ripple{0%{transform:translate(-50%,-50%) scale(.5);opacity:.7}to{transform:translate(-50%,-50%) scale(1.5);opacity:0}}@keyframes ml-float{0%{transform:translateY(0) translateX(0)}50%{transform:translateY(-20px) translateX(10px)}to{transform:translateY(0) translateX(0)}}