.slds-spinner_container {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9050;
        background-color: hsla(0, 0%, 100%, .75);
        visibility: visible;
        opacity: 1;
        transition: opacity .2s ease, visibility 0;
        transition-delay: 0s, .3s;
        display: none
    }

    .slds-spinner {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 9051;
        transform: translate(-50%, -50%) rotate(90deg)
    }

    .slds-spinner,
    .slds-spinner__dot-a,
    .slds-spinner__dot-b {
        transform-origin: 50% 50%;
        will-change: transform
    }

    .slds-spinner__dot-a,
    .slds-spinner__dot-b {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%
    }

    .slds-spinner:after,
    .slds-spinner:before,
    .slds-spinner__dot-a:after,
    .slds-spinner__dot-a:before,
    .slds-spinner__dot-b:after,
    .slds-spinner__dot-b:before {
        content: "";
        position: absolute;
        background: #828282;
        border-radius: 50%;
        animation-duration: 1s;
        animation-iteration-count: infinite;
        transform: translateZ(0)
    }

    .slds-spinner__dot-a {
        transform: rotate(60deg)
    }

    .slds-spinner__dot-b {
        transform: rotate(120deg)
    }

    .slds-spinner:before {
        animation-delay: -.083s
    }

    .slds-spinner__dot-a:before {
        animation-delay: .083s
    }

    .slds-spinner__dot-b:before {
        animation-delay: .25s
    }

    x .slds-spinner:after {
        animation-delay: .41666667s
    }

    .slds-spinner__dot-a:after {
        animation-delay: .583s
    }

    .slds-spinner__dot-b:after {
        animation-delay: .75s
    }

    @keyframes dotsBounceBefore-medium {
        0% {
            transform: translateZ(0)
        }

        60% {
            transform: translateZ(0);
            animation-timing-function: cubic-bezier(.55, .085, .68, .53)
        }

        80% {
            transform: translate3d(-.5rem, 0, 0);
            animation-timing-function: cubic-bezier(0, 1.11, .7, 1.43)
        }

        to {
            transform: translateZ(0)
        }
    }

    @keyframes dotsBounceAfter-medium {
        0% {
            transform: translateZ(0)
        }

        60% {
            transform: translateZ(0);
            animation-timing-function: cubic-bezier(.55, .085, .68, .53)
        }

        80% {
            transform: translate3d(.5rem, 0, 0);
            animation-timing-function: cubic-bezier(0, 1.11, .7, 1.43)
        }

        to {
            transform: translateX(0)
        }
    }

    .slds-spinner–large,
    .slds-spinner_large {
        width: 2.75rem
    }

    .slds-spinner–large .slds-spinner__dot-a:after,
    .slds-spinner–large .slds-spinner__dot-a:before,
    .slds-spinner–large .slds-spinner__dot-b:after,
    .slds-spinner–large .slds-spinner__dot-b:before,
    .slds-spinner–large.slds-spinner:after,
    .slds-spinner–large.slds-spinner:before,
    .slds-spinner_large .slds-spinner__dot-a:after,
    .slds-spinner_large .slds-spinner__dot-a:before,
    .slds-spinner_large .slds-spinner__dot-b:after,
    .slds-spinner_large .slds-spinner__dot-b:before,
    .slds-spinner_large.slds-spinner:after,
    .slds-spinner_large.slds-spinner:before {
        width: .625rem;
        height: .625rem
    }

    .slds-spinner–large .slds-spinner__dot-a:before,
    .slds-spinner–large .slds-spinner__dot-b:before,
    .slds-spinner–large.slds-spinner:before,
    .slds-spinner_large .slds-spinner__dot-a:before,
    .slds-spinner_large .slds-spinner__dot-b:before,
    .slds-spinner_large.slds-spinner:before {
        animation-name: dotsBounceBefore-medium;
        top: -.3125rem;
        left: -.3125rem
    }

    .slds-spinner–large .slds-spinner__dot-a:after,
    .slds-spinner–large .slds-spinner__dot-b:after,
    .slds-spinner–large.slds-spinner:after,
    .slds-spinner_large .slds-spinner__dot-a:after,
    .slds-spinner_large .slds-spinner__dot-b:after,
    .slds-spinner_large.slds-spinner:after {
        animation-name: dotsBounceAfter-medium;
        top: -.3125rem;
        right: -.3125rem
    }

    @keyframes dotsBounceBefore-large {
        0% {
            transform: translateZ(0)
        }

        60% {
            transform: translateZ(0);
            animation-timing-function: cubic-bezier(.55, .085, .68, .53)
        }

        80% {
            transform: translate3d(-.75rem, 0, 0);
            animation-timing-function: cubic-bezier(0, 1.11, .7, 1.43)
        }

        to {
            transform: translateX(0)
        }
    }

    @keyframes dotsBounceAfter-large {
        0% {
            transform: translateZ(0)
        }

        60% {
            transform: translateZ(0);
            animation-timing-function: cubic-bezier(.55, .085, .68, .53)
        }

        80% {
            transform: translate3d(.75rem, 0, 0);
            animation-timing-function: cubic-bezier(0, 1.11, .7, 1.43)
        }

        to {
            transform: translateX(0)
        }
    }