/* latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 300;	
	font-display: swap;
	src: local('Roboto Light'), local('Roboto-Light'), url(/assets/isacmart/fonts/Roboto/Roboto-Light.ttf) format('truetype');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: local('Roboto'), local('Roboto-Regular'), url(/assets/isacmart/fonts/Roboto/Roboto-Regular.ttf) format('truetype');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: local('Roboto Medium'), local('Roboto-Medium'), url(/assets/isacmart/fonts/Roboto/Roboto-Medium.ttf) format('truetype');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: local('Roboto Bold'), local('Roboto-Bold'), url(/assets/isacmart/fonts/Roboto/Roboto-Bold.ttf) format('truetype');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: local('Roboto Black'), local('Roboto-Black'), url(/assets/isacmart/fonts/Roboto/Roboto-Black.ttf) format('truetype');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.gj-textbox-md {
	padding: 9px 0px !important;
}

.gj-timepicker-md [role=right-icon],
.gj-datepicker-md [role=right-icon] {
	top: 5px !important;
}

.gj-timepicker-md [role=right-icon],
.gj-datepicker-md [role=right-icon] {
	top: 5px !important;
}

body,
html {
	height: auto;
	margin: 0;
	background: #fff;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	color: #4d4d4d;
	font-size: 15px;
	user-select: none;
	-webkit-user-select: none; /*Safari*/
	-moz-user-select: none; /*Firefox*/
}

ul {
	list-style-type: none;
}

a {
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	text-decoration: none;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	margin: 0;
}

/*img control*/
.fill {
	object-fit: fill;
}

.contain {
	object-fit: contain;
}

.cover {
	object-fit: cover;
}

.none {
	object-fit: none;
}

.scale-down {
	object-fit: scale-down;
}

.object-position {
	object-position: cover;
	object-position: -50% -50%;
}

.flex-box-wrap {
	display: flex;
	flex-flow: row wrap;
}

.flex-box-nowrap {
	display: flex;
	flex-flow: row nowrap;
}

.flex-box-nowrap-center {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
}

.flex-box-center {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.flex-box-start {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}

.flex-box-end {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-end;
}

.anchor {
	top: -57px;
	display: block;
	position: relative;
	visibility: hidden;
}

.disable-link {
	pointer-events: none; 
	cursor: pointer;
}

.btn:focus,
.navbar-toggler {
	outline: none !important;
	box-shadow: none !important;
}

.form-control:focus,
.form-select:focus {
	border: 1px solid #e6e6e6;
	outline: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.form-control {
	border: 1px solid #e6e6e6;
}

.search-wrap .form-control {
	border-radius: 3px;
	border: 1px solid #ced4da !important;
	border-right: 0 !important;
	background: #fff;
}

.search-wrap .form-control:focus {
	outline: none !important;
	box-shadow: none !important;
}


.search-wrap ::-webkit-input-placeholder {
	color: #b3b3b3;
}

.search-wrap :-moz-placeholder {
	color: #b3b3b3;
}

.search-wrap ::-moz-placeholder {
	color: #b3b3b3;
}

.search-wrap :-ms-input-placeholder {
	color: #b3b3b3;
}


.isac-text-primary {
	color: #381a5a;
}

/*isac navbar*/
.isac-topbar {
	background: #fff;
	background-image: url("../images/header_bg.png");
	position: sticky;
	top: -40px;
	z-index: 999;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.isac-topbar .navbar-brand {
	margin: 0px!important;
	height:40px!important;
}

.topbar-button {
	display: inline-block;
	color: #050505;
	border: 0;
	background: transparent;
	padding: 0 8px;
	text-align: center;
	vertical-align: middle;
}

.topbar-button:last-child {
	padding-right: 0;
}

.topbar-button img:hover {
	filter: brightness(0.9);
}


.icon-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0;
}

.inbox-msg {
	color: #fff;
	background: #ff0000;
	font-size: 10px;
	border-radius: 50%;
	height: 10px;
	width: 10px;
	position: absolute;
	top: 0px;
	right: 0px;
	text-align: center;
	z-index: 999;
}

.system-icon {
	display: flex;
	align-items: center;
	
}

.system-icon .col-12 [class*="col-"] {
	padding-bottom: 14px;
}

/* .system-icon .col-2 {
	padding: 2px;
	filter: grayscale(1) brightness(1);
	height: 30px;
	width:16.666666%;
} */

.system-icon .col-2 {
	padding: 2px;
	height: 30px;
	width:20%;
}

.system-icon .col-2 img{
	filter: grayscale(1) brightness(1);
}

.system-icon .col-2:hover {
	padding: 2px;
	background: #f2f2f2;
	align-items: center;
	border-radius: 0px;
}

/* .system-icon .col-2.active {
	opacity: 100% !important;
	border-bottom: 2px solid #8c77ab;
	-webkit-filter: grayscale(0) !important;
	filter: grayscale(0) !important;
	background: transparent !important;
	border-radius: 0 !important;
} */

.system-icon .col-2.active {
	opacity: 100% !important;
	border-bottom: 2px solid #8c77ab;
	background: transparent !important;
	border-radius: 0 !important;
}

.system-icon .col-2.active img {
	-webkit-filter: grayscale(0) !important;
	filter: grayscale(0) !important;
}

@keyframes bounce {
	0%, 100% { transform: translateY(0) scale(1); }
	50% { transform: translateY(-4px) scale(1); }
}

.ani-new {
	position:absolute;
	font-size:9px;
	font-weight:bold;
	background:#C80C25;
	color:#fff;
	border-radius:50px;
	padding:0px 3px;
	top:3px;
	right:0;
	animation: bounce 0.5s ease-in-out infinite;
	z-index:9;
}

.sticky-wallet {
	background:white;
	border-top:1px solid #eee;
	border-bottom:1px solid #eee;
}

.wallet-wrap [class*="col"] {
	padding: 0;
	color: #4e406b;
	position: relative;
	font-size: 12px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	letter-spacing: 1px;
}

.wallet-wrap [class*="col"].active {
	background:#f7f4fc;
}

.isac-3rd-bar {
	display: flex;
	flex-flow:row nowrap;
	align-items: center;;
	width:100%;
	margin:auto;
}

@media (min-width: 810px) {
	.isac-3rd-bar {
		width:810px;
	}
}

.isac-wallet{
	display: flex;
	flex-flow:row wrap;
	flex-grow:1;
}

.isac-wallet a {
	padding:0 4px;
}

.isac-wallet a:first-child {
	padding-left:0;
}

.isac-wallet a {
	filter: grayscale(0.7) hue-rotate(220deg);
}

.isac-wallet a.active {
	filter: grayscale(0);
}

.isac-wallet a.active .menu-name {
	color:#8d67a9 !important;
}

.menu-name {
	font-size:9px;
	color:#999;
	margin-right:5px;
}

@media (min-width: 576px) {
	.isac-wallet a {
		padding:0 4px;
	}
}

.vip-asset {
	display: flex;
	flex-flow:row wrap;
	flex:0 1;
	margin-left:8px;
}

.vip-level {
	width:100%;
	display: flex;
	flex-flow:row nowrap;
	align-items: center;
	justify-content:flex-end;
	color:#333;
	font-size:12px;
}

@media (min-width: 992px) {
	.vip-asset {
		display: block;
		margin-right:8px;
		margin-left:0px;
	}

	.vip-level {
		justify-content:flex-start;
	}
}

.vip-level .level{
	margin-right:4px;
}

.vip-level .id{
	color:#57446D;
	text-transform: uppercase;
}

.vip-amount {
	width:100%;
	display: flex;
	flex-flow:row nowrap;
	justify-content:flex-end;
	color:#1E1E1E;
	font-weight:bolder;
	font-size:14px;
}

.wallet-wrap [class*="col"]:after {
	content: '';
	height: 15px;
	border-right: 0.2px solid #b4acca;
	background-color: #b4acca;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translate(-50%, -50%);
}

.wallet-wrap [class*="col"]:last-child:after {
	border-right: 0.2px solid #fff;
}

/*content*/
.divide-line {
	margin: 0;
	background-color: #cbcad0 !important;
	height: 6px !important;
	opacity: 1;
}

.admin-wrap {
	display: flex !important;
	flex-flow: row wrap;
	justify-content: center;
	flex: 0 0 auto;
	width: 100%;
}

.profile-wrap {
	display: flex !important;
	flex-flow: row wrap;
	justify-content: center;
	flex: 0 0 auto;
	width: 100%;
	height: auto;
}

.content-wrap {
	display: flex !important;
	flex-flow: row wrap;
	justify-content: center;
	flex: 0 0 auto;
	width: 100%;
}

.content-wrap .profile,
.admin-wrap .profile {
	font-size: 15px;
	margin-bottom: 0;
	line-height: 0.8;
	font-weight: 600 !important;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.content-wrap span {
	font-size: 13px;
	color: #65676b;
}

.content-wrap p {
	font-size: .9375rem;
	color: #050505;
	margin-bottom: 0;
}

.dropdown-menu {
	position: absolute;
	z-index: 1000;
	display: none;
	min-width: 10rem;
	padding: 0;
	margin: 0;
	font-size: .9375rem;
	color: #212529;
	text-align: left;
	list-style: none;
	background-color: #fff;
	background-clip: padding-box;
	border: 0 solid rgba(0, 0, 0, .15);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	border-radius: 8px;
}


.content-wrap .dropdown-item {
	padding: 3px;
	text-align: center;
}

.content-wrap .dropdown-item:hover {
	background: #e4e6e9;
}

.avatar-select .dropdown-item:hover {
	background: transparent;
}

.img-select .dropdown-menu.show {
	display: flex;
}

.img-select .dropdown-item {
	display: hide;
	width: 100%;
	padding: 0;
	clear: both;
	color: #212529;
	white-space: wrap;
	background-color: transparent;
}

.img-select .dropdown-menu {
	width: auto;
	max-width: 350px;
	max-height: 300px;
	overflow-y: auto;
	justify-content: flex-start;
}

.img-select li {
	flex: 0 0 20%;
	text-align: center;
	padding: 4px;
}


.add-photo2 input {
	position: absolute;
	margin: 0;
	padding: 48px 0 0 0;
	left: 18px;
	width: 48px !important;
	outline: none;
	opacity: 0;
}

.add-photo2 input[type=file] {
	height: 1px;
}

.dropdown-divider {
	margin: 4px 8px;
	border-top: 1px solid #ccc;
}

.option-button {
	width: 20px;
	height: 20px;
	border: 0;
	background: transparent;
	padding: 0 4px;
	text-align: center;
	display: flex;
	align-items: center;;
}

.option-button:hover {
	width: 20px;
	height: 20px;
	background: #f2f2f2;
	border-radius: 50%;
}

.photo-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0;
	background:#000;
}

.photo-column-1 {
	height: 360px;
	border-right: 2px solid #fff;
	cursor: pointer;
}

.photo-column-1:last-child {
	border-left: 2px solid #fff;
	border-right: 0;
	cursor: pointer;
}

.photo-column-2 {
	height: 180px;
	border-bottom: 2px solid #fff;
	cursor: pointer;
}

.photo-column-3 {
	height: 120px;
	border-bottom: 2px solid #fff;
	cursor: pointer;
}

.photo-column-2:last-child,
.photo-column-3:last-child {
	border-bottom: 0;
	cursor: pointer;
}

.photo-row-0 {
	height: auto;
	cursor: pointer;
	width: 100%;
}

.photo-row-1 {
	height: 260px;
	border-bottom: 2px solid #fff;
	cursor: pointer;
}

.photo-row-2 {
	height: 180px;
	border-right: 2px solid #fff;
	cursor: pointer;
}

.photo-row-2:first-child {
	border-right: 0;
	cursor: pointer;
}

.photo-row-2:last-child {
	border-right: 0;
	cursor: pointer;
}

.col-6.photo-row-2 {
	height: 180px;
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	cursor: pointer;
}

.col-6.photo-row-2:nth-child(2n+2) {
	border-right: 0px solid #fff;
	cursor: pointer;
}

.photo-row-3 {
	height: 100px;
	border-right: 2px solid #fff;
	cursor: pointer;
}

.photo-row-3:last-child {
	border-right: 0;
	cursor: pointer;
}

.photo-wrap img {
	object-fit: contain;
	width: 100%;
	height: 100%;
	object-position: top center;
	max-height:400px;
}

.avatar {
	width: 30px !important;
	height: 30px !important;
	background: transparent !important;
}

.event-card {
	margin: -10px;
	display: flex;
	flex-flow: row wrap;
	background: #fff;
	padding: 12px 16px;
	;
	border-radius: 3px;
	justify-content: center;
}

.dark-font-14 {
	font-size: .9375rem;
	font-weight: 600;
	color: #050505;
}

.light-font-14 {
	font-size: .9375rem;
	color: #65676b;
}

.dark-font-12 {
	font-size: .8125rem;
	font-weight: 600;
	color: #050505;
}

.light-font-12 {
	font-size: .8125rem;
	color: #65676b;
}

.profile-tag {
	font-size: 17px !important;
	font-weight: 600;
}

.tag-font {
	font-size: 15px !important;
}

.tag-button {
	color: #999;
	border: 1px solid #999;
	border-radius: 3px;
	background: #fff;
	text-transform: uppercase;
	padding: 6px 8px;
	font-size: 10px;
}

.tag-button:hover {
	color: #999;
	background: #f2f2f2;
}

.content-section>.container-lg>.p-3 {
	padding: 8px 12px !important;
}

.status-wrap [class*="col-"] {
	color: #65676b;
	font-size: .8125rem;
}

.status-wrap img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	opacity: 0.6;
}

.status-wrap span {
	opacity: 0.6;
}

.button-wrap [class*="col-"] {
	background: #fff;
	display: flex;
	align-items: start;
	/* padding: 3px; */
}

.button-wrap .status-button.active {
	color: #8c77ab;
}

.button-wrap .status-button img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
}

.button-wrap .status-button.active img {
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
}

.status-button {
	width: 100%;
	color: #777;
	border: 0;
	border-radius: 0;
	text-transform: capitalize;
	padding: 0;
	font-size: .9375rem;
	text-align: center;
	background: transparent;
}

.status-button img{
	opacity:0.7;
}

.status-button:hover {
	background: #f2f2f2;
	align-items: center;
	/* border-radius: 8px; */
}

/*slider*/
.slider-section .swiper,
.option-wrap .swiper {
	width: 100%;
	height: 100%;
}

.slider-section .swiper-slide,
.option-wrap .swiper-slide {
	text-align: center;
	font-size: 18px;
	background: transparent;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}

.slider-section .swiper-slide img,
.option-wrap .swiper-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.content-section {
	white-space: none !important;
	background:white;
}

.content-section .container-lg {
	padding: 0;
}

.container-fluid {
	overflow: hidden;
}


.content-section p {
	margin: 0;
	line-height: 1.1;
}

.need-space {
	padding: 0 !important;
}

/*admin*/
.main-button {
	width: 100%;
	color: #fff;
	border-radius: 3px;
	background: #8c77ab;
	padding: 8px 12px;
	font-size: .9375rem;
	border: 0;
}

.main-button:hover {
	filter: brightness(0.9);
}

.post-button {
	width: 100%;
	color: #fff;
	border-radius: 3px;
	background: #381a5a;
	padding: 6px 12px;
	font-size: 16px;
	border: 0;
}

.post-button:hover {
	background: #2b1346;
}

.new-profile-button {
	width: 100%;
	color: #4d4d4d;
	border-radius: 3px;
	background: #fff;
	padding: 6px 12px;
	font-size: 16px;
	border: 1px solid #ced4da;
}

.save-button {
	width: 100%;
	color: #fff;
	border-radius: 3px;
	background: #381a5a;
	padding: 6px 12px;
	font-size: 16px;
	border: 0;
}

.save-button:hover {
	background: #25113c;
}

.cancel-button {
	width: 100%;
	color: #65676b;
	border-radius: 0px;
	background: #fff;
	padding: 6px 12px;
	font-size: 16px;
	border: 0;
	border-top: 1px solid #ddd;
}

.search-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0;
}

.search-wrap .input-group-prepend {
	display: flex;
	background: #fff;
	padding: 0 12px;
	align-items: center;
	border-radius: .25rem;
	border: 1px solid #ced4da;
	border-left: 0;
}

.search-obj {
	display: flex;
	width: 100%;
	padding: 12px 8px;
	align-items: center;
}

.search-obj:hover {
	background: #e4e6e9;
	align-items: center;
	border-radius: 8px;
}

.search-obj.recently-search {
	background: transparent !important;
	padding: 0 12px;
}

.see-all {
	font-size: .9375rem;
	color: #4e406b;
	padding: 8px;
}

.see-all:hover {
	background: #f2f2f2;
	align-items: center;
	border-radius: 8px;
}

.profile-name {
	font-size: .9375rem;
	color: #050505;
	line-height: 1;
}

.popular-now {
	font-size: .8125rem;
	color: #65676b;
}


/*modal animation*/
.modal.fade-scale .modal-dialog {
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-webkit-transition: all 0.4s ease-in;
	-moz-transition: all 0.4s ease-in;
	-o-transition: all 0.4s ease-in;
	transition: all 0.4s ease-in;
}

.modal.fade-scale.show .modal-dialog {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}

/*modal*/
#admin-modal textarea {
	outline: none;
	border: 0;
	width: 100%;
}

textarea {
	resize: none;
}

textarea::-webkit-input-placeholder {
	color: #ccc;
}

textarea:-moz-placeholder {
	color: #ccc;
}

textarea::-moz-placeholder {
	color: #ccc;
}

textarea:-ms-input-placeholder {
	color: #ccc;
}

.form-wrap ::-webkit-input-placeholder {
	color: #ccc;
	font-size: .9375rem;
}

.form-wrap :-moz-placeholder {
	color: #ccc;
	font-size: .9375rem;
}

.form-wrap ::-moz-placeholder {
	color: #ccc;
	font-size: .9375rem;
}

.form-wrap :-ms-input-placeholder {
	color: #ccc;
	font-size: .9375rem;
}

.form-wrap .pin::-webkit-input-placeholder {
	color: #65676b;
	font-size: .9375rem;
}

.form-wrap .pin:-moz-placeholder {
	color: #65676b;
	font-size: .9375rem;
}

.form-wrap .pin::-moz-placeholder {
	color: #65676b;
	font-size: .9375rem;
}

.form-wrap .pin:-ms-input-placeholder {
	color: #65676b;
	font-size: .9375rem;
}

.modal-header {
	display:flex;
	align-items: center;
	justify-content: center;
	padding: 8px 16px !important;
	color: #4d4d4d;
	background: #fff;
	font-size: 20px;
	font-weight: 500;
}

@media (min-width: 992px) {
	.modal-header {
		border-radius:10px 10px 0 0 !important;
	}
	 .modal-content {
		border-radius:10px !important;
	}
}

.notification-title {
	align-items: center;
	justify-content: flex-start;
	padding: 12px 12px 12px 16px;
	color: #000;
	background: #fff;
	border-bottom: 0;
}

.notification-wrap {
	width: 360px;
	max-height: 100%;
	overflow-y: auto;
	padding: 0px !important;
	padding-bottom: 16px !important;
	border: 0;
	box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
	margin-bottom: 0;
}

.notification-wrap h2 {
	font-size: 1.5rem;
	margin: 0;
}

.notification-wrap h5 {
	font-size: 1.0625rem;
	margin: 0;
}

.notification-wrap p {
	font-size: .9375rem;
	margin: 0;
}

.notification-block {
	padding: 6px 8px;
	margin: 4px 8px;
}

.notification-block:hover {
	background: #f2f2f2;
	border-radius: 8px;
}


.modal-header .main-button {
	font-size: .9375rem;
}

.modal-header .btn-close {
	display: flex !important;
	align-items: center !important;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 0;
	margin-left:auto;
	background: none;
	opacity: 1;
	outline: none !important;
	box-shadow: none !important;
	-webkit-filter: brightness(0.5) invert(0);
	filter: brightness(0.5) invert(0);
}

.modal-title {
	font-size: 20px;
	font-weight: 500;
}

.permission-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 12px 16px;
	margin: 0;
	width: 100%;
	align-items: center;
	text-align: center;
	font-size: .8125rem;
}

.permission-wrap label {
	cursor: pointer;
}

.btn-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 6px 16px;
	margin: 0;
	width: 100%;
	align-items: center;
	text-align: center;
	font-size: .9375rem;
}

.btm-navbar {
	color: #fff;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	padding: 6px 12px;
	background: #775d8a;
	margin: 0;
	width: 100%;
	text-align: center;
}

.btm-navbar [class*="col"] {
	opacity: 100%;
}

.btm-navbar [class*="col"].active {
	opacity: 100%;
}


.permission-wrap input[type="checkbox"] {
	vertical-align: middle;
	height: 14px;
	width: 14px;
	margin-right: 2px;
}

.modal-2 {
	position: fixed;
	top: auto;
	right: auto;
	left: auto;
	bottom: 0;
	width: 100%;
	margin: 0;
}

.top-line {
	flex: 0 0 auto;
	width: 16.66666667%;
	margin-top: 10px;
	margin-bottom: 24px;
	padding: 2px;
	background: #b4acca;
	cursor: pointer;
}

.top-line:hover {
	background: #b4acca;
	filter: brightness(0.8);
}

/*modal 2*/
.m2-bg {
	font-size: .9375rem;
	background: #f4f4fa;
	filter: drop-shadow(0 0px 8px rgba(0, 0, 0, 0.25));
}

.form-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 16px;
}


.form-wrap .form-group {
	padding-bottom: 16px;
}


.trp-button {
	border-radius: 0;
	background: transparent;
	border: 0;
}

.more-button {
	border-radius: 8px;
	background: transparent;
	border: 0;
}

.more-button:hover {
	background: #e4e6e9;
}

.plus-button img:hover {
	filter: brightness(0.9);
}

.plus-button {
	border-radius: 0;
	background: transparent;
	border: 0;
}


.admin-button {
	color: #ff0000;
	border-radius: 8px;
	background: transparent;
	padding: 8px 2px;
	border: 0px;
}

.admin-button:hover {
	background: #655276;
}

.vh-60 {
	height: 60vh !important;
}

.pin-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0;
}

.pin-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0 8px;
}

.pin-wrap .border-bottom {
	border-bottom: 1px solid #ced4da !important;
}

.pin-order {
	display: flex;
	align-items: center;
	width: 100%;
	border-bottom: 1px solid #ced4da;
	padding: 12px 16px;
}

.pin-label {
	font-size: .9375rem;
	color: #050505;
}

.pin-sort {
	font-size: .8125rem;
	color: #65676b;
}

.pin-order img {
	-webkit-filter: brightness(0.4);
	filter: brightness(0.4);
}

.date-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 16px;
}

.date-wrap .form-select {
	padding: 9px 20px 9px 9px;
	background-position: right 0.25rem center;
	font-size: 12px;
}

.option-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 12px;
}

.option-wrap [class*="col-"] {
	padding: 12px;
	text-align: left;
}


.layout-t1b2,
.layout-t1b3 {
	padding: 4px;
	transform: rotate(0deg);
	cursor: pointer;
}

.layout-l2r1,
.layout-l3r1 {
	padding: 4px;
	transform: rotate(90deg);
	cursor: pointer;
}

.layout-l1r2,
.layout-l1r3 {
	padding: 4px;
	transform: rotate(-90deg);
	cursor: pointer;
}

.progress {
	display: flex;
	height: 9px;
	overflow: hidden;
	font-size: .75rem;
	background-color: #fff;
	border: 1px solid #775d8a;
	border-radius: 0;
}

.bar-bg-color {
	background: #775d8a;
}

.category-wrap {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	padding: 12px 12px 0 12px;
	align-items: center;
}

.category-wrap [class*="col"] {
	flex: 1 1 auto;
	text-align: left;
	background: #fff;
	filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.25));
	padding: 8px 12px;
	border-radius: 3px;
	margin: 4px 1.5%;
}

.category-wrap .block {
	display: flex;
	flex-flow: row wrap;
	word-wrap: break-word;
}

.category-wrap .block img {
	flex: 0 1 auto;
	width: 24px;
}

.category-wrap .block .title {
	flex: 1 0 auto;
	padding-left: 5px;
}

.block .partner-img {
	height: 80px;
	object-fit: cover;
	width: 100%;
}

.partner-wrap {
	padding: 8px 12px 12px 12px;
}

.category-wrap .title {
	font-size: 13px;
	font-weight: 400;
	padding-top: 4px;
	color: #4d4d4d;

}

.category-wrap a {
	text-decoration: none;
	color: #4d4d4d;
}


.category-wrap .extra {
	font-size: .8125rem;
	color: #65676b;
}

.show-button {
	width: 100%;
	color: #65676b;
	border-radius: 3px;
	background: #e6e7eb;
	padding: 6px 12px;
	font-size: 16px;
	border: 0;
}

.tc-wrap {
	display: flex;
	flex-flow: row wrap;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

.tc-wrap hr {
	background: #ccc;
	opacity: 0.7;
	margin: 0;
	width: 100%;
}

.tc-wrap .card-body {
	background: #f4f4fa;
}

.tc-button {
	width: 100%;
	color: #65676b;
	border-radius: 0;
	background: transparent;
	padding: 12px 12px;
	font-size: .9375rem;
	border: 0px;
	text-align: left;
	position: relative;
}

.tc-wrap .card {
	border: 0;
}

/*media share*/
.media-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 12px 12px 40px 12px;
	text-align: center;
	align-items: center;
}

.media-wrap>[class*="col-"] {
	padding-bottom: 12px;
}

/*all modal*/
.bottom-css {
	bottom: 50px;
	position: absolute;
}

.bottom-css-2 {
	bottom: 0px;
	position: absolute;
}

.full-height-css {
	height: calc(100% - 50px);
}

/*upload photo*/
.add-photo-wrap {
	display: flex;
	flex-flow: row nowrap;
	padding: 16px;
}


.add-photo-wrap .form-group {
	padding-bottom: 16px;
}

.add-photo-wrap .add-photo {
	display: relative;
	width: 50%;
	height: 200px;
	border: 3px dashed #fff;
	background: #ececf3;
	border-radius: 8px;
}

.add-photo-wrap .add-photo:hover {
	background: #e6e6ef;
}

.add-photo-wrap .add-photo,
.add-photo-wrap input {
	cursor: pointer;
}

.add-photo-wrap .add-photo .content {
	width: 100%;
	height: 100%;
	text-align: center;
	color: #000;
	padding-top: 20%;
}

.add-photo-wrap .add-photo input {
	position: absolute;
	margin: 0;
	padding: 0;
	width: 85%;
	height: 300px;
	outline: none;
	opacity: 0;
}


@media (min-width: 992px) {
	.body {
		background: #fff!important;
	}

	.system-icon .col-2:hover {
		padding: 2px;
		background: #f2f2f2;
		height: 44px;
		align-items: center;
		border-radius: 0px;
	}

	.icon-wrap {
		display: flex;
		flex-flow: row wrap;
		height: 56px;
	}

	.system-icon .active {
		opacity: 100% !important;
		border-bottom: 2px solid #8c77ab;
		-webkit-filter: grayscale(0) !important;
		filter: grayscale(0) !important;
		background: transparent !important;
		height: 50px !important;
		border-radius: 0 !important;
	}

	.system-icon {
		display: flex;
		height: 50px;
		align-items: center;
	}

	.tag-button {
		color: #999;
		border: 1px solid #999;
		border-radius: 3px;
		background: #fff;
		text-transform: uppercase;
		padding: 6px 12px;
		font-size: .9375rem;
	}

	.content-section>.container-lg>.p-3 {
		padding: 16px !important;
	}

	.photo-wrap {
		background: #000;
		text-align: center;
	}

	.photo-wrap video {
		max-height: 500px !important;
	}

	.photo-wrap img {
		object-fit :contain;
		height:400px;
		max-height: 400px;
		object-position: center center;
		background: #000;
		cursor: pointer;
	}

	.photo-mask img {
		object-fit: contain !important;
	}

	.topbar-button {
		padding: 0 2px;
	}

	.bottom-css-2 {
		position: relative;
	}

	.web-wrap>[class*="col-"] {
		background: #f0f2f5;
	}

	.web-wrap section {
		background: #fff;
		border-radius: 8px;
	}

	.content-section {
		filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));
	}

	.fb-shadow {
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	}

	.photo-column-1 {
		height: 500px;
	}

	.photo-column-2 {
		height: 250px;
	}

	.photo-column-3 {
		height: 166.66666px;
	}

	.photo-row-0 {
		max-height: 600px;
	}

	.photo-row-1 {
		height: 300px;
	}

	.photo-row-2 {
		height: 250px;
	}

	.photo-row-3 {

		height: 200px;
	}

	.post-wrap {
		width: 44.7608%;
		padding: 0 12px;
	}

	.search-360 {
		display: flex;
		width: 24.1744% !important;
	}

	.w-360 {
		width: 23.6968% !important;
	}

	.r-360 {
		width: 27% !important;
	}

	.tag-wrap {
		width: 23.6969%;
		padding: 16px 0px 0px 8px;

	}

	.fixed-360 {
		position: fixed;
		width: 23.6969%;
		top: 66px;
		bottom: 0;
		overflow-x: hidden;
	}

	.r-tag-button {
		width: 100%;
		height: 50px;
		color: #050505;
		border: 0;
		border-radius: 0;
		text-transform: capitalize;
		padding: 8px 0px 8px 8px;
		font-size: .9375rem;
		text-align: left;
		background: transparent;
		font-weight: 500;
	}

	.r-tag-button:hover {
		background: #e4e6e9;
		align-items: center;
		border-radius: 8px;
	}

	.r-tag-button span {
		padding-left: 12px;
	}

	.button-wrap [class*="col-"] {
		border-radius: 8px;
	}

	.menu {
		flex: 0 0 auto;
		width: 64.666667% !important;
	}

	.system-icon {
		width: 45.6621% !important;
	}

	.system-icon .col-lg-8 [class*="col-"] {
		opacity: 50%;
		padding-bottom: 14px;
	}

	.isac-topbar {
		position: sticky;
		top: 0;
		z-index: 99;
		height: 50px;
	}

	.user-name {
		color: #65676b;
		font-size: .9375rem;
	}

	.end {
		display: flex;
		align-items: end;
		min-height: calc(100% - 1rem);
	}

	.modal-2 {
		position: relative;
		width: auto;
		pointer-events: none;
		max-width: 500px;
		margin: 1.75rem auto;
		height: calc(100% - 3.5rem);
	}


	.modal.fade-scale .modal-dialog {
		-webkit-transform: translateX(100%);
		-moz-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
		-webkit-transition: all 0.4s ease-in;
		-moz-transition: all 0.4s ease-in;
		-o-transition: all 0.4s ease-in;
		transition: all 0.4s ease-in;
	}

	.modal.fade-scale.show .modal-dialog {
		-webkit-transform: translateX(0);
		-moz-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
		-webkit-transition: all 0.4s ease-out;
		-moz-transition: all 0.4s ease-out;
		-o-transition: all 0.4s ease-out;
		transition: all 0.4s ease-out;
	}

	.web-wrap .modal-dialog {
		max-width: 600px;
	}

	.notification-width {
		max-width: 360px !important;
	}

	.m2-bg {
		border-radius: 4px;
	}

	.system-icon .col-2 {
		width: 20% !important;
	}

	.notification-wrap {
		width: 360px;
		min-height: 90vh;
		overflow-y: auto;
		padding: 0px !important;
		padding-bottom: 16px !important;
		border: 0;
		box-shadow: 0 .2rem 1rem rgba(0, 0, 0, .15) !important;
		margin-bottom: 0;
	}

	.notification-wrap h2 {
		font-size: 1.5rem;
		margin: 0;
	}

	.notification-wrap h5 {
		font-size: 1.0625rem;
		margin: 0;
	}

	.notification-wrap p {
		font-size: .9375rem;
		margin: 0;
	}

	.notification-block {
		padding: 6px 8px;
		margin: 8px 8px;
	}

	.notification-block:hover {
		background: #f2f2f2;
		border-radius: 8px;
	}

	.avatar-position {
		transform: translate3d(70px, 51px, 0) !important;
	}

	.icon-position {
		transform: translate3d(70px, 105px, 0) !important;
	}


}

#logo {
	width: 65px !important;
}
@media (max-width: 1104px) {
	.r-360 {
		width: 30% !important;
	}
}
@media (min-width: 992px) {
	#logo {
		width: 80px;
	}
}


@media (min-width: 992px) {

	.web-wrap .slider-section {
		background: transparent;
	}

	.inbox-msg {
		position: absolute;
		top: -3px;
		right: 3px;
		text-align: center;
	}

	.divide-line {
		margin: 0;
		background-color: #efeef2 !important;
		height: 3px !important;
		opacity: 1;
	}

}

/*place holder effect*/
@-webkit-keyframes placeholder-glow {
	50% {
		opacity: 0.2;
	}
}

@keyframes placeholder-glow {
	50% {
		opacity: 0.2;
	}
}

.placeholder-glow .placeholder {
	-webkit-animation: placeholder-glow 2s ease-in-out infinite;
	animation: placeholder-glow 2s ease-in-out infinite;
}

.placeholder {
	display: inline-block;
	min-height: 1em;
	vertical-align: middle;
	cursor: wait;
	background: #999;
	opacity: .5;
}

.filter-wrap .btn-check {
	position: absolute;
	clip: rect(0, 0, 0, 0);
	pointer-events: none;
}

.filter-wrap .btn-check[disabled]+.btn,
.filter-wrap .btn-check:disabled+.btn {
	pointer-events: none;
	filter: none;
	opacity: 0.65;
}

.filter-wrap .btn-check:focus+.btn,
.filter-wrap .btn:focus {
	outline: 0;
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.filter-wrap .btn:disabled,
.filter-wrap .btn.disabled,
.filter-wrap fieldset:disabled .btn {
	pointer-events: none;
	opacity: 0.65;
}

.filter-wrap .btn-primary {
	color: #666;
	background-color: #f2f2f2;
	border-color: #f2f2f2;
	border-radius: 5px;
	width: 100%;
}

.filter-wrap .btn-primary:hover {
	color: #666;
	background-color: #e4e6e9;
	border-color: #f2f2f2;
}

.filter-wrap .btn-check:focus+.btn-primary,
.filter-wrap .btn-primary:focus {
	color: #666;
	background-color: #f2f2f2;
	border-color: #f2f2f2;
	box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0);
}

.filter-wrap .btn-check:checked+.btn-primary,
.filter-wrap .btn-check:active+.btn-primary,
.filter-wrap .btn-primary:active,
.filter-wrap .btn-primary.active,
.filter-wrap .show>.btn-primary.dropdown-toggle {
	color: #775D8A;
	background-color: #e3dae9;
	border-color: #e3dae9;
}

.btn-check:checked+.btn-primary:focus,
.filter-wrap .btn-check:active+.btn-primary:focus,
.filter-wrap .btn-primary:active:focus,
.filter-wrap .btn-primary.active:focus,
.filter-wrap .show>.btn-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0);
}

.filter-wrap .btn-primary:disabled,
.filter-wrap .btn-primary.disabled {
	color: #666;
	background-color: #f2f2f2;
	border-color: #f2f2f2;
}

.filter-wrap.border-bottom {
	border-bottom: 1px solid #f2f2f2 !important;
}

.filter-wrap .title {
	font-weight: bolder;
	color: #999;
	font-size: 13px;
}

.filter-chip {
	flex: 1 0 33.33333%;
}

.filter-wrap .btn {
	font-size: 13px;
}

.reset-all {
	color: #775D8A;
	text-decoration: none;
	text-align: right;
}

/*thumb*/
.photo-mask {
	position: relative;
}

.photo-mask:after {
	font-size: 50px;
	font-family: 'Font Awesome 5 Free';
	font-weight: 400;
	content: "";
	height: 48px;
	width: 48px;
	background: url("../images/icon/video_play.png") no-repeat;
	margin: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 1;
	transition: all 0.6s ease;
	z-index: 99;
	color: #fff;
}

.primary-content {
	color: #4d4d4d;
}

.topup-wrap {
	display: flex !important;
	flex-flow: row wrap;
	justify-content: center;
	flex: 0 0 auto;
	text-align: center;
}

.topup-wrap [class*="col"] {
	padding: 12px 4px;
	color: #4d4d4d;
	font-size: 12px;
}

.check-profile-button {
	color: #775d8a;
	padding: 2px 8px;
	border-radius: 4px;
	border: 1px solid #775d8a;
	display: inline-block;
	text-decoration: none;
	font-size: 12px;
}

.check-profile-button:hover {
	color: #775d8a;
}

@media (max-width: 992px) {

	#media-share .modal-dialog,
	.modal-dialog {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 auto;
	}
}

@media (min-width: 768px) {

	#media-share .modal-dialog,
	#CaishenModal .modal-dialog {
		width: 768px;
		margin: 30px auto !important;
	}
}

/*b5on3*/
.b5on3-pop-shortcut {
	right: 0;
	left: auto;
}


.fb-dropdown {
	min-width: 300px !important;
	max-width: 300px !important;
}

.fb-dropdown .dropdown-item {
	display: block;
	width: 100%;
	padding: 14px 16px;
	clear: both;
	font-weight: 400;
	color: #212529;
	text-align: inherit;
	text-decoration: none;
	white-space: nowrap;
	background-color: transparent;
	border: 0;
}

.fb-dropdown li a:hover {
	background-color: #f2f2f2 !important;
	border-radius: 3px;
}

.mySwiper .swiper-slide {
	position: relative;
}

.mySwiper .swiper-slide {
	position: relative;
}

.mySwiper .game_bottom_info {
	z-index: 99;
	display: flex;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: pointer;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	height: 90px;
	text-align: left;
	font-size: 12px;
	position: absolute;
	width: 100%;
	bottom: 0;
	color: white;
	padding: 5px 10px;
	word-wrap: break-word !important;
	word-break: normal !important;
	white-space: normal !important;
	border-radius: 0 0 10px 10px;
	align-items: flex-end;
}

.mySwiper .game_bottom_info_vendor {
	background: #E2E2E2;
	color: #706F70;
	font-size: 12px;
	text-align: center;
	padding: 0px 8px;
	border-radius: 8px;
	position: absolute;
	bottom: 10px;
}

.app-fixed-popup {
	z-index: 9999;
	position: fixed;
	background: #f2f2f2;
	width: 95%;
	padding: 12px 12px;
	bottom: -16px;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 5px;
	display: flex;
	flex-flow: row wrap;
}

.app-fixed-popup:after {
	content: "";
	position: absolute;
	top: 99%;
	left: 50%;
	transform: translate(-50%, 0%);
	width: 0;
	border-top: 12px solid #f2f2f2;
	border-left: 16px solid transparent;
	border-right: 16px solid transparent;
}

.how-install-text {
	color: #4d4d4d;
	text-align: left;
	letter-spacing: -0.2px;
	padding-bottom: 10px;
}

.app-link-text a {
	color: #8c77ab;
	float: right;
	text-decoration: none;
	padding: 0 12px;
}

@media (min-width: 769px) {
	.app-fixed-popup {
		display: none;
	}
}

/*business coperation*/
.bc-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0 16px;
}

.bc-form ::-webkit-input-placeholder {
	color: #a6a6a6;
	font-size: .9375rem;
}

.bc-form :-moz-placeholder {
	color: #a6a6a6;
	font-size: .9375rem;
}

.bc-form ::-moz-placeholder {
	color: #a6a6a6;
	font-size: .9375rem;
}

.bc-form :-ms-input-placeholder {
	color: #a6a6a6;
	font-size: .9375rem;
}

.bc-input .form-control {
	border: 0;
	border-bottom: 1px solid #dfdfdf;
	border-radius: 0;
}

.bc-form .form-control {
	border: 1px solid #dfdfdf;
	border-radius: 0;
	height: 42px;
	margin-top: 6px;
}

.bc-dropdown .form-select {
	height: 48px;
	color: #8f8f8f;
}

.bc-dropdown .form-non-select {
	display: flex;
	width: 100%;
	padding: .375rem 2.25rem .375rem .75rem;
	-moz-padding-start: calc(0.75rem - 3px);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: right .75rem center;
	background-size: 16px 12px;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	height: 48px;
	color: #8f8f8f;
	align-self: center;
}

.bc-dropdown,
.bc-form {
	color: #4d4d4d;
}

.capital-wrap {
	width: 100%;
	display: flex;
	flex-flow: row wrap;

}

.capital-wrap .form-check-inline {
	margin-right: 0rem;
}

.capital-wrap .form-check-input {
	height: 16px;
	width: 16px;
	margin-top: 1.5px;
}

.capital-wrap .form-check-input[type=radio] {
	border-radius: 20%;
}

/*fix china modal*/
@media (min-width: 992px) {
	.modal-dialog {
		width: 760px !important;
		margin: 0px auto !important;
	}

	/* .modal {
		margin-top: 30px;
	} */

	#add-pin .modal-body,
	#add-tag .modal-body {
		background: #fff;
	}
}

.layout-thumb {
	display: flex;
	flex-flow: row nowrap;
}

.layout-thumb [class*="col"] {
	text-align: center;
}

/*gradient animation*/
.gradient_animation {
	background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	-webkit-animation: mask-gradient 3s ease infinite;
	animation: mask-gradient 3s ease infinite;
}

@-webkit-keyframes mask-gradient {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

@keyframes mask-gradient {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

.target {
	margin: 0;
	align-items: center;
}

.alpha-target {
	mask-mode: alpha;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-position: 25% 50%;
	mask-position: 25% 50%;
}

.isac-like-btn {
	font-weight: bold;
	position: relative;
	cursor: pointer;
	padding: 20px 20px 0 0;
}

.isac-like-box {
	height: 49px;
	width: auto;
	padding: 4px;
	position: absolute;
	top: -40px;
	left: -44px;
	box-shadow: 1px 1px 2px #cccccc, -1px 0px 2px #eeeeee;
	border-radius: 44px 44px;
	display: none;
	margin-bottom: 0;
	background: #fff;
	align-items: flex-end;
}

.isac-like-box.active {
	display: flex;
}

.like-box {
	display: block;
	cursor: pointer;
	width: 40px;
	height: 40px;
	opacity: 1;
	transform: scale(1, 1);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	margin: 0 3px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.isac-like {
	background-image: url('../images/reactions_like.png?1');
}

.isac-love {
	background-image: url('../images/reactions_love.png');
}

.isac-smile {
	background-image: url('../images/reactions_smile.png?1');
}


.isac-like:hover {
	width: 45px;
	height: 45px;
	background-image: url('../images/reactions_like.png?1');

}

.isac-love:hover {
	width: 45px;
	height: 45px;
	background-image: url('../images/reactions_love.png');
}

.isac-smile:hover {
	width: 45px;
	height: 45px;
	background-image: url('../images/reactions_smile.png?1');
}

/*payment method*/
.pm-wrap {
	display: flex;
	flex-flow: row wrap;
}

.pm-wrap .btn {
	width: 100%;
}

.pm-wrap .btn-outline-primary {
	color: #4d4d4d;
	background-color: #fff;
	border: 2px solid #aeaeae;
	opacity: 0.75;
	border-radius: 2px;
}

.pm-wrap .btn-outline-secondary {
	color: #4d4d4d;
	background-color: #fff;
	border: 2px solid #f4a1b9;
	opacity: 0.75;
	border-radius: 2px;
}

.pm-wrap .btn-check:active+.btn-outline-primary,
.pm-wrap .btn-check:checked+.btn-outline-primary,
.pm-wrap .btn-outline-primary.active,
.pm-wrap .btn-outline-primary.dropdown-toggle.show,
.pm-wrap .btn-outline-primary:active,
.pm-wrap .btn-check:active+.btn-outline-secondary,
.pm-wrap .btn-check:checked+.btn-outline-secondary,
.pm-wrap .btn-outline-secondary.active,
.pm-wrap .btn-outline-secondary.dropdown-toggle.show,
.pm-wrap .btn-outline-secondary:active {
	color: #4d4d4d;
	background-color: #fff;
	border-color: #584885;
	box-shadow: none !important;
}

.pm-wrap .btn-outline-primary:hover,
.pm-wrap .btn-outline-secondary:hover {
	color: #fff;
	background-color: #6E638B;
	border-color: #584885;
}

/*********************landing page*********************/
.pill-btn,
.showall-btn {
	display: flex;
	align-items: center;
	justify-content: center;
}

.scl-wrap {
	display: flex;
	overflow-x: scroll;
	flex-wrap: nowrap;
}

.scl-wrap [class*="col"]:first-child {
	padding-left: 8px;
}

.scl-wrap [class*="col"]:last-child {
	padding-right: 8px;
}

.scl-wrap [class*="col"] {
	padding: 0 3px;
}


.thumb-brd {
	border: 1px solid #CEC0D8;
}

.wd-wrap {
	color: #000;
	position: relative;
	display: flex;
	flex-flow: row wrap;
	background: url("../images/bank-slip.png") repeat-x center;
	background-size: contain;
	height: 80px;
	padding: 18px 8px;
	border-radius: 0 0 8px 8px;
	filter: drop-shadow(0 1px 2px rgb(0, 0, 0, 0.25));
}

.wd-id {
	font-size: 11px;
}

.wd-info {
	font-size: 10px;
	margin-bottom: 2px;
}

.wd-info-xs {
	font-size: 8px;
	margin-bottom: 2px;
	letter-spacing: -0.1px;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

a.wd-button {
	width: 100%;
	color: #fff;
	border-radius: 30px;
	background: rgb(162, 132, 186);
	background: linear-gradient(0deg, rgba(119, 93, 138, 1) 0%, rgba(162, 132, 186, 1) 100%);
	padding: 3px 12px;
	font-size: 12px;
	border: 0;
	text-decoration: none;
}

.wd-wrap .col-9:after {
	content: '';
	height: 50px;
	background-color: #dcdcdc;
	width: 0.2px;
	position: absolute;
	right: 28%;
	top: 54%;
	transform: translate(-50%, -50%);
}

.wd-user {
	font-size: 10px;
}

.g-sts {
	color: #4ECC22;
	font-weight: bolder;
}

@media (min-width: 768px) {
	#isaccoin-section .col {
		background: #fff;
	}

	#isaccoin-section img {
		height: 80px;
	}
}

@media (max-width: 768px) {
	#isaccoin-section img {
		width: 100%;
	}
}

#angpao-section {
	position: fixed;
	text-align: center;
	bottom: 100px;
	right: 0;
	z-index: 99;
}

.ap-wrap {
	justify-content: flex-end;
	padding: 0 8px;
}

.angpaoppz {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	width: auto;
	height: 60px;
	border-radius: 4px;
	padding: 0;
}

#assistant-section {
	width: 100%;
	position: fixed;
	text-align: center;
	bottom: 10px;
	z-index: 99;
}

@media (min-width: 1200px) {
	#assistant-section {
		width: auto;
		right: 0;
	}
}

.assistant-wrap {
	justify-content: flex-end;
	padding: 0 8px;
}

.assistant-wrap .cs {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	background: #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
	padding: 0 8px 10px 8px;
	width: 100%;
	height: 80px;
	border-radius: 4px;
	text-decoration: none;
	color:#000;
}

@media (min-width: 576px) {
	.assistant-wrap .cs {
		width: 360px;
	}
}

.cs .close-x {
	position: absolute;
	top: 0px;
	right: 10px;
	border: none;
	background: transparent;
}

.cs-info {
	font-size: 12px;
}

.wish-text {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cs-info-xs {
	font-size: 8px;
	margin-bottom: 2px;
	letter-spacing: -0.1px;
}

.je-btn {
	border-radius: 5px;
	;
	color: #fff;
	border: none;
	padding: 8px;
	background: rgb(162, 132, 186);
	background: linear-gradient(0deg, rgba(119, 93, 138, 1) 0%, rgba(162, 132, 186, 1) 100%);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
	font-size: 12px;
}

.bright-filter {
	opacity: 0.8;
	filter: brightness(0) invert(1);
	z-index: 99;
}

.dark-filter {
	opacity: 0.5;
	filter: invert(1);
	z-index: 99;
}

.dark-filter:before {
	background: rgba(0,0,0,0.2)
}


#eventpop_modal .modal-dialog {
	width: 330px !important;
}

#eventpop_modal .modal-body {
	min-height:500px; 
	position: relative; 
	height:500px; 
	background-color:#FFFFFF;
}

#eventpop_modal .modal-content, #eventpop_modal .modal-body, .event_img {
	border-radius: 10px;
}

.event_img {
	height: 100%;
	width: 100%;
	position: absolute;
	object-fit: cover;
}

#eventpop_modal .modal-body .loading{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	text-align: center;
	color:#775D8A;
	
}

/* 
.loading_ani {
	animation-name: Loading;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-delay: 0s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

@keyframes Loading {
	0%   {transform:rotate(0deg);}
	100% {transform:rotate(360deg);}
} */

.text_ani {
	animation: textblink 1s linear 0s infinite normal;
}

#eventpop_modal .modal-content {
	border: none;
}

@keyframes textblink {
	0%   {opacity: 1;}
	50% {opacity:0.2}
	100%   {opacity: 1;}
  }

.gameprt-wrap {
	background: #fff;
	text-align: center;
	padding: 0;
	display: flex;
	flex-flow: row nowrap;
}

.gameprt-wrap [class*='col'] {
	border: 1.5px solid #ddd;
	border-radius: 50px;
	margin: 5px 3px;
	background: #fff;
	padding:2px 3px;
	font-size:9px;
	color:#333;
	text-align: left;
	overflow: hidden;
    text-overflow: ellipsis;
	white-space: nowrap;
}

.gameprt-wrap [class*='col'].active {
	outline: solid 2px rgba(119,93,138,0.3) ;
}

.gameprt-wrap [class*='col']:first-child {
	margin-left: 0;
}

.gameprt-wrap [class*='col']:last-child {
	margin-right: 0;
}

.gameprt-wrap [class*='col'] img {
	width: 26px;
	height: 26px;
	border-radius: 50px;
	margin-right:2px;
}

.category-bar {
	position: sticky;
	top: 31px;
	z-index: 999;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.game-bar {
	position: sticky;
	top: 45px;
	z-index: 998;
}



@media (min-width: 992px) {
	.category-bar {
		position: sticky;
		top: 50px;
		z-index: 998;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0);
		border-bottom:1px solid #f4f4f4;
	}

	.game-bar {
		position: sticky;
		top: 38px;
		z-index: 998;
	}
}

.gs-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 0 12px;
	justify-content: end;
}

.gs-wrap .form-control {
	border-radius: 50px;
	border: 1px solid #ced4da !important;
	border-left: 0 !important;
	background: #fff;
	padding: 3px 0px;
}

.gs-wrap .form-control:focus {
	outline: none !important;
	box-shadow: none !important;
}

.gs-wrap ::-webkit-input-placeholder {
	color: #b3b3b3;
	font-size: 14px;
}

.gs-wrap :-moz-placeholder {
	color: #b3b3b3;
	font-size: 14px;
}

.gs-wrap ::-moz-placeholder {
	color: #b3b3b3;
	font-size: 14px;
}

.gs-wrap :-ms-input-placeholder {
	color: #b3b3b3;
	font-size: 14px;
}

.gs-wrap .input-group-prepend {
	display: flex;
	background: #fff;
	padding: 0 4px;
	align-items: center;
	border-radius: 50px;
	border: 1px solid #ced4da;
	border-right: 0;
}

.gs-wrap .input-group-prepend img {
	opacity: 0.5;
}

.gs-button {
	border-radius: 4px;
	background: #4C4168;
	text-align: center;
	padding: 3px 4px;
	cursor: pointer;
}

.gs-button img {
	filter: brightness(0) invert(1);
	object-fit: contain;
	width: 100%;
}

.gs-wrap [class*="gst"] {
	padding: 0 3px;
	flex: 0 0 50px;
}

.gs-wrap [class*="gst"]:last-child {
	padding-right: 0;
}

.gs-wrap [class*="src"] {
	flex: 1 0 0%;
	padding: 0 3px 0 0;
}

@media (min-width: 576px) {
	.gs-wrap [class*="src"] {
		flex: 0 0 160px;
		padding: 0 3px 0 0;
	}
}

.game-wrap {
	padding: 0 8px;
	display: flex;
	flex-flow: row wrap;

}

.game-wrap [class*="col"] .ag-thumb {
	height: 70px;
	border-radius: 10px;
	object-fit: cover;
	width: 100%;
	cursor: pointer;
}

.fav-icon {
	position: absolute;
	top: 1px;
	right: 8px;
	height: 20px;
	filter: grayscale(1) invert(1) brightness(4);
}

.fav-icon.check {
	filter: grayscale(0) invert(0);
}

.game-wrap [class*="col"] {
	padding: 0 4px;
	flex: 0 1 auto;
	width:33.333333%;
	position: relative;
}

@media (min-width: 576px) {
	.game-wrap [class*="col"] {
		width:20%;
	}
}

@media (min-width: 768px) {
	.game-wrap [class*="col"] {
		width:16.6666666%;
	}
}

@media (min-width: 992px) {
	.game-wrap [class*="col"] {
		width:12.5%;
	}
}

@media (min-width: 1200px) {
	.game-wrap [class*="col"] {
		width:10%;
	}
}

/*********************category bar*********************/
.main-ctg-wrap {
	background: #fff;
	text-align: center;
	flex-wrap: nowrap;
	text-transform: capitalize;
	font-size: 12px;
	justify-content: center;
}

.main-ctg-wrap a{
	text-decoration: none;
}

.main-ctg-wrap [class*="col"] {
	padding: 10px 15px;
	cursor: pointer;
	position: relative;
	width:auto;
	overflow: hidden;
    text-overflow: ellipsis;
	white-space: nowrap;
	color: rgba(151, 135, 184, 0.5);
}

.main-ctg-wrap [class*="col"].active {
	color: rgba(151, 135, 184, 1);
}

.main-ctg-wrap .swiper-slide:after {
	content: '';
    height: 15px;
    background-color: #b4acca;
    width: 0.2px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-50%, -50%);
}

.main-ctg-wrap .swiper-slide:last-child:after {
	content: '';
    height: 0px;
    width: 0;
}

.main-ctg-wrap:before {
	content: "";
	position: absolute;
	height: 2px;
	width: 100%;
	background: #ddd;
	left: 50%;
	bottom: -1px;
	transform: translate(-50%, -50%);
}

.main-ctg-wrap [class*="col"].active:after {
	content: "";
	position: absolute;
	height: 2px;
	width: 100%;
	background: #9787B8;
	left: 50%;
	bottom: -1px;
	transform: translate(-50%, -50%);
}

/*********************fb bar*********************/
.fb-ctg-wrap {
	background: #fff;
	text-align: center;
	flex-wrap: nowrap;
	padding: 4px 12px;
	text-transform: capitalize;
	font-size: 12px;
}

.fb-ctg-wrap [class*="col"] span.active .flex-shrink-1 {
	border-color: #B897C5;
	background: rgb(119,93,138);
	background: linear-gradient(28deg, rgba(119,93,138,1) 0%, rgba(180,115,207,1) 70%, rgba(223,133,255,1) 100%);
	color:#fff;
}

.fb-ctg-wrap [class*="col"] span.active .flex-grow-1 {
	color: #775D8A;
}

.fb-ctg-wrap [class*="col"] span.active img {
	filter: brightness(0) invert(1);
}

.fb-ctg-wrap [class*="col"] span {
	display: flex;
	align-items: center;
	justify-content: center;
	margin:0 2px;
	color:#666;
}

.fb-ctg-wrap [class*="col"] .flex-shrink-1 {
	width: auto;
	background: #fff;
	border-radius: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding:6px 12px;
	border:1.5px solid #EDDEF3;
}

.fb-ctg-wrap [class*="col"] img {
	height:22px;
}

.fb-ctg-wrap .swiper-slide {
	flex:0 1 auto;
	width:50px!important;
}

/*********************more option*********************/
.mo-wrap {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
}


.mo-wrap [class*="col"] {
	position: relative;
	padding: 11px 16px;
	border-bottom: 1px solid #F4F4F4;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	font-size: 13px;
	color: #65676B;
	flex: 1 0 auto;
	text-transform: capitalize;
}

.mo-wrap [class*="col"] a {
	text-decoration: none;
	display: flex;
	width:100%;
	color:#65676B;
}

.mo-wrap [class*="col"]:last-child {
	border-bottom: none;
}

.mo-wrap [class*="col-12"]:after {
	content: "\f054";
	right: 16px;
	position: absolute;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 10px;
	color: #4D4D4D;
}

.white-wrap  {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	padding: 6px 10px;
	margin:6px 0;
	font-size: 13px;
	flex: 1 0 auto;
	background: #fff;
	border-radius:5px;
	color:#666;
}

.white-wrap [class*="col"] {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
}

.btn-topup-now {
	display: flex;
	align-items: center;
	background-color: #8478A3;
	width: auto;
	height:28px;
	padding: 0 10px;
	border-radius: 50px;
	color: #fff !important;
	font-size:11px;
	text-align: center;
	cursor: pointer;
}

.auto-transfer .form-switch .form-check-input {
    height: 18px;
    width: 36px;
}

.auto-transfer .form-switch {
	padding-left: 0;
  }

.auto-transfer .form-switch .form-check-input:focus {
    border-color: rgba(0, 0, 0, 0.25);
    outline: 0;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(0,0,0,0.25)'/></svg>");
}

.auto-transfer .form-switch .form-check-input:checked {
    background-color: #FB6043;
    border-color: #FB6043;
    border: none;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(255,255,255,1.0)'/></svg>");
}

.cash {
	color:#666;
	margin:3px;
}

.cash-amount {
	color:#8478A3;
	font-weight: bolder;
	margin-right:auto;
}

.token-wrap {
	position: relative;
}

.token-wrap div{
	width:100%;
}

.token-wrap:after{
	content: "";
	position: absolute;
	top:50%;
	height: 34px;
	width: 1px;
	background: #ddd;
	transform: translate(-50%, -50%);
}

.token-wrap:first-child:after{
	width: 0px;
}

.token-type {
	color:#666;
	font-size:11px;
	margin-bottom:-5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.token-amount {
	color:#8478A3;
	font-weight: bolder;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


.mo-logout-btn {
	width: 100%;
	color: #fff !important;
	border-radius: 3px;
	background: #8978A7;
	padding: 6px;
	font-size: 14px;
	border: 0;
	text-transform: capitalize;
	justify-content: center;
}

.min-amount, .max-amount {
	position: relative;
	font-size:16px;
	color:#FB6043;
	font-weight: bolder;
}

.text-min, .text-max {
	position: absolute;
	top:-10px;
	right:0;
	font-size:10px;
	color:#333;
}


.amount-earn {
	color:#8978A7;
	margin-left:auto;
}

.mission-title {
	color:#333; 
	font-size:13px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width:100%;
}

.mission-remind {
	color:#666; 
	font-size:12px;
	letter-spacing:0.2px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width:100%;
}

.guide-step {
	color:#8578A2;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
	margin-bottom:20px;
}

.step-number {
	font-size:50px;
	font-weight:bolder;
}

.step-title {
	font-size:16px;
	font-weight:bolder;
	margin: 0px 4px;
	line-height:20px;
}

.step-info {
	font-size:11px;
	margin-top:-10px;
	line-height:14px;
}

.mission-tab {
	display:flex;
	flex-flow:row nowrap;
	white-space: nowrap;
	align-items: center;
	justify-content: center;
}

.mission-tab span {
	margin:10px;
	padding:0 6px;
	color:#666666;
	text-transform: capitalize;
	font-size:14px;
	text-align: center;
	position: relative;
	border-bottom: 2px solid transparent;
	cursor: pointer;
	position:relative;
}

.mission-tab span.active {
	border-bottom: 2px solid #B3A5C8;
}

.mission-tab span .reddot:after {
	content:"";
	position: absolute;
	top:2px;
	right:-5px;
	transform: translate(-50%, -50%);
	padding:1px;
	width:10px;
	height:10px;
	background: #f00;
	border-radius: 50px;
	border:1px solid #fff;
	display: block;
}

.total-earn {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	margin-bottom:8px;
}

.earn-bar {
	display:flex;
	flex-flow: row nowrap;
	position: relative;
	flex-grow:1;
	background:#fff;
	padding:3px 12px 3px 6px;
	font-size:12px;
	border-radius: 5px;
	color:#666;
	margin-right:6px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.coin {
	position: relative;
}

.earn-bar .coin .reddot:after {
	content:"";
	position: absolute;
	top:5px;
	right:-5px;
	transform: translate(-50%, -50%);
	padding:1px;
	width:8px;
	height:8px;
	background: #f00;
	border-radius: 50px;
	border:1px solid #fff;
	display: block;
}

.earn-arrow {
	position: absolute;
	top:50%;
	right:0;
	transform: translate(-50%, -50%);
}

.day-streak {
	flex-shrink:1;
	background:#fff;
	padding:3px 6px;
	font-size:12px;
	border-radius: 5px;
	color:#666;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.my-reward {
	display:flex;
	flex-flow: row wrap;
	background: #fff;
	text-align: center;
	margin-bottom: 8px;
	border-radius: 5px;
}

.reward-title {
	background:#8478A3; 
	color:#fff; 
	text-align:center; 
	font-size:12px;
	font-weight:bolder; 
	padding:3px 6px; 
	border-radius:5px 5px 0px 0px;
}

.day-wrap {
	display: flex;
	flex-flow:row wrap;
	padding: 0 4px;
	text-align:center;
}

.day-reward {
	margin:8px 2px;
 	flex-grow:1;
	font-size:12px;
	font-weight:bolder;
}

.day-reward:first-child {
	margin-left:0;
}

.day-reward:last-child {
	margin-right:0;
}

.reward-bg {
	padding: 2px 0;
	background:#F5F1FF;
	border-radius: 3px;;
}

.reward-bg.complete {
	background:#FBF9FF;
}

.btn-checkin {
	display: flex;
	align-items: center;
	justify-content: center;
	width:212px;
	height:32px;
	padding: 0 10px;
	margin:auto;
	border-radius: 50px;
	color: #fff !important;
	font-size:12px;
	font-weight: bolder;
	text-align: center;
	cursor: pointer;
	background: rgb(254,103,50);
	background: linear-gradient(52deg, rgba(254,103,50,1) 0%, rgba(253,66,87,1) 75%, rgba(255,76,193,1) 100%);
}

.cm-bk-again {
	color:#FB6043; 
	font-size:14px;
	font-weight:bolder;
	padding:5.5px 0
}

.total-mission {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	font-size:12px;
	font-weight:bolder;
	background:#fff;
	padding:3px 10px;
	margin-bottom:8px;
	border-radius:50px;
}

.special-default, .mission-default {
	filter:drop-shadow(0px 2px 2px rgba(0,0,0,0.1));
}

.ms_clickable{
	cursor: pointer;
}

.ms_clickable:focus, .ms_clickable:hover{
	background:#F6F2FF;
}

.ms_notclickable{
	pointer-events: none;
}

.mission-wrap {
	width:100%;
	display: flex;
	flex-flow: row nowrap;
	position: relative;
	background: #fff;
	padding:10px 12px;
	border-radius: 5px;
}

.banner-wrap {
	width:100%;
	display: flex;
	flex-flow: row nowrap;
	position: relative;
	background: #fff;
	padding:10px 12px;
	border-radius: 0 0 5px 5px;
}

.special-banner {
	border-radius: 5px 5px 0 0;
	object-fit: cover;
	height:80px;
	width:100%;
}

.special-default, .mission-default {
	width:100%;
	display: flex;
	flex-flow: row wrap;
	border-radius: 5px;
	margin-bottom:6px;
}

.mission-now {
	width:100%;
	font-size: 14px;
	color:#333;
}

.m-bonus-reward,.m-isaccoin-reward,.m-junket-reward,.m-nicoin-reward {
	display: flex;
	font-size: 12px;
	font-weight: bolder;
	flex-shrink:1;
	margin-right:4px;
}

.m-bonus-reward {
	color:#E53935;
}

.m-isaccoin-reward {
	color:#FAA300;
}

.m-junket-reward {
	color:#368B4C;
}

.m-nicoin-reward {
	color:#AC46FF;
}

.mission-type {
	position: absolute;
	top:0;
	right:0;
	color:#8478A3;
	background: #F6F2FF;
	padding:3px 18px;
	text-align: center;
	font-size:9px;
	font-weight: bold;
	border-radius: 0 5px 0 5px;
}

.btn-mission {
	display: flex;
	align-items: center;
	justify-content: center;
	width:72px;
	height:28px;
	padding: 0 10px;
	border-radius: 50px;
	color: #fff;
	font-size:12px;
	font-weight: bolder;
	text-align: center;
	cursor: pointer;
	background: rgb(254,103,50);
	background: linear-gradient(52deg, rgba(254,103,50,1) 0%, rgba(253,66,87,1) 75%, rgba(255,76,193,1) 100%);
}

.btn-complete {
	display: flex;
	align-items: center;
	justify-content: center;
	width:70px;
	height:26px;
	padding: 0 10px;
	border-radius: 50px;
	color: #FB6043;
	border:1px solid #FB6043;
	font-size:12px;
	font-weight: bolder;
	text-align: center;
	background: #fff;
}

.earn-date {
	display:flex;
	flex-flow: row wrap;
	width:100%;
	padding: 4px;
	font-size:14px;
	font-weight:bold;
	color:#333;
	border-bottom:1px solid #dee2e6;
}

.mission-history {
	display:flex;
	flex-flow: row nowrap;
	width:100%;
	padding: 8px;
	font-size:12px;
	border-bottom:1px solid #dee2e6;
}

.mission-history:last-child {
	border-bottom:0;
}

.te-mission, .te-date {
	font-size: 12px;
}

.te-mission {
	font-weight: bold;
	color:#333;
}

.te-date {
	color:#999;
}

.te-token {
	flex-grow:1;
	display: flex;
	flex-flow: row wrap;
	justify-content: end;
}

.r-text {
	flex-shrink: 1 !important;
	margin-right: 15px;
	color: #8A78A8 !important;
	cursor: pointer;
}

.r-info {
	flex-shrink: 1 !important;
	margin-right: 0px;
	color: #65676B !important;
	cursor: pointer;
}

.r-text-done {
	margin-right: 15px;
	background: #60B158;
	color: #fff !important;
	border-radius: 50px;
	text-align: center;
	width: 65px;
	cursor: pointer;
}

.r-text img {
	bottom: 13px;
	right: 95px;
	position: absolute;
}

.hs-wrap {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
}

.hs-wrap [class*="col"] {
	position: relative;
	padding: 3px 16px;
	border-bottom: 1px solid #F4F4F4;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	font-size: 13px;
	color: #65676B;
	flex: 1 0 auto;
	text-transform: capitalize;
}

.hs-wrap [class*="col"]:last-child {
	border-bottom: none;
}

.hs-wrap [class*="col-12"]:after {
	content: "\f054";
	right: 16px;
	position: absolute;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 10px;
	color: #4D4D4D;
}

.history_balance {
	background:#f4f4f4 ;
	font-size:14px!important;
}

.history_info .name {
	flex: 0 0 auto;
    width: 33.33333333%;
	text-align: left;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history_info .date {
	flex: 0 0 auto;
    width: 33.33333333%;
	text-align: center;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history_info .balance {
	flex: 0 0 auto;
    width: 33.33333333%;
	text-align: right;
}

/*********************me page*********************/
.me-wrap {
	display: flex;
	flex-flow: row wrap;
	padding: 12px;
	align-items: center;
}

.txt-id {
	color: #65676B;
	font-size: 14px;
}

.txt-lvl {
	color: #8978A7;
	font-size: 14px;
}

.info-tt {
	display: flex;
	flex-flow: row wrap;
	padding: 10px 12px 0px 12px;
	align-items: center;
	font-size: 15px;
	width: 100%;

}

.info-dt {
	display: flex;
	flex-flow: row wrap;
	padding: 12px 34px 12px 12px;
	align-items: center;
	border-bottom: 1px solid #F4F4F4 ;
}

.info-dt .flex-grow-1, .info-dt .flex-shrink-1 {
	font-size: 12px;
	color:#65676B;
}

.info-dt:after {
	content: "\f054";
	right: 16px;
	position: absolute;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 10px;
	color: #4D4D4D;
}

.info-dt-2 {
	display: flex;
	flex-flow: row wrap;
	padding: 12px;
	align-items: center;
	border-bottom: 1px solid #F4F4F4 ;
}

.info-dt-2 .flex-grow-1, .info-dt-2 .flex-shrink-1 {
	font-size: 12px;
	color:#65676B;
}

/*********************main swiper*********************/
.ctg-wrap .mainSwiper {
	padding-left:3px!important;
	padding-right:3px!important;
}

.mainSwiper .swiper-wrapper {
	display: flex;
	flex-flow: row nowrap;
}

.mainSwiper .swiper-slide {
	padding: 0 2px!important;
}

.mainSwiper [class*="col"] {
	cursor: pointer;
}

.thbSwiper .swiper-wrapper {
	display: flex;
	flex-flow: row nowrap;
}

.thbSwiper .swiper-slide {
	padding: 0 2px!important;
}

.thbSwiper [class*="col"] {
	cursor: pointer;
	flex: 1 0 0%;
}

@media (min-width: 992px) {
	.mainSwiper.game .swiper-slide {
		flex: 1 0 auto;
	}

	.thbSwiper.game .swiper-slide {
		flex: 1 0 auto;
	}
}

.mainSwiper .swiper-slide:first-child {
	padding-left: 4px!important;
}

.mainSwiper .swiper-slide:last-child {
	padding-right: 4px!important;
}

.thbSwiper .swiper-slide:first-child {
	padding-left: 4px!important;
}

.thbSwiper .swiper-slide:last-child {
	padding-right: 4px!important;
}

.ctg-wrap {
	background: #EFEAF2;
	color: #775D8A;
	text-align: center;
	flex-wrap: nowrap;
	padding: 2px 0px;
	font-size: 14px;
	text-transform: capitalize;
}

.ctg-wrap [class*="col"] {
	display: flex;
	padding: 0;
	height: 29px;
	align-items: center;
}

.ctg-wrap [class*="col"] span {
	width:100%;
	border-radius: 50px;
	padding: 3px 0;
	cursor: pointer;
	white-space: nowrap;
}

.ctg-wrap [class*="col"] span.active {
	background: #775D8A;
	color: #fff;
}


.game-title {
	color: #4D4D4D;
	font-size: 10px;
	font-weight: bold;
	text-transform: capitalize;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-align: center;
	margin-top:2px;
}

.pill-wrap {
	padding: 0 3px;
	flex-flow: row nowrap;
	font-size: 11px;
	text-transform: capitalize;
	overflow-x: auto;
}

.pill-wrap [class*="col"] {
	display: flex;
	align-items: center;
	flex-flow: row wrap;
	padding: 0;
	flex: 1 1 auto;
	text-align: center;
	/* overflow: hidden;
    text-overflow: ellipsis;*/
    white-space: nowrap; 
	min-width: auto;
}

.pill-wrap [class*="col"] span {
	margin: 0 2px;
	width: 100%;
	border-radius: 50px;
	background: #EFEAF2;
	color: #775D8A;
	padding: 3px 5px;
	cursor: pointer;
}

.pill-title {
	text-transform: capitalize;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pill-wrap [class*="col"] span.active {
	background: #775D8A;
	color: #fff;
}

.pill-wrap [class*="col"] .showall {
	background: transparent;
	padding: 0 6px;
	color: #775D8A;
	text-decoration: none;
	text-transform: capitalize;
	overflow: hidden;
	text-overflow: ellipsis;
}

.pill-wrap [class*="col"] .showall a{
	color: #775D8A;
	text-decoration: none;
}

@media (min-width: 576px) {
	#isac_book .mainSwiper {
		width:100%;
	}

	#isac_book .swiper-wrapper {
		width: 100%!important;
		justify-content: center!important;
	}
}

.scroll_wrap {
	display:flex;
	flex-flow:row nowrap;
	overflow:auto; 
	white-space: nowrap;
  }

  .scroll_wrap .brandmenu {
	margin:0 2px;
	cursor: pointer;
  }

  .scroll_wrap > .brandmenu:first-child {
	margin-left:6px;
  }

  .scroll_wrap > .brandmenu:last-child {
	margin-right:6px;
  }

  /*white*/
  .scroll_wrap .category_menu {
	min-width:75px;
	border-radius: 50px;
	cursor: pointer;
  }

  /*purple*/
  .scroll_wrap .category_menu_2 {
	min-width:auto;
	border-radius: 50px;
	cursor: pointer;
  }

/*community*/
.scroll_wrap .category_menu_3 {
	min-width:auto;
	cursor: pointer;
}

/*messenger*/
.scroll_wrap .category_menu_4 {
	flex:1 0 0%;
	cursor: pointer;
}

.category_menu_3 [class*="col"] {
	margin:0;
}

.category_menu_3:first-child [class*="col"] {
	margin-left:0;
}

.category_menu_3:last-child [class*="col"] {
	margin-right:0;
}

.main-ctg-wrap .category_menu [class*="col"]:before {
	content: '';
    height: 15px;
    background-color: #b4acca;
    width: 0.5px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-50%, -50%);
}

.main-ctg-wrap .category_menu_2 span:after {
	content: '';
    height: 15px;
    border-right: 0.2px solid #b4acca;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-50%, -50%);
}

.main-ctg-wrap .category_menu_2:last-child span:after {
    border-right: 0.2px solid #fff;
}

.main-ctg-wrap .category_menu_4 span:after {
	content: '';
    height: 15px;
    border-right: 0.2px solid #b4acca;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-50%, -50%);
}

.main-ctg-wrap .category_menu_4:last-child span:after {
    border-right: 0.2px solid #fff;
}


.ctg-wrap .category_menu.active {
	margin: 0 2px;
	background: #775D8A;
	color: #EFEAF2;
}

  .scroll_wrap .thumb {
	margin:0 2px;
	min-width:100px;
	max-width:100px;
  }
  

/* ===withdraw carousel=== */
.isac-wd-user {
	display: flex;
	flex-flow: row wrap;
}

.vertical.carousel .carousel-item-next:not(.carousel-item-start),
.vertical.carousel .active.carousel-item-end {
    transform: translateY(100%);
}

.vertical.carousel .carousel-item-prev:not(.carousel-item-end),
.vertical.carousel .active.carousel-item-start {
    transform: translateY(-100%);
}

@media (max-width: 310px) {
	.wd-info {
		font-size: 9px;
		margin-bottom: 2px;
	}

	.wd-id {
		font-size: 10px;
	}

	a.wd-button {
		font-size: 9px;
	}

	.wd-wrap .col-9:after {
		width: 0px;
	}
}

/*scroll bar*/
@media (min-width: 768px) {
/* height */
::-webkit-scrollbar {
	height: 6px;
  }

/* width */
  ::-webkit-scrollbar {
	width: 6px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
	/* -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); */
	border-radius: 10px;
	background-color: #e2e2e2;
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
	border-radius: 10px;
	/* -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); */
	background-color: #4f4f4f;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
	background: #4f4f4f;
  }
}

/*Wallet animation*/
  .waviy span {
	position: relative;
	display: inline-block;
	animation: myflip 1.3s infinite;
	animation-delay: calc(.2s * var(--i));
	letter-spacing: -2px;
  }

  @keyframes myflip {
	0%,80% {transform: rotateY(360deg) }
	0%    {color: var(--color-1)}
	32%   {color: var(--color-1)}
	33%   {color: var(--color-2)}
	65%   {color: var(--color-2)}
	66%   {color: var(--color-3)}
	99%   {color: var(--color-3)}
	100%  {color: var(--color-1)}
	}


/*text color animation*/
  .waviy span:nth-of-type(1) {
	--color-1: #a082b6;
	--color-2: #775D8A;
	--color-3: #71498e;
  }
  
  .waviy span:nth-of-type(2) {
	--color-1: #9c82af;
	--color-2: #a082b6;
	--color-3: #71498e;
  }

  .waviy span:nth-of-type(3) {
	--color-1: #71498e;
	--color-2: #a082b6;
	--color-3: #775D8A;
  }
  
  .waviy span:nth-of-type(4) {
	--color-1: #71498e;
	--color-2: #a082b6;
	--color-3: #422557;
  }
  
  .waviy span:nth-of-type(5) {
	--color-1: #775D8A;
	--color-2: #71498e;
	--color-3: #a082b6;
  }
  
  .waviy span:nth-of-type(6) {
	--color-1: #422557;
	--color-2: #71498e;
	--color-3: #a082b6;
  }

/**i massenger*/
.msg_vh {
	background: #f3f3f3;
	min-height: calc(100vh - 133px);
}

@media (min-width: 992px) {
	#messenger .container-fluid {
		width:30%;
	}

	.main_vh {
		min-height: calc(100vh - 50px);
	}

	.msg_vh {
		background: #f3f3f3;
		min-height: calc(100vh - 85px);
	}
}

#messenger_list .msg_vh {
	background: #fff;
}

.msg-list{
	background:#fff;
}

.msg-list:last-child{
	background:#fff;
	padding-bottom:63px;
}

.imessenger {
	display: flex;
	align-items: center;
	padding: 8px 12px;
	border-bottom:1px solid #eee;
}

.messenger_sticky {
	position:sticky;
	top:57px;
	z-index:998;
	filter: drop-shadow(0px 2px 2px rgba(0,0,0,0.1));
}

.tab_sticky{
	position:sticky;
	top:92px;
	z-index:998;
}

.tab_sticky .container-fluid{
	border-top:1px solid #eee;
	filter: drop-shadow(0px 2px 2px rgba(0,0,0,0.1));
}

.back_bar {
	display: flex;
	align-items: center;
	height:35px;
	padding:6px 0; 
	color:#4E406B;
	text-align:center;
	position: relative;
	background: #fff;
	z-index: 99;
}

.back_btn:after {
	top: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
	left:20px;
	content: "\f053";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 17px;
	color:#8C77AB;
	height:25px;
	width:30px;
}

.more_btn:after {
	top: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
	right:-5px;
	content: "\f142";
	font-family: "Font Awesome 6 Free";
	font-weight: 600;
	font-size: 17px;
	color:#8C77AB;
	height:25px;
	width:30px;
}

.messenger_guide {
	top: 50%;
	transform: translate(0%, -50%);
	position: absolute;
	right:15px;
}

#telegram-section {
	width: 100%;
	position: fixed;
	text-align: center;
	bottom: 0px;
	left:50%;
	transform: translate(-50%, 0%);
	z-index: 99;
}

@media (min-width: 992px) {
	.messenger_sticky {
		top:50px;
	}

	.tab_sticky{
		position:sticky;
		top:85px;
		z-index:997;
	}
}

.telegram-wrap {
	justify-content: center;
	padding: 0;
}

#telegram-section.container-fluid {
	overflow: initial;
}

.telegram-wrap .cs {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	background: #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
	width: 100%;
	height: 64px;
	text-decoration: none;
	color:#000;
}

.telegram-wrap .cs-info {
	font-size: 12px;
}

.telegram-wrap .wish-text {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.msg-name {
	flex-shrink: 1;
	color:#4e4e4e;
	font-size: 14px;
	font-weight: bold;
}

.msg-info {
	flex-shrink: 1;
	color:#666;
}

.msg-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink:1;
	margin-left: 5px;
	opacity: 0.5;
}

.msg-date {
	color:#858585;
}


.msg_reddot {
	display: flex;
	justify-content: center;
	align-items: center;
	background:red;
	color:#fff; 
	font-size:8px; 
	padding:2px; 
	height:14px;
	width:14px;
	text-align: center;
	border-radius: 50px;
}

.msg_graydot {
	display: flex;
	justify-content: center;
	align-items: center;
	background:#999;
	color:#fff; 
	font-size:8px; 
	padding:2px; 
	height:14px;
	width:14px;
	text-align: center;
	border-radius: 50px;
}

.msg-offline {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 50%;
	left:50%;
	border-radius: 50px;
	transform: translate(-50%, -50%);
	background: rgba(0,0,0,0.6);
	color:#fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.msg-input {
	position: fixed;
	text-align: center;
	bottom: 0px;
	left:50%;
	z-index: 9999;
	transform: translate(-50%, 0%);
}

.chat-box {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	background:#fff;
	padding: 10px 0;
	border-top:1px solid #dedede;
}

.bot-bar {
	display:flex;
	flex-flow:row nowrap;
	overflow: auto;
	padding-left:12px;
	margin-bottom:10px;
	flex: 0 0 auto;
    width: 100%;
}

.bot-pill {
	display:flex;
	border: 1px solid #ccc;
	border-radius: 50px;
	height: 25px;
	font-size: 12px;
	align-items:center;
	justify-content:center;
	color:#4E4E4E;
	margin:0 2px;
	padding: 3px 10px;
	flex:1 0  auto;
}

.add-img>input {
	display: none;
}

.add-img {
	display:flex;
	border: 1px solid #ccc;
	border-radius: 50px;
	width: 30px;
	height: 30px;
	font-size: 25px;
	align-items:center;
	justify-content:center;
	color:#999;
	
}

.msg-text {
	display:flex;
	border: 1px solid #ccc;
	border-radius: 50px;
	height: 30px;
	font-size: 12px;
	align-items:center;
	justify-content:start;
	color:#4E4E4E;
	flex-grow:1;
	margin:0 8px;
	padding: 0 16px;
}

.msg-text:focus {
	outline:0;
}

.msg-send {
	display:flex;
	background:#8C77AB;
	border-radius: 50px;
	height: 30px;
	width: 80px;
	font-size: 12px;
	align-items:center;
	justify-content:center;
	color:#fff;
	flex-shrink:1;
	text-transform: uppercase;
	border: 0;;
}

.chat-room {
	flex: 1 0 0%;
	background:#F3F3F3;
	/* min-height: calc(100vh - 133px); */
	padding-bottom:55px;
	padding-top:12px;
	/* white-space:pre-line; */
	color:#4d4d4d;
}

.msg-cs-side {
	display:flex;
	justify-content: start;
	margin-bottom:16px;
}

.msg-user-side {
	display:flex;
	justify-content: end;
	margin-bottom:26px;
}

.msg-status {
	display: flex;
	justify-content: center;
	align-items: center;
	color:#bbb;
	margin-bottom:7px;
	font-size:12px;
}

.nm {
    position: relative;
    z-index: 1;
    overflow: hidden;
    text-align: center;
	width:80%;
}
.nm:before, .nm:after {
    position: absolute;
    top: 51%;
    overflow: hidden;
    width: 50%;
    height: 1px;
    content: '';
    background-color: #bbb;
}
.nm:before {
    margin-left: -51%;
}

.nm:after {
    margin-left: 1%;
}

.msg-cs-avatar {
	width:40px;
	margin-right:6px;
}

.msg-user-avatar {
	width:40px;
	margin-left:6px;
}

.msg-cs-avatar img, .msg-user-avatar img {
	height:35px;
	border-radius:50px;
}

.msg-cs-chat {
	flex-shrink:1;
	background:#fff;
	font-size:14px;
	border-radius:5px;
	padding:6px 8px;
	margin-right:46px;
}

.msg-user-chat {
	flex-shrink:1;
	background:#fff;
	font-size:14px;
	border-radius:5px;
	padding:6px 8px;
	margin-left:46px;
	text-align: justify;
    text-justify: inter-word;
    word-spacing: -0.05em;
	position:relative;
}

.read {
	filter:grayscale(0)
}

.unread {
	filter:grayscale(1)
}

.counter-short {
	font-size:9px;
	margin-top:3.5px;
	margin-right:3px;
	color:#bbb;
	visibility: hidden;
}

.chat-date {
	font-size:9px;
	color:#bbb;
	position: absolute;
	bottom:0px;
	right:5px;
}

.msg-system-chat {
	display: flex;
	flex-flow:row wrap;
	align-items: center;
	flex-shrink:1;
	background:#fff;
	font-size:14px;
	border-radius:5px;
	padding:8px;
	margin-right:46px;
}

.bonus4u_icon img {
	height:20px;
	margin-right:3px;
}

.bonus_super tr:nth-child(odd) {
	background:#F9F7EE;
}

.bonus_super tr:nth-child(even) {
	background:#fff ;
}

.bonus_world tr:nth-child(odd) {
	background:#EEF1F9;
}

.bonus_world tr:nth-child(even) {
	background:#fff ;
}

.bonus_isaac tr:nth-child(odd) {
	background:#F2EEF9;
}

.bonus_isaac tr:nth-child(even) {
	background:#fff ;
}

.bonus_crazy tr:nth-child(odd) {
	background:#F9EEEE;
}

.bonus_crazy tr:nth-child(even) {
	background:#fff ;
}

#Bonus table td {
	border:0;
	font-size: 12px;
	padding:1px 3px;
	color:#4d4d4d;
}

#Bonus table td:nth-child(odd) {
	text-align: left;
}

#Bonus table td:nth-child(even) {
	text-align: right;
}

.claim_btn {
	width: 100%;
	color: #fff!important;
	border-radius: 0 0 5px 5px;
	background: rgb(175,102,227);
	background: linear-gradient(180deg, rgba(175,102,227,1) 0%, rgba(103,44,146,1) 100%);
	padding: 3px 12px;
	border: 0;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
}

.claim_btn.claimed {
	background: #B7B7B7;
}

.claim_btn.claimed img {
	filter: grayscale(1);
}

.modal-dialog-end {
	display: flex;
    align-items: end;
    min-height: calc(100% - 0rem);
}

@media (min-width: 768px) {
	.modal-dialog-end {
		min-height: calc(100% - 2rem);
	}
}

#messenger .modal.fade .modal-dialog {
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

#messenger .modal.fade.show .modal-dialog {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}

.sub_box {
	display:flex;
	justify-content: center;
	align-items: center;
	flex-flow:row wrap;
	background: #eee;
	margin:6px 0px;
	padding: 6px;
	border-radius:5px;
}

/*check box*/
#messenger input[type=checkbox] {
	accent-color: #909090;
}

/*switch*/
#messenger .form-check-input {
	background-color: #fff !important;
	border-color: #fff !important;
	box-shadow: none;
}

#messenger .form-check-input:checked {
	background-color: #909090 !important;
	border-color: #909090 !important;
	box-shadow: none;
}

#messenger input:focus {
  border-color: #ccc;  
  box-shadow:  #ccc;
  border: 1px solid #ccc;
  outline:none;
}

#messenger .form-switch .form-check-input {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='4' fill='lightgray'/%3e%3c/svg%3e") !important;
}

#messenger .form-switch .form-check-input:checked {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='4' fill='white'/%3e%3c/svg%3e") !important;
}

.ok_btn {
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	width:100%;
	color: #fff;
	border-radius: 3px;
	background: #8C77AB;
	padding: 6px;
	border-radius:5px;
	border:1px solid #8C77AB;
}

.cancel_btn {
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	width:100%;
	color: #8C77AB;
	border-radius: 3px;
	background: #fff;
	padding: 6px;
	border-radius:5px;
	border:1px solid #8C77AB;
}

.ok_btn:focus, .ok_btn:hover {
	color: #fff;
}

.cancel_btn:focus, .cancel_btn:hover {
	color: #8C77AB;
}

.block_btn {
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	width:100%;
	color: #ED1C24;
	border-radius: 3px;
	background: #fff;
	padding: 6px;
	border-radius:5px;
	border:1px solid #ED1C24;
}

.block_btn:focus, .block_btn:hover {
	color: #ED1C24;
}
.invite-prize {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size:12px;
	background:#FFEFE0;
	border-radius:50px;
	display:inline;
	padding:3px 12px;
}

.step-circle {
	display:flex;
	justify-content: center;
	align-items: center;
	background:#8C77AB;
	color:#fff;
	border-radius:50%;
	height:25px;
	width:25px;
	border:3px solid #E5DFEE;
	font-weight:bolder;
	margin-right:3px;
	position: relative;
}

.invite-QR img {
	box-shadow: 0 0px 4px rgba(0, 0, 0, 0.3);
}

/*share angpao*/
.btn-ap-share {
	background-color: #FFD76F;
	width: 130px;
	border-radius: 50px;
	filter: drop-shadow(0px 3px 8px rgba(0, 0, 0, 0.25));
	color: #A63235;
	font-weight: bold;
	font-size:14px;
	
}

.bonus-amount .title {
	position: absolute;
	top: 50%;
	width: 100%;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
}

.bonus-amount .amount {
	position: absolute;
	bottom: 10%;
	width: 100%;
	text-align: center;
	font-size: 24px;
	font-weight: bold;
}


#su-banner .carousel-indicators {
	bottom:-10px;
}

#su-banner .carousel-inner .item img {
	object-fit: cover;
	height:150px;
	width:100%;
}

#su-banner .carousel-indicators li{
	width:20px;
	height:2px;
	border:0;
	border-radius: 0;
	background: rgba(000,000,000,0.5);
	margin-bottom:0;
	filter: invert(0.5)
}

#su-banner .carousel-indicators li.active{
	background: rgba(135,119,166,1);
	filter: invert(0)
}

#form-sms .title, #form-login .title {
	display: hidden;
}

#su-banner.row {
	margin:0;
}

div#su-input   {
	order: 2;
	-webkit-order: 2;
	width:100%;
}
div#su-banner  {
	order: 1;
	-webkit-order: 1;
}

#form-sms #su-banner{
	margin:0 -15px!important;
}


@media (min-width: 768px) {
	#form-sms .title, #form-login .title {
		display: block;
	}

	div#su-input   {
		order: 1;
		-webkit-order: 1;
	}
	div#su-banner  {
		order: 2;
		-webkit-order: 2;
	}

	.login-margin {
		margin:10px 15px;
	}

	#form-sms #su-banner{
		margin:0!important;
		
	}

	#share-user .modal-dialog {
		height: calc(100% - 3.5rem);
	}

	#share-user .modal-fullscreen {
		max-width:548px !important;
	}

	#share-user .modal-fullscreen .modal-content {
		height:440px !important;
	}
	
}

#share-user .modal-body {
	padding:0 1rem;
}

.people-react{
	padding-top:8px;
}

.people-react li {
	padding:0 10px;
	position: relative;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
}

.people-react li span {
	padding-left:4px;
}

.people-react li a {
	color:#4d4d4d;
}

.people-react li.active a {
	color:#775d8a;
}

.people-react li a.active:after {
	content: "";
	position: absolute;
	height: 2px;
	width: 100%;
	background: #9787B8;
	left: 50%;
	bottom: -9px;
	transform: translate(-50%, -50%);
}

#share-user .modal-header .btn-close {
	margin-left: auto;
}

/*comment*/
.comment-btn {
	cursor: pointer;
	padding: 4px 4px;
	background:#d9d9d9;
	color: #333;
	border-radius: 50px;
	border:1px solid #cacaca;
	text-align: left;
}

.mq-comment {
	cursor: pointer;
	padding: 5px 0;
}

.comment-modal .modal-dialog {
	position:absolute;
	bottom:0;
	height:70%;
	width:992px !important;
}

.comment-modal .modal-content, .comment-modal .modal-header {
	border-radius:10px 10px 0 0 !important;
}


.comment-modal .modal-header {
	background: white;
	color:#333;
	font-weight: bolder;
	padding:8px 16px;
}

.comment-modal .modal-header button{
	width: 16px;
	height: 16px;
	display:flex;
	align-items: center;
}

.comment-modal .modal-header .btn-close{
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 0;
	background: none;
	opacity: 1;
	outline: none !important;
	box-shadow: none !important;
	-webkit-filter: brightness(0.5) invert(0);
	filter: brightness(0.5) invert(0);
}

.comment-modal .modal-body {
	color:#666;
}

.comment-modal .modal-body b {
	color:#333;
}

.comment-modal .modal-body span {
	font-size:12px;
	
}

.comment-modal .input_bar {
	background: #fff;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	position:absolute;
	bottom:0;
	padding: 3px 0px;
	width:100%;
	z-index: 99;
}

.comment-modal .emoji_bar {
	width:100%;
	background: #fff;
	display: flex;
	flex-flow: row wrap;
	text-align: center;
}

.comment-modal .emoji_bar span {
	flex: 1 0 auto;
	cursor: pointer;
}

.love_icon {
	position: absolute;
	right:16px;
}

.reply_bar {
	display: flex;
	flex-flow:row wrap;
	align-items: center;
	width:100%;
	background:#eee;
	color:#999;
	padding: 3px 10px;
	font-size: 12px;
}

@media (min-width: 992px) {
	.comment-modal .modal-content {
		height:650px;
	}
	.comment-modal .modal-dialog {
		position:relative;
		height:auto;
	}

	.comment-modal .modal-content {
		border-radius:10px !important;
	}

	.comment-modal .modal-header {
		border-radius:10px 10px 0 0 !important;
	}

	.comment-modal .modal-dialog {
		display: flex;
		align-items: center;
		min-height: calc(100% - 1rem);
	}
}


.comment-modal .isac-like-btn {
	font-weight: bold;
	position: relative;
	cursor: pointer;
	padding: 20px 0px 0 0;
}

.comment-modal .isac-like-box {
	height: 29px;
	width: auto;
	padding: 4px;
	position: absolute;
	top: -10px;
	left: -77px;
	box-shadow: 1px 1px 2px #cccccc, -1px 0px 2px #eeeeee;
	border-radius: 44px 44px;
	display: none;
	margin-bottom: 0;
	background: #fff;
	align-items: flex-end;
	z-index: 99;
}

.comment-modal .isac-like-box.active {
	display: flex;
}

.comment-modal .like-box {
	display: block;
	cursor: pointer;
	width: 20px;
	height: 20px;
	opacity: 1;
	transform: scale(1, 1);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	margin: 0 3px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.comment-modal .isac-like {
	background-image: url('../images/reactions_like.png?1');
}

.comment-modal .isac-love {
	background-image: url('../images/reactions_love.png');
}

.comment-modal .isac-smile {
	background-image: url('../images/reactions_smile.png?1');
}


.comment-modal .isac-like:hover {
	width: 25px;
	height: 25px;
	background-image: url('../images/reactions_like.png?1');

}

.comment-modal .isac-love:hover {
	width: 25px;
	height: 25px;
	background-image: url('../images/reactions_love.png');
}

.comment-modal .isac-smile:hover {
	width: 25px;
	height: 25px;
	background-image: url('../images/reactions_smile.png?1');
}

.add-comment {
	color:#ccc;
}