/*Variables*/
:root {
  --bg-body: #282249;
  --bg-body-gradient: linear-gradient(
    168deg,
    var(--bg-body) 24%,
    color-mix(in srgb, var(--bg-body) 32%, black) 96%
  );
  --bg-sidebar: #282249;
  --bg-header: #231f3d;
  --bg-footer: transparent;
  --bg-input-fields: #282249;
  --bg-input-fields-border: rgba(52, 50, 87, 255);
  --bg-modal: #282249;
  --bg-section: #231f3d;
  --bg-list-image-item: #12121f;
  --font-color: rgba(255, 255, 255, 0.6);
  --font-color-active: #fff;
  --button-primary-bg: #5c4dae;
  --button-secondary-bg: #50bf7c;
  --panel-bg-color: rgba(92, 77, 174, 0.8);
  --color-button: #ebebf5;
  --color-header: #ebebf5;
  --color-cat-title: #ebebf5;
  --color-footer: #ebebf5;
  --color-icon: #5341b5;
  --color-footnotes: rgba(255, 255, 255, 0.3);
  --border-color: linear-gradient(#5c4dae6e, #5c4dae6e);

  --button-primary-bg-gradient: linear-gradient(
    168deg,
    var(--button-primary-bg) 1.62%,
    rgba(100, 94, 133, 0) 95.72%
  );
  --button-secondary-bg-gradient: linear-gradient(
    180deg,
    var(--button-secondary-bg) 0%,
    #275d3c 100%
  );
  --bg-input-fields-gradient: linear-gradient(
    180deg,
    var(--bg-input-fields) 1.62%,
    rgba(40, 34, 73, 0.1) 90%
  );
  --bg-modal-gradient: linear-gradient(
    180deg,
    var(--bg-modal) 1.62%,
    rgba(40, 34, 73, 0.1) 90%
  );

  --color-black: #000;
  --color-white: rgba(235, 235, 245, 0.6);
  --color-primary: #39ad4a;
  --color-secondary: #008cff;
  --color-text: rgba(235, 235, 245, 0.6);
  --color-side-nav-active: #ffffff;
  --color-text-table: rgba(235, 235, 245, 0.6);
  --color-search-button: rgba(45, 75, 41, 0.9);

  --bg-section: linear-gradient(168deg, #223a1f 1.62%, #0b170c 95.72%);
  --bg-side-nav: linear-gradient(168deg, #223a1f 1.62%, #0b170c 95.72%);
  --bg-side-nav-header-section: #345b2f;
  --bg-side-nav-header-active: transparent;
  --bg-separator: transparent;
  --bg-side-nav-shrink-icon: #345b2f;
  --bg-side-nav-active-icon: #39ad4a;
  --bg-side-nav-toggler: linear-gradient(168deg, #345b2f 1.62%, #1a321c 95.72%);
  --bg-linear-gradient: #39ad4a;
  --bg-header-section: radial-gradient(
    60% 50% at 50% 90%,
    rgba(57, 173, 74, 0.2) 0%,
    transparent 100%
  );
  --bg-input: linear-gradient(168deg, #345b2f 1.62%, #1a321c 95.72%);
  --bg-calendar-separator: rgba(57, 173, 74, 0.3);
  --bg-modal-color: linear-gradient(
    168deg,
    #282249 1.62%,
    rgba(40, 34, 73, 0) 95.72%
  );

  --border-input: 0;

  --button-primary-box-shadow: 0px 8px 12px 0px rgba(0, 0, 0, 0.02);
  --button-secondary-box-shadow: 4px 0px 24px 0px rgba(169, 81, 195, 0.24);

  --font-family: "Inter", sans-serif;
  --font-weight: 500;
  --font-size-regular: 14px;

  --icon-display: block;
  --icon-size: 32px;
  --icon-cover: cover;
  --icon-contain: contain;
  --icon-repeat: no-repeat;
  --icon-position: center;

  --border-radius-4: 4px;
  --border-radius-8: 8px;
  --border-radius-10: 10px;
  --border-radius-16: 16px;
  --border-radius-20: 20px;
  --border-radius-40: 40px;
}

body {
  font-family: var(--font-family) !important;
  color: var(--font-color) !important;
  font-weight: var(--font-weight);
  font-size: var(--font-size-regular);
  letter-spacing: 0.1px;
}

p,
a {
  color: var(--font-color);
}

.loader {
  border: 0;
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/DOSLJO/assets/gifs/onebet-preloader.gif);
  background-size: var(--icon-contain);
  background-position: var(--icon-position);
  background-repeat: var(--icon-repeat);
  height: 200px;
  width: 200px;
  border-radius: 0;
  -webkit-animation: none;
  animation: none;
  top: calc(50%);
  left: calc(50%);
  transform: translate(-50%, -50%);
}

.nm-widget {
  max-width: 100% !important;
}

#site-loading-icon {
  background: var(
    --BG-Gradient,
    linear-gradient(168deg, #282249 1.62%, rgba(40, 34, 73) 95.72%)
  ) !important;
}

#site-loading-icon::before {
  content: "";
  position: absolute;
  height: 200px;
  width: 200px;
  background-image: url(https://wnkstg.sgp1.digitaloceanspaces.com/DOSLJO/assets/PreLoader/OneBet%20Preloader%20WEBP.webp);
  background-position: var(--icon-position);
  background-size: var(--icon-contain);
  background-repeat: var(--icon-repeat);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

::-webkit-scrollbar,
.dropdown ::-webkit-scrollbar {
  width: 4px !important;
  height: 4px !important;
  background: transparent;
}

::-webkit-scrollbar-thumb,
.dropdown ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.02) !important;
  border-radius: var(--border-radius-20);
}

a:not([href]):hover,
a:hover {
  color: var(--font-color-active);
  text-decoration: none;
}

button {
  color: var(--color-button) !important;
}

button.primary {
  background: var(--button-primary-bg-gradient);
  box-shadow: var(--button-primary-box-shadow);
}

button.primary:hover {
  background: var(--button-secondary-bg-gradient);
  box-shadow: var(--button-secondary-box-shadow);
}

#modernSkin.main-wrapper .layout-wrapper .chat-aside {
  display: none !important;
}

#modernSkin.main-wrapper .layout-wrapper .content-wrapper .home-page-content {
  padding: 20px 40px 0 !important;
  background: var(--bg-body);
}

#modernSkin.main-wrapper .layout-wrapper .scroll-wrap {
  max-width: 100%;
  padding-bottom: 24px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content.shrink
  .scroll-wrap,
#app_left_navigation.menu-nav.shrink ~ .content-wrapper #app_header,
#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content.shrink
  #app_footer
  .footer-container,
#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content.shrink
  #provider-game-list-page-casino-group,
#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content.shrink
  #game-providers-page,
#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content.shrink
  #provider-game-list-page {
  margin: 0 auto;
}

#modernSkin.main-wrapper .separator {
  background: var(--bg-separator) !important;
  margin: 8px 0 !important;
}

#modernSkin.main-wrapper .separator.loggedin {
  display: none;
}

body.logged-in #modernSkin.main-wrapper .separator.loggedin {
  display: block;
}

#modernSkin .dropdown-menu {
  filter: drop-shadow(0px 10px 5px rgba(0, 0, 0, 0.5));
}

#modernSkin .nm-widget.language-w .language-public .dropdown-menu {
  border-radius: var(--border-radius-8) !important;
  background: var(--panel-bg-color) !important;
  overflow: hidden;
}

#modernSkin .dropdown-menu .dropdown-item {
  display: flex;
  color: var(--font-color) !important;
  font-weight: var(--font-weight);
}

#modernSkin .dropdown-menu .dropdown-item:hover {
  background: var(--button-secondary-bg-gradient) !important;
  color: var(--color-white) !important;
}

#app_left_navigation .nm-widget.language-w .language-public .language-option {
  background-color: var(--bg-side-nav-header-section) !important;
}

.modal .modal-dialog .modal-content {
  border-radius: var(--border-radius-8);
  background: var(--panel-bg-color);
  padding: 40px 32px !important;
  height: fit-content;
  position: relative;
  border: 1px solid var(--border-color);
}

#modal-login.modal .modal-dialog .modal-content {
  max-width: 564px !important;
}

.modal .modal-dialog .modal-content:before {
  content: "";
  position: absolute;
  bottom: -29px;
  left: -27px;
  height: 58px;
  width: calc(100% + 54px);
  z-index: -1;
  background: var(--bg-body);
  opacity: 0.3;
  filter: blur(13.699999809265137px);
  border-radius: 100%;
}

#modal-login,
.message-box-modal {
  background: var(--bg-modal-gradient);
  /* background: rgba(92, 79, 161, 0.8) !important; */
}

.modal .modal-dialog .modal-content .modal-header {
  padding: 0 0 12px 0;
  position: relative;
  align-items: center;
}

.modal .modal-dialog .modal-content .modal-header .modal-title {
  color: #ffffff !important;
  font-size: 24px !important;
  line-height: 130%;
}

.modal .modal-dialog .modal-content .modal-header .temp-title {
  font-weight: 700;
  font-size: 18px;
  color: var(--color-white) !important;
  margin: auto;
}

#modal-user-profile.modal .modal-dialog .modal-content {
  padding: 0 !important;
}

#modal-user-profile .modal-body {
  position: relative;
}

.modal .modal-dialog .modal-content .modal-header .close,
#modal-user-profile .modal-body .close {
  padding: 0 !important;
  margin: 0;
  top: -23px !important;
  right: -15px;
  height: 24px;
  width: 24px;
}

#modal-user-profile .modal-body .close {
  top: 24px !important;
  right: 24px;
}

.modal .modal-dialog .modal-content .modal-header .close:before,
#modal-user-profile .modal-body .close:before {
  content: "";
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/close/close-button.svg);
  height: 100%;
  width: 100%;
  background-size: var(--icon-contain);
  background-position: var(--icon-position);
  display: var(--icon-display);
  vertical-align: middle;
}

#modal-user-profile .modal-dialog .modal-body img.user-profile-modal-logo {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/DOSLJO/images/logo/1bet-logo.png);
  position: absolute;
  width: 220px;
  height: 40px;
  left: 22px;
  top: 16px;
  z-index: 9;
}

.modal .modal-dialog .modal-content .modal-body {
  padding: 0;
  border-bottom-left-radius: var(--border-radius-20);
  border-bottom-right-radius: var(--border-radius-20);
}

#modal-login .modal-content .modal-body .form-login,
#modal-login .modal-content .modal-body .form-forgot-password,
.form-register {
  padding: 0;
}

form .form-group label,
.form .form-group label {
  color: var(--font-color);
  font-size: 14px;
}

form .form-group .input-inline,
.form .form-group .input-inline,
.form-register .form-group input[type="text"],
.form-register .form-group input[type="email"],
.form-register .form-group input[type="password"],
.form-register .form-group select {
  height: 56px;
  border: var(--border-input);
  color: #5f6b89;
  font-size: 16px;
  font-weight: 600;
  padding: 0 16px;
  background: transparent;
  position: relative;
  border-radius: 8px !important;
}

form .form-group .input-inline::placeholder,
.form-register .form-group input::placeholder {
  color: rgba(95, 107, 137, 0.5) !important;
  text-transform: uppercase;
  font-size: 16px;
  font-family: "Poppins", sans-serif;
}

form .form-group .input-group:before,
.form-register .form-group label.form-prompt:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border-radius: 8px !important;
  box-shadow:
    0px 4px 4px 0px rgba(0, 0, 0, 0.25) inset,
    0px 4px 4px 0px rgba(0, 0, 0, 0.1);
  background: rgba(217, 217, 217, 0.5);
  mix-blend-mode: color-burn;
}

.form-register .form-group label.form-prompt:before {
  height: 56px;
  top: auto;
  bottom: 0;
}

.form-register .form-group {
  padding: 0;
}

.form-register .form-row {
  margin: 0 !important;
}

form .form-group .icon-inline,
.form .form-group .icon-inline {
  bottom: 16px;
  left: 4px;
}

.form-register .form-group input[type="text"],
.form-register .form-group input[type="email"],
.form-register .form-group input[type="password"],
.form-register .form-group select {
  padding: 0 16px;
}

.form-register .form-group input[type="checkbox"] {
  cursor: pointer;
}

form .form-group .input-inline::placeholder,
.form .form-group .input-inline::placeholder {
  color: var(--color-text-table);
}

form .form-group .icon-inline:before,
.form .form-group .icon-inline:before {
  font-size: 16px;
  margin-left: 5px;
}

form .form-group .icon-inline.icon-user:before,
.form .form-group .icon-inline.icon-user:before {
  content: "\f007";
  font-family: "Font Awesome 5 Free";
}

form .form-group .icon-inline.icon-password:before,
.form .form-group .icon-inline.icon-password:before {
  content: " ";
  display: block;
  height: 24px;
  width: 19.11px;
  background-image: url(https://wnkstg.sgp1.digitaloceanspaces.com/DOSLJO/assets/icons/login/lock.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: 3px;
}

form .form-group .highlight,
.form .form-group .highlight {
  color: var(--font-color-active);
}

form .form-group .password-visible,
.form .form-group .password-visible {
  right: 10px !important;
  bottom: 50%;
  transform: translateY(50%);
}

.form-register .form-group .password-visible {
  bottom: 8px;
  transform: translateY(-50%);
}

#modal-login
  .modal-content
  .modal-body
  .form-login
  .form-group.forgot-password-group,
#modal-login
  .modal-content
  .modal-body
  .form-forgot-password
  .form-group.forgot-password-group {
  font-size: 14px;
  cursor: pointer;
  color: #5f6b89;
  margin-bottom: 12px;
}

#modal-login .modal-content .modal-body #btn-signin,
#modal-login .modal-content .modal-body #btn-forgot {
  padding: 0 48px !important;
  height: 37px;
  background: var(--button-primary-bg-gradient);
  border-radius: var(--border-radius-4);
  box-shadow: none;
  border: 0;
  width: fit-content;
  margin: 0 auto;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 16px;
}

#modal-login .modal-content .modal-body #btn-signin:hover,
#modal-login .modal-content .modal-body #btn-forgot:hover {
  background: var(--button-secondary-bg-gradient);
}

.form-register .form-group input[type="submit"] {
  padding: 0 48px !important;
  height: 37px;
  background: var(--button-primary-bg-gradient);
  font-weight: 700;
  border-radius: var(--border-radius-4);
  box-shadow: none;
  text-transform: uppercase;
  color: var(--color-button) !important;
  border: 0;
  width: fit-content;
  margin: 0 auto;
}

.form-register .form-group input[type="submit"]:hover {
  background: var(--button-secondary-bg-gradient);
}

#modal-login .modal-content .modal-body .form-login .form-group.register-group,
#modal-login
  .modal-content
  .modal-body
  .form-forgot-password
  .form-group.register-group,
.form-register .form-group.signin-group {
  margin-bottom: 0;
  font-size: 14px;
}

#modal-login
  .modal-content
  .modal-body
  .form-login
  .form-group.register-group
  a.link-active,
#modal-login
  .modal-content
  .modal-body
  .form-forgot-password
  .form-group.register-group
  a.link-active {
  color: #008cff;
  cursor: pointer;
}

.form-register .form-group.signin-group a.link-active {
  color: #008cff;
  cursor: pointer;
}

/*side-nav*/
#modernSkin.main-wrapper .layout-wrapper #app_left_navigation.menu-nav {
  width: 264px !important;
  background: var(--bg-sidebar) !important;
  box-shadow: 5px 0px 10px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .header-section {
  display: none;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .menu-container {
  padding-top: 65px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .menu-container:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: 65px;
  left: 0;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.5) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.6);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .menu-container:after {
  content: "";
  position: absolute;
  top: 65px;
  left: 0;
  height: 56px;
  width: 100%;
  z-index: 0;
  background: radial-gradient(
    45% 53.57% at 50% 0%,
    var(--bg-sidebar) -20%,
    #ffffff26 -50%,
    rgb(98 84 171 / 0%) 80%
  );
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu {
  background: var(--bg-side-nav-header-section);
  border-bottom: 0 !important;
  border-radius: var(--border-radius-20);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item {
  position: relative;
  justify-content: flex-start !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item
  p {
  text-transform: capitalize;
  margin: 0 0 0 50px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item:hover {
  background: var(--bg-side-nav-header-active);
  border-radius: var(--border-radius-20);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item:hover,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active
  p,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item:hover
  p {
  color: var(--color-side-nav-active) !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item
  .fa-caret-right,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active::before {
  display: none;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item
  i#navItemIcon {
  position: absolute;
  left: 20px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active
  i#navItemIcon {
  left: -2px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item
  i#navItemIcon::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .shrink-product-menu
  .active-item-selector
  #navItemIcon::before {
  content: "";
  display: var(--icon-display);
  width: 20px;
  height: 20px;
  background-size: var(--icon-contain);
  background-repeat: var(--icon-repeat);
  background-position: var(--icon-position);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .shrink-product-menu
  .active-item-selector
  #navItemIcon::before {
  width: 29px;
  height: 29px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active
  i#navItemIcon {
  width: 44px;
  height: 44px;
  background: var(--bg-linear-gradient);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item.active
  i#navItemIcon::before {
  width: var(--icon-size);
  height: var(--icon-size);
  transition: all 0.2s ease-in-out;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item
  i#navItemIcon.CasinoTop::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .shrink-product-menu
  .active-item-selector
  #navItemIcon.CasinoTop::before {
  background-image: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/Casino.svg);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .product-menu
  .nav-menu-item
  i#navItemIcon.SportsTop::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .shrink-product-menu
  .active-item-selector
  #navItemIcon.SportsTop::before {
  background-image: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/Sports.svg);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu {
  padding: 16px 16px 64px 16px !important;
  height: calc(100vh - 65px);
  position: relative;
  transition: 0.2s padding ease-in-out;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item {
  height: 56px !important;
  margin: 0 !important;
  position: relative;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.4);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a {
  padding: 0 !important;
  font-size: 16px;
  /*
        gap           : 16px;
        text-transform: uppercase;
        font-weight   : 700;
        */
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a:hover {
  background: var(--bg-side-nav-header-active) !important;
  font-size: 16px !important;
  color: var(--font-color-active) !important;
  transition:
    background 0.2s,
    padding 0.2s ease-in;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i {
  position: relative !important;
  margin: 0 !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i::before {
  content: "";
  display: var(--icon-display);
  width: var(--icon-size);
  height: var(--icon-size);
  background-size: var(--icon-contain);
  background-repeat: var(--icon-repeat);
  background-position: var(--icon-position);
  position: relative;
  left: -8px;
  z-index: 1;
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.live-casino {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/all-live-casino/all-live-casino.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.slots {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/slots/slots.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.game-shows {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/game-shows/game-shows.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.fast-games {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/fast-games/fast-games.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.table-games {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/table-games/table-games.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.all-casino {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/all-casino/all-casino.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.all-live-casino {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/all-live-casino/all-live-casino.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.feature-buy-in {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/feature-buy-in/feature-buy-in.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.baccarat {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/baccarat/baccarat.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.virtual-games {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/virtual-sports/virtual-sports.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.blackjack {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/blackjack/blackjack.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.mini-games {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/mini-games/mini-games.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.virtual-sports {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/virtual-sports/virtual-sports.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.tv-games {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/tv-games/tv-games.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.top-games {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/top-games/top-games.svg);
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page.new-releases {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/new-releases/new-releases.svg);
}

.template-page-header-container .template-page-header img.Providers,
#provider-game-list-page
  .template-page-header-container
  .template-page-header
  img.provider-game-list-page {
  content: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/AllProviders-active.svg);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.LiveCasino::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/LiveCasino.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.LiveCasino::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.LiveCasino::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/LiveCasino-active.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.slots::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/slots/slots.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.slots::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.slots::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/slots/slots.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.TVGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/tv-games/tv-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.TVGames::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.TVGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/tv-games/tv-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.MiniGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/mini-games/mini-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.MiniGames::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.MiniGames::before,
.game-lobby-header .header-container i.minigames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/mini-games/mini-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.FastGames::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/FastGames.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.FastGames::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.FastGames::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/FastGames-active.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.tableGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/table-games/table-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.tableGames::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.tableGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/table-games/table-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.VirtualSports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/virtual-sports/virtual-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.VirtualSports::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.VirtualSports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/virtual-sports/virtual-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.GameShows::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/GameShows.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.GameShows::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.GameShows::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/GameShows-active.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.Home::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/Home.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.Home::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.Home::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/Home-active.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.AllCasino::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/all-casino/all-casino.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.AllCasino::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.AllCasino::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/all-casino/all-casino.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.AllLiveCasino::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/all-live-casino/all-live-casino.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.AllLiveCasino::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.AllLiveCasino::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/all-live-casino/all-live-casino.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.FeatureBuyIn::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/feature-buy-in/feature-buy-in.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.FeatureBuyIn::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.FeatureBuyIn::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/feature-buy-in/feature-buy-in.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.topGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/top-games/top-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.topGames::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.topGames::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/top-games/top-games.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.baccarat::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/baccarat/baccarat.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.baccarat::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.baccarat::before,
.game-lobby-header .header-container i.baccarat::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/baccarat/baccarat.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.blackjack::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/blackjack/blackjack.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.blackjack::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.blackjack::before,
.game-lobby-header .header-container i.blackjack::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/blackjack/blackjack.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.NewReleases::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/new-releases/new-releases.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.NewReleases::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.NewReleases::before,
.game-lobby-header .header-container i.newreleases::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/new-releases/new-releases.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.AllProviders::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/AllProviders.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.AllProviders::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.AllProviders::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/AllProviders-active.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.Promotions::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/promotions/promotions.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.Promotions::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.Promotions::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/promotions/promotions.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.VIPProgram::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/vip-program/vip-program.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.VIPProgram::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.VIPProgram::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/vip-program/vip-program.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.Komp::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/komp/komp.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.Komp::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.Komp::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/komp/komp.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.Tournaments::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/tournaments/tournaments.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.Tournaments::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.Tournaments::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/tournaments/tournaments.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.Referral::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/referral/referral.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.Referral::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.Referral::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/referral/referral.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.BT1Sports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/bti-sports/bti-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.BT1Sports::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.BT1Sports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/bti-sports/bti-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.DigitainSports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/digitain-sports/digitain-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.DigitainSports::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.DigitainSports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/digitain-sports/digitain-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.DigitainESports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/e-sports/e-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.DigitainESports::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.DigitainESports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/e-sports/e-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.PinnacleSports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/ap-gaming/ap-gaming.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.PinnacleSports::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.PinnacleSports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/ap-gaming/ap-gaming.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a
  i.PinnacleESports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/digitain-e-sports/digitain-e-sports.svg");
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a.active
  i.PinnacleESports::before,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item:hover
  a
  i.PinnacleESports::before {
  background-image: url("https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/digitain-e-sports/digitain-e-sports.svg");
}

.nm-widget.language-w {
  height: var(--icon-size);
}

.nm-widget.language-w .language-public {
  width: 100%;
}

.nm-widget.language-w .language-public:hover {
  background-color: transparent !important;
}

.nm-widget.language-w .language-public .language {
  width: 100%;
  border-radius: var(--border-radius-20);
  display: flex;
  align-items: center;
  height: var(--icon-size);
  padding: 0;
  font-size: 0;
  color: var(--font-color) !important;
  font-weight: var(--font-weight);
}

.nm-widget.language-w .language-public .language:hover {
  color: var(--color-side-nav-active) !important;
}

.nm-widget.language-w .language-public .language img {
  height: var(--icon-size);
  margin-right: 6px;
  width: var(--icon-size);
  border-radius: var(--border-radius-4);
  object-fit: cover;
}

.nm-widget.language-w .language-public .language.dropdown-toggle:after {
  border: 0;
  content: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/Carret.svg);
  margin: 0;
}

.nm-widget.language-w .language-public .language.dropdown-toggle:hover:after {
  content: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/Carret-active.svg);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat {
  background-color: var(--bg-side-nav-header-section) !important;
  border-radius: var(--border-radius-20);
  padding: 0 0 0 60px !important;
  height: 44px;
}

.nm-widget.language-w .language-public .language-option a {
  align-items: center;
}

.nm-widget.language-w .language-public .language-option a img {
  height: var(--icon-size);
  width: var(--icon-size);
  border-radius: var(--border-radius-4);
  object-fit: cover;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat
  i {
  margin: 0 0 0 -39px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat.active
  span,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat:hover
  span {
  padding-left: 0;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-links {
  display: flex;
  flex-flow: column;
  position: relative;
  background: rgba(92, 79, 161, 0.2) !important;
  padding: 0px 8px;
  border-radius: 0.5rem;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-links
  span {
  display: block;
  font-weight: 700;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 12px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-item {
  height: 56px;
  width: 100%;
  position: relative;
}

.menu-container .scroll-section .other-menu {
  background: var(--panel-bg-color);
  border-radius: 0.5rem;
  padding: 0 8px !important;
}

.menu-container .scroll-section .other-menu .menuw {
  padding: 0 8px;
}

.menu-container .scroll-section .accordion-container {
  margin: 8px 0;
}

.menu-container .scroll-section .menu-accordion {
  display: flex !important;
  align-items: center;
  width: 100%;
  padding: 0 16px !important;
  height: 56px;
  justify-content: space-around;
  background: var(--panel-bg-color);
  border-radius: 0.5rem;
  position: relative;
}

.menu-container .scroll-section .menu-accordion.active {
  color: var(--font-color-active) !important;
  border-radius: 0.5rem 0.5rem 0 0;
}

.menu-container .scroll-section button.menu-accordion:before {
  content: "";
  display: var(--icon-display);
  width: var(--icon-size);
  height: var(--icon-size);
  background-size: var(--icon-contain);
  background-repeat: var(--icon-repeat);
  background-position: var(--icon-position);
  position: absolute;
  z-index: 1;
  left: 8px;
}

.menu-container .scroll-section button.menu-accordion.menu-casino:before {
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/DOSLJO/images/1bet-exlusive-icons/1bet-casino.svg);
}

.menu-container .scroll-section button.menu-accordion.menu-sports:before {
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/DOSLJO/images/1bet-exlusive-icons/1bet-sports.svg);
}

.menu-container .scroll-section .menu-panel {
  max-height: 0;
  opacity: 0;
  padding: 0 16px !important;
  transition: all 0.5s ease-in-out;
  position: relative;
  z-index: -1;
  pointer-events: none;
}

.menu-container .scroll-section .menu-panel.shown {
  opacity: 1;
  background: var(--panel-bg-color);
  border-radius: 0px 0px 0.5rem 0.5rem;
  z-index: 1;
  pointer-events: auto;
}

.menu-container .scroll-section .accordion-container .menu-panel.shown {
  max-height: 800px;
}

.menu-container .scroll-section .accordion-container .menu-panel ul {
  display: grid;
  grid-auto-rows: 56px;
}

.menu-container .scroll-section .menu-accordion img {
  transform: rotate(-180deg);
  transition: all 0.5s ease-in-out;
  right: -32px;
  position: relative;
  background: var(--button-primary-bg-gradient) !important;
  border-radius: 0.5rem;
}

.menu-container .scroll-section .menu-accordion.active img {
  transform: rotate(0deg);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-item:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.4);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-item
  a {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  width: 100%;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-item
  span {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  text-transform: capitalize;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-item
  a:hover
  span {
  color: var(--color-side-nav-active);
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav
  section
  .side-menu
  .social-item
  a
  img {
  height: var(--icon-size);
  width: var(--icon-size);
  object-fit: var(--icon-contain);
}

#modernSkin.main-wrapper .layout-wrapper #app_left_navigation.shrink {
  width: 64px !important;
}

#app_left_navigation.shrink
  .shrink-product-menu
  .active-item-selector
  .fa-caret-right {
  display: none;
}

#app_left_navigation.menu-nav.shrink .header-section {
  padding: 22px 15px 9px 8px !important;
}

#app_left_navigation.shrink
  .shrink-product-menu
  .active-item-selector
  #navItemIcon {
  margin-right: 0 !important;
}

#app_left_navigation.shrink .shrink-product-menu .active-item-selector {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#app_left_navigation.shrink section .product-menu {
  background: var(--bg-side-nav-header-active) !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu {
  padding: 0 6px 64px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .scroll-section
  .accordion-container
  button
  span,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .scroll-section
  .accordion-container
  button
  img {
  display: none;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .scroll-section
  button.menu-accordion:before {
  left: 8px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .scroll-section
  .other-menu
  ul
  li
  a
  i:before {
  left: 0px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .scroll-section
  .social-links
  span:first-child {
  display: none;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a:hover,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat:hover {
  background: transparent !important;
  padding: 0 !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a
  i,
#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat
  i {
  margin: 0 !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  ul
  .nav-item
  a#showIntercomChat
  i::after {
  height: 44px;
  width: 44px;
  top: -12px;
  left: -12px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  section
  .side-menu
  .social-links
  span {
  opacity: 0;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .nav-item
  a:hover
  span {
  background: rgba(92, 79, 161, 0.8) !important;
  border-top-right-radius: var(--border-radius-4);
  border-bottom-right-radius: var(--border-radius-4);
  height: 56px !important;
  padding-top: 0 !important;
  display: flex !important;
  align-items: center;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .shrink-product-menu
  .shrink-dropdown-menu {
  background-color: var(--bg-side-nav-header-section) !important;
  top: 70px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .shrink-product-menu
  .shrink-dropdown-menu
  .dropdown-item
  #navItemIcon {
  display: none;
}

#app_left_navigation.shrink .nm-widget.language-w .language-public .language {
  padding: 0;
  font-size: 0;
  height: 44px;
  width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-left: calc((100% - 44px) / 2);
}

#app_left_navigation.shrink
  .nm-widget.language-w
  .language-public
  .language
  img {
  margin-right: -2px;
  max-height: 15px;
}

#app_left_navigation.shrink
  .nm-widget.language-w
  .language-public
  .language.dropdown-toggle:after {
  display: none;
}

#app_left_navigation.shrink
  .nm-widget.language-w
  .language-public
  .language-option {
  background: var(--bg-section) !important;
  min-width: fit-content;
  width: 60px;
  left: -3px !important;
}

#app_left_navigation.shrink
  .nm-widget.language-w
  .language-public
  .language-option
  > a {
  padding: 10px 8px !important;
  font-size: 0 !important;
  min-width: fit-content;
  display: flex;
  justify-content: center;
}

#app_left_navigation.shrink
  .nm-widget.language-w
  .language-public
  .language-option
  > a
  > img {
  margin-right: 0;
  max-height: 15px;
}

#app_left_navigation.shrink section .side-menu .sticky-bottom .social-links {
  flex-direction: column;
  margin-top: 20px !important;
  gap: 5px 0;
}

/*Header*/
.nm-widget.galow {
  margin: 0 !important;
  max-width: 100%;
}

.main-wrapper .layout-wrapper .header-section {
  height: 65px !important;
  width: calc(100% + 264px) !important;
  left: -264px;
  position: relative;
}

#app_header.main-header-container
  .logo-container
  .hamburger-menu-button-container {
  padding: 0 !important;
  height: 24px;
  width: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#app_header.main-header-container .logo-container #toggle-sidenav img {
  content: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/gray-themed/burger-menu/burger-menu.svg);
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .logo-container {
  min-width: 264px;
  height: 100%;
  justify-content: space-between !important;
  padding: 0 32px 0 24px !important;
  transition: 0.2s padding ease-in-out;
}

#app_left_navigation.menu-nav.shrink
  ~ .content-wrapper
  #app_header.main-header-container
  .logo-container {
  margin-left: 200px;
  padding: 0 24px 0 20px !important;
  background: var(--bg-header);
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .logo-container.logged-in {
  display: none;
}

body.logged-in
  #modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .logo-container.logged-in {
  display: none;
}

#modernSkin.main-wrapper .layout-wrapper .header-section a.site-header-logo {
  width: 160px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .player-information-header {
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight) !important;
  padding-right: 32px !important;
  padding-left: 24px;
  background: var(--bg-header);
  justify-content: space-between !important;
  box-shadow: 5px 0px 10px 0px rgba(0, 0, 0, 0.2);
  transition: 0.2s padding ease-in-out;
}

#app_left_navigation.menu-nav.shrink
  ~ .content-wrapper
  #app_header.main-header-container
  .player-information-header {
  padding-left: 8px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .player-information-header
  .right-align {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: end;
  flex: auto;
  gap: 8px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .player-information-header
  .nm-widget {
  margin: 0;
  width: fit-content;
}

body.logged-in .nm-widget.register-w {
  display: none;
}

.nm-widget.login-w .login {
  width: fit-content;
  padding: 0 16px !important;
  height: 37px;
  font-weight: 700;
  border-radius: var(--radius-4, 4px);
  background: var(--button-primary-bg-gradient);
  border: 0;
  color: var(--color-button) !important;
  text-transform: uppercase;
  font-family: "Poppins", sans-serif;
  margin: 0;
}

.nm-widget.login-w .login:hover {
  background: var(--button-secondary-bg-gradient);
}

.nm-widget.register-w .btn-join {
  margin: 0;
  padding: 0 8px !important;
  text-wrap: nowrap;
  height: 37px;
  background: var(--button-secondary-bg-gradient);
  border-radius: var(--border-radius-4);
  font-weight: 700;
  border: 0;
  color: var(--color-button) !important;
  text-transform: uppercase;
  font-family: "Poppins", sans-serif;
  width: fit-content;
}

.nm-widget.register-w .btn-join:hover {
  background: var(--button-primary-bg-gradient);
}

.player-information-header .header-wallets {
  display: flex;
  gap: 8px;
}

.nm-widget.notification-w {
  margin-left: 8px !important;
}

.nm-widget.notification-w .notification-bell {
  background: var(--button-primary-bg-gradient);
  padding: 0 !important;
  height: 37px;
  width: 37px;
  border-radius: var(--border-radius-4);
}

.nm-widget.notification-w .notification-bell .icon-bell,
.nm-widget.notification-w .notification-bell .icon-bell:hover {
  color: var(--color-side-nav-active);
}

.nm-widget.login-w .btn-user-profile {
  background: var(--button-primary-bg-gradient);
  padding: 0 !important;
  height: 37px;
  width: 37px;
  color: var(--color-side-nav-active) !important;
  border-radius: var(--border-radius-4);
}

.nm-widget.notification-w .notification-bell:hover,
.nm-widget.login-w .btn-user-profile:hover {
  background: var(--button-secondary-bg-gradient);
}

.nm-widget.bonus-badge-w button {
  height: 37px;
  padding: 0 16px !important;
  border-radius: var(--border-radius-4);
  border: 0;
  background: var(--button-secondary-bg-gradient);
  font-family: "Poppins", sans-serif !important;
}

.nm-widget.bonus-badge-w button:hover {
  background: var(--button-primary-bg-gradient) !important;
  box-shadow: var(--button-secondary-box-shadow);
}

.nm-widget.wallet-button-w button {
  height: 37px;
  padding: 0 16px !important;
  border-radius: var(--border-radius-4);
  border: 0;
  background: var(--button-primary-bg-gradient);
  font-family: "Poppins", sans-serif !important;
}

.nm-widget.wallet-button-w button:hover {
  background: var(--button-secondary-bg-gradient);
}

#modernSkin .dropdown-menu.dropdown-user-profile {
  background: var(--panel-bg-color) !important;
  padding: 16px 24px !important;
  border-radius: var(--border-radius-8) !important;
  min-width: fit-content;
}

.dropdown-menu.dropdown-menu-right.dropdown-user-profile.show:after {
  content: "";
  position: absolute;
  left: 18px;
  top: 63px;
  width: calc(100% - 36px);
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-section) 95.72%
  );
  height: calc(100% - 76px);
  border-radius: var(--border-radius-8);
  z-index: -1;
}

#modernSkin .dropdown-menu.dropdown-user-profile .dropdown-item {
  padding: 0 !important;
  font-size: 14px !important;
  display: flex;
  align-items: center;
  height: 40px;
  position: relative;
  font-weight: 700;
}

#modernSkin .dropdown-menu.dropdown-user-profile .dropdown-item:hover {
  background: transparent !important;
  color: var(--color-side-nav-active) !important;
}

#modernSkin .dropdown-menu.dropdown-user-profile .dropdown-item:first-child {
  pointer-events: none;
  position: relative;
}

#modernSkin
  .dropdown-menu.dropdown-user-profile
  .dropdown-item:first-child:after {
  content: "";
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  height: 40px;
  width: 100%;
  background: radial-gradient(
    50% 128.57% at 50% -36.61%,
    #f7f7f7 0%,
    rgb(226 220 255 / 20%) 25.67%,
    rgba(98, 84, 171, 0) 100%
  );
  z-index: 0;
}

#modernSkin
  .dropdown-menu.dropdown-user-profile
  .dropdown-item:not(:first-child):not(:last-child):before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.4);
}

#modernSkin .dropdown-menu.dropdown-user-profile .dropdown-item i {
  min-width: 24px;
  max-width: 24px;
  font-size: 24px;
}

#modernSkin .dropdown-menu.dropdown-user-profile .dropdown-divider {
  border: 0;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  mix-blend-mode: overlay;
  margin: 8px 0;
  position: relative;
}

.dropdown-user-profile.show .dropdown-divider:last-of-type {
  display: none;
}

/*Footer*/
#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  #app_footer {
  padding: 32px 0 80px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  #app_footer:after {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  width: 80%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  mix-blend-mode: overlay;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  #app_footer::before {
  background: var(--bg-footer) !important;
  height: 100% !important;
  z-index: 0 !important;
  top: auto !important;
  bottom: 0;
}

#app_footer .footer-container {
  position: relative;
  font-family: "Poppins", sans-serif;
  color: var(--color-footer);
}

#app_footer .footer-container .top-footer {
  display: flex;
}

#app_footer .footer-container .footer-logo {
  width: 220px;
  margin-bottom: 24px;
}

#app_footer .footer-container .site-details {
  flex: 0 0 450px;
  padding-right: 16px;
}

#app_footer .footer-container .site-details p {
  font-weight: 600;
  color: var(--font-color);
}

#app_footer .footer-container .site-details p span {
  color: var(--color-white);
}

#app_footer .footer-container .site-details .footer-social-links {
  display: flex;
  margin-top: 24px;
  gap: 16px;
}

#app_footer .footer-container .site-details .footer-social-links img {
  width: var(--icon-size);
  height: var(--icon-size);
  object-fit: var(--icon-contain);
}

#app_footer .footer-container .quick-links {
  flex: auto;
  display: flex;
  align-items: start;
  justify-content: space-between;
}

#app_footer .footer-container .menu-column h6 {
  font-weight: 700;
  margin-bottom: 16px;
  font-size: 15px;
  text-transform: uppercase;
}

#app_footer .footer-container ul .nav-item:not(:last-child) {
  margin-bottom: 16px;
}

#app_footer .footer-container ul .nav-item {
  font-size: 15px;
  font-weight: 600;
}

#app_footer .footer-container ul .nav-item ul a.dropdown-item {
  padding: 4px 0 4px 16px;
  color: var(--color-footer);
  font-weight: 600;
  font-family: "Poppins", sans-serif;
}

#app_footer .footer-container ul .nav-item ul a.dropdown-item:hover,
#app_footer .footer-container ul .nav-item ul a.dropdown-item.active {
  background: transparent;
  color: var(--font-color-active);
  cursor: pointer;
}

#app_footer .footer-container .menu-column .subcolumn:first-child h6 {
  margin-bottom: 58px;
}

#app_footer .footer-container .menu-column .social-links {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

#app_footer .footer-container .menu-column .social-item {
  margin-right: 6px;
  width: 35px;
}

#app_footer .footer-container .menu-column .social-item:last-child {
  margin-right: 0;
}

#app_footer .footer-container .menu-column .social-item i {
  font-size: 20px;
}

#app_footer .footer-container .subfooter {
  margin-top: 48px;
  padding: 48px 175px 0;
  text-align: center;
  position: relative;
}

#app_footer .footer-container .subfooter:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.3);
}

#app_footer .footer-container .subfooter p {
  font-weight: var(--font-weight);
  color: var(--color-footnotes);
  line-height: 130%;
}

#app_footer .footer-container .subfooter p:first-child {
  margin-bottom: 16px;
}

.scroll-wrap .hero-wrapper {
  margin-bottom: 24px;
}

.scroll-wrap .main-hero {
  margin-bottom: 24px;
  position: relative;
}

.scroll-wrap .main-hero .hero-item {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: 350px;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  border-radius: 16px;
  position: relative;
  display: flex;
  align-items: center;
}

.scroll-wrap .main-hero .hero-item:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: var(--bg-modal-color);
  border-radius: var(--border-radius-16);
  mix-blend-mode: lighten;
}

.scroll-wrap .hero-item:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px;
  background: var(--border-color);
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  z-index: -1;
}

.scroll-wrap .main-hero .hero-item .hero-section-details {
  position: absolute;
  right: 128px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.scroll-wrap .main-hero .hero-item .hero-section-details p {
  text-transform: uppercase;
  font-size: 32px;
  font-weight: 800;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 1);
}

.scroll-wrap .main-hero .hero-item .hero-section-details p a {
  color: var(--font-color-active);
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 1);
}

.scroll-wrap .main-hero .hero-item .hero-section-details p span {
  color: #faf054;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 1);
}

.scroll-wrap .main-hero .hero-item .hero-section-details h3 {
  text-align: center;
  font-size: 80px;
  font-weight: 900;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 1);
  color: #faf054;
  letter-spacing: 8px;
}

.scroll-wrap .main-hero .hero-item .hero-section-details button {
  background: var(--button-secondary-bg-gradient);
  border-radius: var(--border-radius-4);
  padding: 16px 24px;
  width: fit-content;
  font-weight: 800;
  margin: 20px auto 0;
  text-transform: uppercase;
  font-size: 16px;
}

.scroll-wrap .hero-links {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0 24px;
}

.scroll-wrap .ads .join-links {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0 25px;
}

.scroll-wrap .hero-links .hero-item {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 265px;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  position: relative;
  border-radius: 16px;
}

.scroll-wrap .hero-links .hero-item:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    168deg,
    rgba(40, 34, 73, 0) 1.62%,
    rgba(40, 34, 73, 0.26) 21.06%,
    rgba(40, 34, 73, 0) 95.72%
  );
  border-radius: var(--border-radius-16);
  mix-blend-mode: lighten;
}

.scroll-wrap .hero-links .hero-item .hero-links-details {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 8px;
  padding: 16px 24px 16px;
  border-radius: var(--border-radius-8);
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  position: relative;
}

.scroll-wrap .hero-links .hero-item .hero-links-details:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: var(--bg-modal-color);
  filter: opacity(0.4);
  border-radius: 9px;
  z-index: -1;
}

.scroll-wrap .hero-links .hero-item a {
  display: flex;
  align-items: end;
  justify-content: end;
  padding-bottom: 24px;
  padding-right: 24px;
  z-index: 1;
  border-radius: 16px;
  border: 2px solid var(--border-color);
  position: relative;
  height: 100%;
  width: 100%;
}

.scroll-wrap .hero-links .hero-item .hero-links-details img {
  width: 64px;
  height: 42px;
  /* object-fit: contain; */
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

.scroll-wrap .hero-links .hero-item h3 {
  font-size: 24px;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  color: var(--font-color-active);
  font-weight: 700;
  line-height: 100%;
}

.scroll-wrap .ads {
  margin-top: 60px;
}

.scroll-wrap .ads .join-table {
  grid-column: span 2;
}

.scroll-wrap .ads .join-table h4 {
  font-size: 20px;
  font-weight: 700;
  color: var(--color-white);
  margin-bottom: 13px;
}

.scroll-wrap .ads .join-table .table-wrapper {
  overflow-y: scroll;
  max-height: 312px;
  padding-right: 4px;
}

.scroll-wrap .ads .join-table .table-item {
  height: 56px;
  padding: 0 30px;
}

.scroll-wrap .ads .join-table .table-item a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

.scroll-wrap .ads .join-table .table-item:nth-child(odd) {
  border-radius: var(--border-radius-16);
  background: var(--bg-side-nav-header-section);
}

.scroll-wrap .ads .join-table .table-item:nth-child(even) {
  margin: 8px 0;
}

.scroll-wrap .ads .join-table .table-item img {
  margin-right: 16px;
  height: 24px;
  width: 24px;
}

.scroll-wrap .ads .join-table .table-item span {
  font-size: 16px;
  color: var(--color-text-table);
}

.joinbet-about {
  margin-top: 60px;
  padding: 30px;
  background: var(--bg-side-nav-header-section);
  border-radius: var(--border-radius-16);
}

.joinbet-about h5 {
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: 700;
}

.joinbet-about p {
  font-size: 16px;
  font-weight: var(--font-weight);
  line-height: 20px;
  letter-spacing: 0.2px;
}

#modernSkin.main-wrapper .layout-wrapper .content-wrapper.isOnSportsPage {
  z-index: 999 !important;
}

#app_left_navigation.menu-nav.shrink ~ .content-wrapper.isOnSportsPage {
  z-index: 98 !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper.isOnSportsPage
  .home-page-content {
  padding: 0 20px !important;
  left: 0px !important;
  width: 100% !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper.isOnSportsPage
  .home-page-content
  #app_footer {
  background: var(--bg-body);
  z-index: 999;
}

#modernSkin .casino_search-widget .modal-trigger-wrapper {
  margin: 0 !important;
  height: 36px !important;
}

#modernSkin .casino_search-widget .modal-trigger-wrapper .search-button-field {
  width: 354px !important;
}

#modernSkin
  .casino_search-widget
  .modal-trigger-wrapper
  .search-button-field
  button {
  color: rgba(255, 255, 255, 0.15) !important;
  padding: 0 16px !important;
  border-radius: 40px !important;
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
}

#modernSkin
  .casino_search-widget
  .modal-trigger-wrapper
  .search-button-field
  i {
  left: auto !important;
  right: 12px;
  font-size: 10px !important;
  color: #252042;
  background: var(--color-icon);
  padding: 5px;
  border-radius: 50%;
}

#provider-game-list-page .casino_search-widget {
  margin-bottom: 24px;
}

section button.bordered {
  border: 0 !important;
  border-radius: var(--border-radius-10);
  height: 40px !important;
  background: var(--bg-side-nav-header-section) !important;
  padding: 0 14px !important;
}

.data-grid-container .ag-theme-alpine {
  --ag-border-color: transparent !important;
  --ag-header-foreground-color: var(--font-color) !important;
  --ag-grid-size: 8.5px;
  --ag-font-family: var(--font-family);
  --ag-row-hover-color: var(--bg-side-nav) !important;
  --ag-data-color: var(--font-color) !important;
  --ag-modal-overlay-background-color: rgba(29, 37, 67, 0.7) !important;
}

.data-grid-container .ag-header {
  background: var(--panel-bg-color) !important;
  border-bottom: solid var(--bg-input-fields-border) 2px !important;
  border-radius: 16px;
  min-height: 56px !important;
  height: 56px !important;
}

.data-grid-container .ag-theme-alpine .ag-header-row {
  height: 52px !important;
}

.register-birthdate-datepicker-popup {
  border: 1px solid !important;
}

.data-grid-container .ag-overlay-wrapper span {
  border: 0 !important;
  background: var(--bg-side-nav-header-active) !important;
  padding: 10px 16px !important;
  color: var(--color-primary) !important;
  border-radius: 5px;
}

.data-grid-container .ag-overlay-wrapper .ag-overlay-loading-center {
  background: var(bg-separatord) !important;
  box-shadow: 0px 4px 7px rgba(12, 23, 31, 0.35) !important;
  border: 1px solid var(--active-menu-bg) !important;
  border-radius: var(--default-border-radius) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 10px !important;
}

.data-grid-container .ag-overlay-wrapper .ag-overlay-loading-center span {
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  margin: 10px !important;
}

.data-grid-container .ag-overlay-wrapper .ag-overlay-loading-center span i {
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
}

#leaderboard-table .leaderboard-selector-wrapper {
  gap: 30px;
  margin-bottom: 10px;
}

#leaderboard-table .btn-filter {
  font-size: 16px;
  font-family: var(--font-family);
  font-weight: 600;
  border: 0;
  color: var(--color-text-table) !important;
  padding: 0 !important;
  width: fit-content !important;
  min-height: fit-content !important;
  height: fit-content;
}

#leaderboard-table .btn-filter i {
  display: none !important;
}

#leaderboard-table .btn-filter span {
  letter-spacing: 0.1px;
  text-transform: capitalize;
}

#leaderboard-table .btn-filter.active,
#leaderboard-table .btn-filter:hover {
  color: var(--color-white) !important;
  background: transparent !important;
}

#leaderboard-table .btn-filter.active span,
#leaderboard-table .btn-filter:hover span {
  color: var(--color-white) !important;
  font-size: 20px !important;
}

#leaderboard-table section.my-2 {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

#leaderboard-table section button.bordered,
#leaderboard-table .ag-row-odd {
  border-radius: var(--border-radius-10) !important;
  font-family: var(--font-family);
  background: var(--button-primary-bg-gradient) !important;
}

#leaderboard-table section button.bordered i {
  color: var(--color-white) !important;
}

#leaderboard-table section button.bordered:hover,
#leaderboard-table section button.bordered.active {
  background: var(--button-secondary-bg-gradient) !important;
}

#leaderboard-table section menu {
  top: 40px !important;
}

#leaderboard-table section menu ul {
  background: var(--panel-bg-color) !important;
  box-shadow: 0px 4px 7px rgba(12, 23, 31, 0.35);
  border: 1px solid var(--active-menu-bg);
  border-radius: var(--default-border-radius);
}

#leaderboard-table section menu ul li {
  color: var(--font-color) !important;
  font-family: var(--font-family) !important;
}

#leaderboard-table section menu ul li:hover {
  background: var(--button-secondary-bg-gradient) !important;
  color: var(--font-color-active) !important;
}

#leaderboard-table .ag-row-hover:not(.ag-full-width-row)::before,
.player-transaction-content .ag-row-hover:not(.ag-full-width-row)::before {
  border-radius: 16px;
}

#leaderboard-table .ag-row-odd,
.player-transaction-content .ag-row-odd {
  height: 56px !important;
  border-radius: 16px !important;
  background: var(--panel-bg-color) !important;
  border-bottom: solid var(--bg-input-fields-border) 2px !important;
}

#leaderboard-table .ag-row-even,
.player-transaction-content .ag-row-even {
  border: 0 !important;
  background: transparent !important;
  height: 56px !important;
}

#leaderboard-table .ag-ltr .ag-cell:focus-within,
.player-transaction-content .ag-ltr .ag-cell:focus-within {
  border: 0 !important;
}

.player-transaction-cell-amount {
  align-items: center;
}

.player-transaction-cell-amount img {
  margin-top: 0 !important;
}

/*Profile Modal*/
#modal-user-profile .content-wrapper-system {
  flex: 0 0 calc(100% - 264px);
  max-width: 100%;
  background: var(--bg-body);
}

#modal-user-profile .modal-body .modal-wrapper .sidenav-system {
  padding-top: 65px;
  flex: 1 1 264px;
  max-width: 264px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: var(--bg-sidebar);
  box-shadow: 5px 0px 10px 0px rgba(0, 0, 0, 0.2);
}

#modal-user-profile .modal-body .modal-wrapper .sidenav-system:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: 65px;
  left: 0;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.5) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.6);
  z-index: -1;
}

#modal-user-profile .modal-body .modal-wrapper .sidenav-system:after {
  content: "";
  position: absolute;
  top: 65px;
  left: 0;
  height: 56px;
  width: 100%;
  background: radial-gradient(
    50% 128.57% at 50% -36.61%,
    #f7f7f7 0%,
    rgb(226 220 255 / 20%) 25.67%,
    rgba(98, 84, 171, 0) 100%
  );
  z-index: -1;
}

#modal-user-profile .modal-body .modal-wrapper .sidenav-system .grp-account {
  padding: 16px 16px 0 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .sidenav-system
  .grp-account
  .player-username {
  margin-bottom: 4px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .sidenav-system
  .grp-account:before,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .sidenav-system
  .grp-balance:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--bg-separator);
  mix-blend-mode: overlay;
}

#modal-user-profile .modal-body .modal-wrapper .sidenav-system .grp-balance {
  padding: 16px;
  border: 0;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .sidenav-system
  .grp-balance
  > .row {
  margin: 0;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .grp-balance
  .btn-balance-wrapper {
  padding: 0 0 2px 0;
  flex: 0 0 100%;
  max-width: 100%;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .grp-balance
  .btn-balance-wrapper
  button:hover {
  background: var(--button-secondary-bg-gradient);
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .grp-balance
  .btn-balance-wrapper
  button
  i,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .grp-balance
  .btn-bonus-balance-wrapper
  button
  i {
  opacity: 0.6;
  font-size: 24px;
  margin-right: 8px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .grp-balance
  .btn-bonus-balance-wrapper {
  padding: 2px 0 0 0;
  flex: 0 0 100%;
  max-width: 100%;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .grp-balance
  .btn-bonus-balance-wrapper
  button:hover {
  background: var(--button-secondary-bg-gradient);
}

.nav-tab-system-vertical ul {
  padding-top: 16px;
  position: relative;
}

.nav-tab-system-vertical ul:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.4);
}

.nav-tab-system-vertical ul li {
  margin-left: 0;
  padding: 0 16px 0 40px;
  height: 56px;
  position: relative;
}

.nav-tab-system-vertical ul li:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.4);
}

.nav-tab-system-vertical ul li a {
  padding: 0;
  height: 100%;
  display: flex;
  align-items: center;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--font-color);
}

.nav-tab-system-vertical ul li a:hover,
.nav-tab-system-vertical ul li a.active {
  color: var(--color-side-nav-active);
  background: transparent;
}

.nav-tab-system-vertical ul li a i,
.nm-widget.login-w .dropdown-user-profile > a > i {
  min-width: 32px;
  max-width: 32px;
  text-align: center;
  font-size: 28px;
  padding: 0;
  margin-right: 16px;
}

.nav-tab-system-horizontal {
  height: 70px;
  border: 0;
  position: relative;
}

.nav-tab-system-horizontal:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--bg-separator);
  mix-blend-mode: overlay;
}

.nav-tab-system-horizontal .nav-tabs {
  padding-right: 0;
}

.nav-tab-system-horizontal .nav-tabs .nav-item {
  padding: 24px;
}

.nav-tab-system-horizontal .nav-tabs .nav-item a {
  cursor: pointer;
  padding: 0 24px 24px;
}

#vip-progress .nav-tab-system-horizontal .nav-tabs .nav-item a {
  color: var(--color-button);
  padding: 0;
}

.nav-tab-system-horizontal .nav-tabs .nav-item a.active,
.komp-section .komp-section-tabs .komp-active-tab {
  border-color: var(--border-color);
}

#komp-system
  #komp-transactions-history
  .section-system-filter
  .dropdown
  #redemptionHistoryTypeBtn {
  display: flex;
  width: 100%;
  justify-content: space-between;
  background: var(--button-primary-bg-gradient) !important;
}

#komp-system
  #komp-transactions-history
  .section-system-filter
  .dropdown
  #redemptionHistoryTypeBtn:hover {
  background: var(--button-secondary-bg-gradient) !important;
}

#komp-system
  #komp-transactions-history
  .section-system-filter
  .dropdown
  #selectTransferToMenu {
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-10);
}

#komp-system
  #komp-transactions-history
  .section-system-filter
  .dropdown
  #selectTransferToMenu
  a:hover {
  color: #50bf7c !important;
}

.komp-section .komp-section-tabs .komp-section-tab:hover {
  cursor: pointer;
}

.tab-content-main-content > .tab-pane.active {
  padding: 0 48px;
}

.tab-content.tab-content-player-account-window {
  padding-top: 32px;
}

#modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper .header {
  margin: 0;
  padding: 0 0 24px 0;
}

#modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper .header p {
  color: var(--font-color-active);
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
}

.section-system {
  padding: 24px 0;
  margin: 0;
}

.section-system-footer {
  margin-right: 0;
}

.section-system-main,
.section-system-main-lg {
  margin: 0 0 32px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-8);
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  padding: 16px 24px;
}

.section-system-main.referral-link {
  margin: 20px 0px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .section-title {
  margin-bottom: 24px;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--font-color-active);
  font-weight: 700;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .section-title
  a.btn-system-secondary {
  padding: 0 14px !important;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .section-title
  a.btn-system-secondary:hover {
  color: var(--color-white);
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .section-subtitle {
  margin-bottom: 8px;
  margin-bottom: 24px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .btn-system-amount {
  margin-right: 8px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .grp-deposit-amt
  .form-control-label {
  color: var(--color-white);
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .grp-deposit-amt
  input:not(.date-range) {
  height: 42px;
  border-radius: 8px !important;
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
  color: rgba(255, 255, 255, 0.6);
  font-size: 16px;
  font-weight: 600;
  padding: 0 10px;
  margin-top: 10px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .grp-deposit-amt
  input:not(.date-range):focus {
  border-bottom: none;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .grp-deposit-amt
  input:not(.date-range):focus
  + .form-control-label {
  color: #50bf7c;
}

#modal-user-profile .modal-body .modal-wrapper .btn-system-primary,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:last-child {
  height: 40px;
  padding: 0 16px !important;
  color: #fff !important;
  border-radius: var(--border-radius-8);
  background: var(--button-primary-bg-gradient);
  display: flex;
  align-items: center;
  font-weight: 700;
  justify-content: start;
  border: none;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:last-child {
  background: var(--button-primary-bg-gradient);
}

#modal-user-profile .modal-body .modal-wrapper .btn-system-primary:hover,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:last-child:hover {
  background: var(--button-secondary-bg-gradient);
}

#modal-user-profile .modal-body .modal-wrapper .btn-system-secondary:hover,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:first-child:hover {
  background: var(--button-primary-bg-gradient);
}

#modal-user-profile
  #wallet
  .tab-content-player-account-window
  #transaction
  .section-system-filter
  .dropdown.show
  #dropdown-menu-status
  .dropdonw-menu-content
  .dropdown-menu-footer
  .col-12 {
  display: flex;
  justify-content: space-around;
}

#modal-user-profile .modal-body .modal-wrapper .btn-system-secondary,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:first-child {
  height: 40px;
  padding: 0 16px !important;
  color: #fff !important;
  border-radius: var(--border-radius-8);
  background: var(--button-secondary-bg-gradient);
  border: none;
  font-weight: 700;
  display: flex;
  align-items: center;
  font-size: 14px;
  justify-content: start;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:last-child,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .grp-actions
  button:first-child {
  display: inline-block;
  border: 0;
  font-weight: 600;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .accordion {
  margin: 0;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile.preview-mode
  .accordion
  .card,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .accordion
  .card {
  background: var(--panel-bg-color) !important;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  border-radius: var(--border-radius-8);
  padding: 16px 24px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .accordion
  .card
  .card-header {
  padding: 0;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--font-color-active);
  font-weight: 700;
  margin-bottom: 24px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .change-password-container
  input {
  background: rgba(217, 217, 217, 0.75);
  color: #282249;
  border: var(--border-input);
  height: 42px;
  border-radius: 5px;
  font-size: 16px;
  font-weight: 600;
  padding: 0 10px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .change-password-container
  .password-group
  i:before,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .change-password-container
  .confirm-password-group
  i:before {
  color: #282249;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .change-password-container
  .form-prompt {
  margin-bottom: 8px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .change-password-container
  .password-group
  .password-visible,
#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.profile
  .change-password-container
  .confirm-password-group
  .password-visible {
  right: 30px;
  bottom: 10px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .tab-header
  .btn-back {
  cursor: pointer;
}

#modal-user-profile .modal-body .modal-wrapper .btn-deposit-clear,
#modal-user-profile .modal-body .modal-wrapper .btn-withdraw-clear {
  margin-right: 8px;
}

.section-system-filter .col-md-5,
.section-system-filter .col-md-7 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .grp-date-range {
  padding-right: 10px;
}

.date-range-wrapper {
  border: 0;
  width: 100%;
}

.date-range-wrapper i.fa-calendar-alt {
  color: var(--color-white);
  font-size: 16px;
  top: 50%;
  transform: translateY(-50%);
  left: 10px;
}

.date-range-wrapper input.date-range {
  height: 40px;
  background: var(--button-primary-bg-gradient) !important;
  border: var(--border-input);
  border-radius: var(--border-radius-10) !important;
  padding: 0 16px 0 32px;
  font-weight: 600;
  text-align: right;
  cursor: pointer;
}

.date-range-wrapper input.date-range:hover {
  background: var(--button-secondary-bg-gradient) !important;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .grp-status {
  padding-left: 10px;
}

#modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper .dropdown {
  width: 100%;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .dropdown
  .dropdown-system-toggle {
  height: 40px;
  background: var(--button-primary-bg-gradient);
  border: var(--border-input);
  border-radius: var(--border-radius-10) !important;
  padding: 0 16px !important;
  font-weight: 600;
  min-width: 100%;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .dropdown
  .dropdown-system-toggle:hover {
  background: var(--button-secondary-bg-gradient);
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .dropdown
  .dropdown-system-toggle
  span.badge.badge-light {
  top: -2px;
  padding: 2px 4px 1px;
}

.daterangepicker {
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-10);
  border: 1px solid var(--bg-separator);
}

.daterangepicker:after {
  border-bottom: 7px solid var(--panel-bg-color);
}

.daterangepicker .ranges li.active,
.daterangepicker .ranges li:hover,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker td.available:hover,
.daterangepicker th.available:hover,
.daterangepicker td.active.end-date {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  color: var(--color-white);
  box-shadow: var(--button-primary-box-shadow);
}

.daterangepicker .ranges li,
.daterangepicker .calendar-table td,
.daterangepicker .calendar-table th {
  color: var(--color-text-table);
}

.daterangepicker.show-ranges.ltr .drp-calendar.left,
.daterangepicker .drp-buttons {
  border-color: #282249;
  font-family: var(--font-family);
}

.daterangepicker .calendar-table {
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-section) 95.72%
  );
}

.daterangepicker td.off,
.daterangepicker td.off.end-date,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date {
  background: radial-gradient(
    50% 128.57% at 50% -36.61%,
    #6254ab 0%,
    rgba(98, 84, 171, 0.52) 25.67%,
    rgba(98, 84, 171, 0) 100%
  );
}

.daterangepicker .ranges li.active,
.daterangepicker .ranges li:hover,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker td.available:hover,
.daterangepicker th.available:hover,
.daterangepicker td.active.end-date {
  color: #fff !important;
}

.daterangepicker td.in-range {
  background: var(--bg-body);
  color: var(--font-color-active);
}

.daterangepicker th.prev:hover span,
.daterangepicker th.next:hover span {
  border-color: var(--color-white);
}

.daterangepicker .applyBtn {
  height: 40px;
  padding: 0 16px !important;
  font-size: 16px !important;
  color: #fff !important;
  border-radius: var(--border-radius-8);
  background: var(--button-primary-bg-gradient);
  border: none;
}

.daterangepicker .applyBtn:hover {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  box-shadow: var(--button-primary-box-shadow);
}

.daterangepicker .cancelBtn {
  height: 40px;
  padding: 0 16px !important;
  font-size: 16px !important;
  color: #fff !important;
  border-radius: var(--border-radius-8);
  background: var(--button-secondary-bg-gradient);
  border: none;
}

.daterangepicker .cancelBtn:hover {
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    #231f3d 95.72%
  );
  box-shadow: var(--button-secondary-box-shadow);
}

.section-system-filter .dropdown .dropdown-menu.dropdown-filter {
  background: var(--panel-bg-color) !important;
  box-shadow: 0px 4px 7px rgba(12, 23, 31, 0.35);
  border-radius: var(--border-radius-10);
  border-color: var(--bg-separator);
}

div#dropdown-menu-status:after {
  content: "";
  position: absolute;
  left: 8px;
  top: 64px;
  width: calc(100% - 18px);
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-section) 95.72%
  );
  height: calc(100% - 72px);
  border-radius: var(--border-radius-8);
  z-index: -1;
}

.section-system-filter .dropdown.show .dropdown-filter input {
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
  color: var(--font-color-active);
  font-weight: 600;
  font-size: 16px;
}

.section-system-filter .dropdown.show .dropdown-filter input::placeholder {
  color: var(--font-color);
  opacity: 0.8;
}

.section-system-filter .txt-system {
  background: var(--bg-input);
  border: var(--border-input);
  height: 42px;
  border-radius: 5px !important;
  padding: 0 10px;
}

.section-system-filter .dropdown.show #dropdown-menu-sport-status .txt-system {
  background: rgba(217, 217, 217, 0.75) !important;
  color: #282249;
  font-weight: 600;
  font-size: 16px;
}

.section-system-filter .dropdown .dropdown-menu .dropdown-item:hover {
  background: transparent;
}

.section-system-filter .dropdown .dropdown-menu .dropdown-item:hover label {
  color: #50bf7c !important;
}

.section-system-filter
  .dropdown
  .dropdown-menu.dropdown-filter
  .dropdonw-menu-content
  .dropdown-menu-footer {
  border-color: var(--font-color);
  border: none;
}

.section-system-filter
  .dropdown
  .dropdown-menu.dropdown-filter
  .dropdonw-menu-content
  .dropdown-menu-footer
  .btn-system.btn-clear {
  height: 40px !important;
  padding: 0 25px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .section-system-filter
  .btn-system-primary {
  height: 40px;
  padding: 0 25px !important;
}

.table-system {
  border-radius: var(--border-radius-8);
  overflow: hidden;
  margin-top: 24px;
}

.table-system-header th {
  background: var(--panel-bg-color) !important;
  color: var(--color-text-table);
}

.table-system-header th:first-child,
.table-system-header td:first-child {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.table-system-header th:last-child,
.table-system-header td:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.table-system-header td {
  border: 0;
}

.table-system-header tr:nth-child(even) {
  position: relative;
}

.table-system-header tr:nth-child(even) td {
  background: rgba(57, 173, 74, 0.1);
}

.report.casino-bet .wrapper-search input {
  color: rgba(255, 255, 255, 0.6) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  padding: 0 40px 0 16px !important;
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
}

.report.casino-bet .wrapper-search input::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
}

.report.casino-bet .wrapper-search i.fa-search {
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--color-icon);
  padding: 5px;
  border-radius: 50%;
  opacity: 0.6;
}

.report.casino-bet .container-search,
.report.sport-bet .container-search {
  margin-right: 0;
}

.active-bonuses-tab .active-bonus-item .icon-section-wrapper,
.active-bonuses-tab .available-bonus-item .icon-section-wrapper,
.available-bonuses-tab .active-bonus-item .icon-section-wrapper,
.available-bonuses-tab .available-bonus-item .icon-section-wrapper {
  width: 3%;
}

.active-bonuses-tab .active-bonus-item .description-section-wrapper,
.active-bonuses-tab .available-bonus-item .description-section-wrapper,
.available-bonuses-tab .active-bonus-item .description-section-wrapper,
.available-bonuses-tab .available-bonus-item .description-section-wrapper {
  width: 97%;
}

.active-bonuses-tab .active-bonus-item .product-icon,
.active-bonuses-tab .available-bonus-item .product-icon,
.available-bonuses-tab .active-bonus-item .product-icon,
.available-bonuses-tab .available-bonus-item .product-icon {
  color: var(--color-white);
}

.active-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .name-wrapper
  .name,
.active-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .name-wrapper
  .name,
.available-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .name-wrapper
  .name,
.available-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .name-wrapper
  .name {
  font-size: 16px;
  color: var(--color-white);
}

.active-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .description,
.active-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .description,
.available-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .description,
.available-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .description {
  font-size: 14px;
  color: var(--font-color);
  margin: 0 0 20px 0;
}

.active-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-header,
.active-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-header,
.available-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-header,
.available-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-header {
  color: var(--color-text-table);
  font-size: 14px;
}

.active-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-value,
.active-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-value,
.available-bonuses-tab
  .active-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-value,
.available-bonuses-tab
  .available-bonus-item
  .description-section-wrapper
  .bonus-details-wrapper
  .detail-value {
  color: var(--color-white);
}

.active-bonuses-tab .active-bonus-item .btn-claim,
.active-bonuses-tab .active-bonus-item .btn-cancel,
.active-bonuses-tab .available-bonus-item .btn-claim,
.active-bonuses-tab .available-bonus-item .btn-cancel,
.available-bonuses-tab .active-bonus-item .btn-claim,
.available-bonuses-tab .active-bonus-item .btn-cancel,
.available-bonuses-tab .available-bonus-item .btn-claim,
.available-bonuses-tab .available-bonus-item .btn-cancel {
  float: right;
  height: 40px !important;
  padding: 0 25px !important;
  display: flex;
  align-items: center;
}

.active-bonuses-tab .active-bonus-item .btn-claim,
.active-bonuses-tab .available-bonus-item .btn-claim,
.available-bonuses-tab .active-bonus-item .btn-claim,
.available-bonuses-tab .available-bonus-item .btn-claim {
  background: var(--button-primary-bg-gradient) !important;
  box-shadow: var(--button-primary-box-shadow) !important;
}

.active-bonuses-tab .active-bonus-item .btn-claim:hover,
.active-bonuses-tab .available-bonus-item .btn-claim:hover,
.available-bonuses-tab .active-bonus-item .btn-claim:hover,
.available-bonuses-tab .available-bonus-item .btn-claim:hover {
  background: var(--button-secondary-bg-gradient) !important;
}

.active-bonuses-tab .active-bonus-item.claimed,
.active-bonuses-tab .available-bonus-item.claimed,
.available-bonuses-tab .active-bonus-item.claimed,
.available-bonuses-tab .available-bonus-item.claimed {
  border: 0;
}

.active-bonuses-tab .active-bonus-item.claimed .product-icon:before,
.active-bonuses-tab .available-bonus-item.claimed .product-icon:before,
.available-bonuses-tab .active-bonus-item.claimed .product-icon:before,
.available-bonuses-tab .available-bonus-item.claimed .product-icon:before {
  color: #50bf7c;
}

.active-bonuses-tab .active-bonus-item .btn-claim.disabled,
.active-bonuses-tab .active-bonus-item .btn-cancel.disabled,
.active-bonuses-tab .available-bonus-item .btn-claim.disabled,
.active-bonuses-tab .available-bonus-item .btn-cancel.disabled,
.available-bonuses-tab .active-bonus-item .btn-claim.disabled,
.available-bonuses-tab .active-bonus-item .btn-cancel.disabled,
.available-bonuses-tab .available-bonus-item .btn-claim.disabled,
.available-bonuses-tab .available-bonus-item .btn-cancel.disabled {
  opacity: 0.7;
}

.active-bonuses-tab .active-bonus-item .img-running,
.active-bonuses-tab .available-bonus-item .img-running,
.available-bonuses-tab .active-bonus-item .img-running,
.available-bonuses-tab .available-bonus-item .img-running {
  right: -20px;
  top: -20px;
  height: 25px;
  width: fit-content;
  padding: 0 15px;
  background: var(--button-primary-bg-gradient);
  color: var(--color-white);
  font-size: 12px;
  display: flex;
  align-items: center;
  border-bottom-left-radius: var(--border-radius-10);
  border-top-right-radius: var(--border-radius-10);
}

.active-bonuses-tab .active-bonus-item .img-running:before,
.active-bonuses-tab .available-bonus-item .img-running:before,
.available-bonuses-tab .active-bonus-item .img-running:before,
.available-bonuses-tab .available-bonus-item .img-running:before {
  content: "Running";
}

.active-bonuses-tab .active-bonus-item .img-running img,
.active-bonuses-tab .available-bonus-item .img-running img,
.available-bonuses-tab .active-bonus-item .img-running img,
.available-bonuses-tab .available-bonus-item .img-running img {
  display: none;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .section-system-table {
  margin: 0;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .section-system-table-footer
  .col-12 {
  /*text-align: right;*/
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .custom-pagination
  .dropdown {
  width: fit-content;
  margin: 0 10px;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper
  .custom-pagination
  .dropdown
  #pagination-toggle {
  background: var(--button-primary-bg-gradient);
  height: 30px;
  border-radius: 5px !important;
  border: var(--border-input);
  font-size: 14px !important;
  font-weight: 600;
  padding: 0 10px !important;
  min-width: 50px;
}

.dropdown .dropdown-menu-input-mini {
  background: var(--bg-section);
  border-radius: var(--border-radius-10);
  border-color: var(--bg-separator);
}

.dropdown .dropdown-menu-input-mini a:hover {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  border-radius: var(--border-radius-10);
  color: #fff !important;
}

.dropdown .dropdown-menu-input-mini .dropdown-item {
  font-weight: 600;
  color: var(--font-color);
}

.dropdown .dropdown-menu-input-mini .dropdown-item:hover,
.dropdown .dropdown-menu-input-mini .dropdown-item:focus,
.dropdown .dropdown-menu-input-mini .d-item:hover,
.dropdown .dropdown-menu-input-mini .d-item:focus {
  background: transparent;
  color: var(--color-white);
}

.game-lobby-header .header-container h5,
.game-provider-wrapper .game-provider-header .header-container h5 {
  font-size: 20px !important;
  color: var(--color-cat-title) !important;
  font-weight: 600;
}

.game-lobby-header,
.game-provider-wrapper .game-provider-header {
  margin-bottom: 16px !important;
}

.game-lobby-slider-container {
  align-items: center;
  justify-content: space-between;
  width: 98px !important;
  height: 24px !important;
  top: 0 !important;
}

.game-lobby-slider-container button {
  border: 0 !important;
  width: fit-content !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.game-lobby-slider-container button i:before,
.game-provider-wrapper .game-provider-slider-container button i:before {
  content: "";
  height: 24px;
  width: 24px;
  display: var(--icon-display);
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/arrows/arrow-right.svg);
  background-position: var(--icon-position);
  background-size: var(--icon-contain);
  vertical-align: middle;
}

.game-lobby-slider-container button#slideLeft i:before,
.game-provider-wrapper
  .game-provider-slider-container
  button#slideLeft
  i:before {
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/arrows/arrow-left.svg);
}

.game-lobby-renderer .game-lobby-renderer-card a {
  padding-top: 0 !important;
  white-space: nowrap;
}

.game-lobby-renderer-card:not(.see-all-card) a:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  border-radius: inherit;
  left: -2px;
  top: -2px;
  padding: 2px;
  background: var(--border-color);
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  z-index: -1;
}

.game-lobby-renderer .game-lobby-renderer-card img {
  position: relative !important;
  border-radius: 8px !important;
  max-height: 100%;
  object-fit: cover;
}

.game-lobby-renderer-card:not(.see-all-card):before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: var(--border-radius-8);
  background: var(--bg-modal-color);
  mix-blend-mode: soft-light;
  z-index: 1;
}

.game-lobby-renderer .game-lobby-renderer-card.see-all-card {
  position: absolute;
  right: calc(88px / 2);
  transform: translateX(50%);
  top: -38px;
  background: transparent !important;
  cursor: pointer;
  box-shadow: none !important;
  z-index: 1;
}

.game-lobby-renderer .game-lobby-renderer-card.see-all-card:hover {
  filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 1));
}

.game-lobby-slider-container button.shown {
  height: 33px !important;
  width: 33px !important;
  border: 0 !important;
  border-radius: var(--border-radius-10) !important;
  margin-left: 10px;
  padding: 0 !important;
}

.game-lobby-slider-container button.shown:hover {
  transform: none !important;
  background: transparent !important;
  filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 1));
}

.game-lobby-renderer
  .game-lobby-renderer-card.see-all-card
  a
  .see-all-container {
  display: flex;
  flex-direction: row-reverse;
}

.game-lobby-renderer
  .game-lobby-renderer-card.see-all-card
  a
  .see-all-container
  .carousel-control-next-icon {
  display: none;
}

.game-lobby-renderer
  .game-lobby-renderer-card.see-all-card
  a
  .see-all-container
  .see-all-label {
  margin-top: -6px !important;
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/global/pp/icons/white-themed/see-all/see-more.svg);
  font-size: 0 !important;
  width: 24px;
  height: 18px;
  background-size: cover;
}

.game-lobby-renderer .game-lobby-renderer-card.see-all-card a {
  border: none;
}

.game-lobby-renderer.horizontal,
.game-provider-wrapper .game-provider-list,
.loader-container.horizontal div {
  grid-auto-columns: calc(calc(100% - 168px) / 9) !important;
  gap: 0 20px !important;
  margin-bottom: 24px !important;
  padding: 2px;
}

.game-lobby-renderer.tiles,
.scroll-wrapper.provider-list-page .game-providers,
.loader-container.tiles div {
  gap: 32px 24px !important;
}

.loader-container.horizontal div {
  width: 100% !important;
}

.loader-container div svg {
  width: 100%;
}

#casino-lobby-component .tab-navigation {
  margin-bottom: 40px;
  display: flex;
}

#casino-lobby-component .tab-navigation .tab {
  background: var(--bg-side-nav-header-section) !important;
  border-radius: var(--border-radius-10);
  box-shadow: none;
  height: 40px;
  color: var(--font-color) !important;
  padding: 0 17px !important;
  margin-right: 10px;
  align-items: center;
  display: flex;
}

#casino-lobby-component .tab-navigation .tab.active,
#casino-lobby-component .tab-navigation .tab:hover {
  background: var(--button-primary-bg-gradient) !important;
  box-shadow: var(--button-primary-box-shadow);
  color: var(--color-white) !important;
  transition: all 0.2s ease-in;
}

#casino-lobby-component .tab-navigation .tab::before {
  content: "";
  display: inline-block;
  margin-right: 6px;
  width: 20px;
  height: 16px;
  background-size: var(--icon-contain);
  background-repeat: var(--icon-repeat);
  background-position: var(--icon-position);
}

#casino-lobby-component .tab-navigation .tab:first-child::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/casino/icons/Casino_default.svg");
}

#casino-lobby-component .tab-navigation .tab.active:first-child::before,
#casino-lobby-component .tab-navigation .tab:hover:first-child::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/casino/icons/Casino_active.svg");
}

#casino-lobby-component .tab-navigation .tab:nth-child(2)::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/casino/icons/Table-Games_default.svg");
}

#casino-lobby-component .tab-navigation .tab.active:nth-child(2)::before,
#casino-lobby-component .tab-navigation .tab:hover:nth-child(2)::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/casino/icons/Table-Games_active.svg");
}

#casino-lobby-component .tab-navigation .tab:last-child::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/casino/icons/Live-Casino_default.svg");
}

#casino-lobby-component .tab-navigation .tab.active:last-child::before,
#casino-lobby-component .tab-navigation .tab:hover:last-child::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/casino/icons/Live-Casino_active.svg");
}

.game-lobby-header .header-container i {
  margin-right: 8px !important;
}

.game-lobby-header .header-container i::before,
.game-provider-wrapper .game-provider-header .header-container i::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;

  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.game-lobby-header .header-container i.LiveCasino::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/LiveCasino-active.svg");
}

.game-lobby-header .header-container i.Slots::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/Slots-active.svg");
}

.game-lobby-header.casino_favorites-widget .header-container i {
  margin-right: 0 !important;
}

.game-lobby-header.casino_favorites-widget .header-container i::before {
  background-image: url("https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/side-nav/Favorites.svg");
  width: 36px;
  height: 36px;
  position: relative;
}

.game-provider-wrapper .game-provider-slider-container {
  width: fit-content !important;
  height: 36px;
  position: absolute;
  top: 24px;
  right: 0;
  display: flex;
  z-index: 1;
}

.game-provider-wrapper .game-provider-slider-container button {
  height: 33px !important;
  width: 33px !important;
  border: 0 !important;
  border-radius: var(--border-radius-10) !important;
  margin-left: 10px;
  padding: 0 !important;
}

.game-provider-wrapper .game-provider-slider-container button:hover {
  transform: none !important;
  background: transparent !important;
  filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 1));
}

.gamestage-wrapper-new-skin .gamestage-wrapper .gamestage-container {
  background: rgba(92, 79, 161, 0.2) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-container.preload-container::before {
  background: rgb(45 40 71 / 30%) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-container
  .balance-in-currency,
#game-currency-dropdown[data-v-7998068d],
.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-container
  .gamestage-center-info-container
  span,
.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-container
  .balance-in-currency
  .gamestage-currency {
  display: none !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-container
  .gamestage-center-info-container
  .gamestage-play-button-container
  button {
  padding: 0 17px !important;
  border-radius: var(--border-radius-4) !important;
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  box-shadow: var(--button-primary-box-shadow) !important;
  border: var(--border-input) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-container
  .gamestage-center-info-container
  .gamestage-play-button-container
  button:last-child {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  box-shadow: var(--button-secondary-box-shadow) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container {
  background: var(--bg-list-image-item) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  button,
.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .right-controls-container
  button {
  padding: 0 5px !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  button:hover {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  button.fave {
  color: var(--color-secondary) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  button.fave:hover {
  color: var(--color-white) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  .switch-to-real-play-container
  .switch
  input:checked
  + .slider-checkbox {
  background-color: rgba(57, 173, 74, 0.6) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  .switch-to-real-play-container
  .switch
  input:hover
  + .slider-checkbox:before,
.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  .switch-to-real-play-container
  .switch
  input:checked
  + .slider-checkbox:before {
  background: var(--button-secondary-bg-gradient);
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  .switch-to-real-play-container
  .switch
  input:disabled
  + .slider-checkbox {
  background-color: var(--bg-body) !important;
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .controls-column.left-controls-container
  .switch-to-real-play-container
  .label {
  font-family: var(--font-family) !important;
  color: var(--font-color-active);
}

.gamestage-wrapper-new-skin
  .gamestage-wrapper
  .gamestage-bottom-controls-container
  .right-controls-container
  button
  i:hover {
  color: var(--color-primary) !important;
}

#provider-game-list-page-casino-group,
#game-providers-page,
#provider-game-list-page,
.promo-page,
.general-page-template {
  max-width: 100%;
}

.promo-page-header-container {
  display: flex;
}

.template-page-header-container,
.promo-page-header-container,
.casino_favorites-widget .game-lobby-header {
  margin: 0 !important;
  height: fit-content !important;
  background: transparent !important;
}

.template-body-wrapper {
  margin: 30px 0;
  display: flex;
  gap: 0 20px;
}

.promo-page-header-container .promo-page-header {
  display: flex;
  align-items: center;
}

.template-page-header-container .template-page-header,
.promo-page-header-container .promo-page-header,
.casino_favorites-widget .header-container {
  max-width: 100% !important;
  justify-content: start !important;
  gap: 0 8px;
  position: relative;
}

.template-page-header-container .template-page-header h5,
.promo-page-header-container .promo-page-header h5,
.casino_favorites-widget .header-container h5 {
  font-size: 20px !important;
  font-family: var(--font-family) !important;
  font-weight: 600 !important;
  color: var(--color-header) !important;
  order: 2;
}

.template-page-header-container
  .template-page-header
  img.custom-category-game-list-page,
.template-page-header-container .template-page-header img,
.promo-page-header-container .promo-page-header img {
  height: 100%;
  max-height: var(--icon-size);
  width: var(--icon-size);
  order: 1;
  object-fit: contain;
  position: relative;
}

.casino_favorites-widget section {
  margin-top: 30px;
}

.promo-page .tab {
  display: flex;
  margin: 0 auto;
  height: 37px;
  width: fit-content;
}

.promo-page .promoTabLinks {
  height: 100%;
  padding: 8px 16px;
  border-radius: 0;
  background: var(--button-primary-bg-gradient);
  text-transform: uppercase;
  font-weight: 700;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

.promo-page .promoTabLinks:first-child {
  border-radius: 4px 0 0 4px;
}

.promo-page .promoTabLinks:last-child {
  border-radius: 0 4px 4px 0;
}

.promo-page .promoTabLinks:hover,
.promo-page .promoTabLinks.active {
  background: var(--button-secondary-bg-gradient);
}

.promo-page .promoTabContent {
  display: none;
}

.promo-page .promoTabContent.active {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 32px;
  grid-auto-rows: 1fr;
}

.promo-page .promoTabContent.active a {
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius-16);
  position: relative;
  overflow: hidden;
}

.promo-page .promoTabContent.active a:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    168deg,
    rgba(40, 34, 73, 0) 1.62%,
    rgba(40, 34, 73, 0.26) 21.06%,
    rgba(40, 34, 73, 0) 95.72%
  );
  mix-blend-mode: overlay;
}

.promo-page .promoTabContent.active a:after {
  content: "";
  position: absolute;
  height: fit-content;
  width: fit-content;
  padding: 8px;
  top: 16px;
  right: 16px;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  line-height: 120%;
  background: var(--button-primary-bg-gradient);
  border-radius: var(--border-radius-4);
  color: var(--color-button);
  font-weight: 700;
  text-transform: uppercase;
}

.promo-page .promoTabContent.active a:hover:after {
  background: var(--button-secondary-bg-gradient);
  mix-blend-mode: normal;
}

.promo-page .promoTabContent.active a.casino_promo:after {
  content: "Casino";
}

.promo-page .promoTabContent.active a.sports_promo:after {
  content: "Sports";
}

.promo-page .promoTabContent.active a.specials_promo:after {
  content: "Specials";
}

.promo-page .promoTabContent.active a img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.faq-accordion .accordion {
  background-color: var(--bg-side-nav-header-section) !important;
  height: 50px;
  border-radius: var(--border-radius-10);
  width: 100%;
  text-align: left;
  padding: 0 20px !important;
  font-size: 14px !important;
  font-weight: 700;
  color: var(--color-text-table) !important;
}

.faq-accordion .panel {
  padding: 15px 20px;
}

.faq-accordion .panel p {
  color: var(--color-text-table);
  line-height: normal;
  font-size: 14px;
}

.game-lobby-filter {
  margin-bottom: 12px !important;
}

.game-lobby-filter section {
  font-family: var(--font-family) !important;
}

.game-lobby-filter button {
  font-family: "Poppins", sans-serif;
  text-transform: capitalize !important;
  font-weight: 700 !important;
  padding: 0 16px !important;
  gap: 8px;
  height: 37px !important;
  border-radius: var(--radius-4, 4px);
  background: var(--button-primary-bg-gradient) !important;
}

.game-lobby-filter button i {
  color: var(--color-white) !important;
}

.game-lobby-filter button:has(> i.open),
.game-lobby-filter button:hover {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
}

.game-lobby-filter menu {
  box-shadow: 0px 4px 7px rgba(12, 23, 31, 0.35);
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-8);
  padding: 24px !important;
  filter: drop-shadow(0px 10px 5px rgba(0, 0, 0, 0.5));
  position: relative;
}

.game-lobby-filter menu:before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -15px;
  width: 0;
  height: 0;
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
  border-bottom: 16px solid var(--panel-bg-color);
  filter: opacity(0.9);
}

.game-lobby-filter menu:after {
  content: "";
  position: absolute;
  left: 24px;
  top: 24px;
  width: calc(100% - 48px);
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-section) 95.72%
  );
  height: calc(100% - 48px);
  border-radius: var(--border-radius-8);
  z-index: -1;
}

.game-lobby-filter section menu .search {
  padding: 24px 24px 12px !important;
  border-top-right-radius: var(--border-radius-8);
}

.game-lobby-filter section menu .search ._input {
  width: 290px !important;
  position: relative;
}

.game-lobby-filter section menu .search ._input input {
  height: 42px !important;
  border-radius: 8px !important;
  color: var(--font-color-active) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 0 40px 0 16px !important;
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
}

.game-lobby-filter section menu .search ._input input::placeholder {
  text-transform: uppercase;
  font-weight: 700 !important;
  font-size: 16px;
}

.game-lobby-filter section menu .search ._input i {
  background-color: var(--color-icon);
  border-radius: 50%;
  padding: 0 !important;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 12px !important;
  font-size: 14px;
}

.game-lobby-filter section menu .search ._input i:before {
  content: "\f002";
  display: inline-block;
  vertical-align: middle;
  color: var(--font-color-active);
}

section menu.with-caret .fa-caret-up {
  display: none !important;
}

.game-lobby-filter section menu ul {
  padding: 0 24px 24px 24px !important;
}

.game-lobby-filter section menu ul li {
  color: var(--font-color) !important;
  text-transform: capitalize !important;
}

.game-lobby-filter section menu ul li:hover {
  background: transparent !important;
}

.game-lobby-filter .game-lobby-filter-provider .game-lobby-filter-item {
  padding: 0 !important;
}

.game-lobby-filter .game-lobby-filter-provider .game-lobby-filter-item-budge {
  color: #73c37b;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: fit-content !important;
}

.game-lobby-filter .game-lobby-filter-provider .game-lobby-filter-checkbox {
  padding-left: 0 !important;
  height: 28px;
  align-items: center;
  margin-bottom: 8px !important;
  gap: 12px;
}

.game-lobby-filter
  .game-lobby-filter-provider
  ul
  li:last-child
  .game-lobby-filter-checkbox {
  margin-bottom: 0 !important;
}

.game-lobby-filter
  .game-lobby-filter-provider
  .game-lobby-filter-checkbox
  .d-flex {
  order: 2;
  font-size: 16px;
  font-weight: 600 !important;
}

.game-lobby-filter
  .game-lobby-filter-provider
  .game-lobby-filter-checkbox
  .d-flex
  .text-nowrap {
  margin-right: 12px !important;
}

.game-lobby-filter
  .game-lobby-filter-provider
  .game-lobby-filter-checkbox
  input {
  position: absolute;
}

.game-lobby-filter
  .game-lobby-filter-provider
  .base-checkbox-container
  .base-checkbox-icon {
  position: relative !important;
  order: 1;
  height: 24px !important;
  width: 24px !important;
  background: transparent !important;
  border: 0;
  position: relative;
}

.game-lobby-filter
  .game-lobby-filter-provider
  .base-checkbox-container
  .base-checkbox-icon:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(217, 217, 217, 0.5) !important;
  mix-blend-mode: color-burn;
  border-radius: 4px !important;
  box-shadow:
    0px 4px 4px 0px rgba(0, 0, 0, 0.1) inset,
    0px 4px 4px 0px rgba(0, 0, 0, 0.1);
}

.game-lobby-filter
  .game-lobby-filter-provider
  .base-checkbox-container
  .base-checkbox-icon:after {
  background-image: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/checkbox_check.svg);
  border: 0;
  width: 22px;
  height: 16px;
  background-size: var(--icon-contain);
  background-position: var(--icon-position);
  transform: none;
  bottom: 6px;
}

.game-lobby-filter section menu ul li:hover .game-lobby-filter-item-budge {
  font-weight: 800;
}

.game-lobby-filter
  section
  menu
  ul
  li:hover
  .game-lobby-filter-checkbox
  .d-flex
  .text-nowrap {
  font-weight: 800;
  color: var(--font-color-active);
}

.game-lobby-filter .game-lobby-sort section menu ul {
  padding: 24px !important;
  min-width: 147px;
}

.game-lobby-filter .game-lobby-sort section menu ul li .game-lobby-sort-item {
  display: flex;
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
  height: 28px;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  font-weight: 600;
}

.game-lobby-filter
  .game-lobby-sort
  section
  menu
  ul
  li:last-child
  .game-lobby-sort-item {
  margin-bottom: 0 !important;
}

.game-lobby-filter
  .game-lobby-sort
  section
  menu
  ul
  li
  .game-lobby-sort-item:hover {
  color: var(--font-color-active);
  font-weight: 800;
}

.game-lobby-filter .game-lobby-sort section menu ul li .game-lobby-sort-item i {
  margin: 0 !important;
  font-size: 21px;
  width: 24px;
  height: 24px;
  text-align: center;
}

#modernSkin .modal-loader {
  display: none !important;
}

.new-skin-modal-mask .new-skin-modal-wrapper .new-skin-modal-container {
  background: var(--bg-modal-gradient) !important;
  border-radius: 8px !important;
  padding: 24px 40px !important;
  max-height: fit-content !important;
  width: calc(100% - 264px) !important;
  margin: 65px auto 0 264px !important;
  max-width: 100% !important;
  transform: none !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.menu-nav.shrink
  ~ .content-wrapper
  .casino_search-widget
  .new-skin-modal-container {
  margin-left: 64px !important;
  width: calc(100% - 64px) !important;
}

#modernSkin .casino_search-widget .casino-search-modal-header h5 {
  font-weight: 700;
  color: #ffffff !important;
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  text-transform: capitalize;
}

#modernSkin
  .casino_search-widget
  .casino-search-modal-wrapper
  .search-field-input {
  margin: 24px 0 32px !important;
  height: 48px !important;
}

#modernSkin
  .casino_search-widget
  .casino-search-modal-wrapper
  .search-field-input
  input {
  border-radius: 40px !important;
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
  color: rgba(255, 255, 255, 0.6) !important;
  font-weight: 600;
  padding: 0 48px !important;
}

#modernSkin
  .casino_search-widget
  .casino-search-modal-wrapper
  .search-field-input
  input:focus {
  box-shadow: none !important;
}

#modernSkin
  .casino_search-widget
  .casino-search-modal-wrapper
  .search-field-input
  input::placeholder {
  color: var(--font-color);
}

#modernSkin
  .casino_search-widget
  .casino-search-modal-wrapper
  .search-field-input
  i {
  color: var(--font-color) !important;
  background: var(--color-icon);
  padding: 5px;
  border-radius: 50%;
  font-size: 16px !important;
  left: 12px !important;
}

#modernSkin .casino_search-widget .search-result-placeholder img {
  display: none;
}

.nm-widget .game-lobby-load-more-container .load-more-counter span {
  text-transform: capitalize !important;
  font-size: 16px !important;
}

.nm-widget .game-lobby-load-more-container button {
  width: fit-content !important;
  padding: 0 64px !important;
  border-radius: var(--border-radius-4) !important;
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  box-shadow: var(--button-primary-box-shadow);
  letter-spacing: normal !important;
  color: var(--color-button) !important;
  font-family: "Poppins", sans-serif;
  font-size: 16px !important;
  font-weight: 700;
  height: 37px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  .scroll-wrapper.provider-list-page
  .game-providers {
  margin-bottom: 30px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  .scroll-wrapper.provider-list-page
  .game-providers
  .provider-list-item {
  height: 60px !important;
  background-color: var(--bg-side-nav-header-active) !important;
  box-shadow: var(--button-primary-box-shadow) !important;
  padding: 10px 15px !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  .scroll-wrapper.provider-list-page
  .game-providers
  .provider-list-item:hover {
  background-color: var(--color-primary) !important;
  box-shadow: var(--button-primary-box-shadow) !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  .scroll-wrapper.provider-list-page
  .game-providers
  .provider-list-item
  .provider-name {
  font-weight: 600;
  font-size: 12px !important;
  line-height: normal;
  display: block;
}

.gamestage-wrapper-new-skin .game-info-wrapper .header-container h5 {
  font-weight: 800 !important;
  font-size: 20px;
  color: var(--color-header) !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .common-height,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .thumbnail-container,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container {
  height: fit-content !important;
}

.gamestage-wrapper-new-skin .game-info-wrapper .header-container i,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .featured-tag-header
  i,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .featured-tags-wrapper
  .featured-tag-header
  i,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-statistic
  .collapse-title
  i {
  color: var(--font-color) !important;
}

.gamestage-wrapper-new-skin .game-info-wrapper .game-info-container {
  background: var(--panel-bg-color) !important;
  border-radius: 8px !important;
  padding: 32px !important;
  min-height: fit-content !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper {
  min-height: fit-content !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container {
  justify-content: start !important;
  padding: 0 24px !important;
  height: fit-content !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .details-meta
  h5,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .details-meta
  p,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .about-content
  span {
  font-family: var(--font-family) !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info {
  border-radius: 8px !important;
  padding: 24px !important;
  margin-top: 16px !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .featured-tag-header
  h5,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .featured-tags-wrapper
  .featured-tag-header
  h5,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-statistic
  .collapse-title
  h5 {
  color: var(--color-header) !important;
  font-size: 16px !important;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: -0.32px;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .about-content {
  max-height: fit-content !important;
  color: var(--color-text-table);
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .about-content
  span {
  font-size: 14px !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .about-content
  button {
  margin-top: 10px;
  border-radius: var(--border-radius-4);
  background: var(--button-primary-bg-gradient);
  padding: 0 16px !important;
  height: 37px;
  font-family: "Poppins", sans-serif !important;
  font-weight: 700 !important;
  display: block !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .primary-details-wrapper
  .details-container
  .about-game-info
  .about-content
  button
  i {
  color: #ffffff !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .featured-tags-wrapper,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-statistic {
  border-radius: 8px !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .featured-tags-wrapper
  .featured-tags-cards
  button {
  background: linear-gradient(180deg, #50bf7c 0%, #275d3c 100%) !important;
  border-radius: var(--border-radius-4) !important;
  border: 0 !important;
  font-family: var(--font-family) !important;
  text-transform: capitalize !important;
  padding: 0 16px !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container {
  padding: 8px 0 0 0 !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  #collapsible
  .header,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content {
  padding: 0 !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content
  .game-info-details-title {
  color: var(--font-color) !important;
  font-size: 16px !important;
}

#collapsible .collapse-button {
  padding: 0 !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content
  .game-info-details-value {
  color: var(--color-white) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content
  .game-info-details-value.amount {
  color: var(--color-primary) !important;
}

.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content
  .game-stats-info,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content
  .game-info-details-title,
.gamestage-wrapper-new-skin
  .game-info-wrapper
  .game-info-container
  .featured-tags-container
  .game-stats-container
  .game-stats-content
  .game-info-details-value {
  font-family: var(--font-family) !important;
}

.nm-widget .game-lobby-load-more-container {
  margin-bottom: 30px;
}

#modal-user-profile .modal-body .modal-wrapper .section-system-filter {
  padding: 24px 0 0;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.history-tab
  .transaction-subtab-container {
  padding: 0 !important;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.history-tab
  .transaction-subtab-container
  button {
  margin-right: 0 !important;
}

#modal-user-profile
  .modal-body
  .modal-wrapper
  .tab-content-wrapper.history-tab
  .mt-4 {
  margin-top: 0 !important;
}

.message-box-modal .modal-dialog .modal-content .modal-footer button {
  background: var(--button-primary-bg-gradient);
  color: var(--color-button) !important;
  font-weight: 700;
  text-transform: uppercase;
}

.message-box-modal .modal-dialog .modal-content .modal-footer button:hover {
  background: var(--button-secondary-bg-gradient);
}

.transaction-subtab-container button.active:after {
  background-color: var(--border-color) !important;
  margin-top: 8px !important;
}

.verify-email-content {
  text-align: center;
  margin: 30px 0;
  min-height: 120px;
}

.verify-email-content i {
  font-size: 24px;
  color: var(--color-secondary);
}

.verify-email-content .message-wrapper {
  margin-top: 20px;
}

.verify-email-content .message-wrapper h6 {
  font-size: 20px;
  color: var(--color-white);
}

.verify-email-content .error-message h6 {
  color: #ff0000;
}

.verify-email-content .error-message span {
  display: block;
  margin-top: 10px;
}

.verify-email-content .error-message a {
  display: inline-block;
  width: fit-content;
  border-radius: var(--border-radius-10);
  background: var(--bg-side-nav-header-section);
  padding: 8px 16px;
  color: var(--color-white);
  margin-top: 10px;
}

.verify-email-content .success-message h6 {
  color: var(--color-primary);
}

.verify-email-content .success-message span {
  margin-top: 10px;
  display: block;
}

.article-menu-wrapper {
  flex: 0 0 250px;
  background: var(--bg-side-nav);
  border-radius: var(--border-radius-10);
  padding: 20px;
  height: fit-content;
}

.article-content-wrapper {
  flex: 0 0 calc(100% - 270px);
  padding: 20px;
  background: var(--bg-side-nav);
  border-radius: var(--border-radius-10);
}

.article-menu-wrapper .nav-item a {
  padding: 10px 20px;
  width: 100%;
  display: block;
  border-radius: var(--border-radius-10);
  transition: all 0.2s ease-in;
}

.article-menu-wrapper .nav-item a.active,
.article-menu-wrapper .nav-item a:hover {
  background: linear-gradient(
    270deg,
    rgba(23, 30, 47, 0.84) 0%,
    rgba(23, 30, 47, 0.44) 100%
  );
  color: var(--color-white);
}

.article-content-wrapper h5 {
  font-size: 16px;
  color: var(--color-white);
  font-weight: 800;
  margin-bottom: 20px;
}

.article-content-wrapper h5.inline-header {
  margin-top: 20px;
}

.article-content-wrapper p {
  color: var(--color-text-table) !important;
}

.article-content-wrapper p.indent {
  text-indent: 20px;
}

.article-content-wrapper p span.number-point {
  color: var(--color-primary);
  margin-right: 5px;
}

.custom-modal-container .icon-container {
  align-items: center;
  justify-content: end;
  padding: 20px;
  height: fit-content !important;
}

.deposit-transactions-history-classic
  .custom-modal-container
  .custom-modal-body,
.withdrawal-transactions-history-classic
  .custom-modal-container
  .custom-modal-body {
  background: var(
    --BG-Gradient,
    linear-gradient(168deg, #282249 1.62%, rgba(40, 34, 93, 0.9) 94.72%)
  ) !important;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.deposit-transactions-history-classic
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .icon-container,
.withdrawal-transactions-history-classic
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .icon-container {
  position: absolute;
  right: 0;
}

.deposit-transactions-history-classic
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .section-system-main.transaction-details-modal-container,
.withdrawal-transactions-history-classic
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .section-system-main.transaction-details-modal-container {
  padding: 24px 20px 8px;
  border: none;
}

.custom-modal-container .icon-container span > span {
  margin: 0 !important;
  color: var(--color-white) !important;
  font-size: 18px !important;
  font-weight: 700;
  padding: 0 !important;
}

.custom-modal-container .icon-container .close-icon {
  height: 24px;
  width: 24px;
  border-radius: 5px;
  background: var(--button-secondary-bg-gradient);
  position: relative !important;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0 !important;
  top: 0 !important;
  transform: none !important;
  font-size: 16px !important;
  color: var(--color-white);
}

.custom-modal-container .icon-container .close-icon:hover {
  color: var(--color-white) !important;
}

.custom-modal-container
  .custom-modal-section
  .transaction-details-modal-container {
  background-color: transparent;
  padding: 31px 20px 16px;
  margin: 0;
}

.custom-modal-container
  .custom-modal-section
  .transaction-details-modal-container
  .transaction-detail-item
  .transaction-detail-item-value {
  color: var(--color-primary);
}

.custom-modal-container
  .custom-modal-section
  .transaction-details-modal-container
  h4 {
  color: var(--color-white);
  margin-bottom: 20px;
}

.custom-modal-container
  .custom-modal-section
  .flex-item-container
  > .flex-item-container {
  padding: 0 20px 20px !important;
}

.custom-modal-container
  .custom-modal-section
  .flex-item-container
  > .flex-item-container
  .mb-2 {
  margin-bottom: 0 !important;
}

.custom-modal-container
  .custom-modal-section
  .flex-item-container
  > .w-100.px-4
  .px-1:last-child {
  padding-right: 15px !important;
}

.custom-modal-container .card-container .card-content {
  padding: 10px !important;
  color: var(--color-white);
}

.custom-modal-container
  .card-container
  .card-content
  .flex-item-container
  > span:first-child {
  margin-bottom: 20px;
}

.custom-modal-container
  .card-container
  .card-content
  .flex-item-container
  > span:last-child {
  color: var(--color-secondary);
}

.custom-modal-container .btn-container {
  margin: 0 0 10px 0 !important;
  padding: 0 15px !important;
  height: 40px;
  border: 0 !important;
  border-radius: var(--border-radius-10) !important;
  background: var(--button-primary-bg-gradient);
  box-shadow: var(--button-primary-box-shadow);
}

.custom-modal-container .btn-container:hover {
  background: var(--button-secondary-bg-gradient);
  box-shadow: var(--button-secondary-box-shadow);
}

#casino-lobby-component .hero-container {
  height: 307px;
  position: relative;
}

#casino-lobby-component .hero-container img {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
  border-radius: var(--border-radius-10);
}

#vip-progress .section-system-main .row.p-1 .col-2 {
  -ms-flex: 0 0 10%;
  flex: 0 0 10%;
  max-width: 10%;
  padding-left: 0;
}

#vip-progress .section-system-main .row.p-1 .col-10 {
  -ms-flex: 0 0 90%;
  flex: 0 0 90%;
  max-width: 90%;
}

#vip-progress .komp-vip-progress-tier-icon {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
}

#vip-progress .komp-progress-bar {
  background: var(--button-primary-bg-gradient);
  border: var(--border-input);
}

#vip-progress .komp-progress {
  background: var(--button-secondary-bg-gradient);
}

#vip-progress .card {
  background-color: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-8);
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 16px 24px;
}

#vip-progress .card .card-header {
  border: 0;
  padding: 0;
  position: relative;
  background-color: transparent;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--font-color-active);
  font-weight: 700;
}

#vip-progress .card .card-header:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--bg-separator);
  mix-blend-mode: overlay;
}

.section-system-main.referrals-tab-link {
  margin: 20px 5px 20px;
}

.referrals-tab
  .referrals-tab-link
  .referrals-tab-link-label
  .referrals-tab-link-code {
  color: #50bf7c !important;
}

.referrals-tab
  .referrals-tab-link
  .referrals-tab-link-label
  .referrals-tab-link-url {
  color: var(--color-white);
}

.referrals-tab .referrals-tab-link .referrals-tab-link-label .btn {
  padding: 0 15px !important;
  border-radius: 5px !important;
  display: inline-block !important;
  height: 30px !important;
}

.referrals-tab
  .section-system-filter
  .referrals-tab-filters
  .date-range-wrapper {
  width: 20%;
}

.referrals-tab
  .section-system-filter
  .referrals-tab-filters
  .referrals-tab-search,
.user-referral-commission-history-report
  .user-referral-filters
  .user-referral-search {
  background: transparent;
  border: 0 !important;
  width: fit-content !important;
  padding: 0 !important;
}

.referrals-tab
  .section-system-filter
  .referrals-tab-filters
  .referrals-tab-search
  .referrals-tab-search-input,
.user-referral-commission-history-report
  .user-referral-filters
  .user-referral-search
  .user-referral-search-input {
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
  border-radius: var(--border-radius-10);
  height: 40px;
  padding: 0 32px 0 16px;
  width: fit-content !important;
}

.user-referral-commission-history-report
  .user-referral-filters
  .user-referral-search
  .user-referral-search-input::placeholder {
  font-weight: 600;
}

.referrals-tab
  .section-system-filter
  .referrals-tab-filters
  .referrals-tab-search
  .referrals-tab-search-icon,
.user-referral-commission-history-report
  .user-referral-filters
  .user-referral-search
  .user-referral-search-icon {
  background: var(--color-icon);
  color: #252042;
  padding: 5px;
  border-radius: 50%;
}

#notification-page .table-player-message td {
  border-color: var(--border-color);
}

.user-referral-commission-history
  .user-referral-commission-history-tabs
  li:hover,
.user-referral-commission-history
  .user-referral-commission-history-tabs
  li.active {
  border-color: var(--border-color) !important;
  color: var(--font-color-active);
}

.user-referral-commission-history-monthly .user-referral-filters .dropdown {
  width: 20% !important;
}

.user-referral-commission-history-monthly
  .user-referral-filters
  .dropdown-menu {
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-10);
}

.user-referral-commission-history-monthly
  .user-referral-filters
  .dropdown-menu
  .btn-system {
  height: 40px !important;
  padding: 0 25px !important;
}

.user-referral-commission-history-monthly
  .user-referral-filters
  .dropdown-menu
  .txt-system {
  border: 1px solid var(--bg-input-fields-border) !important;
  background: var(--bg-input-fields-gradient) !important;
  border-radius: 5px;
}

.user-referral-commission-history-monthly
  .user-referral-filters
  .dropdown-menu
  .dropdown-item:hover {
  background: transparent;
}

.user-referral-commission-history-monthly
  .user-referral-filters
  .dropdown-menu
  .dropdown-item:hover
  label {
  color: var(--color-primary) !important;
}

.month-year-picker-datepicker-footer {
  display: flex;
  justify-content: space-between;
  gap: 5px;
  padding: 15px;
}

.month-year-picker-datepicker .month-year-picker-input-wrapper {
  border: 0;
  border-radius: 0;
}

.month-year-picker-datepicker
  .month-year-picker-input-wrapper
  .month-year-picker-input {
  background: var(--button-primary-bg-gradient) !important;
  border: var(--border-input);
  border-radius: var(--border-radius-10);
  height: 40px;
}

.month-year-picker-datepicker-main.month-year-picker-datepicker-popup,
.month-year-picker-datepicker-main .month-year-picker-datepicker-content {
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-10);
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-datepicker-footer
  .month-year-picker-btn.month-year-picker-datepicker-btn-confirm,
.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-datepicker-footer
  .month-year-picker-btn {
  background: var(--button-primary-bg-gradient);
  height: 40px !important;
  padding: 0 25px !important;
  border-radius: 8px;
  border: 0;
  margin-left: 0;
  font-size: 14px !important;
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-datepicker-footer
  .month-year-picker-btn.month-year-picker-datepicker-btn-cancel {
  background: var(--button-secondary-bg-gradient);
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-datepicker-footer
  .month-year-picker-btn.month-year-picker-datepicker-btn-confirm:hover {
  background: var(--button-secondary-bg-gradient);
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-datepicker-footer
  .month-year-picker-btn.month-year-picker-datepicker-btn-cancel:hover {
  background: var(--button-primary-bg-gradient);
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-calendar
  .month-year-picker-calendar-content
  .cell:hover,
.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-calendar
  .month-year-picker-calendar-content
  .cell.active {
  background: var(--button-secondary-bg-gradient);
  border-radius: 5px;
  color: #ffffff;
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-calendar
  .month-year-picker-btn {
  height: fit-content;
  padding: 0 8px !important;
}

.month-year-picker-datepicker-main
  .month-year-picker-datepicker-content
  .month-year-picker-calendar
  .month-year-picker-btn:hover {
  background: var(--bg-input) !important;
}

.search-result-placeholder img {
  display: none;
}

.bottom-logos {
  margin-top: 8px;
  display: inline-block;
}

.bottom-logos > div {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 12px 10px;
}

.bottom-logos .bottom-logo-wrapper {
  position: relative;
  background: #151323;
  border-radius: 5px;
  opacity: 0.5;
  mix-blend-mode: multiply;
}

.bottom-logos .bottom-logo-wrapper:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  border-radius: 5px;
  background: linear-gradient(#041331 0%, #0e2045 35.79%, #051946 42.06%);
  mix-blend-mode: multiply;
  opacity: 0.5;
}

.bottom-logos .bottom-logo-wrapper a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  z-index: 1;
  position: relative;
}

.bottom-logos .bottom-logo-wrapper img {
  width: 70%;
  height: 70%;
  object-fit: contain;
}

.message-box-modal .modal-dialog .modal-content .message.error-message {
  font-family: var(--font-family) !important;
  color: var(--font-color) !important;
  padding: 0;
}

.message-box-modal .modal-dialog .modal-content .message.error-message .btn {
  background: var(--button-primary-bg-gradient);
  margin-top: 24px;
}

.message-box-modal
  .modal-dialog
  .modal-content
  .message.error-message
  .btn:hover {
  background: var(--button-secondary-bg-gradient);
  color: var(--font-color-active);
}

.message-box-modal
  .modal-dialog
  .modal-content
  .message.error-message
  .confirm-header {
  color: #ffffff !important;
  margin-bottom: 12px;
}

.modal-backdrop.show {
  opacity: 0.95;
}

#modal-login .modal-content .modal-body {
  background: var(--bg-body) !important;
  border-radius: var(--border-radius-8);
  padding: 24px 24px 32px;
}

.form-login .form-group:first-child {
  margin: 0;
}

form .form-group,
.form .form-group {
  margin-bottom: 16px;
  color: #5f6b89;
}

form .form-group label,
.form .form-group label {
  font-size: 12px;
  line-height: 100%;
  margin-bottom: 4px;
}

form .form-group .error,
.form .form-group .error {
  line-height: 16px;
}

form .form-group .input-inline#usernamesigninhpt,
form .form-group .input-inline#username-forgot,
form .form-group .input-inline#password-signin {
  padding-left: 30px;
}

.form-register .form-group .custom-checkbox .custom-control-label:before {
  top: 0;
}

.form-register
  .form-group
  .custom-checkbox
  .custom-control-input:checked
  ~ .custom-control-label:after {
  top: 0;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-background-clip: text;
  -webkit-text-fill-color: #ffffff;
  transition: background-color 5000s ease-in-out 0s;

  box-shadow: 0 0 30px 30px inset #0b170c;
}

.category-page-content {
  padding-top: 36px;
}

.category-page-content-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.category-page-content-header img {
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.category-page-content-header img.logo-header {
  height: 95px;
  width: auto;
}

.category-page-content-header h2 {
  color: var(--color-header);
  font-size: 32px;
  font-weight: 800;
}

.category-page-content .section-box {
  padding: 24px;
  display: inline-block;
  background: linear-gradient(
    180deg,
    rgba(35, 31, 61, 0) 30%,
    var(--bg-section) 95.72%
  );
  margin: 40px 0 24px;
  position: relative;
  width: 100%;
}

.category-page-content .section-box:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  border: 2px solid rgba(255, 255, 255, 0.1);
}

.category-page-content .section-box h4 {
  color: var(--color-header);
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: -0.48px;
  text-align: center;
  margin-bottom: 12px;
}

.category-page-content .section-box p {
  font-size: 16px;
  text-align: center;
  margin: 0 auto;
  line-height: 24px;
}

.category-page-content .register-button {
  margin: 8px 0;
  display: inline-block;
  text-align: center;
  width: 100%;
}

.category-page-content .register-button button {
  font-weight: 700;
  background: var(--button-primary-bg-gradient);
  font-family: "Poppins", sans-serif;
  text-transform: uppercase;
  padding: 8px 56px;
  border-radius: var(--border-radius-4);
}

.category-page-content .register-button button:hover {
  background: var(--button-secondary-bg-gradient);
}

.category-page-content .card-box-section {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 1fr;
  gap: 24px;
  margin: 24px 0 48px;
}

.category-page-content .card-box-section .section-box {
  margin: 0;
  border-radius: var(--border-radius-16);
  padding: 32px;
  display: flex;
  gap: 24px;
}

.category-page-content .card-box-section .section-box:before {
  border-radius: var(--border-radius-16);
  border-width: 1px;
}

.category-page-content .card-box-section .section-box img {
  height: 64px;
  width: 64px;
  object-fit: contain;
}

.category-page-content .card-box-section .section-box h6 {
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--color-header);
  margin-bottom: 12px;
}

.category-page-content .card-box-section .section-box p {
  max-width: 100%;
  text-align: left;
  font-weight: 400;
}

.category-page-content .vip-cards-section {
  display: flex;
  gap: 40px;
  margin-bottom: 24px;
  flex-wrap: wrap;
  justify-content: center;
}

.category-page-content .vip-cards-section .vip-card {
  flex: 1 0 calc(16.66667% - 33.5px);
  max-width: calc(16.66667% - 33.5px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  border-radius: var(--border-radius-8);
  padding-bottom: 24px;
}

.category-page-content .vip-cards-section .vip-card:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: calc(100% - 66px);
  width: 100%;
  border-radius: var(--border-radius-8);
  background: linear-gradient(
    0deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-section) 95.72%
  );
  z-index: -1;
}

.category-page-content .vip-cards-section .vip-card:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: calc(100% - 66px);
  width: 100%;
  border-radius: var(--border-radius-8);
  z-index: -1;
  border: 2px solid;
  border-style: none solid;
  border-color: rgba(255, 255, 255, 0.1);
}

.category-page-content .vip-cards-section .vip-card img.badge-icon {
  height: 128px;
  width: 128px;
  object-fit: contain;
  margin-bottom: 16px;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25))
    drop-shadow(0px 0px 30px #d1834c);
  z-index: 1;
}

.category-page-content .vip-cards-section .vip-card.Silver img.badge-icon {
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25))
    drop-shadow(0px 0px 30px #9aa9b4);
}

.category-page-content .vip-cards-section .vip-card.Gold img.badge-icon {
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25))
    drop-shadow(0px 0px 30px #fccd07);
}

.category-page-content .vip-cards-section .vip-card.Platinum img.badge-icon {
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25))
    drop-shadow(0px 0px 30px #b3b7be);
}

.category-page-content .vip-cards-section .vip-card.Diamond img.badge-icon {
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25))
    drop-shadow(0px 0px 30px #6987ce);
}

.category-page-content .vip-cards-section .vip-card.VIP img.badge-icon {
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25))
    drop-shadow(0px 0px 30px #68d9a8);
}

.category-page-content .vip-cards-section .vip-card img.vector-bg {
  position: absolute;
  z-index: 0;
  top: 66px;
  width: calc(100% + 38px);
  max-width: unset;
}

.category-page-content .vip-cards-section .vip-card h3 {
  font-size: 24px;
  text-transform: uppercase;
  font-weight: 800;
  font-family: "Poppins", sans-serif;
  line-height: 130%;
  color: #e7a374;
  z-index: 1;
}

.category-page-content .vip-cards-section .vip-card.Silver h3 {
  color: #8ba9be;
}

.category-page-content .vip-cards-section .vip-card.Gold h3 {
  color: #b1994f;
}

.category-page-content .vip-cards-section .vip-card.Platinum h3 {
  color: #a7abb1;
}

.category-page-content .vip-cards-section .vip-card.Diamond h3 {
  color: #a8b9fd;
}

.category-page-content .vip-cards-section .vip-card.VIP h3 {
  color: #bbfed3;
}

.category-page-content .vip-cards-section .vip-card ul {
  margin-top: 24px;
  text-align: center;
  width: 100%;
  padding: 0 32px;
}

.category-page-content .vip-cards-section .vip-card ul li {
  padding: 20px 0;
  border-bottom: 1px solid rgba(217, 217, 217, 0.3);
}

.category-page-content .vip-cards-section .vip-card ul li:last-child {
  border-bottom: 0;
}

.category-page-content .vip-cards-section .vip-card ul li h2 {
  color: var(--font-color-active);
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.6px;
  line-height: 115%;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.category-page-content .vip-cards-section .vip-card ul li span {
  color: var(--font-color);
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  line-height: 130%;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  .scroll-wrapper {
  max-width: 100% !important;
}

.gamestage-wrapper-new-skin .casino_search-widget {
  margin: 24px 0;
}

.promo-page .bottom-logos {
  margin-top: 56px;
}

.category-page-content .section-box.tab-box {
  width: 100%;
}

.category-page-content .section-box.tab-box:before,
.category-page-content .section-box.tab-box {
  border-radius: 20px 20px 8px 8px;
}

.category-page-content .section-box .tab {
  position: relative;
  z-index: 1;
  margin: -24px -24px 0;
  display: flex;
  width: calc(100% + 48px);
  align-items: center;
  height: 42px;
  border-bottom: 2px solid rgba(255, 255, 255, 0.1);
}

.category-page-content .section-box .tab button {
  flex: 1 0 50%;
  background: var(--button-primary-bg-gradient);
  color: #ffffff;
  letter-spacing: -0.32px;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 600;
}

.category-page-content .section-box .tab button:first-child {
  border-radius: 20px 0 0 0;
}

.category-page-content .section-box .tab button:last-child {
  border-radius: 0 20px 0 0;
}

.category-page-content .section-box .tab button.active {
  background: var(--button-secondary-bg-gradient);
}

.komp-page .kompTabContent {
  display: none;
}

.komp-page .kompTabContent.active {
  display: flex;
  flex-direction: column;
  z-index: 1;
  position: relative;
}

.komp-page .kompTabContent .komptab-desc {
  width: calc(100% + 44px);
  margin-left: -22px;
  padding: 24px 0;
  margin-bottom: 8px;
}

.komp-page .kompTabContent .komp-progress {
  margin-top: 32px;
}

.komp-page .kompTabContent .komp-progress-bg {
  height: 40px;
  background: var(--panel-bg-color) !important;
  border-radius: var(--border-radius-8);
  padding: 12px;
  margin-bottom: 10px;
}

.komp-page .kompTabContent .komp-progress-bg .komp-progress-wrapper {
  width: var(--prog);
  display: flex;
  gap: 10px;
  height: 100%;
}

.komp-page .kompTabContent .komp-progress-bg .komp-progress-wrapper .long-line {
  height: 100%;
  width: 100%;
  border-radius: 2px;
  background: var(--button-primary-bg-gradient);
  flex: 1 1 auto;
}

.komp-page
  .kompTabContent
  .komp-progress-bg
  .komp-progress-wrapper
  .short-line {
  height: 100%;
  width: 100%;
  border-radius: 2px;
  background: var(--button-primary-bg-gradient);
  flex: 1 0 12px;
}

.komp-page .kompTabContent .komp-progress h5 {
  font-size: 15px;
  font-weight: 700;
  color: var(--font-color-active);
  text-transform: uppercase;
  line-height: 22px;
}

.komp-page .register-button {
  margin: 48px 0 16px;
}

.komp-page .kompTabContent .komp-rate {
  text-align: center;
}

.komp-page .kompTabContent .komp-rate h3 {
  color: var(--font-color-active);
  line-height: 130%;
  letter-spacing: -0.48px;
  font-size: 24px;
  font-weight: 800;
  text-transform: uppercase;
  filter: drop-shadow(0px 0px 10px #6254ab);
}

.komp-page .card-box-section {
  margin: 8px 0 56px;
}

.raffle-tickets-header .raffle-tickets-title,
.raffle-rewards-header .raffle-rewards-title {
  text-align: center;
  font-size: 24px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--font-color-active);
  margin-bottom: 24px;
}

.raffle-tickets-header .raffle-tickets-tab-filters,
.raffle-rewards-header .raffle-rewards-tab-filters {
  display: flex;
  gap: 16px;
  align-items: center;
}

.raffle-tickets-header .raffle-tickets-tab-filters .raffle-tickets-tab-search,
.raffle-rewards-header .raffle-rewards-tab-filters .raffle-rewards-tab-search {
  position: relative;
}

.raffle-tickets-header
  .raffle-tickets-tab-filters
  .raffle-tickets-tab-search-input,
.raffle-rewards-header
  .raffle-rewards-tab-filters
  .raffle-rewards-tab-search-input {
  background: var(--bg-input) !important;
  border: var(--border-input) !important;
  border-radius: var(--border-radius-10);
  padding: 0 14px;
  font-size: 14px;
  height: 40px;
  font-weight: 600;
  width: 300px;
}

.raffle-tickets-header
  .raffle-tickets-tab-filters
  .raffle-tickets-tab-search-icon,
.raffle-rewards-header
  .raffle-rewards-tab-filters
  .raffle-rewards-tab-search-icon {
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #254324;
  background: rgba(57, 173, 74, 0.6);
  padding: 5px;
  border-radius: 50%;
  position: absolute;
}

.table-system thead th {
  padding-bottom: 12px;
}

.table-system tbody tr:not(.hide) td,
.table-system tbody tr:not(.show) td {
  color: var(--color-button);
}

.table-system tbody tr:not(.hide) td:first-child {
  padding-left: 24px;
  border-top-left-radius: 8px;
  border-bottom-left-radius: var(--border-radius-8);
}

.table-system tbody tr:not(.hide) td:last-child {
  padding-right: 8px;
  border-top-right-radius: var(--border-radius-8);
  border-bottom-right-radius: var(--border-radius-8);
}

.table-system tbody tr:nth-child(even) td {
  background: var(--panel-bg-color) !important;
}

#modernSkin.main-wrapper
  .layout-wrapper
  #app_left_navigation.shrink
  .menu-container
  .accordion-container
  button:hover
  span {
  left: 0;
  margin-left: 64px;
  padding-right: 12px;
  padding-left: 12px;
  position: fixed;
  width: auto;
  background: rgba(92, 79, 161, 0.8) !important;
  border-top-right-radius: var(--border-radius-4);
  border-bottom-right-radius: var(--border-radius-4);
  height: 56px !important;
  padding-top: 0 !important;
  display: flex !important;
  align-items: center;
}

.tournament-list-wrapper {
  padding: 0 !important;
  margin: 0 0 48px 0 !important;
  max-width: 100% !important;

  & .tournament-list-container {
    gap: 24px;
    margin: 0 !important;

    & .tournament-list-item-status-container {
      flex: 0 0 100%;

      & .tournament-list-item-status {
        font-size: 20px;
        color: var(--font-color-active);
        text-transform: uppercase;
        font-weight: 700;
      }
    }

    & .tournament-list-column {
      flex: 0 0 calc((100% / 2) - 12px);
      padding: 0 !important;

      & .tournament-list-item {
        border-radius: var(--border-radius-16);
        filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
        border: 2px solid var(--border-color);
        position: relative;
        background-image: var(--tournamentItemBG);

        &:before {
          content: "";
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          background: linear-gradient(
            168deg,
            rgba(52, 91, 47, 0.5) 1.62%,
            rgba(26, 50, 28, 0) 95.72%
          );
          border-radius: var(--border-radius-16);
          mix-blend-mode: lighten;
        }

        & .tournament-status,
        & .tournament-name.outer {
          display: none;
        }

        & .tournament-item-detail-panel {
          height: 100%;
          align-items: center;
          padding: 24px 24px 48px;
          gap: 24px;
          flex-wrap: nowrap;

          & .tournament-panel-data,
          & .tournament-panel-leaderboard {
            padding: 16px;
            border-radius: var(--border-radius-8);
            box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
            position: relative;
            background: var(--bg-section) !important;

            &:before {
              content: "";
              position: absolute;
              top: 0;
              left: 0;
              height: 100%;
              width: 100%;
              background: linear-gradient(
                168deg,
                #345b2f 1.62%,
                #1a321c 95.72%
              );
              filter: opacity(0.6);
              border-radius: var(--border-radius-8);
              z-index: -1;
            }

            & .tournament-name.inner {
              font-size: 18px;
              font-weight: 700;
            }

            & .tournament-panel-data-item {
              display: flex;
              justify-content: space-between;
              gap: 16px;

              & .item-value {
                font-weight: 700;

                & img {
                  display: none;
                }
              }

              &.prize-pool {
                margin-top: 8px;
              }
            }

            & .tournament-items-action {
              margin-top: 16px;

              & button {
                width: fit-content !important;
                padding: 0 40px !important;
                border-radius: var(--border-radius-4) !important;
                background: var(--button-primary-bg-gradient) !important;
                box-shadow: var(--button-primary-box-shadow);
                letter-spacing: normal !important;
                color: var(--color-button) !important;
                font-family: "Poppins", sans-serif;
                font-size: 16px !important;
                font-weight: 700;
                height: 37px !important;
              }
            }

            & .tournament-item-leaderboard-title {
              font-size: 16px;
              font-weight: 700;
            }

            & .table-responsive {
              & table {
                & th {
                  background: var(--panel-bg-color) !important;
                  color: var(--color-text-table) !important;

                  &:first-child {
                    border-radius: 4px 0 0 4px;
                  }

                  &:last-child {
                    border-radius: 0 4px 4px 0;
                  }
                }

                & tr {
                  &:nth-child(odd) {
                    & td {
                      background: var(--panel-bg-color) !important;

                      &:first-child {
                        border-radius: 4px 0 0 4px;
                      }

                      &:last-child {
                        border-radius: 0 4px 4px 0;
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}

.tournament-view-modal,
.tournament-result-modal {
  .modal-dialog-centered {
    max-width: 600px;

    & .modal-content {
      min-height: fit-content;
      padding: 32px !important;

      & .modal-header {
        & .close i {
          display: none;
        }
      }

      & .modal-body {
        background: linear-gradient(168deg, #223a1f 1.62%, #0b170c 95.72%);
        border-radius: var(--border-radius-8);
        mix-blend-mode: plus-lighter;
        padding: 16px 24px 24px;

        & .tournament-preview-container,
        &.modal-padding-top {
          background: rgb(35, 31, 61) !important;

          & .title {
            font-size: 24px;
            font-weight: 700;
            color: #ffffff;
            text-align: center;
            margin-bottom: 16px;
          }

          & .tournament-image {
            margin-bottom: 16px;
            position: relative;

            &:before {
              content: "";
              position: absolute;
              left: 0;
              top: 0;
              width: 100%;
              height: 100%;
              background: linear-gradient(
                168deg,
                rgba(52, 91, 47, 0.5) 1.62%,
                rgba(26, 50, 28, 0) 95.72%
              );
              border-radius: var(--border-radius-16);
              mix-blend-mode: lighten;
              z-index: 1;
            }

            & img {
              width: 100%;
              border-radius: var(--border-radius-16);
              filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
              border: 2px solid var(--border-color);
            }
          }

          & .tournament-preview-detail-panel,
          & .tournament-view-result-wrapper {
            & .base-time-ticker {
              gap: 8px;
              margin-bottom: 16px;

              & p {
                background: var(--button-primary-bg-gradient) !important;
                padding: 8px 12px;
                border-radius: var(--border-radius-4);
                color: #ffffff;
              }
            }

            & .tournament-view-details,
            & .tournament-top-player {
              background: rgba(92, 79, 161, 0.8) !important;
              border: 2px solid rgba(255, 255, 255, 0.1);
              border-radius: var(--border-radius-8);
              padding: 8px 16px;
              display: flex;
              flex-direction: column;
              gap: 8px;

              & .tournament-view-details-item,
              & > div {
                display: flex;
                justify-content: space-between;
                color: #ffffff;

                & span {
                  &:last-child {
                    font-weight: 700;
                  }

                  & img {
                    display: none;
                  }
                }
              }
            }

            & .table-responsive {
              margin-top: 24px;

              & table {
                & th {
                  background: rgba(92, 79, 161, 0.8) !important;
                  color: var(--color-text-table) !important;
                  padding: 8px 16px;

                  &:first-child {
                    border-radius: 8px 0 0 8px;
                  }

                  &:last-child {
                    border-radius: 0 8px 8px 0;
                  }
                }

                & tr {
                  & td {
                    color: var(--font-color-active);
                    padding: 8px 16px;
                  }

                  &:nth-child(odd) {
                    & td {
                      background: rgba(92, 79, 161, 0.8) !important;
                      color: var(--color-button);

                      &:first-child {
                        border-radius: 8px 0 0 8px;
                      }

                      &:last-child {
                        border-radius: 0 8px 8px 0;
                      }
                    }
                  }
                }
              }
            }
          }

          & .tournament-summary {
            margin: 16px 0;
          }

          & .read-more-btn {
            width: fit-content !important;
            padding: 0 64px !important;
            border-radius: var(--border-radius-4) !important;
            background: var(--button-primary-bg-gradient) !important;
            box-shadow: var(--button-primary-box-shadow);
            letter-spacing: normal !important;
            color: var(--color-button) !important;
            font-family: "Poppins", sans-serif;
            font-size: 16px !important;
            font-weight: 700;
            height: 37px !important;
          }
        }
      }
    }
  }
}

.tournament-view-wrapper {
  max-width: 100% !important;

  & .container-fluid {
    padding: 0;

    & .tournament-view-modern-wrapper {
      position: relative;

      & .banner-title-panel {
        --tournamentViewTitleBG: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/banners/fast-games-hero.webp);
        background-image: var(--tournamentViewTitleBG);
        height: 400px;
        background-repeat: no-repeat;
        background-size: cover;
        border-radius: var(--border-radius-16);
        filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
        border: 2px solid var(--border-color);
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;

        &:before {
          content: "";
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          background: var(--bg-modal-color);
          border-radius: var(--border-radius-16);
          mix-blend-mode: lighten;
        }

        & .tournament-name {
          font-size: 32px;
          font-weight: 700;
          color: #ffffff;
          padding: 16px;
          border-radius: var(--border-radius-8);
          box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
          position: relative;

          &:before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            background: rgb(54 17 106 / 95%) !important;
            filter: opacity(0.4);
            border-radius: var(--border-radius-8);
            z-index: -1;
          }
        }
      }

      & .data-panel,
      & .leaderboard-panel {
        margin-top: 32px;
        background: rgba(92, 79, 161, 0.2) !important;
        padding: 24px 24px 0;
        border-radius: var(--border-radius-16);
        border: 2px solid var(--border-color);
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);

        & .tournament-view-title-panel {
          position: absolute;
          top: 24px;
          right: 24px;
          text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
          line-height: 120%;
          padding: 8px;
          background: var(--button-secondary-bg-gradient);
          border-radius: var(--border-radius-4);
          color: var(--color-button);
          font-weight: 700;
          text-transform: uppercase;

          & .tournament-title {
            display: none;
          }
        }

        & .tournament-view-image {
          display: none;
        }

        & .tournament-timer-detail-panel {
          & .base-time-ticker {
            gap: 8px;
            margin-bottom: 24px;

            & p {
              background: var(--button-primary-bg-gradient);
              padding: 8px 12px;
              border-radius: var(--border-radius-8);
              color: #ffffff;
            }
          }

          & .tournament-prize-pool {
            & img {
              display: none;
            }

            & > div {
              width: 30%;
              display: flex;
              border-radius: 16px 16px 0 0;
              justify-content: space-between;
              padding: 16px 16px 8px;
              color: #ffff;
              background: var(--bg-section) !important;
              mix-blend-mode: plus-lighter;

              & .tournament-prize-pool-amount {
                font-weight: 700;
              }
            }
          }
        }

        & .tournament-view-details {
          width: 30%;
          display: flex;
          flex-direction: column;
          background: var(--bg-section) !important;
          mix-blend-mode: plus-lighter;
          border-style: none solid solid solid;
          border-radius: 0 0 16px 16px;
          padding-bottom: 8px;

          & .tournament-view-details-item {
            display: flex;
            justify-content: space-between;
            padding: 8px 16px;
            color: #ffff;

            & span {
              &:last-child {
                font-weight: 700;
              }
            }
          }
        }

        & .tournament-view-myrank-wrapper,
        & .tournament-view-leaderboard-wrapper {
          margin: 24px 0;

          & .table-responsive {
            & table {
              & th {
                background: rgba(92, 79, 161, 0.2) !important;
                color: var(--color-text-table) !important;
                padding: 8px 16px;

                &:first-child {
                  border-radius: 8px 0 0 8px;
                }

                &:last-child {
                  border-radius: 0 8px 8px 0;
                }
              }

              & tr {
                & td {
                  color: var(--font-color-active);
                  padding: 8px 16px;
                }

                &:nth-child(odd) {
                  & td {
                    background: rgba(92, 79, 161, 0.2) !important;
                    color: var(--color-button);

                    &:first-child {
                      border-radius: 8px 0 0 8px;
                    }

                    &:last-child {
                      border-radius: 0 8px 8px 0;
                    }
                  }
                }
              }
            }
          }
        }

        & .tournament-view-description,
        & .tournament-view-games,
        & .tournament-panel,
        & .tournament-previous-container {
          margin-bottom: 24px;

          & .description-title,
          & .tournament-view-games-title,
          & .tournament-leaderboard-title,
          & .title {
            font-size: 20px;
            font-weight: 700;
            color: #ffffff;
            margin-bottom: 16px;
          }

          & .tournament-view-games-article {
            & .tournament-view-games-article-header {
              h1 {
                font-size: 16px;
                font-weight: 700;
                color: #ffffff;
                margin-bottom: 16px;
                text-transform: uppercase;
              }
            }

            & .tournament-view-games-article-thumbnails {
              margin-bottom: 24px;
              display: grid;
              grid-template-columns: repeat(8, 1fr);
              gap: 24px;

              &.sports {
                grid-template-columns: repeat(4, 1fr);

                & img {
                  position: relative;
                }

                & img::after {
                  content: "\26AC";
                  display: block;
                  position: absolute;
                  top: 0;
                  left: 0;
                  height: 20px;
                  width: 16px;
                  padding: 0px 0px 0px 5px;
                  background: var(--bg-section);
                }
              }

              & .base-game-card {
                & img {
                  width: 100%;
                }
              }
            }

            & .tournament-view-games-article-button {
              text-align: center;

              & button {
                width: fit-content !important;
                padding: 0 64px !important;
                border-radius: var(--border-radius-4) !important;
                background: var(--button-primary-bg-gradient) !important;
                box-shadow: var(--button-primary-box-shadow);
                letter-spacing: normal !important;
                color: var(--color-button) !important;
                font-family: "Poppins", sans-serif;
                font-size: 16px !important;
                font-weight: 700;
                height: 37px !important;
                text-transform: uppercase;
              }
            }
          }

          & .tournament-previous-panel {
            background-image: var(--prevTournamentBG);
            width: 40%;
            height: 300px;
            background-repeat: no-repeat;
            background-size: cover;
            border-radius: var(--border-radius-16);
            filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
            border: 2px solid #345b2f;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 36px;
            padding: 24px;
            position: relative;

            &:before {
              content: "";
              position: absolute;
              left: 0;
              top: 0;
              width: 100%;
              height: 100%;
              background: linear-gradient(
                168deg,
                rgba(52, 91, 47, 0.5) 1.62%,
                rgba(26, 50, 28, 0) 95.72%
              );
              border-radius: var(--border-radius-16);
              mix-blend-mode: lighten;
              z-index: -1;
            }

            & .previous-tournament-name {
              font-size: 20px;
              font-weight: 700;
              color: #ffffff;
              padding: 16px;
              border-radius: var(--border-radius-8);
              box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
              position: relative;

              &:before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                height: 100%;
                width: 100%;
                background: linear-gradient(
                  168deg,
                  #345b2f 1.62%,
                  #1a321c 95.72%
                );
                filter: opacity(0.4);
                border-radius: var(--border-radius-8);
                z-index: -1;
              }
            }

            & button {
              width: fit-content !important;
              padding: 0 64px !important;
              border-radius: var(--border-radius-4) !important;
              background: var(--button-primary-bg-gradient) !important;
              box-shadow: var(--button-primary-box-shadow);
              letter-spacing: normal !important;
              color: var(--color-button) !important;
              font-family: "Poppins", sans-serif;
              font-size: 16px !important;
              font-weight: 700;
              height: 37px !important;
            }
          }
        }

        & .tournament-panel {
          & button {
            margin-top: 24px;
            width: fit-content !important;
            padding: 0 16px !important;
            border-radius: var(--border-radius-4) !important;
            background: linear-gradient(
              180deg,
              #50bf7c 0%,
              #275d3c 100%
            ) !important;
            box-shadow: var(--button-secondary-box-shadow);
            letter-spacing: normal !important;
            color: var(--color-button) !important;
            font-family: "Poppins", sans-serif;
            font-size: 16px !important;
            font-weight: 700;
            height: 37px !important;
            text-transform: uppercase;
          }
        }
      }
    }
  }
}

.category-page-content.vip-page {
  & .section-box:not(.card-box) {
    & p {
      max-width: 63%;
    }
  }
}

.category-page-content.aboutus-page {
  margin-bottom: 32px;

  & .section-box:not(.card-box) {
    margin: 24px 0 32px;

    & p {
      &:not(:last-child) {
        margin: 0 0 24px;
      }
    }
  }

  & .section-header {
    display: inline-block;
    width: 100%;
    margin-bottom: 16px;

    & h4 {
      text-align: center;
      color: var(--color-header);
      font-family: "Poppins", sans-serif;
      font-size: 24px;
      text-transform: uppercase;
      font-weight: 800;
      letter-spacing: -0.48px;
    }
  }

  & .card-box-section {
    margin: 24px 0;

    &.grid3 {
      grid-template-columns: repeat(3, 1fr);
    }

    & .card-box-details {
      & ul {
        margin: 24px 0 0 0;
        list-style: disc;
        padding-left: 24px;

        & li {
          font-weight: 700;
        }
      }
    }
  }
}

.category-page-content.privacypolicy-page {
  margin-bottom: 32px;

  & .section-box:not(.card-box) {
    margin: 24px 0 0;

    & p {
      &:not(:last-child) {
        margin: 0 0 24px;
      }

      & a {
        position: relative;
      }
    }

    & ul {
      text-align: center;
      margin: 0 0 24px 0;
      list-style: disc;
      list-style-position: inside;

      & li {
        font-weight: 700;
        font-size: 16px;

        &.li-header {
          list-style: none;
        }
      }
    }
  }
}

.category-page-content.faq-page {
  margin-bottom: 32px;

  & .section-box:not(.card-box) {
    margin: 24px 0 0;

    & p {
      &:not(:last-child) {
        margin: 0 0 24px;
      }

      & a {
        position: relative;
      }
    }

    & ul {
      text-align: center;
      margin: 0 0 24px 0;
      list-style: decimal;
      list-style-position: inside;

      & li {
        font-weight: 700;
        font-size: 16px;
      }
    }
  }
}

*[lang="ko"] body,
*[lang="ko"] a,
*[lang="ko"] p,
*[lang="ko"] span,
*[lang="ko"] button,
*[lang="ko"] h1,
*[lang="ko"] h2,
*[lang="ko"] h3,
*[lang="ko"] h4,
*[lang="ko"] h5,
*[lang="ko"] h6 {
  font-family: "Noto Sans KR", sans-serif !important;
}

.game-provider-wrapper span .game-provider-list {
  display: grid;
  grid-auto-flow: column;
  scroll-behavior: smooth;
  overflow: hidden;
  -ms-overflow-style: none;
  width: 100%;
  align-items: center;
  grid-auto-columns: calc(calc(100% - 84px) / 9) !important;
  gap: 0 10px !important;
  margin-bottom: 20px;
}

.game-provider-wrapper span .game-provider-list .game-provider-list-item {
  height: 64px !important;
  padding: 10px 15px !important;
  position: relative;
  overflow: hidden;
  border-radius: 5px;
  opacity: 0.5;
  background: var(--bg-list-image-item);
  mix-blend-mode: multiply;
}

.game-provider-wrapper span .game-provider-list .game-provider-list-item:hover {
  opacity: 1;
}

.game-provider-wrapper span .game-provider-list .game-provider-list-item img {
  object-fit: contain;
  height: 100%;
  width: 100%;
}

.game-lobby-renderer
  .game-lobby-renderer-card
  .game-lobby-renderer-card-buttons {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  align-items: center;
  justify-content: center;
  z-index: 4;
  opacity: 0;
  transition: all 0.2s ease-in-out;
  top: 0px !important;
}

.game-lobby-renderer
  .game-lobby-renderer-card:hover
  .game-lobby-renderer-card-buttons {
  opacity: 1;
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-body) 95.72%
  );
  border-radius: var(--border-radius-8);
}

.game-lobby-renderer
  .game-lobby-renderer-card
  .game-lobby-renderer-card-buttons
  button:nth-child(1) {
  content: "";
  background-position: center;
  background-size: cover;
  font-size: 0 !important;
  background-image: url(https://sgp1.digitaloceanspaces.com/wnkstg/DOSLJO/assets/gifs/onebet-playbutton.gif);
  height: 66%;
  width: 72%;
  background-repeat: no-repeat;
  filter: opacity(0.75);
}

.game-lobby-renderer .game-lobby-renderer-card.default:hover {
  transform: scale(0.95) !important;
}

#wallet .wallet-tabs .nav-tab-system-horizontal .nav-tabs:before,
#bets .bets-tabs .nav-tab-system-horizontal .nav-tabs:before,
#bonuses .bonuses-tabs .nav-tab-system-horizontal .nav-tabs:before,
#komp-system .nav-tab-system-horizontal .nav-tabs:before,
#referral .nav-tab-system-horizontal .nav-tabs:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: 70px;
  left: 0;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.5) 50.4%,
    rgba(255, 255, 255, 0) 96.77%
  );
  filter: opacity(0.6);
}

#wallet .wallet-tabs .nav-tab-system-horizontal .nav-tabs:after,
#bets .bets-tabs .nav-tab-system-horizontal .nav-tabs:after,
#bonuses .bonuses-tabs .nav-tab-system-horizontal .nav-tabs:after,
#komp-system .nav-tab-system-horizontal .nav-tabs:after,
#referral .nav-tab-system-horizontal .nav-tabs:after {
  content: "";
  position: absolute;
  top: 71px;
  left: 0;
  height: 56px;
  width: 100%;
  background: radial-gradient(
    50% 128.57% at 50% -36.61%,
    #f7f7f7 0%,
    rgb(226 220 255 / 20%) 25.67%,
    rgba(98, 84, 171, 0) 100%
  );
}

.dropdown-menu.datepicker-orient-left {
  background: rgba(92, 79, 161, 1) !important;
  border: 0;
}

.datepicker-dropdown.datepicker-orient-top:after {
  border-top: 6px solid #5c4fa1d9;
}

.datepicker-dropdown.datepicker-orient-top:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 4px;
  width: calc(100% - 8px);
  background: linear-gradient(
    168deg,
    rgba(35, 31, 61, 0) 1.62%,
    var(--bg-section) 95.72%
  );
  height: calc(100% - 8px);
  border-radius: var(--border-radius-8);
  z-index: -1;
}

.mobile-menu #mobile-menu-items #language-w {
  margin: 0;
}

.article-main-content .article-content h5 {
  font-size: 24px;
  text-transform: uppercase;
  color: var(--color-header);
  margin: 16px 0;
  font-weight: 700;
  text-align: center;
}

.article-main-content .article-content .accordion-container {
  margin-bottom: 20px;
  box-shadow:
    0 2px 4px #00000024,
    0 3px 4px #0000001f,
    0 1px 5px #0003;
}

.article-content .accordion-container .accordion {
  display: flex;
  align-items: center;
  background: var(--button-primary-bg-gradient);
  width: 100%;
  position: relative;
  justify-content: space-between;
  padding: 9px 20px 9px 20px;
  font-size: 16px;
  cursor: pointer;
}

.article-content .accordion-container .accordion.active,
.article-content .accordion-container .accordion:hover {
  background: var(--button-secondary-bg-gradient);
}

.article-content .accordion-container .accordion i {
  transition: all 0.3s ease;
}

.article-content .accordion-container .accordion.active i {
  transform: rotate(180deg);
}

.article-content .accordion-container .panel {
  padding: 20px 8%;
  background: transparent;
  text-align: justify;
}

.article-main-content .article-content .accordion-container div table {
  width: 100%;
  text-align: center;
}

.footer-social-links .social-links-item a {
  display: flex;
  align-items: center;
}

.footer-social-links .social-links-item a span {
  width: 0;
  pointer-events: none;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.footer-social-links .social-links-item:first-child a:hover span {
  width: 103px;
}

.footer-social-links .social-links-item a:hover span {
  padding: 0px 0px 0px 8px;
  width: 45px;
  opacity: 1;
}

.side-menu .scroll-section .language-w {
  display: none;
}

.category-page-content .section-box .tab button {
  height: 100%;
}

.mobile-menu #mobile-menu-items li .menu:after {
  display: block;
  content: " ";
  width: 3.5em;
  height: 3.5em;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 20px;
  z-index: -2;
  background: var(
    --BG-Gradient,
    linear-gradient(180deg, #282249 1.62%, rgba(40, 34, 73, 0.8) 95.72%)
  );
  transition: all 0.3s ease;
  opacity: 0;
}

.mobile-menu #mobile-menu-items li .menu.active:after {
  transform: scale3d(8.5, 7.5, 1);
  transition-timing-function: cubic-bezier(0.68, 1.55, 0.265, 1);
  opacity: 1;
}

/* 01/28/25 Bugs*/

/* When checking for bet details, the expanded details immediately closes */
.report .transaction-history-table .bet-details-header.collapse,
.report .transaction-history-table .bet-details.collapse {
  visibility: visible;
}

.sport-bet .transaction-history-table table tr.bet-header.collapsed td span i {
  transform: rotate(0deg);
  transition: 0.2s all ease-in;
}

.sport-bet .transaction-history-table table tr.bet-header td span i {
  transform: rotate(180deg);
  transition: 0.2s all ease-in;
}

.report.sport-bet .transaction-history-table table.table-casino thead {
  height: 65px;
}

.report.sport-bet .transaction-history-table table.table-casino tbody td {
  height: 54px;
}

/* Cursor should look clickable On Hover on the active referrals icon  */
.user-referral-commission-history-monthly
  .table-system-header.table-system
  tbody
  tr
  td.money
  a:hover {
  cursor: pointer;
}

/*Missing close toggle for pop-up modal */
.user-referral-ch-monthly-details-body.modal-body .btn-close-icon {
  width: 24px;
  height: 24px;
  display: block;
}

.user-referral-ch-monthly-details-body.modal-body .table-system-header {
  margin-top: 48px;
}

.user-referral-ch-monthly-details-body.modal-body .btn-close-icon:before {
  content: "";
  background-image: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/icons/modal-close.svg);
  height: 100%;
  width: 100%;
  background-size: var(--icon-contain);
  background-position: var(--icon-position);
  display: var(--icon-display);
  vertical-align: middle;
}

body.modal-user-profile-open:before {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: #000;
  opacity: 0.95;
  transition: opacity 0.15s linear;
  content: " ";
}

/*No sportsbook icon */
.active-bonuses-tab
  .active-bonus-item
  .icomoon-desktop
  span.icon-basketball1:before {
  content: "\E92F";
  font-family: "icomoon" !important;
}

.available-bonuses-tab
  .available-bonus-item
  .icon-section-wrapper
  .icon-basketball1:before {
  content: "\E92F";
  font-family: "icomoon" !important;
}

/* Cancel button style */

.casino_search-widget
  .new-skin-modal-mask
  .new-skin-modal-wrapper
  .new-skin-modal-container {
  margin: 65px auto 0 !important;
}

#modernSkin .casino_search-widget .casino-search-modal-header button {
  background: var(--button-primary-bg-gradient) !important;
  padding: 8px 16px !important;
  letter-spacing: normal !important;
  font-weight: 700;
  border-radius: 4px;
}

#modernSkin .casino_search-widget .casino-search-modal-header button:hover {
  background: var(--button-secondary-bg-gradient) !important;
}

/*Improve visibility for Category ( Casino/Sports ) and (Latest Bets and High Rollers ) tabs by changing to buttons */

.gamestage-wrapper-new-skin
  #gamestage_floor_after
  #leaderboard-table
  .leaderboard-selector-wrapper
  button {
  background: var(--button-primary-bg-gradient) !important;
  padding: 8px 16px !important;
}

.gamestage-wrapper-new-skin
  #gamestage_floor_after
  #leaderboard-table
  .leaderboard-selector-wrapper
  button.active,
.gamestage-wrapper-new-skin
  #gamestage_floor_after
  #leaderboard-table
  .leaderboard-selector-wrapper
  button:hover {
  background: var(--button-secondary-bg-gradient) !important;
}

.gamestage-wrapper-new-skin
  #gamestage_floor_after
  #leaderboard-table
  .leaderboard-selector-wrapper
  button.active
  span,
.gamestage-wrapper-new-skin
  #gamestage_floor_after
  #leaderboard-table
  .leaderboard-selector-wrapper
  button:hover
  span {
  color: #fff !important;
  font-size: 16px !important;
}

.gamestage-wrapper-new-skin
  #gamestage_floor_after
  #leaderboard-table
  #aggridTable
  .ag-root-wrapper
  .ag-layout-auto-height
  .ag-row-not-inline-editing
  .ag-cell-not-inline-editing
  img {
  display: none !important;
}

/* */
/* End 01/28/25 Bugs*/

/* Referral Page*/
.referral-page {
  .section-hero {
    display: flex;
    align-items: start;
    margin-bottom: -48px;

    .left-box {
      text-align: center;
      flex: 0 0 65%;
      padding: 0 24px;

      h2 {
        color: var(--color-header);
        font-size: 32px;
        font-weight: 800;
        margin-bottom: 32px;
      }

      h6 {
        font-size: 16px;
        text-transform: uppercase;
        font-weight: 600;
        color: var(--color-header);
        margin-bottom: 12px;
      }

      p,
      span {
        font-size: 16px;
        text-align: center;
        margin: 0 auto;
        line-height: 24px;
      }

      .register-container {
        display: flex;
        flex-direction: column;
        margin-top: 48px;

        button {
          font-weight: 700;
          background: var(--button-primary-bg-gradient);
          font-family: "Poppins", sans-serif;
          transition: 0.3s;
          padding: 8px 16px;
          border-radius: 4px;
          text-transform: uppercase;
        }

        button:hover {
          background: var(--button-secondary-bg-gradient);
        }

        span {
          margin-top: 16px;
        }
      }

      &.w-50 {
        flex: 0 0 50%;
      }
    }

    .right-box {
      flex: 0 0 35%;

      &.w-50 {
        flex: 0 0 50%;
      }
    }

    &.htu {
      margin-bottom: 24px;
      margin-top: 64px;
      align-items: center;

      h4 {
        text-align: center;
        color: var(--color-header);
        font-family: "Poppins", sans-serif;
        font-size: 24px;
        text-transform: uppercase;
        font-weight: 800;
        letter-spacing: -0.48px;
        margin-bottom: 32px;
      }

      ul {
        list-style: disc;
        list-style-position: inside;

        li:not(:last-child) {
          margin-bottom: 16px;
        }

        & p {
          & span {
            color: var(--font-color-active);
          }
        }
      }
    }
  }

  .section-box {
    &.two-col {
      display: flex;
      align-items: stretch;

      .left-col,
      .right-col {
        flex: 0 0 50%;
        display: flex;
        flex-direction: column;
        position: relative;
        justify-content: space-around;

        .details-container {
          width: 50%;

          h6 {
            font-size: 16px;
            text-transform: uppercase;
            font-weight: 600;
            color: var(--color-header);
            margin: 16px;
            text-align: center;
          }
        }

        .button-container {
          width: 50%;
          text-align: center;

          button {
            font-weight: 700;
            background: var(--button-primary-bg-gradient);
            font-family: "Poppins", sans-serif;
            text-transform: uppercase;
            padding: 8px 16px;
            border-radius: 4px;
          }

          button:hover {
            background: var(--button-secondary-bg-gradient);
          }
        }

        img {
          position: absolute;
          right: -25px;
          width: 60%;
          top: -36px;
        }
      }

      .commission-paid-banner {
        flex: 0 0 30%;
        max-width: 30%;
      }

      .commission-paid-wrapper {
        flex: 0 0 70%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 32px;

        .commission-paid-progress {
          .progress-bg {
            height: 40px;
            background: var(--panel-bg-color) !important;
            border-radius: 8px;
            padding: 12px;
            margin-bottom: 16px;

            .progress-wrapper {
              width: var(--prog);
              display: flex;
              gap: 10px;
              height: 100%;

              .long-line {
                height: 100%;
                width: 100%;
                border-radius: 2px;
                background: var(--button-secondary-bg-gradient) !important;
                flex: 1 1 auto;
              }

              .short-line {
                height: 100%;
                width: 100%;
                border-radius: 2px;
                background: var(--button-secondary-bg-gradient) !important;
                flex: 1 0 12px;
              }
            }
          }

          .commission-paid-details {
            display: flex;
            justify-content: space-between;
            align-items: center;

            h2 {
              color: var(--color-header);
              font-family: "Poppins", sans-serif;
              font-size: 24px;
              text-transform: uppercase;
              font-weight: 800;
              letter-spacing: -0.48px;
            }

            h6 {
              font-size: 16px;
              text-transform: uppercase;
              font-weight: 600;
              color: var(--color-header);
            }
          }
        }
      }

      .commision-conditions {
        padding: 0 48px;
        display: flex;
        flex-direction: column;
        justify-content: center;

        h4 {
          margin-bottom: 24px;
        }
      }

      table {
        width: 100%;

        tr {
          position: relative;

          td {
            font-family: "Poppins", sans-serif;
            font-size: 16px !important;
            text-transform: uppercase;
            color: var(--font-color);
            padding: 0 24px;
            height: 56px;
            position: relative;

            &:last-child {
              text-align: right;
              color: var(--font-color-active);
            }
          }

          &:nth-child(odd) {
            background: var(--panel-bg-color) !important;
            border: 1px solid var(--bg-input-fields-border) !important;

            td {
              &::before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border: 2px solid rgba(255, 255, 255, 0.1);
              }

              &:first-child {
                &::before {
                  border-style: solid none solid solid;
                }
              }

              &:last-child {
                &::before {
                  border-style: solid solid solid none;
                }
              }
            }
          }
        }
      }

      &#referral-promo-details {
        max-height: 300px;

        .left-section {
          display: flex;
          flex-direction: column;
          justify-content: center;

          h6 {
            font-size: 16px;
            text-transform: uppercase;
            font-weight: 600;
            color: var(--color-header);
            margin-top: 48px;
            text-align: center;
          }
        }

        img {
          position: relative;
          right: -80px;
          height: 340px;
          bottom: 64px;
        }
      }
    }

    img.center {
      margin: 0 auto;
      max-height: 300px;
    }
  }

  .section-header {
    display: inline-block;
    width: 100%;
    margin: 40px 0 24px;

    &.no-margin {
      margin: 0;
    }

    h2 {
      color: var(--color-header);
      font-size: 32px;
      font-weight: 800;
      text-align: center;
      font-family: "Poppins", sans-serif;
    }

    h4 {
      text-align: center;
      color: var(--color-header);
      font-family: "Poppins", sans-serif;
      font-size: 24px;
      text-transform: uppercase;
      font-weight: 800;
      letter-spacing: -0.48px;
      margin-bottom: 16px;
    }

    h6 {
      font-size: 16px;
      text-transform: uppercase;
      font-weight: 600;
      color: var(--color-header);
      text-align: center;
    }

    p {
      font-size: 16px;
      text-align: center;
      margin: 0 auto;
      line-height: 24px;

      span {
        color: var(--font-color-active);
      }
    }
  }

  .card-box-section {
    &.grid3 {
      grid-template-columns: repeat(3, 1fr);

      .card-box {
        align-items: center;
        justify-content: center;

        h6 {
          margin-bottom: 0;
        }
      }
    }

    &#money-rewards {
      .card-box {
        .card-box-details {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          gap: 24px;
          width: 100%;

          h2 {
            color: var(--color-header);
            font-size: 32px;
            font-weight: 800;
            text-align: center;
            font-family: "Poppins", sans-serif;
          }
        }
      }
    }
  }
}

/* Referral end */

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  #app_header.main-header-container
  .logo-container
  #brand-logo {
  width: 250px;
  height: 45px;
}

body.logged-in .logged-in {
  display: block;
}

body.logged-in .non-logged-in {
  display: none;
}

/* Tournament Bet Details CSS*/
#tournamentPlayerBetsModal .modal-dialog {
  max-width: 991px;
  width: 100%;
}

#tournamentPlayerBetsModal .modal-dialog .modal-content .modal-header i {
  display: none;
}

#tournamentPlayerBetsModal .tournament-player-bets-report-wrapper {
  display: flex;
  gap: 16px;
  flex-direction: column;
}

#tournamentPlayerBetsModal .tournament-player-bets-report-wrapper .report-title,
#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .tournament-details,
#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .tournament-details
  div {
  display: flex;
}

#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .report-title {
  justify-content: space-between;
  color: var(--font-color-active);
}

#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .tournament-details {
  justify-content: space-evenly;
  gap: 0 8px;
  height: 75px;
}

#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .tournament-details
  div {
  flex-direction: column;
  background: var(--button-primary-bg-gradient);
  justify-content: center;
  flex-grow: 1;
  flex-basis: 0;
  align-items: center;
  color: var(--font-color-active);
  text-align: center;
}

#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .report-title
  span {
  font-size: 24px;
}

#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .table-responsive
  tr
  th {
  border: 0;
  padding: 15px 25px !important;
  color: white;
  font-size: 14px;
  background: rgba(92, 79, 161, 0.2) !important;
  text-wrap: nowrap;
}

#tournamentPlayerBetsModal
  .tournament-player-bets-report-wrapper
  .table-responsive
  tr
  td {
  border: 0;
  padding: 15px 25px !important;
  color: white;
  font-size: 14px;
  text-wrap: nowrap;
}

#tournamentPlayerBetsModal .modal-dialog-centered .modal-header button {
  top: 32px;
}

/* BetSlip Modal CSS*/
#modernSkin .custom-modal-container .custom-modal-body {
  border-radius: var(--border-radius-8);
  background: var(--bg-modal-color);
  border: 1px solid var(--border-color);
  padding: 8px;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .icon-container {
  justify-content: space-between;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .icon-container
  span {
  color: #fff !important;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .bet-details-content
  .w-100.px-4 {
  padding-right: 15px !important;
  padding-left: 15px !important;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .bet-details-content
  .px-4
  .row {
  gap: 8px;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .bet-details-content
  .px-4
  .row
  .px-1 {
  background: rgba(92, 79, 161, 0.8) !important;
  border: 2px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--border-radius-8);
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .bet-details-content
  .px-4
  .row
  .px-1
  .card-container {
  border: none;
  box-shadow: none;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .bet-details-content
  .px-4
  .row
  .px-1
  .card-container
  .flex-item-container
  .card-content
  .flex-item-container
  > span {
  color: #fff !important;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .bet-details-content
  .px-4
  .row
  .px-1
  .card-container
  .flex-item-container
  .card-content
  .align-items-center
  img {
  display: none !important;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .flex-item-container
  > span {
  font-size: 16px;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .flex-item-container
  button {
  padding: 0 48px !important;
  height: 37px;
  background: var(--button-primary-bg-gradient);
  border-radius: var(--border-radius-4);
  box-shadow: none;
  border: 0;
  width: fit-content;
  margin: 0 auto;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 16px;
}

#modernSkin
  .custom-modal-container
  .custom-modal-body
  .custom-modal-section
  .flex-item-container
  button:hover {
  background: var(--button-secondary-bg-gradient);
}

.snackbar.info {
  background: var(--panel-bg-color) !important;
}

/* End Tournament CSS */

.nm-widget.bonus-badge-w .badge-count-wrapper {
  left: auto;
  right: 8px;
  top: 8px;
}

#MessageBoxModal .modal-content .modal-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* PWA Install CSS */
.pwa-install-banner {
  .install-card {
    background: var(--bg-section) !important;
    margin: auto;
    border: 1px solid var(--border-color);

    .install-message {
      h5 {
        color: var(--font-color-active);
      }
    }

    .install-action {
      button {
        background: var(--button-primary-bg-gradient);
      }
    }
  }
}

/* PWA END CSS */

#bonus-popup {
  .modal-content {
    background: var(--bg-section) !important;
    border-radius: var(--border-radius-8);

    .modal-body {
      .row {
        .col-12 {
          .bonus-header {
            color: var(--font-color-active);
          }
        }

        .bonus-details {
          .col-1 {
            .col-12 {
              padding-left: 8px;

              .icon-casino-dice {
                font-size: 24px;

                &::before {
                  content: "\E931";
                  font-family: "icomoon" !important;
                }
              }

              .icon-basketball1 {
                font-size: 24px;

                &::before {
                  content: "\E92F";
                  font-family: "icomoon" !important;
                }
              }
            }
          }

          .col-3 {
            .btn-action-wrapper {
              button {
                border-radius: var(--border-radius-4);
                border: 0;
                background: var(--button-primary-bg-gradient);
                padding: 8px 16px;

                &:hover {
                  background: var(--button-secondary-bg-gradient);
                }
              }
            }
          }
        }
      }

      .btn-action-wrapper {
        .col-12 {
          button {
            background: var(--button-secondary-bg-gradient);
            border: 0;

            &:hover {
              background: var(--button-primary-bg-gradient);
            }
          }
        }
      }
    }
  }
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  #page_content_modern
  .sports-wrap {
  margin: -20px -40px;
}

#modernSkin.main-wrapper
  .layout-wrapper
  .content-wrapper
  .home-page-content
  #page_content_modern
  .sports-wrap
  iframe {
  width: 100%;
  min-height: calc(100dvh - 65px);
  height: calc(100dvh - 65px);
}

.preloader {
  .preloader-backdrop {
    background: var(--bg-body);
  }

  .preloader-src {
    video,
    img {
      width: 240px;
    }
  }
}

/* tencoins */
.wallet-payment-method {
  h1 {
    text-align: center;
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0 0 24px 0;
  }

  form {
    margin: 0 0 32px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: var(--panel-bg-color);
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    padding: 16px 24px;
    grid-template-columns: 0fr 1fr;
    display: grid;

    h2 {
      margin-bottom: 24px;
      font-size: 16px;
      text-transform: uppercase;
      color: #fff;
      font-weight: 700;
    }

    .base-input-container {
      grid-column: 1 / -1;

      label {
        font-size: 14px;
        text-wrap: nowrap;
      }

      .base-input-wrapper {
        .base-input-field {
          input {
            background: var(--bg-input-fields-gradient);
            height: 42px;
            border-radius: 8px !important;
            border: var(--border-input);
            color: #fff;
            font-size: 16px;
            font-weight: 600;
            padding: 0 10px;
            margin-top: 10px;
          }
        }

        span.base-input-append {
          text-wrap: nowrap;
        }
      }

      &:first-of-type {
        grid-column: 1;
        max-width: 162px;
        width: 162px;
      }

      &:nth-of-type(2) {
        grid-column: 2;
      }
    }

    .tencoin-deposit-payment,
    .tencoin-withdrawal-payment {
      margin: 32px 0;
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: 0fr 1fr;
      gap: 8px;
      margin: 16px 0;

      p {
        grid-column: 1 / -1;
      }

      section {
        margin: 8px 0;

        button {
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: space-between;
          max-width: fit-content;
          min-width: 116px !important;
          background: var(--bg-input-fields-gradient) !important;

          div {
            label {
              display: none;
            }
          }

          i {
            &:before {
              content: "\f0d7";
            }
          }
        }

        menu {
          background: var(--panel-bg-color);
          border-radius: var(--border-radius-10);
          border-color: var(--bg-separator);
          max-width: fit-content;
          min-width: 100px;

          .search {
            input {
              background: var(--bg-input-fields-gradient);
              height: 42px;
              border-radius: 5px !important;
              border: var(--border-input);
              color: #fff;
              font-size: 16px;
              font-weight: 600;
              padding: 0 10px;
              margin-top: 10px;
            }
          }
        }
      }
    }

    .tencoin-deposit-action,
    .tencoin-withdrawal-action {
      grid-column: 1 / -1;
      justify-content: end;

      button {
        padding: 0 16px !important;
        color: #fff !important;
        border-radius: 8px;
        height: 40px;
        background: var(--button-secondary-bg-gradient);

        &:last-child {
          background: var(--button-primary-bg-gradient);
        }
      }
    }

    .tencoin-deposit-qr-address {
      grid-column: 1 / -1;
      width: fit-content;

      label {
        text-align: center;
        width: 100%;
      }

      .base-qrcode {
        max-width: 200px !important;
        max-height: 200px !important;
        margin: auto;
      }

      small {
        display: flex;
        gap: 4px;
        margin-top: 6px;
        width: 100%;
        justify-content: center;
        align-items: center;
        font-size: 12px;
      }
    }

    .tencoin-deposit-wallet-address {
      margin: 8px 0;
    }
  }

  .tencoin-withdrawal-recent {
    margin: 0 0 32px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: var(--bg-section);
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    padding: 16px 24px;

    .tencoin-withdrawal-recent-header {
      h2 {
        margin-bottom: 24px;
        font-size: 16px;
        text-transform: uppercase;
        color: #fff;
        font-weight: 700;
      }
    }

    table {
      margin-top: 24px;

      tr {
        color: #fff;

        td {
          &:only-child {
            padding: 8px 0 8px 8px;
            border-top-right-radius: 8px;
            border-bottom-right-radius: 8px;
          }
        }
      }
    }
  }
}

.wallet-payment-methods-container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  .wallet-payment-methods-title {
    font-size: 16px;
    color: #fff;
  }
  .wallet-payment-methods-panel {
    display: flex;
    gap: 16px;
    .payment-method-item {
      display: flex;
      align-items: center;
      flex-direction: column;
      .payment-method-icon {
        img {
          width: 100%;
          height: 180px;
        }
      }
      .payment-method-name {
        color: #fff;
      }
    }
  }
}