:root {

}

:root[color-mode="light"] {
  --insight-back: #f0f4f8;
  --insight-border: #bcccdc;
}

:root[color-mode="dark"] {
  --insight-back: #102a43;
  --insight-border: #486581;
}

.top-selections {
  position: relative;
  display: flex;
  justify-content: left;
  align-items: bottom;
  top: 0px;
  height: 30px;
  width: calc(100% + 30px);
  margin-left: -15px;
  background-color: var(--black-base);
  /* z-index: 5; */
  border-bottom: var(--container-border-base);
}

.top-selection {
  float: left;
  margin-left: 2.5px;
  margin-top: 7.5px;
  margin-right: 2.5px;
  background-color: var(--container-color-base);
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  padding: 2.5px;
  padding-top: 3px;
  padding-left: 7px;
  padding-right: 7px;
  font: 11px var(--font);
  /* font-weight: bold; */
  color: var(--font-color-faint-2);
  border: var(--container-border-base);
  border-bottom: none;
  cursor: pointer;
}

.top-selection-1 {
  margin-left: 5px;
}

.top-selection:hover {
  color: var(--font-color-base);
}

.top-selected {
  background-color: var(--black-base);
  color: var(--red) !important;
  z-index: 2;
  margin-bottom: -1px;
}

.popover-body {
  font: 10px var(--font);
  padding-top: 4px;
  background-color: var(--pop-body-col);
  color: var(--blog-body-base);
  /* font-weight: bold; */
  padding-bottom: 4px;
  padding-left: 5px;
}



.section-title {
  position: relative;
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0px;
  z-index: 5;
  width: calc(100% + 30px);
  margin-left: -15px;
  /* background-color: red; */
  padding: 3px;
  font: 12.5px var(--font);
  color: var(--font-color-base);
  display: flex;
  justify-content: left;
  align-items: center;
  height: 25px;
  border-radius: 2px;
  background-color: var(--container-color-base);
  border: var(--container-border-base);
  cursor: pointer;
  margin-top: 5px;
}

/* .section-title:hover {
  background-color: var(--insight-border);
} */

.section-expanded {
  font-weight: bold;
  /* background-color: #3e4859 !important;
  color: white;
  border-bottom-color: var(--red); */
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}

.section-content {
  position: relative;
  margin-top: 0px;
  width: calc(100% + 30px);
  margin-left: -15px;
  padding: 7.5px;
  border: var(--container-border-base);
  border-top: none;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}

.section-content-hide {
  display: none;
}

.section-description {
  position: relative;
  width: 100%;
  font: 11.5px var(--font);
  color: var(--font-color-base);
}

.section-insight {
  margin-top: 0px;
  margin-bottom: 0px;
  background-color: var(--insight-back);
  color: var(--font-color-base);
  padding: 5px;
  border: 1px solid var(--insight-border);
  border-radius: 2px;
}

.section-chev {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 0px;
  height: 100%;
  width: 25px;
  padding: 5px;
  font-size: 14px;
}

.section-expanded > .section-chev {
  /* color: gold; */
  transform: rotate(180deg);
}

.section-title-sub {
  font-size: 11px;
  font-weight: normal;
}

.head {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 20px;
  background-color: var(--black-base);
  z-index: 3;
  height: 25px;
  width: 100%;
  border-bottom: var(--container-border-base);
  border-bottom-width: 1.5px;
}

.datahead, .data {
  position: absolute;
  padding: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  font: 9.5px var(--font);
  font-weight: bold;
  color: var(--font-color-base);
}

.data-text {
  z-index: 1;
}

.datahead {
  font: 8.5px var(--font);
  color: var(--font-color-faint-2);
  cursor: ns-resize;
}

.up-sorty, .down-sorty {
  display: none;
  color: var(--font-color-base) !important;
  margin-left: 2.5px;
}

.sorted {
  border: none;
  color: var(--font-color-base);
  /* border: none; */
}

.table-top-div {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0px;
  background-color: var(--black-base);
  /* position: relative; */
  z-index: 4;
  height: 20px;
  width: 100%;
  margin: 0px;
  margin-top: 0px;
}

.table {
  margin-bottom: 5px;
}

.topper {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 15px;
  bottom: 0px;
  font: 8px var(--font);
  color: var(--blue);
  font-weight: bold;
  border-bottom: 1px solid var(--font-color-base);
}

.hole-col { left: 0px; width: 6%; }
.par-col { left: 6%; width: 7%; }
.ydg-col { left: 13%; width: 7%; }

.dd-col { left: 20%; width: 7.5%; }
.da-col { left: 27.5%; width: 7.5%; }
.club-col { left: 35%; width: 7.5%; }
.favoursa-col { left: 42.5%; width: 10%; }
.favoursd-col { left: 52.5%; width: 10%; }
.driving-header { left: 20%; width: 42.5%; }

.approachavg-col { left: 65%; width: 7.5%; }
.approach-col { left: 72.5%; width: calc(27.5%); overflow: visible; }
.approach-header { right: 0%; width: 35%; }

.datarow { overflow: visible; }

.data.hole-col > .holey {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 20px;
  border-radius: 2px;
  background-color: var(--container-color-base);
  border: 1px solid var(--blue);
  color: var(--red);
}

.data.hole-col > .holeyy {
  /* background-color: var(--blue);
  border: var(--container-border-base);
  color: white; */
}

.approach-inner {
  position: absolute;
  left: 0.5px;
  top: 0.5px;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  /* background-color: red; */
  border-bottom: 1px solid var(--font-color-base);
}

.approach-back {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0px;
  height: 100%;
}

.approach-bar {
  position: absolute;
  bottom: 0px;
  width: 95%;
  background-color: var(--red-light);
}

.bar-div {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  left: -0.5px;
  width: 1px;
  font: 7px var(--font);
  color: var(--font-color-base);
  height: 65%;
  bottom: 0px;
  background-color: var(--font-color-base);
  opacity: 0.1;
}

.bar-div-right {
  left: unset;
  right: -0.5px;
}

.datarow:hover > .approach-col > .approach-inner > .approach-back > .bar-div { opacity: 1; }

.bar-div-text {
  position: absolute;
  bottom: calc(100% + 0.5px);
}

#app_50 > .approach-bar, #app_60 > .approach-bar, #app_70 > .approach-bar, #app_80 > .approach-bar, #app_90 > .approach-bar { background-color: var(--olive); }
#app_100 > .approach-bar, #app_110 > .approach-bar, #app_120 > .approach-bar, #app_130 > .approach-bar, #app_140 > .approach-bar { background-color: var(--yellow); }
#app_150 > .approach-bar, #app_160 > .approach-bar, #app_170 > .approach-bar, #app_180 > .approach-bar, #app_190 > .approach-bar { background-color: var(--orange); }
#app_200 > .approach-bar, #app_210 > .approach-bar, #app_220 > .approach-bar, #app_230 > .approach-bar, #app_240 > .approach-bar, #app_250 > .approach-bar { background-color: var(--red); }

.standard-back {
  position: absolute;
  left: 0px;
  border-left: 1px solid var(--font-color-base);
  height: 80%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1;
}

.standard-inner {
  position: absolute;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  height: 80%;
  left: 0px;
  background-color: var(--olive);
}

.standard-back-hidden {
  opacity: 0.1;
}

.favours-inside {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20px;
  width: 95%;
  border: var(--container-border-base);
  border-width: 1px;
}

.favours-bar-inner {
  position: absolute;
  height: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(50% + 0.5px);
}

.favours-bar-inner-left {
  left: 0px;
  border-right: 1px solid var(--font-color-base);
}

.favours-bar-inner-right {
  right: 0px;
  border-left: 1px solid var(--font-color-base);
}

.favours-bar {
  position: absolute;
  height: 75%;
}

.favours-bar-inner-left > .favours-bar { right: 0px; border-top-left-radius: 1px; border-bottom-left-radius: 1px; background-color: rgb(100,100,100); }
.favours-bar-inner-right > .favours-bar { left: 0px; border-top-right-radius: 1px; border-bottom-right-radius:1px; background-color: var(--olive); }

.lineup-div {
  position: relative;
  margin-top: 5px;
  width: 100%;
  border: var(--container-border-base);
}

.lineup-title {
  position: relative;
  background-color: var(--container-color-base);
  font: 12px var(--font);
  font-weight: bold;
  color: var(--font-color-base);
  padding: 2.5px;
  display: flex;
  justify-content: left;
  align-items: center;
}

.lineup-title > img {
  height: 14px;
  width: auto;
}

.lineup-title-2 {
  border-top: var(--container-border-base);
  /* margin-top: 10px; */
}

.team-div {
  position: relative;
  width: 100%;
  border-top: var(--container-border-base);
}

.datarow-bop {
  margin-top: 15px;
  border-top: 1px solid var(--font-color-base);
}

.start-hole-summary {
  position: absolute;
  bottom: calc(100% + 2px);
  left: 0px;
  font: 9px var(--font);
  color: var(--font-color-base);
}

.hole-coly {
  width: 20%;
  justify-content: left;
  padding-left: 2.5px;
}

.data.hole-coly > .holeyy {
  width: auto;
  max-width: unset;
  padding-left: 2px;
  padding-right: 2px;
}

.med-val {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 27.5px;
  padding: 2px;
  border-radius: 1px;
  font-size: 8.5px;
}

.med-val-high {
  background-color: var(--red);
  color: white;
}

.med-val-long {
  background-color: var(--orange);
  color: white;
}

.med-val-mid {
  background-color: var(--yellow);
  color: black;
}

.med-val-short {
  background-color: var(--olive);
  color: white;
}

#hole-evens.datarow, #hole-odds.datarow {
  background-color: var(--insight-back);
}

.partnership-div {
  position: relative;
  width: 100%;
  height: 25px;
  display: flex;
  justify-content: left;
  align-items: center;
  padding: 2.5px;
  font: 9.5px var(--font);
  font-weight: bold;
  color: var(--font-color-base);
}

.partnership-div > .fa-circle { color: var(--red); font-size: 6px; }

.team-div-euro > .partnership-div > .fa-circle { color:  rgb(26, 40, 175); }

.team-row {
  position: relative;
  margin: 0px;
  width: 100%;
  /* background-color: red; */
}

#team-row-0 { background-color: rgba(255, 220, 0, 0.1); }
:root[color-mode="dark"] #team-row-0 { background-color: #0f1711; }


#team-row-1 { background-color: rgba(255, 220, 0, 0.25); }
:root[color-mode="dark"] #team-row-1 { background-color: #18241b; }

/* .team-row > div {
  margin-top: 20px;
} */

.headshots {
    -ms-flex: 0 0 350px;
    flex: 0 0 350px;
  /* background-color: yellow; */
  /* height: 100px; */
  padding: 5px;
}

.player-div {
  position: relative;
  margin: 0px;
}

.player-div-1 {
  border-bottom: var(--container-border-base);
}

.player-headshot {
  float: left;
  width: 75px;
  height: 75px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.player-headshot-bb {
  margin-top: 2.5px;
}

.headshot-inner {
  position: relative;
  height: 85%;
  width: 85%;
  border-radius: 50%;
  border: 1px solid rgb(200, 20, 20);
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(200, 20, 20, 0.25);
}

.player-headshot-euro > .headshot-inner {
  border: 1px solid rgb(26, 40, 175);
  background-color: rgba(26, 40, 175, 0.25);
}

.even-odd-identifier {
  position: absolute;
  top: 1.5px;
  font: 7px var(--font);
  font-weight: bold;
  background-color: rgb(200, 20, 20);
  border-radius: 2.5px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  padding: 2px;
  padding-top: 1.5px; padding-bottom: 1.5px;
  z-index: 1;
}

.player-headshot-euro > .even-odd-identifier {
  color: gold;
  background-color: rgba(26, 40, 175, 1);
}

.headshot-inner > img {
  height: 120%;
  width: auto;
  margin-top: 12.5px;
}

.the-namer, .the-rank, .the-style, .the-bball-skill {
  position: relative;
  margin-bottom: 1px;
  padding-left: 2.5px;
  width: 100%;
  display: flex;
  height: 20px;
  justify-content: left;
  align-items: center;
  font: 11px var(--font);
  font-weight: bold;
  color: var(--font-color-base);
}

.the-namer {
  margin-top: 2.5px;
  font-size: 12px;
  margin-bottom: 2.5px;
}

.the-namer-bball {
  margin-top: 0px;
}

.the-namer > a { color: inherit; }

.the-namer > img {
  height: 15px;
  width: auto;
}

.the-rank {
  font-weight: normal;
}

.rank-outer {
  position: relative;
  text-align: center;
  min-width: 27.5px;
  font-weight: bold;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 5px;
  padding-right: 5px;
  border-radius: 1px;
  font-size: 9px;
  -webkit-box-shadow: var(--std-shadow);
  -moz-box-shadow: var(--std-shadow);
  box-shadow: var(--std-shadow);
}

.dg-100 { background-color: var(--olive-lighter); }
.dg-30 { background-color: var(--olive-light); }
.dg-10 { background-color: var(--olive); }
.dg-1 { background-color: var(--yellow); color: black; }

.the-style, .the-bball-skill {
  font-style: italic;
  font-weight: normal;
  color: var(--font-color-faint-2);
}

.the-style-bb {
  margin-top: -5px;
}

.the-bball-skill {
  margin-top: -2.5px;
  margin-bottom: -2px;
}

.team-info {
  margin-top: -25px;
  border-left: var(--container-border-base);
  /* background-color: blue; */
  padding: 0px;
  padding-top: 0px;
}

.team-stats {
  position: relative;
  height: 25px;
  border-bottom: var(--container-border-base);
}

.team-rating-box {
  float: left;
  position: relative;
  width: 33.3333%;
  display: flex;
  height: 100%;
  justify-content: left;
  align-items: center;
  font: 10px var(--font);
  color: var(--font-color-faint-2);
  border-left: var(--container-border-base);
  padding-left: 5px;
  padding-right: 0px;
}

.average-skill { border-left: none; }

.skill-box {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 95%;
  right: 5px;
  color: var(--font-color-base);
  font-weight: bold;
}

.fa-caret-up {
  color: var(--olive);
}

.overall-skill > .skill-box {
  right: 0px;
  width: 40px;
}

.team-desc {
  padding: 5px;
  font: 11px var(--font);
  color: var(--font-color-base);
}

.all-teams-divver {
  position: relative;
  margin-top: 2.5px;
  /* background-color: red; */
}

.all-teams-select {
  position: relative;
  display: flex;
  justify-content: left;
  align-items: center;
  font: 11px var(--font);
  color: var(--font-color-faint-2);
  padding: 3px;
  padding-left: 0px;
  font-weight: bold;
  cursor: pointer;
}

.all-teams-select:hover {
  color: var(--font-color-base);
}

.all-teams-selected {
  color: var(--font-color-base) !important;
  /* font-weight: bold; */
}

.all-teams-selected > .fa-chevron-down {
  transform: rotate(180deg);
}

.all-teams-table {
  position: relative;
  margin-left: 5px;
  width: calc(100% - 10px);
}

.all-teams-hidden {
  display: none;
}

.all-teams-table-top {
  position: relative;
  height: 25px;
}

.all-teams-head {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0px;
  background-color: var(--black-base);
  z-index: 3;
  height: 25px;
  width: 100%;
  border-bottom: var(--container-border-base);
  border-bottom-width: 1.5px;
}

.team-datarow {
  height: 25px;
}

.datarow.team-optimal { background-color: rgba(255, 220, 0, 0.25) !important; }
:root[color-mode="dark"] .datarow.team-optimal { background-color: #18241b !important; }

.datarow.team-optimal > .data.team-data { font-weight: bold !important; color: var(--font-color-base) !important; }

.team-data {
  font: 10.5px var(--font);
  font-weight: normal;
  color: var(--font-color-faint);
}

.rank-col { left: 0px; width: 40px; justify-content: left; padding-left: 1px; font-weight: bold; }
.player-odd-col { left: 40px; width: calc(27.5% - 20px); justify-content: left; padding-left: 2.5px; }
.player-even-col { left: calc(27.5% + 20px); width: calc(27.5% - 20px); justify-content: left; padding-left: 2.5px; }
.average-col { left: calc(55%); width: 15%; }
.compat-col { left: 70%; width: 15%; }
.overall-col { left: 85%; width: 15%; }

.player-odd-col > img, .player-even-col > img {
  height: 14px;
  width:auto;
}

.player-odd-col > a, .player-even-col > a {
  color: inherit;
}

.compat-col > .fa-caret-down { color: var(--red); }
.compat-col > .fa-caret-up { color: var(--olive); }

.overall-inner {
  width: 50px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bball-ball {
  position: relative;
  float: left;
  height: 10px;
  width: 10px;
  margin: 1px;
  border: 1px solid var(--font-color-base);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden !important;
}

.team-data > .bball-ball {
  margin: 0.5px;
  height: 8.5px;
  width: 8.5px;
}

.bball-ball.full-ball > div {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: var(--red);
}

.bball-ball.half-ball > div {
  width: 50%;
  position: absolute;
  left: 0px;
  top: 0px;
  height: 100%;
  background-color: var(--red);
}

.the-bball-skill-euro > .bball-ball > div { background-color: var(--blue); }
.player-euroo > .bball-ball > div { background-color: var(--blue); }
.player-euroo > .small-fits > .bball-ball > div { background-color: var(--blue); }

.p-col-small {
  display: none;
}

.section-description > ol, .section-description > ul {
  margin-top: 7.5px;
  margin-bottom: 7.5px;
  padding-inline-start: 30px;
}

@media (max-width: 768px) {


  .top-selections {
    height: 25px;
  }

  .top-selection {
    margin-left: 1.5px;
    margin-top: 5px;
    margin-right: 1.5px;
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
    padding: 2px;
    padding-top: 3.5px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 9px;
  }

  .top-selection-1 {
    margin-left: 3px;
  }

  .top-selected {
    margin-bottom: -1.5px;
  }

  .section-title {
    padding: 2.5px;
    font-size: 15px;
    margin-bottom: 2.5px;
  }

  .section-title-1 {
    margin-top: 2.5px;
  }

  .section-content {
    position: relative;
    width: calc(100% + 30px);
    margin-left: -15px;
  }

  .section-description {
    font-size: 10.5px;
  }

  .section-insight {
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 5px;
  }

  .headshots {
    -ms-flex: unset;
    flex: unset;
    padding: 5px;
    margin-top: -15px;
  }

  .team-info {
    margin-top: 0px;
    border-left: none;
    border-top: var(--container-border-base);
    padding: 0px;
    padding-top: 0px;
  }

  .team-rating-box {
    font-size: 9px;
    padding-left: 2.5px;
  }

  .skill-box {
    right: 2.5px;
  }

  .overall-skill > .skill-box {
    width: 35px;
  }

  .team-desc {
    padding: 5px;
    font-size: 10px;
  }

  .hole-col { left: 0px; width: 6%; }
  .par-col { left: 6%; width: 7%; }
  .ydg-col { left: 13%; width: 7%; }

  .dd-col { left: 20%; width: 10%; }
  .da-col { left: 30%; width: 10%; }
  .club-col { display: none; overflow: hidden; }
  .favoursa-col { left: 40%; width: 15%; }
  .favoursd-col { left: 55%; width: 15%; }
  .driving-header { left: 20%; width: 50%; }

  .approachavg-col { display: none; overflow: hidden; }
  .approach-col { left: 72.5%; width: calc(27.5%); overflow: visible; }
  .approach-header { display: none; }

  .datahead, .data {
    font-size: 9px;
  }

  .datahead {
    font-size: 8px;
  }

  .up-sorty, .down-sorty {
    margin-left: 1.5px;
  }

  .table {
    margin-bottom: 5px;
  }

  .data.hole-col > .holey {
    width: 20px;
    height: 20px;
    border-radius: 1px;
    border-width: 0.5px;
    color: var(--red);
  }

  .data.hole-col > .holeyy {
    /* background-color: var(--blue);
    border: var(--container-border-base);
    color: white; */
  }

  .hole-coly {
    width: 20%;
    padding-left: 1px;
  }

  .data.hole-coly > .holeyy {
    width: auto;
    max-width: unset;
    padding-left: 2px;
    padding-right: 2px;
  }

  .approach-inner {
    position: absolute;
    left: 0.25px;
    top: 0.25px;
    width: calc(100% - 0.5px);
    height: calc(100% - 0.5px);
    border-bottom-width: 0.5px;
  }

  .standard-back {
    display: none;
  }

  .favours-inside {
    height: 17.5px;
  }


  .lineup-title {
    font-size: 10px;
    padding: 2.5px;
  }

  .lineup-title > img {
    height: 13px;
  }


  .partnership-div {
    height: 20px;
    padding: 2px;
    font-size: 9px;
  }

  .headshots {
    display: flex;
    /* background-color: yellow; */
    /* height: 100px; */
    padding: 5px;
    align-items: flex-start;
  }

  .player-div {
    position: relative;
    width: 50%;
    margin: 0px;
    display: flex;
    justify-content: center;
  }

  .player-div-1 {
    border-bottom: none;
  }

  .player-info  {
    width: 100%;
  }

  .player-info > div {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .the-style-bb {
    margin-top: 0px;
  }


  .the-namer, .the-rank, .the-style, .the-bball-skill {
    padding-left: 2px;
    height: 17.5px;
    font-size: 10px;
  }

  .the-style {
    height: auto;
    display: flex;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
  }

  .the-namer {
    margin-top: 0px;
    font-size: 10.5px;
    margin-bottom: 1.5px;
  }

  .the-namer-bball {
    margin-top: 0px;
  }

  .the-namer > img {
    height: 14px;
  }

  .rank-outer {
    min-width: 25px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 4px;
    padding-right: 4px;
    border-radius: 1px;
    font-size: 8px;
  }

  .the-style-bb {
    margin-top: 0px;
  }

  .the-bball-skill {
    margin-top: 0px;
    margin-bottom: 0px;
  }

  .player-headshot-bb {
    margin-top: 0px;
  }

  .player-odd-col > img, .player-even-col > img {
    height: 12.5px;
    width:auto;
  }

  .all-teams-select {
    font-size: 10px;
    padding: 2px;
    padding-left: 0px;
  }

  .all-teams-table {
    position: relative;
    margin-left: 0px;
    width: calc(100%);
  }

  .all-teams-table-top {
    position: relative;
    height: 22.5px;
  }

  .all-teams-head {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0px;
    background-color: var(--black-base);
    z-index: 3;
    height: 25px;
    width: 100%;
    border-bottom: var(--container-border-base);
    border-bottom-width: 1.5px;
  }

  .team-datarow {
    height: 25px;
  }

  .rank-col { left: 0px; width: 30px; justify-content: left; padding-left: 1px; font-weight: bold; }
  .player-odd-col { left: 30px; width: calc(27.5% - 15px); justify-content: left; padding-left: 2px; }
  .player-even-col { left: calc(27.5% + 15px); width: calc(27.5% - 15px); justify-content: left; padding-left: 2px; }
  .average-col { left: calc(55%); width: 15%; }
  .compat-col { left: 70%; width: 15%; }
  .overall-col { left: 85%; width: 15%; }

  .p-col-big {
    display: none;
  }

  .p-col-small {
    display: flex;
  }

  .small-fits {
    position: absolute;
    top: 2px;
    left: 2px;
  }

  .small-fits > .bball-ball {
    height: 5px;
    width: 5px;
    margin: 0.5px;
    border: none;
    opacity: 0.75;
  }

  .p-col-small {
    padding-top: 6px;
  }

  .section-description > ol, .section-description > ul {
    margin-top: 5px;
    margin-bottom: 5px;
    padding-inline-start: 20px;
  }


}