.admin{padding:0 35px;border:1px solid #fff;border-radius:15px;max-width:480px}.admin h2{border-bottom:1px solid #fff;font-size:25px}.admin h3{cursor:pointer}.admin .roleContainer{display:flex;flex-wrap:wrap;height:0;overflow:hidden;transition:height 1s}.admin .roleContainer.noCollapse{height:350px}.admin .role{display:flex;align-items:center;margin:10px}.admin .role input{width:30px;margin:0 5px}.admin button{cursor:pointer;background:transparent;color:#fff;border:1px solid #fff;font-size:15px;border-radius:5px;margin-bottom:10px}.admin .playerContainer{height:0;transition:height 1s;overflow:hidden}.admin .playerContainer.noCollapse{overflow:auto;height:350px;display:flex;flex-direction:column}.admin .player{display:flex;justify-content:space-between;align-items:center}.admin .player button{margin:0 5px}.admin .player img{margin-right:5px}.admin .player img.dead{filter:grayscale(100%)}.admin .player .left,.admin .player .right{display:flex;align-items:center;margin:0 10px 5px 0}.background .moon{width:450px;top:50px;position:absolute;margin-left:auto;margin-right:auto;left:0;right:0;text-align:center;vertical-align:middle}.background .wolf{width:80px;bottom:0;position:absolute;left:100px}.background .werwolf-id{bottom:10px;position:absolute;right:50px}body,button{color:#fff;background-color:#000;font-family:Butcherman,serif}a{color:#fff}.content{display:flex;justify-content:space-between;margin:0 50px;height:calc(100vh - 100px);align-items:center;position:relative;z-index:1}@media(max-width:1023px){.content{flex-direction:column;overflow:auto;height:100vh;margin:0}.content>div{margin:20px 0}}.infoboard{margin:0 20px;display:flex;flex-direction:column;align-items:center}.infoboard h2{text-align:center;cursor:pointer}.infoboard img{width:30vw;max-width:275px;cursor:pointer}.infoboard img.dead{filter:grayscale(100%)}.infoboard button{cursor:pointer;float:right;margin-top:10px;background:transparent;color:#fff;border:1px solid #fff;font-size:15px;border-radius:5px}@media(max-width:1023px){.infoboard{order:1}}.modal{position:absolute;width:400px;background:#000;z-index:2;border:1px solid #fff;border-radius:12px;padding:0 30px;margin-left:auto;margin-right:auto;left:0;right:0;margin-top:50px;max-height:80vh;overflow:auto}.modal h2{margin-bottom:0}.modal p{font-family:cursive;margin-top:0}.playerlist{padding:0 35px;border:1px solid #fff;border-radius:15px}.playerlist .dead{color:grey}.playerlist h2{border-bottom:1px solid #fff;font-size:25px}.playerlist ul{list-style:none;padding:0}.playerlist span{font-size:20px}@media(max-width:1023px){.playerlist{order:2}}.register{padding:0 35px;border:1px solid #fff;border-radius:15px}.register h2{border-bottom:1px solid #fff;font-size:25px}.register form{display:flex;flex-direction:column}.register input{width:100%}.register button{margin:30px 0;background:transparent;color:#fff;border:1px solid #fff;font-size:15px;border-radius:5px}@media(max-width:1023px){.register{order:1}}.rules{padding:0 35px;border:1px solid #fff;border-radius:15px;width:380px}.rules h2{border-bottom:1px solid #fff;font-size:25px;cursor:pointer}.rules h3{margin:0;cursor:pointer}.rules img{margin:0 3px;cursor:pointer}@media(max-width:1023px){.rules{order:3;max-width:380px;width:calc(100vw - 100px)}}