@font-face {
	font-family: prompt;
	src: url(../fonts/Prompt/Prompt-Regular.ttf);
}

body {
	font-family: prompt !important;
	background-image: url(../images/bg.jpg);
	background-position: center;
	background-attachment: fixed;
  background-repeat: no-repeat;
	/* background-size: cover; */
	/* background-color: #e9eef4; */
}

body.login-page {
	/* background: #ffff; */
	background-image: url(../images/bg.jpg);
	background-position: center;
  background-repeat: no-repeat;
	background-size: cover;
	/* background: -webkit-linear-gradient(left, #131836, #280b0e);
	background: -o-linear-gradient(right, #131836, #280b0e);
	background: -moz-linear-gradient(right, #131836, #280b0e);
	background: linear-gradient(to right, #131836, #280b0e); */
}
.login-page .logo img {
	width: 250px;
	margin-bottom: -11rem;
}

body.register-page {
	background-image: url(../images/bg.jpg);
	background-position: center;
  background-repeat: no-repeat;
	background-size: cover;
	max-width: 600px;
	margin: auto;
}

body.register-page .text-white {
	text-shadow: 1px 1px 3px black;
}
input#amount_withdraw.form-control{
	background-color: black;
	color: white;
	border: 0px;
}
.login-form .form-control {
	background: black;
	color: white;
	padding: 1.3rem;
	border: 0;
	text-align: center;
}

.border-main {
	border-radius: .5rem;
	padding: 2px;
	background: rgb(249,82,82);
	background: linear-gradient(90deg, rgba(249,82,82,1) 0%, rgba(210,14,14,1) 100%);
}

.border-main2 {
	border-radius: .5rem;
	padding: 3px;
	background: rgb(255, 150, 38);
	background: linear-gradient(90deg, rgba(255, 150, 38, 1) 0%, rgba(255, 110, 0, 1) 34%, rgba(205, 87, 2, 1) 61%, rgba(145, 58, 0, 1) 100%);
}

.border-purple {
	border-radius: .5rem;
	padding: 3px;
	background: rgb(96,17,206);
	background: linear-gradient(185deg, rgba(96,17,206,1) 0%, rgba(156,67,234,1) 50%, rgba(96,17,206,1) 100%);
}

.text-main {
	background: linear-gradient(to right, #FF8008 0%, #FFC837 51%, #FF8008 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.text-main2{
	background: rgb(255,53,254);
background: linear-gradient(315deg, rgba(255,53,254,1) 0%, rgba(170,64,251,1) 51%, rgba(59,109,252,1) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.text-register {
	font-size: 1.5rem;
	font-weight: bold;
	color: white;
	text-shadow: 1px 1px 3px black;
}

/* marquee{
    background-color: lightgrey;
} */
div.section {
	max-width: 550px;
	min-height: 550px;
	margin: auto;
	/* background-image: url(../images/bg3.jpg);
	background-position: center;
  background-repeat: no-repeat;
	background-size: cover; */
	/* background: -webkit-linear-gradient(left, #131836, #280b0e);
	background: -o-linear-gradient(right, #131836, #280b0e);
	background: -moz-linear-gradient(right, #131836, #280b0e);
	background: linear-gradient(to right, #131836, #280b0e); */
}

.text-gold {
	background: linear-gradient(to right, #f9f295 0%, #e0aa3e 25%, #f7ef8a 25%, #b88a44);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.box-circle {
	background: rgb(153, 0, 119);
	background: linear-gradient(90deg, rgba(153, 0, 119, 1) 0%, rgba(98, 3, 171, 1) 51%, rgba(79, 30, 255, 1) 100%);
	border-radius: 50%;
	height: 280px;
	width: 280px;
	box-shadow: 1px 1px 15px white;
	animation: shadow-circle 3s infinite;
	margin: auto;
}

.box-btn-deposit {
	width: 45%;
}

.btn-deposit {
	font-size: 1.3em;
	border-radius: .5rem;
	padding: .3rem .5rem;
	background: rgb(255,187,69);
background: linear-gradient(90deg, rgba(255,187,69,1) 0%, rgba(255,121,44,1) 100%);
}

.btn-deposit img {
	width: 20px;
}

.border-main-deposit {
	border-radius: .5rem;
	padding: 2px;
	background: rgb(60,62,71);
background: linear-gradient(0deg, rgba(60,62,71,1) 0%, rgba(38,37,46,1) 100%);
}

.box-btn-withdraw {
	width: 45%;
}

.btn-withdraw {
	font-size: 1.3em;
	border-radius: .5rem;
	padding: .3rem .5rem;
	background: rgb(255,187,69);
background: linear-gradient(90deg, rgba(255,187,69,1) 0%, rgba(255,121,44,1) 100%);
}

.btn-withdraw img {
	width: 20px;
}

.border-main-withdraw {
	border-radius: .5rem;
	padding: 2px;
	background: rgb(60,62,71);
background: linear-gradient(0deg, rgba(60,62,71,1) 0%, rgba(38,37,46,1) 100%);
}

.box-btn-invite {
	width: 100%;
}

.btn-invite {
	color: white;
	font-size: 1rem;
	font-weight: bold;
	border-radius: .5rem;
	/* box-shadow: 0 0 10px white; */
	padding: .3rem .5rem;
	background: rgb(255,187,69);
background: linear-gradient(90deg, rgba(255,187,69,1) 0%, rgba(255,121,44,1) 100%);
}

.btn-invite img {
	width: 23px;
}

.btn-commission {
	color: white;
	font-size: 1.3em;
	font-weight: bold;
	border-radius: .5rem;
	box-shadow: 0 0 10px white;
	padding: .3rem .5rem;
	background: rgb(158,42,254);
background: linear-gradient(180deg, rgba(158,42,254,1) 0%, rgba(106,0,186,1) 100%);
}

.btn-commission img {
	width: 23px;
}

.btn-coupon {
	color: white;
	font-size: 1.3em;
	font-weight: bold;
	border-radius: .5rem;
	box-shadow: 0 0 10px white;
	padding: .3rem .5rem;
	background: rgb(40,40,40);
	background: linear-gradient(0deg, rgba(40,40,40,1) 0%, rgba(87,87,87,1) 100%);
}

.btn-coupon img {
	width: 23px;
}

.btn-cashback {
	color: white;
	font-size: 14px;
	font-weight: bold;
	border-radius: .5rem;
	padding: .3rem .5rem;
	background: rgb(255,202,43);
  background: linear-gradient(180deg, rgba(255,202,43,1) 0%, rgba(238,143,0,1) 100%);
}
.cashback-box {
	color: white;
	font-size: 1.2rem;
}
.btn-diamond {
	color: white;
	font-size: 14px;
	border-radius: .5rem;
	padding: .3rem .5rem;
	background: rgb(17,190,255);
  background: linear-gradient(180deg, rgba(17,190,255,1) 0%, rgba(6,130,215,1) 100%);
}

.balance-box-1 {
	width: 30%;
}
.balance-box-2 {
	width: 70%;
}

.credit-box {
	padding: 5px 10px;
	border-radius: .5rem;
	margin-top: .5rem;
}

.credit {
	font-size: 2rem;
	/* text-shadow: 1px 1px 8px black; */
}
.wallet-box {
	padding: 5px 10px;
	background: rgb(245,39,133);
background: linear-gradient(90deg, rgba(245,39,133,1) 0%, rgba(233,2,81,1) 100%);
	/* background-color: #f9beeb; */
	border-radius: .5rem;
	/* box-shadow: 2px 2px 5px #000; */
}
.wallet {
	font-size: 1rem;
	/* text-shadow: 1px 1px 8px black; */
}
.balance-box {
	background-color: #fefefe;
	border-radius: .5rem;
	box-shadow: 2px 2px 10px grey;
}
.text-credit {
	color: white;
	font-size: 1.1rem;
	font-weight: bold;
	margin-bottom: .2rem;
}

.text-wallet {
	color: white;
	font-size: 1.1rem;
	font-weight: bold;
}

.img-deposit {
	width: 90%;
}

.img-withdraw {
	width: 90%;
}

.menu-box-deposit {
	border: 2px solid white;
	border-radius: 1rem;
	font-size: 1.1rem;
	padding: .2rem .5rem;
	width: 45%;
	background: #348F50;
	background: -webkit-linear-gradient(to right, #56B4D3, #348F50);
	background: linear-gradient(to right, #56B4D3, #348F50);
}

.menu-box-deposit a {
	color: white;
}

.menu-box-withdraw {
	border: 2px solid white;
	border-radius: 1rem;
	font-size: 1.1rem;
	padding: .2rem .5rem;
	width: 45%;
	background: #FDC830;
	/* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #F37335, #FDC830);
	/* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #F37335, #FDC830);
	/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.menu-box-withdraw a {
	color: white;
}

.menu-box {
	margin: .5rem .5rem;
	width: 20%;
}

img.icon-menu {
	width: auto;
	height: 50px;
}

.header-game {
	padding: .5rem .4rem;
	font-size: 1.2rem;
}

/* .text-main {
	text-shadow: 1px 1px 5px black;
	font-size: 1.3rem;
	color: white !important;
} */
.btn-main {
	color: #212529;
	background-color: #a4b0be;
	border-color: #a4b0be;
}

.btn-login {
	background-image: linear-gradient(to right, #FF8008 0%, #FFC837 51%, #FF8008 100%);
}

.btn-login {
	padding: 5px 25px;
	text-align: center;
	font-size: 1.2rem;
	text-transform: uppercase;
	transition: 0.5s;
	background-size: 200% auto;
	color: white;
	box-shadow: 0 0 5px #eee;
	border-radius: 10px;
	display: block;
	font-weight: 800;
}

.btn-login:hover {
	background-position: right center;
	/* change the direction of the change here */
	color: #fff;
	text-decoration: none;
}

.btn-register {
	background-image: linear-gradient(to right, #4776E6 0%, #8E54E9 51%, #4776E6 100%);
}

.btn-register {
	padding: 5px 25px;
	text-align: center;
	font-size: 1.2rem;
	text-transform: uppercase;
	transition: 0.5s;
	background-size: 200% auto;
	color: white;
	box-shadow: 0 0 5px #eee;
	border-radius: 10px;
	display: block;
	font-weight: 800;
}

.btn-register:hover {
	background-position: right center;
	/* change the direction of the change here */
	color: #fff;
	text-decoration: none;
}
.line-button {
	background: green;
	padding: 5px 10px;
	border-radius: .5rem;
	text-decoration:none;
	font-size: .8rem;
}
.line-button:hover {
	background: grey;
	text-decoration:none;
}
.box-bank-detail {
	height: 80px;
}

.btn-dark {
	font-weight: bold;
	color: white;
	font-size: 1.2rem;
	background: rgb(56, 56, 56);
	background: linear-gradient(180deg, rgba(56, 56, 56, 1) 0%, rgba(0, 0, 0, 1) 100%);
}

.btn-warning {
	font-weight: bold;
	background: rgb(195, 127, 0);
	background: linear-gradient(0deg, rgba(195, 127, 0, 1) 0%, rgba(236, 172, 0, 1) 32%, rgba(236, 172, 0, 1) 54%, rgba(241, 235, 77, 1) 85%);
}

.eff-click:active {
	-ms-transform: translateY(2px);
	-webkit-transform: translateY(2px);
	transform: translateY(2px);
}

.footer {
	width: 100%;
	max-width: 550px;
	bottom: 0;
	/* background: rgba(0, 0, 0, 1); */
	position: fixed;
}

.dashboard .menu {
	width: 125px;
	margin-left: .2rem;
	margin-right: .2rem;
}

.btn-menu {
	width: 100%;
	font-size: 1.1em;
	padding: .3rem;
	border-radius: .3rem;
	background: rgb(56, 56, 56);
	background: linear-gradient(180deg, rgba(56, 56, 56, 1) 0%, rgba(0, 0, 0, 1) 100%);
}

.footer .menu {
	width: 25%;
	margin-left: .3rem;
	margin-right: .3rem;
	padding: .3rem;
	border-radius: .3rem;
	background: rgb(245,39,133);
	background: linear-gradient(90deg, rgba(245,39,133,1) 0%, rgba(233,2,81,1) 100%);
}
.invite-history {
	font-size: .9em;
}

.commission-rule {
	padding: 1rem;
	background-color: black;
	font-size: .8em;
}

.bg-black {
	background-color: black;
}

.invite-table {
	max-height: 180px;
	height: 120px;
	overflow: auto;
}

h1 {
	font-size: 22px;
}

h2 {
	font-size: 20px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 16px;
}

h5 {
	font-size: 14px;
}

h6 {
	font-size: 12px;
}

.text-primary {
	color: #fe6300 !important;
}

.logo img {
	width: 240px;
}

.user {
	font-size: .8em;
	border-radius: .5rem;
	padding: .3rem .5rem;
	background: rgb(56, 56, 56);
	background: linear-gradient(180deg, rgba(56, 56, 56, 1) 0%, rgba(0, 0, 0, 1) 100%);
}

.logout-top {
	font-size: .8em;
	border-radius: .5rem;
	padding: .3rem .5rem;
	background: #cfcfcf;
}

.text-user {
	font-size: 14px;
	color: black;
	border-radius: 20px;
	background-color: #f9ca24;
}

.text-money {
	font-size: 2em;
	line-height: 2.2rem;
}

.rounded {
	border-radius: .5rem !important;
}

.btn {
	border-radius: 10px;
}

.btn-black {
	color: #fff;
	background-color: black;
	border-color: black;
}

.btn-success {
	color: #fff;
	background-color: #1dd1a1;
	border-color: #1dd1a1;
}

.btn-success:hover {
	color: #fff;
	background-color: grey;
	border-color: grey;
}

.btn-black:hover {
	color: black;
	background-color: grey;
	border-color: grey;
}

.custom-control-input:checked~.custom-control-label::before {
	border-color: #fe6300;
	background-color: #fe6300;
}

/* .dashboard {
	padding-bottom: 8.5rem !important;
} */
.footer-menu {
	border-top-left-radius: 1rem;
	border-top-right-radius: 1rem;
	padding: .3rem;
	margin-left: .5rem;
	margin-right: .5rem;
	width: 30%;
	background: rgb(195, 127, 0);
	background: linear-gradient(0deg, rgba(195, 127, 0, 1) 0%, rgba(236, 172, 0, 1) 50%, rgba(250, 216, 18, 1) 94%);
}

img.footer-img {
	width: 35px;
}

.footer-text {
	color: white;
	font-weight: bold;
	font-size: 1rem;
}

.login-bg {
	background-image: url(../images/login-bg-2.webp);
	background-position: center;
  	background-repeat: no-repeat;
	background-size: contain;
	height: 750px;
}
.form-auth {
	/* border-radius: 1rem; */
	/* background-color: #f7f7f7; */
	padding: 11rem 2rem 2rem 2rem;
	width: 450px;
	/* height: 1200px; */
	/* box-shadow: 3px 3px 5px grey; */
}

.form-auth .form-control {
	text-align: center;
}

.maintain-box {
	margin-top: 10rem;
}

img.maintain {
	width: 600px;
}

.game {
	text-align: center;
}

.game a {
	text-decoration: none;
	color: white;
}

.img-game {
	border: .1rem solid white;
	box-shadow: 1px 1px 6px black;
}

.game div.game-name {
	text-shadow: 3px 3px 5px black;
	color: white;
	padding: .6rem 0;
	font-size: .8rem;
}

.game img.slot-game {
	border-radius: .3rem;
	width: 80px;
}
.box-explain {
	background-color: rgba(0,0,0,0.5);
	padding: 1rem;
	border-radius: .5rem;
}
.box-explain h3 {
	font-size: 16px;
}
.box-explain h4 {
	font-size: 14px;
}
@media only screen and (max-width: 600px) {
	.form-auth {
		width: 300px;
		padding: 6rem 1rem 1rem 1rem;
	}

	img.maintain {
		width: 320px;
	}

	.maintain-box {
		margin-top: 12rem;
	}

	.login-page .logo img {
		width: 160px;
		margin-bottom: -6rem;
	}
	.login-form .form-control {
		padding: 1rem;
	}
	.login-bg {
		background-image: url(../images/login-mobile.webp);
		height: 600px;
		/* background-size: contain; */
		/* width:300px; */
	}
}

.loader {
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
}

.loader .bar {
	width: 5px;
	height: 3px;
	background: white;
	margin: 1px;
	animation: bar 1s infinite linear;
}

.loader .bar:nth-child(1) {
	animation-delay: 0s;
}

.loader .bar:nth-child(2) {
	animation-delay: 0.25s;
}

.loader .bar:nth-child(3) {
	animation-delay: 0.5s;
}

@keyframes bar {
	0% {
		transform: scaleY(1) scaleX(0.5);
	}

	50% {
		transform: scaleY(5) scaleX(1);
	}

	100% {
		transform: scaleY(1) scaleX(0.5);
	}
}
