:root {
            background-color: #141414;
        }

        html {
            background: #141414;
            background-color: #141414;
            overscroll-behavior: none;
        }

        body {
            background-color: #141414;
            overscroll-behavior: none;
            /*font-family: Geogrotesque-Regular,sans-serif !important;
            font-family: HelveticaNeueLTStd-Bd,sans-serif !important;*/
            /*font-family: neue-haas-grotesk-display,sans-serif !important;*/
        }

            body.dark-mode {
                background: #141414 #141414;
            }

            body > .loader-container {
                position: absolute;
                left: 0;
                top: 0;
                right: 0;
                bottom: 0;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                pointer-events: none;
                /*width: 0;*/
            }

            body > #preloader-container {
                position: absolute;
                left: 0;
                top: 0;
                right: 0;
                bottom: 0;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                pointer-events: none;
                /*width: 0;*/
                background-color: rgba(0,0, 0,.7);
                z-index: 19999;
            }

            body > #preloader-container {
                position: fixed !important;
            }

        .loader {
            font-size: 10px;
            margin: 40px auto;
            text-indent: -9999em;
            width: 7em;
            height: 7em;
            min-width: 7em;
            min-height: 7em;
            max-width: 7em;
            max-height: 7em;
            border-radius: 50%;
            background: #0d6efd;
            background: -moz-linear-gradient(left, #0d6efd 10%, rgba(255, 255, 255, 0) 42%);
            background: -webkit-linear-gradient(left, #0d6efd 10%, rgba(255, 255, 255, 0) 42%);
            background: -o-linear-gradient(left, #0d6efd 10%, rgba(255, 255, 255, 0) 42%);
            background: -ms-linear-gradient(left, #0d6efd 10%, rgba(255, 255, 255, 0) 42%);
            background: linear-gradient(to right, #0d6efd 10%, rgba(255, 255, 255, 0) 42%);
            position: relative;
            -webkit-animation: load3 1s infinite linear;
            animation: load3 1s infinite linear;
            -webkit-transform: translateZ(0);
            -ms-transform: translateZ(0);
            transform: translateZ(0);
        }

            .loader:before {
                width: 50%;
                height: 50%;
                background: #0d6efd;
                border-radius: 100% 0 0 0;
                position: absolute;
                top: 0;
                left: 0;
                content: '';
            }

            .loader:after {
                background: inherit;
                width: 90%;
                height: 90%;
                border-radius: 50%;
                content: '';
                margin: auto;
                position: absolute;
                top: 0;
                left: 0;
                bottom: 0;
                right: 0;
            }

        @-webkit-keyframes load3 {
            0% {
                -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
            }

            100% {
                -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        @keyframes load3 {
            0% {
                -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
            }

            100% {
                -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        .loader-io {
            display: flex;
            justify-content: center;
            margin: 2rem;
        }

            .loader-io div {
                animation: loader-io 1s linear infinite;
                width: 95px;
                height: 95px;
                border-radius: 100%;
                box-shadow: 0 3.024px 0 0 #0d6efd;
                transform-origin: 47.519999999999996px 49.032px;
                box-sizing: content-box;
            }

        @keyframes loader-io {
            0% {
                transform: rotate(0deg)
            }

            50% {
                transform: rotate(180deg)
            }

            100% {
                transform: rotate(360deg)
            }
        }

        #loading-screen {
            display: flex;
            flex-direction: column;
            height: 100%;
            align-items: center;
            justify-content: center;
            margin: 0rem;
            z-index: 9999;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            opacity: 0;
            transition: all .3s;
            /*background-color: black;*/
        }

            /*body.no-transition #loading-screen > div {
        transition: none;
        }*/
            #loading-screen.selected {
                opacity: 1;
            }

        .logo-image {
            text-align: center;
            /* padding-bottom: 1.5rem;*/
            padding-top: 1.5rem;
            /* min-height:170px;*/
        }

            .logo-image img {
                /* width: 10rem;*/
                max-height: 10rem;
                transition: .3s;
                object-fit: contain;
            }

        .logo-name {
            text-transform: uppercase;
            white-space: nowrap;
            transition: .3s ease-in-out;
            opacity: 0;
            color: white;
            text-align: center;
            font-size: 2rem;
            text-shadow: -1px 1px 2px rgb(0 0 0);
        }
            /*body.no-transition .logo-name {
        transition: none;
        }*/
            .logo-name.show {
                opacity: 0;
            }

        @media only screen and (max-height: 600px) {
            #loading-screen .logo-image img {
                width: 8rem;
                max-height: 8rem;
            }
        }

        #loading-progress-bar {
            display: flex;
            flex-direction: column;
        }

            #loading-progress-bar .loading-progress-bar-label {
                font-size: .7rem;
                text-shadow: -1px 1px 2px rgb(0 0 0);
            }

            #loading-progress-bar .loading-progress-bar-percent {
                width: 0%;
                height: 1px;
                background-color: rgba(100,100,100,.7);
                margin-top: 3px;
                transition: .3s;
            }