#mod4_rotor {
  transform-box: fill-box;
  transform-origin: center;
  animation: rotation 5s infinite linear;
}
@keyframes rotation {
   0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.hwk_mod_4_btnBox {
  position: absolute;
  bottom: 4px;
  left: 0;
  width: 55%;
  display: flex;
  background-color: white;
}
.hwk_mod_4_btn {
  margin: 0 5px;
}
#energy-system-content {
  position: relative;
  height: 81%;
  margin-left: 33%;
}
.hwk_mod_4_topping span {
  display: none;
}
#hwk_mod_4_topping0 {
  display: block;
}
.hwk_mod_4_valueBox {
  display: none;
  position: absolute;
  background-color: #fff;
  width: 20%;
  height: 12%;
  border: 2px solid var(--btn_border);
  padding: 10px;
}
.hwk_mod_4_valueBox.hwk_mod_4_valueBoxStorage {
  width: 27%;
}
.hwk_mod_4_valueBox.hwk_mod_4_valueBoxStorage .storageFlexBox {
  display: flex;
  height: 100%;
}
.hwk_mod_4_valueBox.hwk_mod_4_valueBoxStorage .storageFlexBox .dtorageFlexLeft {
  height: 100%;
  width: 30%;
}
.hwk_mod_4_valueBox.hwk_mod_4_valueBoxStorage .storageFlexBox .dtorageFlexRight {
  width: 100%;
  margin-left: 5%;
}
.hwk_mod_4_head {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 11px;
}
.hwk_mod_4_content {
  font-size: 24px;
}
.hwk_mod_4_progress {
  background-color: #d7dddd;
  width: 100%;
  height: 14px;
  padding: 2px 0;
}
.hwk_mod_4_progress-bar {
  height: 100%;
  border-radius: 0 12px 12px 0;
  width: 0%;
}
#tab-energy-production .hwk_mod_4_progress-bar {
  background-color: var(--color_energyStorage);
}
#tab-energy-storage .hwk_mod_4_progress-bar {
  background-color: var(--color_energyStorage);
}
#tab-energy-consumption .hwk_mod_4_progress-bar {
  background-color: var(--color_energyConsumption);
}
.hwk_mod_4_carport {
  left: -13%;
  top: 16%;
}
.hwk_mod_4_practiceHouseProduction {
  left: 11%;
  top: 0%;
}
.hwk_mod_4_small-wind-turbine {
  left: 38%;
  top: -7%;
}
.hwk_mod_4_agr-machine-hall {
  left: 56%;
  top: 13%;
}
.hwk_mod_4_centralProduction {
  left: 62%;
  top: 28%;
}
/**
* ES
**/
.hwk_mod_4_redox-flow-storage {
  left: 16%;
  top: 0%;
}
.hwk_mod_4_lithium-ion-storage {
  left: 35%;
  top: 38%;
}
.hwk_mod_4_saltwater-storage {
  left: 62%;
  top: 27%;
}
/**
* EC
**/
.hwk_mod_4_welding-shop-1 {
  left: -16%;
  top: 48%;
}
.hwk_mod_4_charging-station-practice-house {
  left: 3%;
  top: 4%;
}
.hwk_mod_4_welding-shop-2 {
  left: 21%;
  top: 74%;
}
.hwk_mod_4_practiceHouseConsumption {
  left: 26%;
  top: -1%;
}
.hwk_mod_4_centralConsumption {
  left: 44%;
  top: 27%;
}
.hwk_mod_4_car-charging-station-1 {
  left: 61%;
  top: 47%;
}
.hwk_mod_4_car-charging-station-2 {
  left: 82%;
  top: 50%;
}
.hwk_mod_4 svg .line {
  opacity: 0;
}
.hwk_mod_4 svg .line line {
  stroke: var(--color_energyStorage);
}
.hwk_mod_4 svg .line circle {
  fill: var(--color_energyStorage);
}