$loading-background-legacy: #7f7f7f !default;
$loading-background: rgba(255,255,255,0.5) !default;
$loading-icon-size: 3em !default;
$loading-full-page-icon-size: 5em !default;

.loading {
    @include overlay;
    align-items: center;
    justify-content: center;
    display: flex;
    overflow: hidden;
    z-index: 29;
    &.is-full-page {
        position: fixed;
        z-index: 999;
        .icon {
            width: $loading-full-page-icon-size;
            height: $loading-full-page-icon-size;
        }
    }
    .loading-overlay {
        @include overlay;
        background:$loading-background-legacy;
        background:$loading-background;
    }
    .icon {
        animation: spinAround 1s infinite linear;
        position: absolute;
        width: $loading-icon-size;
        height: $loading-icon-size;
    }
}