html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
input {
  border-radius: 0;
}

input[type="search"] {
  -webkit-appearance: none;
}
button {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}

body {
	position: relative;
	margin: 0 auto;
	padding: 0;
	min-width: 320px;
	font-family: 'Red Hat Display', sans-serif;
	color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: 100%;
	background: #000;
}

::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: #101010; }
::-webkit-scrollbar-thumb { background: #182249; }
::-webkit-scrollbar-thumb:hover { background: #101010; }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

a, a:visited {
	color: #fff;
	text-decoration: none;
}

a:focus {
	border: 0;
	outline: 0;
	box-shadow: none;
}

a:hover {
	color: #ffce50;
}

strong {
	font-weight: 800;
}

h1, h2, h3, h4 {
	display: block;
	font-weight: 800;
	line-height: 100% !important;
}

h1 { font-size: 48px; }
h2 { font-size: 32px; }
h3 { font-size: 24px; }
h4 { font-size: 16px; }

.ma-title {
	color: #fff;
	margin-bottom: 16px;
	padding-left: 8px;
}

.ma-title i {
    margin-right: 8px;
}

.sectiontitle {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 32px 0 16px 0;
	color: #fff;
	line-height: 32px;
}

.sectiontitle img {
	max-width: 24px;
}

.form-floating > label {
	color: #fff;
	line-height: 150%;
}

.form-select,
input[type=text],
input[type=number],
input[type=password],
input[type=date],
input[type=email] {
	width: 100%;
    color: #fff;
	background: transparent;
    /* background: rgb(3,5,14);
	background: -moz-linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	background: -webkit-linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	background: linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03050e",endColorstr="#101010",GradientType=1); */
	border: 1px solid #efefef;
    border-radius: 8px;
}

input[type=date]::-webkit-calendar-picker-indicator{
	filter: invert(1);
}

.form-select:focus,
input[type=text]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=email]:focus {
    color: #fff;
	/* background: rgb(3,5,14);
	background: -moz-linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	background: -webkit-linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	background: linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03050e",endColorstr="#101010",GradientType=1); */
	border: 1px solid #fff;
	box-shadow: none !important;
	outline: none;
}

.form-select:disabled,
input[type=text]:disabled,
input[type=number]:disabled,
input[type=password]:disabled,
input[type=date]:disabled,
input[type=email]:disabled {
	color: #fff;
	background: #101010;
    /* background: rgb(3,5,14);
	background: -moz-linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	background: -webkit-linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	background: linear-gradient(0deg, rgba(3,5,14,1) 0%, rgba(6,10,27,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#03050e",endColorstr="#101010",GradientType=1); */
}

select option {
	background: #fff;
	color: #000;
}

.input-rg-item {
	position: absolute;
	top: 0;
	right: 16px;
	padding: 0 8px;
	height: 58px;
	font-size: 1.25em;
	line-height: 58px;
}

.color-valid {
	color: #84ff7b;
}

button.amount-max {
	position: absolute;
	top: 8px;
	right: 8px;
}

button.amount-max a {
	display: block;
	height: 44px;
	line-height: 44px;
	padding: 0 16px;
	background: rgba(255,255,255,0.08);
	border-radius: 4px;
}

.btn-action a {
	color:#000;
    /* background: linear-gradient(0deg, #b98604 30%, #ffce50 100%); */
    background: linear-gradient(0deg, #5b5b5b 30%, #fff 100%);
    /* box-shadow: 0px 0px 15px 0px #fff; */
	transition: all .3s;
}

.btn-action a:hover {
	/* box-shadow: 0px 0px 25px 5px #fff; */
}

.btn-secondary a {
	color: #fff;
	background: rgba(255,255,255,0.08);
	transition: all .3s;
}

.btn-secondary a:hover {
	background: rgba(255,255,255,0.15);
}

.btn-submit {
	display: block;
	width: 80%;
	margin: 0 auto;
}

.btn-submit a {
	display: block;
	margin: 24px 0;
	padding: 16px 0;
	font-size: 1.25em;
	font-weight: 900;
	border-radius: 50px;
}

.btn-update-wrap {
	display: flex;
	justify-content: flex-end;
	width: 100%;
}

.btn-update {
	margin: 0;
	padding: 0;
	height: 32px;
	line-height: 32px;
}

.btn-update a {
	display: block;
	padding: 0 24px;
	font-weight: 800;
	border-radius: 50px;
}

.modal {
	backdrop-filter: blur(2px);
	background: rgba(3,5,14,0.25);
}

.modal-body {
	padding: 0;
}

.grid-2row {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
}

.grid-2row .grid-2row-left,
.grid-2row .grid-2row-right {
	width: 49%;
}

/** structure **/

.main-menu {
	background: rgba(12,18,43,0.95);
}

.page-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
}

.content-container {
	padding: 0 24px;
}

/** side nav **/
.side-menu-container {
	position: fixed;
	padding-top: 80px;
	overflow-y: scroll;
	overflow-x: hidden;
    background: #101010;
	/* background: rgb(6,10,27);
	background: rgb(4,6,18);
	background: -moz-linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	background: -webkit-linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	background: linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#040612",endColorstr="#101010",GradientType=1); */
    opacity: 0;
}
.side-menu-container.show{
    opacity: 1;
}
a.side-menu-toggle {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 8px;
}

a.side-menu-toggle i {
    display: block;
    width: 40px;
    height: 40px;
    margin: 0 auto;
    font-size: 1.25em;
	color: #fff;
    line-height: 40px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
}

.rewards-portal-btn {
	position: relative;
	z-index: 9;
	display: block;
	width: calc(100% - 32px);
	margin: 0 auto 16px;
	border-radius: 16px;
	overflow: hidden;
}

.rewards-portal-btn a {
	display: flex;
	align-items: center;
	width: 100%;
	height: 68px;
	padding-left: 16px;
	color: #fff;
	font-weight: 800;
	background: rgb(0,48,255);
	background: -moz-linear-gradient(45deg, rgba(0,48,255,0.2497373949579832) 0%, rgba(6,10,27,0) 50%);
	background: -webkit-linear-gradient(45deg, rgba(0,48,255,0.2497373949579832) 0%, rgba(6,10,27,0) 50%);
	background: linear-gradient(45deg, rgba(0,48,255,0.2497373949579832) 0%, rgba(6,10,27,0) 50%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffce50",endColorstr="#101010",GradientType=1);
	border-radius: 16px;
	border: 1px solid #151d3d;
	transition: all .5s;
}

.rewards-notification {
	display: flex;
	align-items: center;
	gap: 8px;
}

img.rewards-ico {
    position: absolute;
    top: 8px;
    right: 16px;
    width: 68px;
    transition: all .3s;
}

.rewards-portal-btn a:hover {
	padding-left: 32px;
	border: 1px solid #202952;
}

.rewards-portal-btn:hover img.rewards-ico {
	top: 8px;
	transform: scale(1.25) rotate(10deg);
}

ul.side-menu-category {
	margin-top: 16px;
	padding: 16px 16px 0 16px;
	border-top: 1px solid rgba(255,255,255,0.08);
}

ul.side-menu-category li {
	transition: all .5s;
}

ul.side-menu-category li a {
	display: flex;
	align-items: center;
	padding: 4px 10px;
	font-weight: 800;
	border-radius: 64px;
}

ul.side-menu-category li a:hover, ul.side-menu-category li a.active {
	display: flex;
	align-items: center;
	font-weight: 800;
	background: #000209;
}

ul.side-menu-category li a img {
	display: block;
	max-width: 40px;
	margin-right: 16px;
	transition: all .3s;
}

ul.side-menu-category li a:hover img, ul.side-menu-category li a.active img {
	transform: scale(1.25) rotate(10deg);
}
ul.side-menu-info {
	margin-top: 16px;
	padding: 16px;
	border-top: 1px solid rgba(255,255,255,0.08);
	font-size: 0.85em;
}

ul.side-menu-info li a {
	display: flex;
	align-items: center;
	padding: 8px 16px;
	color: rgba(255, 255, 255, 0.5);
	font-weight: 400;
	border-radius: 64px;
}
span.menu-title {
	width: calc(100% - 56px);
	text-wrap: nowrap;
}

.rotate i.fa-angle-down {
    -moz-transition: all .15s linear;
    -webkit-transition: all .15s linear;
    transition: all .15s linear;
}

.rotate.down i.fa-angle-down {
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.submenu-collapse {
	display: flex;
	align-items: center;
	width: 16px;
	height: 16px;
	font-size: 0.85em;
}

ul.side-submenu {
	margin-left: 40px;
	margin-bottom: 16px;
}

ul.side-submenu li {
	padding: 0;
	margin: 0;
}

ul.side-submenu li a {
	color: rgba(255,255,255,0.75);
	font-weight: 400;
	transition: all .3s;
}

ul.side-submenu li a:hover {
	color: rgba(255,255,255,1);
	font-weight: 400;
	padding-left: 24px;
}

.side-menu-sticky {
    position: fixed;
    bottom: 0;
    z-index: 9;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    background: #101010;
    /* background: #101010; */
    border-top: 1px solid rgba(255,255,255,0.08);
}

.side-menu-sticky-container {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    font-size: 0.85em;
    line-height: 58px;
}

button.live-support a {
	display: block;
	padding: 8px 16px;
	line-height: 18px;
	border-radius: 32px;
	background: rgba(255,255,255,0.08);
}

button.live-support i {
	margin-right: 8px;
}

button.live-support a:hover {
	color: #fff;
	background: rgba(255,255,255,0.15);
}

.language-select a {
    display: flex;
	align-items: center;
    justify-content: space-between;
    padding: 4px 8px 4px 4px;
	line-height: 24px;
    border-radius: 32px;
    border: 2px solid rgba(255,255,255,0.08);
}

.language-select a:hover {
	color: #fff;
    border: 2px solid rgba(255,255,255,0.15);
}

.language-select img {
	max-width: 24px;
}

#side-menu-toggle.menu-collapse.side-menu-container { height: calc(100vh - 136px); }
#side-menu-toggle.menu-collapse { width: 80px; }
#side-menu-toggle.menu-collapse span.menu-title { display: none; }
#side-menu-toggle.menu-collapse ul.side-menu-category { padding: 16px 0 0; }
#side-menu-toggle.menu-collapse ul.side-menu-category li { width: 56px; margin: 0 auto; }
#side-menu-toggle.menu-collapse ul.side-menu-category li a { padding: 12px 0; border-radius: 16px; }
#side-menu-toggle.menu-collapse li.expand-menu-list { display: none; }
#side-menu-toggle.menu-collapse li.collapse-menu-list { display: block; }
#side-menu-toggle.menu-collapse ul.side-menu-category li a img { margin: 0 auto; }
#side-menu-toggle.menu-collapse .rewards-portal-btn { width: 56px; }
#side-menu-toggle.menu-collapse .rewards-portal-btn a { height: 56px; transition: all 0s; }
#side-menu-toggle.menu-collapse .rewards-portal-btn span { display: none; }
#side-menu-toggle.menu-collapse .rewards-portal-btn img.rewards-ico {
    top: 12px;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 0;
    width: 32px;
	transition: all 0s;
}
#side-menu-toggle.menu-expand.side-menu-container { height: calc(100vh - 68px); }
#side-menu-toggle.menu-expand { width: 268px; }
#side-menu-toggle.menu-expand li.expand-menu-list { display: block; }
#side-menu-toggle.menu-expand li.collapse-menu-list { display: none; }
#side-menu-sticky.block-collapse .side-menu-sticky-container { width: 80px; height: 136px; flex-direction: column; }
#side-menu-sticky.block-collapse .side-menu-sticky-container button.live-support a,
#side-menu-sticky.block-collapse .side-menu-sticky-container .language-select a { min-width: 56px; }
#side-menu-sticky.block-collapse .side-menu-sticky-container span { display: none; }
#side-menu-sticky.block-collapse .side-menu-sticky-container button.live-support i { margin: 0; }
#side-menu-sticky.block-expand .side-menu-sticky-container { width: 268px; height: 68px; }
#side-menu-sticky.block-expand .side-menu-sticky-container button.live-support a,
#side-menu-sticky.block-expand .side-menu-sticky-container .language-select a { min-width: 108px; }

.progress-bar {
	background-color: #ffce50;
}

/** content area **/
.column-right-wrapper {
	position: absolute;
	right: 0;
}

#column-right-wrapper.menu-collapse span.menu-title {
	display: none;
}

#column-right-wrapper.page-collapse {
	width: calc(100% - 80px);
}

#column-right-wrapper.page-expand {
	width: calc(100% - 268px);
}

.column-right-container {
	position: relative;
	width: 100%;
	min-width: 1000px;
}

/** header nav **/
.header-wrapper {
	position: sticky;
	top: 0;
	z-index: 9;
	width: 100%;
	padding: 0 24px;
	background: #000;
    /* background: rgb(6,10,27);
	background: -moz-linear-gradient(168deg, rgba(6,10,27,0.3) 0%, rgba(6,10,27,0.9) 50%);
	background: -webkit-linear-gradient(168deg, rgba(6,10,27,0.3) 0%, rgba(6,10,27,0.9) 50%);
	background: linear-gradient(168deg, rgba(6,10,27,0.3) 0%, rgba(6,10,27,0.9) 50%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#101010",endColorstr="#101010",GradientType=1);
	backdrop-filter: blur(3px); */
}

.header-container {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: 100%;
	max-width: 1200px;
	height: 90px;
	margin: 0 auto;
}

.header-container .logo {
	max-width: 88px;
}

.header-cta-container {
	display: flex;
	align-items: center;
	gap: 16px;
	height: 40px;
}

.inbox-notify {
    position: relative;
}

.inbox-notify a {
	display: flex;
	gap: 4px;
}

.inbox-notify i {
	font-size: 1.25em;
}

.inbox-notify .inbox-count {
    font-size: 0.65em;
}

.show-download-dialog{
    position: relative;
}

.show-download-dialog img{
    width: 22px;
    height: 22px;
}

.header-user {
	position: relative;
	display: flex;
	align-items: center;
	height: 64px;
}

.header-user > a {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	height: 100%;
	color: #fff;
}

.user-info {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 40px;
    height: 40px;
	background: #000209;
	border: 2px solid #fff;
    border-radius: 50px;
}

.user-info > img {
	display: block;
	max-width: 20px;
	max-height: 20px;
}

.user-displayname {
	display: block;
	width: 100%;
	font-weight: 800;
	line-height: 100%;
}

.header-user a > span {
	font-size: 0.65em;
	margin-left: 4px;
}

.header-wallet-summary {
	display: flex;
	align-items: center;
	gap: 16px;
	height: 100%;
	padding: 4px 4px 4px 24px;
	line-height: 40px;
	background: #000209;
	border: 2px solid #fff;
	border-radius: 50px;
}

.header-wallet-summary span {
	font-weight: 800;
}

.header-deposit-btn {
	margin: 0;
	padding: 0;
	height: 32px;
	line-height: 32px;
}

.header-deposit-btn a {
	display: block;
	padding: 0 24px;
	font-weight: 800;
	border-radius: 50px;
}

.header-cta-btn {
	margin: 0;
	padding: 0;
	height: 40px;
	line-height: 40px;
}

.header-cta-btn a {
	display: block;
	padding: 0 24px;
	font-weight: 800;
	border-radius: 50px;
}

.header-usermenu {
	width: 350px;
	margin: 0;
	padding: 0 0 16px;
	color: #fff;
	background: #101010;
	/* background: -moz-linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	background: -webkit-linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	background: linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#040612",endColorstr="#101010",GradientType=1); */
	border: 0;
    border-radius: 16px;
	overflow: hidden;
}

ul.usermenu-nav {
	padding: 0 16px;
}

ul.usermenu-nav.ma-16{
    margin-top: 16px;
}

ul.usermenu-nav li {

}

ul.usermenu-nav li a {
	display: flex;
	align-items: center;
	padding: 12px;
	font-weight: 800;
	color: rgba(255,255,255,0.75);
}

ul.usermenu-nav li.account a {
	margin-top: 16px;
}

ul.usermenu-nav li.logout a {
	margin-top: 16px;
	color: red;
}

ul.usermenu-nav li a:hover {
	color: rgba(255,255,255,1);
	background: #252525;
	border-radius: 50px;
}

ul.usermenu-nav li a i {
	display: flex;
	justify-content: center;
	font-size: 1em;
	width: 50px;

}

.usermenu-vip-details {
	width: 100%;
	padding: 16px;
	background: rgb(0,48,255);
	background: -moz-linear-gradient(45deg, rgba(0,48,255,0.2497373949579832) 0%, rgba(6,10,27,0) 50%);
	background: -webkit-linear-gradient(45deg, rgba(0,48,255,0.2497373949579832) 0%, rgba(6,10,27,0) 50%);
	background: linear-gradient(45deg, rgba(0,48,255,0.2497373949579832) 0%, rgba(6,10,27,0) 50%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffce50",endColorstr="#101010",GradientType=1);
	border-bottom: 1px solid #151d3d;
}

.myvip-vip-details {
	width: calc(100% - 128px);
	padding: 16px;
}

.modal-user {
	position: relative;
	min-height: 100px;
	background: #101010;
	border: 0;
	box-shadow: 0px 0px 50px 10px rgba(3,5,14,1);
	border-radius: 16px;
	overflow: hidden;
}

.modal-close-btn {
	position: absolute;
	top: 32px;
	right: 32px;
	z-index: 9;
}

.modal-close-btn svg {
	width: 16px;
	fill: rgba(255,255,255,0.5);
}

.modal-close-btn:hover svg {
	fill: rgba(255,255,255,1);
}

.modal-back-btn {
	position: absolute;
	top: 32px;
	left: 32px;
	z-index: 9;
}

.modal-back-btn a {
	display: flex;
	gap: 8px;
	font-size: 16px;
	color: rgba(255,255,255,0.5);
}

.modal-large {
	width: 800px;
	max-width: 800px;
}

.modal-medium {
	width: 600px;
	max-width: 500px;
}

.modal-small {
	width: 400px;
	max-width: 500px;
}

.user-modal-container {
	display: flex;
	justify-content: space-between;
}

.user-modal-container > .banner {
	width: 50%;
}

.user-modal-container > .banner img {
	display: block;
	max-width: 100%;
}

.user-modal-container > .login-form {
	width: 50%;
	padding: 32px;
}

.user-modal-container h3.modal-title {
	display: block;
	margin-bottom: 32px;
	line-height: 100%;
}

.user-modal-container span.forgot-password {
	display: block;
	margin-top: 24px;
	text-align: right;
}

.user-modal-container span.accept-terms {
	display: block;
	margin-top: 24px;
	font-size: 0.85em;
	color: rgba(255,255,255,0.75);
	text-align: left;
	line-height: 125%;
}

.user-modal-container span.accept-terms a {
	color: rgba(255,255,255,1);
	font-weight: 800;
}

.user-modal-container .refer-label {
	display: block;
	margin-bottom: 16px;
}

.user-modal-container span.account-action {
	display: block;
	text-align: center;
}

.user-modal-container span.account-action a {
	color: #ffce50;
	font-weight: 900;
	text-decoration: underline;
}

.user-modal-container .resendtimer {
    position: absolute;
    top: 0;
    right: 0.75rem;
    height: 58px;
    color: rgba(255,255,255,0.5);
    line-height: 58px;
}

.user-modal-container ul.notice {
	margin-left: 24px;
	font-size: 0.85em;
}

.user-modal-container ul.notice li {
	list-style-type: disc;
}

.main-banner-container  {
	max-width: 1200px;
	margin: 32px auto 6px auto;
	border-radius: 16px;
}

.main-banner-container a {
	display: block;
	margin: 0;
	padding: 0;
}

.main-banner-container img {
	display: block;
	margin: 0;
	padding: 0;
	max-width: 100%;
}

.mb-pagination {
	position: absolute;
	bottom: 16px !important;
	z-index: 9;
	margin: 0 auto;
	width: 100%;
	text-align: center;
}

.mb-pagination > .swiper-pagination-bullet {
	width: 48px;
	height: 4px;
	border-radius: 8px;
	background: #ffce50;
}

.mb-button-prev,
.mb-button-next {
	position: absolute;
    top: 0;
    z-index: 9;
    display: flex;
	align-items: center;
	height: 100%;
	padding: 0 32px;
    font-size: 38px;
    line-height: 38px;
	opacity: 0.25;
	transition: all .3s;
}

.mb-button-prev:hover,
.mb-button-next:hover {
	opacity: 1;
}

.mb-button-prev {
	left: 0;
}

.mb-button-next {
	right: 0;
}

.provider-featured {
	display: flex;
	justify-content: space-between;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.provider-featured  h3.sectiontitle {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 16px;
	color: #fff;
	line-height: 32px;
}

.provider-live,
.provider-slots {
	position: relative;
	width: calc(50% - 16px);
	padding: 32px;
	min-height: 250px;
	background: #101010;
	border-radius: 16px;
}

.provider-live {
	background: url("../../../assets/img/live-bg.jpg") top left no-repeat;
	background-size: cover;
}

.provider-slots {
	background: url("../../../assets/img/slot-bg.jpg") top left no-repeat;
	background-size: cover;
}

.providers-list-container {
	position: absolute;
	bottom: 32px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 100%;
}

.live-providers-list .swiper-slide,
.slot-providers-list .swiper-slide {
	display: flex;
	align-items: center;
	height: 58px;
	background: rgba(6,10,27,0.25);
	border-radius: 8px;
	backdrop-filter: blur(3px);
}

.live-providers-list img,
.slot-providers-list img {
	display: block;
	margin: 0 auto;
	padding: 8px 0;
	max-width: 75%;
}

.provider-featured p.sectiondesc {
	width: 60%;
}

.popular-games-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.swiper-shadow {
	position: absolute;
	top: 80px;
	right: 0;
	z-index: 2;
	height: calc(100% - 80px);
	width: 68px;
	background: rgb(12,18,43);
	background: -moz-linear-gradient(90deg, rgba(12,18,43,0) 0%, rgba(12,18,43,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(12,18,43,0) 0%, rgba(12,18,43,1) 100%);
	background: linear-gradient(90deg, rgba(12,18,43,0) 0%, rgba(12,18,43,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#101010",endColorstr="#101010",GradientType=1);
}

.fg-navigation {
	position: absolute;
	top: 32px;
	right: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.85em;
}

.fg-navigation span.fg-more-games a,
.fg-button-prev,
.fg-button-next {
	padding: 6px 12px;
	color: #fff;
	background: rgba(255,255,255,0.08);
	border-radius: 8px;
	transition: all .3s;
}

.fg-navigation span.fg-more-games a:hover,
.fg-button-prev:hover,
.fg-button-next:hover {
	background: rgba(255,255,255,0.15);
}

.promo-list-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.promo-list .swiper-slide img {
	max-width: 100%;
	border-radius: 16px;
}

.providers-full-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.providers-full-container .swiper-slide {
	display: flex;
	align-items: center;
	padding: 16px 0;
	height: 60px;
	background: rgba(255,255,255,0.05);
	border-radius: 8px;
}

.full-providers-list .swiper-slide img {
	display: block;
	fill: #fff;
	max-width: 100px;
	max-height: 30px;
	margin: 0 auto;
}

.rewards-centre-container {
	padding: 32px;
}

.rewards-centre-container h3.modal-title {
	display: block;
	line-height: 100%;
}

.vip-summary {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	margin-top: 24px;
	background: #101010;
	border-radius: 16px;
}

.vip-badge {
	width: 128px;
}

.vip-badge img {
	display: block;
	margin: 0 auto;
	min-width: 65px;
	max-width: 100px;
}

.vip-details {
	width: 45%;
	padding: 16px 32px 16px 0;
}

.vip-rank {
	display: block;
	margin-bottom: 16px;
	font-size: 1.25em;
	font-weight: 900;
}

.rank-progress-label {
	display: flex;
	justify-content: space-between;
	font-size: 0.75em;
	font-weight: 450;
	color: rgba(255,255,255,0.5);
}

.rank-progress-label a {
	color: rgba(255,255,255,0.5);
}

.rank-progress-label span.rank-required {
	color: rgba(255,255,255,1);
	font-weight: 900;
}

.rank-label {
	display: flex;
	justify-content: space-between;
	font-size: 0.75em;
	font-weight: 900;
}

.vip-details .progress,
.usermenu-vip-details .progress,
.myvip-vip-details .progress {
	margin: 8px 0;
	height: 8px;
	border-radius: 50px;
	background: rgba(255,255,255,0.08);
}

.vip-benefits {
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	width: calc(55% - 128px);
	padding: 16px;
	border-left: 1px solid rgba(255,255,255,0.08);
}

.vip-benefits p {
	display: block;
	margin-bottom: 8px;
	font-size: 0.75em;
}

.btn-benefits {
}

.btn-benefits a {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 8px 16px;
	font-size: 0.85em;
	font-weight: 800;
	text-align: center;
	border-radius: 50px;
}

.btn-benefits a i {
	margin-right: 8px;
}

.rewards-list {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 32px;
}

.rewards-block {
	width: calc(50% - 8px);
	padding: 16px;
	text-align: center;
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 16px;
	transition: all .3s;
}

.rewards-block:hover {
	border: 1px solid rgba(255,255,255,0.15);
}

h4.rewards-section-title {
	display: block;
	width: 100%;
	font-weight: 800;
}

h4.rewards-title {
	font-weight: 800;
	color: #ffce50;
}

.rewards-amount {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	margin: 12px 0 8px;
}

.rewards-amount .amount {
	font-size: 1.5em;
	font-weight: 800;
}

.rewards-notice {
	margin-bottom: 16px;
}

.rewards-notice .notice {
	font-size: 0.75em;
	color: rgba(255,255,255,0.5);
	line-height: 100%;
}

.missions-container {
	margin: 32px auto 0;
}

.missions-list {
	display: grid;
	grid-template-columns: 23% 23% 23% 23%;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 32px;
}

.missions-container ul.nav {
	display: flex;
	justify-content: space-between;
	margin-top: 16px;
}

.missions-container ul.nav li {
	width: 23%;
}

.missions-container .nav-link {
	width: 100%;
	color: #fff;
	font-size: 0.85em;
	font-weight: 800;
	line-height: 24px;
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 50px;
}

.missions-container button.active {
	background: rgba(255,255,255,0.08);
	border: 0;
}

.missions-block {
	width: 100%;
	margin-bottom: 16px;
	padding: 8px 8px 16px;
	text-align: center;
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 16px;
	transition: all .3s;
}

.missions-block:hover {
	border: 1px solid rgba(255,255,255,0.15);
}

.missions-block .progress {
	width: 80%;
	height: 4px;
	margin: 0 auto;
	border-radius: 50px;
	background: rgba(255,255,255,0.08);
}

.missions-block img {
	display: block;
	max-width: 48px;
	margin: 16px auto;
}

.missions-desc {
	display: block;
	margin: 0 auto 8px;
	text-align: center;
	font-size: 0.85em;
}

.missions-rewards {
	display: block;
	margin: 0 auto 16px;
	font-weight: 800;
	text-align: center;
}

.btn-claim {
	color: #fff;
	width: 68%;
}

.btn-claim a {
	display: block;
	width: 100%;
	padding: 8px;
	font-size: 0.85em;
	font-weight: 800;
	border-radius: 50px;
}

.claimed {
	opacity: 0.25;
}

.trx-menu {
	width: 35%;
}

ul.trx-method {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #101010;
    /* background: rgb(6,10,27);
	background: rgb(4,6,18);
	background: -moz-linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	background: -webkit-linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	background: linear-gradient(45deg, rgba(4,6,18,1) 0%, rgba(6,10,27,1) 25%, rgba(6,10,27,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#040612",endColorstr="#101010",GradientType=1); */
}

ul.trx-method h4.trx-menu-title {
	display: block;
	margin: 16px 0 16px 0;
	padding: 16px 0 0 48px;
	color: #ffce50;
	font-weight: 800;
}

ul.trx-method li {
	width: calc(100% - 32px);
	margin: 0 auto;
	transition: all .3s;
}

ul.trx-method li a {
	display: block;
	width: 100%;
	padding: 16px 16px 16px 32px;
	transition: all .3s;
	border-radius: 50px;
}

ul.trx-method li:hover a {
	padding-left: 40px;
}

ul.trx-method li.active a {
	background: #252525;
	padding-left: 40px;
}

ul.trx-method img {
	display: block;
	max-width: 24px;
}

.trx-method-title {
	display: block;
	color: #fff;
	font-weight: 800;
}

.trx-content {
	width: 65%;
	padding: 32px;
    background: #252525;
}

.trx-gateway {
	display: flex;
	gap: 16px;
	margin-bottom: 32px;
}

.trx-section-title {
	display: block;
	margin-top: 32px;
}

.trx-radio input[type="radio"] {
	position: fixed;
	width: 0;
	opacity: 0;
}

.trx-radio input[type="radio"]:checked + label {
	color: #fff;
	border: 2px solid #ffce50;
	background: #03050e;
}

.trx-gateway .trx-gateway-radio {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 88px;
	padding: 0 16px;
	font-weight: 800;
	background: #101010;
	border: 2px solid #141c3c;
	border-radius: 8px;
	cursor: pointer;
}

.trx-amount {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	margin-top: 8px;
}

.trx-amount .trx-amount-radio {
	width: 19%;
	font-weight: 800;
	text-align: center;
	line-height: 38px;
	background: #101010;
	border: 2px solid #141c3c;
	border-radius: 8px;
	cursor: pointer;
}

.form-info-label {
	display: flex;
	justify-content: space-between;
	margin-bottom: 8px;
}

.trx-promo-radio {
	position: relative;
	display: flex;
	align-items: center;
	flex-wrap:wrap;
	margin-top: 8px;
	padding: 16px 8px;
	width: 100%;
	text-align: center;
	background: #101010;
	border: 2px solid #141c3c;
	border-radius: 8px;
	cursor: pointer;
}

.trx-promo-title {
	width: 100%;
	color: #fff;
	font-weight: 800;
}

.trx-promo-info {
	display: flex;
	justify-content: center;
	gap: 1px;
	margin-top: 6px;
	color: rgba(255,255,255,0.75);
	font-size: 0.75em;
	width: 100%;
}

.trx-promo-info span {
	background: rgba(255,255,255,0.05);
	padding: 2px 16px;
}

.trx-promo-info span:first-child {
	-webkit-border-top-left-radius: 50px;
	-webkit-border-bottom-left-radius: 50px;
	-moz-border-radius-topleft: 50px;
	-moz-border-radius-bottomleft: 50px;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
}

.trx-promo-info span:last-child {
	-webkit-border-top-right-radius: 50px;
	-webkit-border-bottom-right-radius: 50px;
	-moz-border-radius-topright: 50px;
	-moz-border-radius-bottomright: 50px;
	border-top-right-radius: 50px;
	border-bottom-right-radius: 50px;
}

.trx-delete a {
	position: absolute;
	top: 0;
	right: 16px;
	line-height: 78px;
}

.trx-balance {
	display: flex;
	margin-bottom: 32px;
	padding: 32px;
	background: rgba(255,255,255,0.05);
	border-radius: 8px;
}

.trx-balance-label {
	width: 50%;
}

.trx-balance-amount {
	display: flex;
	width: 50%;
	justify-content: center;
	font-size: 1.25em;
	font-weight: 900;
	color: #ffce50;
}

.createbank {
	width: 100%;
}

.createbank a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 8px;
	padding: 8px;
	width: 100%;
	height: 60px;
	color: #fff;
	font-weight: 800;
	text-align: center;
	background: #101010;
	border: 2px dashed #141c3c;
	border-radius: 8px;
}

.content {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

ul.page-breadcrumb {
	display: flex;
	margin: 32px 0;
	font-size: 0.85em;
}

ul.page-breadcrumb li {
}

ul.page-breadcrumb li a {
	color: #fff;
}

ul.page-breadcrumb li:first-child::before {
	padding: 0;
	content: "";
}

ul.page-breadcrumb li::before {
	padding: 0 12px;
	/* font-family: "Font Awesome 6 Pro"; */
	color: #e0dfdf;
	font-weight: 900;
	/* content: "\f105"; */
    content: ">";
}

h2.page-title {
	display: block;
	margin: 0;
	padding: 0;
	line-height: 100%;
	cursor: default;
}

.page-desc {
	display: block;
	margin-top: 32px;
}

.games-lobby-filter {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 32px;
	background: #101010;
	border-radius: 16px;
	overflow: hidden;
}

ul.games-category {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	border-bottom: 1px solid rgba(255,255,255,0.05);
}

ul.games-category a {
    display: flex;
    align-items: center;
    min-width: 68px;
    height: 68px;
    padding: 0 16px;
    color: #fff;
    text-align: center;
}

ul.games-category a.active {
	color: #ffce50;
	font-weight: 800;
}

button.select-provider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 20%;
	min-width: 168px;
	height: 50px;
	padding: 16px;
	color: #fff;
	border-right: 1px solid rgba(255,255,255,0.05);
	cursor: pointer;
}

.dd-providers-container {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #101010;
	border-top: 1px solid rgba(255,255,255,0.05);
}

ul.dd-providers-list {
	/* display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(6, 15.5%);
	gap: 16px;
	padding: 16px; */
}

@media screen and (max-width: 1280px) {
	ul.dd-providers-list {
		/* grid-template-columns: repeat(5, 18.8%); */
	}
}

ul.dd-providers-list li a {
	display: flex;
	align-items: center;
	justify-content: center;
	/* height: 50px; */
	/* padding: 16px; */
	color: #fff;
	/* border: 1px solid rgba(255,255,255,0.05); */
	/* border-radius: 8px; */
	transition: all .3s;
}

ul.dd-providers-list li a.active {
	/* border: 1px solid #ffce50; */
}

ul.dd-providers-list li a:hover {
	/* border: 1px solid #ffce50; */
}

ul.dd-providers-list li a > img {
	/* max-width: 24px; */
	/* max-height: 24px; */
}

ul.dd-providers-list li a > span {
	font-size: 0.85em;
	margin-left: 16px;
}

.games-search {
	width: 80%;
}

.games-search input[type=text] {
	width: 100%;
	height: 50px !important;
	padding: 0 16px;
    color: #fff;
	line-height: 40px !important;
	border: 0;
	border-radius: 0 0 16px;
}

.games-lobby-list {
	display: grid;
	justify-content: space-between;
	margin-top: 32px;
	grid-template-columns: repeat(8, 11.5%);
}

@media screen and (max-width: 1280px) {
	.games-lobby-list {
		grid-template-columns: repeat(7, 13%);
	}
}

.big-wins-item {
	display: flex;
	align-items: center;
	margin-bottom: 24px;
	padding: 8px;
	background: rgba(255,255,255,0.05);
	border-radius: 8px;
}

.big-wins-item a {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	max-width: 100%;
}

.big-wins-item .wins-game {
	width: 30%;
}

.big-wins-item .wins-game img {
	display: block;
	max-width: 100%;
	border-radius: 4px;
}

.big-wins-item .wins-details {
	display: flex;
	flex-direction: column;
	width: calc(70% - 8px);
}

.wins-game-title {
	font-size: 0.85em;
	font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wins-player {
	display: flex;
	align-items: center;
	margin: 4px 0;
	color: rgba(255, 255, 255, 0.75);
	font-size: 0.75em;
}

.wins-player img {
	max-width: 15px;
}

.game-items {
	position: relative;
	margin-bottom: 24px;
}

.wins-amount {
	color: #50F861;
	font-weight: 900;
	font-size: 0.85em;
}

.game-thumbnail {
	position: relative;
	margin: 0 0 8px;
	border-radius: 16px;
	overflow: hidden;
	transition: all .3s;
}

.game-launcher {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	padding-bottom: 16px;
	display: flex;
	width: 100%;
	height: 100%;
	/* background: rgb(6, 10, 27);
    background: -moz-linear-gradient(168deg, rgba(6, 10, 27, 0.1) 0%, rgba(6, 10, 27, 0.9) 70%);
    background: -webkit-linear-gradient(168deg, rgba(6, 10, 27, 0.1) 0%, rgba(6, 10, 27, 0.9) 70%);
    background: linear-gradient(168deg, rgba(6, 10, 27, 0.1) 0%, rgba(6, 10, 27, 0.9) 70%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#101010",endColorstr="#101010",GradientType=1); */
    backdrop-filter: blur(2px);
    background: #101010;
	opacity: 0;
	transition: all .3s;
}

.game-items:hover .game-launcher {
	padding-bottom: 0;
	opacity: 1;
}

.game-launcher > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.game-launcher .btn-play {
	display: block;
	margin: 0 auto;
	width: 70%;
	padding: 12px 0;
	font-size: 0.85em;
	font-weight: 800;
    color:#000;
    /* background: linear-gradient(0deg, #b98604 30%, #ffce50 100%); */
    background: linear-gradient(0deg, #5b5b5b 30%, #fff 100%);
    box-shadow: 0px 0px 15px 0px #fff;
	/* color: #fff;
	background: rgb(0, 48, 255);
    background: -moz-linear-gradient(0deg, rgba(0, 48, 255, 1) 30%, rgba(0, 206, 255, 1) 95%, rgba(135, 246, 254, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(0, 48, 255, 1) 30%, rgba(0, 206, 255, 1) 95%, rgba(135, 246, 254, 1) 100%);
    background: linear-gradient(0deg, rgba(0, 48, 255, 1) 30%, rgba(0, 206, 255, 1) 95%, rgba(135, 246, 254, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffce50",endColorstr="#87f6fe",GradientType=1);
    box-shadow: 0px 0px 15px 0px #ffce50; */
	border-radius: 50px;
}

.game-launcher .btn-demo {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 8px;
	display: flex;
	width: 50px;
	margin: 0 auto;
	transition: all .3s;
}

.game-launcher .btn-demo a {
	display: block;
	width: 50px;
	font-size: 0.85em;
	text-align: center;
	text-decoration: underline;
}

.game-items:hover .btn-demo {
	bottom: 24px;
}

.game-items img {
	display: block;
	max-width: 100%;
    width: 100%;
}

.game-items img.hot {
	display: block;
	width: 60px;
    height: 30px;
    position: absolute;
    top: 1px;
    left: 3px;
}

.game-items span.games-title {
    display: block;
    color: #fff;
	font-size: 0.85em;
    font-weight: 600;
    line-height: 120%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.game-items span.games-provider {
	display: block;
	margin-top: 4px;
	line-height: 120%;
	font-size: 0.75em;
	color: rgba(255,255,255,0.5);
}

footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
	max-width: 1200px;
	margin: 48px auto;
	padding: 48px 24px 0;
	font-size: 0.75em;
	border-top: 1px solid rgba(255,255,255,0.08);
}

.ft-col-1 {
	width: 18%;
}

.ft-col-1 p.copyright {
	margin-top: 16px;
}

.ft-logo {
	display: block;
	max-width: 150px;
}

.ft-col-2 {
	display: flex;
	justify-content: space-around;
	width: 38%;
}

ul.ft-menu-list {
	line-height: 180%;
}

h4.ft-title {
	margin-bottom: 8px;
	font-size: 1.25em;
	font-weight: 800;
	color: #ffce50;
}

.ft-col-3 {
	width: 38%;
}

.ft-col-3 p {
	margin-bottom: 16px;
}

.licence-logo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 16px;
}

.licence-logo img {
	display: block;
	max-width: 128px;
	max-height: 28px;
}

/********
Promotions
********/

ul.promos-category {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
	margin: 32px 0;
    width: 100%;
    background: #101010;
    border-radius: 16px;
}

ul.promos-category a {
    display: flex;
    align-items: center;
    min-width: 68px;
    height: 68px;
    padding: 0 16px;
    color: #fff;
    text-align: center;
}

ul.promos-category a.active {
    color: #ffce50;
    font-weight: 800;
}

ul.promos-category .badge {
	margin-left: 4px;
}

ul.promos-item {
	display: grid;
	justify-content: space-between;
	flex-wrap: wrap;
	grid-template-columns: repeat(3, 32%);
	grid-row-gap: 24px;
}

ul.promos-item li {
	display: flex;
	flex-wrap: wrap;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 8px;
	overflow: hidden;
}

ul.promos-item li img {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
    height: 140px;
}

.promos-info {
	width: calc(100% - 120px);
	padding: 16px 0 16px 16px;
}

.promos-info > span.promos-title {
	display: block;
	margin-bottom: 8px;
	font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.promos-info > span.promos-desc {
	display: block;
	font-size: 0.75em;
}

.promos-tnc {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	font-size: 0.85em;
	text-align: center;
}

.promos-details {
	padding: 32px;
}

.promos-details p {
	margin-bottom: 16px;
}

.promos-details > img{
    width: 100%;
    margin-bottom: 15px;
}
.promos-details > h3{
    margin-bottom: 15px;
}
.promos-details-body{
    width: 100%;
    display: flex;
    flex-direction: column;
}

/********
VIP
********/

.vip-list {
	display: flex;
	justify-content: space-between;
	margin-top: 32px;
	width: 100%;
}

.vip-rank-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 64px;
	width: 23%;
}

.current-rank {
	border: 2px solid #ffce50;
	border-radius: 8px;
	box-shadow: 0px 0px 80px 0px #ffce50;
	transform: scale(1.1);
}

.current-rank-label {
	position: absolute;
	top: -1px;
	left: 16px;
	padding: 2px 4px 4px;
	color: #fff;
	font-size: 0.75em;
	font-weight: 900;
	background: #ffce50;
	-webkit-border-bottom-right-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
	-moz-border-radius-bottomright: 8px;
	-moz-border-radius-bottomleft: 8px;
	border-bottom-right-radius: 8px;
	border-bottom-left-radius: 8px;
	z-index: 9;
}

.vip-rank-details {
	position: relative;
	padding: 64px 16px 16px 16px;
	width: 100%;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 8px;
}

.rank-badge {
	position: absolute;
	top: -40px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 80px;
}

.rank-title {
	display: block;
	margin-bottom: 32px;
	font-size: 1.85em;
	font-weight: 900;
	text-align: center;
}

.rank-up-xp {
	display: flex;
	justify-content: space-between;
	margin-bottom: 32px;
	font-size: 0.85em;
}

.rank-up-xp span:first-child a {
    color: rgba(255, 255, 255, 0.75);
}

.rank-up-xp span:last-child {
    font-weight: 900;
}

.rank-total-bonus {
	display: flex;
	flex-direction: column;
	gap: 4px;
	text-align: center;
	margin-bottom: 32px;
	padding: 8px;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 8px;
}

.rank-total-bonus span:first-child {

}

.rank-total-bonus span:last-child {
	color: #F6DA24;
	font-size: 1.25em;
	font-weight: 900;
}

.rank-benefits {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 0.85em;
}

.benefits-title {
	font-weight: 900;
}

.rank-benefits-item {
	display: flex;
	justify-content: space-between;
}

.rank-benefits-item span:first-child {
	color: rgba(255,255,255,0.75);
}

.rank-benefits-item span:last-child {
	color: #50F861;
	font-weight: 900;
}

.rank-details-btn {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 32px;
	line-height: 32px;
}

.rank-details-btn a {
	display: block;
	padding: 0 24px;
	width: 100%;
	font-weight: 800;
	border-radius: 50px;
}

.rank-table {
	border-radius: 8px;
	overflow: hidden;
}

.rank-table-header,
.rank-up-rewards {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 0.85em;
}

.rank-table-header span:first-child {
	display: flex;
	align-items: center;
	font-weight: 900;
}

.rank-table-header span:last-child {
	display: flex;
	align-items: center;
	color: #ffce50;
	font-weight: 900;
}

.rank-table-header img {
	display: block;
	margin-right: 8px;
	max-width: 20px;
}

.rank-up-rewards span:first-child {
	font-weight: 900;
}

.rank-up-rewards span:first-child i {
	margin-right: 8px;
}

.rank-up-rewards span:last-child {
	color: #cdba37;
	font-weight: 900;
}

.rank-table tr th,
.rank-table tr td {
	padding: 8px 12px;
	color: #fff;
	border: 1px solid #101010;
	background: rgba(255, 255, 255, 0.05);
}


/********
Profile
********/

.profile-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.profile-nav {
	padding: 16px;
	width: 268px;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 8px;
}

.profile-header {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 32px;
	padding: 16px;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 8px;
}

.profile-rank {
	width: 40px;
}

.profile-rank img {
	width: 40px;
}

.profile-username {
	display: flex;
	flex-direction: column;
	gap: 4px;
	width: calc(95% - 40px);
}

.profile-username span:first-child {
	font-weight: 900;
}

.profile-username span:last-child {
	font-size: 0.85em;
}

ul.profile-menu {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

ul.profile-menu li {
	display: flex;
	align-items: center;
	width: 100%;
}

ul.profile-menu li a {
	display: block;
    padding: 16px;
	width: 100%;
}

ul.profile-menu li a:hover {
    color: rgba(255, 255, 255, 1);
    background: #252525;
    border-radius: 50px;
}

ul.profile-menu li.active a {
    color: rgba(255, 255, 255, 1);
    background: #252525;
    border-radius: 50px;
}

ul.profile-menu li i {
	width: 30px;
	text-align: center;
}

.profile-content {
	width: calc(95% - 268px);
}

.amt-max {
	position: absolute;
    top: 9px;
    right: 9px;
	z-index: 9;
}

.amt-max a {
	display: block;
    height: 40px;
    padding: 0 16px;
    color: #fff;
    font-size: 1em;
    line-height: 40px;
    background: rgba(255,255,255,0.08);
    border-radius: 4px;
}

ul.bankinfo {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 16px 0 16px 24px;
}

ul.bankinfo li {
	list-style-type: decimal;
}

.inbox-details {
	padding: 32px;
}

ul.inbox-category {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
	margin: 32px 0;
    width: 100%;
    background: #101010;
    border-radius: 16px;
    align-items: center;
}

ul.inbox-category a {
    display: flex;
    align-items: center;
    min-width: 68px;
    height: 68px;
    padding: 0 16px;
    color: #fff;
    text-align: center;
}

ul.inbox-category a.active {
    color: #ffce50;
    font-weight: 800;
}
ul.inbox-category > li{
    display: flex;
    align-items: center;
}
ul.inbox-category .badge {
	margin-left: 4px;
}

ul.inbox-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

ul.inbox-list li a {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px;
    color: #fff;
	/* color: rgba(255,255,255,0.5); */
	background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
}

ul.inbox-list li a span:first-child {
	font-size: 0.75em;
}

ul.inbox-list li.new a {
    color: #ffce50;
	/* color: rgba(255,255,255,1); */
	font-weight: 900;
}

.inbox-content {
	padding: 96px 32px 32px;
}

.inbox-content p {
	margin-bottom: 16px;
}

.table-default {
	color: #fff;
	text-align: center;
}

.table-default thead tr th {
	background: #252525;
	border: 1px solid #fff;
}

.table-default tbody tr td {
	background: #252525;
	border: 1px solid #101010;
}

/********
Decorations
********/

.shine {
	content:'';
 	top:0;
	transform:translateX(100%);
	width:100%;
	height:100%;
	position: absolute;
	z-index:1;
	animation: slide 4.8s infinite;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(315deg, rgba(255,255,255,0) 15%, rgba(255,255,255,0.5018382352941176) 50%, rgba(255,255,255,0) 85%);
	background: -webkit-linear-gradient(315deg, rgba(255,255,255,0) 15%, rgba(255,255,255,0.5018382352941176) 50%, rgba(255,255,255,0) 85%);
	background: linear-gradient(315deg, rgba(255,255,255,0) 15%, rgba(255,255,255,0.5018382352941176) 50%, rgba(255,255,255,0) 85%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

@keyframes slide {
  0% { transform: translateX(-100%); }
  10% {transform: translateX(100%); }
  100% {transform: translateX(150%); }
}

.txt-bronze {
	color: #db952e;
}

.txt-silver {
	color: #bdccd1;
}

.txt-gold {
	color: #ffad1e;
}

.txt-platinum {
	color: #4ff7f7;
}

.mt32 {	margin-top: 32px !important; }
.mb32 { margin-bottom: 32px !important; }

.form-control:focus{
    background: transparent !important;
}

.popular-games-container > .swiper {
    -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 85%, rgba(0, 0, 0, 0) 100%);
    /* mask-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 85%, rgba(0, 0, 0, 0) 100%); */
}