.loading-spinner{
margin:0 auto 0;
text-align:center;
white-space:nowrap;
}
.loading-spinner>div{
width:10px;
height:10px;
margin-right:10px;
background-color:var(--primary-green);
display:inline-block;
-webkit-animation:spinnerbouncedelay 1s infinite ease-in-out;
animation:spinnerbouncedelay 1s infinite ease-in-out;
-webkit-animation-fill-mode:both;
animation-fill-mode:both;
border-radius:50%;
}
.loading-spinner>div:nth-child(1){
-webkit-animation-delay:-0.48s;
animation-delay:-0.48s;
}
.loading-spinner>div:nth-child(2){
-webkit-animation-delay:-0.32s;
animation-delay:-0.32s;
}
.loading-spinner>div:nth-child(3){
-webkit-animation-delay:-0.16s;
animation-delay:-0.16s;
}
.loading-spinner>div:nth-child(4){
-webkit-animation-delay:0s;
animation-delay:0s;
}
.loading-spinner.white-dots>div{
background-color:#FFF;
border:none;
}
@-webkit-keyframes spinnerbouncedelay{
0%,
80%,
100%{
-webkit-transform:scale(0.5);
opacity:.5;
}
40%{
-webkit-transform:scale(1.0);
opacity:1;
}
}
@keyframes spinnerbouncedelay{
0%,
80%,
100%{
transform:scale(0.5);
-webkit-transform:scale(0.5);
opacity:.5;
}
40%{
transform:scale(1.0);
-webkit-transform:scale(1.0);
opacity:1;
}
}
.circular-loading-spinner{
display:grid;
place-items:center;
width:24px;
height:24px;
border-radius:50%;
animation:spin 2s infinite linear;
}
.circular-loading-spinner::before{
content:"";
border-radius:50%;
width:75%;
height:75%;
}
.circular-loading-spinner.green-on-white-bg{
background:conic-gradient(
from 180deg at 50% 50%,
#fff 0deg,
#5abeba 360deg
);
}
.circular-loading-spinner.green-on-white-bg::before{
content:"";
border-radius:50%;
width:80%;
height:80%;
background-color:#fff;
}
.circular-loading-spinner.white-on-green-bg{
background:conic-gradient(
from 180deg at 50% 50%,
#5abeba 0deg,
#fff 360deg
);
}
.circular-loading-spinner.white-on-green-bg::before{
background-color:#5abeba;
}
@keyframes spin{
to{
transform:rotate(1turn);
}
}
[name="boot_loader"]{
background-color:#344D66;
height:100vh;
width:100vw;
position:absolute;
display:flex;
justify-content:center;
align-items:center;
margin:0;
flex-direction:column;
}
@keyframes blink{
50%{
color:transparent
}
}
.loading-text-dot{
animation:1s blink infinite
}
.loading-text-dot:nth-child(2){
animation-delay:250ms
}
.loading-text-dot:nth-child(3){
animation-delay:500ms
}
.first_render>.pace>.pace-activity{
display:none;
}
.first_render>.pace{
-webkit-pointer-events:none;
pointer-events:none;
-webkit-user-select:none;
-moz-user-select:none;
user-select:none;
z-index:2000;
position:fixed;
margin:auto;
left:0;
right:0;
top:calc(50% + 25px);
height:8px;
width:140px;
background:#5D7185;
border:none;
border-radius:4px;
overflow:hidden;
top:calc(50% + 64px);
}
.first_render>.pace .pace-progress{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
box-sizing:border-box;
-webkit-transform:translate3d(0,0,0);
-moz-transform:translate3d(0,0,0);
-ms-transform:translate3d(0,0,0);
-o-transform:translate3d(0,0,0);
transform:translateY(0,0,0);
max-width:212px;
position:fixed;
z-index:2000;
display:block;
position:absolute;
top:0;
right:100%;
height:100%;
width:100%;
background:#5ABEBA;
}