.preloader.show {
            display: flex;
            justify-content: center;
            align-items: center;
            --preloader-col: #fff;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: var(--preloader-col);
            width: 100%;
            height: 100%;
            z-index: 9999999;
            font-family: arial black !important;
        }
        
        .preloader {
            display: none;
        }
        
        .preloader h2 {
            position: absolute;
            font-size: 16em;
            margin-top: 0;
        }
        
        .preloader h2:nth-child(1) {
            color: transparent;
            -webkit-text-stroke: 2px #03a9f4;
            z-index: 10;
            font-size: 10em;
        }
        
        .preloader h2:nth-child(1)::before {
            content: "";
            background: url("../../assets/img/cap.png");
            background-position: center;
            background-repeat: round;
            position: absolute;
            top: -10px;
            left: -55px;
            width: 116px;
            height: 89px;
            animation: animate-cap 1s linear infinite;
            -webkit-animation: animate-cap 1s linear infinite;
        }
        
        .preloader h2:nth-child(1)::after {
            content: "Be inspired";
            position: absolute;
            font-size: 31px;
            width: 100%;
            height: 89px;
            bottom: -68px;
            left: 1%;
            color: #03a9fa;
            -webkit-text-stroke: 0px;
            animation: animate-slogan 2s linear;
            -webkit-animation: animate-slogan 2s linear;
        }
        
        .preloader h2:nth-child(2) {
            color: #03a9f4;
            animation: preloader-animate 1s cubic-bezier(0.54, 0.47, 0.43, 0.48) infinite;
            font-size: 10em;
            -webkit-animation: preloader-animate 1s cubic-bezier(0.54, 0.47, 0.43, 0.48) infinite;
        }
        
        @media (max-width: 570px) {
            .preloader {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: var(--preloader-col);
                width: 100vw;
                height: 100vh;
                font-family: cursive;
            }
            .preloader h2 {
                position: absolute;
                font-size: 8em;
                z-index: 1000;
            }
            .preloader h2:is(:nth-child(1),
             :nth-child(2)) {
                font-size: 5em;
            }
            .preloader h2:nth-child(1)::before {
                width: 81px;
                height: 73px;
                top: -23px !important;
                left: -55px !important;
            }
        }
        
        @keyframes animate-cap {
            0%,
            95%,
            100% {
                top: -10px;
                left: -53px;
            }
            99% {
                top: -8px;
                left: -60px;
            }
        }
        
        @keyframes animate-slogan {
            0% {
                left: 1%;
            }
            100% {
                left: 76%;
            }
        }
        
        @keyframes preloader-animate {
            0%,
            100% {
                clip-path: polygon(0% 40%, 9% 41%, 17% 44%, 24% 47%, 30% 50%, 36% 51%, 43% 53%, 49% 53%, 56% 52%, 62% 52%, 67% 52%, 76% 53%, 81% 55%, 86% 56%, 90% 57%, 96% 60%, 99% 62%, 100% 100%, 0% 99%);
            }
            25% {
                clip-path: polygon(0 44%, 9% 41%, 17% 44%, 24% 47%, 30% 50%, 36% 51%, 43% 53%, 49% 53%, 56% 52%, 62% 52%, 63% 50%, 66% 49%, 71% 49%, 78% 48%, 88% 50%, 94% 45%, 100% 44%, 100% 100%, 0% 99%);
            }
            50% {
                clip-path: polygon(0 56%, 11% 52%, 15% 51%, 22% 53%, 30% 50%, 36% 51%, 43% 53%, 49% 53%, 56% 52%, 62% 52%, 63% 50%, 66% 49%, 71% 49%, 78% 46%, 85% 44%, 94% 45%, 100% 49%, 100% 100%, 0% 99%);
            }
            75% {
                clip-path: polygon(0 56%, 11% 52%, 15% 51%, 22% 53%, 30% 57%, 36% 59%, 43% 57%, 49% 57%, 55% 60%, 55% 58%, 57% 62%, 62% 59%, 69% 54%, 79% 49%, 85% 44%, 94% 45%, 100% 49%, 100% 100%, 0% 99%);
            }
        }