body{font-family:Inter,sans-serif;color:#fff;background-color:#161529;margin:30px;padding:0}h1{font-weight:600;text-align:center}p{text-align:center;font-weight:200}button{height:30px;width:150px;text-align:center;font-weight:600;border-radius:20px;background-color:#c3bac3}button:hover{background-color:#5c1128;color:#c3bac3}.mainPageButtonContainer{margin:50px auto;width:40vw;display:grid;grid-template-areas:". ." "leaderboard leaderboard";row-gap:20px;justify-items:center}.leaderboardButton{grid-area:leaderboard}.leaderboardPage{margin:0 auto;display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"title title" "username ." "list list" "list list" "list list" "back back";text-align:center;justify-items:center;align-items:center;row-gap:30px;column-gap:20px}.leaderboardPage h1{grid-area:title}.leaderboardPage p{font-weight:400}.leaderboardPage div{font-weight:200}.username{grid-area:username}.leaderboardPage button{grid-area:back}.newGamePage{margin:0 auto;display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"title title" "desc desc" "error error" "form form" "form form" "button button";justify-items:center;row-gap:10px}.newGamePage h1{grid-area:title}.newGamePage p{grid-area:desc}.newGamePage .error{grid-area:error}.newGamePage button{margin:20px}.newGamePageButtons{grid-area:button}.createForm{grid-area:form}.createUsername{display:block;margin-bottom:15px}.createPassword{display:block}.loadGamePage{margin:0 auto;display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"title title" "desc desc" "error error" "form form" "form form" "button button";justify-items:center;row-gap:10px}.loadGamePage h1{grid-area:title}.loadGamePage p{grid-area:desc}.loadGamePage .error{grid-area:error}.loadGamePage button{margin:20px}.loadGamePageButtons{grid-area:button}.loadForm{grid-area:form}.loadUsername{display:block;margin-bottom:15px}.loadPassword{display:block}input{text-align:center;grid-area:input;border-radius:20px;height:25px;width:140px;border-style:none;background-color:#161529;border:solid 2px #C3BAC3;color:#c3bac3}input:hover{background-color:#5c1128}input::placeholder{text-align:center;color:#c3bac3;opacity:.3}input:focus{outline:none;color:#c3bac3;background-color:#5c1128}.bufferingPage{display:grid}.loadingTitle{height:100px}.loadingBar{margin:20px auto;border:solid 2px #C3BAC3;width:400px;height:20%;border-radius:20px}.percentage{font-weight:600}.loadingBarIndicator{color:#c3bac3;text-align:right;height:100%;width:0;background-color:#5c1128;border-radius:20px}.gamePage{display:grid;grid-template-areas:"title" "level" "grid" "arrows" "button";justify-content:center}.gamePage h1{grid-area:title}.gamePage p{grid-area:level}.gameContainer{grid-area:grid;display:flex}.map{display:inline-block}.row{display:flex;flex-direction:row}#point{height:70px;width:70px;border:solid 1px black}.wall{background-color:#5c1128}.player{background-image:url(https://i.imgur.com/CFthw7l.gif);background-size:cover;background-color:#c3bac3}.box{background-image:url(https://i.imgur.com/hnJ72Ry.gif);background-size:cover;background-color:#c3bac3}.goal{background-image:url(https://i.imgur.com/CkAEbxy.png);background-size:cover;background-color:#c3bac3}.box_on_goal{background-image:url(https://i.imgur.com/5Lj1JDG.png);background-size:cover;background-color:#c3bac3}.player_on_goal{background-color:#c3bac3;background-image:url(https://i.imgur.com/TRzqhe7.png);background-size:cover}.floor{background-color:#c3bac3}.gamePage .arrows{margin-top:15px;grid-area:arrows;display:grid;grid-template-areas:"left updown right";justify-content:center;column-gap:6px}.updown{grid-area:updown;display:flex;flex-direction:column}.left{grid-area:left;align-self:flex-end}.right{grid-area:right;align-self:flex-end}.gamePage footer{margin-top:20px;grid-area:button;display:grid;grid-template-areas:"reset quit";justify-content:center;column-gap:80px}.resetButton{grid-area:reset}.quitButton{grid-area:quit}.winBanner{margin:auto}.winBannerMain{color:#fff;position:relative;font-size:30px;font-weight:600}.winBannerSub{color:#fff;position:relative;font-size:20px}.winBannerBG{position:absolute;top:0;height:100vh;width:100vw;opacity:.8;text-align:center;background-color:#161529}.blinkingBG{animation:blinkingBackground 2s infinite}@keyframes blinkingBackground{0%{background-color:#161529}25%{background-color:#014671}50%{background-color:#5484a6}75%{background-color:#5c1128}to{background-color:#c3bac3}}.nextLevel{position:relative;display:block;margin:0 auto}@media screen and (max-width: 650px){.mainPageButtonContainer{grid-template-areas:"new" "load" "leaderboard"}.newGamePage{grid-template-columns:1fr;grid-template-areas:"title" "desc" "error" "form" "form" "buttons"}.newGamePageButtons,.loadGamePageButtons{grid-area:buttons;display:grid;grid-template-columns:1fr;grid-template-areas:"start" "back"}.newGamePageButtons .backButton,.loadGamePageButtons .backButton{grid-area:back}.newGamePage button,.loadGamePageButtons button{margin-top:20px}.loadGamePage{grid-template-columns:1fr;grid-template-areas:"title" "desc" "error" "form" "form" "buttons"}.loadingBar{width:100px;height:20%}#point{height:40px;width:40px;border:solid 1px black}.gamePage footer{grid-template-areas:"reset" "quit";row-gap:20px}}@media screen and (max-width: 400px){button{height:30px;width:120px;font-size:12px}h1{font-size:16px}p{font-size:12px}}
