        .loader {
            width: 15px;
            aspect-ratio: 1;
            border-radius: 50%;
            animation: l5 1.5s infinite linear alternate;
        }

        @keyframes l5 {
            0% {
                box-shadow: 20px 0 #ffa12a, -20px 0 #ffa12a;
                background: #fffffe
            }

            33% {
                box-shadow: 20px 0 #ffffff, -20px 0 #ffffff;
                background: #ffa12a
            }

            66% {
                box-shadow: 20px 0 #ffa12a, -20px 0#ffa12a;
                background: #ffffff
            }

            100% {
                box-shadow: 20px 0 #ffffff, -20px 0#ffffff;
                background: #ffa12a
            }
        }

        ::-webkit-scrollbar {
            width: 12px;
        }

        ::-webkit-scrollbar {
            width: 12px;
        }

        ::-webkit-scrollbar-track {
            background: transparent;
        }

        ::-webkit-scrollbar-thumb {
            background: #808080;
            /* new color on hover */
            border-radius: 12px;
            transition: background-color 0.3s;
            /* smooth transition on hover */
        }

        ::-webkit-scrollbar-thumb:hover {
            background: rgb(255, 164, 79);
            /* color of the scrollbar thumb */
        }

        /* HTML: <div class="loader"></div> */
        .downloader {
            width: 260px;
            height: 22px;
            border-radius: 20px;
            color: #ffa12a;
            border: 2px solid;
            position: relative;
        }

        .downloader::before {
            content: "";
            position: absolute;
            margin: 2px;
            inset: 0 100% 0 0;
            border-radius: inherit;
            background: currentColor;
            animation: l6 5s infinite;
        }

        .converter-downloader {
            width: 260px;
            height: 22px;
            border-radius: 20px;
            color: #ffa12a;
            border: 2px solid;
            position: relative;
        }

        .converter-downloader::before {
            content: "";
            position: absolute;
            margin: 2px;
            inset: 0 100% 0 0;
            border-radius: inherit;
            background: currentColor;
            animation: l6 5s infinite;
        }

        @keyframes l6 {
            100% {
                inset: 0
            }
        }
        .navbar-menu ul li {
          transition: background-color 0.8s, box-shadow 0.8s;
      }
      
      .navbar-menu ul li:hover {
          background-color: white;
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
      }
      .desktop-nav li {
          transition: background-color 0.4s, box-shadow 0.4s;
          padding: 12px;
      }
      
      .desktop-nav li:hover {
          background-color: white;
          box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      }