* {
  font-family: sniglet;
  --border-size: 3px;
}

.title {
  top: 12%;
  font-weight: 900;
}

.table {
  position: absolute;
  inset: 0;
  top: unset;
  bottom: 15%;
  width: 70%;
  margin: auto;
  background-color: #fff;
  border: var(--border-size) solid #0b5394;
}

.table th {
  color: #783f04;
}

tr > td {
  border: var(--border-size) solid #0b5394;
  text-align: center;
  font-weight: 800;
  font-size: 1.5em;
  width: 25%;
}

.tdimg {
  width: 20%;
}

.row1 > td {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.header {
  font-size: 1.5em;
  width: max-content;
  padding: 0.5em 1em;
  background-color: #fff;
  border: var(--border-size) solid #b45f06;
  border-radius: 0.2em;
  top: 5%;
  left: 50%;
  transform: translate(-50%);
}

.character {
  position: absolute;
  bottom: 18%;
  height: 30%;
  left: 22%;
  z-index: 100;
}

.rumi {
  left: 29%;
}
.suraj {
  left: 35.7%;
  bottom: 18%;
}
.prem {
  left: 41%;
  bottom: 16%;
}

.verticaltabel {
  position: absolute;
  bottom: 20%;
  left: 1.5%;
  font-size: 1em;
  border: var(--border-size) solid #b45f06;
  background-color: #fff;
  width: 20%;
}

.verticaltabel td,
.verticaltabel th {
  font-weight: 500;
  font-size: 1em;
  padding: 0.5em 0.7em;
  border: var(--border-size) solid #b45f06;
}

.verticaltabel th {
  color: #794f21;
  font-weight: 900;
}

.verticaltabel td:last-child {
  border-right: none;
}

.pointer {
  position: absolute;
  bottom: 25%;
  left: 43.5%;
  height: 10%;
  cursor: pointer;
  z-index: 100;
}

.suraj-pointer {
  left: 37.5%;
}
.rumi-pointer {
  left: 31.5%;
}

.sagar-pointer {
  left: 24.5%;
}

.smaller-text {
  font-size: 2vw;
}

.header.smaller-text {
  width: 80%;
}

.basketball-table {
  width: 60%;
  left: 50%;
  transform: translate(-50%);
  bottom: 15%;
}
.basketball-table tr,
.basketball-table th,
.basketball-table td {
  text-align: left;
}

.basketball-table tr th {
  padding: 3%;
}

.basketball-table tr > td:first-of-type {
  width: 2%;
}

.basketball {
  width: 13%;
}

.header.center-text {
  padding: 4rem;
  width: 70%;
  top: 50%;
  left: 50%;
  transform: translate(-50% -50%);
}
@media screen and (max-width: 768px) {
  * {
    --border-size: 1px;
  }
  .table,
  tr > td {
    border: var(--border-size) solid #0b5394 !important;
    font-size: 0.8em;
    padding: 0;
  }

  .row2 td {
    padding: 0.5em !important;
  }
}

@media screen and (min-width: 1280px) and (max-height: 595px) {
  .smaller-text {
    font-size: 1.5vw;
  }
}

@media (min-aspect-ratio: 4/3) {
  .smaller-text {
    font-size: 3vh;
    white-space: nowrap;
  }
}