/**********************************COLOUR THEME **********************************/
:root {
  /* =========================================
     🎨 Base Theme Colors
  ==========================================*/
  --color-black: rgba(0, 0, 0, 1);
  --color-blue: rgba(15, 78, 175, 1);
  --lite-cyan: rgb(25, 200, 255);
  --dark-cyan: rgba(52, 126, 194, 1);
  --lite-white: #e2edff;
  --lite-glass: rgba(255, 255, 255, 0.2);
  --color-white: rgba(255, 255, 255);

  --theme-color: #7132f5;
  --theme-color2: #AB33F5;
  --theme-color3: #d98efb;
  --title-color: #1e035b;


  /* =========================================
     🌈 Extended Gradient + Glow Colors
  ==========================================*/
  --glow-primary: rgba(0, 200, 255, 0.3);
  --glow-secondary: rgba(0, 150, 255, 0.2);
  --glow-highlight: rgba(255, 255, 255, 0.9);

  --border-gradient-1: #ffffff;
  --border-gradient-2: #00b7ff;
  --border-gradient-3: #006aff;

  --metal-gradient-dark: rgb(11, 15, 22);
  --metal-gradient-light: rgba(255, 255, 255, 0.05);
  --metal-glow: rgb(14, 71, 159);

   --glow-primary: rgba(0,160,255,0.15);
  --glow-primary-strong: rgba(0,200,255,0.3);
  /* =========================================
     🧊 Background Mappings
  ==========================================*/
  --bg-default: var(--color-black);
  --bg-primary: var(--color-blue);
  --bg-secondary: var(--lite-cyan);
  --bg-secondary-dark: var(--dark-cyan);
  --bg-white: var(--color-white);
  --bg-glass: var(--lite-glass);
  --bg-lite-white: var(--lite-white);

  /* =========================================
     ⚡ Gradient Base for Components
  ==========================================*/
  --grad-box-padding: linear-gradient(var(--bg-default), var(--bg-default)) padding-box;
  --grad-box-border: linear-gradient(
    120deg,
    var(--border-gradient-1),
    var(--border-gradient-2),
    var(--border-gradient-3),
    var(--border-gradient-1)
  ) border-box;

  --grad-bg-primary: linear-gradient(145deg, rgba(17, 64, 140, 0.95), rgba(5, 10, 25, 0.9));
  --grad-gloss: linear-gradient(
    135deg,
    var(--glow-highlight) 0%,
    rgba(160, 200, 255, 0.4) 25%,
    rgba(0, 100, 255, 0.2) 50%,
    rgba(255, 255, 255, 0.6) 75%,
    rgba(0, 50, 200, 0.3) 100%
  );
}

/*Header start*/

body {
	/* background: #000; */
	width: 575px;
	margin: 0 auto;

}

a:hover {
	color: #fff000;
}

.box {
	-webkit-box-shadow: 0px 0px 10px 5px rgba(255, 255, 255, 0.16);
	-moz-box-shadow: 0px 0px 10px 5px rgba(255, 255, 255, 0.16);
	box-shadow: 0px 0px 10px 5px rgba(255, 255, 255, 0.16);
}

.box2 {
	-webkit-box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.2);
	-moz-box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.2);
	box-shadow: 0px 0px 5px 5px rgba(255, 255, 255, 0.2);
}

.z-in1 {
	z-index: 1;
}

.z-in2 {
	z-index: 2;
}

.z-in3 {
	z-index: 3;
}

.text-gray {
	color: #7c7a7a;
}

@font-face {
	font-family: 'Walkway';
	src: url('../fonts/WalkwayBlack.woff2') format('woff2'), url('../fonts/WalkwayBlack.woff') format('woff');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Condensed';
	src: url('../fonts/WalkwayCondensedBold.woff2') format('woff2'), url('../fonts/WalkwayCondensedBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway';
	src: url('../fonts/WalkwayBold.woff2') format('woff2'), url('../fonts/WalkwayBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway';
	src: url('../fonts/WalkwaySemiBold.woff2') format('woff2'), url('../fonts/WalkwaySemiBold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Oblique';
	src: url('../fonts/WalkwayObliqueBold.woff2') format('woff2'), url('../fonts/WalkwayObliqueBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Oblique';
	src: url('../fonts/WalkwayObliqueBlack.woff2') format('woff2'), url('../fonts/WalkwayObliqueBlack.woff') format('woff');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway UltraCondensed';
	src: url('../fonts/WalkwayUltraCondensedBold.woff2') format('woff2'), url('../fonts/WalkwayUltraCondensedBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Oblique';
	src: url('../fonts/WalkwayOblique.woff2') format('woff2'), url('../fonts/WalkwayOblique.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Oblique';
	src: url('../fonts/WalkwayObliqueUltraBold.woff2') format('woff2'), url('../fonts/WalkwayObliqueUltraBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Condensed';
	src: url('../fonts/WalkwayCondensed.woff2') format('woff2'), url('../fonts/WalkwayCondensed.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway';
	src: url('../fonts/WalkwayUltraBold.woff2') format('woff2'), url('../fonts/WalkwayUltraBold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Oblique';
	src: url('../fonts/WalkwayObliqueSemiBold.woff2') format('woff2'), url('../fonts/WalkwayObliqueSemiBold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway UltraCondensed';
	src: url('../fonts/WalkwayUltraCondensed.woff2') format('woff2'), url('../fonts/WalkwayUltraCondensed.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Walkway Condensed';
	src: url('../fonts/WalkwayCondensedSemiBold.woff2') format('woff2'), url('../fonts/WalkwayCondensedSemiBold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Vani';
	src: url('../fonts/Vani.woff2') format('woff2'), url('../fonts/Vani.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Vani';
	src: url('../fonts/Vani-Bold.woff2') format('woff2'), url('../fonts/Vani-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

.obli {
	font-family: 'track';
}

.pop {
	font-family: 'Poppins';
}


.w-\[640px\] {
	width: 640px;
	margin: 0 auto;
}

/**********************************Header **********************************/

.dash-wrap {
	height: 80vh;
	overflow: hidden;
	overflow-y: scroll;
	position: relative;
	-webkit-overflow-scrolling: touch;
	pointer-events: auto;
	scrollbar-width: thin;
	rollbar-color: #e76bb6;
	padding-bottom: 80px;
	padding-top: 30px;
}
.dash-bg {
	background: linear-gradient(90deg, var(--bg-default) 0%, var(--bg-primary) 100%);
	background-size: cover;
	overflow: auto !important;
	height: 100vh;
	padding: 30px 0px;
}
.dash-bg {
	background: linear-gradient(90deg, var(--bg-default) 0%, var(--bg-primary) 100%);
	background-size: cover;
	overflow: auto !important;
	height: 100vh;
	padding: 30px 0px;
	background: url("../images/dash-bg.png") no-repeat scroll center;
	background-size: cover;
	/* background: url("../images/banner-bg-2.png") no-repeat scroll 0 0;
	background-size: cover; */

} 
.dash-nav iconify-icon {
	color: #fff;
	font-size: 23px;
	background: var(--lite-glass);
	border-radius: 50%;
	padding: 5px 5px;
}

.back-arrow iconify-icon {
	color: #fff;
	font-size: 28px;

}


.dash-link-icon iconify-icon {
	color: #fff;
	font-size: 30px;
}


.inner-title-small h4 {
	font-size: 16px;
}

.dash-nav iconify-icon:hover {

	background: var(--lite-cyan);
}

.dash-link-icon {
	position: relative;
	z-index: 1;
}

.dash-link-icon:hover iconify-icon  {
color: var(--lite-cyan) !important;
}

.dash-link-icon:hover h5  {
color: var(--lite-cyan) !important;
}


/* .invit-ico::after {
	position: absolute;
	content: "";
	background: #2e8cd1;
	width: 112px;
	height: 112px;
	left: -14px;
	filter: blur(20px);
	top: 0px;
	bottom: 0px;
	margin: auto;
	animation-name: flash;
	animation-duration: 2s;
	animation-iteration-count: infinite;
} */
.invit-ico img {
	position: relative;
	z-index: 2;
}
/* .cash-wheel-bg {
	background: var(--color-blue);
	border-radius: 15px;
	padding: 15px 15px;
	text-align: center;

	background: var(--lite-cyan);
} */

/* .cash-wheel-img::after {
	position: absolute;
	content: "";
	background: var(--dark-cyan);
	width: 88px;
	height: 88px;
	top: -16px;
	bottom: 0px;
	left: -1px;
	filter: blur(19px);
	animation-name: flash;
	animation-duration: 2s;
	animation-iteration-count: infinite;
} */
.cash-wheel-img img,
.cash-wheel-img h5 {
	position: relative;
	z-index: 2;
}

.cash-wheel-bg h5 {
	position: relative;
	z-index: 2;
}
/* .app-download {
	background: linear-gradient(180deg, var(--lite-cyan) 0%, var(--dark-cyan) 100%);
	border-radius: 15px;
	padding: 15px 3px;
	display: flex;
	align-items: start;
} 
.dah-tash {
	background: var(--dark-cyan);
	text-align: center;
	padding: 16px 10px;
	border-radius: 15px;
	border-radius: 15px 0px;
}*/
.invite-content h4 {
	font-size: 18px;
}

.dah-tash p,
.dah-tash h5 {
	position: relative;
}



/******************************** footer start**********************************/


.foot-link-fixed {
	border-radius: 31px;
	position: fixed;
	z-index: 10;
	bottom: 0;
	left: 0;
	right: 0;
	background: var(--color-black);
	width: 552px;
	margin: 0px auto;
} 

/*.bot-link-fixed {
	-webkit-box-shadow: 5px -3px 5px 4px rgba(25, 146, 224, 0.21);
	-moz-box-shadow: 5px -3px 5px 4px rgba(25, 146, 224, 0.21);
	box-shadow: 5px -3px 5px 4px rgba(25, 146, 224, 0.21);
	border-radius: 50px 50px 0px 0;
	margin-top: 20px;
}*/

.footer-bav-list {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	padding: 6px 0px;
}
.footer-bav-list iconify-icon {
	color: var(--lite-white);
	font-size: 25px;
	width: 43px;
	height: 43px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.3s ease, transform 0.3s ease;
	margin: 0 auto;
}
.footer-bav-list li a:hover iconify-icon {
	animation-name: tada;
	animation-duration: 2s;
	animation-iteration-count: infinite;
background: var(--lite-cyan);
  box-shadow: 0 0 15px rgba(21, 138, 224, 0.8), 0 0 30px rgba(21, 138, 224, 0.4);
  animation: glowPulse 1.2s ease-in-out infinite alternate;
  transform: translateY(-5px);

}
@keyframes glowPulse {
  0% {
    box-shadow: 0 0 5px rgba(21, 138, 224, 0.6), 0 0 10px rgba(21, 138, 224, 0.3);
  }
  100% {
    box-shadow: 0 0 10px rgba(21, 138, 224, 1), 0 0 20px rgba(21, 138, 224, 0.7);
  }
}
.footer-bav-list li a:hover h5 {
	color:var(--lite-white) !important;
	opacity: 1;
}
.footer-bav-list li a h5 {
	opacity: 0.6;
}

.masked {
	mask-image: linear-gradient(#000, #000);
	mask-size: 0% 70%;
	mask-position: 0 45%, 25% 25%, 50% 50%, 75% 0, 100% 50%;
	mask-repeat: no-repeat;
	animation: mask 8s linear infinite;
}

@keyframes mask {
	0% {
		mask-size: 0% 70%;
	}

	20% {
		mask-size: 20% 100%;
	}

	30% {
		mask-size: 30% 100%;
	}

	40% {
		mask-size: 40% 100%;
	}

	60% {
		mask-size: 60% 100%;
	}

	80% {
		mask-size: 80% 100%;
	}

	100% {
		mask-size: 100% 100%;
	}
}

/******************************** footer end**********************************/

/******************************** plan start**********************************/

.plan-date {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #060a21;
	border-radius: 20px;
	padding: 5px 0px;
}
.vip-plan-bg {
	background: var(--lite-glass);
	border-radius: 15px;
	padding: 15px 4px;
}
.plan-range span {
	font-size: 12px;
}

.current-level-bg {
	background: #090921;
	padding: 15px 15px;
	border-radius: 15px;
}

.plan-vip-level {
	display: flex;
	align-items: center;
}

.plan-vip-level {
	display: flex;
	align-items: center;
	background: rgba(255, 255, 255, 0.1);
	width: 77px;
	border-radius: 15px;
	padding: 0px 9px;
}

.profile-lock {
	display: flex;
	align-items: center;
}

.plan-caro {
	border-radius: 15px;
	padding: 25px 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.plan-bg1 {
	background: url(../images/trade-bg.png) no-repeat, #090921;
	width: 100%;
	height: 123px;
	border-radius: 15px;
	margin: 0 auto;
	/* border: 1px solid #fff; */
	background-size: cover;
}

.plan-bg2 {
	background: url(../images/trade-bg.png) no-repeat, #090921;
	width: 100%;
	height: 123px;
	border-radius: 15px;
	margin: 0 auto;
	background-size: cover;

}

.vip-plan-details {
	background: rgba(255, 255, 255, 0.2);
	border-radius: 15px;
	/* height: 366px; */
	padding: 0px 0px 20px 0px;
	height: 337px;
}

.vipplan-heading {
	padding: 15px 12px;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
}

.vip-heading-bg1 {
	background: linear-gradient(180deg, var(--lite-cyan) 1%, var(--dark-cyan)100%) no-repeat;
}
.vip-heading-bg2 {
	background: linear-gradient(19deg, var(--color-blue) 0%, var(--dark-cyan) 100%) repeat;
}
.vip-list-upgrade {
	padding: 15px 12px;
}

.vipplan-heading h2 {
	font-size: 19px;
}

.vip-amt-details span {
	font-size: 15px;
}


.vip-list-upgrade li {
	margin-top: 8px;
}

.vip-amt-details span {
	font-weight: bold !important;
}
.vip-plan-sec {
	width: 80%;
	border: 1px solid aliceblue;
	border-radius: 13px;
	margin: 0 auto;
}

/******************************** plan end**********************************/

/********************************deposit start**********************************/


.form-bg {
	background: rgba(255, 255, 255, 0.1);
	border-radius: 15px;
	padding: 15px 15px;
	background: radial-gradient(circle at 30% 30%, rgba(20, 30, 50, 1) 0%, rgba(5, 10, 25, 1) 100%);
	box-shadow: inset 0 0 15px var(--glow-secondary), inset 0 0 25px var(--glow-primary), 0 0 15px rgba(0, 100, 255, 0.2);
}
.tron-select {
	position: absolute;
	right: 0px;
	top: 0px;
	background: var(--lite-cyan);
	width: 24px;
	height: 25px;
	border-top-right-radius: 9px;
	text-align: center;
	padding: 0px 0px;
}

.deposit-upi {
	border: 2px solid var(--lite-cyan);
	padding: 9px 15px;
	width: 126px;
	border-radius: 15px;
}
.deposit-upi h4 {
	color: var(--color-white);
	font-size: 18px;
}
.Qr-code-img {
	background: #fff;
	width: 177px;
	height: 174px;
	padding: 10px 0px;
	border-radius: 15px;
	margin: 0 auto;
	margin-top: 20px;
	margin-bottom: 20px;
}

.err_msg {
	position: absolute;
	top: 0px;
	right: 0px;
	text-align: center;
	color: #fff;
	width: 21%;
	border-top-right-radius: 7px;
	border-bottom-right-radius: 7px;
	background: linear-gradient(1deg, rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%);
	background: linear-gradient(180deg, rgb(25, 200, 255) 1%, rgba(52,126,194,1) 100%);
	border: none;
	border-radius: 10px 10px 0px 0px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px 0px;
}
/********************************deposit end*********************************/

/********************************wallet start*********************************/


.title-heading h3 {
	font-size: 20px;
}

.withdraw-amt span {
	font-size: 22px;
}

.flexi-amt span {
	font-size: 16px;
}

.pop-up-bg {
	background: var(--dark-cyan);
	padding: 15px 15px;
	border-radius: 10px;
}
.pop-style1 {
	padding-top: 30px;
	padding-bottom: 20px;

	margin-bottom: 0px;
	border-radius: 25px;
}

.payment-btns a {
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	padding: 5px 20px;
	margin: 0px 10px;
	background: linear-gradient(rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%) no-repeat;
	background: linear-gradient(180deg, rgb(25, 200, 255) 1%, rgba(52,126,194,1) 100%) no-repeat;
	border-radius: 10px;
	border: none;
}

.payment-btns iconify-icon {
	position: relative;
	top: 5px;
}

.payment-btns a:hover {
	color: #fff;
	background: linear-gradient( 180deg,rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%) no-repeat;
}

.tether-pay {
	display: flex;
	align-items: center;
}

.usd-payment h4 {
	font-size: 17px;
}

.teher-text h4 {
	font-size: 18px;
}
.teher-text span {
	color: #dda1f9 !important;
}

.usd-payment span {
	color: #dda1f9 !important;
}
#copy-icon-link i {
 background: linear-gradient(180deg, var(--lite-cyan) 1%, var(--dark-cyan)100%) no-repeat;
	border-radius: 50%;
	padding:8px 8px;
}
/********************************wallet end*********************************/

/********************************team start*********************************/

.traingle-img {
	margin-top: 50px;
	margin-bottom: 40px;
}

.traingle-img img {
	mask-image: linear-gradient(#000, #000);
	mask-size: 0% 70%;
	mask-position: 0 45%, 25% 25%, 50% 50%, 75% 0, 100% 50%;
	mask-repeat: no-repeat;
	animation: mask 5s linear infinite;
}

.triangle-name li {
	position: absolute;
}

.triangle-name li:first-child {
	top: -16px;
	left: 0px;
	right: 0px;
	margin: auto;
}

.triangle-name li:last-child {
	right: 0px;
	bottom: -33px;
}

.triangle-name li:nth-child(2) {
	bottom: -33px;
	left: 0px;
}

.gen-title h4 {
	font-size: 18px;
}

.gen-data {
	background:var(--grad-bg-primar);
	border-radius: 15px;
	margin-top: 10px;
}

.gen-title {
	padding: 15px 15px;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
}

.gen-title-bg1 {
	background:var(--lite-cyan);
}

.gen-title-bg2 {
	background: var(--dark-cyan);
}

.gen-title-bg3 {
	background:var(--color-black);

}

.data-value {
	padding: 20px 0px;
}

.data-value h4 {
	color:var(--lite-cyan) !important;
}



.arrow {
	position: relative;
	top: 4px;
}

.pick h4 {
	font-size: 15px;
}

.pick {
	background: #8051df;
	padding: 13px 10px;
	border-radius: 8px;
}

.pie-chart {
	background: radial-gradient(circle closest-side, transparent 66%, #462695 0), conic-gradient(#4e79a7 0, #4e79a7 34.5%, #f28e2c 0, #f28e2c 62.1%, #e15759 0, #e15759 82.8%, #76b7b2 0, #76b7b2 100%);
	position: relative;
	width: 100%;
	min-height: 350px;
	margin: 0;
	outline: 2px solid #c3059c;
	border-radius: 10px;
}

.pie-chart h2 {
	position: absolute;
	margin: 1rem;
}

.pie-chart cite {
	position: absolute;
	bottom: 0;
	font-size: 80%;
	padding: 1rem;
	color: gray;
}

.pie-chart figcaption {
	position: absolute;
	top: 1em;
	right: 15px;
	font-size: smaller;
	text-align: right;
	color: #fff;
	/* padding: 10px 143px; */
}

.pie-chart span:after {
	display: inline-block;
	content: "";
	width: 0.8em;
	height: 0.8em;
	margin-left: 0.4em;
	height: 0.8em;
	border-radius: 0.2em;
	background: currentColor;
}

.earning-chat {
	margin: 30px 10px;
}

.static-box {
	border-radius: 20px;
	padding: 20px 10px;
}

.sta-bg1 {
	background: #2a1842;
}

.sta-bg2 {
	background: #4f3968;
}

.acc-tit a {
	font-size: 13px;
}

.sta-bg3 {
	background: #745b83;
}


.static-amt span {
	font-size: 13px;
}

.modal-content {
	scrollbar-width: thin;
	scrollbar-color: darkgray lightgray;
}

.modal-content::-webkit-scrollbar {
	width: 8px;
}

.modal-content::-webkit-scrollbar-thumb {
	background-color: darkgray;
	border-radius: 4px;
}

.modal-content::-webkit-scrollbar-track {
	background-color: lightgray;
}

/********************************team end*********************************/

/********************************currency select start*********************************/

.dep-pad-name-list h4 {
	font-size: 18px;
}

.dep-pad-name-list {
	margin-top: 48px;
}

.dep-pad-name-list li:hover {
	padding: 4px 0px;
	/* border-top: 1px solid rgba(255, 255, 255, 0.1); */
	/* border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
	background: rgba(255, 255, 255, 0.1);
}

.dep-pad-name-list li {
	padding: 4px 0px;
	background: var(--lite-glass);
}

.dep-pad-name-list li a {
border-radius: 10px;
}

/*.dep-pad-name-list::after {
	position: absolute;
	content: "";
	background: rgba(255,255,255,0.1);
	width: 100%;
	height: 1px;
	left: 0px;
	right: 0px;
	margin: auto;
	top: -25px;
}

.dep-pad-name-list::before {
	position: absolute;
	content: "";
	background: rgba(255,255,255,0.1);
	width: 100%;
	height: 1px;
	left: 0px;
	right: 0px;
	margin: auto;
	bottom: -25px;
}*/

.dep-pad-name-list span {
	font-size: 14px;
	font-family: Vani !important;

}

/********************************currency select end*********************************/

/********************************team list start*********************************/

.team-list-pay h4 {
	font-size: 15px;
}

.team-pay h5 {
	font-size: 13px;
}

.team-pay-list li {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.team-pay-list li {
	margin-top: 8px;
}

.ref-copy iconify-icon {
	border: 2px dotted #fff;
	border-radius: 50%;
	padding: 8px 9px;
}

.team-list-no span {
	font-size: 14px !important;
	font-weight: bold;
	color: var(--lite-cyan) !important;
}

/********************************team list end*********************************/


/******************************** Asset list start**********************************/
#pills-tab {
	background: #090921;
	border-radius: 15px;
	padding: 6px 0px;
}
#pills-tab button {
	border-radius: 10px;
	padding: 5px 11px;
	color: #fefefe;
}
#pills-tab button {
	color: #fff;
}

.process span {
	font-size: 12px;
	font-weight: bold;
}

.tap-coin-mine {
	margin-top: 20px;
	margin-bottom: 10px;
	background: var(--lite-glass);
	padding: 18px 10px;
	border-radius: 10px;
}
.mine-box-tap {
	padding: 8px 5px;
	border-radius: 15px;
	margin-bottom: 9px;
	background: #19031f;
}

.asset-lists li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: rgb(255, 255, 255, 0.1);
	padding: 10px 10px;
	border-radius: 15px;
	background: linear-gradient(145deg, rgba(17, 64, 140, 0.95), rgba(5, 10, 25, 0.9));
}

#pills-tab li {
	padding: 0px 15px;
}

.asset-content h4 {
	font-size: 16px;
}

.asset-value-left h4 {
	font-size: 16px;
	color: var(--lite-cyan) !important;
}
.asset-content span {
	font-size: 14px;
}

.asset-value-left span {
	font-size: 14px;
	color: #fff;
}

.asset-value-left {
	text-align: end;
}

.data-list iconify-icon {
	color: #fff;
}



/******************************** Asset list End**********************************/




/******************************** suggest oredr start **********************************/
.element-heading h6 {
	font-size: 16px;
	color: #dda1f9;
}

.order-buy {
	display: inline-block;
	padding: 8px 15px;
	border-radius: 30px;
}

.bg-1 {
	background: var(--lite-cyan);
}


.bg-2 {
	background: var(--color-blue);
}



.sug-pay {
	display: flex;
	align-items: center;
}


.kraken-ico {
	border: 2px solid var(--lite-cyan);
	border-radius: 50%;
	padding: 7px 7px;
}


.bin-pay {
	justify-content: end;
}


.binance-ico {
	border: 2px solid var(--color-blue);
	border-radius: 50%;
	padding: 7px 7px;
}


.sug-border {
	margin-top: 186px;
	border-radius: 25px;
}

.steps-wrapper .steps .step.active {
	color: #fff;
	border-color: #fff;
	transition-delay: 100ms;
}


.prograss-line .progress-bar {
	width: min(100svw - 20px, 250px);
	border-radius: 100vh;
	background: #e8e8e8;
	overflow: hidden;
	cursor: pointer;
	height: 6px;
	width: 100%;
	position: relative;


	.progress {
		width: 100%;
		height: 100%;
		transform: scaleX(0);
		border-radius: inherit;
		transform-origin: left center;
		background: linear-gradient(90deg, #8256dd, #fc7dc6);
		transition: transform 300ms cubic-bezier(0.5, 0, 0.25, 1);
	}


	&:hover .progress {
		transform: scaleX(0.5);
	}

}


.order-list h4 {
	font-size: 15px;
}

.ordr-select-ico {
	background: #7149c8;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	text-align: center;
	padding: 8px 0px;
}

.order-next {
	display: flex;
	align-items: center;
}

.wallet-pay {
	display: flex;
	align-items: center;
	justify-content: end;
}

.wallet-pad {
	margin-bottom: 70px;
}

.steps-wrapper {
	max-width: 400px;
	width: 100%;
	background: transparent;
}

.steps {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative;
}

.step {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 4px solid #7f50de;
	border-top-color: rgb(127, 80, 222);
	border-right-color: rgb(127, 80, 222);
	border-bottom-color: rgb(127, 80, 222);
	border-left-color: rgb(127, 80, 222);
	border-radius: 50%;
	color: #fff;
	background: #fc7dc6;
	font-size: 24px;
	font-weight: 600;
	transition: 200ms ease;
	transition-delay: 0s;
	transition-delay: 0ms;
	position: relative;
	z-index: 2;
}

/*
.progress-bar {
	position: absolute;
	width: 100%;
	height: 4px;
	background: #fc7dc6;
	z-index: 1;
}

.progress {
	position: absolute;
  width: 20%;
	height: 100%;
	background: #fff;
	transition: 300ms ease;
}*/

#btn-next {
	color: #fff;
}

.buttons {
	margin-block-start: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
}

.btns {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 6px 15px;
	font-family: inherit;
	font-size: 1rem;
	font-weight: 600;
	border-radius: 6px;
	border: none;
	background: #8256dd !important;
	color: #fff;
	cursor: pointer;
	transition: 200ms linear;

	&:active {
		scale: 0.9;
	}

	&:hover:not(&:disabled) {
		background: #000;
	}

	&:disabled {
		cursor: not-allowed;
		background: #fff;
		pointer-events: none;
	}
}

/******************************** suggest oredr start **********************************/

/********************************trade coin animation********************************/


.coin {
	position: absolute;
	top: 26%;
	left: 11%;
	width: 50px;
	height: 50px;
	transition: all 2s ease-in-out;
	opacity: 0;
	/* Initially hidden */
}

.hidden {
	display: none;
	/* Completely hide the coins initially */
}

@keyframes scaleAndMove {
	0% {
		transform: translate(0, 0) scale(0.5);
		opacity: 0;
	}

	100% {
		transform: translate(350px, 0) scale(1);
		opacity: 1;
	}
}

.coin.moving {
	animation: scaleAndMove 2s ease-in-out forwards;
	opacity: 1;
	/* Ensure visible during animation */
}

/* Staggering the delays for sequential animation */
.coin:nth-child(1).moving {
	animation-delay: 0.3s;
}

.coin:nth-child(2).moving {
	animation-delay: 0.6s;
}

.coin:nth-child(3).moving {
	animation-delay: 0.9s;
}

.coin:nth-child(4).moving {
	animation-delay: 1.2s;
}

.coin:nth-child(5).moving {
	animation-delay: 1.5s;
}

.coin:nth-child(6).moving {
	animation-delay: 1.8s;
}

.coin:nth-child(7).moving {
	animation-delay: 2.1s;
}

.coin:nth-child(8).moving {
	animation-delay: 2.4s;
}

.coin:nth-child(9).moving {
	animation-delay: 2.7s;
}

.coin:nth-child(10).moving {
	animation-delay: 2.9s;
}

.coin:nth-child(11).moving {
	animation-delay: 3.2s;
}

.coin:nth-child(12).moving {
	animation-delay: 3.4s;
}



.timer-container {
	margin-top: 20px;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	color: #333;
	display: none;
}

/********************************trade coin animation end********************************/

/********************************profile start**********************************/
.profile-edit {
	background: var(--lite-cyan);
	width: 25px;
	height: 25px;
	border-radius: 50%;
	text-align: center;
	padding: 4px 0px;
	position: absolute;
	bottom: -9px;
	right: 0px;
}
.profile-status {
	display: flex;
	align-items: center;
}

.profile-status .form-control {
	background: transparent;
}

.ref-copys {
	/* position: absolute; */
	right: -57px;
	bottom: 0px;
	margin-left: 11px;
}

.ref-copys iconify-icon {
	border: 2px dotted #fff;
	border-radius: 50%;
	padding: 8px 9px;
}

/* .profile-asset span {
	display: flex;
} */

.channel-name {
	display: flex;
	align-items: center;
}

.title-heading h4 {
	font-size: 18px;
}

.profile-staus {
	background: rgba(255, 255, 255, 0.1);
	border-radius: 15px;
	padding: 10px 15px;
	background: linear-gradient(19deg, var(--color-blue) 0%, var(--dark-cyan) 100%) repeat;
}
.profile-status-ico iconify-icon {
	background: var(--lite-cyan);
	border-radius: 50%;
	padding: 10px 10px;
}
.menu_admin li {
	padding: 10px 10px;
	font-size: 14px;
	margin: 3px 0px;
}
.menu_admin li:hover {
	background: linear-gradient(180deg, rgb(25, 200, 255) 1%, rgba(52,126,194,1) 100%) no-repeat;
	border-radius: 10px;
}
.menu_admin li:not(:last-child) {
	border-bottom: 1px solid #3b5680;
}

.menu_admin {
background: linear-gradient(145deg, rgba(17, 64, 140, 0.95), rgba(5, 10, 25, 0.9));
	border-radius: 10px;
}

.menu-content i {
	color: #fff !important;
	font-size: 20px;
}

.menu_admin li a {
	color: #fff;
}

.profile-security {
	border-radius: 15px;
	padding: 15px 15px;
	background: linear-gradient(180deg, var(--lite-cyan) 1%, var(--dark-cyan)100%) no-repeat;
}
.prfile-arrow {
	position: absolute;
	right: 16px;
	top: 14px;
}

/********************************profile end **********************************/

/******************************** innerpage start **********************************/


.innerpage-form-bg {
	background: #fff;
	padding: 15px 15px;
	border-radius: 15px;
	background: linear-gradient(145deg, rgba(17, 64, 140, 0.95), rgba(5, 10, 25, 0.9));
	overflow: hidden;
	box-shadow: 0 0 15px rgba(0, 100, 255, 0.3), inset 0 0 20px rgba(0, 100, 255, 0.2);
	position: relative;
}
.form-ico {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	padding: 10px 0px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	text-align: center;
	right: 9px;
	font-size: 20px;
}

.form-label {
	margin-bottom: 5px;
	font-size: 14px;
	color: #fff !important;
}
.innerpage-form-bg .form-control {
	margin-top: 0px;
	margin-bottom: 15px;
	padding: 11px 8px;
}
.form-block label {
	font-size: 14px;
	color: #fff;
}

.form-block {
	position: relative;
}
.checkbox label {
	font-size: 14px;
}

.checkbox a:hover {
	color: var(--lite-cyan) !important;
}
.footer-inner {
	top: 0;
	position: sticky;
	bottom: 0;
	z-index: 2;
	padding: 10px 0;
	margin-top: 0px !important;
	background: var(--lite-glass);
}
.inner-pages {
	height: auto;
}

.copy-rights a:hover {
	color: #e76bb6 !important;
}
.box-border {
	border: 2px solid #fff;
}


/******************************** innerpage end **********************************/




/* :: Modal */
.modal-content {
	border: 0;
	border-radius: 0.75rem;
}

.modal.fade.bottom-align-modal {
	overflow: hidden;
}

.modal-dialog-end {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
	min-height: calc(100% - 1rem);
}

.modal.fade .modal-dialog.modal-dialog-end {
	-webkit-transform: translate(0, 50px);
	transform: translate(0, 50px);
}

.modal.show .modal-dialog.modal-dialog-end {
	-webkit-transform: none;
	transform: none;
}

/* :: Notification */
.notification-area {
	position: relative;
	z-index: 1;
}

.notification-area .alert {
	margin-bottom: 0.5rem;
}

.notification-area a:last-child .alert {
	margin-bottom: 0;
}

.notification-area .unread {
	background-color: #ffffff !important;
}




/***********************************profile edit*******************************/
.profile-details h5 {
	font-size: 14px;
}

.btn-info .btn-primary {
	width: 100%;
	font-size: 16px;
	font-weight: 600;
}

.btn-info {
	margin-top: 230px;
}


.edit-icon iconify-icon {
	background: linear-gradient(0deg, rgb(221, 161, 249) 0%, rgb(240, 244, 252) 100%);
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 50%;
	padding: 7px 7px;
}

.edit-icon {
	position: absolute;
	right: 0px;
	left: 66px;
	margin: auto;
	bottom: -12px;
}

.profile-name span {
	font-size: 15px !important;
}

.profile-details span {
	color: var(--lite-cyan) !important;
}

.text-secondary {
	--bs-text-opacity: 1;
	color: var(--lite-cyan);
}


/***********************************profile edit end*******************************/




/********************************** partner start **********************************/
.star-points {
	background: rgb(157, 36, 8);
	background: linear-gradient(135deg, rgba(7, 60, 169, 1) 0%, rgba(5, 179, 169, 1) 100%);
	border-radius: 30px;
	padding: 5px 15px;
	margin-top: 4px;
	float: right;
}

.partner-sec-list {
	margin-top: 10px;
}

.tab-2 {
	padding: 0 25px;
}

.partner-main {
	margin-bottom: 0px;
	margin-top: 20px;
}

.partner-list .process span {
	padding: 0px 14px;
}

.star-points:hover {
	background: rgb(157, 36, 8);
	background: linear-gradient(-135deg, rgba(7, 60, 169, 1) 0%, rgba(5, 179, 169, 1) 100%);
}

.partner-sec-list h5 span {
	font-size: 12px;
	font-weight: 400;
}

.partner-tab-sec {
	background: #adc4fe;
	border: 1px solid #00ffe2;
	border-radius: 20px;
	padding: 20px 10px;
	margin: 15px 5px;
}

.star-points h5 {
	font-size: 15px;
}

.star-value h5 {
	font-size: 16px;
}

.feedback-select {
	background: #dda1f9;
	padding: 17px 17px 11px 17px;
	border-radius: 5px;
	margin-bottom: 12px;
	background: radial-gradient(circle at 30% 30%, rgba(20, 30, 50, 1) 0%, rgba(5, 10, 25, 1) 100%);
	box-shadow: inset 0 0 15px var(--glow-secondary), inset 0 0 25px var(--glow-primary), 0 0 15px rgba(0, 100, 255, 0.2);
}
.feedback-option .form-check .form-check-input {

	margin-left: 0px;
}

.feedback-head h4 {
	font-size: 18px;
}

/********************************** partner end **********************************/



.dash-banner {
	padding: 20px 0px 0 0;
	border-radius: 20px;
	margin: 30px 0px 0 0;
	position: relative;
	z-index: 1;
	background: radial-gradient(circle at 30% 30%, rgba(20, 30, 50, 1) 0%, rgba(5, 10, 25, 1) 100%);
	box-shadow: inset 0 0 15px var(--glow-secondary), inset 0 0 25px var(--glow-primary), 0 0 15px rgba(0, 100, 255, 0.2);
}
.mission-content {
	padding: 8px 32px 0px 22px;
}

.mis-pad {
	padding: 0px 20px;
}

.pad {
	padding: 0px 20px;
}

.mission-content-box {
	margin-top: 37px;
	background: rgba(255, 255, 255, 0.1);
	border-radius: 21px;
}
.ref-form {
	justify-content: space-between;
	padding: 12px 15px;
	border-radius: 0px;
}


.ref-form:first-child {

	border-bottom: 1px solid var(--lite-white);
}

.ref-form-list {
	border-radius: 20px;
	margin: 30px 0;
	background: linear-gradient(145deg, var(--color-blue), var(--color-black));
}
.ref-content #myInput {
	background: transparent;
	color: #fff;
}

#myInput-code {
	background: transparent;
	color: #fff;
}

.ref-copy i {
	color: #fff;
}

.bit-coin {
	position: absolute;
	right: 15px;
	bottom: 0px;
	display: none;

}



/******************************** bind email start **********************************/

.btn-send {
	position: absolute;
	right: 0px;
	background: linear-gradient(90deg, var(--lite-cyan) 0%, var(--dark-cyan) 100%);
	width: 70px;
	margin: 0 auto;
	top: 0px;
	bottom: 0px;
	padding: 11px 0px;
	text-align: center;
	border-top-right-radius: 10px;
}
.password-reminder h6 {
	color: #dda1f9 !important;
}

.password-reminder iconify-icon {
	font-size: 20px;
	color: #dda1f9 !important;
}

.password-reminder {
	display: flex;
	align-items: center;
}

.reminder-p p {
	font-size: 13px;
}

.bgn-bg {
	background: transparent;
	border: transparent;
}

.bgn-bg:hover {
	background: linear-gradient(180deg, rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%);
}

.bgn-bg {
	display: flex;
	align-items: self-end;
}

/******************************** bind email end **********************************/

/********************************busines operaton**********************************/


.business-p p {
	font-size: 13px;
}

/********************************busines operaton**********************************/

/********************************task center start*********************************/

.task-banner p {
	font-size: 18px;
}

.task-banner h4 {
	font-weight: 900;
}

.task-banner {
	background: url("../images/trade-bg.png") no-repeat, #070820;
	width: 100%;
	height: 123px;
	text-align: center;
	padding: 32px 0px;
	border-radius: 15px;
}

.task-tab li {
	padding: 6px 4px !important;
}

.task-tab button {
	font-size: 13px;
}

.terms-p p {
	font-size: 13px;
}

/********************************task center end*********************************/


.input-msg {
	background: #090921;
}

.circle-wrapper {
	position: relative;
	width: 100px;
	height: 100px;
}

.icon {
	position: absolute;
	color: #fff;
	font-size: 55px;
	top: 52px;
	left: 49px;
	transform: translate(-50%, -50%);
}

.circle {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	padding: 2.5px;
	background-clip: content-box;
	animation: spin 10s linear infinite;
}

.circle-wrapper:active .circle {
	animation: spin 2s linear infinite;
}

.success {
	background-color: #4bb543;
	border: 2.5px dashed #4bb543;
}

.error {
	background-color: #ca0b00;
	border: 2.5px dashed #ca0b00;
}

.warning {
	background-color: #f0d500;
	border: 2.5px dashed #f0d500;
}

@keyframes spin {
	100% {
		transform: rotateZ(360deg);
	}
}

.page-wrapper {
	height: 45vh;
	background-color: #090921;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 15px;
}


#fireworks-canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 15px;
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0) 0%,
			rgba(0, 0, 0, 0.4) 100%);
}

/* .title {
  position: absolute;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(2rem, 5vw, 4rem);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  font-weight: 200;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.8),
    0 0 20px rgba(255, 255, 255, 0.6), 0 0 30px rgba(255, 255, 255, 0.4),
    0 0 40px rgba(255, 182, 255, 0.3);
  opacity: 0.92;
  z-index: 1000;
  animation: glow 2s ease-in-out infinite alternate;
  padding-left: 0.5em;
} */

/* .title span {
  display: block;
  font-family: "Quicksand", sans-serif;
  font-size: 0.4em;
  letter-spacing: 0.2em;
  text-transform: lowercase;
  margin-top: 1em;
  font-weight: 300;
  opacity: 0.8;
} */

@keyframes glow {
	from {
		text-shadow: 0 0 10px rgba(255, 255, 255, 0.8),
			0 0 20px rgba(255, 255, 255, 0.6), 0 0 30px rgba(255, 255, 255, 0.4),
			0 0 40px rgba(255, 182, 255, 0.3);
	}

	to {
		text-shadow: 0 0 20px rgba(255, 255, 255, 0.9),
			0 0 30px rgba(255, 255, 255, 0.7), 0 0 40px rgba(255, 255, 255, 0.5),
			0 0 50px rgba(255, 182, 255, 0.4), 0 0 60px rgba(255, 182, 255, 0.3);
	}
}

/* @media (max-width: 768px) {
  .title {
    letter-spacing: 0.3em;
    padding-left: 0.3em;
  }

  .title span {
    font-size: 0.5em;
    letter-spacing: 0.15em;
  }
} */




.glowing {
	position: relative;
	min-width: 700px;
	height: 550px;
	margin: -150px;
	transform-origin: right;
	animation: colorChange 5s linear infinite;
}

.glowing:nth-child(even) {
	transform-origin: left;
}

@keyframes colorChange {
	0% {
		filter: hue-rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		filter: hue-rotate(360deg);
		transform: rotate(360deg);
	}
}

.glowing span {
	position: absolute;
	top: calc(80px * var(--i));
	left: calc(80px * var(--i));
	bottom: calc(80px * var(--i));
	right: calc(80px * var(--i));
}

.glowing span::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -8px;
	width: 15px;
	height: 15px;
	background: #f00;
	border-radius: 50%;
}

.glowing span:nth-child(3n + 1)::before {
	background: rgba(134, 255, 0, 1);
	box-shadow: 0 0 20px rgba(134, 255, 0, 1), 0 0 40px rgba(134, 255, 0, 1),
		0 0 60px rgba(134, 255, 0, 1), 0 0 80px rgba(134, 255, 0, 1),
		0 0 0 8px rgba(134, 255, 0, 0.1);
}

.glowing span:nth-child(3n + 2)::before {
	background: rgba(255, 214, 0, 1);
	box-shadow: 0 0 20px rgba(255, 214, 0, 1), 0 0 40px rgba(255, 214, 0, 1),
		0 0 60px rgba(255, 214, 0, 1), 0 0 80px rgba(255, 214, 0, 1),
		0 0 0 8px rgba(255, 214, 0, 0.1);
}

.glowing span:nth-child(3n + 3)::before {
	background: rgba(0, 226, 255, 1);
	box-shadow: 0 0 20px rgba(0, 226, 255, 1), 0 0 40px rgba(0, 226, 255, 1),
		0 0 60px rgba(0, 226, 255, 1), 0 0 80px rgba(0, 226, 255, 1),
		0 0 0 8px rgba(0, 226, 255, 0.1);
}

.glowing span:nth-child(3n + 1) {
	animation: animate 10s alternate infinite;
}

.glowing span:nth-child(3n + 2) {
	animation: animate-reverse 3s alternate infinite;
}

.glowing span:nth-child(3n + 3) {
	animation: animate 8s alternate infinite;
}

@keyframes animate {
	0% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(0deg);
	}

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

@keyframes animate-reverse {
	0% {
		transform: rotate(360deg);
	}

	50% {
		transform: rotate(180deg);
	}

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



/******************************** Spin Wheel start **********************************/
.spin-module {
	background: linear-gradient(180deg, var(--lite-cyan) 1%, var(--dark-cyan)100%) no-repeat;
}
.amt-obtain {
	background: var(--grad-bg-primary);
	/* width: 180px; */
	padding: 10px 0px;
	margin: 0px 30px 20px 30px;
	border-radius: 20px;
	display: flex;
	justify-content: space-around;
}
/* .split-spin-val span {
	color: #dda1f9 !important;
} */
 .modal-footer .btn-secondary {
	background: #fff;
	color: #000;
	border: none;
}

.spin-withdraw .btn-primary {
	padding: 7px 13px;
	border: none;
	font-size: 14px;
	margin-left: 12px;
}

.spin-withdraw-main {
	margin: 25px 0px;
}

.pop-up-side {
	background: linear-gradient(135deg, rgb(95, 68, 227) 0%, rgb(175, 0, 255) 4%, rgb(109, 23, 111) 37%, rgb(70, 3, 151) 100%);
	width: 193px;
	padding: 10px;
	border-radius: 60px;
	position: absolute;
	top: 115px;
	z-index: 1;
	left: 39px;
	display: none;
}

.spin-main {
	position: relative;
}

.bottom-view {
	background: linear-gradient(19deg, var(--color-blue) 0%, var(--dark-cyan) 100%) repeat;
	padding: 10px 10px;
	border-radius: 32px;
}
/**********************************Spinner-popup **********************************/

/* Pop-up Styling */
.popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	/* Semi-transparent background */
	display: none;
	/* Hidden by default */
	justify-content: center;
	align-items: center;
	z-index: 9999;
	/* Ensure it's on top */
}

/* Pop-up Content */
#popup-text {
	font-size: 18px;
	font-weight: 900;
	/* text-shadow: 2px 5px 5px rgb(255, 0, 0); */
}

.popup-content {
	background: linear-gradient(135deg, rgb(95, 68, 227) 0%, rgb(175, 0, 255) 4%, rgb(109, 23, 111) 37%, rgb(70, 3, 151) 100%);
	padding: 20px;
	border-radius: 10px;
	text-align: center;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
	animation: popup-anim 0.5s ease-out;
	position: relative;
	overflow: hidden;
	box-shadow: 0px 0px 10px 2px #fff;
	color: #fff;
}

/* Pop-up "Pop-shot" animation */
@keyframes popup-anim {
	0% {
		transform: scale(0);
		opacity: 0;
	}

	50% {
		transform: scale(1.1) rotate(10deg);
		opacity: 1;
	}

	100% {
		transform: scale(1) rotate(0deg);
		opacity: 1;
	}
}

/* Confetti or Paper Popping Effect */
@keyframes confetti-effect {
	0% {
		transform: translateY(0) rotate(0deg);
		opacity: 0;
	}

	50% {
		transform: translateY(-150px) rotate(45deg);
		opacity: 1;
	}

	100% {
		transform: translateY(0) rotate(360deg);
		opacity: 0;
	}
}

/* Party Confetti Styling */
.confetti {
	position: absolute;
	top: 40%;
	left: 50%;
	width: 30px;
	height: 30px;
	background: url("../images/coin-small.png");
	opacity: 0;
	animation: confetti-effect 15s ease-in-out infinite;
}

/* Balloons or Floating Papers (optional) */
.paper {
	position: absolute;
	width: 30px;
	height: 30px;
	background: url("../images/coin-small.png");
	animation: confetti-effect 2s ease-in-out infinite;
	opacity: 0;
	margin: 0 auto;
	right: 0;
	left: 0;
	top: 49%;
}

.popup-close {
	background: #c908ff;
	color: #fff;
	border: none;
	padding: 7px 20px;
	cursor: pointer;
	border-radius: 31px;
	/* box-shadow: 0px 0px 6px 2px #f00; */
	font-weight: 900;
}

.popup-close:hover {
	background-color: #9604be;
}

/* Shake Animation for "Sorry" */
@keyframes shake-anim {
	0% {
		transform: translateX(0);
	}

	25% {
		transform: translateX(-10px);
	}

	50% {
		transform: translateX(10px);
	}

	75% {
		transform: translateX(-10px);
	}

	100% {
		transform: translateX(0);
	}
}

/* When the pop-up is shown */
.popup-visible {
	animation: popup-anim 0.5s ease-out;
}

/* For "Sorry" message animation */
.popup.sorry-message .popup-content {
	animation: shake-anim 0.5s ease-in-out;
}



/**********************************Spinner **********************************/
.spin-btn {
	position: relative;
	z-index: 1;
	top: 20px;
}

.wheel_box {
	position: relative;
}

#spinWheel {
	max-height: inherit;
	width: inherit;
	transform: rotate(270deg);
}


.fa-solid {
	position: absolute;
	top: -8%;
	left: 43.7%;
	font-size: 4rem;
	color: var(--green_color);
	transform: rotate(-225deg);
}





.spinner-fortune-bg {
	background: url("../images/wave-bg.png") #ff6104 no-repeat scroll 0 0;
	background-size: contain;
	height: 100vh;
	width: 100%;
	margin: 0 auto;
}

.choose-member {
	background: url("../images/wave-bg.png") #ff6104 no-repeat scroll 0 0;
	background-size: contain;
	z-index: 0;
	height: 100vh;
	width: 100%;
	margin: 0 auto;
}

.collect-credits {
	background: url("../images/wave-bg.png") #ff6104 no-repeat scroll 0 0;
	background-size: contain;
	z-index: 0;
	height: 100vh;
	width: 100%;
	margin: 0 auto;
}

.start-screen {
	background: url("../images/wave-bg.png") #ff6104 no-repeat scroll 0 0;
	background-size: contain;
	z-index: 0;
	height: 100vh;
	width: 100%;
	margin: 0 auto;
}

.connect-wallet {
	background: url("../images/wave-bg.png") #ff6104 no-repeat scroll 0 0;
	background-size: contain;
	z-index: 0;
	height: 100vh;
	width: 100%;
	margin: 0 auto;
}

.spinner-amount {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding-bottom: 15px;
	position: relative;
	z-index: 1;
}

.spin-amt h2 {
	font-size: 43px;
	font-weight: 900;
	text-shadow: 2px 6px 4px rgb(255, 0, 0);
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
}

.spin-box {
	background: #ffec0d;
	border-radius: 13px;
	padding: 10px 10px;
	box-shadow: 0px 0px 6px 2px #FF0000;
	width: 113px;
	height: 69px;
	align-content: center;
	align-items: center;
	text-align: center;
	margin: 0 auto;
}

.spin-box:hover {
	background: #fff;
}

.rank-ico {
	margin-left: 7px;
}

.title-box {
	text-align: center;
}

.title-box span {
	font-size: 24px;
	font-weight: bolder;
}

.spin-center-tit {
	margin: 10px 0px 0px 0px;
}

.spin-title h5 {
	font-size: 18px;
	line-height: 26px;
	letter-spacing: 1px;
	text-shadow: 2px 4px 2px rgb(255, 0, 0);
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
}

.spin-btn .btn-primary {
	padding: 11px 0;
	border-radius: 7px;
	font-size: 15px;
	font-weight: 800;
	text-transform: uppercase;
	border: 2px solid #fff108;
	width: 165px;
}

.spin-btn .btn-secondary {
	padding: 11px 0;
	border-radius: 7px;
	font-size: 15px;
	font-weight: 800;
	text-transform: uppercase;
	border: 2px solid #fff108;
	width: 165px;
}

.spin-title {
	margin: 10px 0px 28px 0px;
}

.spinner-boy {
	position: absolute;
	top: 0px;
	right: 0;
	left: -16px;
	margin: 0 auto;
	animation: none;
}

.tap-boy {
	position: absolute;
	top: -3px;
	right: 0;
	left: 0px;
	margin: 0 auto;
	animation: none;
}

.spin-images {
	margin-top: 0px;
}

.connect-game::after {
	position: absolute;
	content: "";
	background: #ffef08;
	width: 265px;
	height: 265px;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
	margin: 0 auto;
	border-radius: 50%;
	filter: blur(47px);
	z-index: 0;
}

.animate-img {
	animation-name: rotate;
	animation-duration: 3.2s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	margin-top: -1px;
}

.animate-img2 {
	animation-name: flash;
	animation-duration: 3.5s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;

}

.spin-images img {
	z-index: 1;
	position: relative;
}

.head-btn {
	position: relative;
	z-index: 1;
	top: 30px;
}

.user-name {
	margin-top: 10px;
}

.main {
	padding: 10px 10px;
	position: relative;
	z-index: 1;
}


.footer::after {
	position: absolute;
	content: "";
	background: #fff;
	width: 125px;
	height: 93px;
	top: 0px;
	border-radius: 50%;
	right: 0;
	left: 0;
	bottom: 0;
	margin: 0 auto;
	z-index: -1;
	filter: blur(18px);
}

.spinner-boxs {
	margin-top: 0px;
}

/**********************************Spinner-end **********************************/


#spinContainer {
	margin: 0 auto;
	width: 336px;
	height: 338px;
	overflow: hidden;
	position: relative;
}

/********************************Spinner-fortune-Start *****************************/

.wheel_box {
	position: relative;
}

.wheel-width {
	width: 85%;
	margin: 0 auto;
}

#spinWheel {
	max-height: inherit;
	width: inherit;
	transform: rotate(270deg);
}

.spin-border {
	position: absolute;
	top: -20px;
	bottom: 0px;
	right: 0;
	left: 0;
	margin: 0 auto;
	z-index: 0;
}

.spin-border img {
	width: 80%;
}

#spin_btn {
	position: absolute;
	cursor: pointer;
	background: #fff;
	text-transform: uppercase;
	font-size: 18px;
	letter-spacing: 0.1px;
	border-radius: 10px;
	border: 1px solid var(--lite-cyan);
	font-weight: 700;
	z-index: 1;
	top: 170px;
	right: 0;
	left: 0;
	bottom: 0;
	margin: 0 auto;
	width: 65px;
	height: 65px;
	border-radius: 50%;
}

.fa-solid {
	position: absolute;
	top: -8%;
	left: 45.7%;
	font-size: 4rem;
	color: var(--green_color);
	transform: rotate(-360deg);
	z-index: 1;
}

#text {
	color: #fff;
	font-weight: 500;
	position: relative;
	margin: 0px auto 18px auto;
	right: 0;
	left: 0;
	background: #75116e;
	width: 300px;
	border: 1px solid #dda1f9;
	border-radius: 10px;
	box-shadow: 0px 0px 6px 2px #dda1f9;
	/* bottom: 13px; */
	margin: 0px auto 76px auto;
}


.spinner-title {
	margin-top: 0px;
	margin-bottom: 47px;
}

.spinner-title span {
	font-size: 47px;
}

#text p {
	margin: 10px 0;
	font-weight: 500;
	font-size: 16px;
}

/********************************Spinner-fortune-end *****************************/

/********************************Spinner-time-start *****************************/

.spinner-time {
	margin-top: 0px;
	margin-bottom: 0px;
}

.spinner-time h3 {
	font-size: 38px;
	font-weight: 700;
}

.new-spin #spin_btn {
	padding: 10px 37px;
}

.spinner-time span {
	font-size: 27px;
	font-weight: 700;
}




.clock_counter_main {
	width: 100%;
	display: inline-block;
	margin-bottom: 30px;
}

.clock_counter_main ul {
	list-style: none;
}

.clock_counter_main ul li {
	/* background: transparent; */
	display: inline-block;
	text-align: center;
	padding: 0 4px;
	/* border-radius: 20px 20px 0 0; */
	/* margin: 0 0px; */
}

.clock_counter_main ul li span {
	font-size: 29px;
	color: #fff;
	font-weight: 700;
}

.clock_counter_main ul li small {
	font-size: 13px;
	color: #38cfc7;
	display: block;
	font-weight: 600;
}

.days {
	display: none;
}

/********************************Spinner-time-end *****************************/

/******************************** try-luck start *****************************/
.try-luck-ico {
	position: relative;
}


.balance-amount {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	/* padding: 30px 0; */
	position: relative;
	z-index: 1;
	top: 0;
	right: 15px;
}

.balance {
	position: absolute;
	top: -25px;
	left: 24px;
}

.try-content p {
	margin: 10px 87px;
}

.try-btn .btn-primary {
	padding: 10px 39px;
	font-size: 13px;
	font-weight: 700;
}

.try-btn {
	padding: 21px 0;
}

.try-amt h2 {
	font-size: 17px;
	margin: 0;
}

.bal-tit {
	text-align: start;
	margin: 0px 8px;
}

.pop-up-wheel {
	margin: 79px 24px 0px 24px;
	text-align: center;
	background: #000;
	width: 89%;
}

.pop-up-wheel-title {
	margin: 40px 45px;
}

.pop-up-wheel-title h3 {
	font-size: 30px;
	font-weight: 900;
}


.pop-up-wheel {
	margin: 79px 24px 0px 24px;
	text-align: center;
	background: #ff9900;
	width: 89%;
	border-radius: 10px;
	position: relative;
}

.close {
	position: absolute;
	top: 8px;
	right: 13px;
	background: #fff;
	width: 30px;
	height: 30px;
	text-align: center;
	align-content: center;
	border-radius: 50px;
	border: 1px solid #ff0202;
}

.try-luck-pop-up {
	border-radius: 10px;
	border: 2px solid #f00;
	/* margin: -154px 0px 0px 0px; */
	position: relative;
	z-index: 1;
	background: rgba(255, 241, 8, 1);
	background: -moz-linear-gradient(-45deg, rgba(255, 241, 8, 1) 0%, rgba(255, 102, 4, 1) 35%, rgba(255, 97, 4, 1) 69%, rgba(255, 241, 8, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(255, 241, 8, 1)), color-stop(35%, rgba(255, 102, 4, 1)), color-stop(69%, rgba(255, 97, 4, 1)), color-stop(100%, rgba(255, 241, 8, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(255, 241, 8, 1) 0%, rgba(255, 102, 4, 1) 35%, rgba(255, 97, 4, 1) 69%, rgba(255, 241, 8, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(255, 241, 8, 1) 0%, rgba(255, 102, 4, 1) 35%, rgba(255, 97, 4, 1) 69%, rgba(255, 241, 8, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(255, 241, 8, 1) 0%, rgba(255, 102, 4, 1) 35%, rgba(255, 97, 4, 1) 69%, rgba(255, 241, 8, 1) 100%);
	background: linear-gradient(135deg, rgba(255, 241, 8, 1) 0%, rgba(255, 102, 4, 1) 35%, rgba(255, 97, 4, 1) 69%, rgba(255, 241, 8, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff108', endColorstr='#fff108', GradientType=1);
}

.try-content h4 {
	text-shadow: rgb(255, 0, 0) 2px 5px 4px;
	background-clip: text;
}

.try-how-work {
	padding: 15px 10px;
}

.try-how-work h4 {
	text-shadow: rgb(255, 0, 0) 2px 5px 4px;
	background-clip: text;
}

.works-list {
	list-style-type: disclosure-closed;
	font-size: 16px;
}

/******************************** try-luck end *****************************/
.modify-btn {
	text-align: center;
}

.task-btn .btn-primary {
	padding: 10px 15px;
}

.task-btn {
	text-align: center;
}

.team-list-bg {
	margin: 30px 20px;
}

.plan-range h5 {
	font-size: 18px;

}

.withdraw-amt {
	text-align: center;
}
.btn-flexi .btn-primary:hover span {
	color: var(--bs-btn-hover-color);
}

.btn-flexi .btn-primary {
	padding: 10px 14px;
}
.dash-link-icon a h5 {
	font-size: 13px;
}.inner-page-logo img {
	border-radius: 10px;
}

/******************************** NEW CSS 13-11-2025 **********************************/


.footer_bottom_left p {
	color: #fff;
}
.form-ico iconify-icon {
	color: rgb(255, 255, 255) !important;
}	
.checkbox a {
	font-size: 14px;
	color: #fff !important;
}


/* =========================================
   🔹 Inner Page Form Background
=========================================*/
.innerpage-form-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 15px;
  padding: 2px;
  background: var(--grad-gloss);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: add, add;
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.innerpage-form-bg::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle at top right, var(--glow-primary), transparent 70%),
              radial-gradient(circle at bottom left, var(--glow-secondary), transparent 80%);
  transform: rotate(25deg);
  mix-blend-mode: overlay;
  pointer-events: none;
}

/* =========================================
   🔹 Dash Link Box
=========================================*/
.dash-link {
  position: relative;
  background: radial-gradient(circle at 30% 30%, rgba(20, 30, 50, 1) 0%, rgba(5, 10, 25, 1) 100%);
  border-radius: 15px;
  padding: 18px;
  overflow: hidden;
  box-shadow:
    inset 0 0 15px var(--glow-secondary),
    inset 0 0 25px var(--glow-primary),
    0 0 15px rgba(0, 100, 255, 0.2);
  transition: all 0.3s ease;
}

.dash-link::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 12px;
  background: linear-gradient(
    145deg,
    var(--metal-gradient-dark),
    var(--metal-gradient-light),
    rgb(7, 11, 16),
    rgba(50, 100, 255, 0.05)
  );
  box-shadow: inset 0 0 12px var(--metal-glow), inset 0 0 25px var(--metal-glow);
  pointer-events: none;
}

.dash-link::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 35%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255, 255, 255, 0.08) 40%,
    rgba(255, 255, 255, 0.15) 50%,
    transparent 60%
  );
  transform: skewX(-25deg);
  animation: shimmer 3s infinite linear;
  pointer-events: none;
}

/* =========================================
   🔹 Tap-to-Trade Box
=========================================*/
.tap-to-trade-bg {
  position: relative;
  width: 100%;
  height: 123px;
  margin: auto;
  border-radius: 15px;
  padding: 23px 0;
  text-align: center;
  background: var(--grad-bg-primary);
  overflow: hidden;
  box-shadow: 0 0 15px var(--glow-secondary), inset 0 0 20px var(--glow-secondary);
}

.tap-to-trade-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 15px;
  padding: 2px;
  background: var(--grad-gloss);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: add, add;
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.tap-to-trade-bg::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
background: linear-gradient(180deg, rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%);
  background: linear-gradient(180deg, rgb(25, 200, 255) 1%, rgba(52,126,194,1) 100%);
  transform: rotate(25deg);
  mix-blend-mode: overlay;
  pointer-events: none;
}

.main-btn {
	text-align: center;
}

/* new button */

.th-btn.style-gradient2 {
	-webkit-mask-size: 100% 100%;
	border-radius: 0;
	background: var(--white-color);
	/* border: 2px solid rgb(25, 255, 255,0.2); */
	border-radius: 10px;
}
.th-btn {
	position: relative;
	z-index: 2;
	vertical-align: middle;
	display: -webkit-inline-box;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
	border: none;
	text-align: center;
	background-color: var(--theme-color);
	color: #fff;
	font-family: var(--body-font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	padding: 14px 31px;
	border-radius: 50px;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	overflow: hidden;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	text-transform: uppercase;
	text-decoration: none;
	margin: 0 auto;
}
.th-btn.style-gradient2::after {


	color: #fff;
	border: none;
}
.th-btn::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	-webkit-mask-image: url(../images/btn-mask.png);
	mask-image: url(../images/btn-mask.png);
	-webkit-mask-size: 2300%, 100%;
	mask-size: 2300%, 100%;
	-webkit-animation: ani2 0.5s steps(22) forwards;
	animation: ani2 0.5s steps(22) forwards;
	background: linear-gradient(180deg, rgb(25, 200, 255) 1%, rgba(52,126,194,1) 100%) no-repeat;
	clip-path: polygon(0% 0%,64% 0%,64% 10%,70% 10%,75% 1%,100% 0%,100% 80%,95% 100%,42% 100%,42% 90%,34% 90%,34% 100%,5% 100%,0% 80%);
}
@-webkit-keyframes ani {
  from {
    -webkit-mask-position:0 0;
    mask-position:0 0
  }
  to {
    -webkit-mask-position:100% 0;
    mask-position:100% 0
  }
}
@keyframes ani {
  from {
    -webkit-mask-position:0 0;
    mask-position:0 0
  }
  to {
    -webkit-mask-position:100% 0;
    mask-position:100% 0
  }
}
@-webkit-keyframes ani2 {
  from {
    -webkit-mask-position:100% 0;
    mask-position:100% 0
  }
  to {
    -webkit-mask-position:0 0;
    mask-position:0 0
  }
}
@keyframes ani2 {
  from {
    -webkit-mask-position:100% 0;
    mask-position:100% 0
  }
  to {
    -webkit-mask-position:0 0;
    mask-position:0 0
  }
}
@-webkit-keyframes btn-icon-anim {
  0% {
    top:0;
    right:2px
  }
  25% {
    top:-10px;
    right:-10px
  }
  50% {
    top:10px;
    opacity:0;
    right:17px
  }
  100% {
    top:0;
    right:2px;
    opacity:1
  }
}
@keyframes btn-icon-anim {
  0% {
    top:0;
    right:2px
  }
  25% {
    top:-10px;
    right:-10px
  }
  50% {
    top:10px;
    opacity:0;
    right:17px
  }
  100% {
    top:0;
    right:2px;
    opacity:1
  }
}


.th-btn:focus::after, .th-btn:hover::after, .th-btn:active::after {
	-webkit-animation: ani 0.5s steps(22) forwards;
	animation: ani 0.5s steps(22) forwards;
}
.th-btn:focus, .th-btn:hover, .th-btn:active {
	background: linear-gradient(180deg, rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%) repeat;
	color: #fff !important;
	border-top-left-radius: 10px;
	border-bottom-right-radius: 10px;

}
.th-btn:focus, .th-btn:hover, .th-btn:active {
	background: linear-gradient(180deg, rgb(25, 116, 207) 0%, rgb(15, 78, 175) 100%) repeat;

	color: #fff !important;
}
.anim-wrapper {
	text-align: center;
} 

/* dashboard */

a .box-border {
	color: #ffffff;
}
.dash-box-title {
	background: var(--lite-glass);
	border-radius: 0px 0px 9px 9px;
	padding: 11px 10px;
}
/* =========================================
   🔹 Box Border Glow
=========================================*/


.box-border {
	position: relative;
	border: 2px solid transparent;
	border-radius: 12px;
	background: linear-gradient(#0a0f2a, #0a0f2a) padding-box, linear-gradient(120deg, #ffffff, #00b7ff, #006aff, #ffffff) border-box;
	animation: border-glow 4s ease-in-out infinite;
	box-shadow: 0 0 12px rgba(0, 160, 255, 0.15);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}


/* Slight lift and glow on hover */
.box-border:hover {
	transform: translateY(-3px);
	box-shadow: 0 0 18px rgba(0, 200, 255, 0.3);
}

/* Moving shimmer animation across the border */
@keyframes border-glow {
	0% {
		background: linear-gradient(rgba(10, 25, 55, 0.75), rgba(5, 10, 25, 0.95)) padding-box,
		            linear-gradient(120deg, #ffffff, #00b7ff, #006aff, #ffffff) border-box;
	}
	50% {
		background: linear-gradient(rgba(10, 25, 55, 0.75), rgba(5, 10, 25, 0.95)) padding-box,
		            linear-gradient(300deg, #ffffff, #00c6ff, #0072ff, #ffffff) border-box;
	}
	100% {
		background: linear-gradient(rgba(10, 25, 55, 0.75), rgba(5, 10, 25, 0.95)) padding-box,
		            linear-gradient(480deg, #ffffff, #00b7ff, #006aff, #ffffff) border-box;
	}
}
.dash-box-icon {
	margin-top: 11px;
	margin-bottom: 10px;
	text-align: center;
	position: relative;
}
.rich-redirect {
	position: relative;
	transition: transform 0.4s, opacity 0.4s;
	border-radius: 50%;
	width: 43px;
	text-align: center;
	padding: 7px 0;
	height: 41px;
	background:var(--lite-cyan);
	box-shadow: 0 0 15px rgba(21, 138, 224, 0.8), 0 0 30px rgba(21, 138, 224, 0.4);
	margin-left: 20px;
}
.box-border:hover .rich-redirect {
	transform: translateX(20px);
	background: var(--lite-glass);
		box-shadow: none;
}

.box-border:hover .rich-redirect iconify-icon {
	transform:rotate(270deg);
	
}

.rich-redirect iconify-icon {
	font-size: 25px;
	color: #fff;
}

.dash-box-title {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
}
.dash-box-icon::before {
	position: absolute;
	content: "";
	background: var(--lite-cyan);
	width: 50%;
	height: 50%;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	margin: auto;
	border-radius: 50%;
	filter: blur(40px);
	z-index: -1;
	animation-name: flash;
animation-duration: 4.2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
.over-view-box {
	padding: 23px 10px !important;
	margin: 30px 0px;
	border-radius: 10px;
	background: radial-gradient(circle at 30% 30%, rgba(20, 30, 50, 1) 0%, rgba(5, 10, 25, 1) 100%);
	box-shadow: inset 0 0 15px var(--glow-secondary), inset 0 0 25px var(--glow-primary), 0 0 15px rgba(0, 100, 255, 0.2);
}


.help-block {
	color: #ff3b30;
	background: #ffffff;
	padding: 2px 6px;
	border-radius: 5px;
	font-size: 13px;
	margin-top: 6px;
	position: relative;
	display: inline-block;
	width: auto;
	margin-left: 0.5rem;
}
.profile-asset {
	margin-top: 12px;
}
.pln-text h1 {
	font-size: 27px;
}
option {
	background: var(--dark-cyan);
}
/******************************** Responsive **********************************/



@media only screen and (max-width: 575px) {
	/* .w-\[640px\] {
		width: 100%;
		margin: 0 auto;
	} */

	.foot-link-fixed {
		width: 100%;
	}


	

	body {
		background: #000;
		width: 100%;
		margin: 0 auto;
	}

	.split-spin-val h4 {
		font-size: 16px;
	}

	.spin-para h4 {
		font-size: 15px;
	}

	.fa-solid {

		width: 9%;
	}
	#spin_btn {

		top: 133px;

	}
}



@media only screen and (max-width: 424px) {
	.btn-primary {

		border-radius: 8px;
		padding: 10px 10px;
		height: auto;
	}
.profile-staus {
	margin-top: 12px;
}
.profile-security {
	margin-top: 12px;
}

.profile-asset .fs-5 {
	font-size: 12px !important;
}

		
	.wallet-search a {
		font-size: 14px;
	}
	

	.footer-bav-list li a h5 {
		font-size: 13px;
	}

	.vipplan-heading h2 {
		font-size: 14px;
	}

	.wallet-search .form-select {
		margin: 0;
	}

	.acc-tit a {
		font-size: 13px;
	}

	#spin_btn {

		top: 115px;

	}

	.vip-plan-details {
		background: rgba(255, 255, 255, 0.2);
		border-radius: 15px;
		/* height: 366px; */
		padding: 0px 0px 20px 0px;
		margin: 10px 0px;
	}

	.mission-content p {
		text-align: center !important;
	}
	.plan-level-img img {
		width: 100%;
	}



	.vip-amt-details h6 {
		font-size: 10px;
	}

.vip-plan-details {
	background: rgba(255, 255, 255, 0.2);
	border-radius: 15px;
	/* height: 366px; */
	padding: 0px 0px 0px 0px;
	margin: 16px 0px;
	width: 100%;
	height: auto;
	/* margin-top: 16px; */
}
.vip-plan-sec {
	width: 100%;
	border: 1px solid aliceblue;
	border-radius: 13px;
}

	.withdraw-amt span {
		font-size: 18px;
	}

.btn-flexi .btn-primary {
	padding: 6px 10px;
}
	.btn-flexi a {
		font-size: 14px;
	}
.rich-redirect iconify-icon {
	font-size: 20px;

}
.rich-redirect {
	width: 37px;
	height: 38px;
	margin-left: 0px;
}
.invite-content h4 {
	font-size: 16px;
}

.box-border:hover .rich-redirect {
	transform: translateX(2px);

}
.dash-box-title {
	justify-content: space-between;
}
.app-download {
	margin-bottom: 26px;
}
.plan-bg1 {
	width: 100%;
	height: auto;
	padding: 9px 9px;
	justify-content: space-around;
}
.dash-link-icon a h5 {
	font-size: 11px;
}
.dash-link-icon iconify-icon {

	font-size: 25px;
}
.vip-plan-details {

	height: auto;
}
.cash-wheel-bg {
	margin-top: 20px;
}
}



@media only screen and (max-width: 390px) {

	.ico {

		padding: 1px 1px;

	}

	

	.position-relative {
		position: relative !important;
	}


	.tap-to-trade-bg {
		width: 366px;
	}

	.dash-link::after {
		width: 366px;
	}

	.invite-content h4 {
		margin-bottom: 10px !important;
	}


	.dah-tash {
		padding: 16px 10px;
	}


	.invit-ico::after {
		width: 62px;
		height: 80px;
		left: 0px;
	}



	.plan-bg2 {
		width: 100%;

	}

	.ref-copy {
		margin-left: -7px;
	}

	#pills-tab button {
		font-size: 12px;
	}

	#pills-tab button {
		padding: 9px 2px;
	}

	.form-bg {
		padding: 15px 15px !important;
	}

	.profile-staus h4 {
		font-size: 17px;
	}

	.task-banner {
		background: url("../images/trade-bg.png") no-repeat, #060a21;
		width: 366px;
		border-radius: 15px;
	}

	.task-tab li {
		padding: 9px 4px !important;
	}

	.ico-one {

		margin-left: 17px;
	}

	.payment-btns a {

		font-size: 13px;

	}

	.payment-btns a {
		font-size: 12px;
	}

	.vipplan-heading {
		padding: 15px 10px;
		border-top-right-radius: 15px;
		border-top-left-radius: 15px;
	}

	.static-amt h4 {
		font-size: 17px;
	}

	.static-amt span {
		font-size: 12px;
	}

	.data-value {
		padding: 20px 15px;
	}

	.title-heading h3 {
		font-size: 17px;
	}

	#spin_btn {
		top: 96px;
	}

	.split-spin-val h4 {
		font-size: 13px;
	}
}

@media only screen and (max-width: 360px) {

	.load-container {

		left: -45px;

	}

	.fa-solid {

		width: 9%;
	}

	.footer-bav-list li h5 {
		font-size: 12px !important;
	}

	.ico-one {

		margin-left: 12px;
	}

	.footer-bav-list li {
		padding: 10px 5px;
	}

	.static-amt h4 {
		font-size: 14px;
	}

	.tap-to-trade-bg {
		width: 334px;
	}

	.dash-link::after {
		width: 334px;
	}
	
	.wallet-search a {
		font-size: 12px;
	}
	.ref-content #myInput {
	
		font-size: 12px;
	}
	#myInput-code {
	
		font-size: 10px;
	}

	.invit-ico::after {
		width: 53px;
		height: 83px;
		left: 0px;
	}

	.dah-tash {
		padding: 10px 10px;
	}



	.plan-bg1 {
		width: 100%;
	}

	.plan-bg2 {
		width: 100%;
	}

	.data-value span {
		font-size: 12px !important;
	}

	.gen-select span {
		font-size: 12px !important;
	}

	#pills-tab button {
		padding: 9px 4px;
	}

	#pills-tab li {
		padding: 5px 14px;
	}

	.asset-content h4 {
		font-size: 14px;
	}

	.asset-content span {
		font-size: 13px;
	}

	.asset-value-left h4 {
		font-size: 15px;
	}

	.asset-value-left span {
		font-size: 13px;
	}

	.sug-name span {
		font-size: 13px;
	}

	.task-banner {

		width: 335px;

	}

	.task-btn .btn-primary {
		font-size: 13px;
	}

	.task-btn {
		margin-top: 41px !important;
	}

	.title-heading h3 {
		font-size: 16px;
	}

	.pop-up-bg {
	
		padding: 0px 0px;
	}

	.static-amt span {
		font-size: 10px;
	}

	#spin_btn {
		top: 85px;
	}

	.profile-lock h5 {
		font-size: 11px;
		margin-left: 5px;
	}
}




@media only screen and (max-width: 350px) {
	.footer-bav-list li {
		padding: 10px 5px;
	}

	#pills-tab li {
		padding: 5px 9px;
	}


	.err_msg {

		padding: 7px 11px;

	}

	.payment-btns a {
		font-size: 10px;
	}
}

@media only screen and (max-width: 340px) {

	.dash-nav iconify-icon {
		color: #fff;
		font-size: 20px;
	}

	.tap-to-trade-bg {
		width: 100%;
	}

	.footer-bav-list li {
		padding: 10px 5px;
	}

	.cash-wheel-bg {
		padding: 27px 11px;
	}

	.plan-bg1 {
		width: 100%;
	}

	.plan-bg2 {
		width: 100%;
	}

	#pills-tab button {
		padding: 9px 2px;
	}

	.task-banner {
		width: 100%;
	}

	.team-list-pay h4 {
		font-size: 13px;
	}

	.title-heading h3 {
		font-size: 15px;
	}
}

@media only screen and (max-width: 330px) {

	#pills-tab button {
		padding: 9px 0px;
	}

	.dash-nav iconify-icon {
		color: #fff;
		font-size: 20px;
	}

	.tap-to-trade-bg {
		width: 100%;
	}

	.footer-bav-list li {
		padding: 10px 5px;
	}
}

.sug-name h4 {
	font-size: 12px !important;
}

/* @media only screen and (max-width: 492px) {
	#spin_btn {
	  top: 140px;
	}
  } */