/* Full-screen overlay */
		#preloader {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: black; /* Background color for preloader */
			display: flex;
			align-items: center;
			justify-content: center;
			z-index: 9999;
			transition: opacity 0.5s ease, visibility 0.5s ease;
			opacity: 1;
			visibility: visible;
		}

		/* Circle around logo */
		.preloader-circle {
			width: 100px; /* Circle diameter */
			height: 100px;
			border: 5px solid #cccccc; /* Circle border color */
			border-top-color: grey; /* Border color for loading animation */
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			animation: spin 1s linear infinite; /* Spinning animation */
		}

		/* Logo inside the circle */
		.preloader-logo {
			width: 50px; /* Logo size inside the circle */
			height: auto;
		}

		/* Spin animation */
		@keyframes spin {
			0% {
				transform: rotate(0deg);
			}
			100% {
				transform: rotate(360deg);
			}
		}

		/* Hide the preloader when done */
		#preloader.hidden {
			opacity: 0;
			visibility: hidden;
		}