:root {
  --orange-superlight: rgba(255, 133, 27, 0.1);
  --container-shadow-this: 0px 0px 2px 1px rgba(61, 153, 112, 1);
}

:root[color-mode="light"] {
  --container-shadow-rank: var(--std-shadow);
  /* --container-shadow-rank: 0px 0px 1px 1px rgba(0,0,0,0.5); */
  --grid-border-base: 1px solid rgb(235,235,235);
  --dark-fonter: rgb(40,40,40);
  --ryder-back: rgba(255, 220, 0, 0.15);
  --ryder-hover: rgba(255, 220, 0, 0.3);

  --grad-year-background: rgba(255, 220, 0, 0.2);
  --grad-year-backgroundd: #ffdc004d;
  --grad-year-background-solid: rgba(255, 220, 0, 0.5);

  --container-shadow-grey-thin: 0px 0px 2px 0px rgba(0,0,0,0.5);

  --container-color-base-1: rgba(240,240,240, 0.5);
  --container-color-base-2: rgba(240,240,240, 0.1);
}

:root[color-mode="dark"] {
  --container-shadow-rank: var(--std-shadow);
  --grid-border-base: 1px solid rgb(55,55,55);
  --dark-fonter: rgb(190,190,190);
  --ryder-back: rgba(61, 153, 112, 0.15);
  --ryder-hover: rgba(61, 153, 112, 0.3);
  --container-shadow-grey-thin: 0px 0px 2px 0px rgba(0,0,0,1);

  --grad-year-background: rgba(61, 153, 112, 0.2);
  --grad-year-backgroundd: rgba(61, 153, 112, 0.35);
  --grad-year-background-solid: rgba(61, 153, 112, 0.5);

  --container-color-base-1: rgba(35,35,35, 0.5);
  --container-color-base-2: rgba(35,35,35, 0.1);
}

.popover-body {
  font-weight: normal;
  padding: 3px;
  font-size: 9.5px;
  color: var(--font-color-base);
}

.top-row-v2 {
  overflow: visible;
}

.achieve-square {
  position: relative;
  float: left;
  margin: 1px;
  top: 0.5px;
  height: 10px;
  width: 10px;
  border-radius: 0.5px;
}

.achieve-square-tour, .achieve-img-outer {
  border-radius: 50%;
}

#seuro.achieve-square { border: 1px solid var(--blue); background-color: var(--blue-light); }
#spga.achieve-square { border: 1px solid var(--red); background-color: var(--red-light); }
#sliv.achieve-square {background-color: var(--font-color-faint-2);border: 1px solid var(--font-color-base); }
#skft.achieve-square {background-color: var(--olive-light);border: 1px solid var(--olive); }
#scha.achieve-square { background-color: rgba(40, 167, 69, 0.5); border: 1px solid rgba(40, 167, 69, 1); }
#s14.achieve-square {
  background-color: rgba(7, 102, 82, 0.5);
  border: 1px solid rgba(7, 102, 82, 1);
}

#s26.achieve-square {
  background-color: rgba(224, 0, 64, 0.5);
  border: 1px solid rgb(224, 0, 64, 1);
}

#s33.achieve-square {
  background-color: rgba(41, 63, 104, 0.5);
  border: 1px solid #293f68;
}

#s100.achieve-square {
  background-color: rgba(255, 193, 7, 0.5);
  border: 1px solid #ffc107;
}

#s11.achieve-square {
  background-color: rgba(202, 170, 119, 0.75);
  border: 1px solid rgba(202, 170, 119, 1);
}

#s11.achieve-square {
  border-radius: 50% !important;
}

.h-title-v2 {
  display: flex;
  font: 11px var(--font);
  padding-left: 0px !important;
  font-weight: bold;
  justify-content: left;
  align-items: center;
  padding-top: 5px;
  padding-bottom: 2.5px;
  overflow: visible;
}

.l-update-v2 {
  /* display: flex;
  justify-content: right;
  align-items: center;
  height: 100%;
  padding: 0px; */
  padding-top: 6.5px;
}

.live-tour-dropdown {
  /* border: 1px solid black; */
  position: relative;
  padding: 3px;
  margin-right: 0.5px;
  cursor: pointer;
  overflow: visible;
  z-index: 10;
}

.live-tour-dropdown-dead {
  cursor: unset !important;
  background-color: transparent !important;
}

.live-tour-dropdown:hover {
  background-color: var(--container-color-base);
}

.live-tour-menu {
  position: absolute;
  display: none;
  top: calc(100% + 0px);
  left: -0.25px;
  min-width: 45px;
  border: var(--container-border-base);
  background-color: var(--black-base);
}

.live-tour-option {
  position: relative;
  display: flex;
  justify-content: left;
  align-items: center;
  padding: 3px;
  padding-left: 5px;
  padding-right: 7.5px;
  font: 11px var(--font);
  color: var(--font-color-base);
}

.live-tour-option > .achieve-square {
  height: 7.5px;
  width: 7.5px;
  margin-left: 0px;
}

.live-tour-linker {
  text-decoration: none !important;
}

.live-tour-option:hover {
  background-color: var(--grad-year-background);
  color: var(--blue);
}

.head {
  top: 25px;
}


.header-logo-bg {
  opacity: 0.95;
  width: 27px;
  height: auto;
  position: relative;
  top: -2px;
}

.top-row {
  /* border-bottom: var(--container-border-base); */
  height: 41px;
}

.l-update {
  font-size: 8px;
}

/* .header-logo-bg, .h-title-bg { float: left; } */

.top-row {
  border-bottom: var(--container-border-base);
  height: 41px;
}

.table-div {
  padding: 0px;
  padding-top: 0px;
  margin-bottom: 25px;
  margin-top: 0px;
}

.tour-option-row {
  position: relative;
  width: calc(100% + 30px);
  margin-left: -15px;
  margin-top: 5px;
  margin-bottom: 5px;
  /* background-color: red; */
  display: flex;
  justify-content: left;
  padding-left: 0px;
  padding-bottom: 5px;
  align-items: center;
  border-bottom: var(--container-border-base);
}

.tour-div {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20px;
  /* width: 75px; */
  margin-left: 2px;
  margin-right: 2px;
  padding: 5px;
  padding-top: 1.5px;
  padding-bottom: 1.5px;
  font: 9.5px var(--font);
  font-weight: bold;
  color: var(--font-color-base);
  cursor: pointer;
  /* background-color: var(--container-color-base); */
  -webkit-box-shadow: var(--container-shadow-grey-thin);
  -moz-box-shadow: var(--container-shadow-grey-thin);
  box-shadow: var(--container-shadow-grey-thin);
}

.tour-sep {
  position: relative;
  top: -1px;
  font-weight: normal;
  color: var(--font-color-base);
  /* opacity: 0.25; */
  margin-left: 2.5px;
  margin-right: 2.5px;
}

.tour-div > .fa-circle {
  font-size: 5px;
  position: relative;
  top: 0.5px;
  margin-right: 3px;
  color: var(--font-color-faint-2);
}

.tour-div:hover {
  background-color: var(--container-color-base);
}

.tour-div:hover > .fa-circle {
  color: var(--font-color-base);
}

.selected-tour-div {
  background-color: var(--grad-year-background) !important;
  opacity: 1;
  color: var(--font-color-base);
  font-weight: bold;
  /* -webkit-box-shadow: var(--container-shadow-grey-thin);
  -moz-box-shadow: var(--container-shadow-grey-thin);
  box-shadow: var(--container-shadow-grey-thin); */
}

#pga.selected-tour-div > .fa-circle { color: var(--blue) !important; }
#euro.selected-tour-div > .fa-circle { color: var(--blue) !important; }
#kft.selected-tour-div > .fa-circle { color: var(--blue) !important; }
#cha.selected-tour-div > .fa-circle { color: var(--blue) !important; }
#liv.selected-tour-div > .fa-circle { color: var(--blue) !important; }


.disabled-tour-div {
  opacity: 0.3;
  pointer-events: none;
}

.tour-name-container {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0px;
  height: 50%;
  font: 9px var(--font);
  color: var(--font-color-base);
  font-weight: bold;
}

.tour-logo-container {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  bottom: 0px;
  height: 50%;
}

.tour-logo {
  height: 75%;;
  width: auto;
  opacity: 0.85;
}

.cha-logo {
  height: 100%;
  position: relative;
  top: -1.5px;
}

.upcoming-chunk-row {
  position: relative;
  width: calc(100% + 30px);
  margin-left: -15px;
  margin-top: 0px;
  margin-bottom: 3px;
  padding-left: 3px; padding-right: 3px;
  padding-bottom: 3px;
  font: 10px var(--font);
  padding: 2.5px;
}

.matrix-chunk-row {
  padding-top: 0px;
  padding-bottom: 0px;
}

.chunks {
  position: relative;
  display: flex;
  justify-content: left;
  align-items: start;
}

.upcoming-div {
  max-width: 220px;
  margin: 2.5px;
  position: relative;
  padding: 2.5px;
  background-color: var(--container-color-base);
  border: var(--container-border-base);
  border-radius: 2px;
}

.upcoming-iso {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  font: 9px var(--font);
  color: var(--blue);
  font-weight: bold;
  margin-bottom: 2px;
}

.upcoming-title, .upcoming-desc {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2.5px;
  padding-left: 5px;
  padding-right: 5px;
  text-align: center;
  width: 100%;
  font: 10.5px var(--font);
  color: var(--font-color-base);
  /* font-weight: bold; */
}

.top-70-cut > .upcoming-title {
  background-color: var(--black-base);
  border: var(--container-border-base);
  color: rgba(177, 13, 201, 1);
}

.top-70-cut {
  margin-left: 0px;
}

.top-50-cut > .upcoming-title {
  background-color: var(--black-base);
  border: var(--container-border-base);
  color: rgba(255, 133, 27, 1);
}

.top-30-cut > .upcoming-title {
  background-color: var(--black-base);
  border: var(--container-border-base);
  color: var(--green);
}

.top-100-cut > .upcoming-title {
  background-color: var(--black-base);
  border: var(--container-border-base);
  color: var(--font-color-base);
}

.upcoming-desc {
  text-align: center;
  font: 9px var(--font);
  color: var(--font-color-faint-2);
  padding-left: 2.5px;
  padding-right: 2.5;
}

.upcoming-proj, .upcoming-points {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  font: 8px var(--font);
  color: var(--green);
  font-weight: bold;
  margin-top: 2px;
}

.upcoming-points {
  font-size: 13px;
  color: var(--font-color-base);
  font-weight: bold;
}

.chunk-row {
  position: relative;
  width: calc(100% + 30px);
  margin-left: -15px;
  margin-top: 0px;
  margin-bottom: 3px;
  padding-left: 3px; padding-right: 3px;
  padding-bottom: 3px;
  font: 10px var(--font);
  padding: 2.5px;
  /* border-radius: 2.5px; */
  /* border-bottom: var(--container-border-base); */
  background-color: rgba(255, 220, 0, 0.1);
  border-top: 1px solid var(--blue);
  border-bottom: 1px solid var(--blue);
}

:root[color-mode="dark"] .chunk-row { background-color: #162119; }

.chunk-col {
  /* background-color: red; */
  padding: 2.5px;
}

.chunk-col-1 {
  padding-right: 7.5px;
}

.chunk-title {
  position: relative;
  width: 100%;
  font: 11px var(--font);
  color: var(--font-color-base);
  font-weight: bold;
}

.chunk-title > .fa-circle {
  color: var(--red); font-size: 6px; position: relative; top: -1px;
}

.priority-toggle {
  position: relative;
  width: 100%;
  font: 11px var(--font);
  color: var(--font-color-base);
  height: 17.5px;
  font-weight: bold;
  /* background-color: red; */
}

.prior-inner {
  position: absolute;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-right: 5px; padding-left: 2.5px;
  /* background-color: red; */
  cursor: pointer;
}

.prior-inner:hover {
  background-color: var(--container-color-base);
}

.chunk-desc {
  position: relataive;
  width: 100%;
  margin-top: 2.5px;
  font: 10.5px var(--font);
  color: var(--font-color-faint-2);
}

:root {
  --matrix-bump-left: 15px;
}

.matrix-table {
  position: relative;
  margin-left: var(--matrix-bump-left);
  width: calc(100% - var(--matrix-bump-left));
}

.matrix-r {
  position: relative;
  width: 100%;
}

.matrix-topper {
  height: 15px;
}

.matrix-head {
  height: 22.5px;
  border-bottom: 1px solid var(--font-color-base);
}

.matrix-datarow {
  height: 25px;
  border-bottom: var(--datarow-border);
}

.matrix-table-topper {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  font: 9.5px var(--font);
  color: var(--font-color-base);
  height: 100%;
  background-color: rgba(40, 167, 69, 0.5);
  border: 1px solid rgba(40, 167, 69, 0.5);
  right: 0px;
  width: 70%;
}

.matrix-table-side-topper {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  font: 9.5px var(--font);
  color: var(--font-color-base);
  right: 100%;
  top: 37.5px;
  height: calc(25px * 8);
  width: var(--matrix-bump-left);
  background-color: var(--container-color-base);
  border: var(--container-border-base);
}

.matrix-table-side-topper > div {
  transform: rotate(-90deg);
    transform-origin: right, top;
    -ms-transform: rotate(-90deg);
    -ms-transform-origin:right, top;
    -webkit-transform: rotate(-90deg);
    -webkit-transform-origin:right, top;
    position: absolute;
    width: 100px;
}

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

.matrix-count {
  position: absolute;
  font: 8.5px var(--font);
  color: var(--font-color-base);
  display: flex;
  justify-content: center;
  align-items: center;
  right: 0px;
  padding-right: 2.5px;
  height: 100%;
}

.matrix-datarow-8 > .matrix-0 > .matrix-count { display: none; }

.matrix-data > .fa-circle {
  font-size: 6px;
  position: relative;
  top: 1px;
}

.matrix-rank {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--font-color-base);
  font-weight: bold;
  font-size: 9px;
  padding: 3px;
  min-width: 35px;
}

.matrix-0 { left: 0%; width: 30%; border-right: 1px solid var(--font-color-base); }
.matrix-1 { left: 30%; width: 17.5%; border-right: var(--datarow-border); }
.matrix-2 { left: 47.5%; width: 17.5%; border-right: var(--datarow-border); }
.matrix-3 { left: 65%; width: 17.5%; border-right: var(--datarow-border); }
.matrix-4 { left: 82.5%; width: 17.5%; border-right: var(--datarow-border); }

.matrix-data.matrix-0 { justify-content: left; padding-left: 2.5px; }

.import-title {
  position: relative;
  font-weight: bold;
  color: var(--font-color-base);
  font-size: 8px;
  /* text-decoration: underline; */
  margin-bottom: 2px;
}

.notable-cutoff-note {
  position: relative;
  font-size: 10px;
  color: var(--font-color-base);
  opacity: 1;
  /* font-weight: bold; */
  /* font-style: italic; */
  margin-top: 3px; margin-bottom: 3px;
}

.hidden-logi {
  display: none;
}

.table-top-div {
  height: 25px;
  margin-top: 0px;
  background-color: var(--black-base);
}

.standing-table-title {
  position: relative;
  top: 0px;
  font: 15px var(--font);
  color: var(--font-color-base);
  font-weight: bold;
}

.update-info {
  position: absolute;
  right: 5px;
  bottom: 2.5px;
  font: 9px var(--font);
  color: var(--font-color-faint-2);
}

.update-enhance {
  font-size: 10px;
  color: var(--font-color-base);
  /* font-style: italic; */
  font-weight: bold;
}

.table-topper {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20px;
  font: 9px var(--font); color: var(--font-color-base); font-weight: bold;
  bottom: 0px;
  padding: 3px;
  border: var(--container-border-base);
}

.table-topper > img {
  height: 17.5px;
  width: auto;
}

.datahead {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px;
  font: 10px var(--font);
  color: var(--font-color-faint-2);
  /* font-weight: bold; */
  height: 100%;
}

.datarow {
  height: 27.5px;
}

/* .datarow-0 { background-color: var(--container-color-base-1); } */
/* .datarow-1 { background-color: var(--container-color-base-2); } */

/* .datarow:hover { background-color: var(--grad-year-background) !important; } */

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

.up-sorty, .down-sorty { display: none; margin-left: 3px; }

.rank-col { left: 0px; width: 40px; }
.player-col { left: 40px; width: calc(25% - 40px); }

.starts-col { left: 25%; width: 5%; }
.points-col { left: 30%; width: 12.5%; justify-content: left; padding-left: 2.5px; }
.proj-starts-col { left: 42.5%; width: 5%; }
.proj-points-col { left: 47.5%; width: 12.5%; justify-content: left; padding-left: 2.5px; }

.top-70-col { left: 60%; width: 8%; }
.top-50-col { left: 68%; width: 8%; }
.top-30-col { left: 76%; width: 8%; }
.top-1-col { left: 84%; width: 8%; }
.top-100-col { left: 92%; width: 8%; }

.data.events-col, .data.points-col, .data.proj-points-col, .data.top-70-col { border-left: var(--datarow-border); }
.data.top-100-col { border-left: 1px solid var(--font-color-base); }

.data.perc-col {
  font-size: 9px;
  /* font-weight: normal; */
}

.data.proj-starts-col, .data.starts-col {
  border-left: var(--datarow-border);
}

.data.proj-starts-col, .data.proj-points-col {
  color: rgba(31, 202, 35, 1);
  background-color: rgba(31, 202, 35, 0.1);
}

.point-topper-probs { right: 0px; width: 40%; background-color: var(--container-color-base); border: var(--container-border-base); }
.point-topper-projs { left: 42.5%; width: 17.5%; background-color: rgba(31, 202, 35, 0.5); border: 1px solid rgba(31, 202, 35, 0.5); }

.datahead > img {
  position: relative;
  height: 10px;
  width: auto;
}

.fin-topper {
  left: 28%;
  width: 21%;
  border-right: none;
}

.point-topper-pga {
  background-color: rgba(255, 65, 54, 0.1);
  border: 1px solid var(--red);
}

.point-topper-cha {
  background-color: rgba(40, 167, 69, 0.1); border-color: rgba(40, 167, 69, 1);
}

.point-topper-euro {
  background-color: var(--blue-superlight); border: 1px solid var(--blue);
}

.point-topper-kft {
  background-color: var(--olive-superlight); border: 1px solid var(--olive);
}

.point-topper-liv {
  background-color: var(--black-base);
  border: 1px solid var(--font-color-base);
 }

}

.chevvy-right {
  color: var(--olive);
  font-size: 7.5px;
  margin-left: 2.5px;
}

.chevvy-left {
  color: var(--olive);
  font-size: 7.5px;
  margin-right: 2.5px;
}

.point-title {
  margin-right: 3px;
}

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

.player-col > .add-ellipsis >  a {
  color: inherit;
}

.add-ellipsis {
  margin: 0 0px;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.player-col > .add-ellipsis > img {
  height: 13.5px;
  width: auto;
  margin-top: -2px;
  /* margin-right: 2.5px; */
}

.data.player-col {
  font: 10.5px var(--font);
  color: var(--font-color-base);
  font-weight: bold;
  padding-left: 0px;
  display: flex;
  height: 100%;
  justify-content: left;
  align-items: center;
  padding-left: 2.5px;
}

.name-small-small { font-weight: normal; }



.bar-outer {
  position: absolute;
  height: 60%;
  width: calc(100% - 50px);
  right: 10px;
  /* border-left: 1.5px solid var(--olive); */
  /* background-color: red; */
}

.bar-axis {
  position: absolute;
  left: -0.75px;
  top: 0px;
  width: 1.5px;
  height: 100%;
  background-color: var(--red);
  border-radius: 2px;
}

.dg-point-rect {
  fill: var(--font-color-base);
  opacity: 0.75;
  /* filter: url(#glow); */
}

.dg-point-rect-back {
  fill: var(--red);
  filter: url(#glow);
}

.dg-point-text {
  position: absolute;
  display: flex;
  justify-content: right;
  align-items: center;
  right: calc(100% + 5px);
  top: 0px;
  height: 100%;
  font: 9px var(--font);
  color: var(--font-color-base);
  font-weight: bold;
}

.dg-point-text-base {
  opacity: 0.3;
}


.trophy-inner {
  float: left;
  height: 17px;
  width: 17px;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 7.5px;
  border: var(--container-border-base);
  background-color: gold;
  color: black;
  margin-left: 0.5px;
  margin-right: 0.5px;
}

.sg-base, .sg-front {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 18.5px;
  width: 35px;
  background-color: var(--black-base);
  font-size: 8.5px;
  color: var(--font-color-faint-2);
  border: var(--container-border-base);
  border-width: 0.5px;
  border-radius: 1.5px;
}

.sg-front {
  /* background-color: transparent; */
  /* color: rgba(46, 204, 64, 1); */
  /* border: var(--container-border-base); */
  color: var(--font-color-base);
}


.a-winner {
  color: var(--font-color-base);
}

.datahead.player-col {
  justify-content: left;
  padding-left: 2.5px;
}

.data.player-col {
  /* justify-content: left;
  padding-top: 1px;
  font-size: 11px;
  padding-left: 19px; */
  font-size: 10px;
  padding-right: 15px;
}

.data.name-col { display: block; }

.flag-bg {
  top: 7.5px;
  /* top: unset; */
  left: 1.5px;
  height: 13;
  width: 14;
  opacity: 1;
}

.name-first {
  font-size: 9px;
}

.extra-wrapper {
  margin-left: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 2.5px;
}

.extra-tour {
  padding: 3px;
  font-size: 8px;
  margin-left: 3px;
  font-weight: bold;
  border-radius: 1px;
  min-width: 25px;
  position: relative;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border: none !important;
  -webkit-box-shadow: var(--container-shadow-grey-thin);
  -moz-box-shadow: var(--container-shadow-grey-thin);
  box-shadow: var(--container-shadow-grey-thin);
}

.extra-tour-card {
  min-width: 0px;
  padding: 0px; padding-top: 1px; padding-bottom: 1px;
  cursor: default;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  box-shadow: none !important;
}

.tour-logo-eli {
  width: auto;
  height: 15px;
}

.extra-popper {
  position: absolute;
  bottom: calc(100% + 5px);
  font-size: 8px;
  background-color: var(--black-base);
  -webkit-box-shadow: var(--container-shadow-grey-thin);
  -moz-box-shadow: var(--container-shadow-grey-thin);
  box-shadow: var(--container-shadow-grey-thin);
}

.rank-inside {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  /* background-color: var(--font-color-base); */
  opacity: 1;
  border: none;
  font-size: 9px;
  height: 16.5px;
  min-width: 28px;
  color: var(--font-color-base);
  border-radius: 1px;
  border: none;
  -webkit-box-shadow: var(--container-shadow-rank);
  -moz-box-shadow: var(--container-shadow-rank);
  box-shadow: var(--container-shadow-rank);
}

.liv-24 { background-color: var(--black-base); border: 1px solid var(--font-color-base); color: rgb(56, 158, 13); }
.liv-48 { background-color: var(--black-base); border: 1px solid var(--font-color-base); color: rgb(255, 197, 61); }
.liv-drop { background-color: var(--black-base); border: 1px solid var(--font-color-base); color: rgb(255, 0, 0); }

/* :root[color-mode="dark"] .liv-24 { border-color: rgba(56, 158, 13, 0.75); } */

.back-rect-liv { fill: #bdff69; } .axis-liv { background-color: var(--font-color-base); }

.pga-30, .pga-3000 {  background-color: rgba(31, 202, 35, 0.5); } .pga-30-circle, .pga-3000-circle { color: rgba(31, 202, 35, 0.6); }
.back-rect-pga { fill:  rgba(31, 202, 35, 1); } .axis-pga { background-color: var(--font-color-base); }

.pga-50 { background-color: rgba(255, 133, 27, 0.55); } .pga-50-circle { color: rgba(255, 133, 27, 0.6); }
.pga-70 { background-color: rgba(177, 13, 201, 0.55); } .pga-70-circle { color: rgba(177, 13, 201, 0.6); }
.pga-125 { background-color: rgba(150,150,150, 0.55); } .pga-125-circle { color: rgba(150,150,150, 0.6); }
.matrix-rank.pga-out { border: 1px solid var(--font-color-base); color: var(--red); }

.kft-final, .can-5 { background-color: var(--red-light); } .kft-final-circle, .can-5-circle { color: var(--red); opacity: 0.75; }
:root[color-mode="light"] .kft-25 {  background-color: rgb(50,50,50); color: rgb(240,240,240) !important; } :root[color-mode="light"] .kft-25-circle { color: rgb(50,50,50); }
:root[color-mode="dark"] .kft-25 {  background-color: rgb(230,230,230); color: rgb(40,40,40) !important; } :root[color-mode="dark"] .kft-25-circle { color: rgb(230,230,230); }
/* .kft-25 { background-color: rgb(40,40,40); color: rgb(240,240,240); } */
.back-rect-kft { fill: var(--olive); } .axis-kft { background-color: var(--font-color-base); }

.eur-125 { background-color: rgba(231, 43, 101, 0.55); } .eur-125-circle { color: rgba(231, 43, 101, 0.6); }
.eur-10 {  background-color: rgba(92,187,124, 0.55); } .eur-10-circle { color: rgba(92,187,124, 0.6); }
.back-rect-euro { fill: var(--blue); } .axis-euro { background-color: var(--font-color-base); }

.cha-20 {  background-color: rgba(0, 149, 181, 0.4); } .cha-20-circle { color: rgba(0, 149, 181, 0.6); }
.back-rect-cha { fill:  rgba(0, 149, 181, 1); } .axis-cha { background-color: var(--font-color-base); }

/* .extra-tour.outside { border: var(--container-border-base); } */

.extra-tour:hover {
  /* border: none; */
  /* -webkit-box-shadow: var(--container-shadow-grey-thin);
  -moz-box-shadow: var(--container-shadow-grey-thin);
  box-shadow: var(--container-shadow-grey-thin); */
}

.ev-bar-container {
  top: 0px;
  height: 32%;
}

.ev-text {
  font-size: 9px;
  color: var(--font-color-faint-2);
  font-weight: bold;
}

/* .bar-usa { background-color: var(--red); opacity: 0.6; } .bar-euro { background-color: var(--blue); opacity: 0.6; } */
.neg-ev-bar { background-color: var(--font-color-faint-2); }
.sg-col > .ev-bar-container > .pos-ev-bar { background-color: var(--font-color-base); }
/*
.datarow:hover > .data, .datarow:hover > .sg-col > .ev-bar-container > .ev-text, .datarow:hover > .true-col > .ev-bar-container > .ev-text {
  color: var(--font-color-base);
} */

.player-search-container {
  position: absolute;
  bottom: 1px;
  height: 22px;
  width: 200px;
  background-color: var(--black-base);
  border: var(--container-border-base);
}

.glass-inner {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 100%;
  border-right: var(--container-border-base);
  background-color: var(--container-color-base);
  font-size: 10px;
  color: var(--font-color-faint);
}

.player-search {
  position: absolute;
  top: 0px;
  bottom: unset;
  left: 0px;
  height: calc(100% - 1px);
  width: calc(100% - 0px);
  border: none;
  background-color: var(--black-base);
  padding-left: 5px;
  font-size: 11px;
}

.my-mini {
  position: absolute;
  right: 4px;
  color: var(--blue);
  font-weight: bold;
  font-size: 8.5px;
  display: none;
}

.my-mini-go {
  display: block !important;
}

.suffer {
  position: relative;
  top: -1px;
  font-size: 6.5px;
  color: var(--font-color-base);
}

.datarow:hover > .data > .my-mini {
  display: block;
}

.spacer {
  display: none;
}

.random-info-row {
  position: relative;
  width: calc(100% + 30px);
  margin-left: -15px;
  padding: 2.5px;
  margin-top: 5px;
  /* border-bottom: var(--container-border-base); */
}

.small--only { display: none; }

.dgp-backer {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 0px;
  top: 20%;
  background-color: #012d54;
  background-color: rgba(133, 20, 75, 0.5);
  height: 60%;
  border: 1px solid rgba(133, 20, 75, 0.5);
  border-left: none;
  border-top-right-radius: 1.5px;
  border-bottom-right-radius: 1.5px;
}

.dgp-backer-pga {
  border-color: var(--red);
  background-color: var(--red-light);
}

.dgp-backer-proj {
  border-color: rgba(31, 202, 35, 1);
  background-color: rgba(31, 202, 35, 0.6);
  color: var(--font-color-base);
}

.dgp-backer-euro {
  border-color: var(--blue);
  background-color: var(--blue-light);
}

.dgp-backer-cha {
  background-color: rgba(40, 167, 69, 0.5); border-color: rgba(40, 167, 69, 1);
}

.dgp-backer-kft {
  border-color: var(--olive);
  background-color: var(--olive-light);
}

.dgp-backer-liv {
  background-color: var(--font-color-faint-2);border-color: var(--font-color-base);
}

.dgp-backer > .dgp-text {
  position: absolute;
  right: 2px;
  /* color: rgba(230,230,230); */
  font-size: 8px;
}

.dgp-backer-low > .dgp-text {
  right: unset;
  left: calc(100% + 2.5px);
  color: var(--font-color-faint-2);
  font-size: 8px;
}

.prior-outer {
  position: absolute;
  right: 2.5px;
  height: 15px;
  width: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.prior-outer > div {
  font-size: 8px;
  height: 90%;
  width: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.prior-1 { background-color: rgba(31, 202, 35, 0.5); border-radius: 1px; }
.prior-2 { background-color: rgba(177, 13, 201, 0.55); border-radius: 1px; }
.prior-3 { background-color: rgba(150,150,150, 0.55); border-radius: 1px; }
.prior-4 { background-color: var(--blue-light); border-radius: 50%; }
.prior-5 { background-color: var(--olive-light); border-radius: 50%; }
.prior-6 { background-color: var(--red-light); border-radius: 50%; }
.prior-7 { background-color: var(--black-base); border: 1px solid var(--font-color-base); color: var(--red); border-radius: 1px; }
.prior-8 { background-color: var(--container-color-base); border: var(--container-border-base); border-radius: 50%; }

.chunk-row-matrix.matrix-hidden {
  display: none;
}

.exemptions {
  position: relative;
  width: calc(100% + 30px);
  margin-left: -15px;
  padding: 5px;
  background-color: rgba(255, 220, 0, 0.1);
  border-top: 1px solid var(--blue);
  border-bottom: 1px solid var(--blue);
}

:root[color-mode="dark"] .exemptions { background-color: #162119; }

.exemption-title {
  font: 10px var(--font);
  width: 100%;
  text-align: center;
  color: var(--font-color-base);
  font-weight: bold;
  margin-bottom: 2.5px;
}

.exemption-row {
  position: relative;
  text-align: center;
  padding: 2px;
  padding-left: 10%;;
  padding-right: 10%;
  font: 10px var(--font);
  color: var(--font-color-base);
}

.standing-title-inner {
  display: inline-block;
  font-size: 11px;
  font-weight: normal;
  position: relative;
  top: -1px;
}


@media (max-width: 768px) {

  .small--only { display: inline-block; text-decoration: inherit; }
  .big--only { display: none; }

  .exemptions {
    padding: 3px;
  }

  .exemption-title {
    font-size: 9px;
    margin-bottom: 1.5px;
    display: none;
  }

  .exemption-row {
    width: 100%;
    padding: 1.5px;
    padding-left: 10%;;
    padding-right: 10%;
    font-size: 8px;
  }

  .achieve-square {
    height: 8px;
    width: 8px;
  }

  .h-title-v2 {
    font-size: 9.5px;
    padding-top: 3.5px;
    padding-bottom: 1.5px;
  }

  .l-update-v2 {
    padding-top: 5px;
  }

  .live-tour-dropdown {
    padding: 2.5px;
    margin-right: 0.5px;
  }

  .live-tour-menu {
    left: 0px;
  }

  .live-tour-option {
    padding: 2.5px;
    padding-left: 3px;
    padding-right: 5px;
    font-size: 9.5px;
  }

  .live-tour-option > .achieve-square {
    height: 7px;
    width: 7px;
  }

  .top-row {
    height: 35px;
  }

  .last-update-iso {
    font-size: 10px;
  }

  .l-update {
    font-size: 7px;
    padding-top: 5px;
  }

  .night-option {
    font-size: 8px;
    top: 18px;
    padding-left: 3px;
    padding-top: 2px;
    padding-right: 2px;
    padding-bottom: 1px;
  }

  .header-logo-bg {
    opacity: 0.95;
    width: 22px;
    height: auto;
    position: relative;
    top: -3px;
  }

  .h-title-bg {
    font-size: 13px;
    top: -2px;
  }

  .tour-option-row {
    margin-top: 3px;
    margin-bottom: 3px;
    padding-left: 0px;
    padding-bottom: 3px;
  }

  .tour-div {
    height: 17.5px;
    /* width: 65px; */
    margin-left: 2px;
    margin-right: 2px;
    padding: 1px;
    padding-left: 4px; padding-right: 4px;
    font-size: 8.5px;
  }

  .tour-sep {
    top: -1px;
    font-size: 10px;
    margin-left: 1.5px;
    margin-right: 1.5px;
  }

  .tour-div > .fa-circle {
    font-size: 4px;
    top: 0.5px;
    margin-right: 2px;
  }

  .tour-name-container {
    font-size: 7px;
  }

  .notable-row {
    margin-top: 2px;
    margin-bottom: 2px;
    padding: 2px;
    padding-left: 2px; padding-right: 2px;
    padding-bottom: 1px;
    font-size: 9.5px;
  }

  .import-title {
    font-size: 7.5px;
    margin-bottom: 2px;
  }

  .notable-cutoff-note {
    position: relative;
    font-size: 8.5px;
    margin-top: 2px; margin-bottom: 2px;
  }

  .notable-cutoff-note > .fa-square {
    top: -0.5px !important;
  }

  .table-top-div {
    height: 22.5px;
    margin-top: 0px;
  }

  .standing-table-title {
    left: 1.5px;
    font-size: 13px;
  }

  .update-info {
    right: 1.5px;
    bottom: 1px;
    font-size: 7px;
  }

  .update-enhance {
    font-size: 8px;
  }

  .head {
    top: 22.5px;
    height: 20px;
  }

  .table-topper {
    height: 17.5px;
    font-size: 8px;
  }

  .table-topper > img {
    height: 15px;
    width: auto;
  }

  .datahead {
    font-size: 9px;
  }

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

  .rank-col { left: 0px; width: 30px; }
  .player-col { left: 30px; width: calc(35% - 30px); }

  .starts-col { overflow: hidden; display: none; }
  .points-col { left: 35%; width: 15%; justify-content: left; padding-left: 2.5px; }
  .proj-starts-col { overflow: hidden; display: none; }
  .proj-points-col { left: 50%; width: 15%; justify-content: left; padding-left: 2.5px; }

  .top-70-col { left: 65%; width: 8.75%; }
  .top-50-col { left: 73.75%; width: 8.75%; }
  .top-30-col { left: 82.5%; width: 8.75%; }
  .top-1-col { left: 91.25%; width: 8.75%; }
  .top-100-col { overflow: hidden; display: none; }

  .point-topper-probs { right: 0px; width: 35%; background-color: var(--container-color-base); border: var(--container-border-base); }
  .point-topper-projs { display: none; }

  .spacer {
    display: block;
  }

  .chevvy-right {
    font-size: 7px;
    margin-left: 2px;
  }

  .chevvy-left {
    font-size: 7px;
    margin-right: 2px;
  }

  .rank-inside {
    padding: 0px;
    font-size: 8px;
    height: 15px;
    min-width: 22.5px;
  }

  .point-title {
    margin-right: 3px;
  }

  .player-col { padding-left: 1.5px; }


  .data {
    font-size: 8.5px;
  }

  .flag-bg {
    top: calc(50% - 6px);
    height: 12px;
    width: auto;
  }

  .extra-tour {
    display: none;
  }

  .extra-tour-card {
    min-width: 0px;
    padding: 0px; padding-top: 1px; padding-bottom: 1px;
  }

  .tour-logo-eli {
    height: 13px;
  }

  .extra-popper {
    position: absolute;
    bottom: calc(100% + 5px);
    font-size: 8px;
    background-color: var(--black-base);
    -webkit-box-shadow: var(--container-shadow-grey-thin);
    -moz-box-shadow: var(--container-shadow-grey-thin);
    box-shadow: var(--container-shadow-grey-thin);
  }

  /* .pga-30, .pga-3000 { background-color: rgba(31, 202, 35, 0.4); } .pga-30-circle, .pga-3000-circle { color: rgba(31, 202, 35, 0.6); }
  .pga-50 { background-color: rgba(255, 133, 27, 0.4); } .pga-50-circle { color: rgba(255, 133, 27, 0.6); }
  .pga-70 { background-color: rgba(177, 13, 201, 0.4); } .pga-70-circle { color: rgba(177, 13, 201, 0.6); }

  .kft-final, .can-5 { background-color: var(--red-light); } .kft-final-circle, .can-5-circle { color: var(--red); opacity: 0.75; }
  :root[color-mode="light"] .kft-25 { background-color: rgb(50,50,50); color: rgb(240,240,240) !important; } :root[color-mode="light"] .kft-25-circle { color: rgb(50,50,50); }
  :root[color-mode="dark"] .kft-25 { background-color: rgb(230,230,230); color: rgb(40,40,40) !important; } :root[color-mode="dark"] .kft-25-circle { color: rgb(230,230,230); }

  .eur-125 { background-color: rgba(231, 43, 101, 0.4); } .eur-125-circle { color: rgba(231, 43, 101, 0.6); }
  .eur-10 { background-color: rgba(92,187,124, 0.4); } .eur-10-circle { color: rgba(92,187,124, 0.6); }

  .cha-20 { background-color: rgba(0, 149, 181, 0.4); } .cha-20-circle { color: rgba(0, 149, 181, 0.6); } */

  .datarow:hover > .data, .datarow:hover > .sg-col > .ev-bar-container > .ev-text, .datarow:hover > .true-col > .ev-bar-container > .ev-text {
    color: var(--font-color-base);
  }

  .player-search-container {
    top: unset;
    bottom: 0px;
    height: 17px;
    max-width: 150px;
    width: 35%;
  }

  .player-search {
    left: 0px;
    width: calc(100%);
    padding-left: 3px;
    font-size: 9px;
  }

  .bar-outer {
    width: calc(100% - 35px);
    right: 5px;
    /* border-left: 1.5px solid var(--olive); */
    /* background-color: red; */
  }

  .data-cumulative.points-col > .bar-outer {
    width: calc(100% - 40px);
  }

  .bar-axis {
    left: -0.5px;
    width: 1px;
  }

  .dg-point-text {
    right: calc(100% + 3px);
    font-size: 8px var(--font);
  }

  .sg-base, .sg-front {
    height: 16px;
    width: 25.5px;
    font-size: 7.5px;
  }

  .data-coverage-pop {
    right: 0.5px;
    top: 1px;
    font-size: 8px;
  }

  .random-info-row {
    padding: 1px;
    margin-top: 2.5px;
    /* border-bottom: var(--container-border-base); */
  }

  .player-col > .add-ellipsis > img {
    height: 12px;
    margin-top: -2px;
  }

  .player-col > .add-ellipsis {
    /* padding-right: 10px; */
  }

  .upcoming-chunk-row {
    margin-bottom: 1.5px;
    padding-left: 1.5px; padding-right: 1.5px;
    padding-bottom: 1.5px;
    font-size: 9px;
    padding: 1px;
  }

  .matrix-chunk-row {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .upcoming-div {
    max-width: calc(25% - 2px);
    margin: 1px;
    padding: 2px;
    border-radius: 1px;
  }

  .upcoming-iso {
    font-size: 7.5px;
    margin-bottom: 1.5px;
  }

  .upcoming-title, .upcoming-desc {
    padding: 2px;
    padding-left: 0.5px;
    padding-right: 0.5px;
    font-size: 8.5px;
  }

  .top-70-cut {
    margin-left: 0px;
  }

  .upcoming-desc {
    display: none;
  }

  .upcoming-proj, .upcoming-points {
    font-size: 7px;
    margin-top: 2px;
  }

  .upcoming-points {
    font-size: 11px;
  }

  .chunk-row {
    margin-bottom: 1.5px;
    padding-left: 2px; padding-right: 2px;
    padding-bottom: 2px;
    font-size: 9px;
    padding: 2px;
  }

  .chunk-col {
    /* background-color: red; */
    padding: 1.5px;
  }

  .chunk-col-1 {
    padding-right: 7.5px;
  }

  .chunk-title {
    font-size: 9px;
  }

  .chunk-title > .fa-circle {
    font-size: 5px; position: relative; top: -1px;
  }

  .priority-toggle {
    font-size: 9px;
    height: 14px;
    /* background-color: red; */
  }

  .prior-inner {
    position: absolute;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-right: 5px; padding-left: 2.5px;
    /* background-color: red; */
    cursor: pointer;
  }

  .prior-inner:hover {
    background-color: var(--container-color-base);
  }

  .chunk-desc {
    margin-top: 2px;
    font-size: 9.5px;
  }

  :root {
    --matrix-bump-left: 14px;
  }

  .matrix-r {
    position: relative;
    width: 100%;
  }

  .matrix-topper {
    height: 14px;
  }

  .matrix-head {
    height: 20px;
  }

  .matrix-datarow {
    height: 23px;
  }

  .matrix-table-topper {
    font-size: 8.5px;
    width: 70%;
  }

  .matrix-table-side-topper {
    font-size: 8.5px;
    top: 33px;
    height: calc(23px * 8);
  }

  .matrix-datahead, .matrix-data {
    font-size: 8.5px var(--font);
  }

  .matrix-count {
    font-size: 7.5px;
    padding-right: 1px;
  }

  .matrix-data > .fa-circle {
    font-size: 5px;
    top: 1px;
  }

  .matrix-rank {
    font-size: 7.5px;
    padding: 2px;
    min-width: 30px;
  }

  .matrix-0 { left: 0%; width: 30%; border-right: 1px solid var(--font-color-base); }
  .matrix-1 { left: 30%; width: 17.5%; border-right: var(--datarow-border); }
  .matrix-2 { left: 47.5%; width: 17.5%; border-right: var(--datarow-border); }
  .matrix-3 { left: 65%; width: 17.5%; border-right: var(--datarow-border); }
  .matrix-4 { left: 82.5%; width: 17.5%; border-right: var(--datarow-border); }

  .matrix-data.matrix-0 { justify-content: left; padding-left: 1.5px; }

  .dgp-backer > .dgp-text {
    right: 1px;
    font-size: 7.5px;
  }

  .dgp-backer-low > .dgp-text {
    left: calc(100% + 2px);
    font-size: 7.5px;
  }

  .prior-outer {
    right: 1.5px;
    height: 13px;
    width: 13px;
  }

  .prior-outer > div {
    font-size: 7px;
    height: 90%;
    width: 90%;
  }

  .datahead > img {
    height: 8px;
  }

  .data.perc-col {
    font-size: 8px;
    /* font-weight: normal; */
  }

}

@media (max-width: 576px) {

}