/* https://webgalaxytangkas.com/bunker/assets/css/fonts.css?v=1.0.1 */
@font-face {
    font-family: 'GothamBold';
    src: url('../../libs/fonts/GothamBold/GothamBold.woff2') format('woff2'),
         url('../../libs/fonts/GothamBold/GothamBold.woff') format('woff'),
		 url('../../libs/fonts/GothamBold/GothamBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

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

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

@font-face {
    font-family: 'BebasRegular';
    src: url('../../libs/fonts/BebasRegular/Bebas-Regular.woff2') format('woff2'),
         url('../../libs/fonts/BebasRegular/Bebas-Regular.woff') format('woff'),
		 url('../../libs/fonts/BebasRegular/Bebas-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'PlayRegular';
    src: url('../../libs/fonts/Play/play-regular-webfont.woff2') format('woff2'),
         url('../../libs/fonts/Play/play-regular-webfont.woff') format('woff'),
		 url('../../libs/fonts/Play/play-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'PlayBold';
    src: url('../../libs/fonts/Play/play-bold-webfont.woff2') format('woff2'),
         url('../../libs/fonts/Play/play-bold-webfont.woff') format('woff'),
		 url('../../libs/fonts/Play/play-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'NunitoExtraLight';
    src: url('../../libs/fonts/Nunito/Nunito-ExtraLight.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'NunitoLight';
    src: url('../../libs/fonts/Nunito/Nunito-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'NunitoRegular';
    src: url('../../libs/fonts/Nunito/Nunito-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}
/* https://webgalaxytangkas.com/bunker/assets/css/fonts.css?v=1.0.1 */
@font-face {
    font-family: 'GothamBold';
    src: url('../../libs/fonts/GothamBold/GothamBold.woff2') format('woff2'),
         url('../../libs/fonts/GothamBold/GothamBold.woff') format('woff'),
		 url('../../libs/fonts/GothamBold/GothamBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

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

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

@font-face {
    font-family: 'BebasRegular';
    src: url('../../libs/fonts/BebasRegular/Bebas-Regular.woff2') format('woff2'),
         url('../../libs/fonts/BebasRegular/Bebas-Regular.woff') format('woff'),
		 url('../../libs/fonts/BebasRegular/Bebas-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'PlayRegular';
    src: url('../../libs/fonts/Play/play-regular-webfont.woff2') format('woff2'),
         url('../../libs/fonts/Play/play-regular-webfont.woff') format('woff'),
		 url('../../libs/fonts/Play/play-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'PlayBold';
    src: url('../../libs/fonts/Play/play-bold-webfont.woff2') format('woff2'),
         url('../../libs/fonts/Play/play-bold-webfont.woff') format('woff'),
		 url('../../libs/fonts/Play/play-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'NunitoExtraLight';
    src: url('../../libs/fonts/Nunito/Nunito-ExtraLight.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'NunitoLight';
    src: url('../../libs/fonts/Nunito/Nunito-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'NunitoRegular';
    src: url('../../libs/fonts/Nunito/Nunito-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-sementara.css?v=7 */


/* 'xxl' applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399px) {
	
}

/* 'xl' applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199px) {
	
}

/* 'lg' applies to medium devices (tablets, less than 992px) */
@media (max-width: 991px) {
	
}

/* 'md' applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767px) {
	
}

/* 'sm' applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
	
}

@media (max-width: 480px) {
	
}

@media (max-width: 360px) {
	
}

@media (max-width: 320px) {
	
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-sementara.css?v=7 */


/* 'xxl' applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399px) {
	
}

/* 'xl' applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199px) {
	
}

/* 'lg' applies to medium devices (tablets, less than 992px) */
@media (max-width: 991px) {
	
}

/* 'md' applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767px) {
	
}

/* 'sm' applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
	
}

@media (max-width: 480px) {
	
}

@media (max-width: 360px) {
	
}

@media (max-width: 320px) {
	
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-root.css?v=1.0.1 */
:root {
	--bg-main: #2e3e65;
	--bg-secondary: #696969;
	--bg-transparent: transparent;
	--bg-white-dark: #e3e3e3;
	--bg-white: $ffffff;
	--bg-gold: #c49c00;
	--bg-dark-grey: #161616;
	--bg-dark-green-gradient: linear-gradient(to bottom,  #212628 0%, #303f48 100%);
	--bg-offcanvas: #000d0c;
	--bg-header: #191636;
	--bg-menu: rgba(0, 0, 0, .35);
	--bg-menu-secondary: #001435;
	--bg-running-text: #0e1e3c;
	--bg-main-secondary: #151515;
	--bg-wrap: #0e1e3c;
	
	--color-main: #f8e8ff;
	--color-secondary: #eaeaea;
	--color-cool-blue: #4582b4;
	--color-purple-light: #f61de6;
	--color-purple-light-hover: #b314a7;
	--color-purple-dark: #b61df6;
	--color-purple-dark-hover: #7b0fa8;
	--color-white-dark: #e3e3e3;
	--color-white-darker: #bbbbbb;
	--color-gray: #5d6577;
	--color-gray-light: #898589;
	--color-dark-gray: #2b2b2b;
	--color-yellow-fade: #ece072;
	--color-yellow: #ecd936;
	--color-yellow-highlight: #ffe400;
	--color-green: #34d07e;
	--color-green-hover: #1f9155;
	--color-green-dark: #1f9155;
	--color-black: #000000;
	--color-light-black: #151515;
	--color-lime-light: #e5f00d;
	--color-lime-dark: #b6eb00;
	--color-teal-fade: #63ccde;
	--color-teal: #28c9e6;
	--color-teal-highlight: #02daff;
	--color-softmagenta-fade: #faa194;
	--color-softmagenta: #ff7f6c;
	--color-softmagenta-highlight: #ff4d33;
	
	--color-yellow-main: #f4b821;
	--color-yellow-hover-main: #f9ba24;
	--color-red-main: #f00308;
	--color-red-hover-main: #480a0b;
	--color-red-dark-main: #7d0402;
	--color-green-main: #1ff61f;
	--color-green-hover-main: #01371f;
	--color-green-dark-main: #019352;
	--color-gold-main: #fcd675;
	--color-gold-hover-main: #241703;
	--color-gold-light-main: #9f6204;
	--color-maroon-main: #390b05;
	--color-orange-main: #ff5407;
	--color-violet-main: #5116ae;
	--color-violet-hover-main: #280360;
	
	--color-accent-vertical: linear-gradient(to bottom, #009eff 0%, #0267a6 100%);
	--color-accent-horizontal: linear-gradient(135deg, #009eff 0%, #0267a6 100%);
	--color-line-accent: #5d6577;
	--color-line-dark-accent: #7b0034;
	--color-border-accent: #0cfdfd;
	--color-inner-accent: #009eff;
	--color-outer-accent: #0267a6;
	--color-text-accent: #00345e;
	
	--color-back-progress: #5d6577;
	--color-front-progress: #009eff;
	--color-higlight-footer: #009eff;
	--color-cyan-main: #0cfdfd;
	/*--color-front-progress: #9b008a;*/
	--color-rosegold-ver-hover: linear-gradient(to bottom, #A67C00 0%, #6C002F 100%);
	--color-rosegold-hor-hover: linear-gradient(135deg, #A67C00 0%, #6C002F 100%);
	--color-gold-border-hover: #A67C00;
	--color-rosegold-text-hover: #fff;
	
	--color-rosegold-ver: linear-gradient(to bottom, #D4AF37 0%, #E33750 100%);
	--color-rosegold-hor: linear-gradient(135deg, #D4AF37 0%, #E33750 100%);
	--color-gold-border: #D4AF37;
	--color-rose-border: #E33750;
	--color-rosegold-text: #571f22;
	--color-campagne: #E7D5A9;
	
	
	/*
	--color-main-link: #28c9e6;
	--color-main-link-hover: #f9ba24;
	*/
	--color-main-link: #0cfdfd;
	--color-main-link-hover: #f9ba24;
	
	--color-dark-green-transparent: rgba(49, 75, 56, 0.3);
	
	--nav-link-color: var(--color-main);
	--nav-link-hover: #f965ee;
	--line-color: linear-gradient(to right, rgba(255,255,255,0) 0%, #019eff 25%, #0cfdfd 50%, #019eff 75%, rgba(255,255,255,0) 100%);
	--padding-section: 1rem 0 2rem;
	--bs-dropdown-link-color-light: #ffffff;
	--menu-offcanvas-width: 80%;
	--nav-link-mobile-padding-y: 10px;
	--main-card-bg: #141824;
	--main-card-border-color: #31374a;
	
	--thead-bg: #3c5688;
	--thead-color: #fff;
	--table-striped-bg: #232732;
	--table-striped-color: #4c5f8c;
	--table-border-color: #232732;
	--table-hover-bg: rgba(37, 47, 66, .75);
	--table-footer-bg: #2f5895;
}

[data-bs-theme="greenfun"] {
	
}

.bg-white-dark {
	background-color: var(--bg-white-dark);
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme.css?v=1.0.1 */
body {
	background-color: var(--bg-main);
	font-family: "NunitoLight", sans-serif;
	font-size: 16px;	
	color: var(--color-main);
	min-width: 320px;
	overflow-x: hidden;
}

a, 
a:link {
	text-decoration: none;
	outline: none !important;
}

a {
	/*color: var(--color-purple-light);*/
	color: var(--color-main-link);
	outline: none !important;
}

a:hover {
	color: var(--color-main-link-hover);
	text-decoration: underline;
	outline: none !important;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'BebasRegular';
	margin: 0;
	padding: 0;
}
abbr {
	border-bottom: none !important;
	font-size: 0.875rem;
}
pre {
	width: 100%;
}

/*
===== ROOT THEME =====
*/

/*
--- position Point ---
*/

.relative {
	position: relative !important;
}

/*
--- Text Point ---
*/

.bebas-regular {
	font-family: 'BebasRegular' !important;
}

.gotham-bold {
	font-family: 'GothamBold' !important;
}

.capitalize {
	text-transform: capitalize !important;
}

.uppercase {
	text-transform: uppercase !important;
}

.lowercase {
	text-transform: lowercase !important;
}

.bold {
	font-weight: 600 !important;
}

.justify {
	text-align: justify !important;
}

.txt-16 {
	font-size: 1rem !important;
}

.txt-18 {
	font-size: 1.125rem !important;
}

/*
--- bg Point ---
*/

.bg-main {
	background-color: var(--bg-main) !important;
}
.bg-secondary {
	background-color: var(--bg-secondary) !important;
}
.bg-glass {
	/* From https://css.glass */
	background: rgba(55, 23, 57, 0.91);
	border-radius: 0.6em;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(4.5px);
	-webkit-backdrop-filter: blur(4.5px);
	border: 1px solid rgba(255, 255, 255, 0.3);
}
.bg-glass-soft {
	/* From https://css.glass */
	background: rgba(36, 96, 45, 0.1);
	border-radius: 0.6em;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	border: 1px solid rgba(255, 255, 255, 0.3);
}
.bg-glass-white {
	/* From https://css.glass */
	background: rgba(255, 255, 255, 0.73);
	border-radius: 0.6em;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(7.9px);
	-webkit-backdrop-filter: blur(7.9px);
	border: 1px solid rgba(255, 255, 255, 0.3);
}

/*
--- color Point ---
*/

.purple-light {
	color: var(--color-teal-highlight) !important;
}

.purple-dark {
	color: var(--color-teal) !important;
}

.red {
	color: var(--bs-red) !important;
}

.yellow {
	color: var(--color-teal-highlight) !important;
}

.yellow-main {
	color: var(--color-yellow-main) !important;
}

.red-main {
	color: var(--color-red-main) !important;
}

.green {
	color: var(--color-green) !important;
}

.green-dark {
	color: var(--color-green-dark) !important;
}

.gray {
	color: var(--color-gray) !important;
}

.light-black {
	color: var(--color-light-black) !important;
}

/*
--- Button Point ---
*/

.btn {
	border-radius: 3px;
	font-family: 'BebasRegular';
	color: var(--color-main);
	padding: 0.313rem 2rem;
	line-height: normal;
	font-size: 1.125rem;
	text-decoration: none !important;
	
	-webkit-box-shadow: none !important;
			box-shadow: none !important;
}

.btn-shadow {
	-webkit-box-shadow: 0.1875rem 0.3125rem 0.4375rem rgba(0, 0, 0, .65) !important;
			box-shadow: 0.1875rem 0.3125rem 0.4375rem rgba(0, 0, 0, .65) !important;	
}

.btn-main,
.btn-main:focus {
	background: linear-gradient(to bottom, #fce92d 0%,#ff6c27 100%);
	color: var(--color-light-black);
	border-color: #fce92d;
}

.btn-main:hover {
	background: linear-gradient(to bottom, #ffa700 0%,#ffa700 100%);
	color: var(--color-light-black);
	border-color: #5e4a1b;
}

.btn-main-dark,
.btn-main-dark:focus {
	background: linear-gradient(to bottom, #e00201 0%,#7d0402 100%);
	border-color: #e00201;
	color: var(--color-main);
}

.btn-main-dark:hover {
	background: linear-gradient(to bottom, #e00201 0%,#e00201 100%);
	border-color: #7d0402;
	color: var(--color-main);
}

.btn-green,
.btn-green:focus {
	background-color: var(--color-green);
	color: var(--color-main);
}

.btn-green:hover {
	background-color: var(--color-green-hover);
}

.btn-white-dark,
.btn-white-dark:focus {
	background-color: var(--bg-white-dark);
	color: var(--color-gray);
}

.btn-white-dark:hover {
	background-color: var(--bs-white);
	color: var(--color-dark-gray);
}

.btn-trans,
.btn-trans:focus {
	background-color: transparent;
	border-color: var(--color-main);
	color: var(--color-main);
}

.btn-trans:hover {
	background-color: var(--color-main);
	color: var(--color-dark-gray);
}

.btn-success, 
.btn-success:focus {
	background: linear-gradient(to bottom, #5fcb41 0%,#2f5723 100%);
	border-color: #5fcb41;
	color: var(--color-light-black);
}

.btn-success:hover {
	background: linear-gradient(to bottom, #5fcb41 0%,#5fcb41 100%);
	border-color: #2f5723;
	color: var(--color-light-black);
}

.btn-in-form, 
.btn-in-form:focus {
	background: linear-gradient(to bottom, #1e75f6 0%,#0e376b 100%) !important;
	color: var(--color-main) !important;
	border-color: #1e75f6 !important;
}

.btn-in-form:focus {
	background: linear-gradient(to bottom, #1e75f6 0%,#1e75f6 100%) !important;
	color: var(--color-main) !important;
	border-color: #1e75f6 !important;	
}

.btn-danger.btn-in-form, 
.btn-danger.btn-in-form:focus {
	background: linear-gradient(to bottom, #e00201 0%,#480a0b 100%) !important;
	color: var(--color-main) !important;
	border-color: #e00201 !important;
}

.btn-danger.btn-in-form:focus {
	background: linear-gradient(to bottom, #e00201 0%,#e00201 100%) !important;
	color: var(--color-main) !important;
	border-color: #e00201 !important;	
}

.btn-group-sm > .btn, 
.btn-sm {
	font-size: 0.9375rem;
	padding: 0.1875rem 1rem;
}

.btn-group-lg > .btn, 
.btn-lg {
	font-size: 1.5rem;
	padding: 0.313rem 2.5rem;
}
.btn-see-all {
	margin: auto;
}
.btn-see-all:hover {
	color: var(--color-main);
}

.btn-with-icon .badge {
  padding: 0;
}
.btn-with-icon-left .badge {
  margin-right: 0.5em;
}
.btn-with-icon .badge .fa {
  font-size: 1.4em;
}

.btn-with-icon.big-icon-on-left {
	position: relative;
	min-height: 3em;
	font-size: 1.2em;
}
.btn-with-icon.big-icon-on-left .badge {
  left: 0;
  top: 0;
  width: 4em;
  bottom: 0;
}
.btn-with-icon.big-icon-on-left .badge .fa::before {
  font-size: 1.6em;
  display: block;
}

.btn-rounded {
	border-radius: 0.2em;
	overflow: hidden;
}
.btn-capsule {
	border-radius: 2em;
}

.btn-un-suggestion {
  text-transform: lowercase;
  font-size: 1em !important;
  position: relative;
  top: -1px;
}

.underinput_ext {
  background-color: rgb(0, 34, 51);
}
.underinput_ext.available {
  background-color: #0e5005;
  display: table;
  font-size: 0.9em;
  padding-top: 0px !important;
  padding-bottom: 2px !important;
}
.underinput_loader {
  font-size: 0.8em;
}
.underinput_loader .spinner-grow {
  scale: 0.6;
  position: relative;
  top: 2px;
  left: 2px;
}
.underinput_error {
  font-size: 0.9em;
  padding-top: 0px !important;
  padding-bottom: 2px !important;
}


/* RESPONSIVE FONT SIZE */
.rfs-1 {
	font-size: 1.8em;
}
.rfs-2 {
	font-size: 1.65em;
}
.rfs-3 {
	font-size: 1.55em;
}
.rfs-4 {
	font-size: 1.5em;
}
.rfs-5 {
	font-size: 1.35em;
}
.rfs-6 {
	font-size: 1.2em;
}

.rfs-tiny-1 {
	font-size: 0.875em;
}
.rfs-tiny-2 {
	font-size: 0.7em;
}
.rfs-tiny-3 {
	font-size: 0.6em;
}

@media (max-width:1399px) {
	.rfs-1 {
		font-size: 1.65em;
	}
	.rfs-2 {
		font-size: 1.55em;
	}
	.rfs-3 {
		font-size: 1.475em;
	}
	.rfs-4 {
		font-size: 1.4em;
	}
	.rfs-5 {
		font-size: 1.25em;
	}
	.rfs-6 {
		font-size: 1.125em;
	}
	.rfs-tiny-1 {
		font-size: 0.83em;
	}
	.rfs-tiny-2 {
		font-size: 0.68em;
	}
	.rfs-tiny-3 {
		font-size: 0.58em;
	}
}
@media (max-width:1199px) {
	.rfs-1 {
		font-size: 1.5em;
	}
	.rfs-2 {
		font-size: 1.425em;
	}
	.rfs-3 {
		font-size: 1.4em;
	}
	.rfs-4 {
		font-size: 1.3em;
	}
	.rfs-5 {
		font-size: 1.2em;
	}
	.rfs-6 {
		font-size: 1.1em;
	}
	.rfs-tiny-1 {
		font-size: 0.8em;
	}
	.rfs-tiny-2 {
		font-size: 0.66em;
	}
	.rfs-tiny-3 {
		font-size: 0.56em;
	}
}
@media (max-width:991px) {
	.rfs-1 {
		font-size: 1.4em;
	}
	.rfs-2 {
		font-size: 1.325em;
	}
	.rfs-3 {
		font-size: 1.25em;
	}
	.rfs-4 {
		font-size: 1.2em;
	}
	.rfs-5 {
		font-size: 1.125em;
	}
	.rfs-6 {
		font-size: 1.05em;
	}
	.rfs-tiny-1 {
		font-size: 0.775em;
	}
	.rfs-tiny-2 {
		font-size: 0.64em;
	}
	.rfs-tiny-3 {
		font-size: 0.54em;
	}
}
@media (max-width:767px) {
	.rfs-1 {
		font-size: 1.325em;
	}
	.rfs-2 {
		font-size: 1.275em;
	}
	.rfs-3 {
		font-size: 1.225em;
	}
	.rfs-4 {
		font-size: 1.1em;
	}
	.rfs-5 {
		font-size: 1.05em;
	}
	.rfs-6 {
		font-size: 1em;
	}
	.rfs-tiny-1 {
		font-size: 0.73em;
	}
	.rfs-tiny-2 {
		font-size: 0.62em;
	}
	.rfs-tiny-3 {
		font-size: 0.52em;
	}
}
@media (max-width:767px) {
	.rfs-1 {
		font-size: 1.325em;
	}
	.rfs-2 {
		font-size: 1.225em;
	}
	.rfs-3 {
		font-size: 1.15em;
	}
	.rfs-4 {
		font-size: 1em;
	}
	.rfs-5 {
		font-size: 0.975em;
	}
	.rfs-6 {
		font-size: 0.95em;
	}
	.rfs-tiny-1 {
		font-size: 0.7em;
	}
	.rfs-tiny-2 {
		font-size: 0.6em;
	}
	.rfs-tiny-3 {
		font-size: 0.5em;
	}
}

/* marquee */
marquee {
  line-height: 2.4em;
}
.running-news .input-group-text {
  font-size: 0.8em;
  position: relative;
  background-color: transparent;
  color: var(--color-purple-dark);
  padding-right: 1.6em;
}
.running-news .input-group-text::after {
	content: "\f101";
	font-family: "FontAwesome";
	position: absolute;
	right: 0;
	font-size: 1.4em;
	height: 100%;
	align-items: center;
	display: flex;
	top: -1px;
}
.running-news i {
  font-style: normal;
}
@media (max-width:767px) {
	.running-news i {
	  font-size: 0.9em;
	}
	.running-news {
	  border-top: 1px solid var(--color-dark-gray);
	}
	.running-news .input-group-text::after {
	  display: none;
	}
	marquee {
	  font-size: 0.9em;
	}
	.running-news .input-group-text {
	  padding-right: 0.2em;
	}
}
@media (max-width:575px) {
	.running-news i {
	  font-size: 1.1em;
	}
}

/* limit sizing */
.max-280 {
	max-width: 280px;
}
.max-767 {
  max-width: 767px;
}
.min-130 {
	min-width: 130px;
}
/* SEPARATORS */
.or-separator {
  position: relative;
  margin: 0 auto;
  margin-bottom: 0px;
}
.or-separator span {
  display: block;
  width: 120px;
  margin: 0 auto;
  font-size: 0.7em;
  letter-spacing: .2px;
  line-height: 22px;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-secondary);
}
.or-separator::after, 
.or-separator::before {
  content: "";
  position: absolute;
  height: 1px;
  background-color: var(--bg-secondary);
  top: 11.25px;
}
.or-separator::before {
  width: 42%;
}
.or-separator::after {
  left: auto;
  right: 0;
  width: 42%;
}

/*
===== ELEMENT THEME =====
*/

header, 
.language-header, 
.select-language, 
.identity-header, 
.logo-header, 
.login-header, 
.menu-header, 
main, 
footer {
	float: left;
	width: 100%;
	position: relative;	
}

/*** LINE BORDER ***/

.line-border::after {
	content: '';
	position: absolute;
	bottom: 0;
	height: 0.125rem;
	background: var(--line-color);
}

.line-border-top::before {
	content: '';
	position: absolute;
	top: 0;
	height: 0.125rem;
	background: var(--line-color);
	width: 100%;
}

.line-border-h3::after {
	height: 0.1875rem;
}

.line-border-full::after {
	left: 0;
	right: 0;
}

.line-border-w75::after {
	width: 80vw;
}

.line-border-left::after {
	left: 0;
}

.line-border-right::after {
	right: 0;
}

.line-border-zi2::after {
	z-index: 2;
}

/*** HEADER ***/

/*
==== LOGO ====
handling bentuk logo yg bervariasi
land-nearcubic: bentuk landscape hampir sama sisi
land-long: bentuk landscape yg lebarnya diantara 2 - 3 kali tingginya
land-verylong: bentuk landscape yg lebarnya lebih dari 3 kali tingginya
port-nearcubic: bentuk portrait hampir sama sisi
port-long: bentuk portrait yg tingginya diantara 2 - 3 kali lebarnya
port-verylong: bentuk portrait yg tingginya lebih dari 3 kali lebarnya
*/
.logo-header img.shape-land-nearcubic {
	width: 220px !important; 
}
.navbar-brand img.shape-land-nearcubic {
  width: 72px !important;
}
@media (max-width:767px) {
	.logo-header img.shape-land-nearcubic {
	  width: 85px !important;
	}
}

header {
	/*padding-top: 1.65rem;*/
}
.header-simple {
	
}
.logo-header img {
	max-width: 250px;
}
.header-simple .identity-header {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.header-simple .identity-header.line-border::after {
  width: 100%;
}
.header-simple .logo-header {
  display: flex;
  position: static;
  margin: auto;
  float: none;
  width: auto;
}

.header-simple .logo-header img {
	max-width: 250px;
	padding-bottom: .5rem;
	padding-top: .5rem;
}

.offcanvas-header .navbar-brand img {
  min-width: 150px;
  max-width: 180px;
}

@media (max-width:991px) {
	.logo-header img {
		max-width: 130px;
	}	
}

@media (max-width:767px) {
	.logo-header-row {
		position: relative;
	}
	.logo-header {
		position: absolute;
		top: 0;
		width: 30%;
		z-index: 200;
	}

	.logo-header img {
		height: auto !important;
		max-width: 100%;
	}
	
	.header-simple .logo-header img {	
		width: 100%;
	}

}
@media (max-width:767px) {
	.identity-header {
		margin-top: 1.5em !important;
		margin-bottom: 1.5em !important;
	}
	.logo-header-col {
		width: 34%;
	}
	.login-header-col {
		width: 66%;
	}
}

/** language header **/

.language-header {
	
} 

.select-language {
	
}

.select-language > div + div {
	margin-left: 2rem;
}

.select-language img.icon {
	width: 1.25rem !important;
	margin-right: 0.625rem;
}

.select-language a {
	font-size: 0.75rem;
	color: var(--color-secondary);
	padding-bottom: 0.5rem;
}

.select-language a:hover {
	color: var(--color-purple-light);
	text-decoration: none;
}

.select-language .dropdown-item:hover {
	background-color: var(--color-dark-gray);
}

/** identity header **/

.identity-header {
	margin-top: 1.25rem;
	margin-bottom: 1.25rem;
}

.loggedin .identity-header {
}

.logo-header {
	
}

.login-header {
	
}

.login-header .row {
	--bs-gutter-x: 1rem;
}

#login-with-header a {
	font-size: 0.75rem !important;
	color: var(--color-secondary) !important;
	border: none !important;
	padding-bottom: 0.5rem !important;
}

#login-with-header a:hover {
	color: var(--color-yellow-fade) !important;
	text-decoration: none !important;
}

#login-with-header .dropdown-item {
	padding: 0.27rem 1rem !important;
}

.btn-google img {
	height: 16px;
	margin-right: 6px;
	margin-top: -1px;
}

.btn-google.btn-lg img {
	height: 22px;
}

#form_login_head {
	display: grid;
	grid-template-columns: repeat(4, auto);
	gap: 1rem;
}

.offcanvas.show .offcanvas-header .navbar-brand img {
  width: auto !important;
  height: 30px !important;
  min-width: unset;
}

@media (max-width: 1199px) {
	.logo-header img {
		max-width: 190px;
	}

	.btn-google {
		padding: 0.1875rem 0.5rem !important;
	}
}

@media (max-width: 991px) {
	.logo-header-col {
		/*margin-top: -25px;*/
	}

	.login-header-col {
		margin-top: .5rem;
	}
	.logo-header a {
		margin: auto;
	}
	.logo-header img {
		max-width: 200px;
	}
}

@media (max-width: 767px) {
	.logo-header-col {
		width: 34%;
		margin-top: 0;
	}

	.login-header-col {
		width: 66%;
		margin-top: 0;
	}
	
	#form_login_head {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	.header-front .logo-header-col {
		width: 100%;
	}
	.header-front .login-header-col {
		display: none;
	}
	.header-front .logo-header a {
		margin: auto;
	}
	.header-front .logo-header {
		margin-top: 5px !important;
		width: 100%;
		position: static;
	}
	.header-front .logo-header img {
		width: 200px;
	}
	.header-front .identity-header .container {
		overflow: visible;
	}
}

@media (max-width: 575px) {
  .header-front .logo-header img {
    width: 180px;
  }
}

.user-vital-box {
  position: relative;
}

/** FROM PHONE VALIDATION **/
.phone-verification-urgent button:hover {
	color: #ffffff;
}
.formtopcontent {
	max-width: 500px;
	margin: auto;
}
.formtopcontent .form-control,
.formtopcontent .form-control:focus {
	background-color: #d2cab0;
}

/** PEAK MENU **/
.peak-menu a {
	font-family: "NunitoLight", sans-serif;
	font-size: 0.65em;
	letter-spacing: 0.03em;
	position: relative;
}
.peak-menu a.separator::before {
  content: "";
  position: absolute;
  width: 1px;
  left: -8px;
  top: 2px;
  height: 10px;
  border-left: 1px solid;
}

@media(max-width: 767px) {
	.peak-menu {
	  position: absolute;
	  right: 15px;
	}
}

@media(max-width: 767px) {
	.peak-menu {
		display: none;
	}
}

/*** NAVBAR ***/

.menu-header-wrap {
  display: table;
  width: 100%;
}
.menu-header {
	background: linear-gradient(to bottom,  #464545 0%,#292828 40%,#131313 100%);	
}
.navbar {
	background: none !important;
	z-index: 10;
}
.navbar-nav > .nav-item, 
.navbar-nav > .nav-item > .nav-link {
	position: relative;
}

.navbar-nav > .nav-item > .nav-link {
	font-family: 'BebasRegular';
	line-height: normal;
	font-size: 1.1rem;
	color: var(--nav-link-color);
	text-transform: uppercase;
	text-decoration: none !important;
}

.navbar-nav > .nav-item > .nav-link {
	padding-left: 1rem;
	padding-right: 1rem;
}

.navbar-nav > .nav-home {
	padding-right: 1rem;
}

.navbar-nav > .nav-home > .nav-link {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #a4a3a3;
	border-radius: 3.125rem;
	height: 2.125rem;
	width: 2.125rem;
	padding: 0;
	color: #292929;
}

.navbar-nav > .nav-home > .nav-link:focus, 
.navbar-nav > .nav-home > .nav-link:hover, 
.navbar-nav > .nav-home > .nav-link.active {
	background-color: var(--color-teal-highlight);
	color: #292929;
}

.nav-link:focus, 
.nav-link:hover {
	color: var(--color-teal-highlight);
}

.navbar-nav .nav-link.active, 
.navbar-nav .nav-link.show {
	color: var(--color-teal-highlight);
}

.nav-link::after {
	-webkit-transition: .3s ease-in-out;
			transition: .3s ease-in-out;
}

.nav-link.show::after {
	-webkit-transform: rotate(-90deg);
			transform: rotate(-90deg);
}
.dropdown-item:hover {
	text-decoration: none;
}
.dropdown-item {
	font-family: 'BebasRegular';
	font-size: 1.1em;
}

.nav-link-image img {
	height: 21px;
	transform: scale(1.75);
	border-radius: 4px;
	object-fit: contain;
	mix-blend-mode: lighten;
}

.nav-link-image:hover img {
	transform: scale(2.5);
}

.login-register-aside-navbar-toggler {
	position: absolute;
	right: 51px;
	top: 18px;
}
.login-register-aside-navbar-toggler a {
	line-height: 1.6em;
	border-radius: 4px;
}

@media(max-width: 767px) {
	.navbar-toggler-wrap {
		position: absolute;
		top: 20px;
		right: 1px;
		transform: scale(0.6);
	}
	.loggedin .navbar-toggler-wrap {
		top: 4px;
	}
	.navbar,
	.menu-header {
		position: static;
		padding-top: 0;
		padding-bottom: 0;
	}
	.navbar-toggler-wrap button {
		border: none;
		background-color: var(--color-main);
	}
	.navbar.navbar-expand-sm {
		padding-top: 0;
		padding-bottom: 0;
	}
	.navbar-nav > .nav-item {
		width: 100%;
	}
	.navbar-nav > .nav-item > .nav-link,
	.dropdown-item {
		padding-left: var(--bs-offcanvas-padding-x) !important;
		padding-right: var(--bs-offcanvas-padding-x) !important;
		padding-top: var(--nav-link-mobile-padding-y) !important;
		padding-bottom: var(--nav-link-mobile-padding-y) !important;
	}
	.navbar-nav > .nav-item > .nav-link:hover {
		color: var(--bs-dropdown-link-color-dark) !important;
		background-color: var(--bs-dropdown-link-color-light) !important;
	}
	.navbar-nav > .nav-item:not(.nav-home) + .nav-item:not(.nav-home) > a {
		border-top: 1px solid var(--color-main);
	}
	.dropdown-item {
		font-family: 'BebasRegular';
		line-height: normal;
		font-size: 1.1rem;
		color: var(--nav-link-color);
		text-transform: uppercase;
		text-decoration: none !important;
		font-size: inherit !important;
	}
	.navbar-nav .dropdown-menu {
		padding-top: 0;
		padding-bottom: 0;
		background-color: transparent;
		border-radius: 0;
		border: none;
		margin-top: 0;
	}
	.dropdown-menu > li .dropdown-item {
		border-top: 1px solid var(--color-main);
	}
}

/*** OFF CANVAS ***/

.bg-offcanvas {
  background: rgba(0, 18, 23, 0.6);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15);
  border-right: 3px solid rgba(0, 61, 49, 0.44) !important;
}
.offcanvas.offcanvas-start {
	width: var(--menu-offcanvas-width);
}
.offcanvas {
	/*
	background-color: var(--bg-offcanvas) !important;
	border-right: 2px solid #00241f !important;
	*/
	z-index: 10000000000;
}
.offcanvas-header .btn-close {
	outline: none !important;
}

/*** MEGA MENU ***/

.navbar .megamenu {
	padding: 1rem;
}
.dropdown-menu.megamenu .row > div {
	/*margin: auto;*/
}


.menu-card-titledesc {
	background-color: var(--color-main);
	border-radius: 0.5em;
	font-size: 0.9em;
}
.menu-title {
	font-size: 0.9em;
}
.menu-description {
	font-size: 0.8em;
}

@media(max-width: 1099px){
	.navbar-nav > .nav-item > .nav-link {
		font-size: 0.9em;
	}
	.dropdown-item {
		font-size: 1em;
	}
	.item_game_menu_wrap button {
		font-size: 0.9em;
	}
	.btn-see-all {
		font-size: 0.9em;
	}
	.menu-title {
		font-size: 0.85em;
	}
}
@media(max-width: 991px){
	.navbar-nav > .nav-home {
		padding-right: 0.6em;
	}
	.navbar-nav > .nav-item:not(.nav-home) > .nav-link {
		padding-left: 0.6em;
		padding-right: 0.6em;
	}
	.menu-description .btn-see-all {
		font-size: 1.2em;
	}
}

@media(max-width: 620px){
	.navbar-nav > .nav-home {
		display: none !important;
	}
}

/* desktop view */
@media all and (min-width: 576px) {
	.navbar .has-megamenu {
		position: static !important;
	}
	.navbar .megamenu {
		left: 0; 
		right: 0; 
		width: 100%; 
		margin-top: 0;
	}
	/*
	.nav-item.dropdown.open-onhover:hover .dropdown-menu {
        display: block;
    }
	*/
	.nav-link.no-chevron::after {
		display: none;
	}
	.item_game_menu_wrap {
		position: relative;
	}
	.item_game_menu_wrap a {
		display: table;
		margin: auto;
		position: relative;
		width: 100%;
	}
	.item_game_menu_wrap a:hover img {
		opacity: .65;
	}
	.item_game_menu_wrap .btn_wrapper {
		position: absolute;
		width: 100%;
		bottom: 1em;
		display: none;
	}
	.item_game_menu_wrap:hover .btn_wrapper {
		display: block;
	}
	.item_game_menu_wrap button {
		margin: auto;
		display: block;
		border: 0.1em solid var(--color-yellow-main);
		/*border-radius: 0.5em;*/
		border-radius: 3.125rem;
		background-color: var(--color-yellow-main);
		color: var(--color-light-black);
		-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .75) !important;
				box-shadow: 0 0 5px rgba(0, 0, 0, .75) !important;
	}
	.item_game_menu_wrap button:hover {
		/*
		color: var(--color-purple-light);
		*/
		border-color: var(--color-yellow-hover-main);
		background-color: var(--color-yellow-hover-main);
		color: var(--color-light-black);
	}
	.item_game_menu_wrap img {
		/*
		border: 0.3em solid var(--bs-orange);
		border-radius: 0.7em;
		*/
		border: .134rem solid var(--color-yellow-main);
		border-radius: 0.526rem;
		background-color: var(--bg-menu);
	}
}

/* mobile view */
@media(max-width: 767px){
	.item_game_menu_wrap a {
		display: table;
		margin: auto;
		position: relative;
		width: 100%;
	}
	.item_game_menu_wrap .btn_wrapper {
		position: absolute;
		width: 100%;
		bottom: 1em;
	}
	.item_game_menu_wrap .btn_wrapper button {
	  margin: auto;
	  display: block;
	}
	.item_game_menu_wrap button {
		margin: auto;
		display: block;
		border: 0.1em solid var(--color-yellow-main);
		/*border-radius: 0.5em;*/
		border-radius: 3.125rem;
		background-color: var(--color-yellow-main);
		color: var(--color-light-black);
		-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .75) !important;
				box-shadow: 0 0 5px rgba(0, 0, 0, .75) !important;
	}
	.item_game_menu_wrap button:hover {
		/*
		color: var(--color-purple-light);
		*/
		border-color: var(--color-yellow-hover-main);
		background-color: var(--color-yellow-hover-main);
		color: var(--color-light-black);
	}
	.item_game_menu_wrap img {
		/*
		border: 0.3em solid var(--bs-orange);
		border-radius: 0.7em;
		*/
		border: .188rem solid var(--color-yellow-main);
		border-radius: .625rem;
	}
	
	.navbar.fixed-top .navbar-collapse, 
	.navbar.sticky-top .navbar-collapse {
		overflow-y: auto;
		max-height: 90vh;
		margin-top:10px;
	}
	.nav-link.no-chevron::after {
		display: none;
	}
}

/*** MEGA MENU END ***/


/* Bootstrap Select */
.btn-select, 
.btn-select:focus,
.btn-select:hover {
	min-height: 34px;
	font-family: inherit;
	font-size: inherit;
	padding: .375rem .75rem;
	border-color: transparent !important;
	border-bottom: 1px solid var(--color-gray) !important;
	outline: none !important;
}

.btn-select.show,
.btn-select.show:focus, 
.btn-select.show:hover {
	border-color: transparent !important;
	border-bottom: 1px solid var(--color-gray) !important;
	outline: none !important;
}

.bootstrap-select .popover-header {
	background-color: var(--color-dark-gray);
	padding: .5rem .75rem;
	font-family: "BebasRegular";
	font-size: 1rem;
	color: var(--color-main);
	line-height: normal;
}

.bootstrap-select .popover-header .close {
	background-color: transparent;
	padding: 0;
	border: 0;
	-webkit-appearance: none;
	float: right;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-main);
	text-shadow: none;
	opacity: .5;
	margin-top: -3px;
}

.bootstrap-select .dropdown-menu {
	background-color: var(--bg-secondary);
	font-family: inherit;
	font-size: inherit;
	text-transform: inherit;
}

.bootstrap-select .dropdown-item {
	font-family: inherit;
	font-size: inherit;
	text-transform: inherit;
}

/* Bootstrap Select specific for promotion selector */

[data-id="promotionselector"], [data-id="promotionselector"]:hover, [data-id="promotionselector"]:active {
  padding-left: 12px;
  padding-right: 15px;
  background-color: transparent !important;
  border: none;
    border-top-color: currentcolor;
    border-right-color: currentcolor;
    border-bottom-width: medium;
    border-bottom-style: none;
    border-bottom-color: currentcolor;
    border-left-color: currentcolor;
  color: #ccc !important;
  border-bottom: 1px solid #666 !important;
}

[data-id="promotionselector"] + div.dropdown-menu {
  background-color: var(--bg-white-dark);
  padding-top: 4px;
  padding-bottom: 4px;
  width: 100%;
}

[data-id="promotionselector"] + div.dropdown-menu a {
  background-color: var(--bg-white-dark);
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  font-family: 'BebasRegular';
  font-size: 1.3em !important;
  color: #333;
  white-space: wrap;
  padding-left: 2.2em !important;
  position: relative;
}

[data-id="promotionselector"] + div.dropdown-menu ul > li + li > a {
  border-top: 1px solid #aaa !important;
}

[data-id="promotionselector"] + div.dropdown-menu a::before {
  content: "";
  position: absolute;
  width: 15px;
  height: 15px;
  left: 0.8em;
  border: 2px solid #888;
  border-radius: 15px;
  transition: background-color 0.2s ease;
  top: 0.65em;
}

[data-id="promotionselector"] + div.dropdown-menu a.selected::after {
  content: "";
  position: absolute;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  background-color: #000;
  left: 0.8em;
  top: 0.65em;
  border: 2px solid transparent;
  transition: background-color 0.2s ease;
  scale: 0.5;
}

@media (max-width: 767px) {
	.bootstrap-select .dropdown-item {
		padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x) !important;
		border: none !important;
	}
	[data-id="promotionselector"] + div.dropdown-menu a {
	  padding-top: 10px !important;
	  padding-bottom: 10px !important;
	}
	[data-id="promotionselector"] + div.dropdown-menu a::before {
	  top: 0.75em;
	}
	[data-id="promotionselector"] + div.dropdown-menu a.selected::after {
	  top: 0.75em;
	}
}

/* AFB88 PAGE */
.afbsport-iframe-wrap {
  height: 600px;
  display: block;
  margin-bottom: 50px;
}

/* FOOTER */
footer {
	/*color: var(--color-gray-light);*/
}
body:not(.homepage) footer {
	margin-top: 6em;
}
.footer-simple {
  border-top: 1px solid var(--color-gray);
}

@media(max-width: 575px) {
	footer {
		padding-bottom: 120px;
	}
}

.brand-description {
	font-family: "NunitoExtraLight", sans-serif;
	border-top: 1px solid var(--color-line-accent);
	font-size: 1em;
}
.our-mission {
	border-top: 1px solid var(--color-line-accent);
	position: relative;
}
.our-mission::after {
	position: absolute;
	content: "";
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--line-color);
	height: 3px;
}
.our-mission > .row > div + div {
	position: relative;
}
.our-mission > .row > div + div::before {
	content: "";
	position: absolute;
	left: 0px;
	top: 5em;
	bottom: 0;
	width: 1px;
	border-left: 1px solid var(--color-line-accent);
}
.spat-icon {
	float: left;
}
.spat-icon img {
	width: 2.6em !important;
	margin-top: 0.4em;
}
.spat-main {
	font-size: 1.6em;
	text-transform: uppercase;
	padding-left: 62px;
	color: var(--color-white-dark);
}
.spat-desc {
	padding-left: 4.4em;
	font-size: 0.9em;
}
.sub-page-aside-content {
	border-top: 1px solid var(--color-line-accent);
}

/* CARD PROGRESS ITEM */
.card-progress-item {
	display: table;
	width: 100%;
}
.cpi-title {
	float: left;
	text-transform: uppercase;
	font-size: 1.2em;
}
.cpi-desc {
	float: left;
	clear: left;
	font-size: 0.9em;
}
.cpi-time {
	float: right;
	margin-top: -0.8em;
	font-size: 2.5em;
	color: var(--color-white-dark);
}
.cpi-time span {
	font-size: 0.5em;
}
.cpi-progress {
	clear: both;
	height: 0.7em;
	background-color: var(--color-back-progress);
}
.cpi-progress .progress-bar {
	background-color: var(--color-front-progress);
}
.small-desc {
  font-size: 0.8em;
}

/* BANK */
.bank-items-container {
    /*max-width: 600px;*/
}
.bank-legends {
	font-size: 0.8em;
}
.bank-business-hour {
	font-size: 0.8em;
}
.bic-item img {
	filter: grayscale(1);
}
.bic-item,
.bic-legend {
	position: relative;
}
.bic-legend {
	color: var(--color-white-dark);
	font-size: 0.8em;
}
.bic-item::before,
.bic-legend::before {
	position: absolute;
	content: "";
	left: 4px;
	top: 0;
	bottom: 0;
	width: 3px;
	background-color: var(--color-gray-light);
	border-radius: 2px;
}
.bic-item.active img {
	filter: none;
}
.bic-item.active::before,
.bic-legend.active::before {
	background-color: var(--color-green);
}



.in-page .bank-items .row {
  display: grid;
  grid-template-columns: repeat(8,1fr);
  grid-auto-flow: dense;
}

@media(max-width: 991px) {
	.in-page .bank-items .row {
		grid-template-columns: repeat(5,1fr);
	}
}

@media(max-width: 575px) {
	.in-page .bank-items .row {
		grid-template-columns: repeat(4,1fr);
	}
}

@media(max-width: 480px) {
	.in-page .bank-items .row {
		grid-template-columns: repeat(3,1fr);
	}
}

.in-one-third .bank-items .row {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  grid-auto-flow: dense;
}

@media(max-width: 1199px) {
	.in-one-third .bank-items .row {
		grid-template-columns: repeat(3,1fr);
	}
}

@media(max-width: 991px) {
	.in-one-third .bank-items .row {
		grid-template-columns: repeat(2,1fr);
	}
}

@media(max-width: 767px) {
	.in-one-third .bank-items .row {
		grid-template-columns: repeat(4,1fr);
	}
}

@media(max-width: 640px) {
	.in-one-third .bank-items .row > div {
		margin-bottom: 10px !important;
	}
}

@media(max-width: 360px) {
	.in-one-third .bank-items .row {
		grid-template-columns: repeat(3,1fr);
	}
}


/* SIMPLE CARD */
.sctd-title {
	font-size: 1.2em;
	text-transform: uppercase;
}
.simple-card-title-desc > .sctd-item + .sctd-item {
  border-top: 1px solid var(--color-line-accent);
}
.sctd-desc {
  font-size: 0.9em;
}

/* SIMPLE CARD TITLE IMAGE */
.scti-title {
  font-size: 0.9em;
}
.scti-item img {
  height: 2.2em !important;
  width: auto !important;
  max-width: none;
}
.scti-contentcenter {
  text-align: center;
}
.scti-contentcenter img {
  margin: auto;
}
.scti-contentend {
  text-align: right;
}
.scti-contentend img {
  margin-left: auto;
  margin-right: 0;
}

@media(max-width: 1399px) {
	.spat-main {
	  font-size: 1em;
	}
	.spat-icon img {
	  width: 2.2em !important;
	  margin-top: 0.2em;
	}
	.cpi-title {
	  font-size: 1em;
	}
	.cpi-time {
		font-size: 2em;
	}
	.sctd-title {
	  font-size: 1em;
	}
}
@media(max-width: 991px) {
	.sub-page-aside-title {
	  min-height: 4.4em;
	}
	.cpi-desc {
	  font-size: 0.7em;
	}
	.play-browser {
	  text-align: center;
	}
	.play-browser img {
	  margin: auto;
	}
	.simple-card-title-image {
	  margin-top: 1.5em;
	}
	.logo-group {
	  margin-top: 2em !important;
	}
}
@media(max-width: 767px) {
	.sub-page-aside-title {
	  min-height: auto;
	}
	.our-mission > .row > div + div::before {
		display: none;
	}
	.our-mission > .row > div {
	  margin-top: 1em;
	}
	.bic-item::before, .bic-legend::before {
		width: 5px;
	}
}
@media(max-width: 767px) {
	
}
/* LOGO STACK IMAGE */
.logo-group {
  /*border: 1px solid var(--bg-secondary);*/
	background: linear-gradient(45deg, rgba(255,255,255,0.15) 0%,rgba(255,255,255,0.10) 100%);
	-webkit-box-shadow: inset 0 0.3125rem 0.3125rem rgba(255, 255, 255, .35);
			box-shadow: inset 0 0.3125rem 0.3125rem rgba(255, 255, 255, .35);
	position: relative;
  /*
  background-color: #cccccc;
  */
  border-radius: 5px;
}
.logo-group-content {
  display: table;
  text-align: center;
}
.lggr-item {
  display: inline-block;
}
.logo-group-content img {
  height: 45px !important;
  max-width: none;
  width: auto !important;
  filter: brightness(0) invert(0.8);
}
.logo-group-title {
  font-size: 0.9em;
  padding-left: 0.5em;
  padding-right: 0.5em;
  display: table;
  top: -0.8em;
  position: absolute;
  background-color: var(--bg-main);
}
@media(max-width: 480px) {
	.scti-item img {
	  height: 1.8em !important;
	}
}

/* COPYRIGHTS */
.copyright-footer-wrap {
  text-align: center;
  font-size: 12px;
}

/* BREADCRUMBS */
.breadcrumb-wrap {
  font-size: 0.85em;
}
.breadcrumb-item.active {
  color: var(--color-gray-light);
}
.breadcrumb-item a {
  color: var(--color-main-link);
}
.breadcrumb-item + .breadcrumb-item::before {
	color: var(--color-gray-light);
}

/* MAIN CONTENT OF PAGES */
body:not(.homepage) main {
  min-height: 600px;
}

/* INSIDE OF CONTENT & THE WRAPPER (INNER) */
.content-wrap h1,
.content-wrap h2,
.content-wrap h3,
.content-wrap h4,
.content-wrap h5,
.content-wrap h6 {
	margin-bottom: 1em;
}

.content-about_description {
  font-size: 0.8em;
}
.content-about_description h1,
.content-about_description h2,
.content-about_description h3,
.content-about_description h4,
.content-about_description h5,
.content-about_description h6 {
	margin-bottom: 1em;
	font-size: 1.4em;
}

/* CONTACTS AND SOCMEDS */
.floating-socmed {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  padding: 2em 5px 10px 7px;
  background: var(--color-accent-vertical);
  border-radius: 0 0.5em 0.5em 0;
  box-shadow: 0 0 10px rgb(0, 0, 0);
  z-index: 999;
}
.floating-socmed::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 2px;
  background-color: var(--color-border-accent);
  z-index: 1000;
}
.floating-socmed .contact-outer {
  margin-bottom: 0;
}
.close-flsocmed {
  position: absolute;
  top: 3px;
  font-size: 0.7em;
  border: 1px solid var(--color-gray-light);
  width: 1.5em;
  height: 1.5em;
  line-height: 1.3em;
  border-radius: 1em;
  text-align: center;
  color: var(--color-gray-light);
  right: 3px;
  cursor: pointer;
}
.contact-wrap, 
.contact-outer,
.floating-socmed {
  display: table;
}
.contact-outer {
	padding-left: 0;
	font-size: 1em;
}
.contact-outer li::marker {
	content: '';
}
.contact-outer li {
  display: table;
}
.contact-outer a {
  width: 2em;
  height: 2em;
  align-items: center;
  display: flex;
  justify-content: center;
  border-radius: 0.5em;
  background-color: transparent;
  border: 1px solid #00345e;
}
.contact-outer .fa {
	font-size: 1.2em;
	color: #00345e;
}
.contact-outer.display-vertical > li + li {
  margin-top: 0.6em;
}
.contact-outer.display-horizontal {
	display: table;
}
.contact-outer.display-horizontal > li {
	float: left;
}
.contact-outer.display-horizontal > li + li {
  margin-left: 0.6em;
}
.contact-outer a:hover {
	text-decoration: none;
	background-color: #00345e;
	border-color: #00345e;
	color: #a2bef4;
}

.contact-outer a:hover .fa {
	color: #a2bef4;
}

.about-us-wrap .contact-outer a {
	border: 1px solid var(--color-higlight-footer);
}

.about-us-wrap .contact-outer .fa {
	color: var(--color-higlight-footer);
}

.about-us-wrap .contact-outer a:hover {
	background-color: var(--color-higlight-footer);
	border-color: var(--color-higlight-footer);
	color: #00345e;
}

.about-us-wrap .contact-outer a:hover .fa {
	color: #00345e;
}

@media (max-width:991px) {
	.floating-socmed {
		font-size: 0.8em;
	}
	.close-flsocmed {
		font-size: 0.9em;
		line-height: 1.1em;
	}
}
@media (max-width:767px) {
	.floating-socmed {
		font-size: 0.7em;
		padding-top: 2.3em;
	}
	.close-flsocmed {
		line-height: 1.2em;
	}
}
@media (max-width:767px) {
	.floating-socmed {
		font-size: 0.6em;
	}
}

/* iframe */
iframe {
  border-radius: 0.5em;
}

/* Youtube Wrapper */
.youtubeVideoWrapper {
  justify-content: center;
  display: flex;
}

/* Center Wrap */
.center-wrap {
  background-color: var(--bg-wrap);
  border-radius: 0.5em;
  padding: 3em;
}
@media (max-width:767px) {
	.center-wrap {
	  padding: 1em;
	}
}

/* Conditional / Toggling / Switching */
/* header */
/*
header {
	display: none;
}
.frontend .frontend-header,
.backend .backend-header {
	display: block;
}
*/

/* in page body */
.subpage-title {
	position: relative;
	padding-left: 0.75em;
	color: var(--color-white-dark);
}
.subpage-title::before {
	content: "\f0da";
	font-family: "FontAwesome";
	position: absolute;
	left: 0;
	top: 0;
	font-size: 1.1em;
}
.subpage-title-hint {
  padding-left: 1.4em !important;
}

/* SPINNER/LOADER ICON */
#loading {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 10000;
	justify-content: center;
	display: flex;
	align-items: center;
	background-color: rgba(0,0,0,0.75);
	flex-direction: column;
	gap: 5px;
}
#loading .fa-spinner {
	color: #aaa;
}
#loading .text {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
}
@media (max-width:767px) {
	#loading .fa-spinner {
	  font-size: 2.5em;
	}
}
@media (max-width:767px) {
	#loading .fa-spinner {
	  font-size: 2em;
	}
}

/* TABS */
.nav-tabs {
	border-color: var(--color-inner-accent);
}

.nav-tabs .nav-link,
.nav-tabs .nav-link .fa {
	color: var(--color-main) !important;
}
.nav-tabs .nav-link:focus, 
.nav-tabs .nav-link:hover {
	border-color: var(--color-inner-accent);
}
.nav-tabs .nav-link.active {
	color: var(--color-text-accent) !important;
	background: var(--color-accent-horizontal);
	border-color: var(--color-inner-accent);
}
.nav-tabs .nav-link.active .fa {
  color: var(--color-text-accent) !important;
}
.nav-tabs .nav-link {
	text-decoration: none !important;
}
@media (max-width:991px) {
	.nav-tabs .nav-item {
	  width: 100% !important;
	}
	.nav-tabs .nav-item .nav-link {
	  border-radius: 10px;
	  margin-bottom: 5px;
	  text-align: center;
	}
}
@media (max-width:360px) {
	.nav-tabs .nav-item a {
	  font-size: 0.8em;
	  padding-left: 0.8em;
	  padding-right: 0.8em;
	}
	.nav-tabs .nav-item a .fa {
	  font-size: 1.6em !important;
	}
}

/* REGISTER */

.button-otp-verification {
	position: absolute;
	top: 0;
	right: calc(var(--bs-gutter-x) * .5);
}

.text-otp-verification, 
.phone-otp-verification {
	display: block;
}

.text-otp-verification {
	padding-top: 3px !important;
}

.phone-otp-verification {
	margin-top: 5px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.button-otp-verification #get-otp-code, 
#section-otp-kode #send-otp-code, 
.btn-get-otp-code, 
.btn-send-otp-code {
	width: 130px;
}

.img-flag-sm {
	width: 24px;
}

.get-secure-page {
	position: relative;
}

.get-secure-page form {
	position: relative;
	z-index: 2;
}

.get-secure-page::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	height: 70%;
	width: 50%;
	background-image: url(../../assets/images/icon/user-shield-solid.webp);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left bottom;
	opacity: .055;
	z-index: 1;
}

@media (max-width: 480px) {
	.phone-otp-verification {
		grid-template-columns: 1fr;
	}
}

/* OTP CHANGE EMAIL OR PHONE */
.button-on-side-form-field {
  position: absolute;
  top: 0;
  right: calc(var(--bs-gutter-x) * .5);
}

/* GOOGLE RECAPTCHA */
.grecaptcha-badge {
  display: none !important;
}

/* SUPPORT CHAT */
.custom-live-chat {
	display: table;
	position: fixed;
	z-index: 1100;
	bottom: 0;
	left: 0;
	font-size: 15px;
	width: 100%;
	padding: 1em;
	max-width: 26em;
}
.custom-live-chat.right {
	right: 0;
	left: auto;
	width: auto;
}
.custom-live-chat.goup {
	bottom: 7em;
}
.clc-button {
	display: block;
	cursor: pointer;
}
.clc-button:hover {
	text-decoration: none;
}
.clc-greet {
	font-size: 1.2em;
	text-decoration: none;
	position: absolute;
	bottom: 3em;
	width: 15em;
	line-height: 1.3em;
	color: #222;
	left: 0;
}
.custom-live-chat.right .clc-greet {
	right: 0;
	left: auto;
	text-align: right;
}
.clc-greet p {
	background-color: #fff;
	padding: 0.4em 1em;
	border-radius: 0.5em;
	position: relative;
}
.clc-greet p::after {
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	border-left: 0.6em solid transparent;
	border-right: 0.6em solid transparent;
	border-top: 0.6em solid #fff;
	bottom: -0.5em;
	left: 0.8em;
}
.clc-great-close {
	position: absolute;
	font-family: "Arial";
	display: table;
	right: 0.2em;
	top: 0.2em;
	color: #999;
	z-index: 100;
	font-size: 0.8em;
	line-height: 0.95em;
	padding: 0.1em;
	border-radius: 2em;
	border: 1px solid #999;
	text-align: center;
	width: 1.4em;
	height: 1.4em;
}
.custom-live-chat.right .clc-great-close {
	left: 0.2em;
	right: auto;
}
.custom-live-chat.right .clc-greet p::after {
	right: 0.8em;
	left: auto;
}
.clc-btnimg {
	position: relative;
}
.clc-btnstartchat {
	display: table;
	text-align: center;
	margin: auto;
	margin-top: auto;
	margin-bottom: auto;
	background-color: #fd5002;
	padding: 0.5em 1em;
	font-size: 0.9em;
	border-radius: 0.5em;
	margin-top: 0.3em;
	color: #fff;
	margin-bottom: 0.3em;
	line-height: 1em;
}
.clc-photo {
	position: absolute;
	width: 4em !important;
	border-radius: 2em;
	z-index: 10;
}
.custom-live-chat.right .clc-photo {
	right: 0;
	left: auto;
}
.clc-icon {
	height: 2.67em !important;
	border-radius: 0.67em;
	margin-left: 3.33em;
	margin-top: 0.67em;
	margin-bottom: 0.67em;
	width: auto !important;
}
.custom-live-chat.right .clc-icon {
	margin-right: 3.4em;
	margin-left: auto;
}

.clc-iframe {
	max-height: 40em;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 1000;
	padding: 1em;
	max-width: 25em;
	height: 0;
	width: 0;
	opacity: 0;
	
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.custom-live-chat.right .clc-iframe {
	left: auto;
	right: 0;
}
.clc-iframe.show {
	height: 100%;
	width: 100%;
	opacity: 1;
}

.clc-iframe iframe {
	height: 100%;
	width: 100%;
	background-color: #fff;
	border-radius: 10px;
}

.clc-minimize {
	font-family: "Arial";
	font-size: 0.8em;
	cursor: pointer;
	float: right;
	position: absolute;
	top: 0;
	right: 2em;
	background-color: #fff;
	line-height: 0.8em;
	padding: 0.22em 0.4em;
	color: #000;
	border-radius: 3px 3px 0 0;
}

.clc-notes {
	font-family: "Arial";
	font-size: 0.7em;
	padding-left: 6em;
	position: absolute;
	bottom: 0.5em;
	left: 0;
	margin-left: 1em;
	text-shadow: 1px 1px 4px #000;
	z-index: 100;
}

.custom-live-chat.right .clc-notes {
	margin-left: auto;
	left: auto;
	right: 0;
	margin-right: 1em;
	padding-left: 0;
	padding-right: 6em;
	text-align: right;
	width: 100%;
}

.clc-greet p, 
.custom-live-chat .clc-icon {
	-webkit-box-shadow: 0 0 .8em rgba(0, 0, 0, .45);
			box-shadow: 0 0 .8em rgba(0, 0, 0, .45);
}

@media (max-width: 991px) {
	.clc-btnimg {
		font-size: 0.8em;
	}
	.clc-notes {
		padding-left: 5em;
	}
	.custom-live-chat.right .clc-notes {
		padding-right: 5em;
	}
}
@media (max-width: 767px) {
	.clc-btnimg {
		font-size: 0.7em;
	}
	.clc-notes {
		padding-left: 4em;
		bottom: 0.3em;
	}
	.custom-live-chat.right .clc-notes {
		padding-right: 4em;
	}
}
@media (max-width: 480px) {
	.clc-btnimg {
		font-size: 0.6em;
	}
	.custom-live-chat.right .clc-notes {
		padding-right: 4em;
	}
}

/*
=========================================================
	CARD PROMOTION
=========================================================
*/

.main-content-promotion, 
.item-promotion, 
.card-promotion, 
.card-promotion .banner-promotion, 
.card-promotion .content-promotion, 
.card-promotion .desc-promotion, 
.card-promotion .title-promotion, 
.card-promotion .expired-promotion, 
.card-promotion .action-promotion, 
.card-promotion .detail-promotion, 
.card-promotion .section-promotion, 
.card-promotion .section-promotion .title-section-promotion, 
.card-promotion .section-promotion .body-section-promotion {
	float: left;
	width: 100%;
	position: relative;	
}

.sidemenu-wrap .list-group-item, 
.sidemenu-wrap .list-group-item-action:focus {
	background-color: #141414;
	border-color: var(--color-gray);
	color: var(--color-main);
}

.sidemenu-wrap .list-group-item-action:hover {
	color: #292929;
	background-color: var(--color-teal-fade);
	border-color: var(--color-teal-fade);	
}

.sidemenu-wrap .list-group-item.active {
	color: #292929;
	background-color: var(--color-teal-fade);
	border-color: var(--color-teal-fade);
}

.sidemenu-wrap .list-group-item.disabled, 
.sidemenu-wrap .list-group-item:disabled {
	color: var(--color-gray);
	background-color: var(--color-dark-gray);
}

.main-content-promotion > .item-promotion + .item-promotion {
	margin-top: 1rem;
}

.card-promotion {
	
} 

.card-promotion .banner-promotion {
	
}

.card-promotion .content-promotion {
	background-color: #141414;
	display: grid;
	column-gap: 1rem;
	grid-template-columns: repeat(2,auto);
	padding: .625rem 1rem;
	align-content: center;
	align-items: center;
}

.card-promotion .desc-promotion {
}

.card-promotion .title-promotion {
	
}

.card-promotion .title-promotion h4 {
	margin-bottom: 0;
}

.card-promotion .expired-promotion {
	font-size: .875rem;
	color: var(--color-teal-highlight);
}

.card-promotion .action-promotion {
	text-align: right;
}

.card-promotion .detail-promotion {
	background-color: #141414;
	padding: .625rem 1rem;	
}

.card-promotion .detail-promotion img {
	display: block;
	max-width: 100%;
}

.card-promotion .section-promotion {
	
}

.card-promotion .section-promotion .title-section-promotion {
	font-weight: 700;
} 

.card-promotion .section-promotion .body-section-promotion {
	
}

@media (max-width: 767px){
	.main-content-promotion {
		margin-top: 1rem;
	}
	
	.card-promotion .content-promotion {
		row-gap: 1rem;
		grid-template-columns: 1fr;
		justify-content: center;
		text-align: center;
	}

	.card-promotion .action-promotion {
		text-align: center;
		margin-bottom: 5px;
	}	
}

/*
.card-promotion, 
.inner-card-promotion, 
.card-promotion .title-promotion, 
.card-promotion .code-promotion,
.card-promotion .decs-promotion, 
.card-promotion .action-promotion, 
.card-promotion .section-promotion, 
.card-promotion .section-promotion .title-section-promotion, 
.card-promotion .section-promotion .body-section-promotion {
	float: left;
	width: 100%;
	position: relative;
}

.card-promotion {
	background: linear-gradient(to bottom,  rgba(113,23,106,1) 0%,rgba(212,185,210,0) 35%,rgba(255,255,255,0) 50%,rgba(212,185,210,0) 65%,rgba(113,23,106,1) 100%);
	padding: 0.125rem;
	margin-bottom: 1.5rem;
	
	-webkit-box-shadow: 0.1875rem 0.3125rem 0.4375rem rgba(0, 0, 0, .75);
			box-shadow: 0.1875rem 0.3125rem 0.4375rem rgba(0, 0, 0, .75);
}

.inner-card-promotion {
	background: var(--bg-main);
	padding: .7rem .7rem 1.5rem;
}

.card-promotion .title-promotion {
	/*
	min-height: 3.75rem;
	*/
	/*
	margin-bottom: 1rem;
	text-align: center;
}

.card-promotion .title-promotion h4 {
	text-align: center;
	margin-bottom: 0;
}

.card-promotion .code-promotion {
	text-align: center;
	padding-bottom: 1rem;
	margin-bottom: 1rem;
}

.card-promotion .code-promotion span {
	background-color: var(--nav-link-hover);
	color: #292929;
	font-weight: 700;
	padding: 0.125rem 0.4375rem;
	border-radius: 0.25rem;
}

.card-promotion .decs-promotion {
	min-height: 18.75rem;
	color: var(--color-white-dark);
	font-size: 0.875rem;
	text-align: left;
	padding-bottom: 1rem;
	margin-bottom: 1.5rem;
}

.card-promotion .section-promotion {
	
}

.card-promotion .section-promotion .title-section-promotion {
	font-weight: 700;
} 

.card-promotion .section-promotion .body-section-promotion {
	
}

.card-promotion .action-promotion {
	text-align: center;	
}
*/



/*
=========================================================
	FLOATING QR CODE DOWNLOAD
=========================================================
*/

.floating-content {
	position: fixed;
	right: -224px;
	top: 50%;
	display: inline-block;
	z-index: 999;
	border-radius: 7px 0 0 7px;
	
	-webkit-box-shadow: 0 2px 3px -1px #000;
	   -moz-box-shadow: 0 2px 3px -1px #000;
			box-shadow: 0 2px 3px -1px #000;
	
	-webkit-transform: translateY(-50%);
	   -moz-transform: translateY(-50%);
			transform: translateY(-50%);
			
    -webkit-transition: .5s ease-in-out;
	   -moz-transition: .5s ease-in-out;
			transition: .5s ease-in-out;
}

.floating-content .img-responsive {
	display: block;
    max-width: 100%;
    height: auto;	
}

.floating-content:hover {
	right: 0;
}

.floating-content:hover .bottom-icon {
	-webkit-transform: rotate(-180deg);
	   -moz-transform: rotate(-180deg);
			transform: rotate(-180deg);
}

.floating-content > div {
	float: left;
	position: relative;
	min-height: 196px;
}

.head-floating-content {
	background: linear-gradient(to bottom,  #8239d1 0%,#346dd4 100%);
	padding: 10px;
	padding-top: 35px;
	border-radius: 7px 0 0 7px;
	border-right: 3px solid #d50855;
	width: 44px;
	cursor: pointer;
	font-size: 1.1em;
	line-height: 1.3em;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
}

.head-floating-content .title {
	width: 21px;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	white-space: nowrap;
	
	-webkit-transform: rotate(180deg);
	   -moz-transform: rotate(180deg);
			transform: rotate(180deg);
}

.head-floating-content .bottom-icon {
    -webkit-transition: .5s ease-in-out;
	   -moz-transition: .5s ease-in-out;
			transition: .5s ease-in-out;
	margin-top: 0.2em;
}

.close-fldlapk {
  position: absolute;
  top: 1em;
  font-size: 0.6em;
  border: 1px solid white;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5em;
  border-radius: 1em;
  text-align: center;
}

.body-floating-content {
	background: linear-gradient(to bottom, #346dd4 0%,#04989c 100%);
	min-width: 224px;
	padding: 24px 10px;
	text-align: center;
	color: #fff;
}

.body-floating-content .body-title {
	background-color: transparent;
	padding: 0;
	font-size: 16px;
	line-height: 16px;
	margin-bottom: 10px;
}

.floating-content .body-floating-content .body-content a {
	display: table;
	margin: auto;
}

.floating-content .body-floating-content .body-content img {
	width: 110px !important;
	margin: auto;
	border-radius: 7px;
	border: 3px solid #8239d1;
	
    -webkit-transition: .3s ease-in-out;
	   -moz-transition: .3s ease-in-out;
			transition: .3s ease-in-out;
}

.floating-content .body-floating-content .body-content img:hover {
	-webkit-transform: scale(1.1);
	   -moz-transform: scale(1.1);
			transform: scale(1.1);
}

@media (max-width: 991px){
	.head-floating-content {
		font-size: 0.9em;
		line-height: 1.4em;
		width: auto;
		padding-left: 5px;
		padding-right: 5px;
		padding-top: 35px;
	}
	.body-floating-content {
	  padding: 12px 10px;
	}
	.body-floating-content .body-title {
		font-size: 0.9em;
	}
}

@media (max-width: 480px){
	.head-floating-content {
		padding-left: 3px;
		padding-right: 3px;
	}
	.floating-content {
		right: -184px;
	}

	.floating-content > div {
		min-height: 178px;
	}	
	
	.head-floating-content .bottom-icon {
		margin-top: 5px;
	}
	
	.body-floating-content {
		min-width: 184px;
		padding: 18px 10px;
	}
	
	.body-floating-content .body-title {
		font-size: 14px;
		line-height: 14px;
	}
	
	.floating-content .body-floating-content .body-content img {
		width: 100px !important;
	}
}


/*** PLAY FUN DEMO GAMES ***/

.fun-demo-games, 
.fun-demo-games .side-fun-demo-games, 
.fun-demo-games .title-side-fun-demo-games, 
.fun-demo-games .menu-side-fun-demo-games, 
.fun-demo-games .main-fun-demo-games, 
.fun-demo-games .maintenance-fun-demo-games, 
.fun-demo-games .title-fun-demo-games, 
.fun-demo-games .search-fun-demo-games, 
.fun-demo-games .content-fun-demo-games, 
.fun-demo-games .loadmore-fun-demo-games, 
.fun-demo-games .item-fun-demo-game, 
.fun-demo-games .inner-fun-demo-game, 
.fun-demo-games .item-fun-demo-game .content, 
.fun-demo-games .item-fun-demo-game .subtitle {
	float: left;
	width: 100%;
	position: relative;		
}

.fun-demo-games {
	padding: 2rem 0 3rem;
}

.fun-demo-games .side-fun-demo-games {
	
}

.fun-demo-games .title-side-fun-demo-games {
	font-family: 'BebasRegular';
	font-size: 2.375rem;
	color: var(--color-main);
	text-transform: uppercase;
	border-bottom: 2px solid var(--color-gray);
	padding-bottom: .313rem;
	margin-bottom: .625rem;
}

.fun-demo-games .menu-side-fun-demo-games {
	/*
	padding-left: .625rem;
	*/
	margin-bottom: 1.25rem;	
}

.fun-demo-games .menu-side-fun-demo-games ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.fun-demo-games .menu-side-fun-demo-games ul > li {
	
}

.fun-demo-games .menu-side-fun-demo-games ul > li + li {
	margin-top: .313rem;
}

/*
.fun-demo-games .menu-side-fun-demo-games ul > li > a {
	display: flex;
	font-family: 'PlayRegular';
	color: var(--color-main);
	text-decoration: none;
	text-transform: uppercase;
}
*/

.fun-demo-games .menu-side-fun-demo-games ul > li > a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background: var(--bg-wrap);
	border-radius: .5rem;
	padding: 5px;
	font-family: 'PlayRegular';
	font-size: 18px;
	color: var(--color-main);
	text-decoration: none;
	text-transform: uppercase;
	border: 1px solid var(--color-gray);
	min-height: 52px;
}

.fun-demo-games .menu-side-fun-demo-games ul > li > a:hover,
.fun-demo-games .menu-side-fun-demo-games ul > li > a:focus,
.fun-demo-games .menu-side-fun-demo-games ul > li.active > a, 
.fun-demo-games .menu-side-fun-demo-games ul > li.active > a:hover, 
.fun-demo-games .menu-side-fun-demo-games ul > li.active > a:focus {
	background: var(--color-accent-vertical);
	border: 1px solid var(--color-inner-accent);
}

.fun-demo-games .main-fun-demo-games {
	min-height: 650px;
}

.fun-demo-games .title-fun-demo-games {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	gap: 1rem;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
}

.fun-demo-games .title-fun-demo-games img {
	height: 3rem;
}

.fun-demo-games .title-fun-demo-games h1 {
	font-size: 2.5rem;
}

.fun-demo-games .search-fun-demo-games {
	margin-bottom: 1.5rem;
}

.fun-demo-games .search-fun-demo-games .input-group-text {
	background-color: #1b2a4d !important;
	border: var(--bs-border-width) solid var(--color-higlight-footer) !important;
	border-radius: var(--bs-border-radius-lg) !important;
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-right: none !important;
}

.fun-demo-games .search-fun-demo-games .form-control {
    background-color: #1b2a4d !important;
    border: var(--bs-border-width) solid var(--color-higlight-footer) !important;
    border-radius: var(--bs-border-radius-lg) !important;
    font-size: 1.25rem !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-left: 0 !important;
    margin-left: 0 !important;
	padding-left: 0 !important;
}

.fun-demo-games .search-fun-demo-games .form-control::placeholder {
	color: #848484;
}

.fun-demo-games .search-fun-demo-games .btn.dropdown-toggle, 
.fun-demo-games .search-fun-demo-games .btn.dropdown-toggle:focus, 
.fun-demo-games .search-fun-demo-games .btn.dropdown-toggle:hover {
	border-color: transparent;
}

.fun-demo-games .search-fun-demo-games .dropdown-item {
	color: var(--color-secondary);
}

.fun-demo-games .search-fun-demo-games .dropdown-item:focus, 
.fun-demo-games .search-fun-demo-games .dropdown-item:hover, 
.fun-demo-games .search-fun-demo-games .dropdown-item.active, 
.fun-demo-games .search-fun-demo-games .dropdown-item:active {
	background-color: var(--color-dark-gray);
	color: var(--color-cyan-main);	
}

.fun-demo-games .content-fun-demo-games {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	grid-column-gap: 0.625rem;
	grid-row-gap: 1rem;
	grid-auto-flow: dense;
	padding-bottom: 2rem;
	margin-bottom: 2rem;
	position: relative;
	min-height: 45px;
}

.fun-demo-games .content-fun-demo-games .loader, 
.fun-demo-games .content-fun-demo-games .no-results {
	height: 24px;
	position: absolute;
	left: 0;
	right: 0;
	text-align: center;
	color: var(--color-gray-light);
}

.fun-demo-games .item-fun-demo-game {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	background: linear-gradient(to bottom, #009eff 0%,rgba(212,185,210,0) 35%,rgba(255,255,255,0) 50%,rgba(212,185,210,0) 65%, #0267a6 100%);
	padding: 0.125rem;
	border-radius: 0.313rem;
}

.fun-demo-games .inner-fun-demo-game {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	background: transparent;
	border-radius: 0.125rem;
}

.fun-demo-games .item-fun-demo-game .content {
	
}

.fun-demo-games .item-fun-demo-game .content img {
	min-height: 88px;
}

.fun-demo-games .item-fun-demo-game .subtitle {
	padding: 0.188rem 0.313rem;	
}

.fun-demo-games .item-fun-demo-game .subtitle h5, 
.fun-demo-games .item-fun-demo-game .subtitle p, 
.fun-demo-games .item-fun-demo-game .play-fun-demo-game h5 {
	font-family: 'PlayRegular';
	text-overflow: ellipsis !important;
	overflow: hidden !important;
	white-space: nowrap !important;
	text-align: center;
}

.fun-demo-games .item-fun-demo-game .subtitle h5, 
.fun-demo-games .item-fun-demo-game .play-fun-demo-game h5 {
	font-size: .875rem;
	line-height: normal;
	color: var(--color-main);
}

.fun-demo-games .item-fun-demo-game .subtitle p {
	font-size: .5rem;
	margin-bottom: 0;
	color: var(--color-cyan-main);	
}

/* hot game */
.fun-demo-games .content-fun-demo-games .hot::before {
	content: 'HOT';
	position: absolute;
	top: 0.125rem;
	right: 0.125rem;
	background-color: var(--bs-red);
	font-size: 0.625rem;
	text-transform: uppercase;
	font-weight: 700;
	padding: 0 0.313rem;
	border-radius: 0;
	color: var(--color-main);
	z-index: 2;
}

.fun-demo-games .item-fun-demo-game:hover .content, 
.fun-demo-games .item-fun-demo-game:hover .subtitle {
	filter: blur(.313rem);
}

.fun-demo-games .item-fun-demo-game .play-fun-demo-game {
	display: none;
}

.fun-demo-games .item-fun-demo-game:hover .play-fun-demo-game {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 0.625rem;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
	border-radius: 0.125rem;
	/*backdrop-filter: blur(.313rem);*/
	background-color: rgba(255, 255, 255, 0.15);
}

.fun-demo-games .item-fun-demo-game .maintenance-fun-demo-game {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 0.625rem;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
	border-radius: 0.125rem;
	/*backdrop-filter: blur(.313rem);*/
	background-color: rgba(255, 255, 255, 0.55);	
}

.fun-demo-games .item-fun-demo-game .maintenance-fun-demo-game .icon-maintenance {
	margin-bottom: 3px;
}

.fun-demo-games .item-fun-demo-game .maintenance-fun-demo-game .icon-maintenance img {
	width: 75px;
}

.fun-demo-games .item-fun-demo-game .maintenance-fun-demo-game .text-maintenance .btn {
	font-size: 14px;
	background: linear-gradient(to bottom, #e86400 0%,#fedf26 100%);
	border-width: 0;
	color: #111;
	padding: 0.1275rem 1rem;
}

.btn-play-game, 
.btn-play-game:focus {
	transform: skewX(-20deg);
	border-radius: 4px;
	background: linear-gradient(135deg, #E33750 0%, #D4AF37 100%);
	border: 1px solid #D4AF37 !important;
	color: #571f22 !important;
	box-shadow: 2px 3px 0px #571f22, 0 -1px 15px rgba(252, 233, 45, .45 ) !important;
}

.btn-play-game:hover {
	background: linear-gradient(135deg, #6C002F 0%,#A67C00 100%);
	color: #E7D5A9 !important;
}

.btn-play-game span {
	transform: skewX(20deg);
	display: flex;
}

.btn-play {
	width: 3.125rem;
	height: 3.125rem;
	font-size: 1.875rem;
	padding: .313rem .938rem;
	border-radius: 3.125rem;
	text-align: center;
	display: flex;
	align-content: center;
	align-items: center;
	text-align: center;
}

.btn-trans,
.btn-trans:focus {
	background-color: transparent;
	border-color: var(--color-main);
	color: var(--color-main);
}

.btn-trans:hover {
	background-color: var(--color-main);
	color: var(--color-dark-gray);
}

.fun-demo-games .item-fun-demo-game .play-fun-demo-game > * + * {
	margin-top: .75rem;
}

.fun-demo-games .item-fun-demo-game .play-fun-demo-game h5 {
	width: 100%;
	padding: 0 0.625rem;
}

.fun-demo-games .loadmore-fun-demo-games {
	text-align: center;
}

/* SWIPER MENU GAMES */
.swiper-menu-games, 
.swiper-menu-games .swiper-container {
	float: left;
	width: 100%;
	position: relative; 
}

.swiper-menu-games .swiper-container {
	max-width: 100%;
	margin-bottom: 20px;
	padding: 10px 0;
	overflow: hidden;
}

.swiper-menu-games .swiper-slide {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	width: auto;
	max-width: 190px;
	min-width: 190px;
	height: auto;
	max-height: 65px;
	min-height: 65px;
}

.swiper-menu-games .swiper-slide > a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background: var(--bg-wrap);
	border-radius: .5rem;
	padding: 10px;
	font-size: 16px;
	color: var(--color-main);
	border: 1px solid var(--color-gray);
	text-decoration: none;
}

.swiper-menu-games .swiper-slide > a:hover, 
.swiper-menu-games .swiper-slide > a:focus,
.swiper-menu-games .swiper-slide > a.active {
	background: var(--color-accent-vertical);
	border: 1px solid var(--color-inner-accent);
}

.swiper-menu-games .swiper-slide > a > img {
	height: 41px;
	width: auto;
}

.swiper-menu-games .swiper-slide > a > img.glx-play {
	height: 18px;
}

.swiper-menu-games .swiper-slide > a > img.pgsoft, 
.swiper-menu-games .swiper-slide > a > img.pgsoft-color {
	height: 30px;
}

.swiper-menu-games .swiper-slide > a.maintenance {
	background-color: rgba(196, 196, 196, 0.35);
	cursor: not-allowed;
}

.swiper-menu-games .swiper-slide > a.maintenance::before {
	content: '';
	background-image: url(../images/icon/icon-robot-maintenance.webp);
	position: absolute;
	height: 120%;
	width: 40%;
	z-index: 4;
	background-size: 100%;
	background-repeat: no-repeat;
	left: -10px;
}

.swiper-menu-games .swiper-slide > a.maintenance::after {
	content: 'Pemeliharaan';
	position: absolute;
	left: 30%;
	display: flex;
	background: linear-gradient(to bottom,  #e86400 0%,#fedf26 100%);
	border-radius: .3rem;
	padding: 0 10px;
	font-size: 16px;
	color: #111;
	font-weight: bold;
	line-height: normal;
	opacity: 1;
}

.swiper-menu-games .swiper-slide > a.maintenance > img {
	/*filter: blur(.313rem);*/
}

.swiper-menu-games .swiper-button-next, .swiper-menu-games .swiper-button-prev {
	color: #f9f9f9;
	opacity: 0;
	transition: opacity 0.3s ease;
	background-color: var(--color-gray-light);
	width: 35px;
	height: 35px;
	font-size: 20px;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-content: center;
	text-align: center;
	border: 1px solid #f9f9f9;
	margin-top: -17px;
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .75);
			box-shadow: 0 0 10px rgba(0, 0, 0, .75);
}

.swiper-menu-games .swiper-button-next::after, 
.swiper-menu-games .swiper-button-prev::after {
	font-size: 20px;
	font-weight: 700;
}

.swiper-menu-games .swiper-container:hover .swiper-button-next,
.swiper-menu-games .swiper-container:hover .swiper-button-prev {
	opacity: .95;
}

.swiper-menu-games .swiper-button-next.swiper-button-disabled,
.swiper-menu-games .swiper-button-prev.swiper-button-disabled {
	display: none;
}

/* PROVIDER MENU GAMES */
.provider-menu-games, 
.main-provider-menu-games, 
.main-provider-menu-games .item-provider, 
.seeall-menu-provider-games {
	float: left;
	width: 100%;
	position: relative; 	
}

.provider-menu-games {
	margin-bottom: 20px;
	padding: 10px 0;
}

.main-provider-menu-games {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-column-gap: 10px;
	grid-row-gap: 10px;
}

.main-provider-menu-games .item-provider {
	position: relative;
	min-height: 56px;
	max-height: 56px;
}

.main-provider-menu-games .item-provider > a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background: var(--bg-wrap);
	border-radius: .5rem;
	padding: 10px;
	font-size: 16px;
	color: var(--color-main);
	border: 1px solid var(--color-gray);
	text-decoration: none;
}

.main-provider-menu-games .item-provider > a:hover, 
.main-provider-menu-games .item-provider > a:focus,
.main-provider-menu-games .item-provider > a.active {
	background: var(--color-accent-vertical);
	border: 1px solid var(--color-inner-accent);
}

.main-provider-menu-games .item-provider > a > img {
	height: 34px;
	width: auto;
}

.main-provider-menu-games .item-provider > a > img.glx-play {
	height: 18px;
}

.main-provider-menu-games .item-provider > a > img.pgsoft, 
.main-provider-menu-games .item-provider > a > img.pgsoft-color {
	height: 24px;
}

.main-provider-menu-games.expanded::after {
  display: none;
}

.seeall-menu-provider-games {
	text-align: center;
}

.seeall-menu-provider-games .btn {
	padding: 0;
	border: none !important;
	font-size: 0.875rem;
}

.seeall-menu-provider-games .btn:hover {
	color: var(--color-cyan-main);	
} 
.seeall-menu-provider-games .btn:focus {

}

.seeall-menu-provider-games .ico-button {
	margin-right: 5px;
}

.main-provider-menu-games .item-provider > a.maintenance {
	background-color: rgba(196, 196, 196, 0.35);
	cursor: not-allowed;
}

.main-provider-menu-games .item-provider > a.maintenance::before {
	content: '';
	background-image: url(../images/icon/icon-robot-maintenance.webp);
	position: absolute;
	height: 115%;
	width: 35%;
	z-index: 4;
	background-size: 100%;
	background-repeat: no-repeat;
	left: -5px;
}

.main-provider-menu-games .item-provider > a.maintenance::after {
	content: 'Pemeliharaan';
	position: absolute;
	left: 30%;
	display: flex;
	background: linear-gradient(to bottom,  #e86400 0%,#fedf26 100%);
	border-radius: .3rem;
	padding: 0 10px;
	font-size: 14px;
	color: #111;
	font-weight: bold;
	line-height: normal;
	opacity: 1;
}

.main-provider-menu-games .item-provider > a.maintenance > img {
	/*filter: blur(.313rem);*/
}

@media(min-width: 481px) {
	.main-provider-menu-games {
		height: auto !important;
	}
	.seeall-menu-provider-games {
		display: none;
	}
}

@media(max-width: 1199px) {
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(6, 1fr);	
	}
	
	.main-provider-menu-games .item-provider > a.maintenance::before {
		left: -5px;
	}
	
	.main-provider-menu-games .item-provider > a.maintenance::after {
		padding: 0 5px;
		left: 25%;
	}
}

@media(max-width: 991px) {
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(4, 1fr);	
	}
	
	.swiper-menu-games .swiper-slide {
		max-width: 150px;
		min-width: 150px;
		max-height: 50px;
		min-height: 50px;
	}
	
	.swiper-menu-games .swiper-slide > a > img {
		height: 35px;
	}
	
	.swiper-menu-games .swiper-slide > a > img.pgsoft, 
	.swiper-menu-games .swiper-slide > a > img.pgsoft-color {
		height: 25px;
	}
	
	.swiper-menu-games .swiper-slide > a.maintenance::after {
		left: 27%;
		padding: 0 5px;
		font-size: 14px;
	}
	
	.main-provider-menu-games {
		grid-template-columns: repeat(3, 1fr);
	}
	
	.main-provider-menu-games .item-provider {
		min-height: 50px;
		max-height: 50px;
	}
	
	.main-provider-menu-games .item-provider > a {
		padding: 7px;
	}
	
	.main-provider-menu-games .item-provider > a > img {
		height: 30px;
	}
	
	.main-provider-menu-games .item-provider > a > img.pgsoft, 
	.main-provider-menu-games .item-provider > a > img.pgsoft-color {
		height: 20px;
	}
	
	.main-provider-menu-games .item-provider > a > img.glx-play {
		height: 14px;
	}
	
	.main-provider-menu-games .item-provider > a.maintenance::after {
		left: 27%;
		padding: 0 5px;
		font-size: 14px;
	}
}

@media(max-width: 767px) {
	.fun-demo-games .menu-side-fun-demo-games {
		padding-left: 0;
	}
	
	.fun-demo-games .menu-side-fun-demo-games ul {
		display: grid;
		align-items: center;
		justify-content: space-between;
		grid-template-columns: repeat(3, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 5px;		
	}
	
	.fun-demo-games .menu-side-fun-demo-games ul > li + li {
		margin-top: 0;
	}
	
	.fun-demo-games .menu-side-fun-demo-games ul > li > a {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		background: var(--bg-wrap);
		border-radius: .5rem;
		padding: 5px;
		font-size: 16px;
		color: var(--color-main);
		border: 1px solid var(--color-gray);
		text-decoration: none;
		min-height: 50px;
	}
	
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(3, 1fr);	
	}
	
	.fun-demo-games .item-fun-demo-game .content img {
		min-height: 115px;
	}
	
	.fun-demo-games .search-fun-demo-games .dropdown-item {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
		padding-top: 7px !important;
		padding-bottom: 7px !important;
		border-top: none;
	}
}

@media(max-width: 575px) {
	.main-provider-menu-games .item-provider > a.maintenance::after {
		font-size: 12px;
	}
}

@media(max-width: 480px) {
	.fun-demo-games .menu-side-fun-demo-games ul {
		grid-template-columns: repeat(2, 1fr);			
	}
	
	.fun-demo-games .menu-side-fun-demo-games ul > li > a {
		min-height: 42px;
	}
	
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(2, 1fr);	
	}
	
	.swiper-menu-games .swiper-button-next, .swiper-menu-games .swiper-button-prev {
		opacity: .95;
	}
	
	.fun-demo-games .item-fun-demo-game .content img {
		min-height: 111px;
	}
	
	.main-provider-menu-games {
		grid-template-columns: repeat(2, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 5px;
	}
	
	.main-provider-menu-games .item-provider {
		min-height: 42px;
		max-height: 42px;
	}
	
	.main-provider-menu-games .item-provider > a {
		padding: 5px;
	}
	
	.main-provider-menu-games .item-provider:last-child {
		/* grid-column: span 2; */
		justify-self: center;
		width: 50%;
		grid-column: 1 / -1;
	}
	
	.main-provider-menu-games {
		height: 120px;
		overflow: hidden;
	}
	
	.main-provider-menu-games::after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 30px;
		background: linear-gradient(to bottom, rgba(20,20,20,0) 0%,var(--bg-main) 100%);
	}
	
	.main-provider-menu-games .item-provider > a.maintenance::before {
		left: 2%;
		height: 45px;
		width: 45px;
	}
}

@media(max-width: 360px) {
	.fun-demo-games .item-fun-demo-game .content img {
		min-height: 92px;
	}	
}

/* COLLAPSIBLE CONTENT */
.collapsible-content {
	position: relative;
}

.collapsible-content .collapsible-text {
	position: relative;
	height: 3rem;
	overflow: hidden;
}

.collapsible-content .collapsible-text::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	background: linear-gradient(to bottom, rgba(20,20,20,0) 0%,var(--bg-wrap) 100%);
}

.collapsible-text.expanded::after {
  display: none;
}

.collapsible-content .collapsible-action {
	text-align: center;
	margin-top: -.625rem;
}

.collapsible-content .collapsible-action .btn {
	padding: 0;
	border: none !important;
}

.collapsible-content .collapsible-action .btn:hover {
	color: var(--color-cyan-main);	
} 
.collapsible-content .collapsible-action .btn:focus {

}

.collapsible-content .collapsible-action .btn > span {
	display: block;
}

.collapsible-content .collapsible-action .btn > span.ico-button {
	font-size: 1.313rem;
}

.collapsible-content .collapsible-action .btn > span.txt-button {
	font-size: 0.875rem;
	margin-top: .2rem;
}

@media(max-width: 767px) {
	.collapsible-content .collapsible-action .btn > span.ico-button {
		font-size:  0.875rem;
	}

	.collapsible-content .collapsible-action .btn > span.txt-button {
		font-size: 0.75rem;
		margin-top: .15rem;
	}	
}

/* MODAL */

.modal-content {
	color: var(--color-light-black);
}
.subtitle-modalform {
  background-color: #004567;
  padding-top: 0.2em;
  padding-bottom: 0.2em;
}
.modal-body-section + .modal-body-section {
  margin-top: 1em;
}

/* DEPOSIT FORM */
.bank-destination-card {
  max-width: 400px;
}
.card-text.repeater-wrapper > div + div {
	border-top: 1px solid #fff;
}

.bankqrcode {
	max-width: 160px;
	position: relative;
}
.download-bankqrcode {
	/*vertical-align: bottom;*/
	display: block;
}
.bankqrcode::before {
  position: absolute;
  content: "sedang loading gambar. tunggu...";
  left: 0;
  width: 160px;
  font-size: 0.8em;
  top: -10px;
  color: #222;
  background-color: #fff;
  line-height: 1em;
  padding: 5px 10px;
  border-radius: 5px;
  box-sizing: border-box;
}

li.no-bullet {
  list-style-type: none;
}

/* CARD PROMO */
.promo-info-card .card-title {
	background-color: var(--color-purple-light-hover);
}

.promo-info-card .card-text {
	background-color: var(--color-purple-light);
}

/* GAMES ICON */
.game-maintenance {
  position: relative !important;
}

.game-maintenance::after {
  position: absolute;
  background-color: rgba(255,0,0,0.5);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: url("../images/icon/maintenance-game.webp");
  background-size: cover;
  content: "";
  background-position: center;
}

/* RECEIPT IMAGE */
#preview-image-receipt,
#preview-image-upload {
	max-width: 280px;
	width: 100%;
}

/* REFERRAL TABLE */
.about-referral h1,
.about-referral h2,
.about-referral h3,
.about-referral h4,
.about-referral h5,
.about-referral h6 {
	margin-bottom: 0.6em;
}
.about-referral ul {
	padding-left: 1em;
}
.member-referral-comm-table-wrap {
	float: left;
	margin-right: 1.5em;
	width: 40%;
}
#member-referral-comm-table {
  color: var(--table-striped-color);
  margin-bottom: 0.5em;
}

@media(max-width: 767px) {
	.member-referral-comm-table-wrap {
	  float: none;
	  margin-right: 0;
	  width: 100%;
	  margin-bottom: 1em;
	}
}

/* MESSAGE */
.unread-message {
  position: relative;
  display: inline;
  margin-right: 20px;
}
.unread-message::before {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  left: 0;
  top: 5px;
  background-color: rgb(26, 179, 28);
  border-radius: 10px;
}

.caption-image {
	font-size: 0.9em;
	text-align: center;
}

/* transaction table */
#get_detail_transaction {
	color: #397ee3;
}

/**********************
MENU SIDEBAR
***********************/

.login-sidebar {
}

@media(max-width: 767px) {
	.dropdown-menu.megamenu {
		padding-top: 0;
	}
	.dropdown-menu.megamenu .row {
		margin-top: 0 !important;
		margin-left: -25px;
		margin-right: -23px;
	}
	.dropdown-menu.megamenu .row > div {
		width: 50%;
	}
	.login-sidebar .login-header {
		float: none;
		padding-top: 0;
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 15px;
	}
	.login-sidebar .btn-google {
	  width: 100%;
	}
	.login-sidebar .or-separator {
	  margin-top: 0 !important;
	  margin-bottom: 0 !important;
	}
	.login-sidebar .or-separator::before,
	.login-sidebar .or-separator::after {
		width: 30%;
	}
	
	.login-sidebar #passwordHelp a {
		color: #bebebe;
	}
}

/*
.copyttc {
  left: 405px;
  position: absolute;
  top: 0;
  height: 100%;
}
*/
#form_transfer_confirm #toAcc {

}
@media(max-width: 500px) {
	/*
	.copyttc {
		position: absolute;
		left: auto;
		right: 0;
		border-bottom: transparent !important;
	}
	*/
	#form_transfer_confirm #toAcc {

	}
}

/* swal sweetalert */
.swal2-popup .swal2-actions {
  font-size: 0.8em;
}
.swal2-popup {
  background-color: var(--color-teal-highlight) !important;
  box-shadow: 1px 1px 110px rgba(126, 195, 222, 0.61);
}
.swal2-popup .swal2-close {
  color: #3289d6 !important;
}
.swal2-popup .swal2-styled:focus {
	outline: none !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	-ms-box-shadow: none !important;
	-0-box-shadow: none !important;
	box-shadow: none !important;
}
.swal2-container.swal2-shown {
  background-color: rgba(0, 0, 0, 0.8) !important;
}
.swal2-popup .swal2-styled.swal2-cancel {
  background-color: #60a0a2 !important;
}

/* buttons */
@media (max-width: 575px) {
	#form_login .btn-in-form,
	#form_register .btn-in-form{
	  width: 100%;
	  font-size: 1.2em;
	  padding-left: 0;
	  padding-right: 0;
	  padding-top: 0.6em;
		padding-bottom: 0.6em;
	}
	.offer-register-forgotpassword > div,
	.offer-login-inregisterform > div {
	  text-align: center !important;
	}
	#AgreeTOS + label {
		width: 88%;
	}
}


/* BACK BUTTON MOBILE */
.back-header {
  display: flex;
  align-items: center;
  padding: 14px 10px 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  text-transform: uppercase;
  background-color: #242424;
}

.back-header .back-button {
  display: flex;
  align-items: center;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.8em;
  width: 100%;
  color: #bbbbbb;
  line-height: 2em;
}

.back-header .back-button svg {
  margin-right: 8px;
  stroke: #bbbbbb;
  width: 14px;
  height: 14px;
  position: relative;
  top: -0.01em;
}

.back-header .back-button:hover {
  color: #cccccc;
}

.back-header .back-button:hover svg {
  stroke: #cccccc;
}

.text-with-icon {
  position: relative !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  background-color: #945a00;
  display: table;
}
.twi-icon {
  position: absolute;
  left: 15px;
  top: 8px;
}
.twi-icon img {
  width: 20px;
}
.twi-desc {
  color: #fff;
  padding-left: 30px;
  line-height: 1.4em;
}

/*** MOBILE BOTTOM MENU ***/

.mobile-bottom-menu {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: var(--bg-menu-secondary);
	z-index: 9999;
	padding: 5px 0;
	box-shadow: 0px 1px 10px rgba(255, 255, 255, .335);
}

.mobile-bottom-menu.second-pos {
  bottom: 4em;
  padding-top: 2px;
}
.mobile-bottom-menu.second-pos a {
  border-radius: 8px;
  color: #111111;
  font-size: 1em;
}
.mobile-bottom-menu.second-pos a:hover {
  color: #131313;
}
.mobile-bottom-menu.second-pos a.active {
  background-color: var(--color-purple-light);
  border-color: var(--color-purple-light);
  color: #111;
}


.main-bottom-menu {
	display: flex;
	justify-content: center;
	align-items: center;
}

.nav-bottom-menu {
	width: 100%; 
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.nav-item-bottom {
	flex: 1;
	text-align: center;
}

.nav-item-bottom a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: var(--color-main);
	font-size: 12px;
	text-decoration: none;
}

.nav-item-bottom a:hover, 
.nav-item-bottom a.active, 
.nav-item-bottom a.active:hover {
	color: var(--color-yellow-main);
	/*text-shadow: 0 0 5px rgba(246, 29, 230, .75);*/
}

.nav-item-bottom .ico {
	width: 24px;
	height: 24px;
	margin-bottom: 5px;
}

.nav-item-bottom .ico img {
	width: 100%;
	height: auto;
}

.nav-item-bottom .text {
	font-size: 11px;
	white-space: nowrap;
}

.nav-bottom-menu .nav-item-bottom.center-item {

}

.nav-bottom-menu .nav-item-bottom.center-item .ico {
	background-color: var(--bg-menu-secondary);
	padding: 2px;
	border-radius: 50%;
	margin-bottom: 5px;
	transform: scale(2.5) translateY(-4px);
}

.bottom-menu-popover {
	/*transform: translate3d(103px, -90px, 0px) !important;*/
	bottom: 35px !important;
	z-index: 9999;
}

.bottom-menu-popover .popover-header {
	background-color: var(--color-inner-accent);
	color: var(--color-text-accent);
}

.bottom-menu-popover .popover-body {
	background-color: var(--bg-menu-secondary);
	padding-top: .5rem;
	padding-bottom: .5rem;
}

.bottom-menu-popover .popover-body a {
	display: block;
	color: var(--color-main);
	font-size: 14px;
	text-transform: uppercase;
	text-decoration: none;
}

.bottom-menu-popover .popover-body a + a {
	margin-top: .125rem;
}

.bottom-menu-popover .popover-body a:hover {
	font-weight: 700;
}

.bottom-menu-popover .popover-arrow {
	
}

.bottom-menu-popover .popover-arrow::before, 
.bottom-menu-popover .popover-arrow::after {
	border-top-color: var(--bg-menu-secondary) !important;
}

/** bottom-menu-popover **/
/*
.bottom-menu-popover .popover-header {
	background-color: var(--color-gold-border);
}
*/

/** Live Chat support buttom menu **/

#live-chat-box {
	display: none;
	position: fixed;
	right: 15px;
	bottom: 50px;
	width: 80%;
	max-width: 400px;
	height: 60%;
	max-height: 400px;
	background: transparent;
	/*box-shadow: 0 0 10px rgba(0,0,0,0.2);*/
	z-index: 9999;
	overflow: hidden;
}

#live-chat-header {
	text-align: right;
}

#live-chat-content {
	height: 100%;
	overflow: hidden;
}

#live-chat-content iframe {
	border-radius: 0;
}

.close-live-chat-box {
	background: var(--bg-secondary);
	border: none !important;
	font-size: 11px;
	text-transform: uppercase;
	line-height: normal;
	color: var(--color-main);
	cursor: pointer;
	padding: 3px 10px 0;
	transform: translateY(3px);
}

.live-chat-dekstop {
	position: fixed;
	bottom: 0;
	right: 15px;
	background-color: #CE1D1D;
	border-radius: 4px 4px 0px 0px;
	box-shadow: rgba(0, 0, 0, 0.125) 0px 0.362176px 0.941657px -1px,rgba(0, 0, 0, 0.18) 0px 3px 7.8px -2px;
	z-index: 9999;
}

.live-chat-dekstop a {
	color: #fff;
	font-size: 14px;
	font-family: 'GothamBold';
	text-decoration: none;
	padding: 7px 15px;
	display: flex;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	gap: 50px;
}

.live-chat-dekstop svg {
	height: 21px;
}

@media(max-width: 575px) {
	/* adjust to offcanvas */
	#offcanvasNavbar .navbar-nav {
		padding-bottom: 4rem;
	}
	
	#live-chat-box {
		bottom: 90px;
	}
}

/*** Realtime Feed DP WD ***/

.realtime-latest-dpwd {
	background: none !important;
	height: 180px;
	max-height: 180px;
	padding: 10px;
	border: 1px solid var(--color-line-accent);
	border-radius: 4px;
	overflow: hidden;
}

.realtime-latest-dpwd .list-latest-dpwd {
	list-style: none;
	padding: 0;
	margin: 0;
}

.realtime-latest-dpwd .list-latest-dpwd > .item-latest-dpwd {
	background-color: var(--color-dark-gray);
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: space-between;
	border: 1px solid var(--color-line-accent);
	padding: 3px 7px;
	border-radius: 4px;
}

.realtime-latest-dpwd .list-latest-dpwd > .item-latest-dpwd + .item-latest-dpwd {
	margin-top: 7px;
}

.realtime-latest-dpwd .latest-player {
	font-size: 12px;
}

.realtime-latest-dpwd .latest-amount {
	font-size: 12px;
	color: var(--color-red-main);
}

.fixed-latest-dpwd {
	position: fixed;
	bottom: 15px;
	left: -100%;
	background: var(--color-accent-horizontal);
	font-size: 14px;
	color: var(--color-main);
	padding: 5px 15px;
	border: 2px solid var(--color-inner-accent);
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .75);
	z-index: 9;
	transition: left 0.5s ease;
}

.fixed-latest-dpwd .highlight {
	color: #00345e;
}

@media(max-width: 575px) {
	.fixed-latest-dpwd {
		bottom: 90px;
		font-size: 11px;
		padding: 5px 10px 3px;
		border: 1px solid var(--color-inner-accent);
		border-radius: 5px;
	}
}

/*** iFrame Game ***/

body.on-play-game {
	margin: 0;
	padding: 0;
	background: #0d0d0d;
	font-family: "NunitoLight", sans-serif;
	font-size: 16px;
	color: #f9f9f9;
	min-width: 320px;
	overflow-x: hidden;
}

.iframe-container {
	width: 100%;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--bg-main);
}

#iframeGames {
	width: 100% !important;
	height: 100% !important;
	border: none !important;
	border-radius: 0 !important;
}

#iframeGames {
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}
#iframeGames.show {
	opacity: 1;
}

body.on-apk .iframe-container {
	height: calc(100vh - 50px) !important;
}

/*** TOP Download Android ***/

.top-download-apk {
	background-color: var(--color-dark-gray);
	padding: .5rem 0;
	min-width: 320px;
}

.top-download-apk .container {
	overflow: unset;
}

.top-download-apk .main-download-apk {
	display: grid;
	grid-template-columns: fit-content(100%) auto fit-content(100%);
	gap: 10px;
	position: relative;
}

.top-download-apk .main-download-apk > div {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
}

.top-download-apk .content-download-apk > p {
	margin-bottom: 0;
}

.top-download-apk .logo-download-apk img {
	width: 45px;
}

.top-download-apk .close-download-apk {
	display: flex;
	width: 20px;
	height: 20px;
	justify-content: center;
	align-content: center;
	align-items: center;
	align-self: flex-end;
	margin-top: -10px;
	margin-bottom: 5px;
	color: var(--color-gray-light);
}

@media(max-width: 360px) {
	.top-download-apk .logo-download-apk img {
		width: 35px;
	}

	.top-download-apk .content-download-apk {
		font-size: 13px;
	}
	
	.top-download-apk .action-download-apk .btn {
		font-size: 13px;
		padding: 2px 15px;
	}
	
	.top-download-apk .close-download-apk {
		margin-top: -5px;
		margin-bottom: 0px;
	}
}

.download-android-wrap {
	width: 75%;
}

@media(max-width: 991px) {
	.download-android-wrap {
		width: 100%;
	}
}

/*** Page Access Restricted ***/

html#restricted,
html#restricted body,
html#restricted main {
	height: 100%;
}
html#restricted main {
	min-height: auto;
}

.access_restricted_wrap {
  max-width: 600px;
}

/** Maintenance Popup **/
/* Overlay gelap */
#maintenance-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
	z-index: 9998;
}

#maintenance-overlay-page {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9998;
	background: linear-gradient(
      rgba(0, 0, 0, 0.5),   /* hitam transparan */
      rgba(0, 0, 0, 0.5)
    ),
    url('../images/bg/under-maintenance-web.webp?v=2');
	background-size: cover;
	background-position: center;
}

/* Popup box */
#maintenance-popup {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #fff;
	padding: 20px 30px;
	border-radius: 10px;
	box-shadow: 0 5px 15px rgba(0,0,0,0.3);
	z-index: 9999;
	max-width: 400px;
	text-align: center;
	font-family: Arial, sans-serif;
	color: #444;
}

#maintenance-popup h2 {
	margin-top: 0;
	color: #d9534f;
}

#maintenance-popup p {
	margin: 15px 0;
	line-height: 1.4;
	color: 
}

#maintenance-popup button {
	padding: 8px 16px;
	background-color: #5cb85c;
	color: #fff;
	border: none;
	border-radius: 5px;
	cursor: pointer;
}

#maintenance-popup button:hover {
	background-color: #4cae4c;
}
@media(max-width: 767px) {
	#maintenance-popup {
		left: 10%;
		right: 10%;
		transform: translate(0, -50%);
		max-width: auto;
	}
}
@media(max-width: 560px) {
	#maintenance-popup {
		left: 5%;
		right: 5%;
		transform: translate(0, -50%);
		max-width: auto;
	}
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-adaptedbrand.css?v=1.0.1 */
/* bunker/assets/images/bg */

/* /bunker/assets/css */

/*#abcb2c, #a1c428, #1ff61f, #01371f*/



body {

	background-image: url(../images/bg/bg-main-astro.webp?v=1);

	background-size: contain;

	background-position: bottom center;

	background-repeat: no-repeat;

	background-color: var(--bg-main);

}



body.page-peraturan, 

body.loggedin {



}





header {

	background-image: url(../images/bg/bg-header.webp?v=1);

	background-size: cover;

	background-position: center;

	background-repeat: no-repeat;

	background-color: var(--bg-main);

}

body.page-peraturan header  {

	background-size: cover;

}



@media(min-width: 1400px) {

	body.page-peraturan {

		background-size: cover;

		background-position: top center;

	}

}



@media(max-width: 991px) {

	body {

		background-size: 1024px;

	}

	

	header {

		background-size: cover;

	}

}



@media(max-width: 767px) {

	body.page-peraturan {

		background-size: cover;

	}	

}

/*

.form-wrap {

	background-image: url(../images/bg/bg-wrap.webp);

	background-position: center bottom;

	background-size: contain;

	background-repeat: repeat-x;

}

*/

.form-wrap, 

.center-wrap {

	background-image: url(../images/bg/bg-wrap.webp);

	background-position: right bottom;

	background-size: 100%;

	background-repeat: no-repeat;

}

body:not(.homepage) .about-us-wrap {

	margin-top: 3rem;

}

.menu-header {

	background: var(--bg-menu);

}

.bg-offcanvas {

	backdrop-filter: unset;

	box-shadow: none !important;

	background: var(--bg-menu) !important;

}

.bg-offcanvas.show {

	background: var(--bg-menu-secondary) !important;

}

@media(max-width: 767px) {

.bg-offcanvas {

	background: var(--bg-menu-secondary) !important;

}	

}



.login-header .input-group-text {

	border-radius: 3px;

}



.running-news.running-news-front, 

.running-news.running-news-back {

  background-color: var(--bg-running-text);

}

.running-news .form-control {

  background-color: var(--bg-transparent);

  border-bottom: none;

}

.running-news i {

	color: var(--color-higlight-footer);

	font-weight: bold;

}

.running-news .input-group-text {

	border-bottom: none;

}

.running-news .input-group-text::after {

	color: var(--color-higlight-footer);

}



.form-floating .form-control {

	background-color: transparent;

}



.btn-in-form, 

.btn-in-form:focus {

	background: var(--color-rosegold-ver) !important;

	color: var(--color-rosegold-text) !important;

	border-color: var(--color-gold-border) !important;

}



.btn-in-form:hover {

	background: var(--color-rosegold-ver-hover) !important;

	color: var(--color-campagne) !important;

	border-color: var(--color-gold-border-hover) !important;

}



.alert-info a,

.alert-warning a,

.alert-danger a,

.alert-primary a {

  color: var(--color-cool-blue);

}



.loggedin .btn-top-deposit-wrap button,

.loggedin .btn-top-withdraw-wrap button,

.loggedin .btn-top-download-wrap button {

	background: linear-gradient(to bottom, #5fcb41 0%,#2f5723 100%);

	border-color: #5fcb41;

	color: var(--color-light-black);

}



.loggedin .btn-top-keluar-wrap button {

	background: linear-gradient(to bottom, #e00201 0%,#7d0402 100%);

	color: var(--color-main) !important;

	border-color: #e00201;	

}



.navbar-nav > .nav-home > .nav-link:focus, .navbar-nav > .nav-home > .nav-link:hover, .navbar-nav > .nav-home > .nav-link.active {

  /*background-color: var(--color-green-main);*/

  background: var(--color-yellow-main);

  color: var(--color-dark-gray);

}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {

  color: var(--color-yellow-main);

}



.input-group-text {

	background-color: #1e2c75;

	color: #a9a9a9;

}



.realtime-latest-dpwd .list-latest-dpwd > .item-latest-dpwd {

	background-color: rgba(0, 0, 0, .135);

}



.realtime-latest-dpwd .latest-amount {

	color: var(--color-higlight-footer);

}



.card-promotion .content-promotion {

	background-color: var(--bg-wrap);

}



.card-promotion .detail-promotion {

	background-color: var(--bg-wrap);

}



.card-promotion .expired-promotion {

	color: var(--color-yellow-main);

}



.sidemenu-wrap .list-group-item, 

.sidemenu-wrap .list-group-item-action:focus {

	background-color: var(--bg-wrap);

}



.sidemenu-wrap .list-group-item.active, 

.sidemenu-wrap .list-group-item.active:hover {

	color: var(--color-text-accent);

	background: var(--color-accent-vertical);

	border-color: var(--color-inner-accent);

}



.sidemenu-wrap .list-group-item-action:hover {

	color: var(--color-text-accent);

	background: var(--color-accent-vertical);

	border-color: var(--color-gray);

}



.subtitle-modalform {

	background-color: var(--color-red-hover-main);

}



.subtitle-modalform h4 {

	color: var(--color-main) !important;

}



#modal-see-bank-business-hour .modal-footer .btn, 

#modal-see-bank-business-hour .modal-footer .btn:focus {

	background: linear-gradient(to bottom, #1e75f6 0%,#0e376b 100%) !important;

	color: var(--color-main) !important;

	border-color: #1e75f6 !important;	

}



#modal-see-bank-business-hour .modal-footer .btn:hover {

	background: linear-gradient(to bottom, #1e75f6 0%,#1e75f6 100%) !important;

	color: var(--color-main) !important;

	border-color: #1e75f6 !important;

}



.card-title.no-hl, #form_selectbank_transfer .card-title {

	background-color: var(--color-outer-accent) !important;

}



.card-text.no-hl, #form_selectbank_transfer .card-text {

	background-color: var(--bg-main) !important;

}



#form_selectbank_transfer .card-tab-content .tab-pane > div {

	background-color: var(--bg-wrap) !important;

	border: 1px solid var(--bg-wrap) !important;

}



#form_selectbank_transfer .card-nav-tabs {

	border-color: var(--color-inner-accent) !important;

}



#form_selectbank_transfer .card-nav-tabs .nav-link.active:focus, 

#form_selectbank_transfer .card-nav-tabs .nav-link.active:hover, 

#form_selectbank_transfer .card-nav-tabs .nav-link.active {

	background: var(--color-accent-vertical);

	border-color: var(--color-inner-accent);

}



#form_selectbank_transfer .nav-tabs .nav-item .nav-link:not(.active) {

	border: 1px solid var(--color-inner-accent) !important;

}



#adminBankTabContent .tab-pane .radio-item > .row {

	border-left: 1px solid var(--color-gray) !important;

}



.search-fun-demo-games-wrapper {

	position: relative;

	overflow: hidden;

	background: var(--bg-main);

	border-radius: 12px;

	height: 52px;

	margin-left: -2px;

	margin-right: -2px;

	transition-property: opacity, visibility, translate;

	transition-duration: 0.3s;

}



.search-fun-demo-games-wrapper-inner {

	position: absolute;

	top: 2px;

	width: calc(100% - 5px);

	height: calc(100% - 5px);

	left: 2px;

	border-radius: 10px;

	z-index: 1;

	background: var(--bg-main);

	display: flex;

	flex-direction: column;

}



.search-fun-demo-games-wrapper::after {

  content: "";

  position: absolute;

  transform-origin: 50%;

  background: radial-gradient(

    var(--color-yellow-main),

    var(--bg-main) 100%,

    transparent 50%

  );

  width: 300px;

  height: 100px;

  transform: rotate(0deg);

  -moz-mask-image: linear-gradient(

    90deg,

    transparent,

    #000 20%,

    #000 80%,

    transparent

  );

  -webkit-mask-image: linear-gradient(90deg, #0000, var(--bg-main) 20%, var(--bg-main) 80%, #0000);

  mask-image: linear-gradient(90deg, #0000, var(--bg-main) 20%, var(--bg-main) 80%, #0000);

  offset-path: rect(0 auto 100% auto);

  animation: 4.5s linear infinite glow-move both;

}



@keyframes glow-move {

  0% {

    offset-distance: 0%;

    opacity: 1;

  }

  10% {

    opacity: 1;

  }

  40% {

    opacity: 1;

  }

  60% {

    opacity: 1;

  }

  100% {

    opacity: 1;

    offset-distance: 100%;

  }

}



.swal2-popup {

	background-color: var(--color-inner-accent) !important;

	box-shadow: 1px 1px 110px rgba(126, 173, 222, 0.61);

}



.swal2-popup .swal2-styled.swal2-confirm, 

.swal2-popup .swal2-styled.swal2-confirm:focus {

	background: var(--color-outer-accent) !important;

	color: var(--color-main) !important;

	border-color: var(--color-border-accent) !important;		

}



.swal2-popup .swal2-styled.swal2-confirm:hover {

	background: var(--color-text-accent) !important;

	color: #a2bef4 !important;

	border-color: var(--color-border-accent) !important;

}



.swal2-popup .swal2-title, 

.swal2-popup .swal2-content {

	color: var(--color-text-accent) !important;

}



 .spat-icon img {

	-webkit-filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(358deg) brightness(1108%) contrast(103%);

			filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(358deg) brightness(1108%) contrast(103%);

 }

 

 .header-back .peak-menu nav {

	background-color: rgba(0, 0, 0, 0.48);

	border-radius: 5px;

 }

 

  /*** ITEM GAME MENU WITH DETAILS ***/ 

.navbar .megamenu {

	background: var(--bg-menu-secondary);

	border-radius: 0 0 0.6em 0.6em;

	border-top: none;

}



.navbar .bg-offcanvas.show .megamenu {

	background: var(--bg-menu-secondary);

}



.navbar .megamenu.hot_game, 

.navbar .megamenu.slot {

	background-image: url(../images/content/astronot.webp);

	background-size: 320px;

	background-position: bottom right;

	background-repeat: no-repeat;

}



.navbar .bg-offcanvas.show .megamenu.hot_game, 

.navbar .bg-offcanvas.show .megamenu.slot {

	background-image: none;

}



@media(min-width: 1400px) {

	.navbar .megamenu.hot_game, 

	.navbar .megamenu.slot {

		background-position: bottom;

	}

}



.item_game_menu_wrap.with_details {

	/*overflow: hidden;*/

	background: rgba(0, 0, 0, 0.33);

	border-radius: 5px;

	padding: 10px;

}



.item_game_menu_wrap.with_details a {

	display: grid !important;

	grid-template-columns: 1fr 1.2fr;

	gap: 10px;

	align-items: center;

	text-decoration: none !important;

}



.item_game_menu_wrap.with_details .item_game_image {

	min-width: 1px;

}



.item_game_menu_wrap.with_details .item_game_image img {

	background: none !important;

	border: none;

	border-radius: 5px;

}



.item_game_menu_wrap.with_details a:hover .item_game_image img {

	opacity: 1;

}



.item_game_menu_wrap.with_details .item_game_content {

	min-width: 1px;

	overflow: hidden;  

 }



.item_game_menu_wrap.with_details .item_game_content h5, 

.item_game_menu_wrap.with_details .item_game_content p {

	display: block;

	font-family: 'PlayRegular';

	text-overflow: ellipsis !important;

	overflow: hidden !important;

	white-space: nowrap !important;

	text-align: center;

}



.item_game_menu_wrap.with_details .item_game_content h5 {

	font-size: .875rem;

	line-height: normal;

	color: var(--color-main);

	margin-bottom: 5px;

}



.item_game_menu_wrap.with_details .item_game_content p {

	font-size: .625rem;

	margin-bottom: 0;

	color: var(--color-cyan-main);

	background: rgba(0, 0, 0, 0.53);

	display: table;

	margin: auto;

	border-radius: 30px;

	padding: 0 10px;

}



.item_game_menu_wrap.with_details .btn_wrapper {

	position: absolute !important;

	width: 100% !important;

	top: 0 !important;

	bottom: 0 !important;

}



.item_game_menu_wrap.with_details:hover .item_game_image, 

.item_game_menu_wrap.with_details:hover .item_game_content {

	filter: blur(.313rem);

}



body:not(.loggedin) .item_game_menu_wrap.with_details .btn_wrapper button {

	display: none;

}



body:not(.loggedin) .item_game_menu_wrap.with_details:hover .btn_wrapper button {

	display: block;

}



.item_game_menu_wrap.with_details:hover .btn_wrapper {

	display: flex;

	justify-content: center;

	align-content: center;

	align-items: center;

	border-radius: 5px;

	/*backdrop-filter: blur(.313rem);*/

	background-color: rgba(255, 255, 255, 0.15);	

}



.see-all-games {

	/* border-top: 1px solid var(--color-gray-light); */

	padding-top: 1.2rem;

	position: relative;

}



.see-all-games .btn {

	border-radius: 50px !important;

	background: var(--color-rosegold-ver);

	color: var(--color-rosegold-text);

	border-color: var(--color-gold-border);

}



.see-all-games .btn:hover {

	background: var(--color-rosegold-ver-hover);

	color: var(--color-campagne);

	border-color: var(--color-gold-border-hover);

}



@media (max-width: 575px) {

	.navbar .megamenu.hot_game, 

	.navbar .megamenu.slot {

		background-image: none;

	}

	

	.item_game_menu_wrap.with_details a {

		grid-template-columns: 1fr;

		gap: 0;

	}

	

	.item_game_menu_wrap.with_details .item_game_content {

		display: none;

	}

	

	body:not(.loggedin) .item_game_menu_wrap.with_details .btn_wrapper button {

		display: block;

	}

	

	.item_game_menu_wrap.with_details .btn_wrapper {

		top: unset !important;

		bottom: 1rem !important;

		display: flex;

		background-color: transparent;

	}

	

	.item_game_menu_wrap.with_details:hover .btn_wrapper {

		background-color: transparent;

	}

	

	.item_game_menu_wrap.with_details:hover .item_game_image, 

	.item_game_menu_wrap.with_details:hover .item_game_content {

		filter: unset;

	}

}







 /** FOR VERIFICATION OAUTH PURPOSE, HIDE WHEN DONE **/

.about-us-home, 

.content-about-us-home {

	float: left;

	width: 100%;

	position: relative;

}



.about-us-home {

	margin-bottom: 5rem;

}



.content-about-us-home {

	padding: 2rem 0;

}



.content-about-us-home h1, 

.content-about-us-home p {

	text-align: center;

}



.content-about-us-home h1 {

	color: var(--color-yellow-main);

	margin-bottom: 1rem;

}



.content-about-us-home p {

	font-size: 1.1rem;

}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-FORMINBODY.css?v=1.0.1 */
/* FORM LAYOUT */
.forminbody *::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #444444 !important;
}
.forminbody *:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #444444 !important;
   opacity:  1;
}
.forminbody *::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #444444 !important;
   opacity:  1;
}
.forminbody *:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #444444 !important;
}
.forminbody *::-ms-input-placeholder { /* Microsoft Edge */
   color:    #444444 !important;
}
.forminbody *::placeholder { /* Most modern browsers support this now. */
   color:    #444444 !important;
}

/* Regular Form */

.form-wrap {
	background-color: var(--bg-wrap);
	border-radius: 0.5em;
	padding: 3em;
}
.form-wrap .form-control {
  background-color: transparent;
}
.form-39-format .col-form-label {
  position: relative;
  /*bottom: -0.3em;*/
}
.forminbody .form-group {
  margin-bottom: 0.3em;
}
.form-text.text-muted {
  color: var(--color-gray-light) !important;
}
.form-text {
  margin-top: 0 !important;
  position: relative;
  font-size: 0.8em;
  padding: 0 .75rem;
}
.input-group-image {
  padding-top: 0.5em;
}
.btn-in-form {
  border-radius: 0.2em;
}
.custom-control-input[type="checkbox"] {
  position: relative;
  top: 0.3em;
  float: left;
}
.custom-control-label {
  width: 90%;
  margin-left: 1em;
}
.form-control[readonly],
.form-control[readonly]:focus {
	background-color: transparent;
	color: var(--color-white-darker);
	border-color: inherit;
}

select.form-control + .input-group-text .fa-caret-down {
	font-size: 1.2em;
}
select.form-control + .input-group-text {
	padding-left: 0.9em;
	padding-right: 0.9em;
}

@media (max-width:575px) {
	.form-wrap {
	  padding: 1em;
	}
}
@media (max-width:360px) {
	.input-group-image img {
		width: 130px;
	}
}

.fa-eye,
.fa-eye-slash,
.securimage-img {
	cursor: pointer;
}

.securimage-wrap {
    position: relative;
}
.securimage-wrap .fa-refresh {
	margin-left: -1.2em;
	font-size: 1.2em;
	cursor: pointer;
	position: absolute;
}

.mandatorysign {
  color: #fe3535;
  font-size: 0.8em;
  position: relative;
  top: -0.2em;
}

/* FORM VALIDATION */
.invalid-feedback {
  font-size: 0.7em;
  padding: 0 1em;
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-FORMFLOATINGINBODY.css?v=1.0.1 */
/*
--- Form Floating ---
*/

.form-control {
	background-color: var(--bg-main);
	font-size: 0.875rem;
	color: var(--color-main);
	border: none;
	border-bottom: 1px solid var(--color-gray);
	border-radius: 0;
	/*
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	*/
	-webkit-box-shadow: none !important;
			box-shadow: none !important;
}

.form-control:focus {
	background-color: #0c1526;
	color: var(--color-main);
	border-color: var(--color-yellow-main);
	outline: 0;
	/*
	-webkit-box-shadow: 0 0 0 0.30rem rgba(81, 56, 238, 0.25);
			box-shadow: 0 0 0 0.30rem rgba(81, 56, 238, 0.25);	
	*/
	
	-webkit-box-shadow: none !important;
			box-shadow: none !important;
}

.form-floating > .form-control,
.form-floating > .form-control-plaintext,
.form-floating > .form-select {
	height: calc(2rem + calc(var(--bs-border-width) * 2));
	min-height: calc(2rem + calc(var(--bs-border-width) * 2));
}

.form-floating > label {
	color: var(--color-gray);
	font-size: 0.875rem;
}

.form-floating > .form-control, 
.form-floating > .form-control-plaintext, 
.form-floating > .form-select, 
.form-floating > label {
	padding: .375rem .75rem;
}

.form-floating > .form-control:not(:-moz-placeholder-shown), .form-floating > .form-control-plaintext:not(:-moz-placeholder-shown) {
	padding-top: 0.75rem;
	padding-bottom: 0.35rem;
}

.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) {
	padding-top: 0.75rem !important;
	padding-bottom: 0.35rem !important;
	height: 1.8rem;
}

.form-floating > .form-control:focus {
	background-color: var(--bg-transparent);
	border-bottom: 1px solid var(--color-yellow-main);
}

.form-floating > .form-control:-webkit-autofill,
.form-floating > .form-control-plaintext:-webkit-autofill {
	padding-top: 0.75rem;
	padding-bottom: 0.35rem;
}

.form-floating > .form-select {
	padding-top: 0.75rem;
	padding-bottom: 0.35rem;
}

.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label,
.form-floating > .form-select ~ label {
	color: var(--color-gray);
	transform: scale(.65) translateY(-.5rem) translateX(.15rem);
}

.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after,
.form-floating > .form-select ~ label::after {
	background-color: var(--bg-transparent);
}

.input-group-text {
	background-color: #1e2c75;
	color: #848484;
	border: none;
	border-bottom: 1px solid var(--color-gray);
	border-radius: 0;
}

#form_transfer_confirm .input-group-text  {
    color: #cccccc;
}

.form-floating-sm > label {
	font-size: 0.75rem;
}

.form-floating-sm > .form-control,
.form-floating-sm > .form-control-plaintext,
.form-floating-sm > .form-select {
	height: calc(1.563rem + calc(var(--bs-border-width) * 2));
	min-height: calc(1.563rem + calc(var(--bs-border-width) * 2));
}

.form-floating-sm > .form-control, 
.form-floating-sm > .form-control-plaintext, 
.form-floating-sm > .form-select, 
.form-floating-sm > label {
	padding: .275rem .35rem;
}

.form-floating-sm > .form-control:focus ~ label,
.form-floating-sm > .form-control:not(:placeholder-shown) ~ label,
.form-floating-sm > .form-control-plaintext ~ label,
.form-floating-sm > .form-select ~ label {
	transform: scale(.7) translateY(-.5rem) translateX(.15rem);
}

.input-group-text-sm {
	font-size: 0.75rem;
	padding: .275rem .35rem;
}
.password-eye-form-floating {
	position: absolute;
	right: 0;
	top: 0;
	color: var(--color-gray);
}
.form-control.with-eye.is-invalid, 
.was-validated .form-control.with-eye:invalid {
	background-position: right 1.5em center;
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-OWLCAROUSEL.css?v=1.0.1 */
/*PENTING BUAT BUG DARI OWL*/

.owl-carousel .owl-stage, 
.owl-carousel.owl-drag .owl-item{
    -ms-touch-action: auto !important;
        touch-action: auto !important;
}
button.owl-next, 
button.owl-prev {
	background-color: rgba(0,0,0,0.3) !important;
}

/*
--- OWL CAROUSEL Point ---
*/

.sa_owl_theme .owl-dots {
	padding: 0 !important;
}

.sa_owl_theme .owl-dots .owl-dot span {
	background-color: var(--color-gray-light) !important;
	
	-webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, .35);
			box-shadow: 2px 2px 2px rgba(0, 0, 0, .35);
}

.sa_owl_theme .owl-dots .active span {
	background-color: var(--color-yellow-main) !important;
	border-color: var(--color-yellow-main) !important;
}

.sa_owl_theme .owl-dots .owl-dot span:hover {
	background-color: var(--color-yellow-main) !important;
	border-color: var(--color-yellow-main) !important;
}

.sa_owl_theme .owl-nav button.owl-prev, 
.sa_owl_theme .owl-nav button.owl-next {
	color: var(--color-main);
}

.sa_owl_theme .owl-nav button.owl-prev:hover, 
.sa_owl_theme .owl-nav button.owl-next:hover {
	color: var(--color-yellow-main);
}

/*** GAMES - OWL CAROUSEL SLIDER FOR GAMES SLIDER ***/

.main-games, 
.main-games .title-games, 
.main-games .content-games, 
.main-games .item-game, 
.main-games .inner-game, 
.main-games .icon-game, 
.main-games .detail-game, 
.main-games .title-game, 
.main-games .subtitle-game {
	float: left;
	width: 100%;
	position: relative;	
}

.main-games {
	background-image: url('../images/bg/bg-games.webp?v2');
	background-size: cover;
	background-position: bottom center;
	background-repeat: no-repeat;
	padding: var(--padding-section);
	z-index: -1;
} 

.main-games .title-games {
	display: flex;
	justify-content: start;
	align-items: center;
	padding-left: 25%;
}

.main-games .title-games h1 {
	font-size: 2rem;
}

.main-games .content-games {
	margin-top: 1rem;
}

#main_games.sa_owl_theme .owl-stage-outer {	
	-webkit-transform: skewX(-7deg);
			transform: skewX(-7deg);
}

#main_games.sa_owl_theme .owl-nav button.owl-prev, 
#main_games.sa_owl_theme .owl-nav button.owl-next {
	font-size: 2rem;
	color: var(--color-secondary);
	margin-top: -3rem !important;
}

#main_games.sa_owl_theme .owl-nav button.owl-prev {
	left: -2.5rem;
} 

#main_games.sa_owl_theme .owl-nav button.owl-next {
	right: -2.5rem;
}

#main_games.sa_owl_theme .owl-nav button.owl-prev:hover, 
#main_games.sa_owl_theme .owl-nav button.owl-next:hover {
	color: var(--color-red-hover-main);
}

.main-games .item-game {
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%, var(--color-teal-highlight) 100%);
	padding: 0.125rem;
	margin-bottom: 2rem;
	
	-webkit-box-shadow: 0.1875rem 0.3125rem 0.4375rem rgba(0, 0, 0, .75);
			box-shadow: 0.1875rem 0.3125rem 0.4375rem rgba(0, 0, 0, .75);	
}

.main-games .item-game a {
	display: table;
}

.main-games .inner-game {

}

.main-games .icon-game {
	overflow: hidden;
}

.main-games .icon-game img {
	-webkit-transform: scale(1.1);
			transform: scale(1.1);
			
	-webkit-transition: transform .3s ease-in-out;
			transition: transform .3s ease-in-out;
}

.main-games .item-game a:hover .icon-game img {
	-webkit-transform: scale(1);
			transform: scale(1);	
}

.main-games .detail-game {
	background: #000;
	text-align: center;
	padding: .7rem .7rem 1.5rem;
}

.main-games .title-game {
	-webkit-transform: skewX(7deg);
			transform: skewX(7deg);		
}

.main-games .title-game h3 {
	font-family: 'PlayBold';
	font-size: 1rem;
	color: var(--color-main);
	text-transform: uppercase;
}

.main-games .subtitle-game {
	font-family: 'PlayRegular';
	font-size: .875rem;
	color: var(--color-red-hover-main);
	
	-webkit-transform: skewX(7deg);
			transform: skewX(7deg);		
}

@media(max-width: 1199px) {
	.main-games .title-game {
		min-height: 2.6em;
	}
}

@media(max-width: 767px) {
	.owl-prev {
		margin-left: 0.3em;
	}
	.owl-next {
		margin-right: 0.3em;
	}
	
	#main_games.sa_owl_theme .owl-nav button.owl-prev {
		left: -1rem;
	} 

	#main_games.sa_owl_theme .owl-nav button.owl-next {
		right: -1rem;
	}
}
@media(max-width: 575px) {
	.main-games .content-games {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
		float: none;
		margin-top: 0;
	}
	.main-games .title-games {
		padding: 0;
		text-align: center;
		justify-content: center;
		margin-bottom: 1em;
	}
	.main-games .title-game {
		min-height: unset;
		height: 2.6em;
		overflow: hidden;
	}
	.main-games .title-games > * {
		font-size: 1.6em !important;
	}
}
@media(max-width: 530px) {
	.main-games .subtitle-game {
		min-height: 3em;
	}
}
@media(max-width: 480px) {
	.main-games .subtitle-game {
		min-height: unset;
	}
}
@media(max-width: 340px) {
	.main-games .subtitle-game {
		min-height: 3em;
	}
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-DATERANGEPICKER.css?v=1.0.1 */
.daterangepicker .ranges {
  color: var(--color-dark-gray);
}
.daterangepicker .calendar-table td {
	color: var(--color-dark-gray);
}
.daterangepicker td.active, .daterangepicker td.active:hover {
  color: var(--color-dark-gray);
}
.daterangepicker .btn-default {
	background-color: var(--color-gray-light);
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-DATERANGEPICKER.css?v=1.0.1 */
.daterangepicker .ranges {
  color: var(--color-dark-gray);
}
.daterangepicker .calendar-table td {
	color: var(--color-dark-gray);
}
.daterangepicker td.active, .daterangepicker td.active:hover {
  color: var(--color-dark-gray);
}
.daterangepicker .btn-default {
	background-color: var(--color-gray-light);
}
/* https://webgalaxytangkas.com/bunker/assets/css/theme-TOGEL.css?v=1.0.1 */
.dg-container{
	width: 100%;
	height: auto;
	position: relative;
	display: table;
}

.dg-wrapper{
	width: 660px;
	min-height: 180px;
	margin: 0 auto;
	position: relative;
	border-radius: 5px;
	
	-webkit-transform-style: preserve-3d;
	   -moz-transform-style: preserve-3d;
		 -o-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
			transform-style: preserve-3d;
	
	-webkit-perspective: 1000px;
	   -moz-perspective: 1000px;
		 -o-perspective: 1000px;
		-ms-perspective: 1000px;
			perspective: 1000px;
}
.dg-wrapper a{
	width: 660px;
	height: auto;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	border-radius: 5px;
	
	-webkit-box-shadow: 3px 4px 7px var(--bg-main);
	   -moz-box-shadow: 3px 4px 7px var(--bg-main);
			box-shadow: 3px 4px 7px var(--bg-main);
	/*border: 1px solid var(--color-red-main);*/
}

.dg-wrapper a.dg-transition{
	-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: all 0.5s ease-in-out;
}

.dg-wrapper a img {
	display: block;
	padding: 0;
	width: 100%;
	border-radius: 5px;
}

.dg-wrapper a div{
	line-height: 50px;
	width: 100%;
	bottom: 0;
	position: absolute;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 0 0 5px 5px;
}

.dg-caption {
	padding: 20px 25px 10px 25px;
}

.dg-caption::before {
	display: block;
    background: rgba(255,110,2,1);
    background: linear-gradient(to right, #f00308 0%,#ffeb00 25%,#f00308 50%,#f00308 75%,#ffeb00 100%);
}

.dg-caption::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 5px;
    width: 100%;
}


.dg-wrapper a div h2 {
	color: #333;
	text-transform: uppercase;
	background: -webkit-linear-gradient(top, rgba(235,232,222,1) 0%,rgba(209,206,199,1) 39%,rgba(185,182,171,1) 59%,rgba(236,232,221,1) 100%);
				-webkit-background-clip: text;
				   -moz-background-clip: text;
					-ms-background-clip: text;
					 -o-background-clip: text;
						background-clip: text;
	-webkit-text-fill-color: transparent;	
	margin: 0;
	font-family: "PlayBold";
	text-align: left;
	text-transform: uppercase;
	line-height: 40px;
	position: relative;
	margin-top: -0.3em;
}

.dg-caption.open:not(.currently-open) h2 .countdown {
	position: relative;
	top: 0.2em;
	color: #ddd;
	-webkit-text-fill-color: #ddd;
}

.dg-wrapper a.dg-center div{
	display: block;
}

.room-nav-dg {
	width: 100%;
	text-align: center;
	margin-top: 80px;
	position: relative;
	float: left;	
}

.dg-container nav{
	width: 58px;
	margin-left: auto;
	margin-right: auto;
}

.dg-container nav span {
	float: left;
	cursor:pointer;
	width: 24px;
	height: 25px;
	/*
	opacity: 0.8;
	background: transparent url(images/arrows.png) no-repeat top left;
	*/
	position: relative;
	border: 1px solid var(--color-white-darker);
	border-radius: 4px;
}
.dg-container nav span::before {
	position: absolute;
	font-family: "FontAwesome";
	width: 24px;
	height: 25px;
	color: var(--color-white-darker);
}
.dg-container nav span.dg-prev::before {
	top: 0;
	left: -1px;
	content: "\f053";
}
.dg-container nav span.dg-next::before {
	top: 0;
	right: -2px;
	content: "\f054";
}

.dg-container nav span:hover{
	background-color: var(--color-dark-gray);
	border-color: var(--color-white-darker);
	opacity: 1;
	color
}

.dg-container nav span.dg-next{
	background-position: top right;
	margin-left: 10px;
}

.ball-home {
    display: flex;
    float: right;
}

.ball-home img {
    width: 40px !important;
    height: 40px !important;	
	margin-left: 3px !important;
	margin-right: 3px !important;	
}

@media (max-width: 1220px){
	.dg-wrapper, .dg-wrapper a {
		width: 640px;
	}	
}

@media (max-width: 1199px){
	.dg-wrapper, .dg-wrapper a {
		width: 480px;
	}
	
	.room-nav-dg {
		margin-top: 20px;
	}	
}

@media (max-width: 1020px){
	.dg-wrapper, .dg-wrapper a {
		width: 450px;
	}
	
	.room-nav-dg {
		margin-top: 0px;
	}
}

@media (max-width: 1030px){
	.dg-wrapper {
		min-height: 165px;
	}	
	
	.dg-wrapper, .dg-wrapper a {
		width: 400px;
	}
	
	.dg-caption::before {
		height: 7px;
	}	
	
	.dg-caption {
		padding: 15px 25px 7px 25px;
	}
	
	.dg-wrapper a div h2 {
		line-height: 26px;
		font-size: 26px;	
	}	

	.ball-home img {
		width: 30px !important;
		height: 30px !important;		
	}
}

@media (max-width: 940px){
	.dg-container {
		overflow : hidden;
	}
}


@media (max-width: 480px){
	.dg-wrapper {
		min-height: 130px;
	}	
	
	.dg-wrapper, .dg-wrapper a {
		width: 320px;
	}
	
	.dg-caption {
		padding: 8px 25px 3px 25px;
	}
	
	.dg-wrapper a div h2 {
		line-height: 22px;
		font-size: 22px;
	}
	
	.ball-home img {
		width: 25px !important;
		height: 25px !important;				
	}
	
	.dg-caption::before {
		height: 4px;
	}
	
	
}

@media (max-width: 360px){
	.dg-wrapper {
		min-height: 110px;
	}	
	
	.dg-wrapper, .dg-wrapper a {
		width: 260px;
	}
}

/*
===================================
	SLIDER HOME
===================================
*/
.dg-caption.open {
    padding-bottom: 0px !important;
}
.ball-home.open {
    top: 0.25em;
	position: absolute;
	right: 0;
}
.now-open {
    display: table;
    width: 100%;
    line-height: 0;
    padding-right: 5px;
    position: relative;
    margin-bottom: 15px;
    bottom: -5px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1em;
    font-family: "PlayBold";
    margin-top: 5px;
    text-align: right;
}
.now-open span {
    color: #eee;
}
.countdown__separator__1, 
.countdown__separator__2 {
    margin-left: -0.2em;
    margin-right: -0.2em;
}

.dg-caption.currently-open .maininfo {
	font-size: 0.9em;
	color: #34d07e;
	-webkit-text-fill-color: #19e77a;
}


.dg-caption.currently-open .countdown {
	color: #28bd70;
	-webkit-text-fill-color: #28bd70;
	font-size: 0.5em;
	display: block;
	line-height: 0.4em;
}

.dg-caption.open:not(.currently-open) .now-open {
	margin-top: 1.2em !important;
}

.dg-caption .now-open {
  margin-top: 0.8em;
  margin-bottom: 1.4em;
  color: #f4cf08;
  -webkit-text-fill-color: #f4cf08;
}

@media (max-width: 1199px) {
	.dg-wrapper > a {
		height: 218px !important;
	}
	.dg-caption {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
	.dg-wrapper a div {
		background-color: rgba(0, 0, 0, 0.85) !important;
	}
	.now-open {
		margin-top: 10px;
		margin-bottom: 10px;
		bottom: -1px;
		/*font-size: 1.2em;*/
	}
	.loby-game-home.dg-container .room-nav-dg {
		margin-top: 50px !important;
		margin-bottom: -15px;
	}
}
@media (max-width: 1020px) {
	.ball-home.open img {
		width: 35px !important;
		height: 35px !important;
	}
	.now-open {
		bottom: 1px;
	}
}
@media (max-width: 1030px) {
	.dg-wrapper > a {
		height: 180px !important;
	}
	.ball-home.open img {
		width: 25px !important;
		height: 25px !important;
	}
	.now-open {
		font-size: 0.7em;
		margin-top: 12px;
	}
	.loby-game-home.dg-container .room-nav-dg {
		margin-top: 45px !important;
	}
}
@media (max-width: 940px) {
	.loby-game-home.dg-container .room-nav-dg {
		margin-top: -30px !important;
		margin-bottom: 0;
	}
	.loby-game-home.dg-container .dg-wrapper {
		min-height: 222px !important;
	}
}
@media (max-width: 575px) {
	
}
@media (max-width: 480px) {
	.dg-container {
		margin-top: 25px !important;
	}
	.dg-caption.open {
		padding-bottom: 2px !important;
		padding-top: 10px;
	}
	.ball-home.open {

	}
	.now-open {
		bottom: -3px;
		font-size: 0.6em;
		margin-bottom: 0.9em !important;
		margin-top: 0.3em !important;
	}
	.dg-caption.open {
		padding-top: 10px;
	}
	.dg-wrapper > a {
		height: 154px !important;
	}
	.loby-game-home.dg-container .dg-wrapper {
		min-height: 190px !important;
	}
	.dg-wrapper a div h2 {
		font-size: 1.2em !important;
	}
}
@media (max-width: 440px) {
	.dg-wrapper > a {
		height: 190px !important;
	}
	.loby-game-home.dg-container .dg-wrapper {
		min-height: 170px !important;
	}
	.loby-game-home.dg-container .dg-wrapper a div h2 {
		font-size: 1.1em !important;
	}
	.now-open {
		font-size: 0.8em;
		margin-top: -0.4em !important;
	}
	.dg-caption.currently-open .countdown {
		line-height: 1.8em !important;
	}
	.dg-caption.open:not(.currently-open) h2 .countdown {
		top: 0.4em;
	}
}
@media (max-width: 360px) {
	.loby-game-home.dg-container .dg-wrapper {
		min-height: 155px !important;
	}
	.dg-wrapper > a {
		height: 170px !important;
	}
	.ball-home.open {
		top: 0.4em;
	}
	.now-open {
		font-size: 0.7em;
	}
}

/*
===================================
	BASIC
===================================
*/

.border-radius-5 {
	border-radius: 5px;
}
.pb-0 {
    padding-bottom: 0 !important;
}
.px-0 {
    padding-left: 0;
    padding-right: 0;
}
.padding-x-0 {
    padding-left: 0;
    padding-right: 0;
}

@media (max-width: 767px) {
	.container {
		overflow: hidden;
	}
}

/*
===================================
	PAGINATION
===================================
*/

.room-main-pagination {
	text-align: center;
}

.main-pagination {
	display: inline-block;
	text-align: center;
	border-radius: 5px;
	
	-webkit-box-shadow: 0px 0px 2px #f5f5f5;
	   -moz-box-shadow: 0px 0px 2px #f5f5f5;
		-ms-box-shadow: 0px 0px 2px #f5f5f5;
		 -o-box-shadow: 0px 0px 2px #f5f5f5;
			box-shadow: 0px 0px 2px #f5f5f5;
			
	width: 100%;
}

.main-pagination .record-summary {
    background-color: var(--color-green-dark);
    font-family: "PlayBold";
    padding: 5px 20px 10px;
	border-radius: 5px 5px 0 0;
	position: relative;
}

.record-summary::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 5px;
    width: 100%;
}

.record-summary::after {
    background: rgba(255,110,2,1);
	background: -moz-linear-gradient(left,  rgba(255,110,2,1) 0%, rgba(255,255,0,0.56) 50%, rgba(255,109,0,0.13) 100%);
	background: -webkit-linear-gradient(left,  rgba(255,110,2,1) 0%,rgba(255,255,0,0.56) 50%,rgba(255,109,0,0.13) 100%);
	background: linear-gradient(to right,  rgba(255,110,2,1) 0%,rgba(255,255,0,0.56) 50%,rgba(255,109,0,0.13) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6e02', endColorstr='#21ff6d00',GradientType=1 );
}

.main-pagination nav {
	font-family: "PlayBold";
    background-color: rgba(0, 0, 0, 0.55);
    border-radius: 0 0 5px 5px;
	padding: 5px 20px;
	line-height: 0;
}

.pagination {
    margin: 0;
	display: inline-block;
}
.pagination > li {
	display: inline;
}

.btn-pagination {
	-webkit-box-shadow: inset 0px 0px 12px #fff, 0px 4px 7px rgba(0, 0, 0, 0.25);
	   -moz-box-shadow: inset 0px 0px 12px #fff, 0px 4px 7px rgba(0, 0, 0, 0.25);
		-ms-box-shadow: inset 0px 0px 12px #fff, 0px 4px 7px rgba(0, 0, 0, 0.25);   
		 -o-box-shadow: inset 0px 0px 12px #fff, 0px 4px 7px rgba(0, 0, 0, 0.25);
			box-shadow: inset 0px 0px 12px #fff, 0px 4px 7px rgba(0, 0, 0, 0.25);

	color: #000 !important;
	border-radius: 5px !important;
	text-transform: uppercase;
	border: 2px solid #ffa800 !important;
	padding: 2px 10px !important;
	line-height: normal !important;
	margin-top: 3px;	
	
	background: #ffdd30;
	background-image: -webkit-linear-gradient(top, #ffdd30, #ffa611);
	background-image: -moz-linear-gradient(top, #ffdd30, #ffa611);
	background-image: -ms-linear-gradient(top, #ffdd30, #ffa611);
	background-image: -o-linear-gradient(top, #ffdd30, #ffa611);
	background-image: linear-gradient(to bottom, #ffdd30, #ffa611);
	
	-webkit-transform: skew(-21deg);
	   -moz-transform: skew(-21deg);
		-ms-transform: skew(-21deg);   
		 -o-transform: skew(-21deg);
			transform: skew(-21deg);	
}

.btn-pagination span {
	display: inline-block;
	-webkit-transform: skew(21deg);
	   -moz-transform: skew(21deg);
		-ms-transform: skew(21deg);   
		 -o-transform: skew(21deg);
			transform: skew(21deg);	
}

.btn-pagination:hover {
	background: #fdcf01 !important;
}

.pagination > li:first-child > a {
	margin-right: 5px;
}

.pagination > li:last-child > a {
	margin-left: 5px;
}

/*
=============================================
		PAGINATION
=============================================
*/

.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.pagination > li > a, .pagination > li > span {
    color: #fff;
    background-color: transparent;
    border: none;
    margin-right: 0;
	padding: 6px 8px;
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background-color: transparent;
    border-color: #244e98;
	color: #eccd00;
}

.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
    z-index: 2;
    color: #eccd00;
    background-color: transparent;
    border-color: #244e98;
}

@media (max-width: 600px) {
	
	.main-pagination nav, .login-navigasi nav {	
		padding: 5px 15px;
		font-size: 12px;
	}
	
	.pagination > li > a, .pagination > li > span {
		padding: 5px 5px;
	}
}
@media (max-width: 575px) {
	.main-pagination nav, .login-navigasi nav {
		margin-top: 1em !important;
		margin-bottom: 1em !important;
	}
}

@media (max-width: 480px) {
	.pagination > li:first-child > a, .pagination > li:first-child > span {
		width: 100%;
		margin-right: 0;
		margin-bottom: 5px;
	}

	.pagination > li:last-child > a, .pagination > li:last-child > span {
		width: 100%;
		margin-left: 0;
		margin-top: 5px;
	}	
	
	.pagination > li > a, .pagination > li > span {
		padding: 10px 5px;
		display: block;
	}
	
	.main-pagination nav, .login-navigasi nav {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
}

/**
=============================================
	PAGINATION 2
=============================================
**/
.pagination .btn-pagination {
    color: #000 !important;
}
.pagination .btn-pagination:hover {
    color: #444 !important;
}
.pagination > li:first-child > a {
    margin-right: 0 !important;
}
.pagination > li:last-child > a {
    margin-left: 0 !important;
}
.pagination > li:first-child > a.btn-pagination {
    margin-right: 5px !important;
}
.pagination > li:last-child > a.btn-pagination {
    margin-left: 5px !important;
}
@media (max-width: 480px) {
	.pagination > li {
		display: inline-block;
	}
	.pagination li.navi {
		width: 100%;
		display: block;
	}
	.pagination > li:first-child > a, 
	.pagination > li:first-child > span {
		width: auto !important;
		margin-right: 0;
		margin-bottom: 0 !important;
	}
	.pagination > li:last-child > a, 
	.pagination > li:last-child > span {
		width: auto !important;
		margin-left: 0 !important;
		margin-top: 0 !important;
	}
	.pagination > li:first-child > a.btn-pagination, 
	.pagination > li:first-child > span.btn-pagination {
		width: 100% !important;
		margin-right: 0;
		margin-bottom: 5px !important;
		display: block;
	}
	.pagination > li:last-child > a.btn-pagination, 
	.pagination > li:last-child > span.btn-pagination {
		width: 100% !important;
		margin-left: 0 !important;
		margin-top: 5px !important;
		display: block;
	}
	.main-pagination nav, .login-navigasi nav {
		padding: 12px 15px 15px;
	}
}

/*
=======================================================
		CONTENT
=======================================================
*/

.narrow {
    max-width: 767px;
    margin: auto;
}

.super-narrow {
    max-width: 480px;
    margin: auto;
}

.narrow-side-gap {
    padding-left: 10px;
    padding-right: 10px;
}

.narrow-side-gap-2 {
    padding-left: 5px;
    padding-right: 5px;
}

.body-title {
    text-align: center;
    font-size: 1.6em;
    background-color: rgba(255,255,255,0.1);
    padding: 0.3em 1em;
}

@media (max-width: 991px) {

}
@media (max-width: 991px) {

}
@media (max-width: 767px) {

	.body-title {
		font-size: 1.5em;
	}
}
@media (max-width: 600px) {
	.body-title {
		font-size: 1.4em;
	}
}
@media (max-width: 480px) {
	.body-title {
		font-size: 1.3em;
	}
}
@media (max-width: 360px) {
	.body-title {
		font-size: 1.2em;
	}
}

/**
=============================================
	GAPS
=============================================
**/
/*
.mt-1 {
	margin-top: 45px !important;
}
.mt-2 {
	margin-top: 30px !important;
}
.mt-3 {
	margin-top: 15px !important;
}
.mb-1 {
	margin-bottom: 45px !important;
}
.mb-2 {
	margin-bottom: 30px !important;
}
.mb-3 {
	margin-bottom: 15px !important;
}
.px-1 {
    padding-left: 5px;
    padding-right: 5px;
}
.w20 {
	width: 20%;
}
*/

.peraturan-news .container {
    margin-top: 10px;
}

@media (max-width: 640px) {
	.mt-1 {
		margin-top: 15px !important;
	}
	.mt-2 {
		margin-top: 10px !important;
	}
	.mt-3 {
		margin-top: 5px !important;
	}
	.mb-1 {
		margin-bottom: 15px !important;
	}
	.mb-2 {
		margin-bottom: 10px !important;
	}
	.mb-3 {
		margin-bottom: 5px !important;
	}
}

/*
=======================================================
		TABLE
=======================================================
*/
.room-main-table {
    margin-top: 30px;
}

.room-main-table table {
    font-family: "PlayBold";
    text-transform: uppercase;
    border-radius: 5px;
	/*width: 70%;*/
	margin-left: auto;
	margin-right: auto;
	
	
    -webkit-box-shadow: 0px 0px 2px #f5f5f5;
	   -moz-box-shadow: 0px 0px 2px #f5f5f5;
		-ms-box-shadow: 0px 0px 2px #f5f5f5;
		 -o-box-shadow: 0px 0px 2px #f5f5f5;
			box-shadow: 0px 0px 2px #f5f5f5;
}

.room-main-table table img {
    width: 32px;
    margin-left: auto;
    margin-right: auto;
}

.table a {
	color: var(--color-green-dark);
}

.table > thead > tr > td, .table > thead > tr > th {
	background-color: rgba(0, 0, 0, 0.55);
	font-style: italic;
	padding: 10px;
	font-size: 18px;
}

.table > thead > tr > th {
    border-bottom: 4px solid #aeaeae;
	color: var(--color-white-darker);
}

.table > tbody > tr > td:first-child, .table > tbody > tr > th:first-child, 
.table > tfoot > tr > td:first-child, .table > tfoot > tr > th:first-child, 
.table > thead > tr > td:first-child, .table > thead > tr > th:first-child {
	border-left: 0;
}

.table > tbody > tr > td:last-child, .table > tbody > tr > th:last-child, 
.table > tfoot > tr > td:last-child, .table > tfoot > tr > th:last-child, 
.table > thead > tr > td:last-child, .table > thead > tr > th:last-child {
	border-right: 0;
}

.table-striped > tbody > tr:nth-of-type(2n+1) {
    background-color: rgba(255, 102, 0, 0.45);
	
	-webkit-box-shadow: inset 0 0 3em rgba(255, 255, 255, 0.15);
	   -moz-box-shadow: inset 0 0 3em rgba(255, 255, 255, 0.15);
		-ms-box-shadow: inset 0 0 3em rgba(255, 255, 255, 0.15);
		 -o-box-shadow: inset 0 0 3em rgba(255, 255, 255, 0.15);
			box-shadow: inset 0 0 3em rgba(255, 255, 255, 0.15);
}

.table-striped > tbody > tr:nth-of-type(2n) {
    background-color: rgba(255, 255, 255, 0.03);
}

.table-striped > tbody > tr:hover {
    background-color: rgba(152, 36, 76, 0.45);
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    vertical-align: middle;
    border-top: 1px solid rgba(0, 0, 0, 0.45);
	border-left: 2px solid #aeaeae;
    text-align: center;
}

.table > tbody > tr.active > td, .table > tbody > tr.active > th, .table > tbody > tr > td.active, .table > tbody > tr > th.active, .table > tfoot > tr.active > td, .table > tfoot > tr.active > th, .table > tfoot > tr > td.active, .table > tfoot > tr > th.active, .table > thead > tr.active > td, .table > thead > tr.active > th, .table > thead > tr > td.active, .table > thead > tr > th.active {
    background-color: rgba(255, 54, 54, 0.75);
}

.record-table .td {
    width: 16.65%;
}

.record-table-4 .td {
    width: 25%;
}

.record-table-7 .td {
    width: 14.25%;
}

.table-instruction {
	display: none;
	line-height: 1.4em;
    margin-bottom: 10px;
}
.tiny-font {
    font-size: 0.7em;
}
.page-play .small-font,
.mini-font {
    font-size: 0.8em;
}
.record-table, .record-table-4 {
	overflow-x: hidden;
	/*overflow-y: scroll;*/
}
.the-table {
    border: 1px solid #aaa;
	/*width: 560px;*/
}
/*
.the-table > div.tr + div.tr {
    border-top: 1px solid #aaa;
}
*/
.the-table > div.tr + div.tr > div.td {
    border-top: 1px solid #aaa;
}

#deposit-history.record-table,
#withdraw-history.record-table,
#referral-history.record-table {
    border: 1px solid #aaa;
	/*height: 140px;*/
}

#deposit-history.record-table-4,
#withdraw-history.record-table-4,
#referral-history.record-table-4 {
    border: 1px solid #aaa;
	/*height: 140px;*/
}

#deposit-history .the-table,
#withdraw-history .the-table,
#referral-history .the-table {
    width: auto;
	min-width: 544px;
	border: none;
}
#deposit-history .the-table .td,
#withdraw-history .the-table .td,
#referral-history .the-table .td {
    display: inline-block;
    /*width: 24% !important;*/
}
#deposit-history .the-table > div.tr + div.tr > div.td,
#withdraw-history .the-table > div.tr + div.tr > div.td,
#referral-history .the-table > div.tr + div.tr > div.td {
    border-top: none;
}
#deposit-history .the-table > div.tr + div.tr,
#withdraw-history .the-table > div.tr + div.tr,
#referral-history .the-table > div.tr + div.tr {
    border-top: 1px solid #aaa;
}
.nodata-in-table {
    font-size: 0.8em;
    font-style: italic;
    margin-top: 58px;
    padding: 0 15px;
    text-align: center;
}
.inline-block {
	display: inline-block;
}

.record-pagination {
    margin-top: 15px;
}
.record-pagination > div {
    display: inline-block;
}
.record-pagination > div a {
    background-color: #c4ad00;
    color: #fff;
    padding: 5px 12px;
	font-size: 0.8em;
}
/*
.tr {
    padding: 5px 0;
}
*/
.tr {
	clear: both;
	display: table;
    width: 100%;
}
.td {
    display: table-cell;
    padding: 10px;
	line-height: 1.2em;
	text-align: center;
	word-wrap: break-word;
	float: left;
}
.page-balance .td {
	width: 14.25%;
}
.page-balance-detail .td {
	width: 16.65%;
}
.page-deposit-fund .td,
.page-referral-2 .td,
.page-withdraw-money .td {
	width: 25%;
}

.td.text-right {
	text-align: right;
}
.td.text-left {
	text-align: left;
}
/*
.page-balance-detail .td {
	width: 94px;
}
*/
.th {
    text-align: center;
}
.the-table.small-font .td {
    font-size: 0.7em;
}
.td.expand {
    display: none;
}
.the-table .expand-for-mobile {
    display: none;
}

.the-table div.tr > div:nth-child(1) {
    /*width: 100px !important;*/
}
/*
.the-table div.tr > div:nth-child(1),
.the-table div.tr > div:nth-child(2),
.the-table div.tr > div:nth-child(7) {
    text-align: center;
}
*/
tr.sub-thead > th {
	font-size: 16px !important;
	font-weight: normal !important;
	font-style: normal !important;
}

.table > tbody > tr > th {
	background-color: rgba(0, 0, 0, 0.85);
	color: var(--color-white-darker);
}

.table-tr-25 {
	width: 25%;
}

.table-auto {
    width: auto !important;
}

@media (max-width: 1199px){
	.room-main-table table {

	}
	
	.room-login-table {
		overflow-x: scroll;
		border-radius: 5px;
		margin-bottom: 20px;
		
		-webkit-box-shadow: 0px 0px 2px #f5f5f5;
		   -moz-box-shadow: 0px 0px 2px #f5f5f5;
			-ms-box-shadow: 0px 0px 2px #f5f5f5;
			 -o-box-shadow: 0px 0px 2px #f5f5f5;
				box-shadow: 0px 0px 2px #f5f5f5;		
	}
	
	.room-login-table table {
		width: 100%;
		min-width: 540px;
		margin-bottom: 0;
	}
}

@media (max-width: 640px) {
	.room-main-table table {
		width: 100%;
	}
	
	.room-main-table .table > tbody > tr > td, .room-main-table .table > tbody > tr > th, 
	.room-main-table .table > tfoot > tr > td, .room-main-table .table > tfoot > tr > th, 
	.room-main-table .table > thead > tr > td, 
	.room-main-table .table > thead > tr > th {
		border-left: 0;
		border-top: 0;
		text-align: left;
	}
	
	.room-main-table table img {
		margin-left: unset;
		margin-right: auto;
		text-align: left;
	}
	
	.room-main-table .table > tbody > tr > td:first-child, 
	.room-main-table .table > tbody > tr > th:first-child, 
	.room-main-table .table > tfoot > tr > td:first-child, 
	.room-main-table .table > tfoot > tr > th:first-child, 
	.room-main-table .table > thead > tr > td:first-child, 
	.room-main-table .table > thead > tr > th:first-child {
		border-top: 2px solid #aeaeae;
	}
	
	.room-main-table .table > tbody > tr:first-child > td:first-child, 
	.room-main-table .table > tbody > tr:first-child > th:first-child, 
	.room-main-table .table > tfoot > tr:first-child > td:first-child, 
	.room-main-table .table > tfoot > tr:first-child > th:first-child, 
	.room-main-table .table > thead > tr:first-child > td:first-child, 
	.room-main-table .table > thead > tr:first-child > th:first-child {
		border-top: 0;
	}	
	
	.room-main-table .table > tbody > tr > td:last-child, 
	.room-main-table .table > tbody > tr > td:last-child, 
	.room-main-table .table > tfoot > tr > td:last-child, 
	.room-main-table .table > tfoot > tr > td:last-child, 
	.room-main-table .table > thead > tr > td:last-child, 
	.room-main-table .table > thead > tr > td:last-child {
		border-bottom: 0;
	}
	
	/* Force table to not be like tables anymore */
	.room-main-table table, .room-main-table thead, .room-main-table tbody, .room-main-table th, .room-main-table td, .room-main-table tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.room-main-table thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	.room-main-table tr { }
	
	.room-main-table td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid rgba(0, 0, 0, 0.45); 
		position: relative;
		padding-left: 55% !important; 
	}
	
	.room-main-table td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align: left;
	}
	
	/*
	Label the data
	*/
	.room-main-table td:nth-of-type(1):before { content: "Periode"; }
	.room-main-table td:nth-of-type(2):before { content: "Hari"; }
	.room-main-table td:nth-of-type(3):before { content: "Angka Keluar"; }
	.room-main-table td:nth-of-type(4):before { content: ""; }
	.room-main-table td:nth-of-type(5):before { content: ""; }
	
	
	/**--- analisis-table --**/
	.analisis-table {
		position: relative;
	}	
	
	.analisis-table table {
		width: 100% !important;
		min-width: unset !important;
	}
	
	.analisis-table .table > tbody > tr > td, .analisis-table .table > tbody > tr > th, 
	.analisis-table .table > tfoot > tr > td, .analisis-table .table > tfoot > tr > th, 
	.analisis-table .table > thead > tr > td, 
	.analisis-table .table > thead > tr > th {
		border-left: 0;
		border-top: 0;
		text-align: left;
	}
	
	.analisis-table table img {
		margin-left: unset;
		margin-right: auto;
		text-align: left;
	}
	
	.analisis-table .table > tbody > tr > td:first-child, 
	.analisis-table .table > tbody > tr > th:first-child, 
	.analisis-table .table > tfoot > tr > td:first-child, 
	.analisis-table .table > tfoot > tr > th:first-child, 
	.analisis-table .table > thead > tr > td:first-child, 
	.analisis-table .table > thead > tr > th:first-child {
		border-top: 2px solid #aeaeae;
	}
	
	.analisis-table .table > tbody > tr:first-child > td:first-child, 
	.analisis-table .table > tbody > tr:first-child > th:first-child, 
	.analisis-table .table > tfoot > tr:first-child > td:first-child, 
	.analisis-table .table > tfoot > tr:first-child > th:first-child, 
	.analisis-table .table > thead > tr:first-child > td:first-child, 
	.analisis-table .table > thead > tr:first-child > th:first-child {
		border-top: 0;
	}	
	
	.analisis-table .table > tbody > tr > td:last-child, 
	.analisis-table .table > tbody > tr > td:last-child, 
	.analisis-table .table > tfoot > tr > td:last-child, 
	.analisis-table .table > tfoot > tr > td:last-child, 
	.analisis-table .table > thead > tr > td:last-child, 
	.analisis-table .table > thead > tr > td:last-child {
		border-bottom: 0;
	}
	
	/* Force table to not be like tables anymore */
	.analisis-table table, .analisis-table thead, .analisis-table tbody, .analisis-table th, .analisis-table td, .analisis-table tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.analisis-table thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	.analisis-table tr { }
	
	.analisis-table td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid rgba(0, 0, 0, 0.45); 
		position: relative;
		padding-left: 5px !important; 
	}
	
	.analisis-table td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align: left;
	}
	
	/*
	Label the data
	*/
	
	.analisis-table tr::before {
		position: absolute;
		top: 6px;
		left: 0;
		width: 100%;
		padding-bottom: 5px;
		white-space: nowrap;
		text-align: center;
		font-weight: 600;
		border-bottom: 1px solid #000;
	}
	
	
	.analisis-table tr:first-child td:first-child {
		padding-top: 40px;
	}
	
	.analisis-table tr:nth-of-type(1):before { content: "Jenis Analisis"; }

	
}

@media (max-width: 600px) {
	.room-main-table {
		/*
		overflow-x: scroll;
		*/
		border-radius: 5px;
		
		-webkit-box-shadow: 0px 0px 2px #f5f5f5;
		   -moz-box-shadow: 0px 0px 2px #f5f5f5;
			-ms-box-shadow: 0px 0px 2px #f5f5f5;
			 -o-box-shadow: 0px 0px 2px #f5f5f5;
				box-shadow: 0px 0px 2px #f5f5f5;		
	}
}

/**
=============================================
	TABLE 2
=============================================
**/
.tablecell_bl {
	border-left: 2px solid #aaa !important;
}
.tablecell_bb {
	border-bottom: 2px solid #aaa !important;
}
tr[valign=top] td,
tr[valign=top] th {
	vertical-align: top !important;
}

@media (max-width: 640px) {
	.tablecell_bl {
		border-left: none !important;
	}
	.tablecell_bb {
		border-bottom: none !important;
	}
}

/**
=============================================
	NOMOR KELUAR PRIZE
=============================================
**/
/*
Label the data
*/

@media (max-width: 640px) {
	.room-main-table td {
		white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
		white-space: -webkit-pre-wrap;          /* Chrome & Safari */ 
		white-space: -pre-wrap;                 /* Opera 4-6 */
		white-space: -o-pre-wrap;               /* Opera 7 */
		white-space: pre-wrap;                  /* CSS3 */
		word-wrap: break-word;                  /* Internet Explorer 5.5+ */
		word-break: break-all;
		white-space: normal;
	}
	
	.room-main-table .table-prize td:nth-of-type(1):before { content: "Posisi"; }
	.room-main-table .table-prize td:nth-of-type(2):before { content: "Angka"; }
	
	.room-main-table .table-periode-prize td:nth-of-type(1):before { content: "Periode"; }
	.room-main-table .table-periode-prize td:nth-of-type(2):before { content: "Tanggal"; }
	.room-main-table .table-periode-prize td:nth-of-type(3):before { content: "Hari"; }
	.room-main-table .table-periode-prize td:nth-of-type(4):before { content: "1st Prize"; }
	.room-main-table .table-periode-prize td:nth-of-type(5):before { content: "2nd Prize"; }
	.room-main-table .table-periode-prize td:nth-of-type(6):before { content: "3rd Prize"; }
	
	.room-main-table .table-periode-common td:nth-of-type(1):before { content: "Periode"; }
	.room-main-table .table-periode-common td:nth-of-type(2):before { content: "Tanggal"; }
	.room-main-table .table-periode-common td:nth-of-type(3):before { content: "Hari"; }
	.room-main-table .table-periode-common td:nth-of-type(4):before { content: "Angka Keluar"; }
	
	.room-main-table .table-detail-angka td:nth-of-type(1):before { content: "As"; }
	.room-main-table .table-detail-angka td:nth-of-type(2):before { content: "Kop"; }
	.room-main-table .table-detail-angka td:nth-of-type(3):before { content: "Kepala"; }
	.room-main-table .table-detail-angka td:nth-of-type(4):before { content: "Ekor"; }
	
	.room-main-table .table-detail-angka td.notitle_640:nth-of-type(1):before { content: ""; }
	.room-main-table .table-detail-angka td.notitle_640:nth-of-type(2):before { content: ""; }
	.room-main-table .table-detail-angka td.notitle_640:nth-of-type(3):before { content: ""; }
	.room-main-table .table-detail-angka td.notitle_640:nth-of-type(4):before { content: ""; }
	
	.table-detail-angka .notitle_640 {
		padding-left: 8px !important;
		width: 50%;
		display: inline-block;
	}
	
	.table-detail-angka .notitle_640.full_width {
		width: 100%;
	}
	
	.hidden_640 {
		display: none !important;
	}
}

@media (max-width: 480px) {
	.page-indo-pool-a .single-block-content,
	.page-indo-pool-b .single-block-content,
	.page-singapore-pool .single-block-content,
	.page-singapore49 .single-block-content,
	.page-china-pool .single-block-content,
	.page-korea-pool .single-block-content,
	.page-detail_angka .single-block-content	{
		padding: 15px;
	}
}

/**
=============================================
	SLIDER GAME TOTO
=============================================
**/

.third-block {
	/*
	background-image: url("images/bg/bg-third-block.jpg");
	background-position: top left;
	background-size: cover;
	background-repeat: no-repeat;
	*/
	margin-bottom: 10px;
	border-radius: 10px;
	padding: 30px;
}

.dg-container {

}

.dg-wrapper {
    min-height: 240px !important;
}
.room-nav-dg {
    margin-top: 8px !important;
}
@media (max-width: 1199px) {
	.dg-wrapper {
		min-height: 180px !important;
	}
	.dg-wrapper a div h2 {
		font-size: 1.3em;
	}
	.dg-wrapper a div.currently-open .countdown {
		position: relative;
		top: -0.6em;
	}
	.room-nav-dg {
		margin-bottom: 10px;
	}
}
@media (max-width: 1030px) {
	.dg-wrapper {
		min-height: 160px !important;
	}
	.dg-wrapper a div h2 {
		font-size: 1em !important;
	}
	.ball-home img {
		width: 26px !important;
		height: 26px !important;
	}
	.third-block {
		padding: 30px 30px 20px 30px;
	}
	.dg-caption.currently-open .countdown {
		font-size: 0.7em;
		line-height: 1em;
	}
}
@media (max-width: 940px) {
	.dg-wrapper, 
	.dg-wrapper a {
		margin-top: 5px;
	}
	.dg-wrapper {
		min-height: 147px !important;
	}
	.room-nav-dg {
		margin-top: 0 !important;
		margin-bottom: 5px;
		bottom: -5px;
	}
}
@media (max-width: 480px) {
	/*
	.dg-wrapper, .dg-wrapper a {
		width: 100% !important;
	}
	*/
	.dg-wrapper {
		min-height: 120px !important;
	}
	.dg-wrapper a div h2 {
		font-size: 0.8em !important;
	}
	.room-nav-dg {
		margin-bottom: 5px;
	}
}
@media (max-width: 440px) {
	.dg-wrapper, .dg-wrapper a {
		width: 110% !important;
		transform: scale(0.8);
		left: -5% !important;
		top: -20% !important;
	}
}
@media (max-width: 440px) {
	.dg-wrapper, .dg-wrapper a {
		/*width: 126% !important;*/
		/*transform: scale(0.7);*/
		/*left: -13% !important;*/
	}
}
/*
@media (max-width: 420px) {
	.dg-wrapper, .dg-wrapper a {
		width: 260px !important;
	}
}
*/
@media (max-width: 360px) {
	.dg-wrapper {
		min-height: 100px !important;
	}
	.dg-caption {
		padding: 8px 5px 3px 5px !important;
	}
	.dg-caption .ball-home img {

	}
}

/* adaptation if placed in menu dropdown menu mega menu */
/*
.dropdown-menu.megamenu .dg-wrapper {
}
.dropdown-menu.megamenu .dg-wrapper a {
	position: relative;
	width: 100%;
	border: 0.3em solid var(--bs-orange);
    border-radius: 0.7em;
}
*/

/* https://webgalaxytangkas.com/bunker/assets/css/theme_pid_home.css?v=1.0.1 */
/*** SLIDER ***/

.main-slider {
	width: 100%;
	position: relative;	
	/*z-index: -1;*/
}

#main_slider.sa_owl_theme .owl-dots {
	bottom: 1.25rem !important;
}

@media(max-width: 575px) {
	.owl-carousel .owl-stage-outer {
		padding-bottom: 2.25rem;
	}
	
	.sa_owl_theme .owl-nav div, .sa_owl_theme .owl-nav button {
		margin-top: -35px !important;
	}
	
	#main_slider.sa_owl_theme .owl-dots {
		bottom: .75rem !important;
	}
}

/*** JACKPOT PLAY ***/

.jackpot-play, 
.jackpot-play .content, 
.jackpot-play .title, 
.jackpot-play .jackpot-value, 
.jackpot-play .jackpot-value .inner-jackpot, 
.jackpot-play .action {
	float: left;
	width: 100%;
	position: relative;	
}

.jackpot-play {
	background-image: url(../images/bg/bg-center.webp?v=1);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding: var(--padding-section);
	box-shadow: 0 0 10px rgb(0, 0, 0);
	/*	
	background-color: var(--color-dark-green-transparent);
	*/
	/*filter: grayscale(50%);*/
}

.jackpot-play .container {
	overflow: initial;
}

.jackpot-play .icon {
	position: absolute;
	bottom: 0;
	height: 100%;
	width: auto;
	-webkit-transform: scale(1.45) translateY(10px) translateX(160px);
			transform: scale(1.45) translateY(10px) translateX(160px);
	z-index: 2;
}

.jackpot-play .icon img {
	height: 100%;
	max-height: 350px;
	animation: floatUpDown 4s ease-in-out infinite, tiltSway 5s ease-in-out infinite;
	transform-origin: center;
	filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.62));
}

.jackpot-play .content {
	width: 75%;
	margin-left: 15%;
	text-align: center;
}

@keyframes floatUpDown {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-15px);
  }
}

@keyframes tiltSway {
  0%, 100% {
    rotate: 0deg;
  }
  25% {
    rotate: 2deg;
  }
  75% {
    rotate: -2deg;
  }
}

@media(max-width: 1399px) {
	.jackpot-play .icon {
		transform: scale(1.45) translateY(10px) translateX(160px);
	}
}

@media(max-width: 1199px) {
	.jackpot-play .icon {
		transform: scale(1.35) translateY(15px) translateX(120px);
		top: 0;
	}
	
	.jackpot-play .icon img {
		height: auto;
		width: auto;
	}
}


/*
.jackpot-play .content > div {
	padding-left: 10%;
}
*/

.jackpot-play .title {
	
}

.jackpot-play .title h1 {
	font-size: 3rem;
}

.jackpot-svg {
  width: 335px;
  height: auto;
  transform: translateY(25%);
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.62));
}

.jackpot-word,
.play-word {
  font-size: 3.5rem;
  font-family: 'BebasRegular';
  fill: none;                /* awal transparan */
  stroke-width: 2px;
  stroke-dasharray: 1000;    /* panjang garis, sesuaikan */
  stroke-dashoffset: 1000;   /* mulai tersembunyi */
}

/* JACKPOT putih */
.jackpot-word {
  stroke: #FFFFFF;
  animation: drawJackpot 4s linear infinite, fillJackpot 1s linear infinite;
  animation-delay: 0s, 4s; /* fill muncul setelah garis selesai */
}

/* PLAY kuning */
.play-word {
  stroke: #0cfdfd;
  animation: drawPlay 4s linear infinite, fillPlay 1s linear infinite;
  animation-delay: 0s, 4s;
}

/* Animasi garis menjalar */
@keyframes drawJackpot {
  0%   { stroke-dashoffset: 1000; fill: none; }
  100% { stroke-dashoffset: 0; }
}

@keyframes drawPlay {
  0%   { stroke-dashoffset: 1000; fill: none; }
  100% { stroke-dashoffset: 0; }
}

/* Animasi fill setelah garis selesai */
@keyframes fillJackpot {
  0%, 50%   { fill: none; }
  100%      { fill: #E6E6E6; }
}

@keyframes fillPlay {
  0%, 50%   { fill: none; }
  100%      { fill: #31ffff; }
}

@media(max-width: 767px) {
	.jackpot-svg {
		float: right;
	}
}

@media(max-width: 480px) {
	.jackpot-svg {
		width: 226px;
		height: auto;
		transform: translateY(17px);
	}
}

.jackpot-play .jackpot-value {
	background: linear-gradient(45deg, rgba(0, 0, 0, 0.48) 0%,rgba(0, 0, 0, 0.35) 100%);
	color: var(--color-main);
	padding: 1rem;
	border-radius: 2rem;
	margin: 1rem 0 2rem;
	-webkit-box-shadow: inset 0 0.3125rem 0.3125rem rgba(255, 255, 255, .35);
			box-shadow: inset 0 0.3125rem 0.3125rem rgba(255, 255, 255, .35);
}

.jackpot-play .jackpot-value .inner-jackpot {
	display: flex;
	justify-content: center;
	align-items: center;
    background-color: transparent;
    border: 0.25rem solid #019eff;	
	border-radius: 1rem;
}

.jackpot-play .jackpot-value .inner-jackpot::before {
    content: '';
    position: absolute;
    top: -0.25rem;
	left: 1rem;
	right: 1rem;
    background: linear-gradient(to right, #019eff 0%,#0cfdfd 50%,#019eff 100%);
	height: 0.25rem;
	-webkit-box-shadow: inset 0 -0.0625rem 0.0625rem -0.0625rem rgba(0, 0, 0, .65);
			box-shadow: inset 0 -0.0625rem 0.0625rem -0.0625rem rgba(0, 0, 0, .65);

}

.jackpot-play .jackpot-value .inner-jackpot::after {
    content: '';
    position: absolute;
    bottom: -0.25rem;
	left: 1rem;
	right: 1rem;
    background: linear-gradient(to right, #019eff 0%,#0cfdfd 50%,#019eff 100%);
	height: 0.25rem;
	-webkit-box-shadow: inset 0 -0.0625rem 0.0625rem -0.0625rem rgba(0, 0, 0, .65);
			box-shadow: inset 0 -0.0625rem 0.0625rem -0.0625rem rgba(0, 0, 0, .65);
}

.jackpot-play .jackpot-value .prefix {
	font-family: 'PlayBold';
	font-size: 2rem;
	margin-right: 1rem;
}

.jackpot-play .jackpot-value .infix {
	font-family: 'BebasRegular';
	font-size: 4rem;
	line-height: normal;
}

.jackpot-play .action {
	
}

.btn-playnow-jp, 
.btn-playnow-jp:focus {
	background: var(--color-rosegold-ver);
	color: var(--color-rosegold-text);
	border-color: var(--color-gold-border);
}

.btn-playnow-jp:hover {
	background: var(--color-rosegold-ver-hover);
	color: var(--color-campagne);
	border-color: var(--color-gold-border-hover);
}

.jackpot-play .content {
	margin-left: 25%;
}

@media(max-width: 991px) {
	.jackpot-play .icon {
		height: auto;
		top: 0;
		bottom: 0;
	}
	.jackpot-play .content {
		margin-left: 30%;
	}
	.jackpot-play .jackpot-value .infix {
		font-size: 3rem;
	}
	.jackpot-play .icon {
		left: 20%;
		top: 15px;
		transform: scale(1.3);
	}
}
@media(max-width: 767px) {
	.jackpot-play .content {
		width: 100%;
		margin-left: 0;
	}
	.jackpot-play .icon {
		left: 0;
		top: 0;
		transform: scale(1.3);
	}
	.jackpot-play .jackpot-value .inner-jackpot {
		justify-content: right;
		padding-right: 3%;
	}
	.jackpot-play .jackpot-value .inner-jackpot #jackpot-value {
		font-size: 2.7em;
	}
}
@media(max-width: 575px) {
	.jackpot-play .title h1 {
		font-size: 1.4em;
	}
	.btn-playnow-jp {
		font-size: 0.9em;
	}
	.jackpot-play .jackpot-value {
		margin-bottom: 1em;
	}
	.jackpot-play .content {
		width: 100%;
		margin-left: 0;
	}
	.jackpot-play .jackpot-value .infix {
		font-size: 2em !important;
	}
	.jackpot-play .jackpot-value .prefix {
		font-size: 1em;
		margin-right: 0.5em;
	}
	
	.jackpot-play .icon {
		left: 0;
		top: 0;
		transform: scale(1);
	}
}
@media(max-width: 400px) {
	.jackpot-play .jackpot-value .inner-jackpot {
		padding-right: 1em;
		font-size: 0.8em;
	}
}
@media(max-width: 360px) {
	.jackpot-play .icon {
		left: -40px;
		top: -55px;
		transform: scale(0.7);
	}
}

/*** MOBILE SLIDER MENU ***/

.mobile-slider-menu, 
.main-slider-menu, 
.mobile-slider-menu .list-game-toggle {
	float: left;
	width: 100%;
	position: relative;		
}

.mobile-slider-menu {
	margin-bottom: 1.5rem;
}

.wrapper-slider-menu {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth;
	gap: 10px; /* Jarak antar item */
	padding: 15px 0;
}

.item-slider-menu {
	flex: 0 0 auto;
	min-width: 90px;
	text-align: center;
	scroll-snap-align: start;
}

.item-slider-menu a {
	background-color: var(--bg-wrap);
	border-radius: 5px;
	padding: 10px 15px;
	display: block;
	color: var(--color-main);
	text-decoration: none;
}

.item-slider-menu a:hover,
.item-slider-menu a.active,
.item-slider-menu a.active:hover {
	/*background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgb(1, 55, 31) 100%);*/
	background: var(--color-accent-vertical);
}

.item-slider-menu .ico {
	width: 27px;
	height: 27px;
	margin: 0 auto 5px auto;
}

.item-slider-menu .ico img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.item-slider-menu .text {
	font-size: 11px;
	text-transform: uppercase;
	white-space: nowrap;
}

.nav-slider-menu {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background-color: rgba(0,0,0,0.5);
	color: #fff;
	border: none;
	padding: 5px 10px;
	cursor: pointer;
	z-index: 5;
}

.nav-slider-menu:hover {
	background-color: rgba(0,0,0,1);
}

.nav-slider-menu.prev {
	left: -15px;
}

.nav-slider-menu.next {
	right: -15px;
}

.mobile-slider-menu .list-game-toggle {
	margin-top: 15px;
}

@media(max-width: 480px) {
	.mobile-slider-menu .list-game-toggle .row > .col-menu-item-game {
		width: 50%;
	}
	
	.mobile-slider-menu .list-game-toggle .row > .col-menu-item-totoresult {
		width: 100%;
	}
}

/*** PLAY FUN DEMO GAMES ***/

#containerPlayFunGames, 
.fun-demo-games, 
.fun-demo-games .title-fun-demo-games, 
.fun-demo-games .search-fun-demo-games, 
.fun-demo-games .content-fun-demo-games, 
.fun-demo-games .loadmore-fun-demo-games, 
.fun-demo-games .item-fun-demo-game, 
.fun-demo-games .inner-fun-demo-game, 
.fun-demo-games .item-fun-demo-game .content, 
.fun-demo-games .item-fun-demo-game .subtitle {
	float: left;
	width: 100%;
	position: relative;		
}

#containerPlayFunGames .preload {
	position: relative;
	text-align: center;
	margin: 20px 0;
}

.fun-demo-games {
	padding: 2rem 0 3rem;
}

.fun-demo-games .title-fun-demo-games {
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	gap: 1rem;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
}

.fun-demo-games .title-fun-demo-games img {
	height: 3rem;
}

.fun-demo-games .title-fun-demo-games h1 {
	font-size: 2.5rem;
}

.fun-demo-games .search-fun-demo-games {
	margin-bottom: 1.5rem;
}

.fun-demo-games .search-fun-demo-games .input-group-text {
	background-color: #1b2a4d !important;
	border: var(--bs-border-width) solid var(--color-higlight-footer) !important;
	border-radius: var(--bs-border-radius-lg) !important;
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-right: none !important;
}

.fun-demo-games .search-fun-demo-games .form-control {
    background-color: #1b2a4d !important;
    border: var(--bs-border-width) solid var(--color-higlight-footer) !important;
    border-radius: var(--bs-border-radius-lg) !important;
    font-size: 1.25rem !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-left: 0 !important;
    margin-left: 0 !important;
	padding-left: 0 !important;
}

.fun-demo-games .search-fun-demo-games .form-control::placeholder {
	color: #848484;
}

.fun-demo-games .content-fun-demo-games {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	grid-column-gap: 0.625rem;
	grid-row-gap: 1rem;
	grid-auto-flow: dense;
	padding-bottom: 2rem;
	margin-bottom: 2rem;
	position: relative;
	min-height: 45px;
}

.fun-demo-games .content-fun-demo-games .loader, 
.fun-demo-games .content-fun-demo-games .no-results {
	height: 24px;
	position: absolute;
	left: 0;
	right: 0;
	text-align: center;
	color: var(--color-gray-light);
}

.fun-demo-games .item-fun-demo-game {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	background: linear-gradient(to bottom, #009eff 0%,rgba(212,185,210,0) 35%,rgba(255,255,255,0) 50%,rgba(212,185,210,0) 65%, #0267a6 100%);
	padding: 0.125rem;
	border-radius: 0.313rem;
}

.fun-demo-games .inner-fun-demo-game {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	background: transparent;
	border-radius: 0.125rem;
}

.fun-demo-games .item-fun-demo-game .content {
	
}

.fun-demo-games .item-fun-demo-game .subtitle {
	padding: 0.188rem 0.313rem;	
}

.fun-demo-games .item-fun-demo-game .subtitle h5, 
.fun-demo-games .item-fun-demo-game .subtitle p, 
.fun-demo-games .item-fun-demo-game .play-fun-demo-game h5 {
	font-family: 'PlayRegular';
	text-overflow: ellipsis !important;
	overflow: hidden !important;
	white-space: nowrap !important;
	text-align: center;
}

.fun-demo-games .item-fun-demo-game .subtitle h5, 
.fun-demo-games .item-fun-demo-game .play-fun-demo-game h5 {
	font-size: .875rem;
	line-height: normal;
	color: var(--color-main);
}

.fun-demo-games .item-fun-demo-game .subtitle p {
	font-size: .5rem;
	margin-bottom: 0;
	color: var(--color-cyan-main);	
}

.fun-demo-games .item-fun-demo-game:hover .content, 
.fun-demo-games .item-fun-demo-game:hover .subtitle {
	filter: blur(.313rem);
}

.fun-demo-games .item-fun-demo-game .play-fun-demo-game {
	display: none;
}

.fun-demo-games .item-fun-demo-game:hover .play-fun-demo-game {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 0.625rem;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-direction: column;
	border-radius: 0.125rem;
	/*backdrop-filter: blur(.313rem);*/
	background-color: rgba(255, 255, 255, 0.15);
}

.btn-play {
	width: 3.125rem;
	height: 3.125rem;
	font-size: 1.875rem;
	padding: .313rem .938rem;
	border-radius: 3.125rem;
	text-align: center;
	display: flex;
	align-content: center;
	align-items: center;
	text-align: center;
}

.btn-trans,
.btn-trans:focus {
	background-color: transparent;
	border-color: var(--color-main);
	color: var(--color-main);
}

.btn-trans:hover {
	background-color: var(--color-main);
	color: var(--color-dark-gray);
}

.fun-demo-games .item-fun-demo-game .play-fun-demo-game > * + * {
	margin-top: .75rem;
}

.fun-demo-games .item-fun-demo-game .play-fun-demo-game h5 {
	width: 100%;
	padding: 0 0.625rem;
}

.fun-demo-games .loadmore-fun-demo-games {
	text-align: center;
}

@media(max-width: 1199px) {
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(6, 1fr);	
	}
}

@media(max-width: 991px) {
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(4, 1fr);	
	}
}

@media(max-width: 767px) {
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(3, 1fr);	
	}
}

@media(max-width: 480px) {
	.fun-demo-games .content-fun-demo-games {
		grid-template-columns: repeat(2, 1fr);	
	}
}

/*** PLAY ON MOBILE ***/

.play-on-mobile, 
.play-on-mobile .left-play-on-mobile, 
.play-on-mobile .right-play-on-mobile, 
.play-on-mobile .icon-play-on-mobile, 
.play-on-mobile .content-play-on-mobile, 
.play-on-mobile .title-play-on, 
.play-on-mobile .subtitle-play-on, 
.play-on-mobile .action-play-on, 
.play-on-mobile .store-play-on {
	float: left;
	width: 100%;
	position: relative;	
}

.play-on-mobile {
	background-image: url('../images/bg/bg-games.webp?v2');
	background-size: cover;
	background-position: left bottom;
	background-repeat: no-repeat;
	
	padding: 5rem 0 3rem;
}

.play-on-mobile .left-play-on-mobile, 
.play-on-mobile .right-play-on-mobile {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
}

.play-on-mobile .left-play-on-mobile {

}

.play-on-mobile .right-play-on-mobile {
	
}

.play-on-mobile .icon-play-on-mobile {
	
}

.play-on-mobile .content-play-on-mobile {
	text-align: center;
}

.play-on-mobile .title-play-on {
	
}

.play-on-mobile .title-play-on h1 {
	font-family: 'GothamBold';
	font-size: 5rem;
	line-height: 4.5rem;
	text-transform: uppercase;
}

.play-on-mobile .title-play-on h1 small {
	font-family: 'BebasRegular';
	font-size: 4rem;
}

.play-on-mobile .subtitle-play-on {
	font-size: 1.5rem;
	margin-top: .75rem;
	margin-bottom: 1rem;
}

.play-on-mobile .action-play-on {
	
}

.play-on-mobile .store-play-on {
	
}

.play-on-mobile .action-play-on > a {
	padding-left: 0;
	padding-right: 0;
	width: 200px;
	display: block;
	margin: auto;
}

.play-on-mobile .store-play-on > a {
	width: 200px;
	display: block;
	margin: auto;
}

.play-on-mobile .store-play-on img {
	margin: auto;
}

@media(max-width: 991px) {
	.play-on-mobile {
		padding: 3rem 0 1.5rem;
	}
	
	.play-on-mobile .title-play-on h1 {
		font-size: 4rem;
		line-height: 3.5rem;
	}
	
	.play-on-mobile .title-play-on h1 small {
		font-size: 3rem;
	}
	
	.play-on-mobile .subtitle-play-on {
		font-size: 1.125rem;
		margin-top: .625rem;
		margin-bottom: 0rem;
	}
	
	.play-on-mobile .left-play-on-mobile {
		margin-top: -1.5rem;
	}
	.play-on-mobile .action-play-on > a,
	.play-on-mobile .store-play-on > a {
		width: 170px;
	}
}
@media(max-width: 767px) {
	.play-on-mobile {
		padding: 2em 0 1em;
	}
	
	.play-on-mobile .left-play-on-mobile {
		margin-top: 0;
	}
	
	.play-on-mobile .title-play-on h1 {
		font-size: 3rem;
		line-height: 2.5rem;
	}
	
	.play-on-mobile .title-play-on h1 small {
		font-size: 2rem;
	}
	
	.play-on-mobile .subtitle-play-on {
		font-size: 1rem;
	}
	
	.play-on-mobile .right-play-on-mobile {
		margin-top: 2rem;
	}
}
@media(max-width: 575px) {
	.play-on-mobile .icon-play-on-mobile img {
		width: 85% !important;
	}
	.play-on-mobile .icon-play-on-mobile {
		margin-top: 1.5em;
	}
		
	.play-on-mobile .right-play-on-mobile {
		margin-top: 0;
	}
}
@media(max-width: 480px) {
}

/************************************
HOMEPAGE MOBILE REGISTER LOGIN BUTTON
*************************************/

.mobile-register-button {
	width: 100%;
	margin-left: 0;
}
.mobile-register-button .btn, 
.login-sidebar .login-header .btn {
	border-radius: 0;
}
.btn-mrb {
	font-size: 1.4em;
}
.mrb-signup {
	
}
.mrb-signup:hover {
	
}
.mrb-signin {
}
.mrb-signin:hover {
}