@font-face {
  font-family: "PBSport";
  src: url("/css/fonts/Sport/PBSport-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}

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

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

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

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

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

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

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

.mobile [data-content="loyalty-program"] .framedcontent {
  padding: 24px 0px 3px 0px;
}

.loyaltyProgramContainer {
  width: 100%;
  max-width: 970px;
  height: 100%;
  margin: 0px auto;
  display: flex;
  flex-direction: row;
  background-color: #242934;
  border-radius: 10px;
  font-family: "Roboto", sans-serif;
  position: relative;
}

body.desktop .loyaltyProgramContainer {
  overflow: auto;
  overflow-x: hidden;
}

.loyaltyProgramContainer .loyaltyPointsContainer {
  width: 42%;
  height: auto;
  background-color: #1d212a;
  border-radius: 10px 0 0 10px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left;
  display: flex;
  flex-direction: column;
}

.loyaltyPointsContainer {
  margin-bottom: 5px !important;
}

.desktop .loyaltyProgramContainer .loyaltyPointsContainer {
  background-image: url(/images/club-rewards/lambo-background-desktop-interact.png?v=04);
}

.stage-circle {
  height: 100%;
  text-align: center;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

.userLevelInfo {
  display: grid;
  border-top: 1px solid rgba(230, 241, 255, 0.12);
  margin: 22px 11px 12px 16px;
  gap: 10px;
  padding-top: 10px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .stage-circle #circle {
  transform: rotate(151deg) translate(0%, 0%);
  width: 142px;
  height: 150px;
}

.voucherInfo {
  font-size: 70px;
  color: #e6f1ff;
  font-weight: bold;
  height: inherit;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.mobile .voucherInfo {
  justify-content: center;
  margin-top: 25px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .awardList > div {
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
  align-items: center;
  flex: 1 1 120px;
  width: 120px;
  box-sizing: border-box;
}

body.mobile .loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .awardList > div {
  margin-bottom: 20px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .awardList > div img {
  width: 40px;
  height: 40px;
  flex: 1;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .awardList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: flex-start;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .stage-circle .voucherInfo > p {
  margin: 0px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .stage-circle .voucherInfo > h4 {
  font-size: 25px;
  line-height: 24px;
  color: #e4edf8;
  margin: -4px 0 0 0;
  font-weight: bold;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .stage-circle .voucherInfo > span {
  font-size: 14px;
  line-height: 18px;
  color: #e6f1ff8f;
  display: block;
  margin-top: 9px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .vipIcon {
  margin-top: 15px;
}

body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .vipIcon {
  margin-top: 0px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .vipIcon div {
  width: 195px;
  height: 21px;
  background: #001f43fd 0% 0% no-repeat padding-box;
  filter: blur(4px);
  margin: 10px auto 0;
  opacity: 10%;
  border-radius: 50%;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .shadow {
  width: 264px;
  height: 21px;
  background: #001f43fd 0% 0% no-repeat padding-box;
  filter: blur(4px);
  margin: 0px auto 0;
  opacity: 10%;
  border-radius: 50%;
}

.menager-contact > div > a {
  display: flex;
  border-radius: 10px;
  background-color: #1f232d;
  padding: 13px 20px;
  margin: 4px 30px;
  height: 75px;
}

.menager-contact .menager-info {
  display: flex;
  flex-direction: column;
  margin-left: 18px;
}

.menager-contact .menager-info h3 {
  margin: 0;
  color: #e4edf8;
  font-size: 18px;
  text-align: left;
}

.bonuses .menager-contact .menager-info p {
  margin: 5px 0 0;
  color: #e3ecf8cc;
  font-size: 12px;
  margin: 0 14px 17px 0;
  text-align: left;
}

.bonuses .footer-info {
  font-size: 12px;
  text-align: left;
  margin: 20px 45px 0;
  color: #e6f1ffb3;
}

.bonuses .footer-info a {
  font-size: 12px;
  color: #1d97ff;
}

.loyaltyProgramContainer .howToIncreaseLevel .increaseLevel > div:nth-child(even) {
  background: #e6f1ff05;
}

.loyaltyProgramContainer .howToIncreaseLevel .increaseLevel > div:nth-child(odd) {
  background: transparent;
}

.loyaltyProgramContainer .transferConteiner .selectedVouchers > div .freerounds {
  position: unset;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader {
  height: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .logo {
  margin: 0 10px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .logo img {
  width: 60px;
  height: auto;
  margin-top: 0px;
  margin-left: -7px;
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .logo img {
  width: 60px;
  height: auto;
}

/* 
body.mobile .loyaltyHeader .levelInfo span.infoTitle,
body.mobile .loyaltyProgramContainer.vipProgram .loyaltyPointsContainer .loyaltyHeader .level .loyaltyLevel,
body.desktop .loyaltyHeader .levelInfo span.infoTitle {
  font-size: 12px;
  color: #e6edf799;
  font-weight: 500;
  line-height: 20px;
} */

body.mobile .loyaltyHeader .levelInfo .nextLevel,
body.desktop .loyaltyHeader .levelInfo .nextLevel {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

/* body.desktop .loyaltyHeader .levelInfo .nextLevel {
  margin-top: 14px;
} */

body.desktop .loyaltyHeader .levelInfo .nextLevel > div {
  width: 100%;
}

body.desktop .loyaltyHeader .levelInfo .nextLeve {
  margin-top: 26px;
}

body.desktop .loyaltyHeader .levelInfo .nextLeve > div {
  width: 60%;
}

body.mobile .levelInfo {
  gap: 4px;
  padding: 12px 15px;
}

body.mobile .level {
  padding: 12px 20px;
  gap: 4px;
  height: auto;
}

body.mobile .loyaltyLevelInfo .level {
  padding: 12px 0;
}

.rightContainer .level {
  all: unset;
  display: flex;
  flex-direction: column;
}

.level {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  width: 50%;
  background: #0000004d;
  padding: 14px 0 16px 24px;
  gap: 8px;
}

body.desktop .rightContainer .level {
  padding-top: 27px;
}

/* body.desktop .level::after {
  content: " ";
  position: absolute;
  border-left: 1px solid rgba(230, 241, 255, 0.12);
  top: 13px;
  right: 0px;
  height: 59px;
} */

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .userLevel,
.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .nextUserLevel {
  color: #e6f1ff;
}

.userLevel,
.nextUserLevel {
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.15px;
}

.userLevel__info-footer-title-level,
.userLevel__info-footer-title {
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.13px;
  color: var(--primary-text);
}

.userLevel__info-level {
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  letter-spacing: 0.2px;
}

.userLevel__info-footer-title-main-text {
  color: var(--secondary-text);
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0.2px;
  text-align: left;
  padding: 0;
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .userLevel,
body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .userLevel,
body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .nextUserLevel,
body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .nextUserLevel {
  margin-top: 8px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .loyaltyLevel {
  /* font-size: 14px; */
  /* color: #e6edf799; */
  /* line-height: 20px; */
  /* margin-bottom: 1px; */
  /* font-weight: 500; */
}

.loyaltyLevel,
.infoTitle {
  color: var(--secondary-text);
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0.15px;
  min-width: 160px;
}

.loyaltyProgramContainer .userLevel {
  text-transform: capitalize;
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .loyaltyLevel,
body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .level .loyaltyLevel {
  /* font-size: 12px; */
}

body.mobile .loyaltyProgramContainer.vipProgram .userVouchers .voucherInfo .voucherSlider .fill-voucherSlider,
body.desktop .loyaltyProgramContainer.vipProgram .userVouchers .voucherInfo .voucherSlider .fill-voucherSlider {
  background: #e6f1ff 0% 0% no-repeat padding-box;
}

.levelInfo {
  display: flex;
  flex-direction: column;
  width: 50%;
  justify-content: flex-end;
  padding: 14px 20px 16px 24px;
  background: #0000004d;
  gap: 8px;
}

.level-info-rules {
  justify-self: center;
  align-items: center;
  background-color: unset;
  width: unset;
  padding: unset;
  box-shadow: black;
}

.level-info-rules__text {
  color: var(--primary-text);
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0.1px;
}

/* .body.mobile .userLevel,
.nextUserLevel {
  font-size: 20px;
} */

body.mobile .loyaltyPointsContainer .userVouchers .stage-circle .voucherInfo .levelInfo {
  display: flex;
  justify-content: space-between;
  padding: 0;
  margin: 20px 0 0;
}

.close {
  cursor: pointer;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .increaseLevel {
  font-size: 12px;
  color: #e6edf799;
  margin-bottom: 8px;
  font-weight: 500;
  cursor: pointer;
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .increaseLevel,
body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .increaseLevel {
  font-size: 10px;
  text-decoration: underline;
  color: #e6edf7;
  margin-bottom: 5px;
}

/* .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .userPoints {
  font-size: 12px;
  color: #e4edf8;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 3px;
} */

/* 
body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .userPoints,
body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .userPoints {
  font-size: 10px;
  color: #e4edf8;
  line-height: 12px;
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1px;
} */

.userPoints {
  font-family: Roboto;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  color: var(--primary-text);
  display: flex;
  justify-content: flex-end;
  padding-bottom: 2px;
}

.loyaltyProgramContainer .tab2 span {
  text-align: center;
  font-size: 14px;
  display: block;
  margin-top: 8px;
  color: #e6edf7cc;
  font-weight: 500;
}

.loyaltyProgramContainer .tab2 div.active span {
  color: #e6edf7;
  opacity: 100%;
}

.loyaltyProgramContainer .tab2 div.active {
  border-bottom: 3px solid #0074fa;
}

.loyaltyProgramContainer .tab2 div {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 10px 16px;
  transition: 0.3s;
  font-size: 14px;
  width: 50%;
  text-align: center;
  border-bottom: 2px solid #e6f1ff1a;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .slider {
  width: 94%;
  height: 5px;
  border-radius: 5px;
  background-color: #e6f1ff1a;
  margin-left: 7px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .levelInfo2 .slider {
  width: 100%;
  height: 5px;
  border-radius: 5px;
  background-color: #e6f1ff1a;
}

.loyaltyProgramContainer .loyaltyPointsContainer .levelInfo2 {
  background: #15171d80 0% 0% no-repeat padding-box;
}

.loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .slider .fill-slider {
  height: 5px;
  border-radius: 5px;
  background-color: #1d97fb;
  max-width: 100%;
}

.loyaltyProgramContainer .loyaltyPointsContainer .levelInfo2 .slider .fill-slider {
  height: 5px;
  border-radius: 5px;
  background-color: #1d97fb;
  max-width: 100%;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* padding: 20px 6px; */
  text-align: center;
  flex-grow: 1;
}

.loyaltyProgramContainer.vipProgram .loyaltyPointsContainer .userVouchers {
  background-image: none;
}

div[onclick="openBigWithdraw()"] p {
  padding: 0 3px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .userLevelInfo .moreInfo {
  color: #1d97ff;
  font-size: 12px;
  cursor: pointer;
}

.loyaltyProgramContainer .rightContainer {
  width: 58%;
  /* height: 100%; */
  background-color: #242934;
  border-radius: 0px 10px 10px;
  display: flex;
  flex-direction: column;
}

#loyalty-program-container {
  height: auto;
  overflow-x: hidden;
}

/* .loyaltyProgramContainer .rightContainer .vip .benefitsContainer {
  display: flex;
  justify-content: space-between;
  width: auto;
  margin: 0 16px;
} */

body.mobile .loyaltyProgramContainer .rightContainer .vip .benefitsContainer {
  flex-direction: column;
  margin: 15px 8px 0px;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit {
  width: 240px;
  height: 180px;
  border-radius: 10px;
  background: #e6f1ff0d 0% 0% no-repeat padding-box;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitHeader {
  display: flex;
  justify-content: flex-end;
  padding: 7px 7px 0 0;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitHeader img {
  width: 11px;
  height: 11px;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitHeader span {
  font-size: 10px;
  line-height: 12px;
  margin-right: 6px;
  color: #e6edf7;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitInfo {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px 0 8px;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitInfo img {
  width: 52px;
  height: 57px;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitInfo h3 {
  margin: 14px 0 10px;
  font-size: 14px;
  color: #e6f1ff;
  font-weight: bold;
  line-height: 16px;
  text-align: center;
}

.loyaltyProgramContainer .rightContainer .vip .benefitsContainer .benefit .benefitInfo p {
  margin: 0 25px;
  font-size: 12px;
  color: #e6f1ffb3;
  font-weight: 500;
}

.loyaltyProgramContainer .rightContainer .rightHeader {
  align-items: center;
  padding: 9px 9px 0 0;
  justify-content: space-between;
  display: flex;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo {
  text-align: center;
  padding: 20px 30px 30px;
  display: flex;
  flex-direction: column;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .liyaltyLevelHeader {
  font-size: 16px;
  color: #e6edf7;
  margin-bottom: 20px;
  font-weight: 500;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo ul {
  display: grid;
  grid-auto-flow: column;
  column-gap: 5px;
  justify-content: space-between;
  overflow: auto;
  margin: 0 -30px;
  padding-bottom: 5px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo ul li.activ {
  background-color: #e6f1ff;
  box-shadow: 0px 0px 6px #00c2ff;
  color: #232833;
  font-size: 12px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .levelMoreInfo p {
  font-size: 12px;
  color: #e6f1ff99;
  text-align: left;
  margin-top: 30px;
  margin-bottom: 41px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .levelMoreInfo .levelPrize h3 {
  font-size: 16px;
  color: #e6edf7;
  font-weight: bold;
  margin-bottom: 21px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .levelMoreInfo .levelPrize > div {
  display: flex;
  justify-content: center;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .levelMoreInfo .levelPrize > div div {
  display: flex;
  flex-direction: column;
  width: 78px;
  height: 78px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo span.award {
  font-size: 20px;
  color: #e4edf8;
  font-weight: bold;
}

.loyaltyProgramContainer .howToIncreaseLevel {
  text-align: center;
  padding: 1px 0px 30px;
}

.loyaltyProgramContainer .howToIncreaseLevel h4 {
  font-size: 16px;
  color: #e6edf7;
  font-weight: 500;
  margin-top: 42px;
}

.loyaltyProgramContainer .howToIncreaseLevel > span {
  font-size: 12px;
  color: #e6f1ff99;
  display: block;
  margin-bottom: 40px;
}

.loyaltyProgramContainer .howToIncreaseLevel .increaseLevel .header {
  display: flex;
  justify-content: space-between;
  height: 37px;
  align-items: center;
  padding: 0 27px;
}

.loyaltyProgramContainer .howToIncreaseLevel .increaseLevel > div {
  display: flex;
  justify-content: space-between;
  height: 37px;
  align-items: center;
  padding: 0 27px;
}

.loyaltyProgramContainer .rightContainer .howToIncreaseLevel .increaseLevel .header span {
  font-size: 12px;
  color: #e6f1ff;
  font-weight: bold;
}

.loyaltyProgramContainer .howToIncreaseLevel .increaseLevel span.prize {
  text-align: left;
  width: 130px;
  color: #e6edf7e6;
  font-weight: 500;
}

.loyaltyProgramContainer .howToIncreaseLevel .increaseLevel span {
  font-size: 14px;
  color: #e6edf799;
  font-weight: 500;
}

.loyaltyProgramContainer .transferConteiner,
.loyaltyProgramContainer .vip {
  padding: 0px 32px 0px;
  display: grid;
}

body.desktop .loyaltyProgramContainer .transferConteiner,
body.desktop .loyaltyProgramContainer .vip {
  margin: 0px 16px 0px;
  padding: 0px 10px 0px;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: scroll;
  height: 600px;
}

body.desktop .loyaltyProgramContainer.campaign .transferConteiner,
body.desktop .loyaltyProgramContainer.campaign .vip {
  height: 633px;
}

body.desktop .loyaltyProgramContainer .transferConteiner::-webkit-scrollbar,
body.desktop .loyaltyProgramContainer .vip::-webkit-scrollbar,
body.desktop .loyaltyProgramContainer .loyaltyLevelInfo .level::-webkit-scrollbar {
  width: 4px;
}

body.desktop .loyaltyProgramContainer .transferConteiner::-webkit-scrollbar-track,
body.desktop .loyaltyProgramContainer .vip::-webkit-scrollbar-track {
  margin-top: 30px;
  margin-bottom: 10px;
  background: none;
}

body.desktop .loyaltyProgramContainer .loyaltyLevelInfo .level::-webkit-scrollbar-track {
  margin-top: 10px;
  margin-bottom: 10px;
  background: none;
}

body.desktop .loyaltyProgramContainer .transferConteiner::-webkit-scrollbar-thumb,
body.desktop .loyaltyProgramContainer .vip::-webkit-scrollbar-thumb,
body.desktop .loyaltyProgramContainer .loyaltyLevelInfo .level::-webkit-scrollbar-thumb {
  background: var(--action-disabled);
  border-radius: 24px;
  background-clip: padding-box;
}

body.desktop .loyaltyProgramContainer .loyaltyLevelInfo {
  padding-right: 14px;
  padding-bottom: 0;
}

body.desktop .loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .liyaltyLevelMenu {
  margin: 0px -6px 0px -20px;
}

body.desktop .loyaltyProgramContainer .loyaltyLevelInfo .level {
  overflow-x: hidden;
  overflow-y: scroll;
  height: 440px;
  padding-right: 16px;
}

.loyaltyProgramContainer h4 {
  margin: 0 0px 8px 48px;
  color: var(--secondary-text);
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 200% */
  letter-spacing: 0.15px;
}

body.mobile .loyaltyProgramContainer .vip .bonus_points_to_extended_play > h4.non-desktop {
  margin: 17px 0 17px 20px;
}

.loyaltyProgramContainer .transferConteiner h4,
.loyaltyProgramContainer .vip h4 {
  margin-left: 0;
}

.loyaltyProgramContainer .bonus_points_to_extended_play {
  /* margin-bottom: 45px; */
}

body.mobile .loyaltyProgramContainer .vip .bonus_points_to_extended_play {
  margin: 0 9px;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .buttonGroup {
  width: auto;
  display: flex;
}

body.mobile .loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers {
  padding: 20px 4px 7px 0px;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers {
  display: flex;
  justify-content: space-between;
  padding: 12px;
  align-items: center;
  border-top: 1px solid var(--surface-disabled);
}

.mobile .loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers .infoGroup {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 10px;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers .infoGroup {
  display: flex;
  align-items: center;
  flex-grow: 1;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers .infoGroup img {
  width: 36px;
  margin: 0;
}

.desktop .loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers .infoGroup img {
  margin-right: 15px;
}

body.mobile .loyaltyProgramContainer .bonus_points_to_extended_play .setVouchers .infoGroup img {
  width: 36px;
}

body.mobile .userVouchers .voucherInfo .voucherSlider,
body.desktop .userVouchers .voucherInfo .voucherSlider {
  width: 201px;
  height: 5px;
  text-align: center;
  background: #e6f1ff26 0% 0% no-repeat padding-box;
  border-radius: 5px;
  margin: 10px auto;
}

body.mobile .userVouchers .voucherInfo .voucherSlider .fill-voucherSlider,
body.desktop .userVouchers .voucherInfo .voucherSlider .fill-voucherSlider {
  max-width: 100%;
  background: #1d97ff 0% 0% no-repeat padding-box;
  border-radius: 5px;
  height: 5px;
}

.buttons {
  color: var(--primary-text);
  text-align: center;
  font-size: 20px;
  width: 36px;
  padding: 6px 12px 8px 13px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Roboto;
  letter-spacing: 0.2px;
  line-height: 24px;
  border-radius: 0px 6px 6px 0px;
  background: #343944;
}

.buttons[data-type="dec"] {
  border-radius: 6px 0px 0px 6px;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .buttons[data-type="dec"] {
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

body.desktop .buttonActiv.VIP {
  padding: 0 25px;
}

body.desktop .buttonActiv.Silver,
body.desktop .buttonActiv.Gold {
  padding: 0 20px;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .normalButton {
  color: var(--primary-text);
  background: #343944;
}

.loyalty-lottery-card__active-btn {
  background: rgba(51, 61, 82, 0.75);
}

.loyaltyProgramContainer .bonus_points_to_extended_play .inActButton {
  background-color: #2a2f3a;
  color: #e4edf833;
  cursor: not-allowed;
  pointer-events: none;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .buttonGroup .result {
  /* width: 40px; */
  width: 1ch;
  min-width: 40px;
  max-width: 150px;
  height: 37px;
  font-size: 20px;
  letter-spacing: 1px;
  background-color: #11131dcc;
  color: #ffffff;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: auto;
  /* pointer-events: none; */
}

.input-element.tmp-element {
  position: absolute;
  visibility: hidden;
  white-space: pre;
  font-family: inherit;
  /* Match input font with span */
  font-size: inherit;
  /* Match input font size with span */
}

.loyaltyProgramContainer .transferConteiner .selectedVouchers > div,
.loyaltyProgramContainer .vip .selectedVouchers > div {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 8px;
}

.loyaltyProgramContainer .loyaltyFooter {
  width: 100%;
  background-color: #e6f1ff05;
  display: flex;
  justify-content: space-between;
  padding: 20px 42px 13px 22px;
  align-items: center;
  border-radius: 0px 0px 10px 0px;
}

.loyaltyProgramContainer .ticket-history .loyaltyFooter {
  padding: 0px;
}

.loyaltyProgramContainer .ticket-history .loyaltyFooter .betContainer {
  margin-left: 0px;
  margin-right: 0px;
  width: 100%;
}

.loyaltyProgramContainer .betContainer {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  padding-left: 15px;
  column-gap: 15px;

  background: #e6f1ff05;
  margin-left: -30px;
  margin-right: -30px;
  width: calc(100% + 60px);
  padding: 20px 20px 13px;
}

.loyaltyProgramContainer .transferConteiner .betContainer,
.loyaltyProgramContainer .vip .betContainer {
  margin-left: 0;
  margin-right: 0;
  width: 100%;
}

.loyaltyProgramContainer .betContainer .transfer {
  width: 152px;
}

.points-container {
  display: grid;
  grid-auto-flow: column;
  width: max-content;
  column-gap: 15px;
}

.middle-container-footer {
  height: 1px;
  background-color: rgba(230, 241, 255, 0.12);
}

/* >> not working - wrong path*/
.loyaltyProgramContainer .betContainer .transferResult {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  grid-column: 1 / -1;
}

.loyaltyProgramContainer .betContainer .successInfo img {
  width: 36px;
  height: 36px;
  margin-right: 10px;
}

.loyaltyProgramContainer .betContainer .successText h4 {
  font-size: 20px;
  font-weight: bold;
  color: #e6f1ff;
  margin: 0;
  line-height: 20px;
}

.loyaltyProgramContainer .betContainer .successText span {
  font-size: 12px;
  color: #e6edf799;
}

/* << not working - wrong path*/

/* >> new path*/
.loyaltyProgramContainer .transferResult {
  width: 100%;
  display: flex;
  /* flex-direction: column; */
  justify-content: space-between;
  align-items: center;
  /* grid-column: 1 / -1; */
  padding: 0 20px;
}

.mobile .loyaltyProgramContainer .transferResult {
  flex-direction: column;
}

.loyaltyProgramContainer .transferResult .successInfo {
  display: flex;
  align-items: center;
  justify-content: center;
}

.loyaltyProgramContainer .transferResult .successInfo img {
  width: 40px;
  height: auto;
  margin: 20px 0;
}

.loyaltyProgramContainer .transferResult .successText {
  text-align: center;
}

.loyaltyProgramContainer .transferResult .successText h4 {
  font-size: 20px;
  font-weight: bold;
  color: #e6f1ff;
  margin: 0 0 8px;
  line-height: 20px;
}

.loyaltyProgramContainer .transferResult .successText span {
  font-size: 12px;
  color: #e6edf799;
}

/* << new path*/

[player-level="VIP"] .loyalty-program-list .transferResult {
  display: grid;
  grid-auto-flow: column;
  width: 100%;
  align-items: center;
  padding: 0 10px;
}

[player-level="VIP"] .loyalty-program-list .successInfo img {
  display: block;
  width: 36px;
  height: 36px;
}

[player-level="VIP"] .loyalty-program-list .successText h4 {
  font-size: 20px;
  font-weight: bold;
  color: #e6f1ff;
  margin: 0;
  line-height: 20px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .increaseLevel {
  color: #1d97ff;
  font-size: 12px;
  cursor: pointer;
}

.vip .successText span {
  font-size: 12px;
  color: #e6edf799;
}

.loyaltyProgramContainer .rightContainer .level p {
  font-size: 12px;
  text-align: center;
  margin-top: 10px;
  color: #e6f1ff99;
  height: 50px;
  padding: 0;
}

.loyaltyProgramContainer .rightContainer .level h3 {
  font-weight: bold;
  font-size: 16px;
  color: #e6edf7;
  margin-top: 38px;
}

.loyaltyFooter .vipFooter div span.totalVouchers {
  color: #e6f1ff;
  font-size: 16px;
}

.loyaltyProgramContainer .rightContainer .headerVipBack {
  align-items: center;
  display: flex;
  width: 99px;
  justify-content: space-evenly;
  height: 32px;
  border-radius: 17px;
  background: #ffffff 0% 0% no-repeat padding-box;
  color: #232833cc;
  font-size: 12px;
  font-weight: 500;
  margin-left: 25px;
  cursor: pointer;
}

.loyaltyProgramContainer .rightContainer .headerVipBack img {
  width: 7px;
}

.loyaltyProgramContainer .button.inActiv {
  box-shadow: 0px 3px 1.5px 0px rgba(0, 0, 0, 0.35);
  text-align: center;
  pointer-events: none;
}

.loyaltyProgramContainer .button.activ {
  background-color: #0074fa !important;
  color: var(--primary-text) !important;
}

.loyaltyProgramContainer .back {
  float: right;
  cursor: pointer;
}

.loyaltyProgramContainer .loyaltyFooter .backContainer {
  width: 100%;
}

.infoGroupVouchers {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

span.infoGroupVouchersCount.coucherCount {
  color: var(--primary-text);
  text-align: left;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.13px;
}

.loyaltyProgramContainer span.infoGroupVouchersText {
  color: var(--secondary-text);
  font-family: Roboto;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  /* 240% */
  letter-spacing: 0.15px;
}

.vip-bonuses {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  align-items: center;
  justify-content: center;
  grid-template-rows: 1fr 1fr;
  /* padding: 0 8px; */
  /* width: 100%; */
}

body.mobile .vip-images {
  display: flex;
  margin: 10px;
}

body.mobile .vip-images img {
  width: 67px;
  height: 67px;
}

body.mobile .vip .bonus-info {
  margin: 9px 0px;
  width: 71%;
}

body.mobile .benefitsContainer .bonus-info {
  margin: auto auto;
}

body.mobile .bonus-info h5 {
  margin: 0;
  color: #e4edf8;
  font-size: 14px;
  text-align: left;
}

body.mobile .bonus-info p {
  font-size: 10px;
  text-align: left;
  color: #e4edf8;
  opacity: 90%;
  margin: 4px 0;
}

body.mobile .bonus-procent {
  display: flex;
  flex-direction: column;
  margin: 7px 8px 27px 0;
}

body.mobile .bonus-procent p {
  color: #e6f1ff;
  font-size: 20px;
  text-shadow: 0px 0px 6px #0077ff9b;
  font-weight: 900;
  font-style: italic;
  margin: 9px 0 0 0;
  text-align: center;
}

body.mobile .vip-bonuses-menu {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 97%;
  border-radius: 10px;
  background-color: #e6f1ff0d;
  margin: 0px auto 7px;
}

.vip-bonuses div {
  display: grid;
  align-items: center;
  justify-content: center;
  justify-items: center;
}

.vip-bonuses div:nth-child() .vip-bonuses div:nth-child(1) {
  grid-column: 1 / 2;
}

.vip-bonuses div:nth-child(2) {
  grid-column: 3 /4;
}

.vip-bonuses div:nth-child(3) {
  grid-column: 5 / 6;
}

.vip-bonuses div:nth-child(4) {
  grid-column: 2 / 3;
}

.vip-bonuses div:nth-child(5) {
  grid-column: 4 / 5;
}

.rightContainer .vip-bonuses-mobile div {
  grid-column: none;
  /* Reset grid-column property */
}

.rightContainer .vip-bonuses-mobile {
  display: flex;
}

.mobile .rightContainer .vip-bonuses-mobile {
  justify-content: space-evenly;
  margin-top: 10px;
}

.vipFooter .vouchers {
  font-size: 20px;
  font-weight: bold;
  color: #e4edf8;
  border: 4px solid #1d97ff;
  box-shadow: 0px 0px 6px #1d97ff;
  width: 37px;
  height: 37px;
  border-radius: 19px;
  align-items: center;
  text-align: center;
}

.rightContainer .loyaltyFooter .vipFooter .vouchers .userVouchersCount {
  font-size: 20px;
  font-weight: bold;
  color: #e4edf8;
  align-items: center;
  text-align: center;
}

.vip-bonuses-menu div .active_vip_bonus {
  display: flex;
  align-items: center;
}

.vip-bonuses-menu div .active_vip_bonus span {
  font-size: 10px;
  color: #e6edf7;
  line-height: 15px;
}

.vip-bonuses-menu div .active_vip_bonus img {
  width: 11px;
  height: 11px;
  margin: 0 0 0 10px;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .userLevelInfo .vip-bonuses div p {
  font-family: Roboto;
  font-size: 9px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.15px;
  color: var(--primary-text) !important;
  text-align: center;
  padding: 0;
}

.loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .userLevelInfo .vip-bonuses div img {
  display: block;
  width: 100%;
  max-width: 40px;
  height: auto;
}

.loyaltyProgramContainer .mobileHead {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 11px 20px;
}

.loyaltyProgramContainer .mobileHead span {
  font-size: 16px;
  color: #e6edf7;
}

.non-mobile {
  /* display: flex; */
  /* justify-content: center; */
}

.non-mobile__img-logo {
  width: auto;
  height: 30px;
  margin: 12px 0 13px 0px;
  padding-left: 20px;
}

.non-desktop__img-logo {
  width: auto;
  height: 40px;
}

.vip .bonuses {
  text-align: center;
  overflow: auto;
}

.vip .bonuses[program-type="bigBet"],
.vip .bonuses[program-type="fastWithdraw"] {
  margin-top: 80px;
}

body.desktop .vip .bonuses[program-type="bigBet"],
body.desktop .vip .bonuses[program-type="fastWithdraw"] {
  margin-top: 0px;
  padding-top: 90px;
}

.vip .bonuses::-webkit-scrollbar {
  width: 0px;
}

.loyaltyRules > div::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}

body.desktop .loyaltyRules {
  height: 100%;
}

.vip .bonuses p {
  font-size: 14px;
  text-align: left;
  color: #e4edf8b3;
  margin: 0 30px;
}

.vip .bonuses .vip-payment-info p {
  font-size: 14px;
  text-align: center;
  color: #e4edf8;
  margin: 0;
}

.vip .bonuses h4 {
  font-size: 18px;
  color: #e4edf8;
  font-weight: 500;
  margin: 0px 0px 10px 0px;
}

.loyaltyFooter .vipFooter {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}

.loyaltyFooter .vipFooter div h3 {
  margin: 0px;
  font-size: 20px;
  font-weight: bold;
  color: #e6f1ff;
  line-height: 24px;
}

.loyaltyFooter .vipFooter div span {
  font-size: 12px;
  line-height: 16px;
  color: #e6edf799;
}

.payment-content {
  grid-template-columns: repeat(2, 150px);
  display: grid;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  padding: 12px;
}

.payment-content .vip-payment {
  border-radius: 6px;
  background-color: #e6f1ff0d;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 10px 5px;
}

.payment-content .vip-payment .vip-payment-type p {
  font-size: 10px;
  margin: 0;
  /* opacity: 100%; */
  text-align: left;
  color: #e4edf8;
}

.payment-content .vip-payment:first-child .vip-payment-logo {
  /* margin: 28px auto 3px; */
}

.payment-content .vip-payment .vip-payment-logo {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  margin: 0px auto;
  align-items: center;
}

.payment-content .vip-payment:first-child .vip-payment-logo img {
  display: block;
  width: 64px;
  height: 31px;
}

.payment-content .vip-payment .vip-payment-logo img {
  display: block;
  width: 60px;
  height: 44px;
}

.payment-content .vip-payment .vip-payment-info {
  /* margin: 23px 6px; */
  /* padding-bottom: 23px; */
}

body.mobile .loyaltyProgramContainer.vipProgram .payment-content .vip-payment .vip-payment-info p {
  padding: 0;
}

.payment-content .vip-payment .vip-payment-info span {
  font-size: 10px;
  display: block;
  text-align: center;
  color: var(--secondary-text);
}

body.mobile .loyaltyProgramContainer {
  flex-direction: column;
  width: 100%;
  height: 100%;
  margin: 0px auto 0px;
  background-color: #232833 0% 0% no-repeat padding-box;
  /* background-image: url(/images/club-rewards/lambo-background-desktop-interact.png); */
}

body.mobile .loyaltyProgramContainer.vip {
  flex-direction: column;
  width: 95%;
  height: 105%;
  margin: 0px auto 0px;
  background-color: #232833 0% 0% no-repeat padding-box;
}

body.mobile .loyaltyProgramContainer.vipProgram {
  height: 100%;
}

body.mobile .loyaltyProgramContainer .moreinfoAndRules {
  display: flex;
  justify-content: space-between;
  padding: 12px 25px 0px 24px;
}

body.desktop .loyaltyProgramContainer .moreinfoAndRules {
  display: flex;
  justify-content: space-between;
  padding: 8px 39px 0px 20px;
}

body.mobile .moreInfo,
body.mobile .increaseLevel {
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0.2px;
  color: var(--primary-text);
  cursor: pointer;
  text-decoration: none;
}

body.desktop .loyaltyProgramContainer .moreinfoAndRules .increaseLevel,
body.desktop .loyaltyProgramContainer .moreinfoAndRules .moreInfo {
  text-decoration: underline;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0.2px;
  text-decoration-line: underline;
  color: var(--primary-text);
  cursor: pointer;
}

body.mobile .loyaltyProgramContainer .moreinfoAndRules .rules,
body.desktop .loyaltyProgramContainer .moreinfoAndRules .rules {
  color: #ffffff99;
  font-size: 14px;
  font-weight: 500;
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer {
  width: 100%;
  background-color: #232833;
  height: max-content;
  border-radius: 10px 10px 0 0;
}

body .loyaltyProgramContainer[player-level="VIP"] .loyaltyPointsContainer {
  border-radius: 12px;
  background: url(/images/club-rewards/lambo-background-desktop-interact.png?v=04), linear-gradient(156deg, #013cdb 0%, #242934 100%);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left;
}

/* .desktop .loyaltyProgramContainer .loyaltyPointsContainer {
  background-image: url(/images/club-rewards/lambo-background-desktop-interact.png);
} */
body.mobile .loyaltyProgramContainer .rightContainer {
  width: auto;
  height: auto;
  margin-top: 0px;
  z-index: 2;
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .userLevelInfo {
  display: none;
}

body.mobile .rightContainer .rightHeader img {
  position: absolute;
  top: 75px;
  right: 20px;
}

body.mobile .loyaltyProgramContainer.vipProgram .transferConteiner .selectedVouchers,
body.mobile .loyaltyProgramContainer.vipProgram .vip .selectedVouchers {
  display: none;
}

body.mobile .loyaltyProgramContainer .transferConteiner h4,
body.mobile .loyaltyProgramContainer .vip h4 {
  margin: 16px 0 22px 0;
}

/* body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .userVouchers .rules {
  display: none;
} */

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .userVouchers,
body.mobile .loyaltyProgramContainer .loyalty-program-list .userVouchers {
  background-image: url(/images/club-rewards/lambo-background-desktop-interact.png?v=04);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 200px;
}

body.mobile .loyaltyProgramContainer .loyalty-program-list .userVouchers {
  margin: 0 -30px;
}

body.mobile .loyaltyProgramContainer.vipProgram .loyaltyPointsContainer .userVouchers {
  height: 100%;
}

body.mobile .loyaltyProgramContainer .transferConteiner,
body.mobile .loyaltyProgramContainer .vip {
  padding: 0px 20px;
}

body.mobile .loyaltyProgramContainer .bonus_points_to_extended_play {
  margin-bottom: 0px;
}

body.mobile .loyaltyProgramContainer.vipProgram .loyaltyFooter {
  width: 100%;
  background-color: transparent;
  padding: 50px 12px 15px;
}

body.mobile .loyaltyProgramContainer .loyaltyFooter {
  width: 100%;
  background-color: transparent;
  padding: 40px 20px 12px;
}

body.mobile .loyaltyProgramContainer.vipProgram .loyaltyFooter {
  width: 100%;
  background-color: transparent;
  padding: 0 12px 15px;
  position: relative;
  /* top: 30px; */
}

body.mobile .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader {
  align-items: normal;
}

body.mobile .loyaltyHeader {
  width: 100%;
  height: auto;
  gap: 2px;
}

body.mobile .betContainerMobile {
  width: 100%;
  display: flex;
  flex-direction: column;
  height: auto;
  border-top: 1px solid var(--surface-disabled);
  padding-top: 12px;
  margin-top: 12px;
}

body.mobile .ticket-history .betContainerMobile {
  border-top: none;
  margin-top: 0px;
}

body.mobile .betContainerMobile .voucherTypeAndCount {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  padding: 0 10px 0 7px;
}

body.mobile .loyaltyProgramContainer .loyaltyFooter .button {
  width: 100%;
  margin: 23px 0 20px 0;
}

body.mobile .loyaltyProgramContainer .loyaltyFooter .backContainer .button {
  width: 100%;
  margin: 0px 0 0px 0;
}

body.mobile .loyaltyProgramContainer .rightContainer .rightHeader {
  height: 0px;
  padding: 0;
}

body.mobile .loyaltyProgramContainer.vipProgram .rightContainer {
  /* height: 100%; */
  /* 535px; */
  /* overflow: hidden; */
}

body.mobile .loyaltyProgramContainer.vipProgram .loyaltyPointsContainer {
  border-radius: 10px 10px 0 0;
  /* height: 440px; */
  margin-bottom: 0px;
}

body.mobile .loyaltyProgramContainer.vipProgram .loyaltyPointsContainer .userVouchers .stage-circle .voucherInfo > span {
  color: #e8eef8cc;
}

/* body.mobile .loyaltyProgramContainer.vipProgram .loyalty-program-list {
  height: 416px;
} */

body.mobile .loyaltyProgramContainer .loyalty-program-list {
  height: 100%;
  overflow: hidden;
}

body.mobile .loyaltyProgramContainer.vipProgram .moreinfoAndRules .moreInfo,
body.mobile .loyaltyProgramContainer.vipProgram .moreinfoAndRules .increaseLevel,
body.desktop .loyaltyProgramContainer.vipProgram .moreinfoAndRules .increaseLevel,
body.desktop .loyaltyProgramContainer.vipProgram .moreinfoAndRules .moreInfo {
  color: #e6f1ff;
  cursor: pointer;
}

body.desktop .loyaltyProgramContainer.vipProgram .moreinfoAndRules .increaseLevel,
body.desktop .loyaltyProgramContainer.vipProgram .moreinfoAndRules .moreInfo {
  text-decoration: underline;
}

body.desktop .loyaltyProgramContainer .loyaltyPointsContainer .loyaltyHeader .levelInfo .rules {
  margin-right: -30px;
}

body.mobile .loyaltyProgramContainer.vipProgram .moreinfoAndRules .rules,
body.desktop .loyaltyProgramContainer.vipProgram .moreinfoAndRules .rules {
  color: #e6f1ff;
  text-decoration: underline;
  cursor: pointer;
}

body.mobile .loyaltyProgramContainer.vipProgram .mobileSuccess h3 {
  color: #e6f1ff;
  font-size: 20px;
  font-weight: 500;
  margin: 20px 0 0px;
}

body.mobile .loyaltyProgramContainer.vipProgram .mobileSuccess span {
  color: #e6edf799;
  font-size: 12px;
  font-weight: 500;
}

body.mobile .loyaltyProgramContainer.vipProgram .mobileSuccess .button.back {
  width: 319px;
  margin: 42px 9px 0px;
}

/* body.mobile .loyaltyProgramContainer.vipProgram .vip-bonuses {
  flex-wrap: wrap;
  justify-content: space-evenly;
} */

/* body.mobile .loyaltyProgramContainer.vipProgram .vip-bonuses>div {
  width: 46%;
  height: 50%;
  border-radius: 10px;
  background-color: #e6f1ff0d;
  margin: 6px 0px 4px;
  padding-top: 20px;
} */

body.mobile .loyaltyRules {
  height: 445px;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-bonuses img {
  width: 100%;
  height: auto;
  display: block;
  max-width: 60px;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-bonuses p {
  font-size: 12px;
  color: #e4edf8;
  font-weight: 500;
  margin: 5px 0 20px;
  display: none;
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses {
  text-align: center;
  /* height: 100%; */
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses[program-type="bigWithdraw"] {
  height: 315px;
  overflow: auto;
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses .menager-contact > div > a {
  background-color: #e6f1ff0d;
  margin: 4px 14px;
}

body.mobile .bonuses-big-withdraw {
  display: flex;
  justify-content: center;
}

body.mobile .bonuses__big-withdraw-img {
  display: block;
  height: 100%;
  width: auto;
  max-height: 70px;
}

.bonuses-big-withdraw-additional-info-text {
  color: var(--secondary-text);
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses h4 {
  color: var(--primary-text);
  text-align: center;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.15px;
  margin: 0;
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses p {
  color: var(--primary-text);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: 0.15px;
  padding: 10px 0px 16px 0px;
  margin: 0;
}

body.mobile .loyaltyProgramContainer .vipBenefitContent > div > div:nth-child(3) > p {
  padding: 20px;
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses .menager-contact .menager-info p {
  margin: 0 0 17px 0;
}

body.mobile .loyaltyProgramContainer.vipProgram .vipBenefit .bonuses .vip-payment-type p {
  padding: 4px 0 0 10px;
  margin: unset;
  font-family: Roboto;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  /* 240% */
  letter-spacing: 0.15px;
  color: var(--secondary-text);
}

body.mobile .loyaltyProgramContainer.vipProgram .bonuses .footer-info {
  font-weight: 500;
  margin: 20px 14px 30px 17px;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-benefit {
  display: flex;
  justify-content: space-evenly;
  margin: 10px 0 20px;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-benefit .vip-payment-info p {
  margin: 0 0px 0px;
  display: flex;
  justify-content: center;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-benefit div {
  /* width: 75px; */
  /* height: 75px; */
  border-radius: 10px;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-benefit div.selected {
  background-color: #e6f1ff1a;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-benefit div img {
  width: 60px;
  display: block;
}

body.mobile .loyaltyProgramContainer.vipProgram .vip-benefit div p {
  display: none;
}

.body.mobile .loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .liyaltyLevelMenu {
  padding: 4px 22px 4px 21px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .liyaltyLevelMenu {
  padding: 8px 12px 8px 12px;
  overflow: auto;
  margin: 0px -30px;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo ul > li {
  transition: none !important;
}

.loyaltyProgramContainer .rightContainer .loyaltyLevelInfo .liyaltyLevelMenu::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}

body.mobile .loyaltyProgramContainer .howToIncreaseLevel .increaseLevel span {
  font-size: 12px;
  display: block;
  width: 100%;
}

body.mobile .loyaltyProgramContainer .howToIncreaseLevel .increaseLevel > div {
  width: inherit;
  padding: 0 14px;
  text-align: left;
  display: grid;
  grid-auto-flow: column;
  column-gap: 10px;
}

body.mobile .loyaltyProgramContainer .howToIncreaseLevel .increaseLevel span.prize {
  display: flex;
  text-align: end;
}

body.mobile .loyaltyProgramContainer .howToIncreaseLevel > span {
  margin: 0 14px;
}

body.mobile .loyaltyProgramContainer .loyalty-program-list .button {
  width: 100%;
  margin: 18px auto 25px;
}

body.mobile .loyaltyProgramContainer .loyalty-program-list .howToIncreaseLevel .button {
  width: 90%;
  margin: 45px 5% 0;
}

#loyalty-program img.close {
  display: none;
}

.loyaltyRules {
  /* overflow: auto; */
  /* padding-bottom: 60px; */
}

/* body.desktop .loyaltyRules:after {
    position: absolute;
    top: 484px;
    height: 98px;
    width: 520px;
    content: "";
    background: linear-gradient(to top, #242934 3%, #2429341a 65% );
    pointer-events: none;
} */
.loyaltyRules .level {
  width: 100%;
  height: 37px;
  display: flex;
  justify-content: space-between;
  padding: 0 16px 0 18px;
  align-items: center;
}

.rules-container--active .level {
  flex-direction: row;
}

.loyaltyRules .odd {
  background: #e6f1ff05 0% 0% no-repeat padding-box;
}

.loyaltyRules .level span {
  width: 50%;
  font-size: 14px;
  color: #e6f1ffb3;
  font-weight: 500;
}

.loyaltyRules .howItWorks.level span {
  width: 78%;
  font-size: 12px;
  color: #e6f1ffb3;
  font-weight: 500;
}

.loyaltyRules .howItWorks.level span.prize {
  width: 48%;
}

.loyaltyRules .level.header span {
  color: #e6f1ffe6;
}

.loyaltyProgramContainer .bonus_points_to_extended_play .buttonGroup .result::-webkit-outer-spin-button,
.loyaltyProgramContainer .bonus_points_to_extended_play .buttonGroup .result::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.loyaltyRules span.title {
  font-size: 14px;
  color: #e6f1ffe6;
  font-weight: bold;
  padding: 0 18px;
  display: flex;
  margin-top: 32px;
}

.loyaltyRules h1 {
  font-size: 16px;
  font-weight: bold;
  color: #e6f1ff;
  text-align: center;
}

.loyaltyRules h4 {
  font-size: 14px;
  margin: 0px;
  font-weight: bold;
  color: #e6f1ffb3;
  padding: 0 18px;
}

.loyaltyRules p {
  font-size: 14px;
  color: #e6f1ffb3;
  padding: 0 18px;
}

.loyaltyRules .vouchersPrize {
  width: 100%;
  height: 37px;
  display: flex;
  justify-content: space-between;
  padding: 0 16px 0 18px;
  align-items: center;
}

.vouchersPrize span {
  width: 24%;
}

.loyaltyProgramContainer .buttonGroup input.result {
  margin: 0px;
  border: none;
  padding: 8px;
}

.loyaltyRules .vouchersPrize span {
  width: 24%;
}

@media screen and (max-width: 320px) {
  .infoTitle {
    font-size: 10px !important;
  }
}

@media screen and (max-width: 450px) {
  .loyaltyRules .level {
    width: auto;
  }
}

a.loyalty-href {
  font-size: 14px;
  color: var(--primary-main);
  text-decoration: underline;
}

.level-more-info-head {
  font-size: 16px;
  font-weight: 600;
  color: #e6edf7;
  line-height: 22px;
}

.paragraph-border {
  border-top: 1px solid rgba(230, 241, 255, 0.12);
  margin-top: 20px !important;
  padding-top: 20px !important;
}

.loyaltyProgramContainer .rightContainer {
  overflow: auto;
  overflow-x: hidden;
}

body.desktop .loyaltyProgramContainer .rightContainer.ticket-history {
  /* background-image: url(/images/lp/loyalty/lp-promo-history-background.png?=2); */
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
}

.ticket-history {
  width: 550px;
  border-radius: 10px;
  color: #e6f1ff;
  font-family: Roboto, sans-serif;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
  padding: 0;
  overflow: hidden;
}

.ticket-history .title {
  color: var(--Text-Primary, #e6f1ff);
  /* 🅷 Headline 4/Primary */
  font-family: Roboto;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 120% */
  letter-spacing: 0.2px;

  padding: 20px;
}

body.mobile .ticket-history .title {
  text-align: center;
}

#loyalty-program-container .ticket-history .ticket-history-items {
  padding: 0 20px;
  height: 510px;
  max-height: unset;
  overflow-x: hidden;
  overflow-y: scroll;
}

.ticket-history .ticket-history-items::-webkit-scrollbar {
  width: 0px;
}

.ticket-history .ticket-history-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid #e6f1ff1f;
}

.ticket-history .ticket-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;

  margin-bottom: 12px;
}

.ticket-history .ticket-details {
  display: flex;
  flex-direction: column;
}

.ticket-history .ticket-count {
  color: var(--Text-Primary, #e6f1ff);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 171.429% */
  letter-spacing: 0.3px;
}

.ticket-history .ticket-count .circle {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #4694ff80;
  display: inline-block;
  margin-right: 10px;
}

.ticket-history .ticket-numbers {
  color: var(--Text-Secondary, #e6f1ffb3);
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.15px;
}

.ticket-history .ticket-number-list {
  color: var(--Text-Primary, #e6f1ff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.15px;
}

.ticket-history .ticket-date {
  color: var(--Text-Secondary, #e6f1ffb3);
  /* 𝐁 Body 2/Primary */
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: 0.2px;
}

.ticket-history .levski-tickets-total-count {
  color: #00efe5;
  /* 🅷 Headline 5/Primary */
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  /* 137.5% */
  letter-spacing: 0.15px;
}

.ticket-history .no-tickets {
  color: var(--Text-Primary, #e6f1ff);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 171.429% */
  letter-spacing: 0.3px;

  padding-top: 20px;
  border-top: 1px solid #e6f1ff1f;
  width: 100%;
}

body.mobile .ticket-history {
  width: 100%;
  background-image: unset;
  background: unset;
}

body.mobile .go-to-lambo,
body.mobile .go-back-from-ticket-history {
  width: 100%;
}

body.mobile .ticket-history .voucherTypeAndCount p {
  margin: 0 auto 10px;
}

.ticket-buttons-wrapper {
  display: flex;
  margin: 5px;
  gap: 5px;
}

body.mobile .ticket-buttons-wrapper {
  display: flex;
  margin: 5px;
  gap: 5px;
}

#go-to-ticket-history {
  position: absolute;
  right: 20px;
  bottom: -40px;
}

body.mobile section.loyalty-lottery-wrapper {
  margin-bottom: 20px;
}

body.mobile .ticket-buttons-wrapper {
  display: flex;
  margin: 10px;
  gap: 10px;
}

body.mobile #go-to-ticket-history-done,
body.mobile #go-to-ticket-draw {
  width: 50%;
}

body.mobile #go-to-ticket-history {
  left: 50%;
  bottom: -105px;
  padding: 10px 22px;
  font-size: 16px;
  transform: translate(-50%, 0);
}

body.mobile #loyalty-program-container .ticket-history .ticket-history-items {
  height: 260px;
}

body.mobile .loyaltyProgramContainer .ticket-history .loyaltyFooter {
  padding: 0 20px 20px;
}

#loyalty-program-container .levski-promo .banner {
  position: relative;
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

#loyalty-program-container .levski-promo .banner .bacground-image {
  width: 100%;
}

#loyalty-program-container .levski-promo .banner .buttonGroup .buttons {
  background: #333d52bf;
}

#loyalty-program-container .levski-promo .banner .banner-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  gap: 6px;
  padding: 10px 16px;
}

body.mobile #loyalty-program-container .loyaltyLevelInfo .levski-promo .banner .banner-container {
  padding: 14px 20px 10%;
}

#loyalty-program-container .levski-promo .banner .banner-container .banner-left {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
}

body.mobile #loyalty-program-container .levski-promo .banner .banner-container .banner-left {
  gap: 2px;
}

#loyalty-program-container .levski-promo .banner .banner-container .banner-left .top {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#loyalty-program-container .levski-promo .banner .banner-container .banner-left .top .distant {
  margin-top: 8px;
  width: fit-content;
}

#loyalty-program-container .levski-promo .banner .banner-container .title {
  color: var(--Text-Primary, #e6f1ff);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  font-family: "PBSport";
  font-size: 14px;
  font-style: italic;
  font-weight: 400;
  line-height: 23px; /* 164.286% */
  letter-spacing: 0.122px;
  text-align: left;
  margin: 0;
  height: unset;
}

#loyalty-program-container .levski-promo .banner .banner-container .name {
  color: var(--Text-Primary, #e6f1ff);
  font-family: "PBSport";
  font-size: 18px;
  font-style: italic;
  font-weight: 900;
  line-height: 23px;
  letter-spacing: 0.122px;
  margin: 0;
  margin-top: -6px;
  text-align: left;
  height: unset;
}

#loyalty-program-container .levski-promo .banner .banner-container .condition {
  color: #ffb800;
  font-family: Roboto;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  line-height: 24px; /* 200% */
  letter-spacing: 0.15px;
  margin: 0;
  text-align: left;
  height: unset;
  margin-top: -4px;
}

#loyalty-program-container .levski-promo .banner .banner-container .condition-highlight {
  background: var(--Sport-3, linear-gradient(180deg, #fce982 0%, #d7a84a 100%));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#loyalty-program-container .levski-promo.victory_ticket .banner .banner-container .condition {
  color: var(--Text-Primary, #e6f1ff);
  font-family: Roboto;
  font-size: 16px;
  font-weight: 700;
  line-height: 130%;
}

#loyalty-program-container .levski-promo .banner .banner-container .description {
  color: var(--Text-Primary, #e6f1ff);
  font-family: Roboto;
  font-size: calc(2.5vw + 3px);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.2px;
  margin: 0;
  text-align: left;
  height: unset;
  max-width: 46%;
}

body.desktop #loyalty-program-container .levski-promo .banner .banner-container .description {
  font-size: 12px;
}

#loyalty-program-container .levski-promo .banner .banner-container .banner-left .bottom {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: min(16px, calc(20vw - 66px));
  height: fit-content;
}

body.desktop #loyalty-program-container .levski-promo .banner .banner-container .banner-left .bottom {
  gap: 8px;
}

#loyalty-program-container .levski-promo .banner .banner-container .exchange {
  width: 112px;
  margin: 0;
}

#loyalty-program-container .levski-promo .banner .banner-container .exchange .icon-refresh {
  animation: spin 2s linear infinite;
}

#loyalty-program-container .levski-promo .banner .banner-container .banner-right {
  display: flex;
  flex-direction: column;
}

#loyalty-program-container .levski-promo .banner .banner-container .my-tickets-number,
#loyalty-program-container .levski-promo .banner .banner-container .my-chance {
  color: var(--Text-Primary, #e6f1ff);
  text-align: right;
  font-family: Roboto;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px; /* 140% */
  letter-spacing: 0.2px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#loyalty-program-container .levski-promo .banner .banner-container .my-tickets-number .tickets-total-count,
#loyalty-program-container .levski-promo .banner .banner-container .my-chance .levski-chance {
  color: #ffb800;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.13px;
}

#loyalty-program-container .levski-promo .btn img.tire-1,
#loyalty-program-container .levski-promo .btn img.tire-2 {
  margin-inline: 1px;
  width: 10px;
  transform: translateY(1px);
  animation: tire-bounce 3200ms cubic-bezier(0.2, 0.8, 0.2, 1) infinite;
}

#loyalty-program-container .levski-promo .btn img.tire-2 {
  animation-delay: 1400ms;
}

@keyframes tire-bounce {
  /* idle */
  0%,
  45% {
    transform: translateY(1px) scale(1) rotate(0deg);
  }

  /* bounce */
  50% {
    transform: translateY(1px) scale(1.06, 0.94) rotate(-6deg);
  }
  60% {
    transform: translateY(-12px) scale(0.98, 1.02) rotate(8deg);
  }
  70% {
    transform: translateY(1px) scale(1.08, 0.92) rotate(-10deg);
  }
  78% {
    transform: translateY(-4px) scale(0.99, 1.01) rotate(6deg);
  }
  85% {
    transform: translateY(1px) scale(1.02, 0.98) rotate(-2deg);
  }

  /* rest */
  100% {
    transform: translateY(1px) scale(1) rotate(0deg);
  }
}

.desktop .loyaltyProgramContainer.campaign .loyaltyPointsContainer,
.loyaltyProgramContainer.campaign .userVouchers,
body.mobile .loyaltyProgramContainer.campaign .userVouchers,
body.mobile .loyaltyProgramContainer .loyalty-program-list.campaign .userVouchers,
body .loyaltyProgramContainer[player-level="VIP"].campaign .loyaltyPointsContainer {
  background-image: unset;
}

body.desktop .loyaltyProgramContainer[player-level="VIP"].campaign .loyaltyPointsContainer {
  background-color: #1d212a;
}

body.mobile .loyaltyProgramContainer.campaign .userVouchers {
  z-index: 0;
  margin-bottom: max(-60vw, -560px);
}

body.mobile .loyaltyProgramContainer.campaign .loyaltyLevelInfo .userVouchers {
  margin-bottom: max(-55vw, -550px);
}

body.mobile .loyaltyProgramContainer.campaign .userVouchers .voucherInfo .userVouchersContainer {
  margin-top: -45vw;
  position: unset;
  transform: none;
}

body.mobile .loyaltyProgramContainer.campaign .userVouchers .voucherInfo .level-info-rules {
  display: none;
}

.loyaltyProgramContainer.campaign .userVouchersCircle {
  position: relative;
}

body.desktop .loyaltyProgramContainer.campaign .userVouchersCircle {
  height: 300px !important;
  overflow: hidden;
}

.loyaltyProgramContainer.campaign .userVouchersCircle .background-gauge {
  width: 100%;
}

.loyaltyProgramContainer.campaign .userVouchersCircle .background-needle,
.loyaltyProgramContainer.campaign .userVouchersCircle .stage-circle {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 0;
}

.loyaltyProgramContainer.campaign .userVouchersCircle .stage-circle {
  z-index: 1;
  height: 100%;
}

.loyaltyProgramContainer.campaign .userVouchersCircle .background-needle {
  z-index: 2;
  animation:
    needle-settle 2000ms cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards,
    needle-idle 100ms linear 2000ms 15,
    needle-down 1000ms linear 3500ms forwards;
  will-change: transform;
  pointer-events: none;
}

@keyframes needle-settle {
  0% {
    transform: rotate(0deg);
  }

  20% {
    transform: rotate(45deg);
  }

  45% {
    transform: rotate(30deg);
  }

  100% {
    transform: rotate(145deg);
  }
}

@keyframes needle-idle {
  0%,
  100% {
    transform: rotate(145deg);
  }

  50%,
  35%,
  65% {
    transform: rotate(140deg);
  }
}

@keyframes needle-down {
  0% {
    transform: rotate(145deg);
  }

  20% {
    transform: rotate(150deg);
  }

  100% {
    transform: rotate(0deg);
  }
}
body.desktop .loyaltyProgramContainer.campaign .userVouchers .stage-circle .voucherInfo > p.userVouchersContainer,
.loyaltyProgramContainer.campaign .userVouchersCircle p.userVouchersContainer {
  flex-direction: column-reverse;
  gap: 0px;
  position: absolute;
  left: 50%;
  transform: translate(-50%);
  top: 135px;
}

.loyaltyProgramContainer.campaign p.userVouchersContainer span.userVouchersCountText {
  color: var(--Text-Primary, #e6f1ff);
  font-family: "PBSport";
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: unset;
  text-transform: uppercase;
}

.loyaltyProgramContainer.campaign .userVouchersCircle .userVouchersCount {
  background-image: url(/images/lp/loyalty/points-frame.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

  width: 130px;
  height: 38px;
  display: flex;
  gap: 8px;
  justify-content: center;
  align-items: center;
}

.loyaltyProgramContainer.campaign .userVouchersCircle .userVouchersCount span {
  color: #040e41;
  font-family: "PBSport";
  font-size: 18.941px;
  font-style: normal;
  font-weight: 700;
  line-height: 23.059px; /* 121.739% */
  letter-spacing: 0.618px;

  width: 10px;
}

.loyaltyProgramContainer.campaign .levski-promo .progress-container {
  margin: 12px auto 0;
  display: flex;
  gap: 12px;
  flex-direction: column;
}

body.desktop .loyaltyProgramContainer.campaign .levski-promo .progress-container {
  flex-direction: row-reverse;
  max-width: 425px;
}

.loyaltyProgramContainer.campaign .levski-promo.second,
.loyaltyProgramContainer.campaign .levski-promo.third {
  margin-top: 12px;
}

.loyaltyProgramContainer.campaign .levski-promo .lp-progress-details-wrapper {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: 0;
}

body.mobile .loyaltyProgramContainer.campaign .rightContainer {
  background-color: unset;
}

body.mobile .loyaltyProgramContainer.campaign h4.non-mobile {
  display: block !important;
}

body.mobile .loyaltyProgramContainer.campaign .bonus_points_to_extended_play:not(.promo) h4.non-desktop {
  display: none !important;
}

body.mobile .loyaltyProgramContainer.campaign .transferConteiner h4 {
  margin: 0 0 12px;
}

body.mobile .loyaltyProgramContainer.campaign .vip h4 {
  margin: 0 12px 12px;
}

/* === TICKETS CONTAINER start === */
.lp-tickests-container {
  width: 100%;
  max-width: 700px;
  grid-template-rows: 1fr;
  transition: grid-template-rows 0.3s ease-in-out;
  /* margin-top: -40px; */
  margin-bottom: 60px;
}

.lp-tickests-container.secondary {
  margin-top: -40px;
}

@media (max-width: 768px) {
  .lp-tickests-container {
    padding: 0 20px;
  }
}

.lp-tickets-content {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.lp-tickets-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  background: var(--surface-overlay);
  border-radius: 6px;
  padding: 16px;
  z-index: 1;
}

.lp-tickets-header-wrapper {
  cursor: pointer;
  display: grid;
  align-items: center;
  grid-template-columns: 65px 1fr 24px;
}

.lp-tickets-header-img {
  width: auto;
  height: 34px;
  display: flex;
}

.lp-tickets-header-img img {
  width: auto;
  height: 100%;
}

.lp-tickets-header-title-wrapper {
  text-align: left;
  padding-left: 16px;
  color: var(--primary-text);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.15px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.lp-tickets-header-title-participation {
  font-size: 14px;
}

.lp-tickets-header-title-participation span {
  color: #ffb800;
}

@media (max-width: 480px) {
  .lp-tickets-header-wrapper {
    grid-template-columns: 40px 1fr 14px;
  }

  .lp-tickets-header-img {
    height: 24px;
  }

  .lp-tickets-header-title-wrapper {
    padding-left: 8px;
    font-size: 14px;
  }

  .lp-tickets-header-title-participation {
    font-size: 12px;
  }
}

.lp-tickets-header-arrow {
  width: 14px;
  height: 14px;
  display: flex;
  transition: transform 0.3s ease-in-out;
}

.lp-tickets-header-arrow img {
  width: 100%;
  height: 100%;
}

.lp-tickets-wrapper.active .lp-tickets-header-arrow {
  transform: rotate(-180deg);
  transition: transform 0.3s ease-in-out;
}

.lp-tickets-list-wrapper {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease-in-out;
}

.lp-tickets-wrapper.active > .lp-tickets-list-wrapper {
  grid-template-rows: 1fr;
  transition: grid-template-rows 0.3s ease-in-out;
}

.lp-tickets-list-content .lp-ticket-row .lp-tickets-empty {
  display: none;
}

.lp-tickets-list-content .lp-ticket-row:first-child .lp-tickets-empty {
  width: 100%;
  height: 14px;
  display: block;
}

.lp-tickets-list-content {
  overflow: hidden;
  align-items: flex-start;
  text-align: left;
  color: var(--primary-text);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.3px;
}

/* .mini-aston-date {
  margin-top: 24px;
} */

.mini-aston-tickets {
  margin-top: 12px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.15px;
}

.lp-ticket-row .mini-aston-devider {
  width: 100%;
  height: 1px;
  margin: 16px 0;
  background: var(--surface-disabled);
}

.lp-ticket-row:last-child .mini-aston-devider {
  display: none;
}

/* === TICKETS CONTAINER end === */

/*=== USER LEVEL end === */

/* === PROGRESS start === */

:root {
  --pading-h: 12px;
  --pading-w: 18px;
}

#loyalty-program-container .levski-promo .lp-progress-car-wrapper {
  --margine-right: -4px;
  width: calc(18% - var(--margine-right));
  margin-top: -1px;
  margin-right: var(--margine-right);
  z-index: 3;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

#loyalty-program-container .levski-promo .lp-progress-car-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}

#loyalty-program-container .levski-promo .lp-progress-bar-wrapper {
  position: relative;
  width: 82%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#loyalty-program-container .levski-promo .lp-progress-bar {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  mask-image: url("/images/lp/path_mask_bg_desktop.png?v=1");
  mask-repeat: no-repeat;
  mask-position: center;
  /* mask-size: contain; */
  mask-size: 100%;
  --progress: 0%;
  background-image: linear-gradient(0deg, rgb(103, 103, 120) 20%, rgb(255, 255, 255) 50%, rgb(103, 103, 120) 80%);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: var(--progress) 100%;
}

#loyalty-program-container .levski-promo .lp-progress-bar-low {
  background-image: linear-gradient(180deg, rgb(23, 63, 255) 10%, rgb(255, 255, 255) 44%, rgb(23, 63, 255) 80%);
}

#loyalty-program-container .levski-promo .lp-progress-bar-high {
  background-image: linear-gradient(180deg, rgb(255, 184, 0) 10%, rgb(255, 255, 255) 44%, rgb(255, 184, 0) 80%);
}

#loyalty-program-container .levski-promo .lp-progress-path-border {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible !important;
  line-height: 0;
  width: 100%;
}

#loyalty-program-container .levski-promo .lp-progress-path-border > img {
  width: 100%;
  height: auto;
}

#loyalty-program-container .levski-promo .lp-progress-path-bg {
  position: absolute;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible !important;
  line-height: 0;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#loyalty-program-container .levski-promo .lp-progress-path-bg-mobile,
#loyalty-program-container .levski-promo .lp-progress-path-border-mobile,
.lp-img-participation-mobile {
  display: none;
}

#loyalty-program-container .levski-promo .lp-progress-path-bg-desktop,
#loyalty-program-container .levski-promo .lp-progress-path-border-desktop {
  display: block;
}

.lp-img-participation-desktop {
  display: flex;
}

#loyalty-program-container .levski-promo .lp-progress-path-bg > img {
  display: block;
  width: 100%;
  height: auto;
}

#loyalty-program-container .levski-promo .lp-progress-path-border::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 2;
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 35%, rgba(180, 220, 255, 0.4) 44%, rgb(221, 244, 255) 50%, rgba(180, 220, 255, 0.4) 56%, rgba(255, 255, 255, 0) 65%);
  background-repeat: no-repeat;
  background-size: 200% 100%;
  -webkit-mask-image: url("/images/lp/path_border_desktop.png?v=1");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-image: url("/images/lp/path_border_desktop.png?v=1");
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
  filter: blur(2) brightness(2.4);
  mix-blend-mode: screen;
  animation: lpSweep 3s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

#loyalty-program-container .levski-promo .lp-progress-path-border::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: url("/images/lp/path_border_desktop.png?v=1");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: blur(2px) brightness(5);
  opacity: 1;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 65%, transparent 100%);
  -webkit-mask-size: 200% 100%;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 65%, transparent 100%);
  mask-size: 200% 100%;
  animation: lpGlowSweep 3s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  pointer-events: none;
}

#loyalty-program-container .levski-promo .lp-progress-value {
  position: absolute;
  top: 50%;
  left: 10%;
  transform: translate(-50%, -50%);
  font-family: Roboto, sans-serif;
  color: #041242;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.19px;
  filter: drop-shadow(0.3px 0.3px 1.5px white);
  z-index: 3;
}

@media (max-width: 480px) {
  #loyalty-program-container .levski-promo .lp-progress-path-bg-mobile,
  #loyalty-program-container .levski-promo .lp-progress-path-border-mobile {
    display: block;
  }

  .lp-img-participation-mobile {
    display: flex;
  }

  #loyalty-program-container .levski-promo .lp-progress-path-bg-desktop,
  #loyalty-program-container .levski-promo .lp-progress-path-border-desktop,
  .lp-img-participation-desktop {
    display: none;
  }

  #loyalty-program-container .levski-promo .lp-progress-bar {
    mask-image: url("/images/lp/path_mask_bg_mobile.png?v=1");
  }

  #loyalty-program-container .levski-promo .lp-progress-path-border::before {
    -webkit-mask-image: url("/images/lp/path_border_mobile.png?v=1");
    mask-image: url("/images/lp/path_border_mobile.png?v=1");
  }

  #loyalty-program-container .levski-promo .lp-progress-path-border::after {
    background-image: url("/images/lp/path_border_desktop.png?v=1");
  }

  #loyalty-program-container .levski-promo .lp-progress-value {
    font-size: 16px;
  }
}

@media (max-width: 360px) {
  #loyalty-program-container .levski-promo .lp-progress-value {
    font-size: 14px;
  }
}

@keyframes lpSweep {
  0% {
    background-position: 120% 50%;
    -webkit-mask-position: 120% 0%;
    mask-position: 120% 0%;
  }

  90% {
    background-position: -40% 50%;
    -webkit-mask-position: -40% 0%;
    mask-position: -40% 0%;
  }

  100% {
    background-position: -40% 50%;
    -webkit-mask-position: -40% 0%;
    mask-position: -40% 0%;
  }
}

@keyframes lpGlowSweep {
  0% {
    -webkit-mask-position: 120% 0%;
    mask-position: 120% 0%;
  }

  99% {
    -webkit-mask-position: -40% 0%;
    mask-position: -40% 0%;
  }

  100% {
    -webkit-mask-position: -40% 0%;
    mask-position: -40% 0%;
  }
}

#loyalty-program-container .levski-promo .overal-score-overal-score {
  text-align: center;
  color: #ffb800;
  text-align: center;
  font-family: Roboto, sans-serif;
  font-size: 13px;
  font-style: italic;
  font-weight: 900;
  line-height: 16px;
  letter-spacing: 0.4px;
  margin: auto;
}

body.desktop #loyalty-program-container .levski-promo .overal-score-overal-score {
  font-size: 16px;
}

body.mobile #loyalty-program-container .levski-promo .banner .levski-tickets-total-count {
  font-size: 16px;
}

#loyalty-program-container .levski-promo .buttons-container {
  margin: 12px 0;
  display: flex;
  gap: 12px;
  justify-content: center;
}

#loyalty-program-container .levski-promo .buttons-container .btn {
  height: 32px;
  color: var(--primary-text);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  width: 50%;
  text-transform: none;
}

body.desktop #loyalty-program-container .levski-promo .buttons-container .btn {
  max-width: 144px;
}

body.desktop .loyaltyLevelInfo .levski-promo {
  order: 999;
  margin-top: 20px;
}

.loyalty-notification.notifications-wrapper {
  max-width: unset;
  width: 100%;
  margin-bottom: 24px;
  border: 1px solid #4694ff;
  background: rgba(0, 106, 250, 0.12);
  max-width: 970px;
  padding: 0 5px;
  transition: opacity 0.5s ease;
  opacity: 1;
  /* transform: translate(0); */
}

.loyalty-notification.notifications-wrapper p {
  color: #b8e7fb;

  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.13px;
}

.loyalty-notification.notifications-wrapper .icon-wrapper,
.loyalty-notification.notifications-wrapper .closeIcon-wrapper {
  width: 30px;
  height: 45px;
}