#power-indicator {
    display: inline-block;
    background: #000;
    height: 240px;
}
.power-index {
    height: 10px;
    width: 255px;
    margin-bottom: 2px;
    background: #fff;
    opacity: 0.2;
}
#power-ctrl-screen {
    position: relative;
    background: #000;
}
#power-ctrl {
  margin: 20px auto;
}
#balance {
  height: 8px;
  margin-top: 12px;
  box-shadow: none;
  transition: all 0.3s ease-in-out;
}
#balance.on {
  box-shadow: 0px 0px 15px 5px #0075ff;
  transition: all 0.3s ease-in-out;
}
.engine {
    display: inline-block;
    width: 49%;
    padding: 15px;
    transition: all 0.3s ease-in-out;
}
.engine.on .big, .engine.on .small, .flux.on, .flux.on .right-arm, .flux.on .left-arm {
  box-shadow: 0 0 15px 5px #00bb00;
  transition: all 0.3s ease-in-out;
}
.engine .big {
    width: 65px;
    height: 110px;
    border: 1px solid #00bb00;
    display: block;
    margin: 0 auto;
    transition: all 0.3s ease-in-out;
}
.engine .small {
    width: 40px;
    height: 20px;
    border: 1px solid #00bb00;
    display: block;
    margin: 2px auto 0;
    transition: all 0.3s ease-in-out;
}
.flux {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 25px;
    height: 50px;
    transition: all 0.3s ease-in-out;
    border: 1px solid #00bb00;
}
#flux-right {
    transform: translate(1px,-50%);
    border-radius: 0 100px 100px 0;
}
#flux-left {
    transform: translate(-26px,-50%);
    border-radius: 100px 0 0 100px;
}
.right-arm {
  position: absolute;
  top: 50%;
  width: 50px;
  height: 10px;
  right: 0;
  transform: translate(35px, -50%);
  border-top: 1px solid #00bb00;
  border-bottom: 1px solid #00bb00;
  transition: all 0.3s ease-in-out;
}
.left-arm {
  position: absolute;
  top: 50%;
  width: 50px;
  height: 10px;
  right: 0;
  transform: translate(-10px, -50%);
  border-top: 1px solid #00bb00;
  border-bottom: 1px solid #00bb00;
  transition: all 0.3s ease-in-out;
}
.engine.low .big, .engine.low .small, .flux.low, .flux.low .right-arm, .flux.low .left-arm {
  background: #00ffff;
  box-shadow: 0 0 15px 5px #00ffff;
  transition: all 0.3s ease-in-out;
}
.engine.low .big, .engine.low .small, .flux.low {
  border: 1px solid #00ffff;
}
.engine.on .big, .engine.on .small, .flux.on, .flux.on .right-arm, .flux.on .left-arm {
  background: #00bb00;
  box-shadow: 0 0 15px 5px #00bb00;
  transition: all 0.3s ease-in-out;
}
.engine.on .big, .engine.on .small, .flux.on {
  border: 1px solid #00bb00;
}
.engine.warning .big, .engine.warning .small, .flux.warning, .flux.warning .right-arm, .flux.warning .left-arm {
  background: orange;
  box-shadow: 0 0 15px 5px orange;
  transition: all 0.3s ease-in-out;
}
.engine.warning .big, .engine.warning .small, .flux.warning {
  border: 1px solid orange;
}
.engine.danger .big, .engine.danger .small, .flux.danger, .flux.danger .right-arm, .flux.danger .left-arm {
  background: #bb0000;
  box-shadow: 0 0 15px 5px #bb0000;
  transition: all 0.3s ease-in-out;
}
.engine.danger .big, .engine.danger .small, .flux.danger {
  border: 1px solid #bb0000;
}
.flux.danger .right-arm, .flux.danger .left-arm, .flux.warning .right-arm, .flux.warning .left-arm, .flux.on .right-arm, .flux.on .left-arm {
  border-top: 1px solid rgba(0,0,0,0.3);
  border-bottom: 1px solid rgba(0,0,0,0.3);
}
#jump {
    margin: 20px auto 0;
}
.jump-container {
    background: #000;
    padding: 15px 0;
}
.speed {
    display: inline-block;
    width: 30%;
}
.speed.on {
  transition: all 0.3s ease-in-out;
}
#speed-1 {
    height: 80px;
    background: #00bb00;
    transition: all 0.3s ease-in-out;
}
#speed-1.on {
  box-shadow: 0 0 15px 5px #00bb00;
}
#speed-2 {
    height: 120px;
    background: orange;
    transition: all 0.3s ease-in-out;
}
#speed-2.on {
  box-shadow: 0 0 15px 5px orange;
}
#speed-3 {
  height: 160px;
  background: cyan;
  transition: all 0.3s ease-in-out;
}
#speed-3.on {
  box-shadow: 0 0 15px 5px cyan;
}
#speed {
  width: 170px;
  height: 8px;
  margin-top: 10px;
}
#speed.on {
  box-shadow: 0px 0px 15px 5px #0075ff;
  transition: all 0.3s ease-in-out;
}