/* -- inizio :: main loading -- */

div#loading-wrapper { height: 100vh; }
div#loading-wrapper.loading-dark { background-color: #424a55; }

div#loading-container { margin: auto; width: 300px; position: relative; }
div#loading-content { position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); text-align: center; }

div#loading-wrapper .spinner { position: relative; margin: auto; box-sizing: border-box; background-clip: padding-box; width: 300px; height: 300px; border-radius: 150px; border: 4px solid rgba(255, 255, 255, 0.1); -webkit-mask: linear-gradient(rgba(0, 0, 0, 0.1), #000000 90%); transform-origin: 50% 60%; transform: perspective(300px) rotateX(66deg); animation: spinner-wiggle 2s infinite; }
div#loading-wrapper .spinner:before,
div#loading-wrapper .spinner:after { content: ""; position: absolute; margin: -4px; box-sizing: inherit; width: inherit; height: inherit; border-radius: inherit; opacity: .05; border: inherit; border-color: transparent; animation: spinner-spin 2s cubic-bezier(0.6, 0.2, 0, 0.8) infinite, spinner-fade 2s linear infinite; }

div#loading-wrapper .spinner:before { border-top-color: #034c8a; }
div#loading-wrapper .spinner:after { border-top-color: #c99231; animation-delay: 0.5s; }

div#loading-wrapper.loading-dark .spinner { border-color: transparent; }
div#loading-wrapper.loading-dark .spinner:before { border-top-color: #fff; }
div#loading-wrapper.loading-dark .spinner:after { border-top-color: #aaa; }

@keyframes spinner-spin {
    100% { transform: rotate(360deg); }
}

@keyframes spinner-fade {
    20% { opacity: .1; }
    40% { opacity: 1; }
    60% { opacity: .1; }
}

/* -- fine :: main loading -- */

/* -- inizio :: ajaxwaiting :: common loading -- */

.ajaxwaiting { height: 4px; width: 100%; position: relative; overflow: hidden; background-color: #ddd !important; padding: 0px !important; border: none !important }

.ajaxwaiting:before { display: block; position: absolute; content: ""; left: 0; width: 33%; height: 4px; background-color: #424a55; animation: borealisBar 2s cubic-bezier(0, 0.5, 1, 0.5) infinite; }

@keyframes borealisBar {
    0% { -webkit-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); }
    100% { -webkit-transform: translateX(303%); -o-transform: translateX(303%); transform: translateX(303%); }
}

/* -- fine :: ajaxwaiting :: common loading -- */