@keyframes spin3D {
		from {
			transform: rotate3d(0.5, 0.5, 0.5, 360deg)
		}

		to {
			transform: rotate3d(0deg)
		}
	}

	#loading {
		height: 100%;
		background-color: #87CEFA;
		display: flex;
		justify-content: center;
		align-items: center;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		overflow: hidden;
		z-index: 99999999
	}

	.spinner-box {
		width: 300px;
		height: 300px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: transparent
	}

	.leo {
		position: absolute;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 50%
	}

	.blue-orbit {
		width: 165px;
		height: 165px;
		border: 2px solid #EEAD0E;
		animation: spin3D 3s linear .2s infinite
	}

	.green-orbit {
		width: 120px;
		height: 120px;
		border: 4px solid #3CB371;
		animation: spin3D 2s linear 0s infinite
	}

	.red-orbit {
		width: 90px;
		height: 90px;
		border: 6px solid #EE2C2C;
		animation: spin3D 1s linear 0s infinite
	}

	.white-orbit {
		width: 60px;
		height: 60px;
		border: 8px solid #00BFFF;
		animation: spin3D 10s linear 0s infinite
	}

	.w1 {
		transform: rotate3D(1, 1, 1, 90deg)
	}

	.w2 {
		transform: rotate3D(1, 2, 0.5, 90deg)
	}

	.w3 {
		transform: rotate3D(0.5, 1, 2, 90deg)
	}