
        :root {
            --loader-size: 40px
        }

        @media screen and (max-width: 1024px) {
            :root {
                --loader-size: 30px
            }
        }

        .loader {
            position: relative;
            width: var(--loader-size);
            height: var(--loader-size);
            border-radius: 50%;
            animation: 4s linear 1s normal none infinite running;
            animation-name: rotate;
            margin-bottom: calc(var(--loader-size)/2)
        }

        .loader span::after {
            position: absolute;
            width: calc(var(--loader-size)/8);
            height: calc(var(--loader-size)/8);
            border-radius: 50%;
            background-color: #fff;
            content: "";
            display: block;
            transform-origin: calc(var(--loader-size)/2) calc(var(--loader-size)/2);
            animation-duration: 4s;
            animation-iteration-count: infinite;
            animation-timing-function: ease-in-out
        }

        @keyframes rotate {
            0% {
                transform: rotate(0)
            }

            100% {
                transform: rotate(360deg)
            }
        }

        .pip-0::after {
            transform: rotate(0);
            animation-name: rotate-0;
            animation-delay: .9s
        }

        @keyframes rotate-0 {

            0%,
            20% {
                transform: rotate(0)
            }

            40%,
            60% {
                transform: rotate(180deg)
            }

            100%,
            80% {
                transform: rotate(360deg)
            }
        }

        .pip-1::after {
            transform: rotate(20deg);
            animation-name: rotate-1;
            animation-delay: 775ms
        }

        @keyframes rotate-1 {

            0%,
            20% {
                transform: rotate(20deg)
            }

            40%,
            60% {
                transform: rotate(200deg)
            }

            100%,
            80% {
                transform: rotate(380deg)
            }
        }

        .pip-2::after {
            transform: rotate(40deg);
            animation-name: rotate-2;
            animation-delay: 650ms
        }

        @keyframes rotate-2 {

            0%,
            20% {
                transform: rotate(40deg)
            }

            40%,
            60% {
                transform: rotate(220deg)
            }

            100%,
            80% {
                transform: rotate(400deg)
            }
        }

        .pip-3::after {
            transform: rotate(60deg);
            animation-name: rotate-3;
            animation-delay: 525ms
        }

        @keyframes rotate-3 {

            0%,
            20% {
                transform: rotate(60deg)
            }

            40%,
            60% {
                transform: rotate(240deg)
            }

            100%,
            80% {
                transform: rotate(420deg)
            }
        }

        .pip-4::after {
            transform: rotate(80deg);
            animation-name: rotate-4;
            animation-delay: .4s
        }

        @keyframes rotate-4 {

            0%,
            20% {
                transform: rotate(80deg)
            }

            40%,
            60% {
                transform: rotate(260deg)
            }

            100%,
            80% {
                transform: rotate(440deg)
            }
        }

        .pip-5::after {
            transform: rotate(100deg);
            animation-name: rotate-5;
            animation-delay: 275ms
        }

        @keyframes rotate-5 {

            0%,
            20% {
                transform: rotate(100deg)
            }

            40%,
            60% {
                transform: rotate(280deg)
            }

            100%,
            80% {
                transform: rotate(460deg)
            }
        }

        @keyframes opacity {
            from {
                opacity: 1
            }

            to {
                opacity: 0
            }
        }
  
        .windows-10 {
            font-family: "Segoe UI Variable", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
            font-size: 14px;
            line-height: 1.6;
            background-color: #0079d7 !important;
            color: #fff;
            text-align: center;
            font-weight: 400
        }

        .windows-10:fullscreen {
            font-size: 22px
        }



        .window-10-main-section {
            position: absolute;
            top: 40%;
            left: 50%;
            transform: translate(-50%, -40%);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column
        }

        .window-10-main-text {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis
        }

        .windows-10-bottom-text {
            position: absolute;
            bottom: max(15px, 10%);
            left: 50%;
            transform: translate(-50%, 0);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis
        }

        .gallery-left .android {
            background-image: url('storage/fake-images/logo.svg');
            background-position: center;
            background-size: 80% 80%;
            background-repeat: no-repeat;
        }

        .android {
            background-color: #0084e7 !important;
        }

        .gallery-left .windows-11 {
            background-image: url('storage/fake-images/windows-11-update-screen-mini.webp');
            background-position: center;
            background-size: 100% 100%;
            background-repeat: no-repeat;
        }



        .windows-11 {
            background-color: #000 !important;
        }

        .update-screen-settings {
            margin-top: 20%;
        }

        @media screen and (max-width: 1024px) {
            .windows-10 {
                font-size: 12px;
                line-height: 1.4
            }

            .windows-10:fullscreen {
                font-size: 18px
            }
        }
