body {
background-image: radial-gradient(50% 50% at 50% 50%, #041227 0%, #040E1D 100%);
background-color: #041022;
}
.loading-spinner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: linear-gradient(180deg, #111925 0%, #071120 100%);
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.4);
border-radius: 12px;
width: 329px;
height: 128px;
text-align: center;
display: flex;
justify-content: center;
align-items: center; }
.loading-spinner_nobg {
background: none;
position: static;
transform: none;
width: auto; }
.loading-spinner_title {
color: white;
font-size: 36px;
font-family: Arial, sans-serif;
margin-bottom: 15px;
text-transform: uppercase; }
.loading-spinner_indicator {
display: inline-block;
line-height: normal;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-size: 100%;
width: 24px;
height: 24px;
opacity: 1;
animation: loader 2.5s linear infinite;
margin-left: 15px; }
.loading-spinner_indicator-first {
margin-left: 0; }
.loading-spinner_indicator-second {
animation-delay: .5s; }
.loading-spinner_indicator-third {
animation-delay: 1s; }
.loading-spinner_indicator-fourth {
animation-delay: 1.5s; }
.loading-spinner_indicator-fifth {
animation-delay: 2s; }
@keyframes loader {
0% {
background-image: url('data:image/svg+xml;utf8,'); }
40%,60%,80%,100% {
background-image: url('data:image/svg+xml;utf8,'); } }