.cube, .cube * 
{
  position: absolute;
  top: 50%;
  left: 50%;
}
  
.cube 
{
  user-select: none;
  cursor: move;
}
.cube div span
{
	position: relative;
	top: 60px;
	left: -5px;
	font-size: 8em;
}

.face 
{
	box-sizing: border-box;
	border: solid 1px;
	margin: -8em;
	width: 16em;
	height: 16em;
	box-shadow: inset 0 0 15px rgba(0,0,255,0.6);
	text-align: center;
	/** backface-visibility: hidden; /**/
}
.face:nth-child(1) { background: rgba(255,   0,   0, 0.2); }
.face:nth-child(2) { background: rgba(255, 255,   0, 0.2); }
.face:nth-child(3) { background: rgba(  0, 255,   0, 0.2); }
.face:nth-child(4) { background: rgba(  0, 255, 255, 0.2); }
.face:nth-child(5) { background: rgba(  0,   0, 255, 0.2); }
.face:nth-child(6) { background: rgba(255,   0, 255, 0.2); }