@font-face {
			font-family: Open24DisplaySt;
			src: url('/css/Open24DisplaySt.woff2');
		}

		@font-face {
			font-family: Teko-SemiBold;
			src: url('/css/Teko-SemiBold.ttf');
		}

		@font-face {
			font-family: Poppins-Regular;
			src: url('/css/Poppins-Regular.ttf');
		}

		body {
			margin: 0 auto;
			color: #fff;
		}

		.form-control {
			background-color: #2F211D;
			border-color: #707070;
			-moz-appearance: none;
			-webkit-appearance: none;
			color: #fff;
		}

		#right-column.active {
			right: 0;
			visibility: visible;
		}

		#right-column {
			overflow: auto;
		}

		#right-column {
			width: 60%;
			visibility: hidden;
			height: 100%;
			background-color: var(--secondary-color);
			position: fixed;
			top: 0;
			z-index: 1049;
			transition: all 0.5s;
			right: -500px;
			text-transform: capitalize;
			font-size: 14px;
		}

		.closebtn {
			color: #fff;
			position: absolute;
			top: 0;
			right: 9px;
			padding: 1px 5px;
			z-index: 3;
			font-size: 33px;
		}

		.overlay.show {
			opacity: 1;
			visibility: visible;
		}

		.show {
			display: block !important;
		}

		.overlay {
			position: fixed;
			opacity: 0;
			visibility: hidden;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: rgba(0, 0, 0, 0.5);
			z-index: 21;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			-ms-transition: all 0.5s ease-in-out;
			transition-timing-function: ease;
		}

		.active-menu-scroll {
			position: sticky;
			top: 50px;
			background-color:var(--secondary-color);
			z-index: 1;
		}

		#progressive_jackpot {
			font-family: Open24DisplaySt;
			font-size: 32px;
			margin: auto auto auto 0;
		}

		.main-menu-outer-container {
			display: flex;
			z-index: 3;
		}

		.main-menu-outer-container>i {
			color: #fff;
			display: flex;
			align-items: center;
			padding: 0 3px;
			top: 0
		}

		.main-menu-outer-container>main {
			margin: 0;
			display: flex;
			overflow: auto;
		}

		.main-menu-outer-container>main>a:first-child {
			margin-left: auto
		}

		.main-menu-outer-container>main>a:last-child {
			margin-right: auto
		}

		.main-menu-outer-container>main>a {
			display: block;
			white-space: nowrap;
			padding: 10px 0;
			font-size: 11px;
			text-align: center;
			text-transform: uppercase;
			color: #fff
		}

		.main-menu-outer-container>main>div:first-child {
			margin-left: auto
		}

		.main-menu-outer-container>main>div:last-child {
			margin-right: auto
		}

		.main-menu-outer-container>main>div {
			display: block;
			white-space: nowrap;
			padding: 10px 0;
			font-size: 11px;
			text-align: center;
			color: #fff
		}

		.main-menu-outer-container>main>a>img {
			display: block;
			width: 25px;
			margin: 10px auto
		}

		.hot-games-bounce {
			animation-name: hot-games-bounce;
			animation-timing-function: ease;
		}

		@keyframes hot-games-bounce {
			0% {
				transform: scale(1, 1) translateY(0);
			}

			10% {
				transform: scale(1.1, .9) translateY(0);
			}

			30% {
				transform: scale(.9, 1.1) translateY(-2px);
			}

			50% {
				transform: scale(1, 1) translateY(0);
			}

			100% {
				transform: scale(1, 1) translateY(0);
			}
		}

		@property --angle {
			syntax: '<angle>';
			initial-value: 90deg;
			inherits: true;
		}

		@property --gradX {
			syntax: '<percentage>';
			initial-value: 50%;
			inherits: true;
		}

		@property --gradY {
			syntax: '<percentage>';
			initial-value: 0%;
			inherits: true;
		}

		:root {
			--d: 2500ms;
			--angle: 90deg;
			--gradX: 100%;
			--gradY: 50%;
			--c1: rgba(255, 255, 255, 1);
			--c2: rgba(255, 255, 255, 0.1);
		}

		.glowing {
			border: 0.35rem solid;
			border-image: conic-gradient(from var(--angle), var(--c2), var(--c1) 0.1turn, var(--c1) 0.15turn, var(--c2) 0.25turn) 30;
			animation: borderRotate var(--d) linear infinite forwards;
		}

		.glowing:nth-child(2) {
			border-image: radial-gradient(ellipse at var(--gradX) var(--gradY), var(--c1), var(--c1) 10%, var(--c2) 40%) 30;
			animation: borderRadial var(--d) linear infinite forwards;
		}

		@keyframes borderRotate {
			100% {
				--angle: 420deg;
			}
		}

		@keyframes borderRadial {
			20% {
				--gradX: 100%;
				--gradY: 50%;
			}

			40% {
				--gradX: 100%;
				--gradY: 100%;
			}

			60% {
				--gradX: 50%;
				--gradY: 100%;
			}

			80% {
				--gradX: 0%;
				--gradY: 50%;
			}

			100% {
				--gradX: 50%;
				--gradY: 0%;
			}
		}

		.glowing2 {
			position: relative;
			overflow: hidden;
		}

		.glowing2:before {
			content: '';
			position: absolute;
			width: 100px;
			height: 100%;
			background-image: linear-gradient(120deg,
					rgba(255, 255, 255, 0) 30%,
					rgba(255, 255, 255, .8),
					rgba(255, 255, 255, 0) 70%);
			top: 0;
			left: -100px;
			animation: shine 3s infinite linear;
			/* Animation */
		}

		@keyframes shine {
			0% {
				left: -100px
			}

			20% {
				left: 100%
			}

			100% {
				left: 100%
			}
		}
	

	
		.modal-body {
			padding: 0;
		}

		.modal .modal-dialog {
			color: #120608;
			top: 60px;
			moz-transform: translateY(0);
			-webkit-transform: translateY(0);
			transform: translateY(0);
		}

		.modal-backdrop {
			position: fixed;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			z-index: 1040;
			background-color:var(--secondary-color);
			opacity: .5;
		}

		.announcement-container>[data-section="announcements"] {
			flex-basis: calc(100% - 40px);
			overflow: hidden;
			margin: auto 0;
		}

		.tickercontainer {
			margin: 0;
			padding: 0;
			overflow: hidden;
			text-align: center;
		}

		.tickercontainer .mask {
			position: relative;
			width: 100%;
			overflow: hidden;
		}

		ul.newsticker {
			position: relative;
			list-style-type: none;
			margin: 0;
			padding: 0;
			overflow: hidden;
			display: flex;
		}

		ul.newsticker li {
			margin: 0;
			font-size: 12px;
			padding: 0 25px 0 0;
			white-space: nowrap;
		}

		.circular-menu__button {
			display: none;
		}

		.circular-menu__button:checked+.circular-menu__icon {
			transform: scale(1, 1) translate3d(0, 0, 0);
			transition-duration: 0.2s;
			transition-timing-function: linear;
		}

		.circular-menu__button:checked~.circular-menu__item {
			transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33);
		}

		.circular-menu__button:checked~.circular-menu__item:nth-of-type(1) {
			transition-duration: 0.18s;
			transform: translate3d(0px, -105px, 0);
		}

		.circular-menu__button:checked~.circular-menu__item:nth-of-type(2) {
			transition-duration: 0.28s;
			transform: translate3d(99.86093418px, -32.446784369999996px, 0);
		}

		.circular-menu__button:checked~.circular-menu__item:nth-of-type(3) {
			transition-duration: 0.38s;
			transform: translate3d(61.71745146px, 84.94678437px, 0);
		}

		.circular-menu__button:checked~.circular-menu__item:nth-of-type(4) {
			transition-duration: 0.48s;
			transform: translate3d(-61.71745146px, 84.94678437px, 0);
		}

		.circular-menu__button:checked~.circular-menu__item:nth-of-type(5) {
			transition-duration: 0.58s;
			transform: translate3d(-99.86093418px, -32.446784369999996px, 0);
		}

		.circular-menu__icon {
			background: linear-gradient(#5F70FB, #4E63FA);
			border-radius: 100%;
			box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
			height: 50px;
			line-height: 50px;
			margin-left: 10px;
			position: fixed;
			text-align: center;
			bottom: 150px;
			transform: translate3d(0, 0, 0);
			transition: transform ease-out 0.2s;
			width: 50px;
			cursor: pointer;
			transform: scale(1.1, 1.1) translate3d(0, 0, 0);
			transition-duration: 0.4s;
			transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
			z-index: 7;
		}

		.circular-menu__icon:hover {
			transform: scale(1.2, 1.2) translate3d(0, 0, 0);
		}

		.circular-menu__item {
			background-image: linear-gradient(#5F70FB, #4E63FA);
			border-radius: 100%;
			box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
			color: #fff;
			height: 45px;
			line-height: 45px;
			margin-left: 10px;
			position: fixed;
			text-align: center;
			bottom: 160px;
			transform: translate3d(0, 0, 0);
			transition: transform ease-out 0.2s;
			width: 45px;
			z-index: 5;
		}

		.circular-menu__item:nth-of-type(1) {
			transition-duration: 0.18s;
		}

		.circular-menu__item:nth-of-type(2) {
			transition-duration: 0.18s;
		}

		.circular-menu__item:nth-of-type(3) {
			transition-duration: 0.18s;
		}

		.circular-menu__item:nth-of-type(4) {
			transition-duration: 0.18s;
		}

		.circular-menu__item:nth-of-type(5) {
			transition-duration: 0.18s;
		}

		.circular-menu__item:hover {
			color: #dc143c;
			background: #f08080;
		}

		.circular-menu__item:active,
		.circular-menu__item:focus {
			color: #8b0000;
		}
	
	
		#right-column.active {
			right: 0;
			visibility: visible;
		}

		#right-column {
			overflow: auto;
		}

		#right-column {
			width: 60%;
			visibility: hidden;
			height: 100%;
			background-color: var(--secondary-color);
			position: fixed;
			top: 0;
			z-index: 1049;
			transition: all 0.5s;
			right: -500px;
			text-transform: capitalize;
			font-size: 14px;
		}

		.closebtn {
			color: #fff;
			position: absolute;
			top: 0;
			right: 9px;
			padding: 1px 5px;
			z-index: 3;
			font-size: 33px;
		}

		.overlay.show {
			opacity: 1;
			visibility: visible;
		}

		.show {
			display: block !important;
		}

		.overlay {
			position: fixed;
			opacity: 0;
			visibility: hidden;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: rgba(0, 0, 0, 0.5);
			z-index: 21;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			-ms-transition: all 0.5s ease-in-out;
			transition-timing-function: ease;
		}

		.show-opt {
			display: block !important;
			background: linear-gradient(to right, #83793e, #101010);
		}

		.arrow-show-opt {
			transform: rotate(90deg);
		}

		.active-menu-scroll {
			position: sticky;
			top: 49px;
			background-color:var(--secondary-color);
			z-index: 1;
		}

		#progressive_jackpot {
			font-family: Open24DisplaySt;
			font-size: 32px;
			margin: auto auto auto 0;
		}

		.main-menu-outer-container {
			display: flex;
			z-index: 3;
		}

		.main-menu-outer-container>i {
			color: #fff;
			display: flex;
			align-items: center;
			padding: 0 3px;
			top: 0
		}

		.main-menu-outer-container>main {
			margin: 0;
			display: flex;
			overflow: auto;
		}

		.main-menu-outer-container>main>a:first-child {
			margin-left: auto
		}

		.main-menu-outer-container>main>a:last-child {
			margin-right: auto
		}

		.main-menu-outer-container>main>a {
			display: block;
			white-space: nowrap;
			padding: 10px 0;
			font-size: 11px;
			text-align: center;
			text-transform: uppercase;
			color: #fff
		}

		.main-menu-outer-container>main>div:first-child {
			margin-left: auto
		}

		.main-menu-outer-container>main>div:last-child {
			margin-right: auto
		}

		.main-menu-outer-container>main>div {
			display: block;
			white-space: nowrap;
			padding: 10px 0;
			font-size: 11px;
			text-align: center;
			color: #fff
		}

		.main-menu-outer-container>main>a>img {
			display: block;
			width: 25px;
			margin: 10px auto
		}

		.hot-games-bounce {
			animation-name: hot-games-bounce;
			animation-timing-function: ease;
		}

		@keyframes hot-games-bounce {
			0% {
				transform: scale(1, 1) translateY(0);
			}

			10% {
				transform: scale(1.1, .9) translateY(0);
			}

			30% {
				transform: scale(.9, 1.1) translateY(-2px);
			}

			50% {
				transform: scale(1, 1) translateY(0);
			}

			100% {
				transform: scale(1, 1) translateY(0);
			}
		}

		@property --angle {
			syntax: '<angle>';
			initial-value: 90deg;
			inherits: true;
		}

		@property --gradX {
			syntax: '<percentage>';
			initial-value: 50%;
			inherits: true;
		}

		@property --gradY {
			syntax: '<percentage>';
			initial-value: 0%;
			inherits: true;
		}

		:root {
			--d: 2500ms;
			--angle: 90deg;
			--gradX: 100%;
			--gradY: 50%;
			--c1: rgba(255, 255, 255, 1);
			--c2: rgba(255, 255, 255, 0.1);
		}

		.glowing {
			border: 0.35rem solid;
			border-image: conic-gradient(from var(--angle), var(--c2), var(--c1) 0.1turn, var(--c1) 0.15turn, var(--c2) 0.25turn) 30;
			animation: borderRotate var(--d) linear infinite forwards;
		}

		.glowing:nth-child(2) {
			border-image: radial-gradient(ellipse at var(--gradX) var(--gradY), var(--c1), var(--c1) 10%, var(--c2) 40%) 30;
			animation: borderRadial var(--d) linear infinite forwards;
		}

		@keyframes borderRotate {
			100% {
				--angle: 420deg;
			}
		}

		@keyframes borderRadial {
			20% {
				--gradX: 100%;
				--gradY: 50%;
			}

			40% {
				--gradX: 100%;
				--gradY: 100%;
			}

			60% {
				--gradX: 50%;
				--gradY: 100%;
			}

			80% {
				--gradX: 0%;
				--gradY: 50%;
			}

			100% {
				--gradX: 50%;
				--gradY: 0%;
			}
		}

		.glowing2 {
			position: relative;
			overflow: hidden;
		}

		.glowing2:before {
			content: '';
			position: absolute;
			width: 100px;
			height: 100%;
			background-image: linear-gradient(120deg,
					rgba(255, 255, 255, 0) 30%,
					rgba(255, 255, 255, .8),
					rgba(255, 255, 255, 0) 70%);
			top: 0;
			left: -100px;
			animation: shine 3s infinite linear;
			/* Animation */
		}

		@keyframes shine {
			0% {
				left: -100px
			}

			20% {
				left: 100%
			}

			100% {
				left: 100%
			}
		}
	
	
		/* Popup home modal styling */
		.popup-home-content {
			color: #333 !important;
			background-color: #fff !important;
		}

		.popup-home-body {
			color: #333 !important;
		}

		.popup-home-body h1,
		.popup-home-body h2,
		.popup-home-body h3,
		.popup-home-body h4,
		.popup-home-body h5,
		.popup-home-body h6 {
			color: #000 !important;
		}

		.popup-home-body p {
			color: #333 !important;
		}

		.popup-home-body a {
			color: #007bff !important;
			text-decoration: underline;
		}

		.popup-home-body a:hover {
			color: #0056b3 !important;
		}

		.popup-home-body strong,
		.popup-home-body b {
			color: #000 !important;
		}

		.popup-home-body::-webkit-scrollbar {
			width: 8px;
		}

		.popup-home-body::-webkit-scrollbar-track {
			background: #f1f1f1;
			border-radius: 10px;
		}

		.popup-home-body::-webkit-scrollbar-thumb {
			background: #888;
			border-radius: 10px;
		}

		.popup-home-body::-webkit-scrollbar-thumb:hover {
			background: #555;
		}

		.popup-home-close:hover {
			opacity: 0.8 !important;
		}

		/* Prevent body scroll when modal is open */
		body.popup-home-open {
			overflow: hidden;
		}

		/* Responsive adjustments for mobile */
		@media (max-width: 768px) {
			.popup-home-modal {
				padding: 15px !important;
			}

			.popup-home-dialog {
				margin: 0 !important;
				width: 85% !important;
				max-width: 450px !important;
			}

			.popup-home-header {
				padding: 10px 12px !important;
			}

			.popup-home-close {
				top: 8px !important;
				right: 12px !important;
				font-size: 24px !important;
			}

			.popup-home-body {
				max-height: 70vh !important;
				padding: 12px !important;
			}

			.popup-home-body h4 {
				font-size: 16px !important;
				margin-bottom: 10px !important;
				line-height: 1.3 !important;
			}

			.popup-home-body p {
				font-size: 13px !important;
				margin-bottom: 8px !important;
				line-height: 1.4 !important;
			}

			.popup-home-body>div {
				margin-bottom: 8px !important;
			}

			.popup-home-body img {
				margin-top: 8px !important;
			}
		}

		@media (max-width: 480px) {
			.popup-home-modal {
				padding: 10px !important;
			}

			.popup-home-dialog {
				margin: 0 !important;
				width: 90% !important;
				max-width: 380px !important;
			}

			.popup-home-header {
				padding: 8px 10px !important;
			}

			.popup-home-close {
				top: 6px !important;
				right: 10px !important;
				font-size: 22px !important;
			}

			.popup-home-body {
				max-height: 65vh !important;
				padding: 10px !important;
			}

			.popup-home-body h4 {
				font-size: 15px !important;
				margin-top: 0 !important;
				margin-bottom: 8px !important;
				line-height: 1.3 !important;
			}

			.popup-home-body p {
				font-size: 12px !important;
				margin-bottom: 6px !important;
				line-height: 1.4 !important;
			}

			.popup-home-body>div {
				margin-bottom: 6px !important;
			}

			.popup-home-body img {
				margin-top: 6px !important;
			}
		}