/**
 Avoid modifying these styles if possible. It is easier to make the spinner align correctly through the container than modifying these global attributes
 */
#dashboardContent .dcls_spinner.safe-removeable {
    /* spinner is in the center of the screen. that feels too low. push it up */
    margin-bottom: 5em;
}

.dcls_ballSpinnerContainer{
    /* spinner needs a buffer because the expansion of the div bubbles/balls exceeds the container */
    padding: 1em;
    /* ensure spinner is above all other elements  */
    z-index: 2147483647;
}
.dcls_spinner{
    /* absolute positioning guarantees the spinner is on top of items */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    /* center the spinner vert/horiz */
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    vertical-align: middle;
    /* make sure the centering is relative to the container's maximum size */
    width: 100%;
    height: 100%;
    align-items: center;
}
.la-ball-spin{
    /* this enables absolute positioning */
   display:inline-block;
}
.la-ball-spin * {
    /* spinner styles get overridden by styles.css */
   border-radius: 100% !important;
}

.sk-circle:has(.rainbow_spinner) {
	height: 90px;
	width: 90px;
}

.rainbow_spinner{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    /* center the spinner vert/horiz */
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    vertical-align: middle;
    /* make sure the centering is relative to the container's maximum size */
    width: 100%;
    height: 100%;
    align-items: center;
}

.rainbow_spinner > img {
	height: 100%;
	width: 100%;
}