html,body{margin:0;padding:0;height:100%}#root{min-height:100%;position:relative}button.LogInOut,a.LogInOut{display:inline;background:none;color:inherit;border:none;padding:0;font:inherit;cursor:pointer;text-decoration:inherit}.wrap_column{width:100%;margin-top:0;margin-bottom:0}.centered_column{max-width:960px;margin:0 auto;padding:0 10px}.Header{height:48px;background-color:#1b1b1b;color:#fdd835;line-height:48px}.Header .left{margin:0;padding:0;display:inline-block;color:inherit;text-decoration:none}.Header h1{display:inline;font-size:28px;padding:0;margin:0}.Header .right a,.Header .right button{color:inherit;text-decoration:underline}.Header .logo{display:inline-block;vertical-align:top;padding:0;margin:5px 10px 5px 0;width:38px;height:38px;background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'%20standalone='no'?%3e%3csvg%20xmlns:dc='http://purl.org/dc/elements/1.1/'%20xmlns:cc='http://creativecommons.org/ns%23'%20xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'%20xmlns:svg='http://www.w3.org/2000/svg'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd'%20xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20version='1.1'%20id='svg6'%20sodipodi:docname='favicon-foreground.svg'%20inkscape:version='0.92.2%202405546,%202018-03-11'%3e%3cmetadata%20id='metadata12'%3e%3crdf:RDF%3e%3ccc:Work%20rdf:about=''%3e%3cdc:format%3eimage/svg+xml%3c/dc:format%3e%3cdc:type%20rdf:resource='http://purl.org/dc/dcmitype/StillImage'%20/%3e%3c/cc:Work%3e%3c/rdf:RDF%3e%3c/metadata%3e%3cdefs%20id='defs10'%20/%3e%3csodipodi:namedview%20pagecolor='%23ffffff'%20bordercolor='%23666666'%20borderopacity='1'%20objecttolerance='10'%20gridtolerance='10'%20guidetolerance='10'%20inkscape:pageopacity='0'%20inkscape:pageshadow='2'%20inkscape:window-width='832'%20inkscape:window-height='878'%20id='namedview8'%20showgrid='false'%20inkscape:zoom='13.906433'%20inkscape:cx='12.599366'%20inkscape:cy='9.5156892'%20inkscape:window-x='0'%20inkscape:window-y='20'%20inkscape:window-maximized='0'%20inkscape:current-layer='svg6'%20/%3e%3cpath%20d='M20%2010h-3V8.86c1.72-.45%203-2%203-3.86h-3V4c0-.55-.45-1-1-1H8c-.55%200-1%20.45-1%201v1H4c0%201.86%201.28%203.41%203%203.86V10H4c0%201.86%201.28%203.41%203%203.86V15H4c0%201.86%201.28%203.41%203%203.86V20c0%20.55.45%201%201%201h8c.55%200%201-.45%201-1v-1.14c1.72-.45%203-2%203-3.86h-3v-1.14c1.72-.45%203-2%203-3.86zm-8%209c-1.11%200-2-.9-2-2s.89-2%202-2c1.1%200%202%20.9%202%202s-.89%202-2%202zm0-5c-1.11%200-2-.9-2-2s.89-2%202-2c1.1%200%202%20.9%202%202s-.89%202-2%202zm0-5c-1.11%200-2-.9-2-2%200-1.11.89-2%202-2%201.1%200%202%20.89%202%202%200%201.1-.89%202-2%202z'%20id='path2'%20style='fill-opacity:1;fill:%23fdd835'%20/%3e%3cpath%20d='M0%200h24v24H0z'%20fill='none'%20id='path4'%20/%3e%3c/svg%3e");background-size:38px 38px}.Header .right{float:right;height:48px}@media (max-width: 540px){.Header{height:72px}.Header .left{display:block;line-height:38px;text-align:center}.Header h1{font-size:18px}.Header .logo{width:28px;height:28px;background-size:28px 28px}.Header .right{float:none;display:block;height:34px;line-height:34px;text-align:center}}@media (max-width: 270px){.Header{height:auto}}.ControlsMenu_wrapper{background:#444}.ControlsMenu{height:38px}.ControlsMenu a{text-decoration:none;text-align:center;background:#faa;color:#1b1b1b;height:26px;line-height:26px;min-width:80px;display:inline-block;margin:4px 4px 0;padding:4px 8px;border-width:0;border-radius:8px 8px 0 0}.ControlsMenu a:hover{background:#ffa}.ControlsMenu a.active{background:#afa}@media (max-width: 540px){.ControlsMenu{height:auto;margin-left:0;padding:4px 8px 0 0;overflow:auto}.ControlsMenu a{display:block;margin:0 0 4px;border-radius:0 8px 8px 0}}.TrafficLightState{background:#fdd835;border:2px solid #1b1b1b;padding:0}.TrafficLightState tbody,.TrafficLightState tr{margin:0;padding:0}.TrafficLightState td{width:16px;height:16px;border-radius:16px;border:2px solid #1b1b1b;background:#000}.TrafficLightState .red td{background:#400}.TrafficLightState .red td.on{background:red}.TrafficLightState .yellow td{background:#440}.TrafficLightState .yellow td.on{background:#ff0}.TrafficLightState .green td{background:#040}.TrafficLightState .green td.on{background:#0f0}.DeviceStatus{display:inline-block;background:#1b1b1b;color:#fdd835;padding:5px;border-radius:8px;min-width:330px;height:20px;line-height:20px}.DeviceStatus span{display:inline-block}.DeviceStatus .name{margin-right:10px}.DeviceStatus .id{font-family:monospace}.DeviceStatus .connection{width:16px;height:16px;border-radius:16px;border:2px solid #888;background:#000;vertical-align:top;margin-right:10px}.DeviceStatus .connection.offline{background:#044}.DeviceStatus .connection.connected{background:#0ff}.ControlButtons{text-align:center}.ControlButtons .title{height:28px;line-height:28px}.ControlButtons .title span{display:inline-block;font-size:12px;line-height:14px;vertical-align:middle}.ControlButtons button{width:30px;height:30px;border:2px solid #1b1b1b;margin:0 2px;border-radius:15px;padding:0;overflow:hidden}.ControlButtons .on{background:#ddd}.ControlButtons .off{background:#444}.ControlButtons .toggle div{float:left;width:13px;height:26px;margin:0}.red .ControlButtons .on{background:red}.red .ControlButtons .off{background:#400}.yellow .ControlButtons .on{background:#ff0}.yellow .ControlButtons .off{background:#440}.green .ControlButtons .on{background:#0f0}.green .ControlButtons .off{background:#040}.ControlButtons button:disabled,.ControlButtons button.on:disabled,.ControlButtons button.off:disabled,.ControlButtons button:disabled .on,.ControlButtons button:disabled .off{background:#222}table.ControlGrid{border-radius:24px;border:2px solid #1b1b1b;padding:5px;background:#fdd835;table-layout:fixed;margin-bottom:10px}.ControlGrid td{border-radius:16px;border:2px solid #1b1b1b;padding:5px;background:#999}.ControlGrid .red td{background:#977}.ControlGrid .yellow td{background:#997}.ControlGrid .green td{background:#797}.ManualMode table.ControlGrid{width:448px;height:448px}@media (max-width: 488px){.ManualMode table.ControlGrid{width:100%;height:auto}}@media (max-width: 540px){.SelectDevice .table_wrapper{overflow:scroll}}.SelectDevice th,.SelectDevice td{border:1px solid #000;padding:4px}.SelectDevice table{border-collapse:collapse}.Controls .device_status_wrap,.Controls .light_state_wrap{display:inline-block;vertical-align:middle;margin:5px}