body {
  background: url(back.jpg) no-repeat center center fixed;
  background-size: cover;
}

#expr-prev {
  font-size: large;
}

#expr-left {
  color: red;
  font-size: xxx-large;
}

#expr-right {
  color: blue;
  font-size: xx-large;
}

.expr {
  margin: 0 auto;
}

p.wrong {
  color: red;
  font-size: xx-large;
}

span.wrong {
  color: red;
  font-size: x-large;
}

*, *:before, *:after {
  box-sizing: border-box;
}

.wheel {
  perspective: 500px;
  /* border: 1px solid #333; */
  margin: 50px;
}
.wheel .wheel-inner {
  position: relative;
  width: 160px;
  height: 280px;
  font-size: x-large;
  margin: 0;
  transform-style: preserve-3d;
  transition: all 1s;
}
.wheel .wheel-inner .wheel-segment {
  border: 1px solid #333;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40px;
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  background-color: #c6ff89;
}

.wheel-inner .wheel-segment:nth-child(odd) {
  background-color: #94f8ff;
}
/* .wheel .wheel-inner .wheel-segment:nth-child(even) {
  background-color: #ddd;
} */

@keyframes spin {
  /* from {
    transform: rotateX(0deg);
  }
  to {
    transform: rotateX(30deg);
  } */
}