@charset "UTF-8";

.cube {
  width: 100%;
  height: 100%;
}

.faceLabel {
  display: none;
  position: absolute;
  font-size: 0.5em;
  text-align: center;
  color: #fff;
}

.cube .cubelet {
  box-sizing: border-box;
  position: absolute;
  width: 1em;
  height: 1em;
}

.cube .cubelet > .face {
  box-sizing: border-box;
  position: absolute;
  width: 1em;
  height: 1em;
  background-color: #000;
  padding: 0.05em;
  text-align: center;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.cube .cubelet > .face.faceIntroverted {
  background-color: #000;
}

.cube .cubelet > .face.faceTransparent {
  background-color: transparent;
}

.cube .cubelet > .face > .wireframe {
  display: none;
}

.cube .sticker {
  width: 100%;
  height: 100%;
  background-color: #f0f;
  border-radius: 0.1em;
  text-align: center;
}

.cube .stickerLogo {
  background-image: none;
}

.cube .sticker.red {
  background-color: #e40303;
}

.cube .sticker.white {
  background-color: #fff;
}

.cube .sticker.blue {
  background-color: #004dff;
}

.cube .sticker.green {
  background-color: #008026;
}

.cube .sticker.orange {
  background-color: #ff8c00;
}

.cube .sticker.yellow {
  background-color: #ffed00;
}

.cube .cubelet > .face > .id {
  display: none;
}

.cube .cubelet > .face > .text {
  display: none;
}