/* Site.css — site-wide custom styles, served via the ~/Content/css bundle
   (Bundle.config) which every master page references. */

/* Pulsing rings loading indicator (replaces the Loading_Gears.gif cog):
   orange rgb(255,130,0) + btn-success teal #22bdc9, half a cycle apart.
   Markup: <span class="LoadingCircle"><span></span><span></span></span> */
.LoadingCircle {
    width: 50px;
    height: 50px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
}
.LoadingCircle > * {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 4px solid rgb(255,130,0);
    border-radius: 50%;
    opacity: 0; /* invisible until its (possibly delayed) animation starts */
    animation: loadingCirclePulse 1.2s ease-out infinite;
}
.LoadingCircle > * + * {
    border-color: #22bdc9;
    animation-delay: 0.6s;
}
@keyframes loadingCirclePulse {
    0%   { transform: scale(0.6);  opacity: 1; }
    100% { transform: scale(1.15); opacity: 0; }
}
/* The div_PageLoader overlay (PageLoader.js / CashManager.Master) runs the
   same rings larger */
#div_PageLoaderSpinner {
    width: 64px;
    height: 64px;
    margin-bottom: 12px;
}