body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.topMenu{background:#0387e5;box-shadow:0 5px 5px #666;height:60px}#dropdownWrapper{font-size:30px;padding:10px 20px;width:30px}.dropdownMenu{position:absolute;list-style:none;background:#0387e5;box-sizing:border-box;margin:9px 0 0;box-shadow:5px 5px 5px #666;padding:0;opacity:0;-webkit-transition:all .5s;transition:all .5s}#dropdownWrapper:hover .dropdownMenu{opacity:1}#dropdownWrapper .dropdownMenu li{display:none;-webkit-transition-delay:.5s;transition-delay:.5s;-webkit-transition:all 0s;transition:all 0s}#dropdownWrapper:hover .dropdownMenu li{display:flex}.dropdownMenu li:first-child{padding:10px;border-bottom:1px solid #000}.dropdownMenu li:first-child span{font-size:18px;font-weight:700;color:#fff}.dropdownMenu li:first-child button{background:transparent;border:none;font-size:30px;line-height:0;-webkit-transform:rotate(135deg);transform:rotate(135deg);color:#000;padding:0 0 5px 5px;-webkit-transition:all 1s;transition:all 1s;border-radius:100px;cursor:pointer}.dropdownMenu li:nth-child(2){display:flex}.logOutButton{background:none;border:none;width:100%;height:100%;padding:10px;font-size:18px;color:#fff;cursor:pointer;-webkit-transition:all .5s;transition:all .5s}.logOutButton:hover{background:#025fa0}.usernameBox{display:flex;background:#0387e5;height:150px;box-sizing:border-box;border-radius:10px;position:absolute;top:calc(50vh - 75px);left:calc(50vw - 185px);-webkit-transition:all 1s;transition:all 1s;width:0;overflow:hidden;padding:0;font-size:18px;flex-direction:column;box-shadow:5px 5px 5px #666;z-index:2}.usernameBox h1{flex-basis:50%;margin:0;color:#fff;font-size:22px}#usernameInput{border:2px solid #fff;background:transparent;color:#fff;font-size:18px;box-sizing:border-box;width:240px}.usernameBox>div{display:flex;flex-direction:row}.usernameBox>div button{flex-basis:15%;background:transparent;border:2px solid #fff;color:#fff;font-size:20px;font-weight:700;cursor:pointer;-webkit-transition:background .5s;transition:background .5s}.usernameBox>div button:hover{background:#025fa0}.usernameBackground{z-index:1;background:rgba(0,0,0,.27);position:fixed;top:0;left:0;width:100vw;height:100vh}.notMenu{max-width:1111px;width:90vw;margin:20px auto auto}.roomListMenu{display:flex}#searchCreateInput{flex-basis:100%;border:3px solid #ccc;border-right:none;border-left:none;font-size:18px;padding:0 10px;box-sizing:border-box}.refreshButton{font-size:30px;border:3px solid #ccc;border-radius:5px 0 0 5px;height:45px;line-height:0}.refreshButton,.roomListMenu button:last-child{background:transparent;cursor:pointer;-webkit-transition:all .5s;transition:all .5s}.roomListMenu button:last-child{flex-basis:200px;font-size:18px;border:3px solid #ccc;border-radius:0 5px 5px 0}.refreshButton:hover,.roomListMenu button:last-child:hover{background:#ccc}.roomList{list-style:none;padding:10px}.roomList a{display:flex;height:100px;justify-content:center;align-items:center;padding:20px;box-sizing:border-box;text-decoration:none;color:#fff}.roomList a h1:first-child{flex-basis:90%}.roomList a h1:last-child{font-size:20px;flex-basis:10%}.roomList a h1{margin:0}.roomList>li{margin:10px;border-radius:10px;box-shadow:5px 5px 5px #666;background:#0387e5}.inRoom{max-width:800px;width:90vw;margin:20px auto auto;display:flex;flex-direction:column}.readyWrapper{position:absolute;background:#fff;width:200px;height:200px;display:flex;align-items:center;justify-content:center;top:calc(50vh - 100px);left:calc(50vw - 100px);border-radius:10px;border:3px solid #0387e5;z-index:100}.readyWrapper button{background:transparent;color:#0387e5;font-size:20px;width:100px;height:100px;font-weight:700;border:3px solid #0387e5;border-radius:5px;-webkit-transition:all 1s;transition:all 1s;cursor:pointer}.readyWrapper button:hover{border-color:transparent}.boardWrapper{display:grid;grid-template-columns:20% 20% 20% 20% 20%;min-height:80vmin}.boardColumn{padding:0;margin:0;display:grid;grid-template-rows:20% 16% 16% 16% 16% 16%}.boardColumn li{list-style:none;margin:5px;background:#060ce9;color:#ecd210;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:10px;font-weight:bolder;padding:10px;overflow:hidden}.boardColumnTitle{text-transform:capitalize}.boardColumnScreen{font-size:30px}.playerBarWrapper{display:grid;grid-template-columns:33% 33% 34%;width:90vw;bottom:0;height:100px;max-width:800px;background:#0387e5}.playerBarWrapper h1,.playerBarWrapper h2{margin:0;height:50%}.playerBarWrapper>div{display:flex;flex-direction:column;padding:10px;box-sizing:border-box;height:100px;-webkit-transition:all 1s;transition:all 1s;color:#fff;overflow:hidden}.playerTwo{border-left:3px solid #fff;border-right:3px solid #fff}.largeScreenWrapper{position:absolute;background:#060ce9;border-radius:10px;overflow:hidden}.largeScreenWrapper .largeScreenInnerWrapper{display:flex;flex-direction:column;padding:20px;box-sizing:border-box;justify-content:flex-start;align-items:center;max-width:800px;width:90vw;height:calc(100vh - 190px);min-height:500px}.largeScreenWrapper .largeScreenInnerWrapper span{color:#fff;font-size:40px;font-weight:700;text-align:center;margin:30px 0}.largeScreenInnerWrapper div:first-child{display:flex;flex-basis:60%;align-items:flex-end;padding:0 30px}.largeScreenInnerWrapper input{width:400px}.largeScreenInnerWrapper button{background:transparent;color:#fff;font-size:20px;border:3px solid #fff;padding:10px 30px;font-weight:700;margin-top:10px;border-radius:10px;-webkit-transition:all .5s;transition:all .5s;cursor:pointer}.largeScreenInnerWrapper button:hover{background:#999}@media only screen and (max-width:500px){.inRoom .boardColumnTitle{font-size:12px}}@media only screen and (max-width:1000px){.largeScreenWrapper,.largeScreenWrapper .largeScreenInnerWrapper{width:100vw!important;height:100vh!important;top:0!important;left:0!important;min-height:0!important;position:fixed}.boardColumnTitle:active,.boardColumnTitle:focus,.boardColumnTitle:hover{position:absolute;top:0;left:0;width:100vw;height:50vh;font-size:30px}}
/*# sourceMappingURL=main.503e8b19.chunk.css.map */