body{margin:0}#loading-bg{width:100%;height:100%;background:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;position:fixed}.loading{position:relative;width:55px;height:55px;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;border:3px solid transparent}.loading .effect-1,.loading .effect-2{position:absolute;width:100%;height:100%;border:3px solid transparent;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box}[dir=ltr] .loading .effect-1,[dir=ltr] .loading .effect-2{border-left:3px solid #1472fe}[dir=rtl] .loading .effect-1,[dir=rtl] .loading .effect-2{border-right:3px solid #1472fe}.loading .effect-1{animation:rotate 1s ease infinite}.loading .effect-2{animation:rotateOpacity 1s ease infinite .1s}.loading .effect-3{position:absolute;width:100%;height:100%;border:3px solid transparent;-webkit-animation:rotateOpacity 1s ease infinite .2s;animation:rotateOpacity 1s ease infinite .2s;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box}[dir=ltr] .loading .effect-3{border-left:3px solid #1472fe}[dir=rtl] .loading .effect-3{border-right:3px solid #1472fe}.loading .effects{transition:all .3s ease}@keyframes rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotateOpacity{0%{-webkit-transform:rotate(0deg);transform:rotate(0);opacity:.1}to{-webkit-transform:rotate(1turn);transform:rotate(1turn);opacity:1}}
