@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap'); html, body { margin: 0; height: 100%; } :root { --mainColor: rgba(31, 31, 31, 0.95); --contentColor: rgba(24, 24, 24, 1); --contentColor2: rgba(24, 24, 24, 0.8); --tableHover: rgba(17, 17, 17, 0.8); } body { box-sizing: border-box; } .LeaderBoard { background-color: var(--contentColor); width: 100%; height: 100%; display: flex; } .LeaderBoardPart { width: 33%; height: 99.3%; display: flex; flex-direction: column; border: 3px solid #0f0f0f; } .LeaderBoardHeader { width: 100%; height: 10vh; background-color: var(--mainColor); border-bottom: 3px solid #0f0f0f; display: flex; flex-direction: column; justify-content: center; align-items: center; } .LeaderBoardHeader p { color: white; font-size: 3vh; padding: 0; margin: 0; font-family: "Oswald", serif; } .LeaderBoardHeader h1 { color: rgb(189, 189, 189); font-size: 2vh; padding: 0; margin: 0; font-family: "Oswald", serif; font-weight: 200; } .LeaderBoardData { width: 100%; height: 100%; overflow: hidden; } .LeaderBoardPlayer { width: 100%; height: 6.6%; border-bottom: 1px solid #0f0f0f; display: flex; } .PlayerName { width: 45%; height: 100%; font-family: "Oswald", serif; color: white; display: flex; align-items: center; margin: 0; margin-left: 10vh; font-weight: 300; font-size: 2vh; } .PlayerNumber { width: 15%; height: 100%; font-family: "Oswald", serif; color: rgb(182, 182, 182); display: flex; align-items: center; justify-content: center; margin: 0; font-weight: 300; font-size: 2vh; } .PlayerData { width: 40%; height: 100%; font-family: "Oswald", serif; color: rgb(255, 0, 0); display: flex; align-items: center; justify-content: flex-end; margin: 0; margin-right: 10vh; font-weight: 200; font-size: 2vh; } .MySelf { background-color: #00410b; }