Template:Cubemap viewer/styles.css

.cubemapviewer .cubemapviewer-container {
	position: relative;
	overflow: hidden;
    /* contain: strict; template styles doesn't support */
    cursor: grab;
}

.cubemapviewer .cubemapviewer-face {
	position: absolute;
	transform-origin: 0 0 0;
    transition: transform 0.3s ease-in-out;
}

.cubemapviewer .cubemapviewer-outercontainer.calculator-value-true .cubemapviewer-face {
	transition: transform 10s ease-in-out;
}

.cubemapviewer .cubemapviewer-interactive.calculator-value-true .cubemapviewer-container {
	cursor:grabbing
}

.cubemapviewer .cubemapviewer-interactive.calculator-value-true .cubemapviewer-face {
	transition: transform 0s;
}

.cubemapviewer .cubemapviewer-controls button, .cubemapviewer .cubemapviewer-controls .cdx-button--fake-button {
	opacity: 0.7;
}

.cubemapviewer .cubemapviewer-controls button:hover,
.cubemapviewer .cubemapviewer-controls button:active,
.cubemapviewer .cubemapviewer-controls .cdx-button--fake-button:hover,
.cubemapviewer .cubemapviewer-controls .cdx-button--fake-button:active
{
	opacity: 1;
}

@media (prefers-reduced-transparency: reduce) {
	.cubemapviewer .cubemapviewer-controls button, .cubemapviewer .cubemapviewer-controls .cdx-button--fake-button {
		opacity: 1;
	}
}