html {font-family: Arial, Helvetica, sans-serif;font-size: 1rem;}
h1 { font-size: 1.1rem;}
.overflow { overflow: auto; }
.tulokset, .valiajat { margin-block: .5rem 2rem; }
.tulokset caption, .valiajat caption {font-weight: bold;text-align: left;padding-bottom: .5rem;}
.tulokset tr, .valiajat tr {display: flex;}
.tulokset tr th {background-color: hsl(293, 76%, 83%);color: #444;}
.tulokset tr td, .tulokset tr th {padding: .5rem;text-align: right;width: 5vw;}
.tulokset tr td:first-child, .tulokset tr th:first-child {width: 2rem;text-align: right;}
.tulokset tr td:nth-child(2), .tulokset tr th:nth-child(2) {text-align: left; width: 18rem;}
.tulokset tr td:nth-child(1)::after { content: '.';}
.tulokset tr:nth-child(2n-1) td, .valiajat tr:nth-child(2n-1) td {background-color: hsl(183, 28%, 93%);}
.valiajat tr {cursor: pointer;}
.valiajat tr th {background-color: hsl(293, 76%, 83%);padding-block: .5rem;}
.valiajat tr td, .valiajat tr th {color: #333;width: 5rem;padding: .1rem .3rem;}
.valiajat tr td[data-o="1"] {background-color: gold;}
.valiajat tr td[data-o="2"] {background-color: hsl(0, 0%, 85%);}
.valiajat tr td[data-o="3"] {background-color: hsl(35, 58%, 74%);}
.valiajat tr td:first-child, .valiajat tr th:first-child {text-align: right;width: 2.5rem;}
.valiajat tr td:nth-child(2),
.valiajat tr td:nth-child(3),
.valiajat tr td:last-child,
.valiajat tr th:nth-child(2),
.valiajat tr th:nth-child(3),
.valiajat tr th:last-child {width: 12rem;text-align: left;}
.valiajat tr td:last-child,.valiajat tr th:last-child { width: 12rem; }
.valiajat tr td:nth-child(3),
.valiajat tr th:nth-child(3) {width: 4rem;text-align: right;padding-right: 1rem;}
.valiajat tr td:nth-last-child(2),
.valiajat tr th:nth-last-child(2) {width: 5rem;text-align: right;padding-right: 1rem;}
.valiajat tr:nth-child(2n) { margin-top: .7rem;}
.valiajat tr:nth-child(2) { margin-top: .2rem;}
.valiajat tr:nth-child(2n):hover td, .valiajat tr:nth-child(2n):hover + tr td {background-color: hsl(16, 100%, 76%);}


table {
    overflow: hidden;
  }
  
th, td {position: relative;}

.valiajat td:hover::after,
.valiajat th:hover::after {
  content: "";
  position: absolute;
  /* background-color: #ffa; */
  background-color: hsl(16, 100%, 76%);
  left: 0;
  top: -500px;
  height: 1000px;
  width: 100%;
  z-index: -1;
}