.spinning-globe-container {
	position: relative;
	margin: 0 auto;
	border-radius: 50%;
	overflow: hidden;
	/* Add subtle drop shadow to the globe itself */
	box-shadow: 0 10px 30px rgba(0,0,0,0.3);
	/* Hardware acceleration */
	transform: translateZ(0);
}

.spinning-globe-wrapper {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	overflow: hidden;
}

.spinning-globe-sphere {
	width: 200%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-size: cover;
	background-position: left center;
	background-repeat: repeat-x;
	animation: spinGlobe linear infinite;
	/* Create the spherical distortion effect using CSS */
	transform-origin: center center;
}

/* The inner shadow creates the illusion of 3D depth and spherical shape */
.spinning-globe-shadow {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	/* Simulates lighting from the top-left */
	box-shadow: inset -20px -20px 50px rgba(0,0,0,0.8), 
	            inset 10px 10px 30px rgba(255,255,255,0.4);
	pointer-events: none;
	z-index: 2;
}

@keyframes spinGlobe {
	0% {
		transform: translateX(0);
	}
	100% {
		/* Translate by exactly half the width (which is 100% of the container) to loop seamlessly */
		transform: translateX(-50%);
	}
}