/* Fan styles */
#fanBlades {
  transform-origin: 50% 50%;
}

.spin {
  animation: spinFan 1s linear infinite;
}

@keyframes spinFan {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Compressor styles */
#compressor {
  width: 80px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 5px;
  color: white;
  font-weight: bold;
  margin-left: 10px;
}

/*.compressor.off { fill: gray; }
.compressor.on { fill: red; }
*/

/* Cooling/Heating/Fan buttons or indicators */
.cool, .heat, .fan {
  width: 60px;
  text-align: center;
  border-radius: 4px;
  padding: 4px 0;
  margin-right: 5px;
  color: white;
  font-weight: bold;
}

.on {color:yellow ; }
.off {color:grey; }