.ba-splash { position: absolute; height: 100%; width: 100%; background-color: white; } .ba-splash .ba-splash-loading { position: absolute; top: calc(50% - 33px); left: calc(50% - 33px); } @keyframes ba-common-progressIndicator_dash { 0%, 100% { stroke-dashoffset: 9.7px; } 60% { stroke-dashoffset: 113.52px; } } @keyframes ba-common-progressIndicator_rotate { 0% { transform: rotate(300deg); } 60% { transform: rotate(1320deg); } 100% { transform: rotate(2100deg); } } .ba-common-progressIndicator.is-circle { vertical-align: middle; display: inline-block; } .ba-common-progressIndicator.is-circle circle { fill: transparent; } .ba-common-progressIndicator.is-circle.is-large { width: 60px; height: 60px; } .ba-common-progressIndicator.is-circle svg circle { stroke-width: 6px; stroke-dasharray: 125px; } .ba-common-progressIndicator.is-circle svg { width: 100%; height: 100%; transform-origin: center center; transform: translateZ(0) rotate(300deg); animation: ba-common-progressIndicator_rotate 4s ease-out infinite; } .ba-common-progressIndicator.is-circle circle { stroke-dashoffset: 9.7px; animation: ba-common-progressIndicator_dash 4s ease-out infinite; } .ba-common-progressIndicator.is-circle circle { stroke: #1f57a4; } .ba-common-progressIndicator.is-circle circle.is-background { stroke: rgba(0, 0, 0, 0.1); } @media screen and (-ms-high-contrast: active) { .ba-common-progressIndicator.is-circle circle { stroke: #cddef5; } }