/* screen - left */

.left {
  background-color: #00000040;
  height: 857px;
  overflow-x: hidden;
  position: relative;
  width: 210px;
}

#overlay-left {
  align-items: start;
  background-color: #00000040;
  justify-content: flex-start;
}

.left .left-sjwFMh {
  background-color: var(--bg);
  height: 857px;
  left: 0px;
  position: relative;
  top: 0px;
  width: 210px;
}

.left .searcher-2AWpWu {
  background-color: transparent;
  height: 24px;
  left: 4.74%;
  position: absolute;
  top: 61px;
  width: 91.47%;
}

.left .group-16-OuNp0x {
  background-color: transparent;
  height: 24px;
  left: 0px;
  position: relative;
  top: 0px;
  width: 101.04%;
}

.left .rectangle-35-w5grIQ {
  background-color: #f5f5f5;
  border-radius: 5px;
  height: 24px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 98.97%;
}

.left .x1-w5grIQ {
  background-color: transparent;
  height: 18px;
  left: 9px;
  position: absolute;
  top: 3px;
  width: 15px;
}

.left .search-w5grIQ {
  background-color: transparent;
  border: 0;
  color: #afafaf;
  font-style: normal;
  font-weight: 400;
  height: 14px;
  left: 32px;
  line-height: normal;
  padding: 0;
  position: absolute;
  resize: none;
  text-align: left;
  top: 5px;
  white-space: nowrap;
  width: 151px;
}

.left .search-w5grIQ::placeholder {
  color: #afafaf99;
}

.left .btn_-log-in-2AWpWu {
  background-color: transparent;
  border-radius: 6px;
  cursor: pointer;
  height: 2.57%;
  left: 51.43%;
  position: absolute;
  top: 3.03%;
  width: 44.76%;
}

.left .group-32-1jS6aQ {
  background-color: transparent;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 102.13%;
}

.left .rectangle-13-PmwrQq {
  background-color: var(--btblue);
  border: 1px solid;
  border-color: var(--wt);
  border-radius: 6px;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 97.92%;
}

.left .group-33-1jS6aQ {
  background-color: transparent;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: absolute;
  top: 0px;
  transition: all 0.2s ease;
  width: 102.13%;
}

.left .group-33-1jS6aQ:hover {
  opacity: 0;
}

.left .rectangle-13-C1PDew {
  background-color: var(--bg);
  border: 1px solid;
  border-color: var(--ptyellow);
  border-radius: 6px;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 97.92%;
}

.left .btn_-join-2AWpWu {
  background-color: transparent;
  border-radius: 6px;
  cursor: pointer;
  height: 22px;
  position: absolute;
  right: 107px;
  top: 26px;
  width: 94px;
}

.left .group-30-Ktd1hs {
  background-color: transparent;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 102.13%;
}

.left .rectangle-13-xrvEYA {
  background-color: var(--bg);
  border: 1px solid;
  border-color: var(--ptyellow);
  border-radius: 6px;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 97.92%;
}

.left .group-31-Ktd1hs {
  background-color: transparent;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: absolute;
  top: 0px;
  transition: all 0.2s ease;
  width: 102.13%;
}

.left .group-31-Ktd1hs:hover {
  opacity: 0;
}

.left .rectangle-13-r7bZUz {
  background-color: var(--btblue);
  border: 1px solid;
  border-color: var(--wt);
  border-radius: 6px;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 97.92%;
}

.left .frame-302-2AWpWu {
  background-color: var(--frblue);
  border-radius: 5px;
  height: 668px;
  left: 3.81%;
  position: absolute;
  top: 94px;
  width: 92.38%;
}

.left .popular-leagues-RD63qm {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 600;
  height: auto;
  left: 19px;
  line-height: normal;
  position: absolute;
  text-align: left;
  top: 5px;
  white-space: nowrap;
  width: 148px;
}

.left .football-RD63qm {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 600;
  height: auto;
  left: 19px;
  line-height: normal;
  position: absolute;
  text-align: left;
  top: 41px;
  width: 81px;
}

.left .tennis-RD63qm {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 600;
  height: auto;
  left: 19px;
  line-height: normal;
  position: absolute;
  text-align: left;
  top: 412px;
  width: 47px;
}

.left .basketball-RD63qm {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 600;
  height: auto;
  left: 24px;
  line-height: normal;
  position: absolute;
  text-align: left;
  top: 483px;
  width: 82px;
}

.left .ice-hockey-RD63qm {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 600;
  height: auto;
  left: 19px;
  line-height: normal;
  position: absolute;
  text-align: left;
  top: 610px;
  width: 78px;
}

.left .line-10-RD63qm {
  background-color: transparent;
  height: 1px;
  left: 0px;
  object-fit: cover;
  position: absolute;
  top: 29px;
  width: 100%;
}

.left .btn_-round-square3-RD63qm {
  top: 65px;
}

.left .rectangle-13-yB3zsm {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-9oVGrH {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-9oVGrH:hover {
  background-color: #315B99
}

.left .btn_-round-square3-vFJtBz {
  top: 95px;
}

.left .rectangle-13-pk3F1I {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-Tx1ExH {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-Tx1ExH:hover {
  background-color: #315B99
}

.left .btn_-round-square3-BPOkBB {
  top: 125px;
}

.left .rectangle-13-XyxAFA {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-7JJx41 {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-7JJx41:hover {
  background-color: #315B99
}

.left .btn_-round-square3-XhtUeJ {
  top: 155px;
}

.left .rectangle-13-qk2tv3 {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-xXnr7f {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-xXnr7f:hover {
  background-color: #315B99
}

.left .btn_-round-square3-KcIRZZ {
  top: 185px;
}

.left .rectangle-13-5NmeeS {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-8Yso7y {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-8Yso7y:hover {
  background-color: #315B99
}

.left .btn_-round-square3-VbznK8 {
  top: 215px;
}

.left .rectangle-13-m0mA2X {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-jnsTkR {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-jnsTkR:hover {
  background-color: #315B99
}

.left .btn_-round-square3-4vSxSo {
  top: 245px;
}

.left .rectangle-13-vONOn3 {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-xfjbgc {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-xfjbgc:hover {
  background-color: #315B99
}

.left .btn_-round-square3-sYKcvK {
  top: 275px;
}

.left .rectangle-13-7W9sCI {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-6zPwYE {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-6zPwYE:hover {
  background-color: #315B99
}

.left .btn_-round-square3-oJPv0t {
  top: 305px;
}

.left .rectangle-13-QTIbSi {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-DbD6D5 {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-DbD6D5:hover {
  background-color: #315B99
}

.left .btn_-round-square3-w4kK7O {
  top: 335px;
}

.left .rectangle-13-QywRxO {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-OucCWU {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-OucCWU:hover {
  background-color: #315B99
}

.left .btn_-round-square3-515wxC {
  top: 365px;
}

.left .rectangle-13-Gz3xTV {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-MJaVUS {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-MJaVUS:hover {
  background-color: #315B99
}

.left .btn_-round-square3-In9ZsR {
  top: 436px;
}

.left .rectangle-13-IXUmVg {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-WS1umS {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-WS1umS:hover {
  background-color: #315B99
}

.left .btn_-round-square3-Tj32rS {
  top: 506px;
}

.left .rectangle-13-mMQi5a {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-t4ll5G {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-t4ll5G:hover {
  background-color: #315B99
}

.left .btn_-round-square3-Si4fAY {
  top: 533px;
}

.left .rectangle-13-J2Z1rT {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-8GKZxY {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-8GKZxY:hover {
  background-color: #315B99
}

.left .btn_-round-square3-hHuZBh {
  top: 563px;
}

.left .rectangle-13-ElvWWl {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-sivbsO {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-sivbsO:hover {
  background-color: #315B99
}

.left .btn_-round-square3-KcFusU {
  top: 633px;
}

.left .rectangle-13-cFltJC {
  background-color: transparent;
  height: 26px;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100.00%;
}

.left .rectangle-13-vtWQ8l {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 100%;
  left: 0px;
  pointer-events: auto;
  position: relative;
  top: 0px;
  transition: all 0.2s ease;
  width: 100%;
}

.left .rectangle-13-vtWQ8l:hover {
  background-color: #315B99
}

.left .btn_-round-square3 {
  background-color: transparent;
  border-radius: 5px;
  cursor: pointer;
  height: 26px;
  left: 3.61%;
  position: absolute;
  width: 93.20%;
}

.left .btn_-sports-icon_-hover {
  background-color: transparent;
  height: 26px;
  left: 0px;
  mix-blend-mode: lighten;
  position: absolute;
  top: 0px;
  width: 100%;
}

.left .champions-league {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 400;
  height: auto;
  left: 15px;
  line-height: normal;
  position: absolute;
  text-align: left;
  top: 5px;
  width: auto;
}

.left .join {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 400;
  height: 16px;
  left: calc(50.00% - 16px);
  line-height: normal;
  position: absolute;
  text-align: center;
  top: calc(50.00% - 8px);
  width: auto;
}

.left .login {
  background-color: transparent;
  color: var(--wt);
  font-style: normal;
  font-weight: 400;
  height: 16px;
  left: calc(50.00% - 20px);
  line-height: normal;
  position: absolute;
  text-align: center;
  top: calc(50.00% - 8px);
  width: auto;
}