body,html{margin:0;padding:0;height:100%;background-color:#161616}@font-face{font-family:"archia";src:local("archia"),url(/static/media/archia-medium-webfont.d147df6d.woff2) format("woff")}@font-face{font-family:"archia-semibold";src:local("archia-semibold"),url(/static/media/archia-semibold-webfont.fc74be97.woff2) format("woff")}@font-face{font-family:"archia-bold";src:local("archia-bold"),url(/static/media/archia-bold-webfont.6e1d0e0d.woff2) format("woff")}:focus{outline:none}@-webkit-keyframes spinAround{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes spinAround{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.loader:after{-webkit-animation:spinAround .5s linear infinite;animation:spinAround .5s linear infinite;border-radius:290486px;border-color:transparent transparent #dbdbdb #dbdbdb;border-style:solid;border-width:2px;content:"";display:block;height:1em;position:relative;width:1em}.loader{color:transparent!important;pointer-events:none;display:flex;justify-content:center}.App .main-container{padding:20px 40px;background-color:#161616}.App .connection-container{display:flex;height:30vh;justify-content:center;align-items:center;flex-direction:column}.App .connection-container button{background-color:#373737;color:#fff;height:40px;width:200px;font-size:18px;border:none;font-family:"archia-bold";border-radius:5px;box-shadow:0 4px 19px rgba(0,0,0,.42);transition:all .3s ease-in-out;cursor:pointer}.App .connection-container button:hover{-webkit-transform:scale(1.05);transform:scale(1.05);box-shadow:0 4px 19px 4px rgba(0,0,0,.42)}.App .connection-container input{margin-bottom:30px;width:40%;height:70px;font-size:2vw;background-color:#373737;color:#fff;border-radius:5px;border:2px solid rgba(82,82,82,0);font-family:"archia-semibold";padding-left:7px;transition:border .15s ease-in-out;box-shadow:0 4px 19px 2px rgba(0,0,0,.1)}.App .connection-container input:focus{border:2px solid #525252}.row{display:flex}.column{flex:50% 1}.header{height:70px;background-color:#1b1b1b;font-family:"archia-bold";color:#fff;display:flex;align-items:center;padding-left:40px;font-size:18px}.header .header-content{width:100%;display:flex;align-items:center;justify-content:space-between}.header .header-content .left{display:flex;align-items:center;flex:1 1}.header .header-content .left img{width:42px;height:42px;margin-right:8px}.header .header-content .left .status{display:flex;align-items:center;font-size:12px;font-family:"archia";color:#6d7688}.header .header-content .left .status .status-icon{width:6px;height:6px;border-radius:50%;margin-right:4px}.header .header-content .left .status .status-icon.green{background-color:#adff2f}.header .header-content .left .status .status-icon.red{background-color:#eb3538}.header .header-content .center{color:#8492a4;font-size:24px}.header .header-content .right{flex:1 1}.charts-container .top-bar{margin-bottom:30px}.charts-container .top-bar .left .title{font-family:"archia-semibold";font-size:30px;color:#fff}.charts-container .top-bar .left .subtitle{font-family:"archia";font-size:16px;color:#6d7688}.charts-container .chart{background-color:#1b1b1b;box-shadow:0 4px 19px rgba(0,0,0,.22);border-radius:8px;margin-right:20px;margin-bottom:20px;padding:20px;position:relative;z-index:10}.charts-container .chart .title{font-family:"archia-bold";font-size:30px;color:#fff;margin-bottom:22px}.charts-container .chart canvas{width:100%!important;height:100%!important}.charts-container .bottom-lables{height:160px;margin-top:-45px;position:relative;z-index:0;display:flex}.charts-container .bottom-lables .title{font-size:16px;font-family:"archia-semibold";color:#b4b4b4;margin-bottom:7px}.charts-container .bottom-lables .badge{width:150px;height:90px;background-color:#1b1b1b;padding:35px 15px 15px;border-radius:8px;margin-left:30px}.charts-container .bottom-lables .badge .value{font-size:36px;font-family:"archia-bold";color:#fff}.charts-container .bottom-lables .badge .value .unit{font-size:18px;font-family:"archia";color:#fff}.charts-container .bottom-lables .badge .trend{display:flex;align-items:center}.charts-container .bottom-lables .badge .trend svg{width:21px;height:21px;color:#eb3538;margin-right:5px}.charts-container .bottom-lables .badge .trend .value{font-family:"archia";font-size:13px;color:#eb3538}.charts-container .bottom-lables .badge.realtime-status{width:240px}.charts-container .bottom-lables .badge.realtime-status .status-container{display:flex;align-items:center}.charts-container .bottom-lables .badge.realtime-status .status-container .status-icon{background-color:#ffb600;height:40px;display:flex;align-items:center;justify-content:center;border-radius:4px;margin-right:10px}.charts-container .bottom-lables .badge.realtime-status .status-container .status-icon svg{width:30px;height:30px;margin-left:5px;margin-right:5px;stroke-width:3}.charts-container .bottom-lables .badge.realtime-status .status-container .status .title{font-size:20px;font-family:"archia-bold";color:#ffb600;margin-bottom:3px}.charts-container .bottom-lables .badge.realtime-status .status-container .status .sub-title{font-size:12px;color:#c0c7ce;font-family:"archia"}
/*# sourceMappingURL=main.4c8db53c.chunk.css.map */