.loader{z-index:90;width:100vw;height:100vh;clip-path:circle(0% at var(--x,50%)var(--y,50%));opacity:1;background-color:#6d3783;position:absolute;top:0;left:0}.transition{animation-name:transition-anim;animation-duration:.8s;animation-fill-mode:forwards}@keyframes transition-anim{0%{clip-path:circle(0% at var(--x,50%)var(--y,50%));opacity:1}to{clip-path:circle(150% at var(--x,50%)var(--y,50%));opacity:1}}.loader-bar{background-color:#0003;border-radius:30px;width:8rem;height:.25rem;position:relative}.loader-bar:before{content:"";background:#fff;border-radius:30px;width:0%;height:100%;animation:1s ease-in-out infinite moving;position:absolute;top:0;left:0}@keyframes moving{50%{width:100%}to{width:0;right:0;left:unset}}