index.css

html {
  overflow: hidden;
}
body{
  zoom: 1.25;
  margin: 0 0 0 0;
}


@font-face {
  font-family: "Shentox";
  src: url("fonts/shentox/shentox.ttf");
}

@font-face {
  font-family: "Shentox";
  src: url("fonts/shentox/shentox-semibold.ttf");
  font-weight: 600;
}

@font-face {
  font-family: "Shentox";
  src: url("fonts/shentox/shentox-light.ttf");
  font-weight: 300;
}

.champ-select-spectate-component {
  --left-side-color: #a1a1a1;
  --right-side-color: #a1a1a1;
  background: #2c2c2c;	
  color: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
  font-family: "Shentox", sans-serif;
}
/*background: linear-gradient(-55deg, #241a2e 80%, #255a5e 1%, #e0e0e0 80%);
	background-size: 400% 400%;
	animation: gradient 20s ease infinite;
@keyframes gradient {
	0% {
		background-position: 0% 0%;
	}
	10% {
		background-position: 0% 5%;
	}
	30% {
		background-position: 0% 35%;
	}*/


.champ-select-spectate-component .champion-select-header {
  height: 108px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0px;
  background-image: linear-gradient(104deg, #161719 25%, #000 35%);
}

.champ-select-spectate-component .champion-select-header::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 108px;
  width: 50%;
  background-image: linear-gradient(74deg, #000 30%, #161719 50%);
}

.champ-select-spectate-component .champion-select-header .timer-left,
.champ-select-spectate-component .champion-select-header .timer-right {
  width: 148px;
  height: 108px;
  color: #fff;
  position: absolute;
  top: 0;
  padding-top: 33px;
  font-size: 39px;
  font-weight: 600;
  letter-spacing: 0.5px;
  opacity: 0;
}

.champ-select-spectate-component .champion-select-header .timer-left.visible,
.champ-select-spectate-component .champion-select-header .timer-right.visible {
  transition: opacity 0.3s;
  opacity: 1;
}

.champ-select-spectate-component .champion-select-header .timer-left .timer-bg,
.champ-select-spectate-component
  .champion-select-header
  .timer-right
  .timer-bg {
  position: absolute;
  top: 0;
  width: 98px;
  height: 108px;
  transition: opacity 0.3s;
}

.champ-select-spectate-component
  .champion-select-header
  .timer-left
  .timer-inner,
.champ-select-spectate-component
  .champion-select-header
  .timer-right
  .timer-inner {
  position: absolute;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4), -1px 1px 3px rgba(0, 0, 0, 0.4),
    -1px -1px 3px rgba(0, 0, 0, 0.4), 1px -1px 3px rgba(0, 0, 0, 0.4);
}

.champ-select-spectate-component .champion-select-header .timer-left {
  left: 396px;
}

.champ-select-spectate-component .champion-select-header .timer-left .timer-bg {
  transform: skew(14deg);
  background: var(--left-side-color);
  right: 0;
}

.champ-select-spectate-component
  .champion-select-header
  .timer-left
  .timer-inner {
  left: 69px;
}

.champ-select-spectate-component .champion-select-header .timer-right {
  right: 396px;
  text-align: right;
}

.champ-select-spectate-component
  .champion-select-header
  .timer-right
  .timer-bg {
  transform: skew(-14deg);
  background: var(--right-side-color);
  left: 0;
}

.champ-select-spectate-component
  .champion-select-header
  .timer-right
  .timer-inner {
  left: 20px;
}

.champ-select-spectate-component .champion-select-header .header-keystone {
  background: #ebebeb;
  height: 108px;
  position: absolute;
  top: 0;
  left: 561px;
  right: 561px;
}

.champ-select-spectate-component
  .champion-select-header
  .header-keystone
  > .left-bg-section {
  height: 108px;
  width: 50px;
  position: absolute;
  left: -18px;
  background: #ebebeb;
  transform: skew(14deg);
}

.champ-select-spectate-component
  .champion-select-header
  .header-keystone
  > .right-bg-section {
  height: 108px;
  width: 50px;
  position: absolute;
  right: -18px;
  background: #ebebeb;
  transform: skew(-14deg);
}

.champ-select-spectate-component
  .champion-select-header
  .header-keystone
  .header-keystone-inner {
  height: 25px;
  width: calc(100% - 2px);
  position: absolute;
  bottom: 0;
  left: 1px;
  text-align: center;
  background: transparent;
  transition: background 0.3s, opacity .3s;
}

.champ-select-spectate-component
  .champion-select-header
  .header-keystone
  .header-keystone-inner
  > .left-bg-section {
  height: 25px;
  width: 50px;
  position: absolute;
  left: -4px;
  background: transparent;
  transition: background 0.3s;
  transform: skew(14deg);
}

.champ-select-spectate-component
  .champion-select-header
  .header-keystone
  .header-keystone-inner
  > .right-bg-section {
  height: 25px;
  width: 50px;
  position: absolute;
  right: -4px;
  background: transparent;
  transition: background 0.3s;
  transform: skew(-14deg);
}

.champ-select-spectate-component
  .champion-select-header
  .header-keystone
  .header-keystone-inner
  > .phase {
  direction: ltr;
  position: absolute;
  left: 0;
  top: 5px;
  font-size: 17px;
  letter-spacing: 0.15px;
  width: 100%;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5), -1px 1px 3px rgba(0, 0, 0, 0.5),
    -1px -1px 3px rgba(0, 0, 0, 0.5), 1px -1px 3px rgba(0, 0, 0, 0.5);
}

.champ-select-spectate-component.right-side-acting
  .champion-select-header
  .header-keystone-inner {
  background: var(--right-side-color);
}

.champ-select-spectate-component.right-side-acting
  .champion-select-header
  .header-keystone-inner
  .left-bg-section,
.champ-select-spectate-component.right-side-acting
  .champion-select-header
  .header-keystone-inner
  .right-bg-section {
  background: var(--right-side-color);
}

.champ-select-spectate-component.right-side-acting .timer-left .timer-bg {
  opacity: 0;
}

.champ-select-spectate-component.left-side-acting
  .champion-select-header
  .header-keystone-inner {
  background: var(--left-side-color);
}

.champ-select-spectate-component.left-side-acting
  .champion-select-header
  .header-keystone-inner
  .left-bg-section,
.champ-select-spectate-component.left-side-acting
  .champion-select-header
  .header-keystone-inner
  .right-bg-section {
  background: var(--left-side-color);
}

.champ-select-spectate-component.left-side-acting .timer-right .timer-bg {
  opacity: 0;
}

.champ-select-spectate-component.show-both-timers
  .champion-select-header
  .header-keystone-inner {
  opacity: 0;
}

.champ-select-spectate-component.show-both-timers .timer-bg {
  opacity: 0;
}

.champ-select-spectate-component .party {
  position: absolute;
  top: 125px;
  width: 285px;
  height: 480px;
  display: flex;
  flex-direction: column;
}

.champ-select-spectate-component .party .summoner-wrapper {
  width: 90%;
  height: 85px;
  position: relative;
  margin-bottom: 6px;
  margin-left: 13px;

}

.champ-select-spectate-component .party .summoner-wrapper:nth-child(3) {
  margin-bottom: 20px;
}

.champ-select-spectate-component
  .party
  .summoner-wrapper
  .base-color-background {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  -webkit-filter: saturate(4.9);
}

.champ-select-spectate-component
  .party
  .summoner-wrapper
  .gradient-background-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.80) 0%,
    rgba(0, 0, 0, 0.70) 50%,
    rgba(0, 0, 0, 0.80) 100%
  );
}

.champ-select-spectate-component
  .party
  .summoner-wrapper:first-child
  .gradient-background-overlay {
  background-image: radial-gradient(
    ellipse 82% 128% at 50% 90%,
    rgba(0, 0, 0, 0.70) 0%,
    rgba(0, 0, 0, 0.90) 100%
  );
}

.champ-select-spectate-component
  .party
  .summoner-wrapper:last-child
  .gradient-background-overlay {
  background-image: radial-gradient(
    ellipse 82% 128% at 50% 10%,
    rgba(0, 0, 0, 0.70) 0%,
    rgba(0, 0, 0, 0.90) 100%
  );
}

.champ-select-spectate-component
  .your-party
  .summoner-wrapper
  .base-color-background {
  background: var(--left-side-color);
}

.champ-select-spectate-component
  .enemy-party
  .summoner-wrapper
  .base-color-background {
  background: var(--right-side-color);
}

.champ-select-spectate-component .my-bans,
.champ-select-spectate-component .their-bans {
  width: 470px;
  position: absolute;
  height: 105px;
  bottom: 0;
  box-sizing: border-box;
  display: flex;
}

.champ-select-spectate-component .ban-background {
  background: #161719;
  width: 80px;
  height: 88px;  /* menxendo aqui */
  position: relative;
  overflow: hidden;
}

.champ-select-spectate-component .ban-wrapper {
  width: 81px;
  height: 83px;
  position: relative;
}

.champ-select-spectate-component .ban-wrapper .ban-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.champ-select-spectate-component .ban-wrapper .ban-icon {
  content: "";
  width: 28px;
  height: 28px;
  background: url("images/ban-icon.png");
  background-size: 28px;
  background-repeat: no-repeat;
  position: absolute;
  top: 35px;
  -webkit-filter: brightness(0.3) contrast(0.85);
  transition: all 0.1s cubic-bezier(0.29, 0.27, 0.5, 0.95);
}

.champ-select-spectate-component .ban-wrapper.completed {
  animation: champBannedAnimation 1s ease-out forwards;
}

.champ-select-spectate-component .ban-wrapper.completed .ban-icon {
  -webkit-filter: brightness(1);
  top: 70px;
}

.champ-select-spectate-component .ban {
  width: 105px;
  height: 99px;
  background-size: 431px;
  background-position-x: 51%;
  background-position-y: 27%;
  margin-right: 2px;
  position: absolute;
  top: 0;
  left: -13px;
  opacity: 1;
  transition: opacity 0.2s;
}

.champ-select-spectate-component .ban:last-child {
  margin-right: 0;
}

.champ-select-spectate-component .ban.no-champion {
  opacity: 0;
}

.champ-select-spectate-component .my-bans {
  left: 43px;
}

.champ-select-spectate-component .my-bans .ban-wrapper {
  margin-right: 4px;
}

.champ-select-spectate-component .my-bans .ban-wrapper:nth-child(3) {
  margin-right: 34px;
}

.champ-select-spectate-component .my-bans .ban-wrapper .ban-icon {
  right: 26px;
}

.champ-select-spectate-component .my-bans .ban-wrapper.completed .ban-icon {
  right: 19px;
}

.champ-select-spectate-component .my-bans .ban-wrapper.active .ban-background {
  border-right: 5px solid var(--left-side-color);
  width: 77px;
}

.champ-select-spectate-component .my-bans .ban-background {
  transform: skew(14deg);
}

.champ-select-spectate-component .my-bans .ban-container {
  transform: skew(-14deg);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.champ-select-spectate-component .their-bans {
  right: 43px;
  flex-direction: row-reverse;
}

.champ-select-spectate-component .their-bans .ban-wrapper {
  margin-left: 4px;
}

.champ-select-spectate-component .their-bans .ban-wrapper:nth-child(3) {
  margin-left: 34px;
}

.champ-select-spectate-component .their-bans .ban-wrapper .ban-icon {
  left: 31px;
  transform: scaleX(-1);
}

.champ-select-spectate-component .their-bans .ban-wrapper.completed .ban-icon {
  left: 23px;
}

.champ-select-spectate-component
  .their-bans
  .ban-wrapper.active
  .ban-background {
  border-left: 5px solid var(--right-side-color);
  width: 77px;
}

.champ-select-spectate-component .their-bans .ban-background {
  transform: skew(-14deg);
  margin-left: 4px;
}

.champ-select-spectate-component .their-bans .ban-container {
  transform: scaleX(-1) skew(-14deg);
  background-position-x: 49%;
}

.champ-select-spectate-component .your-party .party {
  left: 0;
}

.champ-select-spectate-component .enemy-party .party {
  right: 0;
}

.champion-select-color-switcher {
  position: absolute;
  top: 200px;
  left: 333px;
}

@-moz-keyframes champBannedAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: grayscale(0.7) brightness(1.8);
  }
  100% {
    -webkit-filter: grayscale(0.7) brightness(0.9);
  }
}

@-webkit-keyframes champBannedAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: grayscale(0.7) brightness(1.8);
  }
  100% {
    -webkit-filter: grayscale(0.7) brightness(0.9);
  }
}

@-o-keyframes champBannedAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: grayscale(0.7) brightness(1.8);
  }
  100% {
    -webkit-filter: grayscale(0.7) brightness(0.9);
  }
}

@keyframes champBannedAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: grayscale(0.7) brightness(1.8);
  }
  100% {
    -webkit-filter: grayscale(0.7) brightness(0.9);
  }
}

.champ-select-spectate-component .my-bans .ban[data-id="115"],
.champ-select-spectate-component .their-bans .ban[data-id="115"] {
  background-position-x: 46%;
  background-position-y: 33%;
}

.champ-select-spectate-component .my-bans .ban[data-id="19"],
.champ-select-spectate-component .their-bans .ban[data-id="19"] {
  background-size: 281px;
  background-position-y: 50%;
}

.champ-select-spectate-component .my-bans .ban[data-id="106"],
.champ-select-spectate-component .their-bans .ban[data-id="106"] {
  background-position-y: 20%;
}

.champ-select-spectate-component .my-bans .ban[data-id="161"],
.champ-select-spectate-component .their-bans .ban[data-id="161"] {
  background-position-x: 47%;
  background-size: 295px;
}

.champ-select-spectate-component .my-bans .ban[data-id="44"],
.champ-select-spectate-component .their-bans .ban[data-id="44"] {
  background-position-x: 60%;
}

.champ-select-spectate-component .my-bans .ban[data-id="223"],
.champ-select-spectate-component .their-bans .ban[data-id="223"] {
  background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id="13"],
.champ-select-spectate-component .their-bans .ban[data-id="13"] {
  background-position-x: 63%;
  background-position-y: 38%;
}

.champ-select-spectate-component .my-bans .ban[data-id="33"],
.champ-select-spectate-component .their-bans .ban[data-id="33"] {
  background-size: 373px;
  background-position-x: 55%;
  background-position-y: 35%;
}

.champ-select-spectate-component .my-bans .ban[data-id="75"],
.champ-select-spectate-component .their-bans .ban[data-id="75"] {
  background-size: 597px;
}

.champ-select-spectate-component .my-bans .ban[data-id="96"],
.champ-select-spectate-component .their-bans .ban[data-id="96"] {
  background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id="240"],
.champ-select-spectate-component .their-bans .ban[data-id="240"] {
  background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id="85"],
.champ-select-spectate-component .their-bans .ban[data-id="85"] {
  background-size: 321px;
}

.champ-select-spectate-component .my-bans .ban[data-id="74"],
.champ-select-spectate-component .their-bans .ban[data-id="74"] {
  background-size: 350px;
}

.champ-select-spectate-component .my-bans .ban[data-id="9"],
.champ-select-spectate-component .their-bans .ban[data-id="9"] {
  background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id="28"],
.champ-select-spectate-component .their-bans .ban[data-id="28"] {
  background-position-y: 22%;
}

.champ-select-spectate-component .my-bans .ban[data-id="122"],
.champ-select-spectate-component .their-bans .ban[data-id="122"] {
  background-position-y: 19%;
}

.champ-select-spectate-component .my-bans .ban[data-id="136"],
.champ-select-spectate-component .their-bans .ban[data-id="136"] {
  background-position-x: 57%;
  background-size: 360px;
  background-position-y: 40%;
}

.champ-select-spectate-component .my-bans .ban[data-id="34"],
.champ-select-spectate-component .their-bans .ban[data-id="34"] {
  background-position-y: 36%;
}

.champ-select-spectate-component .my-bans .ban[data-id="142"],
.champ-select-spectate-component .their-bans .ban[data-id="142"] {
  background-size: 300px;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="268"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="268"] {
  background-position-y: 24%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="122"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="122"] {
  background-position-y: 18%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="28"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="28"] {
  background-position-y: 29%;
  background-size: 165%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="50"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="50"] {
  background-position-y: 22%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="9"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="9"] {
  background-size: 165%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="114"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="114"] {
  background-position-y: 18%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="105"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="105"] {
  background-position-y: 21%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="74"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="74"] {
  background-size: 200%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="420"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="420"] {
  background-position-y: 18%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="39"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="39"] {
  background-size: 320%;
  background-position-y: 26%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="222"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="222"] {
  background-position-y: 24%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="10"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="10"] {
  background-position-y: 18%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="240"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="240"] {
  background-size: 180%;
  background-position-y: 26%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="96"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="96"] {
  background-size: 180%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="7"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="7"] {
  background-position-y: 22%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="64"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="64"] {
  background-position-y: 26%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="236"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="236"] {
  background-position-y: 23%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="267"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="267"] {
  background-position-y: 23%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="20"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="20"] {
  background-position-y: 18%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="33"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="33"] {
  background-size: 180%;
  background-position-x: 67%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="13"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="13"] {
  background-size: 205%;
  background-position-x: 61%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="223"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="223"] {
  background-size: 180%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="112"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="112"] {
  background-position-y: 23%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="8"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="8"] {
  background-position-y: 23%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="201"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="201"] {
  background-position-y: 20%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="106"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="106"] {
  background-size: 220%;
  background-position-y: 17%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="19"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="19"] {
  background-size: 170%;
  background-position-y: 41%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="101"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="101"] {
  background-position-y: 22%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="115"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="115"] {
  background-size: 200%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="83"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="83"] {
  background-position-y: 19%;
  background-size: 170%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="85"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="85"] {
  background-size: 170%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="202"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="202"] {
  background-position-y: 25%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="110"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="110"] {
  background-position-x: 46%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="161"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="161"] {
  background-size: 166%;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background[data-id="142"],
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background[data-id="142"] {
  background-size: 166%;
}

.champ-select-spectate-component [data-id="136"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="432"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="53"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="63"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="42"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="36"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="28"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="86"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="420"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="427"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="24"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="45"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="29"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="27"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="102"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="113"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="13"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="78"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="80"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="76"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="25"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="90"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="236"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="7"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="240"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="266"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="203"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="121"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="85"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="82"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="164"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="3"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="497"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="498"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="163"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="110"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="517"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="100"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="250"] {
  transform: scaleX(-1);
}

.champ-select-spectate-component [data-id="523"] {
  transform: scaleX(-1);
}

@font-face {
  font-family: "Shentox";
  src: url("fonts/shentox/shentox.ttf");
}

@font-face {
  font-family: "Shentox";
  src: url("fonts/shentox/shentox-semibold.ttf");
  font-weight: 600;
}

@font-face {
  font-family: "Shentox";
  src: url("fonts/shentox/shentox-light.ttf");
  font-weight: 300;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  letter-spacing: 0.8px;
  font-size: 15px;
  font-weight: 300;
  text-shadow: 1px 1px 2px #000, 0px 1px 2px #000, 0px 0px 3px #000,
    0px 0px 3px #000, 1px 1px 4px #000;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background,
.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .old-background {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-size: 241%;
  background-position: 52% 28%;
  opacity: 1;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .background-wrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .action-text {
  direction: ltr;
  opacity: 0;
  position: absolute;
  bottom: 20px;
  transition: opacity 0.2s;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .edge-border {
  opacity: 0;
  position: absolute;
  top: 0;
  width: 0;
  height: 100%;
  border-left: 0px solid #000;
  border-right: 0px solid #000;
  transition: width 0.15s;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .spells {
  opacity: 1;
  transition: opacity 0.3s;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .spell {
  width: 30px;
  border: 2px solid #000;
  position: absolute;
  box-shadow: 0 0 1px #000;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .spell:first-child {
  top: 7px;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .spell:nth-child(2) {
  top: 39px;
}

.champ-select-spectate-component
  .summoner-object-component
  .summoner-object-wrapper
  .summoner-name {
  position: absolute;
  bottom: 2px;
  transition: left 0.2s, right 0.2s;
}

.champ-select-spectate-component
  .summoner-object-component.no-champion
  .spells {
  opacity: 0;
}

.champ-select-spectate-component
  .summoner-object-component.is-picking-now
  .action-text {
  opacity: 1;
}

.champ-select-spectate-component
  .summoner-object-component.champion-not-locked
  .background,
.champ-select-spectate-component
  .summoner-object-component.champion-not-locked
  .old-background {
  -webkit-filter: brightness(0.8);
}

.champ-select-spectate-component
  .summoner-object-component.champion-locked
  .background {
  animation: champLockedInAnimation 1.5s ease-out;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component
  .summoner-object-wrapper
  .spell {
  left: 11px;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component
  .summoner-object-wrapper
  .summoner-name {
  right: 9px;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component
  .summoner-object-wrapper
  .edge-border {
  right: 0px;
  background: var(--left-side-color);
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component
  .summoner-object-wrapper
  .action-text {
  right: 15px;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component.is-picking-now
  .edge-border {
  width: 4px;
  border-left: 3px solid #000;
  opacity: 1;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component.is-picking-now
  .summoner-name {
  right: 15px;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component.is-picking-now
  .action-text {
  animation: fadeInRightAnimation 0.2s,
    flickerAnimation 3s 0.2s cubic-bezier(0.21, 0.89, 0.2, 0.88) infinite;
}

.champ-select-spectate-component
  .your-party
  .summoner-object-component
  .background-wrapper {
  transform: scaleX(-1);
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component
  .summoner-object-wrapper
  .spell {
  right: 15px;
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component
  .summoner-object-wrapper
  .summoner-name {
  left: 10px;
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component
  .summoner-object-wrapper
  .edge-border {
  left: 0px;
  background: var(--right-side-color);
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component
  .summoner-object-wrapper
  .action-text {
  left: 5px;
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component.is-picking-now
  .edge-border {
  width: 4px;
  border-right: 3px solid #000;
  opacity: 1;
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component.is-picking-now
  .summoner-name {
  left: 15px;
}

.champ-select-spectate-component
  .enemy-party
  .summoner-object-component.is-picking-now
  .action-text {
  animation: fadeInLeftAnimation 0.2s,
    flickerAnimation 3s 0.2s cubic-bezier(0.21, 0.89, 0.2, 0.88) infinite;
}

@-moz-keyframes flickerAnimation {
  20% {
    opacity: 1;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes flickerAnimation {
  20% {
    opacity: 1;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes flickerAnimation {
  20% {
    opacity: 1;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes flickerAnimation {
  20% {
    opacity: 1;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes fadeInRightAnimation {
  0% {
    opacity: 0;
    right: 23px;
  }
  100% {
    opacity: 1;
    right: 15px;
  }
}

@-webkit-keyframes fadeInRightAnimation {
  0% {
    opacity: 0;
    right: 23px;
  }
  100% {
    opacity: 1;
    right: 15px;
  }
}

@-o-keyframes fadeInRightAnimation {
  0% {
    opacity: 0;
    right: 23px;
  }
  100% {
    opacity: 1;
    right: 15px;
  }
}

@keyframes fadeInRightAnimation {
  0% {
    opacity: 0;
    right: 23px;
  }
  100% {
    opacity: 1;
    right: 15px;
  }
}

@-moz-keyframes fadeInLeftAnimation {
  0% {
    opacity: 0;
    left: 23px;
  }
  100% {
    opacity: 1;
    left: 15px;
  }
}

@-webkit-keyframes fadeInLeftAnimation {
  0% {
    opacity: 0;
    left: 23px;
  }
  100% {
    opacity: 1;
    left: 15px;
  }
}

@-o-keyframes fadeInLeftAnimation {
  0% {
    opacity: 0;
    left: 23px;
  }
  100% {
    opacity: 1;
    left: 15px;
  }
}

@keyframes fadeInLeftAnimation {
  0% {
    opacity: 0;
    left: 23px;
  }
  100% {
    opacity: 1;
    left: 15px;
  }
}

@-moz-keyframes champLockedInAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: brightness(1.8);
  }
  100% {
    -webkit-filter: brightness(1);
  }
}

@-webkit-keyframes champLockedInAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: brightness(1.8);
  }
  100% {
    -webkit-filter: brightness(1);
  }
}

@-o-keyframes champLockedInAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: brightness(1.8);
  }
  100% {
    -webkit-filter: brightness(1);
  }
}

@keyframes champLockedInAnimation {
  0% {
    -webkit-filter: brightness(1);
  }
  4% {
    -webkit-filter: brightness(1.8);
  }
  100% {
    -webkit-filter: brightness(1);
  }
}


.champ-select-spectate-component .my-bans .ban[data-id='115'],
.champ-select-spectate-component .their-bans .ban[data-id='115'] {
    background-position-x: 46%;
    background-position-y: 33%;
}

.champ-select-spectate-component .my-bans .ban[data-id='19'],
.champ-select-spectate-component .their-bans .ban[data-id='19'] {
    background-size: 281px;
    background-position-y: 50%;
}

.champ-select-spectate-component .my-bans .ban[data-id='106'],
.champ-select-spectate-component .their-bans .ban[data-id='106'] {
    background-position-y: 20%;
}

.champ-select-spectate-component .my-bans .ban[data-id='161'],
.champ-select-spectate-component .their-bans .ban[data-id='161'] {
    background-position-x: 47%;
    background-size: 295px;
}

.champ-select-spectate-component .my-bans .ban[data-id='44'],
.champ-select-spectate-component .their-bans .ban[data-id='44'] {
    background-position-x: 60%;
}

.champ-select-spectate-component .my-bans .ban[data-id='223'],
.champ-select-spectate-component .their-bans .ban[data-id='223'] {
    background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id='13'],
.champ-select-spectate-component .their-bans .ban[data-id='13'] {
    background-position-x: 63%;
    background-position-y: 38%;
}

.champ-select-spectate-component .my-bans .ban[data-id='33'],
.champ-select-spectate-component .their-bans .ban[data-id='33'] {
    background-size: 373px;
    background-position-x: 55%;
    background-position-y: 35%;
}

.champ-select-spectate-component .my-bans .ban[data-id='75'],
.champ-select-spectate-component .their-bans .ban[data-id='75'] {
    background-size: 597px;
}

.champ-select-spectate-component .my-bans .ban[data-id='96'],
.champ-select-spectate-component .their-bans .ban[data-id='96'] {
    background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id='240'],
.champ-select-spectate-component .their-bans .ban[data-id='240'] {
    background-size: 300px;
}

.champ-select-spectate-component .my-bans .ban[data-id='85'],
.champ-select-spectate-component .their-bans .ban[data-id='85'] {
    background-size: 321px;
}

.champ-select-spectate-component .my-bans .ban[data-id='74'],
.champ-select-spectate-component .their-bans .ban[data-id='74'] {
    background-size: 350px;
}

.champ-select-spectate-component .my-bans .ban[data-id='28'],
.champ-select-spectate-component .their-bans .ban[data-id='28'] {
    background-position-y: 22%;
}

.champ-select-spectate-component .my-bans .ban[data-id='122'],
.champ-select-spectate-component .their-bans .ban[data-id='122'] {
    background-position-y: 19%;
}

.champ-select-spectate-component .my-bans .ban[data-id='136'],
.champ-select-spectate-component .their-bans .ban[data-id='136'] {
    background-position-x: 57%;
    background-size: 360px;
    background-position-y: 40%;
}

.champ-select-spectate-component .my-bans .ban[data-id='34'],
.champ-select-spectate-component .their-bans .ban[data-id='34'] {
    background-position-y: 36%;
}

.champ-select-spectate-component .my-bans .ban[data-id='142'],
.champ-select-spectate-component .their-bans .ban[data-id='142'] {
    background-size: 300px;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='268'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='268'] {
    background-position-y: 24%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='122'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='122'] {
    background-position-y: 18%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='28'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='28'] {
    background-position-y: 29%;
    background-size: 165%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='50'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='50'] {
    background-position-y: 22%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='9'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='9'] {
    background-size: 165%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='114'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='114'] {
    background-position-y: 18%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='105'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='105'] {
    background-position-y: 21%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='74'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='74'] {
    background-size: 200%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='420'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='420'] {
    background-position-y: 18%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='39'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='39'] {
    background-size: 320%;
    background-position-y: 26%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='222'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='222'] {
    background-position-y: 24%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='10'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='10'] {
    background-position-y: 18%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='240'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='240'] {
    background-size: 180%;
    background-position-y: 26%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='96'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='96'] {
    background-size: 180%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='7'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='7'] {
    background-position-y: 22%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='64'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='64'] {
    background-position-y: 26%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='236'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='236'] {
    background-position-y: 23%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='267'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='267'] {
    background-position-y: 23%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='20'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='20'] {
    background-position-y: 18%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='33'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='33'] {
    background-size: 180%;
    background-position-x: 67%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='13'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='13'] {
    background-size: 205%;
    background-position-x: 61%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='223'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='223'] {
    background-size: 180%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='112'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='112'] {
    background-position-y: 23%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='8'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='8'] {
    background-position-y: 23%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='201'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='201'] {
    background-position-y: 20%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='106'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='106'] {
    background-size: 220%;
    background-position-y: 17%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='19'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='19'] {
    background-size: 170%;
    background-position-y: 41%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='101'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='101'] {
    background-position-y: 22%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='115'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='115'] {
    background-size: 200%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='83'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='83'] {
    background-position-y: 19%;
    background-size: 170%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='85'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='85'] {
    background-size: 170%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='202'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='202'] {
    background-position-y: 25%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='110'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='110'] {
    background-position-x: 46%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='161'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='161'] {
    background-size: 166%;
}

.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .background[data-id='142'],
.champ-select-spectate-component .summoner-object-component .summoner-object-wrapper .old-background[data-id='142'] {
    background-size: 166%;
}

.champ-select-spectate-component [data-id='136'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='432'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='53'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='63'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='42'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='36'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='28'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='86'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='420'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='427'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='24'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='45'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='29'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='27'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='102'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='113'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='13'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='78'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='80'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='76'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='25'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='90'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='236'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='7'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='240'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='266'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='203'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='121'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='85'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='82'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='164'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='3'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='497'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='498'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='163'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='110'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='517'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='100'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='250'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='523'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='9'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='876'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='147'] {
    transform: scaleX(-1);
}

.champ-select-spectate-component [data-id='526'] {
    transform: scaleX(-1);
}