/// /// Multiverse by HTML5 UP /// html5up.net | @ajlkn /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) ///

/* Wrapper */

#wrapper {
        @include vendor('transition', (
                '-moz-filter #{_duration(panel)} ease',
                '-webkit-filter #{_duration(panel)} ease',
                '-ms-filter #{_duration(panel)} ease',
                'filter #{_duration(panel)} ease'
        ));
        position: relative;
        &:after {
                @include vendor('pointer-events', 'none');
                @include vendor('transition', (
                        'opacity #{_duration(modal)} ease',
                        'visibility #{_duration(modal)}',
                ));
                background: _palette(bg-overlay-alt);
                content: '';
                display: block;
                height: 100%;
                left: 0;
                opacity: 0;
                position: absolute;
                top: 0;
                visibility: hidden;
                width: 100%;
                z-index: 1;
                body.ie & {
                        background: _palette(bg-ie-overlay-alt);
                }
        }
        body.modal-active & {
                @include vendor('filter', 'blur(8px)');
                &:after {
                        @include vendor('pointer-events', 'auto');
                        opacity: 1;
                        visibility: visible;
                        z-index: _misc(z-index-base) + 3;
                }
        }
        &:before {
                @include vendor('animation', 'spinner 1s infinite linear !important');
                @include vendor('pointer-events', 'none');
                @include vendor('transition', (
                        'top 0.75s ease-in-out',
                        'opacity 0.35s ease-out',
                        'visibility 0.35s'
                ));
                background-image: url('images/spinner.svg');
                background-position: center;
                background-repeat: no-repeat;
                background-size: contain;
                content: '';
                display: block;
                font-size: 2em;
                height: 2em;
                left: 50%;
                line-height: 2em;
                margin: -1em 0 0 -1em;
                opacity: 0;
                position: fixed;
                text-align: center;
                top: 75%;
                visibility: hidden;
                width: 2em;
        }
        body.loading & {
                &:before {
                        @include vendor('transition', 'opacity 1s ease-out !important');
                        @include vendor('transition-delay', '0.5s !important');
                        opacity: 0.25;
                        top: 50%;
                        visibility: visible;
                }
        }
}