<style>
.myrow {
  display:flex;
  justify-content:center;
  align-items:center;
}
.mycol {
  padding: 40px;
  margin: 5px;
  width: 33%;
  height: 100%;
  border-color: #888;
  border-style: solid;
  border-width; 1px;
  text-align: center;
  font-size: 3vw;
}
.active {
  background-color: #FCC614;
  }
</style>
<div ng-if="itemState('VT_isMapAltbau')=='ON'" >
  <div class="myrow">
    <div class="mycol active" ng-if="itemState('VT_GaesteBad')=='ON'" ng-click="sendCmd('VT_GaesteBad', 'OFF')">{{getItem('VT_GaesteBad').label}}</div>
    <div class="mycol" ng-if="itemState('VT_GaesteBad')!='ON'" ng-click="sendCmd('VT_GaesteBad', 'ON')">{{getItem('VT_GaesteBad').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_FlurBuero')=='ON'" ng-click="sendCmd('VT_FlurBuero', 'OFF')">{{getItem('VT_FlurBuero').label}}</div>
    <div class="mycol" ng-if="itemState('VT_FlurBuero')!='ON'" ng-click="sendCmd('VT_FlurBuero', 'ON')">{{getItem('VT_FlurBuero').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_Buero')=='ON'" ng-click="sendCmd('VT_Buero', 'OFF')">{{getItem('VT_Buero').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Buero')!='ON'" ng-click="sendCmd('VT_Buero', 'ON')">{{getItem('VT_Buero').label}}</div>
  </div>
  <div class="myrow">
    <div class="mycol active" ng-if="itemState('VT_Diele')=='ON'" ng-click="sendCmd('VT_Diele', 'OFF')">{{getItem('VT_Diele').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Diele')!='ON'" ng-click="sendCmd('VT_Diele', 'ON')">{{getItem('VT_Diele').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_Kueche')=='ON'" ng-click="sendCmd('VT_Kueche', 'OFF')">{{getItem('VT_Kueche').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Kueche')!='ON'" ng-click="sendCmd('VT_Kueche', 'ON')">{{getItem('VT_Kueche').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_Windfang')=='ON'" ng-click="sendCmd('VT_Windfang', 'OFF')">{{getItem('VT_Windfang').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Windfang')!='ON'" ng-click="sendCmd('VT_Windfang', 'ON')">{{getItem('VT_Windfang').label}}</div>
  </div>
  <div class="myrow">
    <div class="mycol active" ng-if="itemState('VT_Wohnzimmer')=='ON'" ng-click="sendCmd('VT_Wohnzimmer', 'OFF')">{{getItem('VT_Wohnzimmer').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Wohnzimmer')!='ON'" ng-click="sendCmd('VT_Wohnzimmer', 'ON')">{{getItem('VT_Wohnzimmer').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_FlurGaesteWC')=='ON'" ng-click="sendCmd('VT_FlurGaesteWC', 'OFF')">{{getItem('VT_FlurGaesteWC').label}}</div>
    <div class="mycol" ng-if="itemState('VT_FlurGaesteWC')!='ON'" ng-click="sendCmd('VT_FlurGaesteWC', 'ON')">{{getItem('VT_FlurGaesteWC').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_Wintergarten')=='ON'" ng-click="sendCmd('VT_Wintergarten', 'OFF')">{{getItem('VT_Wintergarten').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Wintergarten')!='ON'" ng-click="sendCmd('VT_Wintergarten', 'ON')">{{getItem('VT_Wintergarten').label}}</div>
  </div>
</div>
<div ng-if="itemState('VT_isMapNeubau')=='ON'" >
  <div class="myrow">
    <div class="mycol active" style="width: 50%" ng-if="itemState('VT_Esszimmer')=='ON'" ng-click="sendCmd('VT_Esszimmer', 'OFF')">{{getItem('VT_Esszimmer').label}}</div>
    <div class="mycol" style="width: 50%" ng-if="itemState('VT_Esszimmer')!='ON'" ng-click="sendCmd('VT_Esszimmer', 'ON')">{{getItem('VT_Esszimmer').label}}</div>
    <div class="mycol active" style="width: 50%" ng-if="itemState('VT_FlurSchlafzimmer')=='ON'" ng-click="sendCmd('VT_FlurSchlafzimmer', 'OFF')">{{getItem('VT_FlurSchlafzimmer').label}}</div>
    <div class="mycol" style="width: 50%" ng-if="itemState('VT_FlurSchlafzimmer')!='ON'" ng-click="sendCmd('VT_FlurSchlafzimmer', 'ON')">{{getItem('VT_FlurSchlafzimmer').label}}</div>
  </div>
  <div class="myrow">
    <div class="mycol active" ng-if="itemState('VT_Kleiderzimmer')=='ON'" ng-click="sendCmd('VT_Kleiderzimmer', 'OFF')">{{getItem('VT_Kleiderzimmer').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Kleiderzimmer')!='ON'" ng-click="sendCmd('VT_Kleiderzimmer', 'ON')">{{getItem('VT_Kleiderzimmer').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_Badezimmer')=='ON'" ng-click="sendCmd('VT_Badezimmer', 'OFF')">{{getItem('VT_Badezimmer').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Badezimmer')!='ON'" ng-click="sendCmd('VT_Badezimmer', 'ON')">{{getItem('VT_Badezimmer').label}}</div>
    <div class="mycol active" ng-if="itemState('VT_Schlafzimmer')=='ON'" ng-click="sendCmd('VT_Schlafzimmer', 'OFF')">{{getItem('VT_Schlafzimmer').label}}</div>
    <div class="mycol" ng-if="itemState('VT_Schlafzimmer')!='ON'" ng-click="sendCmd('VT_Schlafzimmer', 'ON')">{{getItem('VT_Schlafzimmer').label}}</div>
  </div>
</div>
<div class="myrow" style="margin-top: 10px" ng-if="itemState('VT_isMapAltbau')=='ON' || itemState('VT_isMapNeubau')=='ON'">
  <div ng-click="sendCmd('VT_Saugen', 'ON')" class="mycol" style="width: 25%; background-color: #0B0; font-size: 3vw; padding: 30px; margin: 10px;" >
    Saugen
  </div>
  <div ng-click="sendCmd('VT_Stop', 'ON')" class="mycol" style="width: 25%; background-color: #0B0; font-size: 3vw; padding: 30px; margin: 10px;" >
    Stop
  </div>
  <!--<div ng-if="itemState('VT_Pause')!='ON'" ng-click="sendCmd('VT_Pause', 'ON')" class="mycol" style="width: 25%; background-color: #0B0; font-size: 3vw; padding: 30px; margin: 10px;" >
    Pause
  </div>
  <div ng-if="itemState('VT_Pause')=='ON'" ng-click="sendCmd('VT_Pause', 'OFF')" class="mycol" style="width: 25%; background-color: #0B0; font-size: 3vw; padding: 30px; margin: 10px;" >
    Weiter
  </div>-->
  <div ng-click="sendCmd('VT_ZumDock', 'ON');sendCmd('VT_Pause', 'OFF')" class="mycol" style="width: 25%; background-color: #0B0; font-size: 3vw; padding: 30px; margin: 10px;" >
    Zum Dock
  </div>
</div>