@charset "utf-8";

@font-face {
  font-family: PBCasino;
  src: url(/css/fonts/PFHandbookPro-Black.ttf) format("truetype");
}

@font-face {
  font-family: PBCasino-bold;
  src: url(/css/fonts/PFHandbookPro-Bold.ttf) format("truetype");
}

/* >> new font start */
@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-BlackItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "PBCasino";
  src: url("/css/fonts/Casino/PBCasino-RegularItalic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
}

/* << new font end */

:root {
  --carousel-gap: 39px;
  --carousel-child-width: 80px;
}

html {
  scroll-behavior: smooth;
}

body.desktop {
  min-width: 100%;
}

body[page="arena"] .grid-item:hover {
  z-index: 2;
  transform: translate3d(0, -10%, 0) scale(1.1);
  border: 1px solid #cba03f;
}

.non_scrollbar::-webkit-scrollbar {
  display: none !important;
}

.non_touch_action {
  -ms-touch-action: none;
  touch-action: none;
}

.side.center.desktop {
  width: 100% !important;
  min-width: auto;
}

.artboard2 .left_wrapper,
.label-right .right_wrapper {
  display: grid;
  place-items: center;
  margin-bottom: 35px;
  gap: 8px;
}

div[data-provider="7777GAMING"] .lns {
  display: block;
}

.artboard2 .left_wrapper > span,
.label-right .right_wrapper > span,
.ringring .GameLeaderboard .right_wrapper > span {
  font: normal normal bold 20px/24px PBCasino;
  letter-spacing: 0.16px;
  color: #e6f1ff;
}

#btnTop {
  display: none !important;
}

.centerdiv {
  font-family: PBCasino, sans-serif;
  text-align: center;
}

section.pageContent .side.center.desktop {
  display: block;
  margin: 0 auto;
}

.modal_open {
  height: 100vh;
  overflow-y: hidden;
  position: fixed;
}

.calendar {
  order: 4;
}

body.casino section.pageContent .side.center.desktop {
  min-height: 100%;
  height: 100%;
}

body.desktop > main > section:first-of-type {
  background-image: url(/images/buy-bonus-assets/background_desktop.png?v=2024041516);
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  min-height: auto;
  height: calc(100vh - 70px);
}

::-webkit-scrollbar {
  width: 2px;
}

::-webkit-scrollbar-track {
  background: #00efe533;
}

::-webkit-scrollbar-thumb {
  background: #00efe580;
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: #00efe580;
}

.btn-hidde2 {
  text-align: center;
  padding-top: 8px;
  cursor: pointer;
}

body.mobile > main > section:first-of-type {
  padding-bottom: 0;
  min-height: 100%;
  height: 100%;
}

body.desktop::-webkit-scrollbar-thumb {
  background: #969696;
  border: 3px solid #252525;
  border-radius: 6px;
}

body.desktop::-webkit-scrollbar {
  padding: 3px;
  width: 14px;
  height: 4px;
  margin: 3px;
}

::-webkit-scrollbar-track {
  background: #152d66;
}

html {
  scrollbar-arrow-color: #252604;
  scrollbar-highlight-color: #bfc097;
  scrollbar-shadow-color: #fff;
  scrollbar-base-color: #000;
  scrollbar-track-color: #e2e1d4;
  scrollbar-face-color: #bfc097;
  scrollbar-3dlight-color: #efeeee;
  scrollbar-darkshadow-color: #999;
}

.navAndTerms {
  position: absolute;
  padding: 11px;
  width: 100%;
  max-width: none;
  top: 0;
  z-index: 2;
}

.back2Promos {
  position: relative;
  vertical-align: top;
  display: inline-block;
}

.back2Promos > p {
  color: #fff;
  font-weight: 600;
  padding-left: 25px;
  vertical-align: top;
  margin: 0;
  font-size: 0;
}

.pageContent a {
  font-size: 14px;
}

.bonusRules {
  position: relative;
  float: right;
  vertical-align: top;
  color: #000;
  margin-top: 5px;
  padding: 4px 12px;
}

.tableclas {
  max-width: 360px;
  margin: 0 auto;
}

.controlcenter h2 {
  font-size: 40px;
  margin: 0;
}

.controlcenter h2 span {
  color: #00efe5;
}

.datetime {
  font-weight: 500;
  font-size: 26px;
  line-height: 1px;
  display: flex;
  margin: 0;
}

.iamgestime {
  width: 33%;
  opacity: 0.5;
  padding: 14px;
  max-width: 180px;
  display: block;
  margin: 0 auto;
}

.mecktothegame:before {
  content: "";
  padding: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-54%, -50%);
  background: url(/images/arrow-2.png);
  background-repeat: no-repeat;
  background-position: center;
}

.mecktothegame {
  padding: 0 0 0 25px;
  margin: 0;
  font-size: 0;
  line-height: 12px;
  vertical-align: top;
  text-align: left;
  background-color: hsl(214deg 100% 95% / 17%);
  width: 27px;
  height: 27px;
  position: relative;
  border-radius: 50%;
}

.desktop .mecktothegame {
  background-color: transparent;
}

.activete {
  background: rgb(152 164 179 / 16%) !important;
  color: #e6f1ff !important;
}

.TourImg {
  width: 100%;
  display: block;
  margin: 0 auto;
  border-radius: 20px;
}

.tournametlocker img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 10px;
}

.microdiv.mytryif {
  max-width: 130px;
}

.GameMegaconteiner {
  width: 100%;
  position: relative;
  height: 100%;
}

img.MainBb {
  width: 100%;
  height: auto;
}

.gamelabel {
  width: 33%;
}

.GamesCOntr {
  cursor: pointer;
  width: 14.1%;
  min-height: 100px;
  text-align: center;
}

.Gametournametconteiner {
  width: 50%;
  display: flex;
  margin: 120px 342px;
  position: absolute;
  padding: 12px;
}

.GamesCOntrmini {
  border-bottom: 6px solid #000000c4;
  font-size: 15px;
  padding: 4px;
  font-weight: 600;
  color: #ffffffeb;
}

.GamesCOntr .activez {
  border-bottom: 6px solid #00eaff;
}

.imgClassz {
  width: 100%;
}

.imgClassz2 {
  width: 170%;
  margin: 0 20px;
}

.GameSecondconteiner {
  width: 30%;
}

.close_btn,
.full_screen_btn {
  display: block;
  width: 24px;
  height: auto;
}

.Gameround {
  font-size: 14px;
  text-align: center;
  border-radius: 6px;
  min-height: 50px;
  width: 80px;
  display: inline-block;
  position: relative;
  border: 1px solid;
  margin: 2px;
  cursor: pointer;
}

.Gameround span {
  display: block;
  font-weight: 600;
  font-size: 23px;
}

.GameSliderround {
  height: 80px;
  position: relative;
  width: 100%;
  z-index: 2;
  overflow: hidden;
  overflow-x: scroll;
}

.GameFirstconteiner2 .place {
  display: flex;
  justify-content: space-between;
  border-radius: 10px;
  background-color: #273f97;
  align-items: center;
  padding: 0 20px 0 15px;
  margin-bottom: 4px;
  height: 46px;
  opacity: 0.8;
}

.GameFirstconteiner2 .thirds {
  background-color: #30499c;
}

.GameFirstconteiner2 .seconds {
  background-color: #445ba7;
}

.GameFirstconteiner2 .firsts {
  background-color: #596fb2;
}

.GameFirstconteiner2 .first.place {
  background-color: #e3ac16;
  color: #000;
}

.GameFirstconteiner2 .second.place {
  background-color: #98bfde;
  color: #000;
}

.GameFirstconteiner2 .third.place {
  background-color: #b97a15;
  color: #000;
}

.GameFirstconteiner2 .other.place h3 {
  font-size: 16px;
}

.GameFirstconteiner2 .place p {
  display: flex;
  font-size: 12px;
  border-radius: 12px;
  height: 24px;
  justify-content: center;
  align-items: center;
  box-shadow: 0 3px 6px #00000029;
  padding: 2px 7px;
  font-weight: 700;
  font-style: italic;
  color: #e6f1ff;
}

section.pageContent .side.center.mobile {
  position: static;
  min-height: 100%;
}

#prize,
div#leader {
  width: 100%;
  height: calc(var(--app-height) - 50px);
  overflow: auto;
  position: fixed;
  top: 51px;
  left: 0;
  z-index: 8;

  -webkit-transition: -webkit-transform 1s ease-out;
  transition: -webkit-transform 1s ease-out;
  -o-transition: transform 1s ease-out;
  transition: transform 1s ease-out;
  transition: transform 1s ease-out, -webkit-transform 1s ease-out;
}

div#leader .right .right_wrapper,
div#prize .left .left_wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

div#prize .left .left_wrapper > img {
  max-width: 100px;
}

div#leader .right .right_wrapper > img {
  max-width: 100px;
}

div#leader .right span,
div#prize .left span.prize {
  font: normal normal 700 20px/24px Roboto;
  letter-spacing: 0.2px;
  color: #e6f1ff;
  position: relative;
  display: block;
  text-wrap: nowrap;
}

.left p.prize {
  color: #e6f1ff;
  font-family: "PBCasino";
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.2px;
  display: flex;
  white-space: nowrap;
  padding: 0;
}

.current-date {
  color: var(--secondary-text);
  text-align: center;
  font-family: "PBCasino";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.2px;
}

.close_right,
img.close_left {
  display: block;
  margin: 0 auto;
  background: transparent radial-gradient(closest-side at 50% 50%, #001126 0, #00112600 100%) 0 0 no-repeat padding-box;
  padding: 86px 86px 20px 86px;
}

.btn_close {
  display: grid;
  place-items: end;
  width: 100%;
  height: 176px;
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -o-sticky;
  position: -ms-sticky;
  position: sticky;
  bottom: 0;
  background: transparent linear-gradient(180deg, #00112600 0, #001126 100%) 0 0 no-repeat padding-box;
}

.bottom_menu {
  display: flex;
  justify-content: space-between;
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -o-sticky;
  position: -ms-sticky;
  position: sticky;
  width: 100%;
  bottom: 0px;
  height: 140px;
  z-index: 2;
  background: transparent linear-gradient(180deg, #00112600 4%, #001126 80%) 0 0 no-repeat padding-box;
  flex-grow: 1;
  align-items: baseline;
  padding: 0 10px;
}

.bottom_menu > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* transition: all 0.8s ease-out; */
  opacity: 1;
}

.bottom_menu img {
  width: 75px;
  height: auto;
}

.bottom_menu span {
  color: #e6f1ff;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.2px;
}

.bottom_menu .left span {
  font: normal normal 500 12px/16px Roboto;
  color: #e6f1ff;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.2px;
}

#prize {
  transform: translateX(-100%);
}

div#leader {
  transform: translateX(100%);
}

.tabcontent .place {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px 0 15px;
  margin-bottom: 4px;
  height: 40px;
  opacity: 1;
  border-bottom: 1px solid #70707040;
}

.btn-hidde {
  max-width: 20px;
  background: #dadada;
  border-radius: 50%;
  padding: 0 8px 2px 5px;
  display: block;
  margin: -10px auto;
  color: #fff;
  cursor: pointer;
  position: absolute;
  left: 49%;
  z-index: 999;
}

.arrow {
  border: solid #000;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
}

.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.tournament-description-container {
  padding: 10px 2px;
  margin-top: 30px;
  display: none;
}

.tournament-description-rules {
  padding: 0 12px 0 5px;
}

.termsimg {
  width: 34px;
  margin: -12px 4px;
  cursor: pointer;
}

.termsi {
  background: #00efe5;
  padding: 8px 6px;
  border-radius: 6px;
  box-shadow: 0 3px 3px #00000061;
  font: normal normal 500 12px/18px Roboto;
  letter-spacing: 0.12px;
  color: #15171df2;
}

.tournament-description-rules div {
  display: flex;
  align-items: baseline;
}

.tournament-description-rules div {
  display: flex;
  align-items: baseline;
}

.tournament-description-rules p {
  font-size: 12px;
  color: var(--secondary-text);
  text-align: left;
  font-family: Roboto;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0.2px;
}

.tournament-description-rules div span {
  display: block;
  color: #1d2129;
  font-size: 9px;
  background-color: #00efe5;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
}

.tabcontent .thirds {
  position: relative;
}

.tabcontent .seconds {
  background-color: #445ba7;
}

.tabcontent .firsts {
  background-color: #596fb2;
}

.tabcontent .first.place {
  background-color: #e3ac16;
  color: #000;
}

.tabcontent .second.place {
  background-color: #98bfde;
  color: #000;
}

.tabcontent .third.place {
  background-color: #b97a15;
  color: #000;
}

.tabcontent .other.place h3 {
  color: #e6f1ff;
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.15px;
}

.tabcontent .place p {
  display: flex;
  height: 24px;
  justify-content: center;
  align-items: center;
  padding: 2px 7px;
  color: var(--text-primary, #e6f1ff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.15px;
}

.tabcontent .place p img {
  margin: 0 -6px auto;
  max-width: 26px;
}

.GameFirstconteiner1 {
  width: 100%;
  height: 370px;
}

.GameFirstconteiner2 {
  width: 40%;
}

.GameMiniconteiner {
  display: flex;
  padding: 0;
}

.Gameslideractive {
  background: transparent linear-gradient(146deg, var(--primary-element) 0, #645efd 100%) 0 0 no-repeat padding-box;
  border: 2px solid var(--primary-text);
  background: transparent linear-gradient(146deg, #0056bc 0, #645efd 100%) 0 0 no-repeat padding-box;
  box-shadow: 0 3px 6px #00000080;
  border: 2px solid #00efe5;
  border-radius: 5px;
  opacity: 0.97;
  color: #fff;
}

.GameRules {
  display: flex;
  min-height: 100px;
  position: relative;
}

.GameRules:nth-child(1) {
  border-left: none;
}

.minidiv4e {
  display: flex;
  width: 100%;
  color: #e6f1ff;
  font-family: PBCasino, sans-serif;
  padding: 0 6px;
  max-height: 55px;
  margin-top: -135px;
  margin-bottom: 10px;
}

.controlleft {
  width: 20%;
}

.controlcenter {
  width: 60%;
  text-align: center;
}

.controlright {
  width: 20%;
}

.mainlabelconteiner {
  display: flex;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  justify-content: space-between;
}

.top-head.header_title {
  position: relative;
  max-width: min(calc(100vw * 0.5), calc(100vh * 0.5));
  margin-right: 25px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.top-head.header_title img {
  width: 100%;
  height: auto;
  display: block;
  z-index: 0;
}

.label-left,
.label-right {
  width: 100%;
  max-width: 320px;
  height: 100%;
  padding: 54px 13px 0;
  max-height: none;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(5, 17, 49, 0.7) 0%, rgba(5, 17, 49, 0.7) 100%);
  height: 101%;
  z-index: 1;
}

.label-center {
  width: 100%;
  position: relative;
  margin-top: 0;
  height: 100%;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 1fr max-content max-content;
  overflow: hidden;
}

.label-right {
  width: 100%;
  max-width: 320px;
  height: 101%;
  padding: 54px 13px 0;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(5, 17, 49, 0.7) 0%, rgba(5, 17, 49, 0.7) 100%);
}

.GameRules1 {
  width: 30%;
  position: relative;
}

.GameDrift {
  text-align: center;
  font-size: 14px;
  padding: 4px;
  color: #e6edf7;
  display: flex;
}

.fistspan {
  opacity: 0.5;
  font-size: 11px;
}

.labelw {
  padding: 3px 8px;
  font-size: 22px;
  text-align: left;
}

.labelround {
  display: block;
  line-height: 2px;
  color: #0ff;
}

.secondspan {
  font-size: 40px;
  letter-spacing: 0;
  color: #e4edf8;
  opacity: 1;
}

.GameCountdown {
  display: flex;
}

.secondspan div span {
  font-size: 9px;
  display: block;
  opacity: 0.5;
}

.GameSecondconteiner {
  width: 30%;
  border-radius: 20px;
  text-align: center;
  max-height: 580px;
}

.GameCountdown div {
  width: 33%;
}

.positionGame {
  display: flex;
  align-items: center;
}

.positionGame:nth-child(even) {
  background-color: #1f232d;
}

.positionGame .position {
  display: flex;
  opacity: 0.5;
}

.positionGame p {
  flex: 1;
  padding-left: 0px;
  color: #e6edf7;
  opacity: 80%;
  font-size: 14px;
  text-align: left;
}

.points {
  font-size: 16px;
  text-shadow: 0 0 4px #07f;
  color: #fff;
  font-style: italic;
  text-align: center;
}

.GameLeaderboard {
  width: 100%;
  margin: 0 auto;
  cursor: pointer;
  max-height: 500px;
}

.mypoints {
  background: #00ebffa3;
  margin-bottom: 32px;
}

.Gamekoef {
  font-size: 16px;
}

.tabz {
  overflow: hidden;
}

.tabz button {
  background-color: inherit;
  float: left;
  border: none;
  outline: 0;
  cursor: pointer;
  padding: 20px 8px;
  transition: 0.3s;
  font-size: 16px;
  width: 33.3%;
  color: #e4edf899;
  border-bottom: 2px solid #80808094;
}

.tabcontent p {
  font-size: 16px;
}

.tabz button.active {
  border-bottom: 2px solid #00efe5;
  color: #00efe5;
}

.tabcontent {
  border-top: none;
  text-align: left;
}

.games_lock {
  filter: blur(5px) opacity(10%);
  pointer-events: none;
}

.GameMinjs {
  width: 100%;
  display: flex;
  flex-direction: row;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}

.Torunametdate {
  height: 44px;
  display: flex;
  margin: 10px 0;
}

.reaCover {
  opacity: 0;
}

body.desktop .rankingList {
  overflow: auto;
}

.rankingList {
  width: 100%;
  height: 100%;
  position: relative;
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;
  text-align: center;
  padding: 18px 0;
}

.myidx {
  display: flex;
  width: 100%;
  height: 40px;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 4px 2px;
  text-align: center;
  border-bottom: 1px solid #70707040;
}

.myidx:nth-child(even) {
  background: inherit;
}

.myidx div {
  display: flex;
  height: 24px;
  justify-content: center;
  align-items: center;
  color: #e6f1ff;
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0.2px;
}

.myidx div:first-child {
  margin-left: 20px;
}

.Slotleaderboadrdid {
  margin-left: 30px;
}

::-webkit-scrollbar-track {
  background: #232833 !important;
}

.GamesCOntr {
  cursor: pointer;
  width: 10%;
  min-height: 100px;
  text-align: center;
}

.Gametournametconteiner {
  width: 50%;
  display: flex;
  margin: 120px 342px;
  position: absolute;
  padding: 12px;
}

.GamesCOntrmini {
  border-bottom: 6px solid #000000c4;
  font-size: 15px;
  padding: 4px;
  font-weight: 600;
  color: #ffffffad;
}

.GameMinjsx2 {
  width: 100%;
  margin-top: 18px;
}

.GamesCOntr .activez {
  border-bottom: 6px solid #00eaff;
}

.GamesCOntrmini span {
  display: block;
  font-size: 10px;
  font-weight: 400;
}

.grid-item:not(.addmoregames) > .imgCover > .gamesDescrpt {
  font-size: 12px;
}

.GameLeaderboard {
  max-height: 100%;
  border-radius: 10px;
  display: flex;
  align-items: center;
  flex-direction: column;
  padding-bottom: 20px;
}

.points_info {
  background: #051b2db2 0 0 no-repeat padding-box;
  border: 1px solid #4694ff;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px;
  cursor: pointer;
  margin: 10px 30px 20px 30px;
  position: relative;
  z-index: 2;
  pointer-events: none;
}

.points_info > p {
  text-align: left;
  font: normal normal 400 14px/20px Roboto;
  letter-spacing: 0.1px;
  color: #a6d5fa;
  padding: 0;
  margin: 0px auto 0px 5px;
}

.points_info > span {
  font: normal normal 500 12px/12px Roboto;
  letter-spacing: 0.12px;
  color: #4694ff;
}

.points_info > img {
  margin: 0;
  position: relative;
  top: 0;
}

.container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
}

.container__title {
  width: 100%;
  color: #fff;
  margin-bottom: 25px;
  font-weight: 400;
  text-align: center;
}

.select-dropdown {
  position: relative;
  display: inline-block;
  background: #e4edf812 0 0 no-repeat padding-box;
  border: 1px solid #00efe526;
  border-radius: 5px;
  width: 100%;
  height: 43px;
}

.select-dropdown__button {
  position: relative;
  padding: 10px 35px 10px 15px;
  color: #616161;
  cursor: pointer;
  width: 100%;
  height: 100%;
  text-align: left;
  background: #e4edf812 0 0 no-repeat padding-box;
  border: 1px solid #00efe5;
  border-radius: 5px;
  z-index: 3;
}

.event_history {
  width: 100%;
  display: flex;
  margin: 9px 0px;
  justify-content: space-between;
}

.container_dropdown {
  width: 100%;
  max-width: 90px;
}

.select-dropdown__button > span {
  text-align: center;
  font: normal normal bold 14px/22px Roboto;
  letter-spacing: 0;
  color: #e6f1ff;
}

.select-dropdown__button::focus {
  outline: 0;
}

.select-dropdown__button .zmdi-chevron-down {
  position: absolute;
  right: 10px;
  top: 12px;
}

.select-dropdown__list {
  position: absolute;
  display: block;
  left: 0;
  right: 0;
  max-height: 220px;
  overflow: auto;
  margin: 0;
  padding: 0;
  list-style-type: none;
  opacity: 0;
  pointer-events: none;
  transform-origin: top left;
  transform: scale(1, 0);
  transition: all ease-in-out 0.3s;
  z-index: 2;
  background: #29303c 0 0 no-repeat padding-box;
  border: 1px solid #00efe526;
  border-radius: 5px;
}

.hexagon_container.hex_mobile_on_game span.countdown::after,
.select-dropdown::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 8px;
  content: "";
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid #fff;
  transition: var(--animation-003);
  transform-origin: center center;
  transform-style: preserve-3D;
  transition: all 0.3s ease-out;
}

.hexagon_container.hex_mobile_on_game span.countdown::after {
  border-top: 4px solid #00efe5;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  right: -16px;
  top: 49%;
}

.select-dropdown.rotate_arrow::after {
  transform: rotate(180deg);
}

.select-dropdown__list:empty {
  pointer-events: none;
}

.select-dropdown__list.active {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1, 1);
}

.select-dropdown__list-item {
  all: unset;
  display: block;
  list-style-type: none;
  padding: 10px 15px;
  background: #e4edf812 0 0 no-repeat padding-box;
  border-bottom: 1px solid rgba(230, 241, 255, 0.16);
  cursor: pointer;
  color: #616161;
  transition: all ease-in-out 0.3s;
  text-align: center;
  font: normal normal bold 14px/22px Roboto;
  letter-spacing: 0;
  color: #e6f1ff;
}

.event_hour .left_arrow::before,
.event_hour .right_arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-35%, -50%);
  right: 0;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid #00efe5;
}

.event_hour {
  position: relative;
  width: 100%;
  max-width: 150px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.event_hour .left_arrow::before {
  -webkit-transform: translate(-65%, -50%) rotate(180deg);
  -ms-transform: translate(-65%, -50%) rotate(180deg);
  transform: translate(-65%, -50%) rotate(180deg);
  left: 50%;
}

.left_arrow,
.right_arrow {
  background: #e6f1ff1a 0 0 no-repeat padding-box;
  border: 1px solid #00efe502;
  border-radius: 5px;
  height: 100%;
  position: relative;
  width: 21px;
  cursor: pointer;
}

canvas {
  display: block;
  vertical-align: bottom;
}

#particles-js {
  position: absolute;
  width: 100vw;
  height: 100%;
  z-index: 0;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
}

.count-particles {
  background: #002;
  position: absolute;
  top: 48px;
  left: 0;
  width: 80px;
  color: #13e8e9;
  font-size: 0.8em;
  text-align: left;
  text-indent: 4px;
  line-height: 14px;
  padding-bottom: 2px;
  font-family: Helvetica, Arial, sans-serif;
  font-weight: 700;
}

.js-count-particles {
  font-size: 1.1em;
}

#stats,
.count-particles {
  -webkit-user-select: none;
  margin-top: 5px;
  margin-left: 5px;
}

#stats {
  border-radius: 3px 3px 0 0;
  overflow: hidden;
}

.count-particles {
  border-radius: 0 0 3px 3px;
}

.topdivLabel {
  position: relative;
}

body.mobile #particles-js {
  top: 0;
}

img.MainBb {
  position: relative;
  z-index: 2;
}

ul.event_hour_container {
  display: flex;
  width: 60px;
  overflow: hidden;
  overflow-x: auto;
}

ul.event_hour_container li {
  text-align: center;
  font: normal normal 900 23px/21px PBCasino;
  letter-spacing: 0;
  color: #00efe5;
  text-shadow: 0 3px 6px #0000007c;
  text-transform: uppercase;
}

ul.event_hour_container li {
  display: grid;
  grid-template-columns: 60px;
  align-items: center;
}

span {
  margin: 0;
  padding: 0;
}

.label-right .hexagon_container {
  position: relative;
  margin-bottom: 13px;
}

body.mobile .side.center.act::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background-color: #000000d9;
  animation: mymove 0.8s ease-out 2.5s forwards;
  z-index: 2;
}

@keyframes mymove {
  from {
    background-color: #000000d9;
  }

  to {
    background-color: transparent;
  }
}

.hexagon_container.hexagon_center {
  transform: translate(-50%, -350%) scale(1);
}

.hexagon {
  display: inline-block;
  width: 100px;
  height: 112px;
  position: relative;
  overflow: hidden;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}

.hexagon_container .active_round {
  position: absolute;
  bottom: -13px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  font: normal normal normal 12px/18px Roboto;
  letter-spacing: 0.12px;
  color: #e6f1ff;
  background: #f44336 0 0 no-repeat padding-box;
  box-shadow: 1px 3px 6px #00000033;
  border-radius: 10px;
  height: 20px;
  padding: 0 7px;
}

.hex_mobile_on_game .hexagon_container .active_round {
  bottom: -6px;
}

.hexagon_content {
  width: 100px;
  height: 95px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

body.out .hexagon_wrapper > * {
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(0, 0);
  z-index: 0;
}

body.in .hexagon_wrapper > * {
  /* animation: 18s autoplay infinite ease-in-out; */
  position: absolute;
  inset: 0;
  margin: auto;
  /* transform: translate(-50%, 0); */
  z-index: 0;
  row-gap: 5px;
}

@keyframes autoplay {
  0% {
    top: 100%;
  }

  4% {
    top: 0;
  }

  33.33% {
    top: 0;
  }

  37.33% {
    top: -100%;
  }

  100% {
    top: -100%;
  }
}

body.in .hexagon_wrapper > :nth-child(1) {
  animation-delay: 0s;
}

body.in .hexagon_wrapper > :nth-child(2) {
  animation-delay: 6s;
}

body.in .hexagon_wrapper > :nth-child(3) {
  animation-delay: 12s;
}

.hexagon_content span.my_place_text,
.hexagon_content span.my_points,
.hexagon_content span.round {
  letter-spacing: 0;
  color: var(--primary-text);
  text-align: center;
  text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.45);
  font-family: "PBCasino";
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  line-height: 18px; /* 125% */
  text-transform: uppercase;
}

.hexagon_content span.myP,
.hexagon_content span.my_place,
.hexagon_content span.time {
  letter-spacing: 0;
  color: var(--primary-main);
  text-align: center;
  text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.49);
  font-family: "PBCasino";
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  text-transform: uppercase;
}
span.myP > span {
  color: var(--primary-main);
  font-family: "PBCasino";
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  text-transform: uppercase;
}
span.countdown {
  text-align: center;
  font: normal normal 900 10px/11px Roboto;
  letter-spacing: 0;
  color: #ffffffcc;
  display: flex;
}

.non-opacity {
  opacity: 0 !important;
}

.fix_img {
  position: fixed;
  top: 51px;
  left: 0;
  height: auto;
  width: 100%;
}

footer {
  position: relative;
  z-index: 1;
}

.bottom_menu .elementsLR {
  position: relative;
}

body.in .bottom_menu .left.elementsLR.round_start {
  transform: translateX(-100%);
}

body.in .bottom_menu .right.elementsLR.round_start {
  transform: translateX(100%);
}

.datetime {
  position: relative;
  width: -webkit-fill-available;
  z-index: 2;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 10px 31px 0 30px;
}

.datetime li span.time {
  width: max-content;
  font: normal normal 900 16px/12px PBCasino;
  color: #e4edf8;
}

.datetime li span.round {
  font: normal normal 500 12px/9px Roboto;
  letter-spacing: 0;
  color: #e6f1ff;
}

.datetime li {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 10px;
  opacity: 0.5;
}

.content_wrapper {
  position: relative;
  height: 100%;
}

#leader .fix_img,
#prize .fix_img {
  z-index: -1;
  top: -400px;
  height: 100%;
}

.tabcontent_wrapper {
  height: 100%;
  overflow: auto;
  display: flex;
  flex-direction: column;
}

.label-center .head {
  display: flex;
  justify-content: center;
  margin: 0 33px 0;
  position: relative;
  align-items: center;
  flex-direction: column;
}

.super-friday-h1 {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
}

.super-friday-h1 > h1 {
  color: var(--primary-text);
  font-family: PBCasino;
  line-height: normal;
  text-transform: uppercase;
  font-size: min(calc(100vw * 0.07), calc(100vh * 0.07));
  transform: matrix(1, 0, -0.35, 0.99, 0, 0);
}

.super-friday-h1 div img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.super-friday-h1 div {
  width: 100%;
  height: auto;
}

.label-center .head h3 {
  font: normal normal 900 32px/41px PBCasino;
  letter-spacing: 0;
  color: #00efe5;
  text-shadow: 0 0 20px #000000a3;
  text-transform: uppercase;
  margin: 0;
}

.label-center .head h2 {
  text-align: center;
  font: normal normal 900 52px/63px PBCasino;
  letter-spacing: 0;
  color: #e6f1ff;
  text-shadow: 0 0 20px #000000a2;
  text-transform: uppercase;
  margin: 0;
}

.header_img::before {
  left: 0;
  top: 20%;
  background-image: url(/images/buy-bonus-assets/left_coin.png?v=2024041516);
}

.header_img::after {
  right: 0;
  top: 25%;
  background-image: url(/images/buy-bonus-assets/right_coin.png?v=2024041516);
  animation-delay: 1s;
}

@-webkit-keyframes coinAnime {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(15%);
    transform: translateY(15%);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes coinAnime {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(15%);
    transform: translateY(15%);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

.label-center .head img.heroesBb {
  margin-top: 0;
  width: 100%;
  height: auto;
  position: relative;
  z-index: 1;
}

.hexagon_container img.frame {
  width: 115%;
  height: 115%;
  position: absolute;
  z-index: 0;
  top: -9px;
  left: -7px;
  will-change: filter;
  -webkit-filter: drop-shadow(0 0 30px #0896f4);
  filter: drop-shadow(0 0 30px #0896f4);
}

div#draggable-elem .hexagon_container.hex_D {
  position: static;
  transform: none;
  bottom: auto;
  top: 0;
  left: 0;
  transition: all 0.8s ease-out;
}

.ringring {
  margin: 8px;
  width: calc(100% - 200px);
  margin: 0 auto;
  display: flex;
  border-radius: 10px;
  justify-content: end;
  padding-top: 10px;
  -ms-scroll-chaining: none;
  overscroll-behavior: contain;
  height: calc(var(--app-height) - 100px);
}

#draggable-elem {
  cursor: pointer;
  position: absolute;
  transform: translate(0, -50%);
  top: 50%;
  left: -50px;
  z-index: 2;
}

.ringring #GameLeaderboard {
  position: relative;
  width: 100%;
  max-width: 300px;
  height: calc(var(--app-height) - 70px);
  margin-top: -10px;
  margin-left: -50%;
  transition: all 0.8s ease-in-out;
  background: transparent linear-gradient(180deg, #00000000 0, #00000063 24%, #000000f2 50%, #000 100%) 0 0 no-repeat padding-box;
  opacity: 0;
}

.ringring.fullscrean #GameLeaderboard {
  height: calc(var(--app-height) - 0px);
  margin-top: 0;
}

.fullscrean .ringringtitle {
  width: 100%;
  margin: 0 auto;
}

.ringring #GameLeaderboard img.btn_close {
  position: absolute;
  width: 14px;
  height: auto;
  top: 15px;
  right: 15px;
  cursor: pointer;
}

.leftAnimation {
  margin-left: calc(0px - 100px) !important;
  opacity: 1 !important;
}

.topAnimation {
  transform: translatey(0) !important;
  opacity: 1 !important;
  z-index: 7 !important;
}

.fixt_menu_left img {
  width: 20px;
  height: auto;
}

.close_x img {
  width: 14px;
  height: auto;
}

.fullscrean .leftAnimation {
  margin-left: 0 !important;
  opacity: 1 !important;
}

.ringring #GameLeaderboard .hexagon_container.hex_D {
  position: relative;
  margin-bottom: 13px;
}

.close_leader {
  position: absolute;
  top: 15px;
  right: 15px;
}

.mainconteiner {
  position: relative;
  width: 100%;
  margin-left: 80px;
}

div#GameLeaderboard .right_wrapper {
  display: grid;
  place-items: center;
  padding-top: 60px;
}

div#GameLeaderboard .GameLeaderboard {
  max-height: none;
}

.ringringConteiner {
  border-radius: 0 0 10px 10px;
  overflow: hidden;
  display: flex;
  height: calc(100% - 30px);
}

.RandomingGame {
  border: none;
  width: 100%;
  height: 100%;
  z-index: 1;
  margin: 0 auto;
}

.fixt_menu_left {
  position: static;
  transform: translate(0);
  background: 0 0;
  cursor: pointer;
  margin-left: 20px;
  border-radius: 0 7px 7px 0;
  display: grid;
  place-items: center;
  width: 40px;
  height: 37px;
}

.close_x {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #333d52e6 0 0 no-repeat padding-box;
  display: grid;
  place-items: center;
  position: absolute;
  top: -26px;
  right: -5px;
  z-index: 20;
}

.tournametlocker {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 1;
}

.prize-every-day > div span:nth-child(1) {
  color: #fff;
  font-family: "PBCasino";
  font-style: normal;
  font-weight: 900;
  font-size: 24px;
  line-height: 30px;
  /* -webkit-transform: matrix(1, 0, -0.15, 0.99, 0, 0);
  transform: matrix(1, 0, -0.15, 0.99, 0, 0); */
  /* letter-spacing: -2px; */
}

.prize-every-day > div span:nth-child(2) {
  color: #fff;
  font-family: "PBCasino";
  font-style: normal;
  font-weight: 900;
  font-size: 32px;
  line-height: 30px;
}

.prize-every-day > p {
  margin: 0px;
  background: linear-gradient(87.14deg, #00efe5 0.79%, #b8e7fb 95.5%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  /* -webkit-transform: matrix(1, 0, -.15, .99, 0, 0); */
  /* transform: matrix(1, 0, -.15, .99, 0, 0); */
  font-family: PBCasino;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 18.904px;
  /* 62.099% */
  /* letter-spacing: -1.44px; */
  text-transform: uppercase;
}

.prize-every-day > div {
  display: grid;
  grid-template-columns: max-content max-content max-content;
  align-items: baseline;
  column-gap: 6px;
}

.prize-every-day {
  display: flex;

  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.header_title > h1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "PBCasino";
  font-style: normal;
  font-weight: 900;
  line-height: min(calc(100vw * 0.06), calc(100vh * 0.06));
  text-transform: uppercase;
  color: #e6f1ff;
  transform: matrix(1, 0, -0.15, 0.99, 0, 0);
  margin: 0;
  font-size: min(calc(100vw * 0.07), calc(100vh * 0.07));
  letter-spacing: 1px;
  grid-column: 2/4;
}

.header_title .provider-logo {
  grid-column: 1/2;
  grid-row: 1/3;
  height: auto;
}

span.start-end-date {
  font-family: "PBCasino";
  font-style: normal;
  font-weight: 900;
  font-size: 16px;
  line-height: 23px;
  text-transform: uppercase;
  color: #e6f1ff;
  opacity: 0.8;
  transform: matrix(1, 0, -0.12, 0.99, 0, 0);
  align-self: center;
  margin: 6px 0 16px;
  grid-column: 3/4;
  grid-row: 2/3;
  text-align: end;
}

.provider-logo > img {
  width: 100%;
  height: auto;
  display: block;
}

.tabcontent .microdiv3_p {
  text-align: center;
  font: normal normal 400 14px/20px Roboto;
  letter-spacing: 0.4px;
  color: #e6f1ff;
  padding: 11px 12px;
}

.slotconteinermega {
  opacity: 1;
  height: 83%;
  overflow: auto;
  scroll-margin-top: 80px;
  margin: 0 30px 10px 30px;
}

.left_wrapper > img {
  max-width: 100px;
}

.leader_img_D {
  max-width: 100px;
  padding-bottom: 10px;
}

@media only screen and (max-width: 900px) {
  :root {
    --carousel-gap: 21px;
  }

  div#games_event {
    margin: 0;
  }

  .event_history {
    padding: 0 20px;
  }

  header .account ul.nav.non-out.non-desktop > li > a {
    height: auto;
  }

  .content_wrapper {
    position: relative;
    height: 100%;
    background: linear-gradient(360deg, #15171d 0, rgba(21, 23, 29, 0.53125) 30%, rgba(21, 23, 29, 0) 100%);
    display: grid;
    /* overflow: hidden; */
  }

  div#GameLeaderboard .right_wrapper {
    display: block;
    padding-top: 20px;
  }

  div#GameLeaderboard .fix_img {
    position: fixed;
    top: 0;
    left: 0;
    height: auto;
    width: 100%;
    z-index: -1;
  }

  .tabcontent_wrapper {
    justify-content: space-between;
    background: #051131;
  }

  .hex_mobile_on_game {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    transition: all 0.8s ease-out;
  }

  .hex_mobile_on_game .CloseIFrame {
    cursor: pointer;
    background: #00000080;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-right: 2px;
    margin: 0 10px 0 0;
  }

  .hex_mobile_on_game .CloseIFrame img {
    width: 16px;
    height: 16px;
    filter: brightness(0) saturate(100%) invert(100%) sepia(97%) saturate(1237%) hue-rotate(177deg) brightness(102%) contrast(104%);
    opacity: 0.5;
  }

  .hex_mobile_on_game .top {
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 3px solid #00efe5;
    padding: 0 12px;
    background: #054eb9 0 0 no-repeat padding-box;
    box-shadow: inset 0 0 43px #000000ce;
    transition: all 0.8s ease-out;
  }

  .hex_mobile_on_game .bootom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
  }

  .right_hide_top_menu {
    position: relative;
    width: 100px;
    height: 50px;
  }

  .right_hide_top_menu::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #00efe5;
    z-index: 1;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
  }

  .right.close_hex_mobile {
    background: #333d52e6 0 0 no-repeat padding-box;
    margin: 0;
    z-index: 1;
    padding: 6px 6px 2px;
    border-radius: 0 10px 10px 0;
    opacity: 0;
  }

  .right.close_hex_mobile img {
    width: 20px;
    height: auto;
  }

  .hex_mobile_on_game .hexagon {
    width: 72px;
    height: 65px;
  }

  .hex_mobile_on_game .hexagon_content {
    width: 72px;
    height: 65px;
  }

  .hex_mobile_on_game .left {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .hex_mobile_on_game .hexagon_container {
    margin-right: -53px;
  }

  .hex_mobile_on_game span.countdown {
    font: normal normal 900 14px/15px Roboto;
    padding-right: 24px;
  }

  .hex_mobile_on_game .hexagon_content span.my_place_text,
  .hex_mobile_on_game .hexagon_content span.my_points,
  .hex_mobile_on_game .hexagon_content span.round {
    font: normal normal 900 10px/19px PBCasino;
    font-size: 7px;
    line-height: normal;
  }

  .hex_mobile_on_game .hexagon_content span.myP,
  .hex_mobile_on_game .hexagon_content span.my_place,
  .hex_mobile_on_game .hexagon_content span.time {
    font: normal normal 900 21px/19px PBCasino;
    font-size: 15px;
  }
  .hex_mobile_on_game .hexagon_content span.myP > span {
    font-size: 10px;
  }
  .hexagon_container.hex_mobile_on_game {
    background: #054eb9 0 0 no-repeat padding-box;
    box-shadow: inset 0 0 53px #000000b4, 0 0 0 #0896f4;
    width: 100%;
    height: 60px;
    position: static;
    transform: none !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 3px solid #00efe5;
    overflow: hidden;
    padding: 0 30px;
  }

  .hexagon_container.hex_mobile_on_game .hexagon {
    clip-path: none;
  }

  .hexagon_container.hex_mobile_on_game img.frame {
    position: static;
    width: 50px;
    height: auto;
  }

  .hexagon_container.hex_mobile_on_game span.countdown {
    position: relative;
  }

  #leader > div > div.GameLeaderboard {
    max-height: none;
    flex-grow: 1;
  }

  .mainconteiner {
    margin-left: 0;
    position: relative;
  }

  .ringring #GameLeaderboard {
    position: absolute;
    top: 0;
    left: 0;
    max-width: none;
    width: 100%;
    height: var(--app-height);
    margin: 0;
    opacity: 0;
    z-index: 0;
    transform: translatey(-100%);
  }

  .fixt_menu_left {
    position: absolute;
    top: 20%;
    left: 0;
    transform: translateY(-50%);
    background: #333d52e6 0 0 no-repeat padding-box;
    margin: 0;
    z-index: 1;
  }

  .close_x {
    right: 49px;
  }

  .hexagon_container {
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -o-sticky;
    position: -ms-sticky;
    position: sticky;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -350%) scale(0);
    display: inline-block;
    z-index: 6;
    transition: all 0.8s ease-out;
    transform-origin: 0 -300%;
    transform-origin: center center;
  }

  .ringring {
    width: 100%;
    padding: 0;
  }

  .minidiv4e {
    max-height: 100%;
    margin-top: 0;
  }

  /* .navAndTerms {
        position: static;
    } */

  .event_hour {
    position: relative;
    z-index: 5;
    width: 100%;
    max-width: 182px;
  }

  .points_info {
    align-items: center;
    padding: 13px 9px;
    /* margin: 30px 30px; */
    pointer-events: none;
  }

  .container_dropdown {
    max-width: 115px;
  }

  .datetime li span.time {
    font: normal normal 900 16px/16px PBCasino;
  }

  .datetime li span.round {
    font: normal normal 500 13px/13px Roboto;
  }

  .datetime li {
    width: 100%;
    margin-right: 30px;
  }

  .datetime {
    margin: 0 0 10px 0;
    justify-content: start;
    width: var(--app-width);
    overflow: hidden;
    overflow-x: auto;
  }

  .points_info > img {
    align-self: center;
  }

  body.nonie .grid-layout {
    margin-top: 0;
    min-height: 160px;
  }

  ::-webkit-scrollbar {
    height: 2px;
  }

  .GameMinjsx2 {
    overflow: hidden;
    overflow-x: scroll;
  }

  .controlcenter {
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
  }

  .tournament-description-container {
    padding: 0;
    margin-top: 0;
    background: #0f1c4b;
  }

  .controlcenter h2 {
    font-size: 26px;
    margin: 0;
  }

  .tabz {
    overflow: hidden;
    border-top-left-radius: 29px;
    border-top-right-radius: 29px;
    margin-top: -2px;
    padding: 2px;
  }

  .tabcontent {
    background: #1c212b;
    position: relative;
  }

  .tournametmagaconteiner {
    border-radius: 0;
  }

  .prizepoolwin {
    display: none;
  }

  .GameFirstconteiner1 {
    height: 236px;
  }

  .GameMinjs {
    flex-wrap: wrap;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-top: 10px;
  }

  .GameMinjsZ {
    flex-wrap: wrap;
    width: 1100px;
    padding: 0 5px;
  }

  .GameMegaconteiner {
    display: block;
    height: 100%;
  }

  .tabz button {
    background: inherit;
    border-bottom: 4px solid gray;
  }

  .tabz button.active {
    border-bottom: 4px solid #00efe5;
    color: #00efe5;
  }

  .GameSecondconteiner {
    width: 100%;
    display: grid;
    z-index: 1;
  }

  .GameFirstconteiner h3 {
    text-align: center;
    font: normal normal 900 20px/26px PBCasino;
    letter-spacing: 0;
    color: #00efe5;
    text-transform: uppercase;
    background: #00000099 0 0 no-repeat padding-box;
    padding: 4px 10px;
  }

  .header_title > h1 {
    flex-direction: column;
    column-gap: 5px;
    font-weight: 900;
    font-size: 52px;
    line-height: 44px;
    grid-column-end: span 5;
  }

  .top-head.header_title h1 span::before {
    max-width: min(calc(100vw * 0.15), calc(100vh * 0.15));
  }

  span.start-end-date {
    font-weight: 900;
    font-size: 16px;
    line-height: 23px;
    width: max-content;
    margin: 0 0 0 auto;
    grid-column: 3/4;
    grid-row: 2/3;
    text-align: end;
  }

  .GameMiniconteiner {
    display: block;
  }

  .tabz button {
    width: 33.3%;
  }

  .GameFirstconteiner1 {
    width: 100%;
  }

  .GameRules {
    width: 48.5%;
    margin: 0;
    background: #0056bc;
    margin-left: 8px;
    margin-bottom: 8px;
    border-radius: 8px;
  }

  .secondspan {
    font-size: 18px;
  }

  .Gamekoef {
    font-size: 14px;
  }

  .GameSecondconteiner {
    width: 100%;
  }

  .fistspan {
    font-size: 12px;
  }

  #GameLeaderboard {
    max-height: none;
  }

  .GamePlace2 {
    font-size: 28px;
  }

  .GameSecondconteiner {
    margin-left: 0;
    max-height: 100%;
    border-radius: 0;
  }

  .tabz button {
    border-radius: 0;
    border: 0 solid #232833;
    border-bottom: 4px solid rgb(84 84 84 / 52%);
  }

  .ringringConteiner {
    height: calc(var(--app-height) - 60px);
    position: relative;
    z-index: 0;
  }

  .transvf {
    line-height: 26px;
  }

  .tabcontent p {
    margin-top: 0px;
  }

  .microdiv3 {
    background: #333d52e6 0 0 no-repeat padding-box;
    border-radius: 4px;
    position: relative;
    margin-top: 0;
  }

  .tournametlocker img {
    width: 70px;
    height: auto;
  }

  .tk-myriad-pro {
    resize: both;
    overflow: auto;
  }

  .super-friday-h1 div img {
    /* max-width: 205px; */
  }

  @media (orientation: portrait) {
    #draggable-elem {
      display: none;
    }

    .ringringConteiner {
      height: calc(var(--app-height) - 0px);
    }

    .RandomingGame {
      height: calc(var(--app-height) - 0px);
    }

    .fixt_menu_left {
      display: none;
    }
  }

  @media (orientation: landscape) {
    #draggable-elem {
      cursor: pointer;
      position: absolute;
      transform: translate(0, -50%);
      top: 50%;
      left: 90px;
      z-index: 2;
    }

    .ringring {
      padding: 0;
    }

    .non_landscape {
      display: none !important;
    }

    .hex_mobile_on_game {
      display: none;
    }

    .ringringConteiner {
      height: calc(var(--app-height) - 30px);
    }

    .tabcontent_wrapper {
      all: unset;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: row;
      align-items: center;
    }

    .tabcontent_wrapper .btn_close,
    .tabcontent_wrapper .right {
      all: unset;
      width: 100%;
      max-width: 160px;
      background: #000;
      height: 100%;
      display: grid;
      place-items: center;
    }

    .ringring #GameLeaderboard .hexagon_container.hex_D.hexagon_landscape {
      top: 0;
      left: 0;
      margin: 0;
      padding: 0;
      transform: translate(0) !important;
    }

    img.close_right {
      padding: 0;
    }

    .ringring div#GameLeaderboard .GameLeaderboard {
      max-height: var(--app-height);
      overflow: auto;
    }

    div#GameLeaderboard .right_wrapper {
      height: 100%;
      display: grid;
      padding-top: 0;
    }
  }

  .top-head.header_title h1 span:first-child::before {
    display: block;
    content: "";
    position: absolute;
    width: 100%;
    top: 0;
    left: -65px;
    background-image: url(/images/buy-bonus-assets/VectorSmart.png?v=2024041516);
    height: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    max-width: 55px;
  }

  .tabcontent .microdiv3_p {
    margin: 0 0 10px 0;
    padding: 0;
  }

  .slotconteinermega {
    height: 100%;
    overflow: unset;
  }

  .tabcontent_wrapper .left,
  .tabcontent_wrapper .right {
    background-image: url("/images/buy-bonus-assets/mobile-left-right-menu-background.png?v=2024041516");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    padding: 90px;
  }

  .microdiv3 {
    margin: 10px 0 0;
  }

  section.pageContent .side.center.mobile {
    overflow: unset;
  }

  #carousel {
    column-gap: var(--carousel-gap);
  }
}

.prizeEuro {
  display: flex;
  flex-direction: column;
  text-align: center;
  margin-bottom: 14px;
}

.starttour {
  background: #00a03d 0 0 no-repeat padding-box;
  box-shadow: 0 3px 6px #00000029;
  border-radius: 12px;
  width: 80px;
  text-align: center;
  color: #fff;
  padding: 2px;
  margin: 8px 6px;
  float: left;
}

select {
  -webkit-appearance: menulist;
}

@media screen and (min-width: 1280px) {
  body.nonie .grid-layout {
    grid-template-columns: auto auto auto auto !important;
    overflow: hidden;
    padding-bottom: 140px !important;
  }
}

.grid-layout {
  padding: 6px 0 !important;
}

.GameCountdown2 {
  border-radius: 10px;
  padding: 4px;
  text-align: center;
}

.transvf {
  line-height: 50px;
}

.GameCountdown2 div {
  width: 33%;
  display: contents;
}

.clockrace {
  display: flex;
  margin: 39px 0 auto;
  font-size: 18px;
}

.GameCountdown3 {
  background: #232833;
  border-radius: 10px;
  padding: 4px;
  text-align: center;
}

.GameCountdown3 div {
  width: 33%;
  display: contents;
}

.GameMyPoints .positionGame .position {
  opacity: 1;
}

.GameMyPoints p {
  opacity: 1;
  color: #fff;
}

.GameMyPoints span {
  opacity: 1;
}

@media screen and (max-width: 420px) {
  .GameFirstconteiner1 {
    height: 450px;
  }

  .GameRules {
    width: 47%;
  }

  .rankingList {
    max-height: 100% !important;
    width: 100% !important;
  }
}

@media screen and (max-width: 380px) {
  .GameFirstconteiner1 {
    height: 420px;
  }
}

@media screen and (max-width: 320px) {
  .GameFirstconteiner1 {
    height: 360px;
  }
}

.grid-item.expanded:not(.addmoregames):hover > .imgCover {
  height: 100%;
}

.loader {
  background: #02314d;
}

.hidden {
  display: none !important;
}

.GameLeaderboard {
  margin: 0 auto;
  margin-top: -30px;
}

.desktop .GameLeaderboard {
  margin: 0;
}

.Torunametdate {
  display: flex;
}

.calendar,
.datepick {
  background: #29303c;
  display: grid;
  place-content: center;
  font-size: 18px;
  line-height: 22px;
  color: #e6f1ff;
  cursor: pointer;
  position: relative;
  text-align: center;
}

.activete {
  background: #e4edf8 0 0 no-repeat padding-box;
  color: #1e232b;
}

.Torunametxdate {
  margin-top: 12px;
}

.calendar.activete .time > span {
  color: #15171d;
}

.calendar.activete .time > img {
  -webkit-filter: brightness(0) saturate(100%) invert(5%) sepia(4%) saturate(4042%) hue-rotate(187deg) brightness(97%) contrast(91%);
  filter: brightness(0) saturate(100%) invert(5%) sepia(4%) saturate(4042%) hue-rotate(187deg) brightness(97%) contrast(91%);
}

.time > span {
  font-size: 10px;
  line-height: 12px;
  color: #e6f1ff;
  font-family: Roboto, sans-serif;
}

.calendar .time {
  display: grid;
  place-items: center;
  row-gap: 4px;
}

.GameLeaderboard div#period {
  width: 186px;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  background-color: #29303c;
  position: absolute;
  right: 0;
  top: 63px;
  border-radius: 10px;
  z-index: 1;
}

.period input[type="date"] {
  width: 167px;
  height: 39px;
  margin: 0 auto;
  padding: 0;
  background-color: transparent;
  border: none;
  color: #fff;
}

input#period_from_date::-webkit-calendar-picker-indicator {
  filter: invert(1);
  width: 30px;
  height: 30px;
}

.period > div {
  display: flex;
  justify-content: space-between;
  padding: 0 15px 0 25px;
}

.period .title {
  display: flex;
  font-size: 12px;
  color: #e6f1ff;
  opacity: 60%;
  margin: 6px 23px 4px;
}

.period {
  display: flex;
  width: 170px;
  height: 59px;
  border-radius: 10px;
  border: 1px solid #e6f1ff1a;
  flex-direction: column;
  background: #e6f1ff33;
  margin-top: 10px;
  justify-content: center;
  margin: 10px auto 0;
}

.period .periodMenu {
  margin: 0 auto;
}

body.desktop .periodMenu {
  justify-content: left;
  display: inline-table;
  margin: 0;
  background: #e6f1ff33;
  border-radius: 10px 10px 0 0;
}

.normalButton {
  cursor: pointer;
}

div#periodResultsButton {
  padding: 22px 0;
  color: #fff;
  width: 100%;
  background: #e6f1ff33;
  border-radius: 0 0 10px 10px;
}

.option-container {
  width: 100%;
  max-width: 216px;
  height: 43px;
  box-shadow: 0 0 6px #00c2ff;
  border: 1px solid #e4edf8;
  border-radius: 5px;
  margin-top: 20px;
  overflow: hidden;
}

select#historyType {
  width: 100%;
  height: 100%;
  background-color: transparent;
  font-size: 14px;
  line-height: 22px;
  color: #e6f1ff;
  font-weight: 700;
  padding-left: 13px;
  margin: 0;
}

select#historyType option {
  background-color: #29303c;
}

.GameMyPoints {
  width: 100%;
  z-index: 0;
}

.Slotleaderboadrdid,
.positionGame.mypoints.GameMyPoints2 > p {
  text-align: left;
  font: normal normal normal 12px/18px Roboto;
  letter-spacing: 0.12px;
  color: #e6f1ff;
}

.GameLeaderboard .myidx {
  display: grid;
  grid-template-columns: 20px max-content 1fr;
  grid-template-rows: 20px;
  align-items: center;
}

.GameLeaderboard .Slotleaderboadrdprize,
.positionGame.mypoints.GameMyPoints2 span.points {
  justify-self: flex-end;
  margin-right: 4px;
  color: #00efe5;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0.15px;
}

.positionGame.mypoints.GameMyPoints2 span.points {
  margin-right: 9px;
  font: normal normal bold 14px/20px Roboto;
  letter-spacing: 0.11px;
  color: #e6f1ff;
  text-shadow: 0 0 4px #07f;
  background: 0 0;
}

span.Slotleaderboadrdnum,
span.position {
  margin: 0px 11px 0 16px;
  color: #e6f1ff;
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.15px;
}

.even {
  background: #00ebff0d 0 0 no-repeat padding-box;
}

.positionGame.mypoints.GameMyPoints2 {
  background: linear-gradient(101deg, rgba(56, 138, 242, 0.62) -0.64%, rgba(18, 244, 226, 0.62) 112.17%);
  margin: 12px 0 0px 0;
  display: grid;
  grid-template-columns: max-content max-content 1fr;
  align-items: center;
  column-gap: 10px;
  padding: 5px 0 5px 8px;
}

.account-rang .Slotleaderboadrdprize {
  color: #fff;
  text-shadow: 0 0 4px #07f;
}

span.Slotleaderboadrdnum img {
  width: 20px;
  height: auto;
}

.grid-item:not(.addmoregames):hover > .imgCover > h4 {
  font-size: 12px;
}

.microdiv3 {
  background: var(--surface-surface-70);
  display: grid;
  max-width: 297px;
  padding: 8px 16px 15px;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  border-radius: 3px;
  margin: 10px 0 39px;
}

.microdiv3_p {
  text-align: center;
  font: normal normal 400 14px/18px Roboto;
  letter-spacing: 0.4px;
  color: #e6f1ff;
  padding: 0;
  margin: 0;
}

.microdiv3_p:first-child {
  margin-bottom: 10px;
}

.Gmaeconteiner h1 {
  text-align: center;
}

.jurjur {
  padding: 18px 45px;
  font-size: 23px;
  cursor: pointer;
  color: #e6f1ff;
  text-decoration: none;
  border-radius: 38px;
  opacity: 1;
  margin: 55px auto 0;
  display: block;
  font-weight: 700;
  background: transparent -webkit-gradient(linear, left top, left bottom, from(#0074fa), to(#3c55de)) 0 0 no-repeat padding-box;
  background: transparent -o-linear-gradient(top, #0074fa 0, #3c55de 100%) 0 0 no-repeat padding-box;
  background: transparent linear-gradient(180deg, #0074fa 0, #3c55de 100%) 0 0 no-repeat padding-box;
  -webkit-box-shadow: inset 0 3px 6px #ffffff52, 2px 6px 10px #00000067;
  box-shadow: inset 0 3px 6px #ffffff52, 2px 6px 10px #00000067;
}

.ringringtitle {
  width: 100%;
  height: 30px;
  background: #2b2f36;
  padding: 2px 8px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.titleflexRing {
  max-width: 200px;
  float: right;
  display: flex;
  gap: 16px;
  margin-left: auto;
}

.otherRandring {
  cursor: pointer;
}

.in .full-sceen-container {
  cursor: pointer;
  width: 42px;
  height: 36px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  background-color: var(--surface-captions);
  border-radius: 6px;
  box-shadow: 0 3px 1.5px 0 rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
}

.break-round .full-sceen-container {
  display: none;
}

.CloseIFrame {
  cursor: pointer;
}

.titleflexRing div img {
  width: 74%;
  display: block;
  margin: 4px auto;
}

.gingname {
  font-size: 16px;
  font-weight: 700;
}

.ripple-loader {
  position: relative;
  width: 64px;
  height: 64px;
  margin: 0 auto;
}

.ripple-loader div {
  position: absolute;
  border: 4px solid #454ade;
  border-radius: 50%;
  animation: ripple-loader 1s ease-out infinite;
}

.ripple-loader div:nth-child(2) {
  animation-delay: -0.5s;
}

@keyframes ripple-loader {
  0% {
    top: 32px;
    left: 32px;
    width: 0;
    height: 0;
    opacity: 1;
  }

  100% {
    top: 0;
    left: 0;
    width: 64px;
    height: 64px;
    opacity: 0;
  }
}

#draggable-elem.fix_position {
  left: 70px;
}

@media screen and (min-width: 980px) {
  body.nonie .grid-layout {
    grid-template-columns: auto auto auto auto;
  }
}

@media screen and (max-width: 320px) {
  .hexagon {
    width: 60px;
    height: 70px;
  }

  .hexagon_content {
    width: 100%;
    height: 100%;
    display: flex;
  }

  .hexagon_content span.my_place_text,
  .hexagon_content span.my_points,
  .hexagon_content span.round {
    font: normal normal 900 10px/11px PBCasino;
  }

  .hexagon_content span.myP,
  .hexagon_content span.my_place,
  .hexagon_content span.time {
    font: normal normal 900 18px/24px PBCasino;
  }

  span.countdown {
    justify-content: center;
    height: 24px;
    font: normal normal 500 6px/9px PBCasino;
  }

  .bottom_menu {
    height: 100px;
  }
}

.rankingList:empty:before {
  content: "В момента няма налични истории!";
}

html[lang="en"] .rankingList:empty:before {
  content: "There are currently no stories available!";
}

body.mobile header {
  border-bottom: none;
}

.desktop .artboard2 {
  height: 100%;
}

.prizes-container {
  height: 70%;
  overflow: hidden;
  overflow-y: auto;
  -webkit-mask-image: linear-gradient(to top, rgba(28, 33, 43, 0) 0, rgba(0, 0, 0, 0.85) 20%);
  mask-image: linear-gradient(to top, rgba(28, 33, 43, 0) 0, rgba(0, 0, 0, 0.85) 20%);
  padding: 0 0 100px 0;
}

.iframe-game-container {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

iframe#superFridayGameFrame {
  border-radius: 6px;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.break-round,
.no-login {
  background-image: url(/images/buy-bonus-assets/Game_screenshot.png?v=2024041516);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  border-radius: 8px;
}

.carousel-wrapper.container.non-mobile {
  width: calc(100% - 124px);
  margin: 27px auto 19px;
}

.carousel {
  width: 100%;
  height: 100%;
  position: relative;
  overflow-y: hidden;
  display: grid;
  column-gap: var(--carousel-gap);
  scrollbar-width: none;
  grid-auto-flow: column;
}

.carousel .item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  border-radius: 5px;
  color: var(--secondary-text);
  letter-spacing: 0.16px;
  cursor: pointer;
  width: var(--carousel-child-width);
}

.arrows {
  width: 22px;
  height: 56px;
  color: #00ebff;
  background: #e6f1ff26 0 0 no-repeat padding-box;
  border-radius: 6px;
  padding: 0;
  margin: 0;
  border: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.arrows svg {
  width: 1.5em;
  height: 1.5em;
  fill: var(--primary-main);
}

.carousel-wrapper {
  width: 100%;
  position: relative;
}

p.time {
  width: max-content;
  font-family: PBCasino;
  font-size: var(--fs-body1-16);
  line-height: normal;
}

p.round {
  font-family: Roboto;
  font-size: var(--fs-body3-12);
  font-style: normal;
  line-height: var(--lh-16);
  letter-spacing: 0.4px;
  font-weight: var(--fw-500);
}

button.arrow-inactive {
  background: #e6f1ff26 0 0 no-repeat padding-box;
  color: #e6f1ff80;
}

button.left-arrow {
  left: -30px;
}

button.right-arrow {
  right: -30px;
}

.btn-wrapper {
  display: grid;
  grid-auto-flow: column;
  column-gap: 10px;
}

.gameContainer.no-login .super-friday-game-link {
  z-index: -1;
}

.mobile .carousel-wrapper {
  max-width: 296px;
  margin: 0 auto;
  margin: 45px auto 36px;
}

.mobile .super-friday-h1 {
  margin: 15px 0 0 0px;
  position: relative;
  top: 30px;
}

.gameContainer {
  width: min(335px, 100%);
  height: auto;
  margin: 0 auto;
  position: relative;
  border-radius: 12.09px;
}

.super-friday-game-link {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.super-friday-game-link > div {
  width: 100%;
  height: 100%;
  /* box-shadow: -3px 0 10px 0 rgba(200, 200, 200, 0.5); */
}

.mobile .iframe-game-container {
  overflow: unset;
}

.super-friday-game-link > div > img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12.09px;
}

.super-friday-game-link > div::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  background-color: var(--surface-blur);
  border-radius: 50%;
  background-image: url(/images/buy-bonus-assets/play.png?v=2024041516);
  background-repeat: no-repeat;
  background-size: contain;
}

.mobile .super-friday-h1 div {
  width: min(303px, 100%);
  margin: 0 auto;
}

.gameContainer.break-round::before,
.gameContainer.no-login::before,
.iframe-game-container.break-round::before,
.iframe-game-container.no-login::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--surface-blur);
  z-index: 1;
  border-radius: 6px;
}

.mobile .microdiv3 {
  margin: 0;
}

ul.winners-history__winners-ul {
}
ul.winners-history__winners-ul {
  display: grid;
  row-gap: 2px;
}
li.winners-history__winner {
  display: grid;
  grid-template-columns: 0.7fr 2fr;
  align-items: center;
  border-radius: 10px;
  background: var(--surface-disabled);
  padding: 10px 14px;
  column-gap: 12px;
}

.winners-history__winner-place {
}

.winners-history__winner-place > img {
  width: 100%;
  height: auto;
  display: block;
}

.winners-history__winner-info {
  display: grid;
  grid-auto-flow: column;
  z-index: 1;
}

.winners-history__winner-info-left {
  display: grid;
  row-gap: 3px;
}

.winners-history__winner-info-right {
  align-self: end;
  justify-self: end;
}

span.winners-history__winner-info-award {
  color: var(--Text-Primary, #e6f1ff);
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.2px;
  grid-column: 1 / 3;
  grid-row: 1 / 2;
}

span.winners-history__winner-info-userId,
span.winners-history__winner-info-user-bet {
  color: var(--secondary-text);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.2px;
  grid-column: 1 / 2;
  grid-row: 2 / 3;
}

span.winners-history__winner-info-user-bet {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
  justify-self: end;
}
h2.winners-history__title {
  color: #e6f1ff;
  font-family: "PBCasino";
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px; /* 120% */
  letter-spacing: 0.2px;
  text-align: center;
  border-bottom: 2px solid #e6f1ff33;
  padding: 0 0 10px 0;
  margin-bottom: 19px;
}

h3.winners-history__date {
  color: var(--primary-text);
  font-family: "PBCasino";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 6px;
}
li.winners-history__winner.winners-history--first-place {
  background: linear-gradient(101deg, rgba(56, 138, 242, 0.62) -0.64%, rgba(18, 244, 226, 0.62) 112.17%);
}
li.winners-history__winner.winners-history--first-place {
  background: linear-gradient(101deg, rgba(56, 138, 242, 0.62) -0.64%, rgba(18, 244, 226, 0.62) 112.17%);
  position: relative;
  z-index: 0;
}

li.winners-history__winner.winners-history--first-place::before {
  content: "";
  position: absolute;
  background-image: url(/images/buy-bonus-assets/ranking.png);
  background-repeat: no-repeat;
  background-size: cover;
  width: 50px;
  height: 60px;
  top: 50%;
  right: -10px;
  z-index: 0;
  transform: translateY(-50%) rotate(15deg);
}
.rankingList__title {
  width: inherit;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 0 19px;
}

.rankingList__title span {
  color: var(--secondary-text);
  font-family: "PBCasino";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

p.winners-history__empty {
  text-align: center;
}
section.winners-history {
  display: grid;
  row-gap: 10px;
  padding: 0 10px 0 0;
}
article.winners-history__winners {
  overflow: hidden;
}