.container { display: flex; flex-flow: column; height: calc(98vh); cursor: default; } .container:first-child { flex: 0 1 auto; } .table { flex: 1 1 auto; overflow-y: scroll; overflow-x: hidden; background-color: #1b1b1c; padding-top: 5px; padding-bottom: 10px; } .sumRow { font-size: 16px; font-weight: 500; display: flex; padding-top: 5px; padding-right: 16px; margin-top: 30px; background-color: var(--hoover-color); } .headerRow { font-size: 15px; display: flex; padding: 1px; padding-right: 15px; background-color: var(--hoover-color); } .row { display: flex; padding: 1.5px; } .row:hover { background-color: #242323; cursor: default; text-shadow: 1px 1px 6px #969696; color: var(--text-color); } .row div, .headerRow div, .sumRow div { flex: 1; padding: 0px 5px; text-align: center; } .headerRow > div, .sumRow > div { padding: 5px; } .row :nth-child(1), .headerRow :nth-child(1), .sumRow :nth-child(1) { flex: 0 50px; } .row :nth-child(2), .headerRow :nth-child(2), .sumRow :nth-child(2) { flex: 0 130px; text-align: left; } .clickable:hover { background-color: var(--hoover-color); } .clickable { cursor: pointer; } .selfRow { background-color: var(--text-color); color: black; } .selfRow:hover { background-color: #96810b; color: gainsboro; } .text { text-align: center; font-size: 12px; font-style: italic; color: var(--text-color); padding-bottom: 10px; } .infoText { text-align: center; font-size: 20px; padding-top: 20px; } .sumrow { color: white; }