.msz-loading { display: flex; justify-content: center; flex-direction: column; min-width: var(--msz-loading-container-width, calc(var(--msz-loading-size, 1) * 100px)); min-height: var(--msz-loading-container-height, calc(var(--msz-loading-size, 1) * 100px)); } .msz-loading-inline { display: inline-flex; min-width: 0; min-height: 0; } .msz-loading-frame { display: flex; justify-content: center; flex: 0 0 auto; } .msz-loading-icon { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); gap: var(--msz-loading-gap, calc(var(--msz-loading-size, 1) * 1px)); margin: var(--msz-loading-margin, calc(var(--msz-loading-size, 1) * 10px)); } .msz-loading-icon-block { background: var(--msz-loading-colour, currentColor); width: var(--msz-loading-width, calc(var(--msz-loading-size, 1) * 10px)); height: var(--msz-loading-height, calc(var(--msz-loading-size, 1) * 10px)); } .msz-loading-icon-block-hidden { opacity: 0; }