article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}
body {
	line-height: 1;
}
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;
}
html {
	font-size: 3.125rem; /* 50px */
}
@media (max-width: 75rem) { /* 1200px */
	html {
		font-size: 2.8125rem; /* 45px */
	}
}
@media (max-width: 53.75rem) { /* 860px */
	html {
		font-size: 2.625rem; /* 42px */
	}
}
@media (max-width: 31.25rem) { /* 500px */
	html {
		font-size: 2.675rem; /* 38px */
	}
}

body {
	    margin: 0;
	background: #0c192c;
	font-family: "Open Sans", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.3;
}
* {
	box-sizing: border-box;
}
a {
	color: #fff;
	text-decoration: none;
}
.bold,
.strong,
b,
strong {
	font-weight: bold;
}
img {
	max-width: 100%;
	height: auto;
}
.App {
	margin: 0 auto;
	max-width: 540px;
	position: relative;
	min-height: 100vh;
	box-shadow: 0 0 0.13333rem 0 rgba(125, 124, 124, 0.3);
}
input:focus,
select:focus,
select:active {
	outline: .01333rem solid #13a2ba;
	-webkit-user-select: text;
	user-select: text;
}
.title {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	margin-bottom: 0.32rem;
	color: #f2f2f2;
	font-size: 0.4rem;
	font-weight: 600;
}
.title:before {
	content: "";
	display: block;
	width: 0.08rem;
	height: 0.4rem;
	background: #f2f2f2;
	margin-right: 0.13333rem;
}
.title-h1 {
	text-align: center;
	color: #fff;
	font-size: 0.7rem;
	font-weight: bold;
	position: relative;
	z-index: 1;
	margin: 0.6rem 0;
}
.login {
	padding: 0 0.32rem;
	min-height: 100vh;
	background: 
		url(/static/media/backgroundLogin.png) center top;
	display: flex;
}
.form-lg input {
	width: 100%;
	height: 1.17333rem;
	padding: 0.36rem 0.34667rem;
	background: #11122c;
	margin: 0 0 0.2rem;
	border: 1px solid #3e32b2 !important;
	font-size: 0.37333rem;
	border-radius: 0.26667rem;
	color: #fff;
	/* box-shadow: 0 0.05333rem 0.21333rem #d0d0ed5c; */
}
.form-rank input {
	height: 1.17333rem;
	padding: 0.36rem 0.34667rem;
	background: #11122c;
	margin: 0 0 0.2rem;
	border: 1px solid #3e32b2 !important;
	font-size: 0.37333rem;
	border-radius: 0.26667rem;
	color: #fff;
	/* box-shadow: 0 0.05333rem 0.21333rem #d0d0ed5c; */
}

.form-lg select {
    width: 100%;
    height: 1.17333rem;
    color: #fff;
    background: #11122c;
    border: 1px solid #3e32b2 !important;
    padding: 0.36rem 0.34667rem;
    margin: 0 0 0.2rem;
    font-size: 0.37333rem;
    /* border: none; */
    border-radius: 0.26667rem;
    /* box-shadow: 0 0.05333rem 0.21333rem #d0d0ed5c; */
}
.form-lg label {
	margin: 0.2rem auto 0.1rem;
	text-align: left;
	max-width: 90%;
	display: block;
}
.login h1 {
	margin: 0 0 0.2rem;
	text-transform: uppercase;
	color: #fff;
	font-size: 0.5rem;
	font-weight: bold;
}
.form-lg {
	margin: auto;
	width: 100%;
}
.form-lg .inputs {
	padding-bottom: 0.2rem;
}
.form-lg p:not(:empty) {
	color: #eee;
	font-size: 0.4rem;
	margin-bottom: 0.5rem;
}
.form-lg button {
	height: 1.06667rem;
	color: #fff;
	font-size: 0.48rem;
	font-weight: 700;
	letter-spacing: 0.05333rem;
	text-shadow: none;
	border-radius: 1.06667rem;
	border: none;
	background: linear-gradient(179deg,#13a2ba,#087c95);
	box-shadow: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 90%;
	margin: 0.5rem auto;
}
.form-rank button {
	height: 1.06667rem;
	color: #fff;
	font-size: 0.48rem;
	font-weight: 700;
	letter-spacing: 0.05333rem;
	text-shadow: none;
	border-radius: 1.06667rem;
	border: none;
	background: linear-gradient(179deg,#13a2ba,#087c95);
	box-shadow: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 90%;
	margin: 0.5rem auto;
}
.login form .input {
	position: relative;
}
.login form svg {
	font-size: 24px;
	color: #666;
	right: 35px;
	top: 45%;
	transform: translateY(-50%);
	position: absolute;
    width: 29px;
}
form#update_the svg {
	font-size: 24px;
	color: #666;
	right: 35px;
	top: 45%;
	transform: translateY(-50%);
	position: absolute;
    width: 29px;
}
.login form .re_capcha {
	font-size: 24px;
	color: #666;
	right: 35px;
	top: 45%;
	transform: translateY(-50%);
	position: absolute;
    width: 100px;
}
.main {
	background: #0c192c;
	color: #f2f2f2;
	padding: 0 0.32rem 2rem;
	min-height: 100vh;
	overflow: hidden;
}
.main .header {
	position: relative;
	margin-left: -0.32rem;
	margin-right: -0.32rem;
	padding: 0 0.32rem;
}
.main .header:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(81,92,109,.8);
	height: 4rem;
	width: 100%;
	z-index: 0;
	border-bottom-left-radius: 1.5rem;
	border-bottom-right-radius: 1.5rem;
}
.main .header .header-top {
	height: 1.22667rem;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	z-index: 1;
}
.main .header .header-right {
	color: #fff;
	font-size: 0.333rem;
}
.main .header .header-right svg {
	height: 0.333rem;
	width: 0.333rem;
	position: relative;
	margin-left: 5px;
	top: 2px;
}
.main .header .logo img {
	max-height: 1rem;
	width: auto;
	margin-top: 0.2rem;
}
.main .swiper img {
	border-radius: 8px;
}
.main .list-game {
	display: grid;
	grid-gap: 0.3rem;
	margin: 0.3rem 0;
}
.main .box-game a {
    display: flex;
    position: relative;
    width: 100%;
    height: 2.26667rem;
	    padding: 10px;
    border-radius: 0.26667rem;
    background: linear-gradient(176deg, #183b58 12.08%, #0c2742 85.02%);
    justify-content: space-between;
    align-items: center;
}
.main .box-game img {
	    max-height: 100px;
    max-width: 100px;
}
.main .box-game h3 {


    text-align: left;
    display: inline;
   
    color: #fff;
   
    font-size: 0.46667rem;
}
.main .box-game .box-game-text {
    color: #f4f5f8;

    font-size: 0.29333rem;

    bottom: 0px;

  
    text-align: left;

}
.main .box-game.op a {
	text-align: start;
	background: linear-gradient(-124.32deg, #df2a2a 12.08%, #ee8d8d 85.02%);
}
.main .box-game.op h3 {
	left: auto;
	right: 0.6em;
}
.main .box-game.op .box-game-text {
	left: auto;
	right: 1em;
	text-align: right;
}
.tab-navigation {
	height: 0.96rem;
	line-height: 0.96rem;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	margin: 0.8rem auto 0;
}
.tab-navigation > li {
	flex: 1;
	height: 100%;
	background: #e8e7e8;
	border-radius: 0.21333rem;
	font-size: 0.37333rem;
	color: #333;
	margin: 0 0.32rem;
	text-align: center;
	overflow: hidden;
	cursor: pointer;
}
.tab-navigation > li.active {
	background: #0d8ea7;
	box-shadow: 0 0 16px rgba(0, 0, 0, 0.25);
	font-weight: 600;
	color: #fff;
}
.tab-content {
	font-size: 0.333rem;
	margin: 0.32rem;
	background: #fff;
	border-radius: 0.13333rem;
	overflow: hidden;
	box-shadow: 0 0 12px rgba(0, 0, 0, 0.15);
}
table {
	width: 100%;
	border-collapse: collapse;
	color: #333;
}
table th,
table td {
	padding: 0.2rem;
}
table thead {
	background: #bfbfbf;
	color: #000;
	font-size: 0.4rem;
	font-weight: 500;
}
table tbody td {
	text-align: left;
}
table tbody td:last-child {
	text-align: right;
}
table tr {
	border-bottom: 1px solid #ebebeb;
	    color: #2f00ff;
}
table thead th {
	background-color: #f5f5f5;
	font-weight: bold;
	color: #000;
}
table tbody tr:nth-child(even) {
	background-color: #f9f9f9;
	color: #000;
}
table tbody tr:hover {
	background-color: #ebebeb;
	color: #000;
}
.award_tb {
	max-height: 10.3rem;
	overflow: auto;
}
.redball {
	background: linear-gradient(179deg,#13a2ba,#087c95);
	color: #fff;
	margin: 0 0.033rem;
	border-radius: 100%;
	width: 0.5rem;
	height: 0.5rem;
	line-height: 0.47rem;
	font-size: 0.33rem;
	text-align: center;
	animation: xoayxoay  0.5s ease-in-out;
}
.ball_xs {
	display: flex;
}
.ball_xs .ball {
	background: #ffc200;
	color: #fff;
	margin: 0 0.04rem;
	border-radius: 100%;
	width: 0.7rem;
	height: 0.7rem;
	line-height: 0.65rem;
	font-size: 0.53rem;
	text-align: center;
}
.record_bet {
    min-height: 3.27333rem;
    /* box-shadow: inset 0 -3em 3em rgb(109 108 108 / 67%), 0 0 0 2px white, 0.3em 0.3em 1em rgb(137 129 129); */
    background: #0f1e31;
    border-radius: 0.53333rem;
    font-size: 0.444rem;
    color: #ccc;
    position: relative;
    z-index: 1;
}
.colum-resultxs {
	display: flex;
	flex-flow: row wrap;
	padding: 0.3rem 0 0;
}
.colum-resultxs > .col-50 {
	width: 50%;
	padding: 0.1rem 0.3rem 0.1rem;
	display: flex;
	align-items: center;
	flex-flow: row wrap;
	justify-content: center;
}
.colum-resultxs > .col-50 .info_bet {
	width: 100%;
	white-space: nowrap;
}
.colum-resultxs > .col-100 {
	width: 100%;
	padding: 0.3rem 0.5rem 0.5rem;
}
.colum-resultxs > div:first-child {
	border-right: 1px solid #eee;
}
.xs_before {
	margin: 0.2rem 0 0.3rem;
	color: #ccc;
	font-weight: 600;
}
.record_bet .count {
	height: 0.8rem;
	line-height: 0.8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0.3rem 0 0;
}
.record_bet .count > div {
	/* background: #efeff4;
	border: .00667rem solid #fff; */
	border-radius: 0.05333rem;
	color: #087c95;
	font-weight: 700;
	font-size: 0.48rem;
	text-align: center;
	padding: 0 0.13333rem;
	margin-left:2px
}
.record_bet .count > .notime {
	background: transparent;
}
.btn-mini {
    padding: 0 0.15rem;
    height: 0.61333rem;
    font-size: 0.25333rem;
    text-align: center;
    border: .01333rem solid #434f60;
    border-radius: 0.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ccc9c2;
    background: #404b5e;
    margin: auto;
}
.btn-medium {
	padding: 0.1rem 0.3rem;
	height: 0.81333rem;
	font-size: 0.35333rem;
	text-align: center;
	background: linear-gradient(179deg,#13a2ba,#087c95);
	border-radius: 0.8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	border: none;
	margin: auto;
}
.box-quay {
    height: 3.09333rem;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5);
    margin-top: 0.48rem;
    background: linear-gradient(45deg, #00ffb8, #00e065);
    border-radius: 0.18667rem;
    border: 1px solid #04fff3;
    position: relative;
    padding: 0.26667rem;
}
.box-quay:after,
.box-quay:before {
	content: "";
	display: block;
	width: 0.13333rem;
	height: 0.69333rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 0;
}
.box-quay:before {
	background: #008b59;
	border-radius: 0.13333rem 0 0 0.13333rem;
	left: -0.13333rem;
}
.box-quay:after {
	background: #008b59;
	border-radius: 0 0.13333rem 0.13333rem 0;
	right: -0.13333rem;
}
.box-quay .box {
	background: #003c26;
	border-radius: 0.13333rem;
	height: 100%;
	width: 100%;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.13333rem;
}
.box-quay .box:after,
.box-quay .box:before {
	position: absolute;
	width: 0;
	height: 0;
	border-top: 0.18667rem solid transparent;
	border-bottom: 0.18667rem solid transparent;
	content: "";
	z-index: 3;
}
.box-quay .box:before {
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	border-right: 0.53333rem solid transparent;
	border-left: 0.53333rem solid #00b977;
}
.box-quay .box:after {
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	border-left: 0.53333rem solid transparent;
	border-right: 0.53333rem solid #00b977;
}
.box-quay .box .slot-column {
	display: inline-block;
	width: calc((100% - 0.53333rem) / 5);
	height: 100%;
	border-radius: 0.10667rem;
	overflow: hidden;
	background: #333;
	vertical-align: bottom;
	position: relative;
	text-align: center;
}
.box-quay .box .slot-column .slot-transform {
	transform: translateY(-2.73333rem);
	transition: all 0.4s;
}
.box-quay .box .slot-column .slot-transform .slot-num {
	width: 1.46667rem;
	height: 1.46667rem;
	line-height: 1.46667rem;
	background: #e1e1ec;
	border-radius: 50%;
	font-size: 0.8rem;
	color: #0006;
	font-weight: 700;
	margin: 0 auto 0.10667rem;

}
.box-quay .box .slot-column .slot-transform .slot-num:nth-child(3) {
	background: linear-gradient(45deg, #00fee9, #a2abdd, #00fee9);
    color: #fff;
}
.box-quay .box .slot-column .slot-transform.slot-scroll {
	-webkit-animation: slotScroll 4s cubic-bezier(0.65, 0.02, 0.65, 1.06);
	animation: slotScroll 4s cubic-bezier(0.65, 0.02, 0.65, 1.06);
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	transition: all 0.4s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;

}

.box-quay .box .slot-column .slot-transform.slot-scroll[data-col="1"] {
	-webkit-animation-delay: 0.12s;
	animation-delay: 0.12s;
	transition: all 0.4s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

.box-quay .box .slot-column .slot-transform.slot-scroll[data-col="2"] {
	-webkit-animation-delay: 0.24s;
	animation-delay: 0.24s;
	transition: all 0.4s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

.box-quay .box .slot-column .slot-transform.slot-scroll[data-col="3"] {
	-webkit-animation-delay: 0.36s;
	animation-delay: 0.36s;
	transition: all 0.4s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

.box-quay .box .slot-column .slot-transform.slot-scroll[data-col="4"] {
	-webkit-animation-delay: 0.48s;
	animation-delay: 0.48s;
	transition: all 0.4s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes slotScroll {
	from {
		-webkit-transform: translateY(-1.44rem);
		transform: translateY(-1.44rem);	
	}
	50% {
		-webkit-transform: translateY(-42.66667rem);
		transform: translateY(-29.33333rem);
	}
	to {
		-webkit-transform: translateY(-1.44rem);
		transform: translateY(-1.44rem);	
	}
}
@keyframes slotScroll {
	from {
		-webkit-transform: translateY(-1.44rem);
		transform: translateY(-1.44rem);	
	}
	50% {
		-webkit-transform: translateY(-42.66667rem);
		transform: translateY(-29.33333rem);
	}
	to {
		-webkit-transform: translateY(-1.44rem);
		transform: translateY(-1.44rem);	
	}
}

.box-quay .box > [class^="num"] {
	width: calc((100% - 0.4rem) / 3);
	height: 2.29333rem;
	background-color: #333;
	border-radius: 0.13333rem;
	position: relative;
	background-position: center;
	background-size: 70%;
	background-repeat: no-repeat;
}
.box-quay .box > [class^="num"]:before {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	z-index: 2;
	box-shadow: inset 0 -0.13333rem 0.13333rem #0000004d,
		inset 0 0.13333rem 0.13333rem #0000004d;
}
.box-quay .box.xucsac > .num1 {
	background-image: url(/static/media/num1.png);
}
.box-quay .box.xucsac > .num2 {
	background-image: url(/static/media/num2.png);
}
.box-quay .box.xucsac > .num3 {
	background-image: url(/static/media/num3.png);
}
.box-quay .box.xucsac > .num4 {
	background-image: url(/static/media/num4.png);
}
.box-quay .box.xucsac > .num5 {
	background-image: url(/static/media/num5.png);
}
.box-quay .box.xucsac > .num6 {
	background-image: url(/static/media/num6.png);
}
.text_choose_center {
    background: #0f1e31;
	
	border-radius: 0.26667rem;
	padding: 0.26667rem 0.34667rem;
	text-align: center;
	font-size: 0.34667rem;
	margin-top: 0.33rem;
}
.text_choose_center .bet_state {
	font-size: 0.3777rem;
	font-weight: bold;
	margin: 0.1rem 0 0.3rem;
	display: inline-block;
	border-bottom: 3px solid #0d8ea7;
}

.state_choose {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: row wrap;
}
.state_choose > div {
	flex: 1;
	margin: 0.1rem;
	border: 1px solid #e5e5e5;
	border-radius: 0.22rem;
	padding: 0.28rem;
	cursor: pointer;
}
.state_choose > div > * {
	display: block;
}
.state_choose > div > i {
	font-size: 0.35rem;
	color: #fff;
	margin-bottom: 0.2rem;
	font-weight: bold;
}
.state_choose .chooseItem {
	background: #0d8ea7;
	border: 1px solid #0d8ea7;
	color: #fff;
}
.state_choose .chooseItem * {
	color: #fff !important;
}
.state_choose .choose_xs {
	width: calc(10% - 0.1rem);
	padding: 0.1rem 0;
	margin: 0.05rem;
	flex: unset;
}
.popup-bet {
	position: fixed;
	bottom: -50vh;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(81,92,109,1);
	box-shadow: 0 0.05333rem 0.10667rem #c5c5da40;
	width: 100%;
	max-width: 540px;
	z-index: 101;
	padding: 0.3rem;
	transition: 0.3s;
}
.popup-bet.active {
	position: fixed;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(81,92,109,1);
	box-shadow: 0 0.05333rem 0.10667rem #c5c5da40;
	width: 100%;
	max-width: 540px;
	z-index: 101;
	padding: 0.3rem;
	transition: 0.3s;
}
.main:has(.chooseItem) .popup-bet {
	display: block;
}
.main:has(.chooseItem) .footer {
	display: none;
}
.main:has(.tab-game) .footer {
	display: flex !important;
}
.item_choose_footer {
	display: flex;
	justify-content: space-between;
	font-size: 0.4rem;
}
.item_choose_footer .btn-sbmit {
    color: #fff;
    font-size: 0.3rem;
    font-weight: bold;
    text-shadow: none;
    border-radius: 1.06667rem;
    border: none;
	background: linear-gradient(179deg, #799397, #616667);
    box-shadow: none;
    padding: 0.1rem 0.3rem;
    display: flex;
	pointer-events: none;
    align-items: center;
    justify-content: center;
}
.item_choose_footer .btn-sbmit.active {
	color: #fff;
	font-size: 0.3rem;
	font-weight: bold;
	text-shadow: none;
	border-radius: 1.06667rem;
	border: none;
	background: linear-gradient(179deg,#13a2ba,#087c95);
	box-shadow: none;
	padding: 0.1rem 0.3rem;
	display: flex;
	pointer-events: all;
	align-items: center;
	justify-content: center;
}
.item_choose_footer input {
	padding: 0.16rem 0.14667rem;
	margin: 0 0 0 0.2rem;
	font-size: 0.37333rem;
	border: none;
	border-radius: 0.26667rem;
	box-shadow: 0 0.05333rem 0.21333rem #d0d0ed5c;
	border: 1px solid #e5e5e5;
}

.popup-backdrop {
	display: none;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 540px;
    overflow-y: auto;
    height: 100vh;
    padding: 0.44rem;
    background: #000000c2;
    z-index: 9999;

    opacity: 1;
    transition: all 0.3s;
}
.popup-main {
	border-radius: 0.44rem;
	overflow: hidden;
	background: #fff;
	width: 100%;
}
.popup-header {
	background: linear-gradient(179deg,#13a2ba,#087c95);
	color: #fff;
	font-size: 0.45rem;
	font-weight: bold;
	padding: 0.32rem;
}
.popup-content {
	color: #555;
	padding: 0.32rem;
	font-size: 0.35rem;
	text-align: left;
	line-height: 1.3;
}
.popup-close {
	color: #fff;
	font-size: 0.35rem;
	font-weight: bold;
	text-shadow: none;
	border-radius: 0.66667rem;
	border: none;
	background: linear-gradient(179deg,#13a2ba,#087c95);
	box-shadow: none;
	padding: 0.15rem 0.4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0.32rem auto;
}
.content-history {
	position: relative;
	color: #b7b7b7;
	font-size: 0.3rem;
}
.content-history .item_inner {
	display: flex;
	justify-content: space-between;
	padding: 0.3rem;
	border-bottom: 1px solid #e5e5e5;
}
.content-history .item_history {
	text-align: left;
}
.content-history .id_history_sanh {
	margin: 0.2rem 0 0.08rem;
}
.content-history .sanh {
	color: #fff;
	font-size: 0.36rem;
	font-weight: bold;
}
.content-history.award_tb .sanh, .content-history.award_tb .money {
	color: #000
}
.content-history .money_history {
	text-align: right;
}
.content-history .money {
	color: #eee;
	display: block;
	margin: 0.2rem 0;
	font-size: 0.35rem;
}
.content-history .type_state {
	margin-left: 0.15rem;
	padding: 0.05rem 0.1rem;
	border-radius: 0.1rem;
	color: #fff;
}
.win {
	background-color: #6fe26f;
}
.lose {
	background-color: #b12424;
}
.pending {
	background-color: #ffc200;
}

.content_profile {
	font-size: 0.4rem;
}
.content_bank {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	color: #999696;
	margin: 1.7rem 0 0.5rem;
	font-size: 0.32rem;
}
.content_bank:not(:has(.item-banks:nth-child(2))) {
	font-size: 0.4rem;
}
.content_bank:not(:has(.item-banks:nth-child(2))) > div {
	width: 85%;
}
.content_bank > div {
	width: 85%;
	text-align: left;
	border: 1px solid #fff;
	padding: 0.15rem;
	position: relative;
}
.content_bank .copystk {
	position: absolute;
	right: 5px;
	font-size: 12px;
	color: #fff;
	background: rgba(0, 0, 0, 0.8);
	padding: 3px;
	border-radius: 3px;
	cursor: pointer;
}
.content_bank > div:nth-child(even) {
	border-left: 0;
}
.content_bank b {
	color: #fff;
}
.huongdan ul li {
	list-style: none;
	margin-bottom: 0.2rem;
	text-align: left;
	position: relative;
	padding-left: 0.4rem;
	font-size: 0.35rem;
	color: #eee;
}
.huongdan ul li:before {
	position: absolute;
	content: "";
	width: 0.13333rem;
	height: 0.13333rem;
	background: #13a2ba;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	left: -0.06667rem;
	top: 0.15333rem;
}
.box-banking {
	background: url(/static/media/box-banking.09a00c998ce3548d5a05.png?v=2) no-repeat center center;
	background-size: 100% 100%;
	padding: 0.26667rem 0.34667rem;
	text-align: center;
	font-size: 0.34667rem;
	margin-top: 0.33rem;
	margin-left: -0.33rem;
	margin-right: -0.33rem;
	min-height: 5rem;
	position: relative;
}
.box-banking2 {
	background-image: url(/static/media/box-banking2.d6f3e0d78c36733fce86.png);
	margin-left: 0;
	margin-right: 0;
}
.box-banking .icon_c#ffc200it {
	position: absolute;
	bottom: 0.9rem;
	left: 0.8rem;
	max-width: 0.9rem;
}
.box-banking .money_banking {
	position: relative;
	top: 0.9rem;
	left: 0.8rem;
	color: #fff;
	font-size: 0.64rem;
	font-weight: bold;
	text-align: left;
}
.box-banking .money_banking h3 {
	font-weight: normal;
	font-size: 0.4rem;
	color: #f5f5f5;
}
.box-banking .ctk {
    position: absolute;
    bottom: 1rem;
    right: 0.8rem;
    font-size: 0.45rem;
    color: #f2f2f2;
}
.table-result {
	text-align: center;
	font-family: arial;
	width: 100%;
}
.table-result td {
	text-align: center !important;
}
.table-result th {
	border-right: 1px solid #ebebeb;
}
.table-result td,
.table-result th {
	vertical-align: middle;
}
.special-prize {
	float: left;
	width: 100%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 28px;
	font-weight: bold;
	color: #ed1c25;
}
.prize1 {
	float: left;
	width: 100%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 0.48rem;
	font-weight: bold;
}
.prize2 {
	float: left;
	width: 50%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 0.48rem;
	font-weight: bold;
}
.prize3 {
	float: left;
	width: 33.3%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 0.48rem;
	font-weight: bold;
}
.prize4 {
	float: left;
	width: 25%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 0.48rem;
	font-weight: bold;
}
.prize5 {
	float: left;
	width: 33.3%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 0.48rem;
	font-weight: bold;
}
.prize6, .prize8 {
	float: left;
	width: 33.3%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-size: 0.48rem;
	font-weight: bold;
}
.prize7 {
	float: left;
	width: 25%;
	height: 0.8rem;
	line-height: 0.8rem;
	font-weight: bold;
	font-size: 0.48rem;
}
[class*="prize"]:empty {
	display: none;
}
.bacang {
	margin-bottom: 0.3rem;
	padding-bottom: 0.3rem;
	border-bottom: 1px solid #b7b7b7;
}
.tab-3cang {
	margin-left: -0.2rem;
	margin-right: -0.2rem;
	margin-top: 0.3rem;
}
.tab-3cang > li {
	margin: 0 0.05rem;
	font-size: 0.3rem;
	background: none;
	border: 1px solid #ffc107;
	line-height: 0.222rem;
	padding: 0.1333rem 0;
	color: #ffc107;
}
.tab-3cang > li.active {
	background: #ffc107;
	color: #fff;
}
.tab-3cang > li > div {
	width: 100%;
	height: 33.33%;
}
.tab-game > li {
	margin: 0 0.1rem;
	font-size: 0.28rem;
}
.box-image {
	box-shadow: 0 0 0.15rem 0 #d5c0c0;
	background: #fff;
	border-radius: 0.15rem;
	overflow: hidden;
	margin-bottom: 0.35rem;
}
.box-image-title {
font-size: 0.3rem;
    font-weight: 550;
    padding: 0.1rem 0.2rem 0.3rem;
    color: #333;
}
.demo {
	position: fixed;
	width: 100%;
	max-width: 540px;
	height: 100vh;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1rem;
	z-index: 99;
	background: #0000009d;
}
.loading {
	position: fixed;
	width: 100%;
	max-width: 540px;
	height: 100vh;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1rem;
	z-index: 999;
	background: #0000009d;
}
body:has(.info_bet) .loading {
	display: none !important;
}
.loader {
	position: relative;
	overflow: hidden;
	display: block;
	height: 50px;
	width: 50px;
	margin: 0;
}
.loader:after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 28px;
	height: 28px;
	margin: -16px 0 0 -16px;
	border: 2px solid #ffc200;
	border-top-color: #e1e8ed;
	border-right-color: #e1e8ed;
	border-radius: 100%;
	animation: spinner 1s infinite linear;
	transform-origin: center;
}
@keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn);
	}
}
.route_game input {
	border: 1px solid #e5e5e5;
}
body:has(.admin-theme) .table-result th,
body:has(.admin-theme) .table-result td span,
body:has(.admin-theme) .table-result td {
	font-size: 20px !important;
	margin: 10px 0;
}
body:has(.admin-theme) .table-result td input {
	position: relative;
	top: -10px;
}
.button-admin {
	background: #ffc200 !important;
	color: #fff !important;
	margin: 5px !important;
}
body:has(.admin-theme) input {
	border: 1px solid #ccc !important;
	border-radius: 5px !important;
	padding: 5px;
	font-size: 16px;
	max-width: 100%;
}
.col-1-1 {
	float: left;
	width: 50%;
	max-width: 250px;
	padding: 5px;
}
.form-admin {
	max-width: 400px;
	margin: 0 auto 15px;
	text-align: left;
}
.form-admin > div > div {
	margin: 15px 0;
	display: flex;
}
.form-admin label {
	width: 180px;
}
.form-admin button {
	margin: auto;
	display: block;
}
body:has(.admin-theme) h2 {
	margin: 15px 0 5px;
}
body:has(.admin-theme) #webpack-dev-server-client-overlay {
	display: none !important;
}
.promotionRule__container-content__rules-item {
	position: relative;
	padding: 0.57333rem 0.24rem 0.33333rem;
	border: 0.01333rem solid #dbb579;
	border-radius: 0.26667rem;
	border-top-right-radius: 0.26667rem;
	background: #fff;
	box-shadow: 0 0.05333rem 0.21333rem #d0d0ed5c;
}
.promotionRule__container-content__rules-item__splitBorder {
	position: absolute;
	width: 100%;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translate(-50%);
	line-height: 0.1;
	text-align: center;
}
.promotionRule__container-content__rules-item__splitBorder > span {
	position: relative;
	top: -0.16rem;
	display: inline-block;
	width: 2.4rem;
	border-top: 0.02667rem solid #fff;
}
.promotionRule__container-content__rules-item__borderTopStyle {
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translate(-50%);
	width: 100%;
}
.promotionRule__container-content__rules-item__borderTopStyle span {
	position: absolute;
	top: 0;
}
.promotionRule__container-content__rules-item__borderTopStyle
	span:first-of-type {
	left: -0.01333rem;
	width: 0.68rem;
	height: 0.68rem;
	border-top: 0.06667rem solid #dbb579;
	border-left: 0.06667rem solid #dbb579;
	border-top-left-radius: 0.26667rem;
}
.promotionRule__container-content__rules-item__borderTopStyle
	span:first-of-type:after {
	content: "";
	position: absolute;
	top: 0.29333rem;
	left: 0.2rem;
	width: 0.13333rem;
	height: 0.13333rem;
	border-radius: 50%;
	background-color: #dbb579;
}
.promotionRule__container-content__rules-item__borderTopStyle
	span:last-of-type {
	right: 0;
	width: 0.68rem;
	height: 0.68rem;
	border-top: 0.06667rem solid #dbb579;
	border-right: 0.06667rem solid #dbb579;
	border-top-right-radius: 0.26667rem;
}
.promotionRule__container-content__rules-item__borderTopStyle
	span:last-of-type:after {
	content: "";
	position: absolute;
	top: 0.29333rem;
	right: 0.2rem;
	width: 0.13333rem;
	height: 0.13333rem;
	border-radius: 50%;
	background-color: #dbb579;
}
.promotionRule__container-content__rules-item__titleLeft {
	position: absolute;
	top: -0.26667rem;
	left: calc(50% - 1.2rem);
	-webkit-transform: translateX(-50%);
	transform: translate(-50%);
	width: 0.26667rem;
	height: 0.53333rem;
	background-color: #dbb579;
	-webkit-clip-path: polygon(
		50% 0%,
		100% 0%,
		50% 50%,
		100% 100%,
		50% 100%,
		0% 50%
	);
	clip-path: polygon(50% 0%, 100% 0%, 50% 50%, 100% 100%, 50% 100%, 0% 50%);
	z-index: 5;
}
.promotionRule__container-content__rules-item__title {
	padding: 0 5px;
	position: absolute;
	top: -0.26667rem;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translate(-50%);
	z-index: 6;
	height: 0.53333rem;
	color: #fff;
	font-size: 0.32rem;
	text-align: center;
	line-height: 0.53333rem;
	background-color: #dbb579;
	-webkit-clip-path: polygon(
		7% 0%,
		93% 0%,
		100% 50%,
		93% 100%,
		7% 100%,
		0% 50%
	);
	clip-path: polygon(7% 0%, 93% 0%, 100% 50%, 93% 100%, 7% 100%, 0% 50%);
}
.promotionRule__container-content__rules-item__titleRight {
	position: absolute;
	top: -0.26667rem;
	left: calc(50% + 1.2rem);
	-webkit-transform: translateX(-50%) rotate(180deg);
	transform: translate(-50%) rotate(180deg);
	width: 0.26667rem;
	height: 0.53333rem;
	background-color: #dbb579;
	-webkit-clip-path: polygon(
		50% 0%,
		100% 0%,
		50% 50%,
		100% 100%,
		50% 100%,
		0% 50%
	);
	clip-path: polygon(50% 0%, 100% 0%, 50% 50%, 100% 100%, 50% 100%, 0% 50%);
	z-index: 5;
}
.promotionRule__container-content__rules-item p {
	color: #666;
	font-size: 0.32rem;
	letter-spacing: 0.01333rem;
	line-height: 0.50667rem;
}
.countdown > div {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.37333rem;
	color: #333;
	font-weight: 400;
}
.countdown > div > div {
	font-size: 0.53333rem;
	height: 0.8rem;
	border-radius: 0.13333rem;
	padding: 0 0.26667rem;
	line-height: 0.8rem;
	background: #efeff4;
	border-radius: 0.08rem;
	margin-left: 0.21333rem;
	color: #00b977;
	text-align: center;
}
.tkq {
	color: rgb(71, 123, 255);
	font-size: 0.4rem;
	font-weight: bold;
	display: block;
	margin-top: 0.2rem
}
.game-betting {
	margin: 0.8rem auto 0;
}
.game-betting .time-box {
	border-radius: 0.26667rem;
	background: #f94b55 url(/static/media/bannertimeout.webp) no-repeat 50%;
	background-size: auto 100%;
	display: flex;
	justify-content: space-between;
}
.game-betting .time-box .out {
	height: 100%;
	width: 50%;
	align-items: center;
	justify-content: center;
	border-left: 0.02667rem dashed #fff;
	position: relative;
	padding: 0.26667rem;
}
.game-betting .time-box .out:first-child {
	border: 0;
}
.game-betting .time-box .out:last-child:before {
	content: "";
	height: 0.4rem;
	width: 0.4rem;
	border-radius: 0.4rem;
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: #f5f5f5;
	transform: translate(-50%, 60%);
}
.game-betting .time-box .out:last-child:after {
	content: "";
	height: 0.4rem;
	width: 0.4rem;
	border-radius: 0.4rem;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #f5f5f5;
	transform: translate(-50%, -60%);
}
.game-betting .time-box .out .txt {
	color: #fff;
	font-size: 0.37333rem;
}
.game-betting .time-box .out .number {
	margin-top: 0.13333rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.game-betting .time-box .out .number .item {
	padding: 0.053333rem;
	background-color: #da2031;
	font-size: 0.53333rem;
	color: #fff;
	font-weight: 600;
}
.game-betting .time-box .out .number .item:first-child {
	padding-left: 0.13333rem;
	background: linear-gradient(135deg, transparent 0.13333rem, #da2031 0) 0 0;
}
.game-betting .time-box .out .number .item:last-child {
	padding-right: 0.13333rem;
	background: linear-gradient(-45deg, transparent 0.13333rem, #da2031 0);
}
.btn-login {
	background-image: linear-gradient(to top, #4f610c, #e7e983);
	border-radius: 10rem;
	color: #fff;
	font-size: 0.3rem;
	padding: 0.1rem 0.3rem;
	margin-right: 0.3rem;
}
.btn-register {
	background-image: linear-gradient(to top, #0e3967, #83c0e9);
	border-radius: 10rem;
	color: #fff;
	font-size: 0.3rem;
	padding: 0.1rem 0.3rem;
}
.tab-xucxac {
	height: 1.06667rem;
	background: #eeeeee;
	border-radius: 0.13333rem;
	display: flex;
	font-size: 0.29333rem;
	color: #7d7d7d;
	overflow: hidden;
	margin-bottom: 0.3rem;
}
.tab-xucxac > li {
	line-height: 1.06667rem;
	text-align: center;
	flex: 1;
}
.tab-xucxac > li.active {
	background: #ffc200;
	color: #fff;
	border-radius: 0.13333rem;
}
.state_xucxac > label:first-child {
	width: 100%;
	flex-basis: 100%;
}
.history_xucxac > div {
	width: 0.53333rem;
	height: 0.53333rem;
	background-repeat: no-repeat;
	background-size: 0.53333rem;
	background-position: center;
	margin: 0 0.05rem;
}
.history_xucxac > .n1 {
	background-image: url(/static/media/n1.png);
}
.history_xucxac > .n2 {
	background-image: url(/static/media/n2.png);
}
.history_xucxac > .n3 {
	background-image: url(/static/media/n3.png);
}
.history_xucxac > .n4 {
	background-image: url(/static/media/n4.png);
}
.history_xucxac > .n5 {
	background-image: url(/static/media/n5.png);
}
.history_xucxac > .n6 {
	background-image: url(/static/media/n6.png);
}
.main .box-game.op.xsmb > a {
	background: url(/static/media/mien-bac.png);
	background-size: cover;
}
.main .box-game.op.xsmt > a {
	background: url(/static/media/mien-trung.png);
	background-size: cover;
}
.main .box-game.op.xsmn > a {
	background: url(/static/media/mien-nam.png);
	background-size: cover;
}
.main .box-game.op.xsmb a > *,
.main .box-game.op.xsmt a > *,
.main .box-game.op.xsmn a > * {
	display: none;
}
.contentHtml {
	max-height: 300px;
	overflow-y: auto;
}
.btn-marquee {
	background: #ffc200;
	color: #fff;
	border: 0;
	border-radius: 0;
	padding: 5px 10px;
	cursor: pointer;
}
.marquees {
	display: flex;
	font-size: 14px;
	align-items: center;
	justify-content: left;
	color: rgb(255, 194, 0);
	background: #0c192c;
	padding: 5px 15px;
	margin-left: -16px;
	margin-right: -16px;
	margin-top: -5px;
	margin-bottom: -10px;
	overflow: hidden;
	width: calc(100% + 32px);
}
.marquees > div {
	line-height: 1;
	flex: 1;
}
.marquees > div:first-child {
	flex: 0 0 50px;
	text-align: left;
}
.marquee {
	width: calc(100% - 45px);
	overflow: hidden;
	white-space: nowrap;
	line-height: 1;
}

.marquee > p {
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	animation: marquee 20s linear infinite;
	line-height: 1.3;
}

@keyframes marquee {
	0% {
		transform: translateX(100%);
	}
	100% {
		transform: translateX(-100%);
	}
}

.quill {
	width: 100%;
	margin-bottom: 40px;
	min-height: 200px;
}
.logologin {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: 10%;
	width: 50%;
	max-width: 250px;
}
@media (max-width:1600px) {
	table{width:100%!important}
}
.lsgd-table {
	display: flex;
	font-size: 0.32rem;
	border-bottom: 1px solid #eee;
	padding-bottom: 5px;
	margin-bottom: 5px;
}
.lsgd-table > div {
	width: 50%;
	max-width: 50%;
	flex: 0 0 50%;
	text-align: left;
}
.table-lsgd td {
	padding: 0 0.1rem;
}
.table-result td span:empty {
	display: none;
}
.table-result td {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
}
.choose_xs.promo {
	background: #62fd62;
}
.state_choose .chooseItem.promo {
	background: linear-gradient(#62fd62, #ff0000);
	border: 1px solid #62fd62;
}
small {
	font-size: 90%;
	color: #007bff;
	font-weight: normal;
	margin-right: 3px;
}

svg {
    fill: #8b8b8b;
}
.choose_xs {
	display: none;
}                               
.checkmark {
	color: #cccccc;
    background: #404b5e;
padding: 5px;
display: flex;
justify-content: center;
align-items: center;
width: 37px;
height: 37px;
border-radius: 10px;
transition: all .3s;
cursor: pointer;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;

}
input:checked~.checkmark{
	background: #0d8ea7;
    color: #fff; 
}
label.label {
    margin: 2px;
}
.checkmarkkeno {
    padding: 10px;
    color: #cccccc;
    background: #404b5e;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 110px;
    height: 85px;
    border-radius: 10px;
    transition: all .3s;
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    flex-direction: column;
}
input:checked~.checkmarkkeno{
    background: #0d8ea7;
    color: #fff;
}
.checkmarkxucxac {
	color: #cccccc;
    background: #404b5e;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 72px;
    height: 85px;
    border-radius: 10px;
    transition: all .3s;
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    flex-direction: column;
}
input:checked~.checkmarkxucxac{
	background: #0d8ea7;
    color: #fff;
}
.child {
	color: #cccccc;
    background: #404b5e;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
   
    height: 85px;
    border-radius: 10px;
    transition: all .3s;
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    flex-direction: column;
}
input:checked~.child{
	background: #0d8ea7;
    color: #fff;
}
i.state {
	font-size: .35rem;
	font-weight: 700;
}
span.close_btn {
	position: absolute;
	font-size: 19px;
	right: 10px;
	top: 5px;
	cursor: pointer;
}
small#cois {
    color: #fff;
}
.popup-messenger {
    width: 200px;
    position: fixed;
    right: -27vh;
    bottom: 121px;
    pointer-events: none;
    height: 80px;
    border-radius: 5px;
    background: #ebe9e9;
	
	transition: all 0.3s;
}
.popup-messenger.active {
    width: 200px;
    position: fixed;
    right: 10%;
    bottom: 121px;
    pointer-events: none;
    height: 80px;
    border-radius: 5px;
    transition: all 0.3s;
    background: #ebe9e9;
	display: flex;
	z-index: 102;
    justify-content: center;
    align-items: center;
}
small.messenger-bet {
   
    font-size: 18px;
    text-align: left;
    display: flex;
    color: #7b7979;
    padding: 2px 5px;
    font-weight: 500;
    
}
span.ketqua {
    position: absolute;
    font-size: 20px;
    background: #e5e5e5;
    top: 29%;
    height: 30px;
    width: 30px;
    right: 30%;
    z-index: 1000000;
    border-radius: 50%;
    color: #000000;
}
    .friend a .status-dot {
    font-size: 12px;
    color: #468669;
    padding-left: 10px;
}
    .friend a {
  display: flex;
  align-items: center;
  padding-bottom: 20px;
  border-bottom: 1px solid #e6e6e6;
  justify-content: space-between;
}
:is(.users, .friend) .content {
 
    width: 100%;
}
span.xam {
    position: absolute;
    left: 20;
    padding-top: 10px;
}

.friend {
    width: 500px;
  min-height: 350px;
  overflow-y: auto;
  max-height: 350px;
  opacity: 1;
  z-index: 2;
  border-top: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
  margin: 24px 0 34px 0;
  pointer-events: all;
  background: #ffffffc4;
  border-radius: 5px;
  border: 1px solid #d7d3d3;
  backdrop-filter: blur(5px);
  padding: 20px;
  box-shadow: 0 0 128px 0 rgba(0,0,0,0.1), 0 32px 64px -48px rgba(0,0,0,0.5);
}
.friend span {
  object-fit: cover;
  border-radius: 100px;
}
.boc {
    position: fixed;
    top: 0px;
    width: 0px;
    height: 1px;
    right: -50vh;
    transition: all 0.4s;
}
.boc.active {
    position: fixed;
    top: 30px;
    left: 0;
    width: 100%;
    display: flex;
    height: 100vh;
    justify-content: center;
    align-items: center;
    transition: all 0.4s;
}
.popup-thanhvien {
    position: fixed;
    top: 0;
    left: -100vh;
    transform: translateX(-50%);
    width: 0;
    opacity: 0;
    max-width: 540px;
    height: 100vh;
    padding: 0.44rem;
    background: #000000c2;
    z-index: 1058;
    display: flex;
    align-items: center;
    flex-flow: row wrap;
	transition: all 0.3s;
}
.popup-thanhvien.active {
    position: fixed;
    top: 0;
    left: 50%;
	overflow-y: auto;
    transform: translateX(-50%);
    width: 100%;
    max-width: 540px;
    height: 100vh;
    padding: 0.44rem;
    background: #000000c2;
    z-index: 1058;
    display: flex;
    align-items: center;
    flex-flow: row wrap;
	opacity: 1;
	transition: all 0.3s;
}
.state_choose_xucxac{
	display: none;
}
.state_choose_xucxac.active {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: row wrap;
}
.box-quay .box.baucua > .num1 {
	background-image: url(/static/media/bau.png);
}
.box-quay .box.baucua > .num2 {
	background-image: url(/static/media/cua.png);
}
.box-quay .box.baucua > .num3 {
	background-image: url(/static/media/tom.png);
}
.box-quay .box.baucua > .num4 {
	background-image: url(/static/media/ca.png);
}
.box-quay .box.baucua > .num5 {
	background-image: url(/static/media/ga.png);
}
.box-quay .box.baucua > .num6 {
	background-image: url(/static/media/nai.png);
}
.checkmarkbaucua {
	color: #cccccc;
	
   background: #404b5e;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 85px;
    border-radius: 10px;
    transition: all .3s;
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    flex-direction: column;
}

input:checked~.checkmarkbaucua{
	box-shadow: inset 0 -3em 3em #0d8da78f !important;
}
.bi1 {
	background-image: url(/static/media/bau.png);
}
.bi2 {
	background-image: url(/static/media/cua.png);
}
.bi3 {
	background-image: url(/static/media/tom.png);
}
.bi4 {
	background-image: url(/static/media/ca.png);
}
.bi5 {
	background-image: url(/static/media/ga.png);
}
.bi6 {
	background-image: url(/static/media/nai.png);
}
td.ketqua div {
    background-size: 100% 100%;
    width: 30px;
    height: 30px;
}
td.ketqua {
    display: flex;
}
.xucxac1 {
	background-image: url(/static/media/num1.png);
}
.xucxac2 {
	background-image: url(/static/media/num2.png);
}
.xucxac3 {
	background-image: url(/static/media/num3.png);
}
.xucxac4 {
	background-image: url(/static/media/num4.png);
}
.xucxac5 {
	background-image: url(/static/media/num5.png);
}
.xucxac6 {
	background-image: url(/static/media/num6.png);
}
textarea#noi_dung {
    width: 100%;
    height: 100px;
}
textarea#noi_dung:focus {
    outline: .01333rem solid #13a2ba;
}

@-webkit-keyframes socdia2 {
	from {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);	
	}
	50% {
		-webkit-transform: rotate(-1deg);
		transform: rotate(-1deg);
	}
	to {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);
	}
}
@keyframes socdia2 {
	from {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);	
	}
	50% {
		-webkit-transform: rotate(-1deg);
		transform: rotate(-1deg);
	}
	to {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);
	}
}
.record_bet .colum-resultxs .socdia.active {
	-webkit-animation: socdia 0.1s cubic-bezier(0.65, 0.02, 0.65, 1.06);
	animation: socdia 0.1s cubic-bezier(0.65, 0.02, 0.65, 1.06);
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	transition: all 0.4s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@keyframes xoayxoay {
0% {
	transform: rotateY(0deg);
  }
  
  100% {
	transform: rotateY(360deg);
  }
}
.a10, .a50, .a100, .a500, .a1k, .all {
    width: 40px;
    height: 40px;
    margin: 0 3px;
    color: black;
    line-height: 40px;
    text-align: center;
    font-size: 17px;
    display: inline-block;
    background: url("/static/media/cois1.png");
    background-size: 100% 100% !important;
}
.a50 {
	background: url(/static/media/cois2.png);
	background-size: 100% 100% !important;
  }
  .a100{
	  background: url(/static/media/cois3.png);
	background-size: 100% 100% !important;
	
  }
  .a500 {
	background: url(/static/media/cois4.png);
	background-size: 100% 100% !important;
  }
  .a1k {
	background: url(/static/media/cois5.png);
	background-size: 100% 100% !important;
  }
  .all {
	background: url(/static/media/cois6.png);
	background-size: 100% 100% !important;
  }
  .tabbar__container-item {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-box-pack: end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	gap: .11707rem;
	color: #9397bd;
  }
  .account__ID {
    content: '';
    position: absolute;
    background-size: 100% 100% !important;
   
    width: 39px;
    height: 30px;
}
img.ipadd:active {
    scale: .7;
}
.hidden{
	opacity: 0;
	transition: all 0.5s;
}
.deactive{
	pointer-events: none;
}
.page-numbers {
    padding: 0;
    margin: 20px 3px;
    color: #fff;
}
.page-numbers li {
    display: inline-block;
    line-height: 35px;
}
.page-numbers li a {
    background: #226498;
    transition: .5s all;
    color: #feffff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .5);
    padding: 8px 13px;
    border-radius: 2px;
}
.page-numbers li a:hover {
    background: #396792;
    color: #fff;
    transition: .5s all;
}
section.users {
	overflow-y: auto;
	max-height: 80dvh;
}
ul.game-list li.li-game-list:nth-child(1) {
    border-top-left-radius: 8px;
}

ul.game-list li.li-game-list:nth-child(4) {
    border-top-right-radius: 8px;
}

ul.game-list li.li-game-list:last-child {
    border-bottom-right-radius: 8px;
}

ul.game-list li.li-game-list:nth-last-child(4) {
    border-bottom-left-radius: 8px;
}
.typing-indicator {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.typing-indicator span {
    width: 8px;
    height: 8px;
    background-color: #555;
    border-radius: 50%;
    animation: blink 1.5s infinite ease-in-out;
}

.typing-indicator span:nth-child(2) {
    animation-delay: 0.2s;
}

.typing-indicator span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes blink {
    0%, 80%, 100% {
        opacity: 0;
    }
    40% {
        opacity: 1;
    }
}
.box-banking .money_banking h4 {
    position: relative;
    top: -0.9rem;
    left: 0rem;
    color: #fff;
    font-size: 0.64rem;
    font-weight: bold;
    text-align: left;
}
.swal2-popup {
	font-size: 16px !important;
	width: 500px !important;
	max-width: 90vw;
  }
.icon_credit {
position: absolute;
top: 30px;
right: 72px;
}
#toast-container > .toast {
    font-size: 20px;        /* Cỡ chữ nhỏ hơn */
    width: auto !important; /* Cho chiều rộng linh hoạt */
    min-width: unset;       /* Bỏ giới hạn chiều rộng tối thiểu */
    max-width: 250px;       /* Có thể giới hạn chiều rộng tối đa nếu muốn */

}
@keyframes shine-474d0220 {
    0%,49% {
        box-shadow: none
    }

    50%,to {
        box-shadow: 0 0 10px #ff7628 inset,0 0 4px rgba(255,166,84,.52)
    }
}
.type-mark {
    text-align: center;
    background-color: #a0001d;
    display: block;
    padding: .2em;
    color: #fff;
    font: inherit;
    margin-left: .5625rem;
    animation: shine-474d0220 1s 0s linear infinite both;
}

.entrys-group {
display: flex;
    height: 4.375rem;
    margin-bottom: .625rem;
}
.anent-entry {
    background-image: url(/static/media/agent-box-DzQxXi9M.png);
    background-size: 100% 100%;
    width: 3.8125rem;
    height: 100%;
    box-sizing: border-box;
    cursor: pointer;
    font-size: .4375rem;
    font-weight: 400;
    padding: 0.325rem .325rem 0;
    text-align: center;
    text-transform: uppercase;
}
.entry-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .5rem 0;
    margin-left: .25rem;
}
.entry-item{
    flex: 1;
    display: flex;
    align-items: center;
    cursor: pointer;
    border-radius: .25rem;
    overflow: hidden;
    box-sizing: border-box;
    padding-right: .625rem;
    background: linear-gradient(329.38deg, rgba(43, 60, 92, .2) -7.61%, rgba(67, 107, 236, .9) 130.94%);
}
.img-icon {
    background-size: contain;
    background-repeat: no-repeat;
}
.entry-item-name {
    flex: 1;
   font-size: .35rem;
}
.money-fly {
  position: fixed;
  left: 50%;
  top: 20%;
  transform: translateX(-50%);
  font-size: 20px;
  font-weight: bold;
  color: #00ff66;
  opacity: 1;
  z-index: 999;
  animation: flyUp 3s ease-out forwards;
}
@keyframes flyUp {
  0% { transform: translate(-50%, 0); opacity: 1; }
  100% { transform: translate(-50%, -50px); opacity: 0; }
}
.nohu-fly {
  position: fixed;
  left: 50%;
  top: 20%;
  transform: translateX(-50%);
    font-family: "Rubik", sans-serif;
    font-size: 44px;
    background: -webkit-linear-gradient(270deg, rgba(255, 250, 145, 1) 30%, rgba(255, 154, 0, 1) 60%, rgba(238, 232, 0, 1) 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px #310404;
    font-weight: 900;
  opacity: 1;
  z-index: 999;
  animation: flyUp 5s ease-out forwards;
  
}
.symbol img.active {
  border: 2px solid gold;
  box-shadow: 0 0 10px yellow;
  border-radius: 8px;
}


.span-1k{
	    background: url(/static/media/nohu/1k.png) no-repeat;
}
.span-10k{
	    background: url(/static/media/nohu/10k.png) no-repeat;
}
.span-100{
	    background: url(/static/media/nohu/100.png) no-repeat;
}
.span-nohu{
	height: 40px;
    width: 40px;
    background-size: contain;
    display: block;
	  border-radius: 27px;
}
.input:checked~span{
	  border: 2px solid gold;
  box-shadow: 0 0 10px yellow;
  
}
.dong_game_coc {
    padding: 2px;
    top: 9px; 
    background: url(/static/media/nohu/dong.png);
    background-size: cover;
    width: 111px;
    line-height: 56px;
    cursor: pointer;
    height: 56px;
    left: 26px;
    box-shadow: inset 0px 4px 8px #11ccd7, 0px 2px 5px #43ecf6; 
    position: absolute;
}
.huongdan_game_coc {
    padding: 2px;
    top: 9px;
    background: url(/static/media/nohu/huongdan.png);
    background-size: cover;
    width: 56px;
    line-height: 56px;
    cursor: pointer;
    border-radius: 50%;
    height: 56px;
    right: 26px;
    box-shadow: inset 0px 4px 8px #11ccd7, 0px 2px 5px #43ecf6;
    position: absolute;
}
.dong span {
background: -webkit-linear-gradient(270deg, rgba(255, 250, 145, 1) 30%, rgba(255, 154, 0, 1) 60%, rgba(238, 232, 0, 1) 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px #310404;
	font-weight: 900;
}
.table_dong label {
   width: 13.33%;
    padding: 10px;
}

.table_dong {
    display: flex;
    position: absolute;
    flex-wrap: wrap;
    top: 58px;
    background: #083b41;
    left: 26px;
    padding: 10px;
    border: 1px solid #00ffd1;
    border-radius: 14px;
}


.span-dong{
	background-size: cover;
    height: 45px;
    border-radius: 7px;
    width: 45px;
	display: block;
}
.p {
  position:absolute;
  width:6px; height:6px;
  border-radius:50%;
  z-index: 999;
}
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    margin: 0;
}

.switch .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    transition: 0.4s
}
.switch.sm {
    width: 30px;
    height: 17px
}
.switch.sm .slider:before {
    height: 13px;
    width: 13px;
    left: 2px;
    bottom: 2px
}



.switch .slider.round {
    border-radius: 34px
}

.switch .slider.round:before {
    border-radius: 50%
}
.switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.4s;
}

.switch.active .slider {
    background-color: #5e72e4;
}



.switch.active .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px)
}

.switch.sm.active .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px)
}