-
Notifications
You must be signed in to change notification settings - Fork 0
/
chat.css
1 lines (1 loc) · 41.9 KB
/
chat.css
1
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;line-height:1}form{margin:0}fieldset{margin:0;padding:0;border:0}button,input,select,textarea{font-size:100%;font-family:inherit;margin:0;padding:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal;overflow:visible}textarea{overflow:auto;vertical-align:top;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}:focus{outline:none}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}figure{margin:0}img{-ms-interpolation-mode:bicubic;display:block}ol,ul{margin:0;padding:0}dl,dd{margin:0}li{display:block;padding:0;margin:0;list-style:none}h1,h2,h3,h4,h5,h6{font-weight:inherit;line-height:inherit;font-size:inherit;margin:0}p{margin:0}blockquote{margin:0}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word;margin:0;font-family:inherit;font-size:inherit}cite{font-style:normal}ins{text-decoration:none}dfn{font-style:inherit}del{text-decoration:none}mark{background:none;color:inherit}address{font-style:normal}tt,code,kbd,samp{font-family:inherit;font-size:inherit}b,strong{font-weight:inherit}em{font-style:inherit}small{font-size:100%}q{quotes:none}q:before,q:after{content:'';content:none}a{font-weight:inherit;color:inherit;text-decoration:none}a:hover,a:active{outline:none}a img{border:none}sub,sup{font-size:75%;line-height:0;position:relative}sup{top:-0.5em}sub{bottom:-0.25em}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}table{border-collapse:collapse;border-spacing:0}th{font-weight:inherit}.ps{overflow:hidden !important;overflow-anchor:none;-ms-overflow-style:none;touch-action:auto;-ms-touch-action:auto}.ps__rail-x{display:none;opacity:0;transition:background-color .2s linear, opacity .2s linear;-webkit-transition:background-color .2s linear, opacity .2s linear;height:15px;bottom:0px;position:absolute}.ps__rail-y{display:none;opacity:0;transition:background-color .2s linear, opacity .2s linear;-webkit-transition:background-color .2s linear, opacity .2s linear;width:15px;right:0;position:absolute}.ps--active-x>.ps__rail-x,.ps--active-y>.ps__rail-y{display:block;background-color:transparent}.ps:hover>.ps__rail-x,.ps:hover>.ps__rail-y,.ps--focus>.ps__rail-x,.ps--focus>.ps__rail-y,.ps--scrolling-x>.ps__rail-x,.ps--scrolling-y>.ps__rail-y{opacity:1}.ps__rail-x:hover,.ps__rail-y:hover,.ps__rail-x:focus,.ps__rail-y:focus{background-color:transparent;opacity:1}.ps__thumb-x{background-color:#aaa;border-radius:6px;transition:background-color .2s linear, height .2s ease-in-out;-webkit-transition:background-color .2s linear, height .2s ease-in-out;height:6px;bottom:2px;position:absolute}.ps__thumb-y{background-color:#445661;border-radius:6px;transition:background-color .2s linear, width .2s ease-in-out;-webkit-transition:background-color .2s linear, width .2s ease-in-out;width:6px;right:2px;position:absolute}.ps__thumb-y:hover{background-color:#59717f}.ps__rail-x:hover>.ps__thumb-x,.ps__rail-x:focus>.ps__thumb-x{height:11px}.ps__rail-y:hover>.ps__thumb-y,.ps__rail-y:focus>.ps__thumb-y{width:11px}@supports (-ms-overflow-style: none){.ps{overflow:auto !important}}@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){.ps{overflow:auto !important}}.connecting-view button,.disconnected-view button,.dialog button,.room-view>.container button,.dialog .file-btn label,.room-view>.container .file-btn label,.chatbox-view>.input button,.game-view>.bottom-section button,.room-view button,.room-view button[data-hook="start-btn"],.room-view button[data-hook="stop-btn"],.replay-controls-view button{position:relative;padding:5px 15px;border:0;border-radius:5px;color:white;font-family:'Open Sans', sans-serif;font-weight:700;font-size:15px;line-height:100%}.connecting-view button:focus,.disconnected-view button:focus,.dialog button:focus,.dialog .file-btn label:focus,.room-view>.container .file-btn label:focus,.chatbox-view>.input button:focus,.game-view>.bottom-section button:focus,.room-view button:focus,.replay-controls-view button:focus{outline:none}.connecting-view button .tooltip,.disconnected-view button .tooltip,.dialog button .tooltip,.dialog .file-btn label .tooltip,.room-view>.container .file-btn label .tooltip,.chatbox-view>.input button .tooltip,.game-view>.bottom-section button .tooltip,.room-view button .tooltip,.replay-controls-view button .tooltip{visibility:hidden;background-color:rgba(0,0,0,0.8);color:#fff;text-align:center;padding:6px 12px;border-radius:6px;font-weight:500;position:absolute;z-index:1;bottom:130%;right:0%;opacity:0;transition:opacity 0s}.connecting-view button:hover .tooltip,.disconnected-view button:hover .tooltip,.dialog button:hover .tooltip,.dialog .file-btn label:hover .tooltip,.room-view>.container .file-btn label:hover .tooltip,.chatbox-view>.input button:hover .tooltip,.game-view>.bottom-section button:hover .tooltip,.room-view button:hover .tooltip,.replay-controls-view button:hover .tooltip{visibility:visible;opacity:1;transition:opacity .5s;transition-delay:1s}.connecting-view button{background-color:#DB2A2A}.connecting-view button:hover{background-color:#e14d4d}.connecting-view button:active{background-color:#bc2020}.connecting-view button:disabled{background-color:#3e3e3e}.disconnected-view button{background-color:#44D}.disconnected-view button:hover{background-color:#6767e3}.disconnected-view button:active{background-color:#2626d2}.disconnected-view button:disabled{background-color:#3e3e3e}.dialog input,.room-view>.container input{color:white;background-color:#111619;border:none;border-radius:5px;padding:0 10px;box-sizing:border-box;border:1px solid #111619}.dialog input:focus,.room-view>.container input:focus{border-color:#244967}.dialog,.room-view>.container{background-color:#1a212500;display:flex;flex-direction:column;align-items:stretch;padding:10px;overflow:hidden;box-sizing:border-box;border-radius:5px}.dialog>h1,.room-view>.container>h1{font-size:20px;font-weight:600;margin-bottom:20px !important;padding-top:6px;padding-bottom:5px;border-bottom:3px;border-bottom-color:#c13535;border-bottom-style:solid}.dialog>:not(:last-child),.room-view>.container>:not(:last-child){margin-bottom:6px}.dialog .row,.room-view>.container .row{display:flex}.dialog .row>:not(:last-child),.room-view>.container .row>:not(:last-child){margin-right:6px}.dialog .row>*,.room-view>.container .row>*{flex:1}.dialog button,.room-view>.container button{background-color:#244967}.dialog button:hover,.room-view>.container button:hover{background-color:#2f5e85}.dialog button:active,.room-view>.container button:active{background-color:#193449}.dialog button:disabled,.room-view>.container button:disabled{background-color:#3e3e3e}.dialog input,.room-view>.container input{min-width:10px}.dialog .label-input,.room-view>.container .label-input{display:flex;background-color:#244967;align-items:baseline;border-radius:5px;padding:3px 3px 3px 5px}.dialog .label-input>*,.room-view>.container .label-input>*{flex:1}.dialog .label-input label,.room-view>.container .label-input label{flex:0 0 auto;margin-right:10px}.dialog .file-btn input[type="file"],.room-view>.container .file-btn input[type="file"]{display:none}.dialog .file-btn label,.room-view>.container .file-btn label{box-sizing:border-box;width:100%;text-align:center;background-color:#244967;display:inline-block;cursor:pointer}.dialog .file-btn label:hover,.room-view>.container .file-btn label:hover{background-color:#2f5e85}.dialog .file-btn label:active,.room-view>.container .file-btn label:active{background-color:#193449}.dialog .file-btn label:disabled,.room-view>.container .file-btn label:disabled{background-color:#3e3e3e}.dialog select,.room-view>.container select{border:1px solid #111619;background-color:#111619;border-radius:5px;-webkit-appearance:none;-moz-appearance:none;appearance:none;color:white;padding:0px 5px}.dialog select:hover:not(:disabled),.room-view>.container select:hover:not(:disabled){border-color:#244967}.basic-dialog .buttons{margin-top:10px;display:flex}.basic-dialog .buttons>:not(:last-child){margin-right:6px}.basic-dialog .buttons>*{flex:1;white-space:nowrap}.basic-dialog p{line-height:1.4em}.simple-dialog-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;flex-direction:column;align-items:center}.simple-dialog-view>.dialog,.room-view.simple-dialog-view>.container{min-width:300px}.view-wrapper{position:absolute;width:100%;height:calc(100% - 10px);margin-top:5px;display:flex;justify-content:center;align-items:center}.spinner{margin:20px auto;width:50px;height:40px;display:flex;justify-content:center}.spinner>div{background-color:white;height:100%;width:6px;margin:2px 2px;animation:sk-stretchdelay 1.2s infinite ease-in-out}.spinner .rect2{animation-delay:-1.1s}.spinner .rect3{animation-delay:-1.0s}.spinner .rect4{animation-delay:-0.9s}.spinner .rect5{animation-delay:-0.8s}@keyframes sk-stretchdelay{0%, 40%, 100%{transform:scaleY(0.4)}20%{transform:scaleY(1)}}.flagico{width:16px;height:11px;background-image:url("images/flags.png");display:inline-block;background-position:-80px -198px}.f-id{background-position:0px 0px}.f-qa{background-position:-16px 0px}.f-ge{background-position:-32px 0px}.f-al{background-position:-48px 0px}.f-ao{background-position:-64px 0px}.f-gi{background-position:-96px 0px}.f-mt{background-position:-112px 0px}.f-tn{background-position:-128px 0px}.f-bh{background-position:-144px 0px}.f-tr{background-position:-160px 0px}.f-ye{background-position:-176px 0px}.f-pl{background-position:-192px 0px}.f-lv{background-position:0px -11px}.f-pe{background-position:-16px -11px}.f-jp{background-position:-32px -11px}.f-tt{background-position:-48px -11px}.f-pg{background-position:-64px -11px}.f-gl{background-position:-80px -11px}.f-mc{background-position:-96px -11px}.f-ch{background-position:-112px -11px}.f-ma{background-position:-128px -11px}.f-at{background-position:-144px -11px}.f-cn{background-position:-160px -11px}.f-kg{background-position:-176px -11px}.f-vn{background-position:-192px -11px}.f-dk{background-position:0px -22px}.f-sg{background-position:-16px -22px}.f-to{background-position:-32px -22px}.f-tl{background-position:-48px -22px}.f-cy{background-position:-64px -22px}.f-sy{background-position:-80px -22px}.f-eg{background-position:-96px -22px}.f-mk{background-position:-112px -22px}.f-hk{background-position:-128px -22px}.f-lb{background-position:-144px -22px}.f-pf{background-position:-160px -22px}.f-wf{background-position:-176px -22px}.f-be{background-position:-192px -22px}.f-no{background-position:0px -33px}.f-bv{background-position:-16px -33px}.f-sj{background-position:-32px -33px}.f-ug{background-position:-48px -33px}.f-es{background-position:-64px -33px}.f-tj{background-position:-80px -33px}.f-ae{background-position:-96px -33px}.f-lr{background-position:-112px -33px}.f-sd{background-position:-128px -33px}.f-it{background-position:-144px -33px}.f-de{background-position:-176px -33px}.f-mv{background-position:-192px -33px}.f-ag{background-position:0px -44px}.f-om{background-position:-16px -44px}.f-bt{background-position:-32px -44px}.f-jo{background-position:-48px -44px}.f-hu{background-position:-64px -44px}.f-va{background-position:-80px -44px}.f-pt{background-position:-96px -44px}.f-gp{background-position:-112px -44px}.f-cl{background-position:-128px -44px}.f-kw{background-position:-144px -44px}.f-ps{background-position:-160px -44px}.f-mg{background-position:-176px -44px}.f-ci{background-position:-192px -44px}.f-bn{background-position:0px -55px}.f-ie{background-position:-16px -55px}.f-af{background-position:-32px -55px}.f-eh{background-position:-48px -55px}.f-gd{background-position:-64px -55px}.f-vu{background-position:-80px -55px}.f-ne{background-position:-96px -55px}.f-lt{background-position:-112px -55px}.f-mw{background-position:-128px -55px}.f-by{background-position:-144px -55px}.f-bo{background-position:-160px -55px}.f-kn{background-position:-176px -55px}.f-bg{background-position:-192px -55px}.f-cg{background-position:0px -66px}.f-ml{background-position:-16px -66px}.f-sn{background-position:-32px -66px}.f-ir{background-position:-48px -66px}.f-yt{background-position:-64px -66px}.f-zw{background-position:-80px -66px}.f-bf{background-position:-96px -66px}.f-fo{background-position:-112px -66px}.f-cm{background-position:-128px -66px}.f-jm{background-position:-144px -66px}.f-cz{background-position:-160px -66px}.f-gh{background-position:-176px -66px}.f-dz{background-position:-192px -66px}.f-bj{background-position:0px -77px}.f-iq{background-position:-16px -77px}.f-my{background-position:-48px -77px}.f-gn{background-position:-64px -77px}.f-tg{background-position:-80px -77px}.f-gw{background-position:-96px -77px}.f-fr{background-position:-112px -77px}.f-gf{background-position:-128px -77px}.f-re{background-position:-144px -77px}.f-an{background-position:-160px -77px}.f-um{background-position:-176px -77px}.f-tv{background-position:-192px -77px}.f-il{background-position:0px -88px}.f-bd{background-position:-16px -88px}.f-tw{background-position:-32px -88px}.f-am{background-position:-48px -88px}.f-st{background-position:-64px -88px}.f-ws{background-position:-80px -88px}.f-lu{background-position:-96px -88px}.f-bi{background-position:-112px -88px}.f-pa{background-position:-128px -88px}.f-ec{background-position:-144px -88px}.f-np{background-position:-160px -88px}.f-vi{background-position:-176px -88px}.f-rs{background-position:-192px -88px}.f-dm{background-position:0px -99px}.f-gq{background-position:-16px -99px}.f-us{background-position:-32px -99px}.f-mz{background-position:-48px -99px}.f-bm{background-position:-64px -99px}.f-gy{background-position:-80px -99px}.f-ee{background-position:-96px -99px}.f-nu{background-position:-112px -99px}.f-mm{background-position:-128px -99px}.f-zm{background-position:-144px -99px}.f-ng{background-position:-160px -99px}.f-ro{background-position:-176px -99px}.f-hr{background-position:-192px -99px}.f-md{background-position:0px -110px}.f-et{background-position:-16px -110px}.f-mn{background-position:-32px -110px}.f-tm{background-position:-48px -110px}.f-sc{background-position:-64px -110px}.f-cs{background-position:-80px -110px}.f-pr{background-position:-96px -110px}.f-ad{background-position:-112px -110px}.f-kr{background-position:-128px -110px}.f-nf{background-position:-144px -110px}.f-ls{background-position:-160px -110px}.f-km{background-position:-176px -110px}.f-sz{background-position:-192px -110px}.f-py{background-position:0px -121px}.f-tz{background-position:-16px -121px}.f-in{background-position:-32px -121px}.f-sa{background-position:-48px -121px}.f-pk{background-position:-64px -121px}.f-cf{background-position:-80px -121px}.f-gm{background-position:-96px -121px}.f-ki{background-position:-112px -121px}.f-do{background-position:-128px -121px}.f-lk{background-position:-144px -121px}.f-cc{background-position:-160px -121px}.f-co{background-position:-176px -121px}.f-th{background-position:-192px -121px}.f-bs{background-position:0px -132px}.f-mr{background-position:-16px -132px}.f-bw{background-position:-32px -132px}.f-br{background-position:-48px -132px}.f-mo{background-position:-64px -132px}.f-li{background-position:-80px -132px}.f-ve{background-position:-96px -132px}.f-kp{background-position:-112px -132px}.f-sr{background-position:-128px -132px}.f-cr{background-position:-144px -132px}.f-ly{background-position:-160px -132px}.f-vc{background-position:-176px -132px}.f-ph{background-position:-192px -132px}.f-ke{background-position:0px -143px}.f-td{background-position:-16px -143px}.f-ht{background-position:-32px -143px}.f-az{background-position:-48px -143px}.f-mu{background-position:-64px -143px}.f-er{background-position:-80px -143px}.f-si{background-position:-96px -143px}.f-kh{background-position:-112px -143px}.f-is{background-position:-128px -143px}.f-mx{background-position:-144px -143px}.f-rw{background-position:-160px -143px}.f-za{background-position:-176px -143px}.f-ua{background-position:-192px -143px}.f-as{background-position:0px -154px}.f-ax{background-position:-16px -154px}.f-dj{background-position:-32px -154px}.f-ga{background-position:-48px -154px}.f-sl{background-position:-64px -154px}.f-sm{background-position:-80px -154px}.f-sk{background-position:-96px -154px}.f-se{background-position:-112px -154px}.f-sb{background-position:-128px -154px}.f-ca{background-position:-144px -154px}.f-ru{background-position:-160px -154px}.f-gb{background-position:-176px -154px}.f-me{background-position:-192px -154px}.f-pm{background-position:0px -165px}.f-sct{background-position:-16px -165px}.f-la{background-position:-32px -165px}.f-ar{background-position:-48px -165px}.f-na{background-position:-64px -165px}.f-cv{background-position:-80px -165px}.f-nc{background-position:-96px -165px}.f-cu{background-position:-112px -165px}.f-uz{background-position:-128px -165px}.f-bb{background-position:-144px -165px}.f-bz{background-position:-160px -165px}.f-ni{background-position:-176px -165px}.f-gu{background-position:-192px -165px}.f-fi{background-position:0px -176px}.f-kz{background-position:-16px -176px}.f-gt{background-position:-32px -176px}.f-cx{background-position:-48px -176px}.f-aw{background-position:-64px -176px}.f-cd{background-position:-80px -176px}.f-nl{background-position:-96px -176px}.f-ba{background-position:-112px -176px}.f-sv{background-position:-128px -176px}.f-uy{background-position:-144px -176px}.f-pw{background-position:-160px -176px}.f-tk{background-position:-176px -176px}.f-mq{background-position:-192px -176px}.f-nr{background-position:0px -187px}.f-mp{background-position:-16px -187px}.f-hn{background-position:-32px -187px}.f-mh{background-position:-48px -187px}.f-tf{background-position:-64px -187px}.f-gs{background-position:-80px -187px}.f-lc{background-position:-96px -187px}.f-gr{background-position:-112px -187px}.f-fm{background-position:-128px -187px}.f-fam{background-position:-144px -187px}.f-ck{background-position:-160px -187px}.f-ky{background-position:-176px -187px}.f-io{background-position:-192px -187px}.f-so{background-position:0px -198px}.f-pn{background-position:-16px -198px}.f-tc{background-position:-32px -198px}.f-sh{background-position:-48px -198px}.f-fj{background-position:-64px -198px}.f-ai{background-position:-96px -198px}.f-vg{background-position:-112px -198px}.f-fk{background-position:-128px -198px}.f-ms{background-position:-144px -198px}.f-hm{background-position:-160px -198px}.f-au{background-position:-176px -198px}.f-nz{background-position:-192px -198px}.chatbox-view{display:flex;flex-direction:column;height:150px;width:800px;min-width:300px;padding:5px;position:relative}@media (max-height: 700px){.chatbox-view{height:130px}}.chatbox-view>:not(:first-child){margin-top:5px}.chatbox-view>.log{flex-grow:1;overflow:hidden;line-height:1.3}.chatbox-view>.log>p:not(:last-child){margin-bottom:3px}.chatbox-view>.log p{overflow:hidden}.chatbox-view>.log p.notice{color:#8ed2ab}.chatbox-view>.log p.highlight{font-weight:bold}.chatbox-view>.log p.announcement{border-left:3px solid #c13535;padding-left:5px;min-height:12px;white-space:pre-wrap}.chatbox-view>.autocompletebox{position:absolute;background-color:white;line-height:25px;color:black;bottom:30px;left:5px;border:solid black 1px;overflow-y:auto;overflow-x:hidden;max-height:200px}.chatbox-view>.autocompletebox>div{padding:0px 30px 0px 5px;white-space:nowrap}.chatbox-view>.autocompletebox>div:hover{background-color:#d1e2fe}.chatbox-view>.autocompletebox>div.selected{background-color:#b3c6ff}.chatbox-view>.input{display:flex;flex-direction:row;flex-shrink:0}.chatbox-view>.input input[type="text"]{color:white;background-color:#111619;border:none;border-radius:5px;padding:0 10px;margin-right:4px;flex-grow:1;align-self:stretch;box-sizing:border-box}.chatbox-view>.input input[type="text"]:focus{border:1px solid #244967;padding:0 7px}.chatbox-view>.input button{background-color:#244967}.chatbox-view>.input button:hover{background-color:#2f5e85}.chatbox-view>.input button:active{background-color:#193449}.chatbox-view>.input button:disabled{background-color:#3e3e3e}.replayer .chatbox-view{height:130px}.replayer .chatbox-view>.input{display:none}.connecting-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.connecting-view .dialog,.connecting-view .room-view>.container{height:300px;width:300px}.connecting-view button{width:auto;align-self:flex-end}.connecting-view-log{flex:1}.connecting-view-log p{margin:3px 0}.disconnected-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.disconnected-view .dialog,.disconnected-view .room-view>.container{width:300px}.disconnected-view .dialog>p,.disconnected-view .room-view>.container>p{margin-bottom:20px}.disconnected-view button{width:auto;align-self:flex-end}.game-view{position:absolute;width:100vw;height:100vh;overflow:hidden;display:flex;flex-direction:column;align-items:stretch}.game-view>.top-section{position:relative;flex-grow:1;min-height:0}.game-view>.bottom-section{flex-shrink:0;display:flex;justify-content:center;background-color:#1a212500}.game-view>.bottom-section>.buttons{padding:6px;white-space:nowrap;margin-right:auto;display:flex;flex-direction:column}.game-view>.bottom-section>.buttons>:not(:last-child){margin-bottom:6px}.game-view>.bottom-section button{background-color:#244967}.game-view>.bottom-section button:hover{background-color:#2f5e85}.game-view>.bottom-section button:active{background-color:#193449}.game-view>.bottom-section button:disabled{background-color:#3e3e3e}.game-view>.bottom-section .stats-view{margin-right:auto}.game-view.replayer>.bottom-section{padding-bottom:40px}.game-view>[data-hook="popups"]{z-index:2;position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:rgba(115,136,92,0.5)}.loader-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.loader-view .dialog,.loader-view .room-view>.container{width:300px}.stats-view{background-color:#1a212500;padding:5px;margin:0 5px;white-space:nowrap;flex:0 0 100px;overflow:hidden;line-height:1.5em}.stats-view .graph{width:100%}.stats-view .graph canvas{width:100%;height:64px;image-rendering:optimizeSpeed;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:pixelated;-ms-interpolation-mode:nearest-neighbor}.choose-nickname-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;flex-direction:column;align-items:center}.choose-nickname-view>img{flex:0 0 auto;position:relative;left:20px;margin-bottom:20px}.choose-nickname-view>.dialog,.room-view.choose-nickname-view>.container{width:300px}.choose-nickname-view>.dialog>[data-hook=ok],.room-view.choose-nickname-view>.container>[data-hook=ok]{align-self:center;width:100px}.game-timer-view{display:flex;align-items:center}.game-timer-view>.overtime{margin-right:20px;visibility:hidden}.game-timer-view>.overtime.on{visibility:visible;animation:0.4s linear overtime-appear}.game-timer-view>.digit{width:15px;text-align:center}.game-timer-view.time-warn{animation:0.3s infinite alternate linear time-warn}@keyframes time-warn{from{color:white}to{color:#ff8080}}@keyframes overtime-appear{from{opacity:0;transform:translateY(-25px)}}.game-state-view{position:absolute;width:100%;height:100%}.game-state-view .bar-container{position:absolute;top:0;width:100%;display:flex;justify-content:center;z-index:1}.game-state-view .bar{display:flex;justify-content:center;background-color:#1a212500;padding:5px;border-radius:0 0 5px 5px;font:900 20px Arial Black,Arial Bold,Gadget,sans-serif}.game-state-view .bar>.scoreboard{display:flex;align-items:center;margin-right:100px}.game-state-view .bar>.scoreboard .score{width:35px;overflow:hidden;text-align:center}.game-state-view .bar>.scoreboard .teamicon{width:23px;height:23px;border-radius:5px}.game-state-view .bar>.scoreboard .teamicon.blue{background-color:#5689E5}.game-state-view .bar>.scoreboard .teamicon.red{background-color:#E56E56}.game-state-view canvas{width:100%;height:100%;image-rendering:optimizeSpeed;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:pixelated;-ms-interpolation-mode:nearest-neighbor}.game-state-view.restricted{background-color:#2e343c;display:flex;flex-direction:column;align-items:center;justify-content:center}.game-state-view.restricted .bar-container{position:relative;height:35px}.game-state-view.restricted .bar{background:none}.game-state-view.restricted canvas{width:100%;height:calc(100% - 35px);max-width:840px;max-height:410px}.room-view{position:absolute;width:100%;height:calc(100% - 10px);margin-top:5px;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.room-view>.container{position:relative;min-height:0;max-width:900px;max-height:550px;width:100%;height:100%;box-sizing:border-box;padding-bottom:30px;z-index:0}.room-view>.container>:not(:last-child){margin-bottom:15px}.room-view>.container>.header-btns{position:absolute;z-index:1;top:10px;right:10px}.room-view>.container>.header-btns>:not(:last-child){margin-right:6px}.room-view>.container>.header-btns [data-hook="rec-btn"] i{font-size:75%;color:#888;margin-right:4px}.room-view>.container>.header-btns [data-hook="rec-btn"].active i{color:#D33}.room-view>.container>.teams{margin-left:-3px;margin-right:-3px;display:flex;flex:1;justify-content:center;min-height:60px}.room-view>.container>.teams>*{margin-left:3px;margin-right:3px}.room-view>.container>.teams>.tools{display:flex;flex-direction:column;justify-content:center;width:80px}.room-view>.container>.teams>.tools>:not(:last-child){margin-bottom:6px}.room-view>.container>.teams>.spacer{flex:1 1 0;max-width:83px;margin:0 0}.room-view>.container>.teams .player-list-view{min-width:20px;width:220px;display:flex;flex-flow:column}.room-view>.container>.teams .player-list-view>:not(:last-child){margin-bottom:6px}.room-view>.container>.teams .player-list-view .buttons{display:flex;justify-content:center;flex-flow:row nowrap}.room-view>.container>.teams .player-list-view .buttons button[data-hook="join-btn"]{min-width:100px}.room-view>.container>.teams .player-list-view .list{flex:1;background-color:#111619;overflow-x:hidden;overflow-y:auto}.room-view>.container>.teams .player-list-view.t-red button[data-hook="join-btn"]{color:#ff8686}.room-view>.container>.teams .player-list-view.t-red button[data-hook="reset-btn"]{margin-left:6px}.room-view>.container>.teams .player-list-view.t-red button[data-hook="reset-btn"]:after{content:"\25b6"}.room-view>.container>.teams .player-list-view.t-blue .buttons{flex-direction:row-reverse}.room-view>.container>.teams .player-list-view.t-blue button[data-hook="join-btn"]{color:#b7b7ff}.room-view>.container>.teams .player-list-view.t-blue button[data-hook="reset-btn"]{margin-right:6px}.room-view>.container>.teams .player-list-view.t-blue button[data-hook="reset-btn"]:after{content:"\25c0"}.room-view>.container>.settings{width:300px;align-self:center;white-space:nowrap}.room-view>.container>.settings>div{line-height:22px;margin-bottom:5px;display:flex;width:100%;align-items:center}.room-view>.container>.settings>div>.lbl{flex:0 0 90px}.room-view>.container>.settings>div>.val{flex:1;overflow:hidden;text-overflow:ellipsis}.room-view>.container>.settings>div>select{width:100px}.room-view>.container>.settings [data-hook="stadium-name"].custom{color:#ffdb72}.room-view>.container>.controls{display:flex;align-self:center}.room-view>.container>.controls>*{margin:0 3px}.room-view .player-list-item{display:flex;align-items:center;cursor:pointer;line-height:20px;vertical-align:middle;padding:4px;margin:2px;font-size:15px;white-space:nowrap}.room-view .player-list-item.admin [data-hook="name"]{color:#ffdb72}.room-view .player-list-item .flagico{margin-right:3px;position:relative;top:1px}.room-view .player-list-item [data-hook="name"]{min-width:10px;overflow:hidden;flex:1}.room-view .player-list-item [data-hook="ping"]{min-width:30px;text-align:right}.room-view .player-list-item:hover{background-color:#1b2328}.room-view button{background-color:#244967}.room-view button:hover{background-color:#2f5e85}.room-view button:active{background-color:#193449}.room-view button:disabled{background-color:#3e3e3e}.room-view button[data-hook="start-btn"]{background-color:#3a9933}.room-view button[data-hook="start-btn"]:hover{background-color:#46b83d}.room-view button[data-hook="start-btn"]:active{background-color:#2e7a29}.room-view button[data-hook="start-btn"]:disabled{background-color:#3e3e3e}.room-view button[data-hook="stop-btn"]{background-color:#c13535}.room-view button[data-hook="stop-btn"]:hover{background-color:#cf5050}.room-view button[data-hook="stop-btn"]:active{background-color:#a12c2c}.room-view button[data-hook="stop-btn"]:disabled{background-color:#3e3e3e}.room-view:not(.admin) .admin-only{display:none !important}.kick-player-view{min-width:300px}.replayer .room-view>.container>.header-btns{display:none}.create-room-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.create-room-view>.dialog,.room-view.create-room-view>.container{position:relative;min-height:0;max-width:350px;width:100%}.create-room-view>.dialog>.label-input>label,.room-view.create-room-view>.container>.label-input>label{flex:0 0 100px}.room-password-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.room-password-view>.dialog,.room-view.room-password-view>.container{width:300px}.room-password-view>.dialog .buttons,.room-view.room-password-view>.container .buttons{display:flex}.room-password-view>.dialog .buttons>:not(:last-child),.room-view.room-password-view>.container .buttons>:not(:last-child){margin-right:6px}.room-password-view>.dialog .buttons>*,.room-view.room-password-view>.container .buttons>*{flex:1;white-space:nowrap}.roomlist-view{position:absolute;width:100%;height:calc(100% - 10px);margin-top:5px;display:flex;flex-direction:column;justify-content:center;align-items:center}.roomlist-view>.notice{position:relative;background-color:#1a212500;padding:10px;box-sizing:border-box;border-radius:5px;line-height:1.5;width:100%;max-width:650px;margin-bottom:6px}.roomlist-view>.notice [data-hook="notice-close"]{position:absolute;top:9px;right:7px;cursor:pointer}.roomlist-view>.notice [data-hook="notice-contents"]{margin-right:20px}.roomlist-view>.dialog,.room-view.roomlist-view>.container{position:relative;min-height:0;max-width:650px;max-height:700px;height:100%;width:100%}.roomlist-view>.dialog [data-hook="count"],.room-view.roomlist-view>.container [data-hook="count"]{position:absolute;top:20px;right:12px}.roomlist-view>.dialog>.splitter,.room-view.roomlist-view>.container>.splitter{min-height:0;display:flex;flex-direction:row;align-items:stretch;flex:1}.roomlist-view>.dialog>.splitter>:not(:last-child),.room-view.roomlist-view>.container>.splitter>:not(:last-child){margin-right:6px}.roomlist-view>.dialog>.splitter>.buttons,.room-view.roomlist-view>.container>.splitter>.buttons{display:flex;flex-direction:column;flex:0 0 auto;align-items:stretch}.roomlist-view>.dialog>.splitter>.buttons>:not(:last-child),.room-view.roomlist-view>.container>.splitter>.buttons>:not(:last-child){margin-bottom:6px}.roomlist-view>.dialog>.splitter>.buttons>button,.room-view.roomlist-view>.container>.splitter>.buttons>button{padding-left:10px;display:flex}.roomlist-view>.dialog>.splitter>.buttons>button>div,.room-view.roomlist-view>.container>.splitter>.buttons>button>div{flex:1}.roomlist-view>.dialog>.splitter>.buttons>.file-btn>label,.room-view.roomlist-view>.container>.splitter>.buttons>.file-btn>label{padding-left:10px;display:flex}.roomlist-view>.dialog>.splitter>.buttons>.file-btn>label>div,.room-view.roomlist-view>.container>.splitter>.buttons>.file-btn>label>div{flex:1}.roomlist-view>.dialog>.splitter>.buttons>.spacer,.room-view.roomlist-view>.container>.splitter>.buttons>.spacer{flex:1;margin-bottom:0px}.roomlist-view>.dialog>.splitter .filters,.room-view.roomlist-view>.container>.splitter .filters{margin-top:16px}.roomlist-view>.dialog>.splitter .filters .bool,.room-view.roomlist-view>.container>.splitter .filters .bool{margin-right:6px;padding:0px 6px;background-color:#2f3c43;border-radius:5px}.roomlist-view>.dialog>.splitter .filters .bool:hover,.room-view.roomlist-view>.container>.splitter .filters .bool:hover{background-color:#3a4952}.roomlist-view>.dialog>.splitter>.list,.room-view.roomlist-view>.container>.splitter>.list{-webkit-user-select:none;user-select:none;cursor:default;flex:1;display:flex;flex-direction:column}.roomlist-view>.dialog>.splitter>.list col:nth-child(1),.room-view.roomlist-view>.container>.splitter>.list col:nth-child(1){width:100%}.roomlist-view>.dialog>.splitter>.list col:nth-child(2),.room-view.roomlist-view>.container>.splitter>.list col:nth-child(2){width:60px}.roomlist-view>.dialog>.splitter>.list col:nth-child(3),.room-view.roomlist-view>.container>.splitter>.list col:nth-child(3){width:40px}.roomlist-view>.dialog>.splitter>.list col:nth-child(4),.room-view.roomlist-view>.container>.splitter>.list col:nth-child(4){width:95px}.roomlist-view>.dialog>.splitter>.list td,.room-view.roomlist-view>.container>.splitter>.list td{white-space:nowrap;overflow:hidden}.roomlist-view>.dialog>.splitter>.list td:not(:first-child),.room-view.roomlist-view>.container>.splitter>.list td:not(:first-child){padding-left:6px}.roomlist-view>.dialog>.splitter>.list thead,.room-view.roomlist-view>.container>.splitter>.list thead{line-height:25px}.roomlist-view>.dialog>.splitter>.list .separator,.room-view.roomlist-view>.container>.splitter>.list .separator{height:2px;width:100%;background-color:gray}.roomlist-view>.dialog>.splitter>.list tbody tr,.room-view.roomlist-view>.container>.splitter>.list tbody tr{line-height:22px}.roomlist-view>.dialog>.splitter>.list tbody tr.old,.room-view.roomlist-view>.container>.splitter>.list tbody tr.old{color:#bfbfbf}.roomlist-view>.dialog>.splitter>.list tbody tr:hover,.room-view.roomlist-view>.container>.splitter>.list tbody tr:hover{background-color:#2f3c43}.roomlist-view>.dialog>.splitter>.list tbody tr.selected,.room-view.roomlist-view>.container>.splitter>.list tbody tr.selected{background-color:#3a4952}.roomlist-view>.dialog>.splitter>.list tbody .flagico,.room-view.roomlist-view>.container>.splitter>.list tbody .flagico{margin-right:2px}.roomlist-view>.dialog>.splitter>.list tbody .flashtag,.room-view.roomlist-view>.container>.splitter>.list tbody .flashtag{display:inline-block;padding:0px 4px;background-color:#900;border-radius:3px;margin-right:5px;line-height:14px}.roomlist-view>.dialog>.splitter>.list table,.room-view.roomlist-view>.container>.splitter>.list table{table-layout:fixed}.roomlist-view>.dialog>.splitter>.list table.header,.room-view.roomlist-view>.container>.splitter>.list table.header{width:calc(100% - 12px);margin-right:15px;flex:0;background-color:#1a212500}.roomlist-view>.dialog>.splitter>.list .content,.room-view.roomlist-view>.container>.splitter>.list .content{position:relative;overflow:hidden;flex:1}.roomlist-view>.dialog>.splitter>.list .content table,.room-view.roomlist-view>.container>.splitter>.list .content table{margin-top:5px;width:calc(100% - 12px)}.roomlist-view>.dialog>.splitter>.list .simplebar-scrollbar,.room-view.roomlist-view>.container>.splitter>.list .simplebar-scrollbar{background-color:#708b9b}.pick-stadium-view{width:400px;height:100%;max-height:400px;white-space:nowrap}.pick-stadium-view .splitter{display:flex;flex-direction:row;flex:1;min-height:0px}.pick-stadium-view .list{-webkit-user-select:none;user-select:none;flex:1;position:relative;overflow:hidden}.pick-stadium-view .list>.elem{line-height:22px;margin-right:12px;padding-left:6px;text-overflow:ellipsis;overflow:hidden}.pick-stadium-view .list>.elem:hover{background-color:#2f3c43}.pick-stadium-view .list>.elem.selected{background-color:#3a4952}.pick-stadium-view .list>.elem.custom{color:#ffdb72}.pick-stadium-view .buttons{display:flex;flex-direction:column;margin-left:6px;flex:0 0 100px}.pick-stadium-view .buttons>:not(:last-child){margin-bottom:6px}.pick-stadium-view .buttons .spacer{flex:1;margin:0}.unsupported-browser-view{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.unsupported-browser-view>.dialog,.room-view.unsupported-browser-view>.container{width:400px}.unsupported-browser-view>.dialog>h2,.room-view.unsupported-browser-view>.container>h2{font-size:1.1em;margin-top:20px}.unsupported-browser-view>.dialog p,.room-view.unsupported-browser-view>.container p{line-height:1.4em}.unsupported-browser-view>.dialog a,.room-view.unsupported-browser-view>.container a{line-height:16px}.unsupported-browser-view>.dialog a img,.room-view.unsupported-browser-view>.container a img{display:inline-block;position:relative;top:3px;margin-right:6px}.unsupported-browser-view>.dialog a:hover,.room-view.unsupported-browser-view>.container a:hover{text-decoration:underline}.unsupported-browser-view>.dialog button,.room-view.unsupported-browser-view>.container button{margin-top:20px}.settings-view{width:400px;height:100%;max-height:400px;position:relative}.settings-view [data-hook="close"]{position:absolute;top:12px;right:10px}.settings-view .tabcontents{overflow-y:auto}.settings-view [data-hook="presskey"]{position:absolute;top:0;left:0;right:0;bottom:0;display:none;justify-content:center;align-items:center;background-color:rgba(0,0,0,0.7);font-weight:bold;z-index:1}.settings-view [data-hook="presskey"].show{display:flex}.settings-view .tabs{display:flex;justify-content:center;margin-bottom:20px}.settings-view .tabs>:not(:last-child){margin-right:2px}.settings-view .tabs button:first-child{border-radius:5px 0 0 5px}.settings-view .tabs button{border-radius:0px}.settings-view .tabs button:last-child{border-radius:0 5px 5px 0}.settings-view .tabs .selected{background-color:#2f5e85}.settings-view .section{display:none;flex-direction:column}.settings-view .section>:not(:last-child){margin-bottom:6px}.settings-view .section.selected{display:flex}.settings-view .section .toggle{line-height:25px;cursor:default}.settings-view .section .toggle i{margin-right:5px}.settings-view .section .toggle:hover{background-color:#2f3c43}.settings-view .section select{height:25px;border:none;background-color:#244967;margin-left:10px}.settings-view .section select:hover{background-color:#2f5e85}.settings-view .section select option{background-color:#1a212500}.settings-view .section .loc{line-height:25px}.settings-view .section [data-hook="loc-ovr-btn"]{align-self:left}.settings-view .section .inputrow{line-height:25px;margin-bottom:0;padding:6px}.settings-view .section .inputrow:nth-child(odd){background-color:#222c31}.settings-view .section .inputrow>:first-child{display:inline-block;width:50px;font-weight:bold}.settings-view .section .inputrow>:not(:first-child){background-color:#2f3c43;border-radius:7px;margin:2px 2px;padding:0px 5px;display:inline-block}.settings-view .section .inputrow>:not(:first-child):hover{background-color:#3a4952}.settings-view .section .inputrow>:not(:first-child):hover .icon-cancel{opacity:1}.settings-view .section .inputrow :last-child{cursor:pointer}.settings-view .section .inputrow .icon-cancel{cursor:pointer;opacity:0.6}.settings-view [data-hook="close"]{margin-top:auto}.change-location-view{width:400px;height:100%;max-height:500px;white-space:nowrap}.change-location-view .splitter{display:flex;flex-direction:row;flex:1;min-height:0px}.change-location-view .list{-webkit-user-select:none;user-select:none;flex:1;position:relative;overflow:hidden}.change-location-view .list>.elem{line-height:22px;margin-right:12px;padding-left:6px}.change-location-view .list>.elem:hover{background-color:#2f3c43}.change-location-view .list>.elem.selected{background-color:#3a4952}.change-location-view .buttons{display:flex;flex-direction:column;margin-left:6px;flex:0 0 100px}.change-location-view .buttons>:not(:last-child){margin-bottom:6px}.change-location-view .buttons .spacer{flex:1;margin:0}.replay-controls-view{-webkit-user-select:none;user-select:none;position:absolute;bottom:0;height:40px;width:100%;background-color:black;display:flex;flex-direction:row;justify-content:center;align-items:center;padding-left:6px;padding-right:6px;box-sizing:border-box}.replay-controls-view>:not(:last-child){margin-right:6px}.replay-controls-view button{background-color:#244967}.replay-controls-view button:hover{background-color:#2f5e85}.replay-controls-view button:active{background-color:#193449}.replay-controls-view button:disabled{background-color:#3e3e3e}.replay-controls-view [data-hook="spd"]{text-align:center;min-width:40px}.replay-controls-view [data-hook="time"]{text-align:center;min-width:50px}.replay-controls-view .timebar{background-color:transparent;flex-grow:1;position:relative;height:40px;cursor:pointer}.replay-controls-view .timebar .barbg{position:absolute;height:6px;width:100%;margin:auto;background-color:#393737;top:0;bottom:0}.replay-controls-view .timebar .bar{background-color:#5c5c5c;position:absolute;left:0;top:0;bottom:0}.replay-controls-view .timebar .timetooltip{position:absolute;width:60px;background-color:black;top:-20px;text-align:center;line-height:30px;display:none}.replay-controls-view .timebar:hover .timetooltip{display:block}.replay-controls-view .timebar .marker{width:2px;height:6px;position:absolute;top:0;bottom:0;margin:auto;background-color:#cecece}.replay-controls-view .timebar .marker.k1{background-color:#5689e5}.replay-controls-view .timebar .marker.k2{background-color:#e56e56}html{overflow:auto}body{font-family:'Open Sans', sans-serif;font-size:14px;color:white;background-color:#73885c;background:#939e7f url("images/bg.png") fixed}a{color:#ffe7cc}a:hover{text-decoration:underline;cursor:pointer}#header{height:40px;line-height:40px;background-color:black;padding-left:20px}#header div{font-size:16px;font-size:16px;display:inline}