@font-face{font-family:Anuphan;font-weight:400;src:url(/fonts/Anuphan-Regular.otf)}body{font-family:Anuphan}.app-header{-moz-box-shadow:0 1px 5px rgba(182,182,182,.75);-webkit-box-shadow:0 1px 5px rgba(182,182,182,.75);box-shadow:0 1px 5px #b6b6b6bf}.gm-style-iw.gm-style-iw-c{max-height:450px!important;max-width:100%!important;padding:0!important}.gm-ui-hover-effect{display:none!important}.gmnoprint,.gm-fullscreen-control{display:none}.zone-container{max-height:calc(100vh - 280px)}.sidebar-container{padding:0 1rem 1rem;display:flex;flex-direction:column;min-width:300px}.header-zone-single{display:none!important;padding:16px;background:#f5f5f5;-webkit-box-shadow:0px -3px 11px #d8d6d6;-moz-box-shadow:0px -3px 11px #d8d6d6;box-shadow:0 -3px 11px #d8d6d6}.zone-single-detail{max-height:calc(100vh - 280px)}.zone-menu-container{flex-grow:1;overflow:auto}.zone-single-menu-container{overflow:auto}.zone-single-menu-container::-webkit-scrollbar{width:6px}.zone-single-menu-container::-webkit-scrollbar-track{background-color:#fff}.zone-single-menu-container::-webkit-scrollbar-thumb{background:rgb(218,212,212);border-radius:20px}.zone-menu-container::-webkit-scrollbar{width:6px}.zone-menu-container::-webkit-scrollbar-track{background-color:#fff}.zone-menu-container::-webkit-scrollbar-thumb{background:rgb(218,212,212);border-radius:20px}.zoneControl-container{min-width:350px;padding:0 1rem 1rem;display:flex;flex-direction:column}.map-details{flex-grow:1}.bluedot-station{display:flex;width:40px;height:40px;border-radius:50%;background:#003cb6;justify-content:center;align-items:center;font-size:18px;color:#fff}.whitedot-station{display:flex;width:40px;height:40px;border-radius:50%;background:#ffffff;justify-content:center;align-items:center;font-size:16px;color:#000;border:solid 2px #cccccc}.title-no-margin{margin:0}.title-no-margin-top{margin-top:0}.title-margin-top{margin-top:5px}.gm-style-iw-t{bottom:60px!important}.sidebar-detail{display:block}.zone-single-detail{display:none!important}.map-toggle{min-width:130px;visibility:hidden;left:50%;transform:translate(-50%,-50%);bottom:35px;position:absolute;z-index:2;display:flex;padding:6px;border-radius:6px;background:#ffffff;justify-content:center;align-items:center;font-size:1.5rem;color:#000;cursor:pointer;border:solid 4px #ffffff;box-shadow:#0000003d 0 3px 8px}.tool-toggle{margin-left:12px;margin-top:12px;position:absolute;z-index:1;display:flex;width:40px;height:40px;border-radius:50%;background:#ffffff;justify-content:center;align-items:center;font-size:1.5rem;color:#000;cursor:pointer;border:solid 4px #ffffff}.tool-toggle :hover{border:solid 2px #ffffff}.control-toggle{visibility:visible;top:160px;position:absolute;right:12px;z-index:1;display:flex;width:40px;height:40px;border-radius:50%;background:#ffffff;justify-content:center;align-items:center;font-size:1.5rem;color:#000;cursor:pointer;border:solid 4px #ffffff}.control-toggle :hover{border:solid 2px #ffffff}.control-toggle .tooltip-text{visibility:hidden;width:120px;background-color:#000;color:#fff;text-align:center;padding:5px 0;border-radius:6px;position:absolute;z-index:1;right:160%}.control-toggle .tooltip-text:after{content:" ";position:absolute;top:50%;left:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent black}.control-toggle:hover .tooltip-text{visibility:visible}.filter-panel{position:absolute;width:280px;background:#ffffff;right:1%;bottom:15%;border-radius:10px}.public-toggle{visibility:visible;margin-right:12px;position:absolute;right:0;top:12px;z-index:1;display:flex;width:40px;height:40px;border-radius:50%;background:#ffffff;justify-content:center;align-items:center;font-size:1.5rem;color:#000;cursor:pointer;border:solid 4px #ffffff}.public-toggle :hover{border:solid 2px #ffffff}.public-toggle .tooltip-text{visibility:hidden;width:120px;background-color:#000;color:#fff;text-align:center;padding:5px 0;border-radius:6px;position:absolute;z-index:1;right:160%}.public-toggle .tooltip-text:after{content:" ";position:absolute;top:50%;left:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent black}.public-toggle:hover .tooltip-text{visibility:visible}.filter-toggle{visibility:visible;margin-right:12px;position:absolute;right:0;top:60px;z-index:1;display:flex;width:40px;height:40px;border-radius:50%;background:#ffffff;justify-content:center;align-items:center;font-size:1.5rem;color:#000;cursor:pointer;border:solid 4px #ffffff}.filter-toggle :hover{border:solid 2px #ffffff}.filter-toggle .tooltip-text{visibility:hidden;width:120px;background-color:#000;color:#fff;text-align:center;padding:5px 0;border-radius:6px;position:absolute;z-index:1;right:160%}.filter-toggle .tooltip-text:after{content:" ";position:absolute;top:50%;left:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent black}.filter-toggle:hover .tooltip-text{visibility:visible}.pin-toggle{visibility:visible;margin-right:12px;position:absolute;right:0;top:110px;z-index:1;display:flex;width:40px;height:40px;border-radius:50%;background:#ffffff;justify-content:center;align-items:center;font-size:1.5rem;color:#000;cursor:pointer;border:solid 4px #ffffff}.pin-toggle :hover{border:solid 2px #ffffff}.pin-toggle .tooltip-text{visibility:hidden;width:120px;background-color:#000;color:#fff;text-align:center;padding:5px 0;border-radius:6px;position:absolute;z-index:1;right:160%}.pin-toggle .tooltip-text:after{content:" ";position:absolute;top:50%;left:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent transparent transparent black}.pin-toggle:hover .tooltip-text{visibility:visible}.btn-default{width:100%}.manual-control-circle{width:80px;height:80px;border-radius:50%;background-color:#222;border:4px solid #fff;box-shadow:0 0 2px 7px #222;display:flex;justify-content:center;align-items:center;color:#fff;font-size:48px}.manual-control-circle-active{width:80px;height:80px;border-radius:50%;background-color:#222;border:4px solid #fff;display:flex;justify-content:center;align-items:center;color:#fff;font-size:48px;box-shadow:0 0 2px 3px #222;transform:translateY(2px)}.manual-control-circle:active{box-shadow:0 0 2px 3px #222;transform:translateY(2px)}.auto-control-circle{width:80px;height:80px;border-radius:50%;background-color:#427aea;border:4px solid #fff;box-shadow:0 0 2px 7px #427aea;display:flex;justify-content:center;align-items:center;color:#fff;font-size:48px}.auto-control-circle:active{box-shadow:0 0 2px 3px #427aea;transform:translateY(2px)}.auto-control-circle-active{width:80px;height:80px;border-radius:50%;background-color:#427aea;border:4px solid #fff;display:flex;justify-content:center;align-items:center;color:#fff;font-size:48px;box-shadow:0 0 2px 3px #427aea;transform:translateY(2px)}.start-control-circle{width:80px;height:80px;border-radius:50%;background-color:#00b21e;border:4px solid #fff;display:flex;justify-content:center;align-items:center;color:#fff;font-size:24px;box-shadow:0 0 2px 7px #00b21e;transition:all .2s ease}.start-control-circle-active{width:80px;height:80px;border-radius:50%;background-color:#00b21e;border:4px solid #fff;display:flex;justify-content:center;align-items:center;color:#fff;font-size:24px;transition:all .2s ease;box-shadow:0 0 2px 3px #00b21e;transform:translateY(2px)}.start-control-circle:active{box-shadow:0 0 2px 3px #00b21e;transform:translateY(2px)}.stop-control-circle{width:80px;height:80px;border-radius:50%;background-color:#b90000;border:4px solid #fff;box-shadow:0 0 2px 7px #b90000;display:flex;justify-content:center;align-items:center;color:#fff;font-size:24px;transition:all .2s ease}.stop-control-circle-active{width:80px;height:80px;border-radius:50%;background-color:#b90000;border:4px solid #fff;display:flex;justify-content:center;align-items:center;color:#fff;font-size:24px;box-shadow:0 0 2px 3px #b90000;transform:translateY(2px)}.stop-control-circle:active{box-shadow:0 0 2px 3px #b90000;transform:translateY(2px)}.repeat-control-circle{width:80px;height:80px;border-radius:50%;background-color:#222;border:4px solid #fff;box-shadow:0 0 2px 7px #222;display:flex;justify-content:center;align-items:center;color:#fff}.repeat-control-circle-active{width:80px;height:80px;border-radius:50%;background-color:#222;border:4px solid #fff;display:flex;justify-content:center;align-items:center;color:#fff;box-shadow:0 0 2px 3px #222;transform:translateY(2px)}.repeat-control-circle:active{box-shadow:0 0 2px 3px #222;transform:translateY(2px)}.box-grid-center{display:flex;height:100%;flex-direction:column;justify-content:center;align-items:center;border:solid 2px #dddddd;border-radius:10px;padding-top:1rem;padding-bottom:1rem}.box-grid{display:flex;height:100%;flex-direction:column;background:#f5f5f5;border:solid 2px #dddddd;border-radius:10px}.ant-list{height:100%;width:100%;border:none!important}.ant-list-items{overflow:auto;max-height:300px}.border{position:relative;border:5px solid #2ecee3;height:260px;width:260px;border-radius:50%}.circle{transform:translateY(1%);height:250px;width:250px;border:5px solid white;position:relative;border-radius:50%}.circle-fill{position:absolute;height:100%;width:100%;border-radius:50%;color:"white"}.circle-fill-text{position:absolute;top:75%;left:50%;transform:translate(-50%,-20%);color:#000}.label{position:absolute;bottom:0;right:-20px}.label:before{content:"";display:inline-block;position:absolute;top:50%;right:100%;width:20px;height:1px;background-color:#000;transform:translateY(-50%)}.l80{bottom:72%}.l70{bottom:62%}.l55{bottom:49%}.l20{bottom:16%}.station-layout{padding:1rem 2rem}.btn-device{display:flex;overflow:auto}.close-sidebar{visibility:hidden}.blink{animation:blinker 2s linear infinite}@keyframes blinker{50%{opacity:0}}@media only screen and (max-width: 380px){.close-sidebar{visibility:visible}}@media only screen and (max-width: 992px){.header-zone-single{display:flex!important}.sidebar-detail{display:none}.zone-single-detail{display:flex!important}.map-toggle{visibility:visible}}