body {
    color:white; background-color:black; font-family:Segoe,Arial,Helvetica,Sans-Serif; overflow: hidden;
  }
  
  #statusbar {
    width: 100%; height:32px; background-color: #222;
  }
  
  #solarpower {
    height:100%; width:33%; float:left; text-align:center; line-height:32px; font-size:16px; font-weight:bold; color:yellow;
  }
  
  #bilanz {
    height:100%; width:34%; float:left; text-align:center; line-height:32px; font-size:16px; font-weight:bold; color:magenta;
  }
  
  #battery {
    height:100%; width:33%; float:left; text-align:center; line-height:32px; font-size:16px; font-weight:bold; color:green;
  }
  
  .ac_device {
    position: relative; width:100%; height:90px; text-align:center; margin-top:50px; margin-bottom:50px;
  }
  
  .devicename {
    position: absolute; left:0px; top:0px; height:90px; width:35%; line-height:90px; font-size:18px; text-align:left;
  }
  
  .deviceicon {
    position: absolute; left:35%; top:0px; height:90px; width: 30%; line-height:90px; text-align:center;
  }

  .deviceicon img {
    height:100%;
  }

  .toggleicon {
    position: absolute; left:35%; top:0px; height:90px; width: 30%; line-height:90px; text-align:center; display:none;
  }

  .toggleicon img {
    height: 100%;
  }
  
  .devicetemps {
    position: absolute; left: 65%; top: 0px; height:90px; width:35%; line-height:90px; font-size:18px; text-align:right;
  }
  
  #spinner {
    position:fixed; right:0px; bottom:3px; height:32px; width:32px; display:none;
  }
  
  #outdoor {
    position:fixed; left:0px; bottom:10px; height:32px; line-height:32px; text-align:center; width:33%; font-size:16px; font-weight: bold;
  }
  
  #tempicon {
    height:32px; width:32px; float:left; margin-right:5px;
  }
  
  #temperature_outdoor {
    height:32px; line-height:32px; width:64px; font-size:16px; font-weight: bold; float:left;
  }
  
  #password_overlay {
    position:fixed; top:0px; left:0px; right: 0px; bottom: 0px; background-color: #333; display:none;
  }
  
  .overlaycontainer {
    position:absolute; top:25%; left:0px; width:100%; height:50%
  }
  
  #passwordlabel {
    position:absolute;top:20px;left:10%;width:80%;height:16px;font-size:16px;text-align:center;
  }
  
  #password {
    position:absolute;top:50px;left:10%;width:79%;height:32px;font-size:16px;text-align:center;
  }
  
  #start_auth {
    top:100px;left:10%;
  }
  
  #cancel_auth {
    top:100px;right:10%;
  }
  
  .pwbutton {
    position: absolute;
    width: 39%;
    height: 32px;
    font-size: 16px;
    line-height: 32px;
    text-align: center;
    background-color: #555;
    cursor: pointer;
  }
  
  .pwbutton:hover {
      background-color: #777;
  }
  
  #temperature_overlay {
    position:fixed; top:0px; left:0px; right: 0px; bottom: 0px; background-color: #333; display:none;
  }
  
  #temperaturelabel {
    position:absolute;top:30px;left:10%;width:80%;height:16px;font-size:16px;text-align:center;
  }
  
  .mode {
    position:absolute;top:60px;height:32px;font-size:16px;text-align:center;line-height:32px;background-color:#555;
  }
  
  #mode_off {
    left:10%;width:25%;
  }
  
  #mode_cool {
    left:37%;width:26%;
  }
  
  #mode_heat {
    left:65%;width:25%;
  }
  
  .temperature {
    position:absolute; top:100px; height:64px; font-size:16px; text-align:center; line-height:64px;
  }
  
  #minus {
    left:10%; width:19%; background-color:rgb(15, 147, 199);
  }
  
  #temperature {
    left:30%; width:38%; background-color:rgb(255, 255, 255); height:58px;
  }
  
  #plus {
    left:71%; width:19%; background-color:rgb(255, 183, 3);
  }
  
  #start_temp {
    top:180px;left:10%;
  }
  
  #cancel_temp {
    top:180px;right:10%;
  }