div#app{margin:0;padding:0;width:100vw;height:100vh;display:flex;flex-direction:column;flex-basis:100%}@keyframes counts-syncing{0%{opacity:1}50%{opacity:0}to{opacity:1}}@keyframes image-syncing{0%{filter:opacity(.5);transform:scale(.9)}50%{filter:opacity(1);transform:scale(1)}to{filter:opacity(.5);transform:scale(.9)}}@keyframes list-syncing{0%{filter:opacity(.5) grayscale(1)}50%{filter:opacity(1) grayscale(0)}to{filter:opacity(.5) grayscale(1)}}@keyframes list-row-updated{0%{filter:opacity(.8) grayscale(1)}50%{filter:opacity(1) grayscale(0)}to{filter:opacity(.8) grayscale(1)}}@keyframes moving-gradient{0%{background-position:0 0;opacity:1}25%{background-position:-50% 0;opacity:.9}50%{background-position:-100% 0;opacity:1}75%{background-position:-50% 0;opacity:.9}}.separator-blend-enter-from,.separator-blend-leave-to{opacity:0;width:0;transition:opacity 2s ease,width 2s ease}.separator-blend-enter-active,.separator-blend-leave-active{width:0;transition:opacity .2s ease,width .2s ease}.separator-blend-enter-to{width:100%;transition-delay:.35s;transition:opacity .3s ease,width .2s ease}.crossfade-enter-active,.crossfade-enter-to{transition-delay:1s;transition:opacity .5s ease}.crossfade-leave-active{display:none}.crossfade-leave-active,.crossfade-leave-from{transition-delay:.35s;transition:opacity .2s ease}.crossfade-enter-from,.crossfade-leave-to{opacity:0}.next-enter-from{opacity:0;transform:scale3d(2,.5,1) translate3d(400px,0,0)}.next-enter-to{transform:scaleX(1)}.next-enter-active,.next-leave-active{transition:.3s cubic-bezier(.68,-.55,.265,1.55)}.next-leave{transform:scaleX(1)}.next-leave-to{opacity:0;transform:scale3d(2,.5,1) translate3d(-400px,0,0)}.popover-enter-from,.popover-leave-to{opacity:0;transform:rotateY(50deg)}.popover-enter-to,.popover-leave{opacity:1;transform:rotateY(0deg)}.popover-enter-active,.popover-leave-active{transition:opacity,transform .2s ease-out}.scale-slide-enter-active,.scale-slide-leave-active{position:absolute;transition:all .25s ease}.scale-slide-enter-from{left:-100%}.scale-slide-enter-to{left:0}.scale-slide-leave-from{transform:scale(1)}.scale-slide-leave-to{transform:scale(.8)}.component-fade-move{transition:all .3s ease;transform:scale(.98)}.component-fade-enter-to{transition:all .3s ease;transform:translateX(-400px);opacity:0}.component-fade-leave-to{transition:all .3s ease;transform:translateX(400px);opacity:0}.slide-fade-enter-active{opacity:1}.slide-fade-leave-active{display:none}.slide-fade-enter-active,.slide-fade-leave-active{transition:all .2s cubic-bezier(1,.5,.8,1)}.slide-fade-enter-from,.slide-fade-leave-to{transform:translateX(20px);opacity:0}.slide-fade-top-enter-active{opacity:1}.slide-fade-top-enter-active,.slide-fade-top-leave-active{transition:all .2s cubic-bezier(1,.5,.8,1)}.slide-fade-top-enter-from,.slide-fade-top-leave-to{transform:translateX(20px);opacity:0}.zoom-enter-active,.zoom-leave-active{animation-duration:.5s;animation-fill-mode:both;animation-name:zoom}.zoom-leave-active{animation-direction:reverse}@keyframes zoom{0%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:1}}.fastzoom-enter-active,.fastzoom-leave-active{animation-duration:.25s;animation-fill-mode:both;animation-name:zoom}.fastzoom-leave-active{animation-direction:reverse}.card-enter-from,.card-leave-to{opacity:0;transform:rotateY(90deg)}.card-enter-active,.card-leave-active{transition:all .5s}.list-enter-active{animation:add-item .3s}.list-leave-active{position:absolute;animation:add-item .3s reverse}.list-move{transition:transform .3s}@keyframes add-item{0%{overflow:hidden;z-index:10;opacity:0;transform:translateX(150px)}50%{overflow:hidden;opacity:.5;transform:translateX(-10px) skewX(2deg)}to{overflow:auto;z-index:99;opacity:1;transform:translateX(0)}}.list-vert-enter-active{animation:add-vert-item .3s}.list-vert-leave-active{position:absolute;animation:add-vert-item .3s reverse}.list-vert-move{transition:transform .3s}@keyframes add-vert-item{0%{z-index:10;opacity:0;transform:translateY(-150px)}50%{opacity:.5;transform:translateY(-50px) skewY(2deg)}to{z-index:99;opacity:1;transform:translateY(0)}}.listmove-move{transition:all .25s ease-in-out;opacity:.8;transform:scale(.98)}.listmove-leave-active{display:none}.listmove-enter-from,.listmove-leave-to{opacity:.5}.list-delayed-enter-active{transition:opacity .5s linear,transform .5s cubic-bezier(.2,.5,.1,1);transition-delay:calc(.05s*var(--index))}.list-delayed-leave-active{transition:opacity .4s linear,transform .4s cubic-bezier(.5,0,.7,.4);transition-delay:calc(.05s*(var(--count) - var(--index)))}.list-delayed-move{transition:opacity .5s linear,transform .5s ease-in-out}.list-delayed-enter-from,.list-delayed-leave-to{opacity:0;transform:translateX(-1em)}.list-delayed-enter-to,.list-delayed-leave-from{opacity:1}.functionbuttons-enter-active{animation:functionbuttons-add-item .3s}.functionbuttons-leave-active{position:absolute;animation:functionbuttons-add-item .3s reverse}.functionbuttons-move{transition:transform .3s}@keyframes functionbuttons-add-item{0%{opacity:0;transform:translateX(150px)}50%{opacity:.5;transform:translateX(-10px) skewX(2deg)}to{opacity:1;transform:translateX(0)}}.functionbuttons-vert-enter-active{animation:functionbuttons-add-vert-item .3s}.functionbuttons-vert-leave-active{position:absolute;animation:functionbuttons-add-vert-item .3s reverse}.functionbuttons-vert-move{transition:transform .3s}@keyframes functionbuttons-add-vert-item{0%{opacity:0;transform:translateY(-150px)}50%{opacity:.5;transform:translateY(-50px) skewY(2deg)}to{z-index:99;transform:translateY(0)}}.fade-enter-from,.fade-leave-to{opacity:0}.fade-enter-active,.fade-leave-active{transition:opacity .2s ease}.fade-enter-active,.fade-enter-to{transition-delay:.35s;transition:opacity .5s ease}.train-slide-move{transition:all .1s;transform:scale(.97);opacity:.8}.train-slide-enter-from,.train-slide-enter-to{transition:all .1s ease;transform:translateX(-100px);opacity:0}.train-slide-leave-to{transition:all .1s ease;transform:translateX(100px);opacity:0}.train-next-enter-from,.train-next-enter-to{opacity:0;transition:all .1s ease;transform:scale3d(2,.5,1) translate3d(400px,0,0)}.train-next-enter-active,.train-next-leave-active{transition:.1s cubic-bezier(.68,-.55,.265,1.55)}.train-next-leave-to{opacity:0;transform:scale3d(2,.5,1) translate3d(-400px,0,0)}.train-scale-enter-active,.train-scale-leave-active{transition:all .1s ease-in-out}.train-scale-enter-to{transform:translateX(-1000px);opacity:0}.train-scale-leave-to{opacity:0;transform:scale(.8) translateX(1000px)}.train-list-enter-to,.train-list-leave-to{opacity:0;transform:rotateY(180deg)}.train-list-enter-active,.train-list-leave-active{transition:opacity,transform .1s ease-out}.debug{position:absolute;width:100%;height:100px;overflow-y:scroll;background:#ff0;padding:20px;font-weight:700;z-index:999;display:none}:root{--max-column-header-height:10}@media only screen and (min-width:2800px){:root{--max-column-header-height:25}}@media only screen and (min-width:1280px) and (max-width:2799px){:root{--max-column-header-height:20}}@media only screen and (min-width:768px) and (max-width:1279px){:root{--max-column-header-height:15}}@media only screen and (min-width:360px) and (max-width:767px){:root{--max-column-header-height:12}}@media only screen and (max-height:799px){:root{--max-column-header-height:8!important}}div.logo{width:300px;max-width:calc(100% - 40px)!important;height:250px;background:url(/img/heatcontrol-logo.e415aeb9.svg);background-size:contain;background-repeat:no-repeat;margin:20px auto}header{background:#fff;position:relative;top:0;left:0;width:100vw;height:100px}header:before{content:"";width:102%;height:100%;bottom:-10px;margin:-1%;z-index:-1;position:absolute;background:#fff;transform:rotate(-1deg)}footer{background:#4289c6;position:relative;top:0;left:0;width:100vw;height:-moz-max-content;height:max-content;padding:10px}footer div.footer-contents{text-align:center;color:#fff}@media only screen and (min-width:1280px) and (max-width:2799px),only screen and (min-width:2800px),only screen and (min-width:768px) and (max-width:1279px){footer div.footer-contents{font-size:1.2em;line-height:35px}}@media only screen and (min-width:360px) and (max-width:767px){footer div.footer-contents{font-size:.9em;line-height:25px}}.tabselector{width:100%;min-height:-moz-max-content;min-height:max-content;border-bottom:1px solid #fff;padding:0 10px;margin-bottom:20px}.tabselector .tabspace{width:100%;overflow:hidden}.tabselector .tabspace .tab{transition:all .2s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;float:left;padding:10px 20px;line-height:30px;margin:10px -2px 0 0;font-size:1.1em;cursor:pointer;color:#4289c6}.tabselector .tabspace .tab.active{background:#4289c6;color:#fff;border-color:#4289c6;margin-top:5px;line-height:45px;padding:5px 20px;font-size:1.2em;font-weight:700}div.online-status{-webkit-user-select:none;-moz-user-select:none;user-select:none;position:absolute;top:0;right:0;padding:10px}div.online-status .indicator{float:left;width:-moz-fit-content;width:fit-content;height:30px;border-radius:30px;line-height:30px;text-transform:uppercase;color:#2f2f2f;padding:0 10px;margin-left:10px;font-weight:700}div.online-status .indicator.offline{background:#ce0000}div.online-status .indicator.connected{background:#00ce00}main{flex:1;position:relative;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAScAAAEnCAYAAADrWoVBAAAACXBIWXMAABcSAAAXEgFnn9JSAAAD3klEQVR4nO3UMQEAIAzAsIF/nejAAD89EgW9umbmDEDM/h0A8GJOQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkCSOQFJ5gQkmROQZE5AkjkBSeYEJJkTkGROQJI5AUnmBCSZE5BkTkDSBeMWAzSvdmz8AAAAAElFTkSuQmCC);border:2px solid #1a1a1a;width:80vw;min-height:500px;max-height:100vh!important;height:1000px;margin:-10px auto 0 auto;transition:all .3s ease;overflow:hidden;overflow-y:auto}@media only screen and (min-width:360px) and (max-width:767px){main{width:100vw}}@media only screen and (min-width:768px) and (max-width:1279px){main{width:90vw}}nav{top:0;left:0;width:100%;height:50px}nav,nav:before{position:absolute}nav:before{content:"";width:calc(100% + 4px);height:100%;margin:-2px;background:#4289c6;opacity:.6}.iconspace{margin:50px auto}@media only screen and (min-width:2800px){.iconspace{width:40%}}@media only screen and (min-width:1280px) and (max-width:2799px){.iconspace{width:55%}}@media only screen and (min-width:768px) and (max-width:1279px){.iconspace{width:70%}}@media only screen and (min-width:360px) and (max-width:767px){.iconspace{width:80%}}.icon{position:relative;box-sizing:border-box;float:left;aspect-ratio:1;border:2px solid #fff;border-radius:15px 0 15px 15px;margin:0 20px 20px 0;transition:all .2s ease;cursor:pointer;overflow:hidden;background-color:#fff;background-size:50%;background-position-x:center;background-position-y:calc(50% - 10px);background-repeat:no-repeat}@media only screen and (min-width:2800px){.icon{width:calc(50% - 20px)}}@media only screen and (min-width:1280px) and (max-width:2799px){.icon{width:calc(50% - 20px)}}@media only screen and (min-width:768px) and (max-width:1279px){.icon{width:calc(50% - 20px)}}@media only screen and (min-width:360px) and (max-width:767px){.icon{width:calc(50% - 20px)}}.icon:hover{background-color:#4289c6;transform:scale(1.1)}.icon.heating{background-image:url(/img/button-heat-inactive.203232b0.png)}.icon.heating:hover{background-image:url(/img/button-heat-active.11767f6e.png)}.icon.status{background-image:url(/img/button-status-inactive.14ae4836.png)}.icon.status:hover{background-image:url(/img/button-status-active.0b348c61.png)}.icon.logs{background-image:url(/img/button-log-inactive.99122edf.png)}.icon.logs:hover{background-image:url(/img/button-log-active.32e4ed66.png)}.icon.statistics{background-image:url(/img/button-statistics-inactive.36a18eba.png)}.icon.statistics:hover{background-image:url(/img/button-statistics-active.ce07b267.png)}.icon.settings{background-image:url(/img/button-settings-inactive.8b067e70.png)}.icon.settings:hover{background-image:url(/img/button-settings-active.c9099757.png)}.icon .icon-title{position:absolute;bottom:0;left:0;right:0;text-align:center;background-color:#4289c6}@media only screen and (min-width:2800px){.icon .icon-title{font-size:1.5em;height:50px;line-height:50px}}@media only screen and (min-width:1280px) and (max-width:2799px){.icon .icon-title{font-size:1.3em;height:40px;line-height:40px}}@media only screen and (min-width:768px) and (max-width:1279px){.icon .icon-title{font-size:1.3em;height:30px;line-height:30px}}@media only screen and (min-width:360px) and (max-width:767px){.icon .icon-title{font-size:1.1em;height:30px;line-height:25px}}.component{padding:0;width:calc(100% - 40px);margin:70px 20px 20px 20px;color:#fff}div.qr-frame{position:relative;max-width:100%}div.qr-frame .scanarea{content:"";z-index:9;position:absolute;max-width:50%;width:500px;aspect-ratio:1;top:50%;left:50%;border:1px solid #4289c6;border-radius:15px;transform:translateX(-50%) translateY(-50%);overflow:hidden;background-image:url(/img/qr-code.a5bbd7d6.png);background-position:50%;background-size:contain}div.qr-frame .scanline{position:absolute;top:0;left:0;width:100%;height:30px;background:linear-gradient(transparent,#4289c6,transparent);opacity:.5;animation:scanning 1s linear infinite}@keyframes scanning{0%{transform:translatey(-50px)}to{transform:translatey(550px)}}.slidewrap{width:100%;position:relative;height:50px}.slidewrap .slideval{position:absolute}.slidewrap .slideval.label{left:50%;font-size:1.1em;top:-10px;transform:translateX(-50%);color:#4289c6}.slidewrap .slideval.min{left:0}.slidewrap .slideval.max{right:0}.slidecontainer{display:block}.slidecontainer,.slider{margin-top:30px;width:100%}.slider{-webkit-appearance:none;height:50px;border-radius:5px;background:transparent;outline:none;opacity:.7;transition:opacity .2s}.slider::-slider-thumb,.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;height:25px;border-radius:50%;background:transparent;cursor:pointer}.slider::-moz-range-thumb{width:25px;height:25px;border-radius:50%;background:transparent;cursor:pointer}div.status-boxes{padding-top:35px;display:grid;grid-template-columns:1fr 1fr 1fr}@media only screen and (min-width:768px) and (max-width:1279px){div.status-boxes{grid-template-columns:1fr 1fr}}@media only screen and (min-width:360px) and (max-width:767px){div.status-boxes{grid-template-columns:1fr}}div.status-box{position:relative;box-sizing:border-box;border:2px solid #fff;border-radius:15px;margin:10px;padding:20px;background-color:#fff}div.status-box:nth-child(2n){background-color:#ccc}div.status-box h2{background:#4289c6;border-radius:15px 15px 0 0;padding:40px 20px 10px;text-align:center;margin:-20px -20px 10px -20px}div.status-box .status-row{border-radius:5px;margin:0;display:grid;grid-template-columns:2fr 1fr;background-color:#2c2c2c}div.status-box .status-row:nth-child(2n){background-color:#0f0f0f}div.status-box .status-row .left{padding:10px 20px;border-right:1px solid #fff}div.status-box .status-row .right{padding:10px 20px}div.status-box div.status-icon{box-sizing:border-box;position:absolute;left:50%;top:-35px;z-index:9;transform:translateX(-50%);width:70px;aspect-ratio:1;background-color:#fff;border-radius:35px;background-size:60%;background-position:50%;background-repeat:no-repeat}div.status-box div.status-icon.floorheater{background-image:url(/img/floorheater.dd2d72a2.png)}div.status-box div.status-icon.heating{background-image:url(/img/heating.af3df111.png)}div.status-box div.status-icon.externalheating{background-image:url(/img/externalheating.ca4e00cd.png)}div.status-box div.status-icon.battery{background-image:url(/img/battery.04919173.png)}div.status-box div.status-icon.heatcontrol{background-image:url(/img/heatcontrol.cafdd28e.png);filter:saturate(0) brightness(70%) contrast(300%)}div.status-box div.status-icon.power{background-image:url(/img/power.79e657be.png)}*{box-sizing:border-box;margin:0;padding:0;font-family:rockwell}a{color:#fff;text-decoration:none;transition:all .2s ease}a:hover{background:#fff;color:#4289c6;padding:0 10px;border-radius:5px}body{background:linear-gradient(45deg,#1a1a1a,#2c3e50 70%);overflow:hidden;height:100vh;width:100vw}h1,h2,h3{margin-bottom:10px}p{margin:0 0 10px}.margin-top{margin-top:10px}.clearfix{clear:both}button{background:#4289c6;color:#fff;padding:5px 20px;cursor:pointer;transition:all .3s ease}button.fullsize{width:100%;font-size:1.2em}button:hover{color:#4289c6;background:#fff}