/* 2022-10-3 - TK: register default breakpoint variables */
:root {
	--mobile-max-breakpoint: 767px;
	--tablet-min-breakpoint: 768px;
	--tablet-max-breakpoint: 991px;
	--desktop-min-breakpoint: 992px;
	--desktop-max-breakpoint: 1199px;
	--desktop-lg-min-breakpoint: 1200px;
	
/* 
	--mobile-max-breakpoint: 991px;
	--tablet-min-breakpoint: 992px;
	--tablet-max-breakpoint: 991px;
	--desktop-min-breakpoint: 992px;
	--desktop-max-breakpoint: 1199px;
	--desktop-lg-min-breakpoint: 1200px;
 */
}
* {
	-ms-overflow-style: -ms-autohiding-scrollbar;
}
.marg-left-15 {
	margin-left:15px;
}
.marg-bottom-15 {
	margin-bottom:15px !important;
}
.marg-bottom-20 {
	margin-bottom:20px !important;
}
.marg-bottom-10 {
	margin-bottom:10px !important;
}
.marg-bottom-5 {
	margin-bottom:5px !important;
}
.marg-top-15 {
	margin-top:15px !important;
}
.marg-top-10 {
	margin-top:10px !important;
}
.marg-top-20 {
	margin-top:20px !important;
}
.marg-top-30 {
	margin-top:30px !important;
}
.marg-top-40 {
	margin-top:40px !important;
}
.marg-top-80 {
	margin-top:80px !important;
}
.marg-right-15 {
	margin-right:15px !important;
}
.marg-left-15 {
	margin-left:15px !important;
}
.marg-left-10 {
	margin-left:10px !important;
}
.marg-left-5 {
	margin-left:5px !important;
}
.margin-0 {
	margin:0 !important;
}
.marg-bottom-45 {
	margin-bottom: 45px !important;
}
.marg-bottom-30 {
	margin-bottom: 30px !important;
}
.marg-top-145 {
	margin-top: 145px !important;
}
.pad-all-20 {
	padding:20px !important;
}
.pad-10 {
	padding:10px !important;
}
.pad-15 {
	padding:15px !important;
}
.full-width {
	width:100% !important;
}
.reset-min-height {
	min-height:0 !important;
}
.text-xlg {
	font-size:2em !important;
}
.text-lg {
	font-size:1.2em !important;
}
.text-sm {
	font-size:0.8em !important;
}
.text-xl {
	font-size:1.6em !important;
}
.no-border {
	border:none !important;
}
.inline-block {
	display:inline-block !important;
}
.nowrap {
	white-space:nowrap;
}
.line-through {
	text-decoration:line-through;
}
.hint-text {
	font-size:0.8em;
	color:#999 !important;
}
.text-disabled {
	color:#888;
}
.fw500 {
	font-weight:500 !important;
}
.fw600 {
	font-weight:600 !important;
}
.visible-xs.hidden, .visible-sm.hidden {
	display:none !important;
}
/* 2018-10-4 - TK: fix width for container within container */
.container .container:not(.container-fix) {
	width:100%;
}
.btn {
	text-overflow:ellipsis;
	overflow:hidden;
}
/* 2018-10-5 - TK: fix icon line-height in .btn */
.btn i {
	line-height:inherit;
}
/* 2018-10-5 - TK: make sure parsley error in red */
.parsley-errors-list {
	color:#f00;
}
/* 2018-10-12 - TK: make bootstrap grid col-* equal height */
.equal-height {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}
.equal-height::before {
	content:normal !important;
}
/* 2022-1-11 - TK: handle 5 columns in 1 row */
.equal-height .col-lg-2_4,
.equal-height .col-md-2_4,
.equal-height .col-sm-2_4 {
	width:20%;
	padding-right:15px;
	padding-left:15px;
}
.relative {
	position:relative;
}
/* 2019-10-4 - TK: make sure .open dropdown is visible */
.dropdown.open > .dropdown-menu {
	display:block !important;
}
/* 2018-7-10 jaydon: fix android cannot scroll */
.grid-stack-item-content {
	touch-action: auto!important;
}
.icon-success {
	color:#67BE57;
}
.icon-lg {
	font-size:80px;
	line-height:80px;
}
.row.without-container {
	margin-left:0;
	margin-right:0;
}

/* 2019-12-30 - TK: wide-container */
/*
@media (min-width: 768px) {
	.container {
		width: 750px;
	}
}
@media (min-width: 992px) {
	.container {
		width: 970px;
	}
}
@media (min-width: 1200px) {
	.container {
		width: 1170px;
	}
}
bootstrap value. add xlg and xxlg */
@media (min-width: 1500px) {
	body.wide-container .container {
		width: 1250px;
	}
}
@media (min-width: 2000px) {
	body.wide-container .container {
		width: 1250px;
	}
}

/* 2018-10-21 jaydon: product detail bookmark */
.bookmark-item .link-wishlist{
	border-left: 1px solid lightgrey;
	padding-left: 10px;
	text-align: center;
	white-space:nowrap;
}
.bookmark-item .link-wishlist i{
	font-size: 20px;
	display: block;
}
.bookmark-item .remove-from-wishlist{
	color: #1abc9c;
	margin-top: 0;
	white-space:nowrap;
}
/* 2018-10-22 - TK: remove margin-top
.quanitySniper-qty{
	margin-top: 12px;
} */


/* 2018-10-21 jaydon: mobile cart ui */
.mobile-cart-container .cart-item{
	padding: 10px 0;
}
.mobile-cart-container .cart-item-image{
    width: 80px;
    display: inline-block;
    vertical-align: top;	
}
/* 2018-10-23 jaydon: cart page ui */
.mobile-cart-container .item-name h4{
	padding-bottom: 0;
	overflow: hidden;
}
.mobile-cart-container .item-qty{
	max-width: 120px;
}
.mobile-cart-container .cart-item-image img{
	width: 100%;
}
.mobile-cart-container .cart-item-info{
	width: calc(100% - 40px - 80px);
	display: inline-block;
	padding: 0 10px;
}
.mobile-cart-container .item-price{
	font-size: 18px;
	font-weight: bold;
}
.mobile-cart-container .remove-item{
	right: 0;
	position: absolute;
	font-size: 30px;
	margin-top: 10px;
	display: inline-block;
}
.mobile-cart-container .cart-item{
	border-top: 1px solid lightgrey;
}

.product-bottom-bar{
	position: absolute;
    bottom: 0;
    max-width: calc(100% - 31px);
}
/* 2018-10-23 mobile cart ui */
/* 2018-10-24 kelvin: fine tune position */
.mobile-add-cart-item{
	padding:8px 15px;
}
.mobile-add-cart-item .add-to-cart,
.mobile-add-cart-item .add-to-cart-detail {
	text-align: center;
	border-left: 1px solid lightgrey;
	/* padding-left: 15px; */
	padding-right: inherit;
}

.mobile-add-cart-item .add-to-cart-detail i,
.mobile-add-cart-item .add-to-cart i{
	font-size: 20px;
	display: block;
}

/* 2018-10-31 - TK: generic css for [page/cart] (becup style) */
#becup-cart-detail, #becup-checkout-detail {
	width:100%;
	border:1px solid #f5f5f5;
	display:table;
}
#becup-cart-detail .thead, #becup-checkout-detail .thead {
	background-color:#f5f5f5;
	display:table-header-group;
}
#becup-cart-detail .thead .tr, #becup-checkout-detail .thead .tr {
	display:table-row;
}
#becup-cart-detail .thead .th, #becup-checkout-detail .thead .th {
	line-height:40px;
	padding:0 15px;
	font-weight:normal;
	display:table-cell;
}
#becup-cart-detail .tbody, #becup-checkout-detail .tbody {
	display:table-row-group;
}
#becup-cart-detail .tbody .tr, #becup-checkout-detail .tbody .tr {
	display:table-row;
}
#becup-cart-detail .tbody .td, #becup-checkout-detail .tbody .td {
	padding:10px 15px;
	font-size:13px;
	display:table-cell;
	vertical-align:top;
}
#becup-cart-detail .tbody > .tr:not(:last-child) > .td, #becup-checkout-detail .tbody > .tr:not(:last-child) > .td {
	border-bottom:1px solid #f5f5f5;
}
#becup-cart-detail .item-photo, #becup-checkout-detail .item-photo {
	width:70px;
}
#becup-cart-detail .item-photo > div, #becup-checkout-detail .item-photo > div {
	width:70px;
	height:70px;
	overflow:hidden;
	position:relative;
}
#becup-cart-detail .item-photo > div > a, #becup-checkout-detail .item-photo > div > a {
	display:block;
	position:absolute;
	overflow:hidden;
	top:0;
	bottom:0;
	left:0;
	right:0;
}
#becup-cart-detail .item-photo > div > a > img, #becup-checkout-detail .item-photo > div > a > img {
	max-height:70px;
}
#becup-cart-detail .item-photo > div > a > .item-badge, #becup-checkout-detail .item-photo > div > a > .item-badge {
	position:absolute;
	top:0;
	left:0;
	background-color:#eb5e58;
	color:#fff;
	border-radius:0 0 4px 0;
	font-weight:lighter;
	padding:0 4px;
}
#becup-cart-detail .item-price {
	width:100px;
	text-align:center;
}
#becup-checkout-detail .item-price {
	width:100%;
	text-align:center;
}
#becup-cart-detail .item-remove i,
#becup-cart-detail .item-toggle i {
	color:#836E78;
	font-size:1.8em;
}
#becup-cart-detail .item-gift, #becup-checkout-detail .item-gift {
	color:#e8477f;
	font-size:1.5em;
	text-align:center;
}
#becup-cart-detail .item-promotion-discount, #becup-checkout-detail .item-promotion-discount {
	color:#e8477f;
}
#becup-cart-summary {
	position:fixed;
	background-color:#fff;
	bottom:0;
	width:100%;
	left:0;
	z-index:4000;
	box-shadow: 0 -2px 2px rgba(80,80,80,.2);
}
#becup-cart-summary > .container {
	padding-left:30px;
	padding-right:30px;
}
#becup-cart-summary .summary-row {
	padding-top:5px;
	padding-bottom:5px;
}
#becup-cart-summary .summary-row/*:not(:last-child)*/ {
	border-bottom:1px dashed #ddd;
}
#becup-cart-summary .summary-row .title {
	float:left;
}
#becup-cart-summary .summary-row .credit-title {
	width:130px;
	text-overflow:ellipsis;
	text-align:left;
	display:inline-block;
}
#becup-cart-summary .summary-row .credit-value {
	width:80px;
	text-overflow:ellipsis;
	text-align:right;
	display:inline-block;
	color:#009688;
	font-weight:500;
}
#becup-cart-summary label {
	font-weight:normal;
}
#becup-cart-summary .sub-total {
	margin-left:5px;
}
#becup-cart-summary .grand-total {
	color:#e8477f;
	font-size:1.2em;
	margin-left:5px;
}
/* 2020-4-6 - TK: G said smaller */
@media only screen and (max-width: 768px) {
	#becup-cart-summary .summary-row {
		padding-top:3px;
		padding-bottom:3px;
	}
	#becup-cart-summary .summary-row .form-control {
		height:28px;
	}
	#becup-cart-summary .summary-row .form-control.credit_amount {
		width:25%;
	}
	#becup-cart-summary .summary-row .btn {
		padding-top:4px;
		padding-bottom:4px;
	}
}

/* 20190508 winston add bundle promotion enchancement css */
.popupBundle {
	cursor: pointer;
}
.bundle-item-title {
	background: #dfe2e4;
	padding: 10px;
}
.bundle-item-name {
	color: #FF0000;
	font-size: 14px;
}
.bundle-item-select-count {
	float: right;
	color: #000;
	font-size: 14px;
}
.bundle-item {
	margin-bottom: 5px !important;
}
.bundle-item:last-child {
	margin-bottom: 10px !important;
}
.selected-bundle-item {
	padding: 10px 15px 0px 15px;
	border: 1px solid #ccc;
}
.selected-bundle-item-title {
	padding: 0px;
	margin: 0px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 9vw;
	font-size: 14px;
}
.selected-bundle-item-variant {
	margin-top: 4px !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 9vw;	
	font-size: 14px;
}
.popup-bundle-dialog {
	border-radius: 5px;
}
.popup-bundle-header {
	background:  #bbc3c3 !important;
	height: auto;
	border: none;
	margin: 20px 50px;
	padding: 15px !important;
}
.popup-bundle-title {
	font-size: 20px;
}
.popup-bundle-close {
	position: fixed;
	top: 38px;
	right: 14px;
	font-size:40px;
}
.popup-bundle-back {
	position: fixed;
	top: 42px;
	left: 14px;
	font-size:40px;
}
.popup-bundle-content {
	box-shadow: none !important;
	border: none !important;
}
.popup-bundle-body {
	margin: 20px 50px;
	padding: 0px !important;
}
.bundle-sales-product-select,
.bundle-product-select {
	padding: 10px 15px;
	background: #684072;
	font-size: 18px; 
	border-radius: 5px;
}
.bundle-sales-product-select a,
.bundle-product-select a {
	color: #fff;
}
@media only screen and (max-width: 468px) {
.popup-bundle-header {
	height: 110px;
}
.popup-bundle-body {
	margin: 0px 10px;
}
.popupBundle,
.selected-bundle-item {
	/*padding: 0px !important;*/
}
.selected-bundle-item-title,
.selected-bundle-item-variant {
	width: unset;
}
.bundle-media-list {
	padding-top: 10px;
}
.bundle-media-item {
	top: 23px !important;
}
.bundle-media-trash {
	padding-right: 5px;
}
.leftContent {
	padding-bottom: 15px;
}
}
@media only screen and (max-width: 768px) {
	#becup-cart-detail {
		margin-top:-35px;
		margin-left:-25px;
		width:calc(100% + 50px);
	}
	#becup-cart-detail .thead > .tr {
		display:block;
		position:relative;
		padding:5px 10px;
		background-color:#fff;
		border-bottom:1px solid #f5f5f5;
	}
	#becup-cart-detail .thead > .tr > .th:first-child {
		display:block;
		padding:0;
		width:100%;
		line-height:normal;
	}
	#becup-cart-detail .thead > .tr > .th:first-child > label {
		width:100%;
		margin:0;
	}
	#becup-cart-detail .thead > .tr > .th:first-child > label > span {
		display:inline-block !important;
		font-weight:normal;
		margin-left:5px;
	}
	#becup-cart-detail .thead > .tr > .th:not(:first-child) {
		display:none;
	}
	#becup-checkout-detail .thead {
		display:none;
	}
	#becup-cart-detail .tbody > .tr, #becup-checkout-detail .tbody > .tr {
		display:block;
		position:relative;
		padding:10px 15px;
	}
	#becup-cart-detail .tbody > .tr:not(:last-child), #becup-checkout-detail .tbody > .tr:not(:last-child) {
		border-bottom:1px solid #f5f5f5;
	}
	#becup-cart-detail .tbody > .tr > .td, #becup-checkout-detail .tbody > .tr > .td {
		display:block;
		padding:0;
		border-bottom:none !important;
	}
	/* checkbox */
	#becup-cart-detail .tbody > .tr > .td:nth-child(1) {
		position:absolute;
		top:0;
		left:0;
		width:30px;
		height:100%;
	}
	#becup-cart-detail .tbody > .tr > .td:nth-child(1) > .item-selected {
		width:100%;
		height:100%;
	}
	#becup-cart-detail .tbody > .tr > .td:nth-child(1) > .item-selected > label {
		width:100%;
		height:100%;
		text-align:center;
		display:block;
	}
	#becup-cart-detail .tbody > .tr > .td:nth-child(1) > .item-selected > label > input[type="checkbox"] {
		margin:0;
		top:calc(50% - 10px);
		position:relative;
	}
	/* photo */
	#becup-cart-detail .tbody > .tr > .td:nth-child(2) {
		float:left;
		margin-left:20px;
		width:auto;
	}
	#becup-cart-detail .tbody > .tr > .td:nth-child(2) > .item-gift {
		margin-left:-30px;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(1) {
		float:left;
		width:auto;
	}
	/* product name */
	#becup-cart-detail .tbody > .tr > .td:nth-child(3) {
		margin-left:95px;
		margin-right:20px;
		line-height:20px;
		height:20px;
		overflow:hidden;
		text-overflow:ellipsis;
	}
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(3) {
		margin-left:20px;
		margin-right:75px;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(2) {
		margin-left:45px;
		line-height:20px;
		height:20px;
		overflow:hidden;
		text-overflow:ellipsis;
		margin-right:75px;
	}
	#becup-checkout-detail .tbody > .tr.discount-row > .td:nth-child(2) {
		margin-left:30px;
	}
	/* product variants */
	#becup-cart-detail .tbody > .tr > .td:nth-child(4) {
		margin-left:95px;
		margin-right:20px;
		line-height:20px;
		height:20px;
		overflow:hidden;
		text-overflow:ellipsis;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(3) {
		margin-left:45px;
		line-height:20px;
		height:20px;
		overflow:hidden;
		text-overflow:ellipsis;
	}
	/* unit price */
	#becup-cart-detail .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:55px;
		left:210px;
		line-height:30px;
		font-size:1.1em;
		font-weight:500;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		top:53px;
		left:110px;
		font-size:1.2em;
		font-weight:500;
	}
	#becup-cart-detail .tbody > .tr > .td:nth-child(5) span {
		display:inline-block !important;
		margin-left:15px;
		margin-right:20px;
		font-size:0.8em;
		font-weight:normal;
		color:#666;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(4) span {
		display:inline-block !important;
		margin-left:15px;
		margin-right:20px;
		font-size:0.8em;
		font-weight:normal;
		color:#666;
	}
	/* qty */
	#becup-cart-detail .tbody > .tr > .td:nth-child(6) {
		margin-left:95px;
		margin-top:5px;
		margin-right:20px;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(5) {
		margin-top:5px;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(5) > .item-price {
		text-align:left;
		padding-left:75px;
	}
	/* sub total */
	#becup-cart-detail .tbody > .tr > .td:nth-child(7) {
		display:none;
	}
	#becup-checkout-detail .tbody > .tr > .td:nth-child(6) {
		display:none;
	}
	/* remove item */
	#becup-cart-detail .tbody > .tr > .td:nth-child(8) {
		position:absolute;
		right:12px;
		top:0;
		margin-top:15px;
	}
	
	/* 2018-11-19 jaydon: hide all nbsp	 */
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(1),
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(4),
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(5),
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(6),
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(8) {
		display:none;
	}
	#becup-checkout-detail .tbody > .tr.discount-row > .td:nth-child(3),
	#becup-checkout-detail .tbody > .tr.discount-row > .td:nth-child(4),
	#becup-checkout-detail .tbody > .tr.discount-row > .td:nth-child(5) {
		display:none;
	}
	#becup-cart-detail .tbody > .tr.discount-row > .td:nth-child(7) {
		display:block;
		position:absolute;
		top:8px;
		right:12px;
		font-size:1.2em;
	}
	#becup-checkout-detail .tbody > .tr.discount-row > .td:nth-child(6) {
		display:block;
		position:absolute;
		top:8px;
		right:12px;
		font-size:1.2em;
	}
	#becup-cart-summary .summary-row.button-group .btn {
		width:100%;
	}
	.pull-left-xs {
		float:left;
	}
}
.becup-checkout-form .orderStep li a {
	background-color:#fff;
}
/* 2018-10-31 - TK: generic css for [page/checkout] (becup style) */
@media only screen and (max-width: 768px) {
	.becup-checkout-form .orderStep {
		position:fixed;
		width:100%;
		top:50px;
		left:0;
		z-index:999;
		margin-bottom:0;
	}
	.becup-checkout-form .orderStep li {
		min-height:0;
		border-bottom:1px solid #e3e3e3;
	}
	.becup-checkout-form .orderStep li.active {
		border-bottom:1px solid #e8477f;
	}
	.becup-checkout-form .orderStep li a {
		color:#666;
	}
	.becup-checkout-form .orderStep li a i {
		font-size:16px;
		line-height:26px;
		background-color:#f5f5f5;
	}
	.becup-checkout-form .orderStep li a span {
		font-size:10px;
		padding:2px 0;
	}
	.becup-checkout-form .orderStep + .tab-content {
		margin-top:10px;
		margin-left:-10px;
		width:calc(100% + 20px);
	}
}
/* 2018-11-14 - TK: generic css for [page/member-mine] (becup style) */
#becup-desk-member-mine {
	display:flex;
}
#becup-desk-member-mine > .member-profile {
	flex:0 1 315px;
	border-right:1px solid #f5f5f5;
	padding-right:15px;
}
.posify-member-card {
	width:300px;
	height:180px;
	background-color:#F2F2F2;
	border-radius:10px;
	position:relative;
	padding:15px;
}
.posify-member-card > .card-top-left {
	height:60px;
	position:absolute;
}
.posify-member-card > .card-top-center {
	height:60px;
	margin-left:100px;
	position:absolute;	
}
.posify-member-card > .card-top-right {
	height:60px;
	margin-left:200px;
	position:absolute;
}
.posify-member-card > .card-middle-left {
	height:60px;
	margin-top:40px;
	position:absolute;
}
.posify-member-card > .card-middle-center {
	height:60px;
	margin-top:40px;
	margin-left:100px;
	position:absolute;
}
.posify-member-card > .card-middle-right {
	height:60px;
	margin-top:40px;
	margin-left:200px;
	position:absolute;
}
.posify-member-card > .card-bottom-left {
	height:60px;
	margin-top:100px;
	position:absolute;
}
.posify-member-card > .card-bottom-center {
	height:60px;
	margin-top:100px;
	margin-left:100px;
	position:absolute;
}
.posify-member-card > .card-bottom-right {
	height:60px;
	margin-top:100px;
	margin-left:200px;
	position:absolute;
}

.posify-member-card > .card-top {
	height:60px;
	margin-bottom:10px;
}
.posify-member-card > .card-bottom {
	margin-top:70px;
}
.posify-member-card > .card-top-left > .member-photo,
.posify-member-card > .card-top-center > .member-photo,
.posify-member-card > .card-top-right > .member-photo,
.posify-member-card > .card-middle-left > .member-photo,
.posify-member-card > .card-middle-center > .member-photo,
.posify-member-card > .card-middle-right > .member-photo,
.posify-member-card > .card-bottom-left > .member-photo,
.posify-member-card > .card-bottom-center > .member-photo,
.posify-member-card > .card-bottom-right > .member-photo,
.posify-member-card > .card-top > .member-photo {
	width:60px;
	height:60px;
	overflow:hidden;
	border-radius:25px;
	float:left;
}
.posify-member-card > .card-top-left > .member-photo > img,
.posify-member-card > .card-top-center > .member-photo > img,
.posify-member-card > .card-top-right > .member-photo > img,
.posify-member-card > .card-middle-left > .member-photo > img,
.posify-member-card > .card-middle-center > .member-photo > img,
.posify-member-card > .card-middle-right > .member-photo > img,
.posify-member-card > .card-bottom-left > .member-photo > img,
.posify-member-card > .card-bottom-center > .member-photo > img,
.posify-member-card > .card-bottom-right > .member-photo > img,
.posify-member-card > .card-top > .member-photo > img {
	margin:0;
	width:100%;
	height:auto;
}
.posify-member-card > .card-top-left > .member-qrcode,
.posify-member-card > .card-top-center > .member-qrcode,
.posify-member-card > .card-top-right > .member-qrcode,
.posify-member-card > .card-middle-left > .member-qrcode,
.posify-member-card > .card-middle-center > .member-qrcode,
.posify-member-card > .card-middle-right > .member-qrcode,
.posify-member-card > .card-bottom-left > .member-qrcode,
.posify-member-card > .card-bottom-center > .member-qrcode,
.posify-member-card > .card-bottom-right > .member-qrcode,
.posify-member-card > .card-top > .member-qrcode {
	width:60px;
	height:60px;
	overflow:hidden;
	float:right;
}
.posify-member-card > .card-top-left > .member-qrcode img,
.posify-member-card > .card-top-center > .member-qrcode img,
.posify-member-card > .card-top-right > .member-qrcode img,
.posify-member-card > .card-middle-left > .member-qrcode img,
.posify-member-card > .card-middle-center > .member-qrcode img,
.posify-member-card > .card-middle-right > .member-qrcode img,
.posify-member-card > .card-bottom-left > .member-qrcode img,
.posify-member-card > .card-bottom-center > .member-qrcode img,
.posify-member-card > .card-bottom-right > .member-qrcode img,
.posify-member-card > .card-top > .member-qrcode img {
	width:60px !important;
	height:60px !important;
}
.posify-member-card > .card-top-left > .member-qrcode canvas,
.posify-member-card > .card-top-center > .member-qrcode canvas,
.posify-member-card > .card-top-right > .member-qrcode canvas,
.posify-member-card > .card-middle-left > .member-qrcode canvas,
.posify-member-card > .card-middle-center > .member-qrcode canvas,
.posify-member-card > .card-middle-right > .member-qrcode canvas,
.posify-member-card > .card-bottom-left > .member-qrcode canvas,
.posify-member-card > .card-bottom-center > .member-qrcode canvas,
.posify-member-card > .card-bottom-right > .member-qrcode canvas,
.posify-member-card > .card-top > .member-qrcode canvas {
	width:60px !important;
	height:60px !important;
}
.posify-member-card > .card-bottom > .member-name {
	font-size:20px;
	font-weight:500;
	line-height:30px;
}
.posify-member-card > .card-bottom > .member-name > .member-no {
	font-size:12px;
	line-height:12px;
}
.posify-member-card > .card-bottom > .member-level {
	font-size:14px;
	line-height:25px;
}
.posify-member-card > .card-bottom > .member-level > i {
	margin-right:5px;
}
.posify-member-card > .card-bottom > .member-date {
	font-size:12px;
	color:#888;
	line-height:25px;
}
/* 2019-2-13 - TK: change to .becup-member to share css with cash-out-list */
.becup-member .member-profile > .member-balance {
	display:flex;
	flex-wrap:wrap;
	min-width:300px;
}
.becup-member .member-profile > .member-balance > .member-credit {
	background-color:#F2F2F2;
	border-radius:10px;
	/* width:140px; */
	/* 2018-12-14 kelvin: edit css */
	flex:0 1 144px;
	height:134px;
	margin-top:6px;
	position:relative;
	overflow:hidden;
}
.becup-member .member-profile > .member-balance > .member-credit:nth-child(2n + 1) {
	margin-right:6px;
}
.becup-member .member-profile > .member-balance > .member-credit:nth-child(2n) {
	margin-left:6px;
}
.becup-member .member-profile > .member-balance > .member-credit > .img-circle {
	width:114px;
	height:80px;
	margin:10px auto;
	background-color:#fff;
	text-align:center;
	padding:0 10px;
}
.becup-member .member-profile > .member-balance > .member-credit > .img-circle > h1 {
	color:#00A599;
	border-bottom:1px solid #ccc;
	padding:0;
	line-height:30px;
	padding-top:10px;
	font-size:1.5em;
}
.becup-member .member-profile > .member-balance > .member-credit > .img-circle > p {
	color:#999;
	font-size:0.7em;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	width:144px;
	position:absolute;
	left:0;
	bottom:51px;
	text-align:center;
}
.becup-member .member-profile > .btn-block {
	margin:10px 0 0 5px;
	border-radius:5px;
	width:calc(100% - 10px);
}
/*2018-12-06 winston add redeem cash dollar section */
#becup-desk-member-mine > .member-profile > .member-redeem {
	margin-top:15px;
	height:90px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-top {
	background-color:#F2F2F2;
	border-top-left-radius:10px;
	border-top-right-radius:10px;	
	width:100%;
	height:29%;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .white-divider {
	background-color:#FFFFFF;
	border-radius:0px;
	width:100%;
	height:3px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom {
	background-color:#F2F2F2;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;	
	width:100%;
	height:70%;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-top > .member-redeem-title {
	color:#333333;
	margin:10px 13px;
	font-size:14px;
	line-height:26px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content {
	color:#333333;
	margin:10px 7px;
	font-size:14px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-top > .member-redeem-title > .member-redeem-title-right {
	margin-left:18px;
	/* 2018-12-14 kelvin: remove */
	/* font-size:18px; */
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-top > .member-redeem-title > .member-redeem-title-right > .member-redeem-title-points {
	margin:0px 10px 0px 5px;
	font-size:10px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-top > .member-redeem-title > .member-redeem-title-right > .member-redeem-title-number {
	margin:0px 5px 0px 10px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-top > .member-redeem-title > .member-redeem-title-right > .member-redeem-title-cash-dollar {
	font-size:10px;	
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content > .redeem-form-field {
	width:43px;
	border:none;
	padding:7px 1px;
	margin-top:13px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content > .redeem-form-field-margin {
	margin-left:5px;
	margin-right:5px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content > .member-redeem-content-points {
	font-size:10px;
	margin:0px 5px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content > .member-redeem-content-cash-dollar {
	font-size:10px; 
	display:table-caption;
	line-height:9px;
	text-align:center;
	/* 2019-7-4 kelvin: set width */
	width: 60px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content > .convert-button-margin {
	margin-left:5px;
}
#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .convert-reminder {
	font-size:10px;
	display:block;
	color:#FF0000;
	line-height:9px;
	margin-left:13px;
}
#becup-desk-member-mine > .member-profile > .member-cards {
	margin-top:15px;
}
#becup-desk-member-mine > .member-profile > .member-cards > .card {
	width:140px;
}
#becup-desk-member-mine > .member-profile > .member-share {
	margin-top:15px;
}
#becup-desk-member-mine > .member-profile > .member-share > .share-qr-link > img {
	width:100%;
	padding:12px;
	border:1px solid #ddd;
	border-radius:4px;
}
#becup-desk-member-mine > .member-profile > .member-share > .share-qr-link.w70 > img {
	width:70%;
}
#becup-desk-member-mine > .member-summary {
	flex:1 1 auto;
	padding-left:15px;
}
.becup-member .member-history {
	min-height:180px;
	position:relative;
}
.becup-member .member-history > .no-record {
	width:200px;
	height:80px;
	position:absolute;
	top:50px;
	left:50%;
	margin-left:-100px;
	text-align:center;
}
.becup-member .member-history > .no-record > i {
	font-size:30px;
	color:#eaeaea;
}
.becup-member .member-history > .no-record > p {
	font-size:0.8em;
	color:#aaa;
}
.becup-member .member-history > .table {
	width:100%;
	display:table;
	font-size:12px;
}
.becup-member .member-history > .table > .thead {
	background-color:#f9f9f9;
	display:table-header-group;
	width:100%;
}
.becup-member .member-history > .table > .thead .tr {
	display:table-row;
}
.becup-member .member-history > .table > .thead .th {
	line-height:30px;
	padding:0 15px;
	font-weight:normal;
	display:table-cell;
}
.becup-member .member-history > .table > .tbody {
	display:table-row-group;
	width:100%;
}
.becup-member .member-history > .table > .tbody .tr {
	display:table-row;
}
/* 20200601 winston for all member-invoice table change */
.member-history > .table.invoice-history > .tbody .td  {
	border:1px solid #CCCCCC;
	border-radius:10px;
	padding:15px;
	margin-bottom:15px;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-top {
	border-bottom:1px solid #CCCCCC;
	font-size:16px;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-top > .text-left {
	color:#2BAAFD;
}
.member-history > .table.invoice-history > .tbody .td .card {
	padding-top:15px;
	padding-bottom:15px;	
	cursor:pointer;
}
.member-history > .table.invoice-history > .tbody .td .card:last-child {
	border-bottom:1px solid #CCCCCC;
}
.member-history > .table.invoice-history > .tbody .td .card .card-img {
	max-width:180px;
	width:100%;
	padding-right:10px;	
}
.member-history > .table.invoice-history > .tbody .td .card .card-title {
	font-size:16px;
}
.member-history > .table.invoice-history > .tbody .td .card .card-text {
	font-size:12px;
	color:#555555;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-summary {
	font-size:16px;
	border-bottom:1px solid #CCCCCC;
	color:#DD6034;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer	{
	display:block;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer .grand-total {
	font-size:1.5em;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer a.btn {
	background:#FFFFFF;
	color:#333333;
	border:1px solid #333333;
	border-radius:10px;
	margin-left:15px;
	padding:8px 20px;
	font-size:14px;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer a.btn:hover {
	color:#DD6034;
	border:1px solid #DD6034;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer a.btn.btn-success {
	background-color:#2ecc71 !important;
	color:#fff !important;
}
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer form.void-form,
.member-history > .table.invoice-history > .tbody .td .invoice-item-footer form.checkout-form {
	display:inline-block;
}
.member-history > .table.invoice-history > .tbody .td #payment-method-section {
	margin-top:10px;
}
.becup-member .member-history > .table:not(.invoice-history) > .tbody .td {
	padding:7px 15px;
	font-size:12px;
	display:table-cell;
	vertical-align:top;
	color:#666;
}
.becup-member .member-history > .table:not(.invoice-history) > .tbody > .tr:last-child > .td {
	border-bottom:1px solid #f5f5f5;
}
.product-tab > ul > li.active > a {
	background-color:#bfc9ca;
}
@media only screen and (max-width: 768px) {
	/* 20200602 winston add revise ui of invoice table */
	.member-history > .table.invoice-history > .tbody .td .invoice-item-footer a.btn,
	.member-history > .table.invoice-history > .tbody .td .invoice-item-summary,
	.member-history > .table.invoice-history > .tbody .td .card .card-title,
	.member-history > .table.invoice-history > .tbody .td .invoice-item-top {
		font-size:12px;
	}
	.member-history > .table.invoice-history > .tbody .td .invoice-item-footer a.btn {
		margin-left:5px;
		margin-top:5px;
	}
	.member-history > .table.invoice-history > .tbody .td .card .card-img {
		padding-right:0px;
	}

	/* 20200602 winston add revise ui of invoice table END */
	#becup-desk-member-mine {
		display:block;
		margin-top:0 !important;
	}
	#becup-desk-member-mine > .member-profile {
		display:none;
	}
	#becup-desk-member-mine > .member-summary {
		padding:0;
		display:none;
	}
	/* 20190412 winston add jolli table style */
	#order-record-pager,
	#cashdollar-record-pager,
	#invoice-record-pager,
	#referral-record-pager {
		border: 1px solid #CCCCCC;
		height:20px;
		font-size:14px;
	}
	.jolli-member .reward-trans-tab-content > .table,		
	.jolli-member .member-profile-tab-content > .table.cashdollar_table,	
	.jolli-member .member-profile-tab-content > .table.order_table,
	.becup-member .member-history > .table,
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table {
		display:block;
	}
	.jolli-member .reward-trans-tab-content > .table > .thead,
    .jolli-member .member-profile-tab-content > .table.cashdollar_table > .thead,	
  	.jolli-member .member-profile-tab-content > .table.order_table > .thead,
	.becup-member .member-history > .table > .thead,
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .thead,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .thead {
		display:none;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody,
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody,	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody,
	.becup-member .member-history > .table > .tbody,
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody {
		display:block;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr,
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr,	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr,
	.becup-member .member-history > .table > .tbody > .tr,
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr {
		display:block;
		position:relative;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td,
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td,	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td,
	.becup-member .member-history > .table:not(.invoice-history) > .tbody > .tr > .td,
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr > .td {
		font-size:12px;
		padding:5px;
		border:none !important;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td .visible-xs,
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td .visible-xs,	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td .visible-xs,
	.becup-member .member-history > .table > .tbody > .tr > .td .visible-xs,
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td .visible-xs,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr > .td .visible-xs {
		display:inline-block !important;
	}
	/* invoice history row */
	.becup-member .member-history > .table.coupon-history > .tbody > .tr {
		height:90px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;	
	}
	.becup-member .member-history > .table.gift-history > .tbody > .tr {
		height:110px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;	
	}	
	.becup-member .member-history > .table.voucher-history > .tbody > .tr {
		height:130px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;
	}	
	.becup-member .member-history > .table.address-history > .tbody > .tr {
		height:90px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;
	}		
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr {
		height:142px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;		
	}
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr,
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr,
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr,
	.becup-member .member-invoice-tab-content > .table.referral_table > .tbody > .tr {
		border:1px solid #e3e3e3;
		margin-bottom:15px;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr,
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr {
		height:168px;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr,
	.becup-member .member-invoice-tab-content > .table.referral_table > .tbody > .tr {
		height:92px;
	}	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr {
		height:130px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;	
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr {
		height:182px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;
	}
	/* invoice no */
	.becup-member .member-history > .table.address-history > .tbody > .tr > .td:nth-child(1) {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		font-size:12px;
	}
	.becup-member .member-history > .table.address-history > .tbody > .tr > .td:nth-child(2) {	
		position:absolute;
		top:30px;
		left:0;
		font-size:12px;
	}	
	.becup-member .member-history > .table.address-history > .tbody > .tr > .td:nth-child(3) {	
		position:absolute;
		top:0;
		right:5px;
		font-weight:bold;
		font-size: 16px;		
	}		
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-history > .table.coupon-history > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-history > .table.gift-history > .tbody > .tr > .td:nth-child(1),	
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(1),
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(1) {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		font-weight:bold;
		color:#00A79D;
		font-size:12px;
		border-bottom:1px solid #f5f5f5 !important;
	}
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(1) {
		text-align:left;
	}
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(1) {
		text-align:left !important;
		/* //color:#005069; */
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(3),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(2) {
		border-bottom:1px solid #f5f5f5 !important;
	}	
	/* invoice date */
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(2),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(2),		
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(2),
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(2),
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(2),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(2) {
		position:absolute;
		top:0;
		right:0;
		width:100%;
		text-align:right;
	}
	/* item photo */
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .item-photo {
		position:absolute;
		top:33px;
		left:0;
		width:60px;
		height:60px;
		overflow:hidden;
	}
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .item-photo img {
		max-height:60px;
		margin:0 auto;
		max-width:100%;
		height:auto;
		display:block;
	}
	/* bill to */
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(3),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(3) {
		position:absolute;
		top:30px;
		left:0px;
	}
	.becup-member .member-history > .table.gift-history > .tbody > .tr > .td:nth-child(2),	
	.becup-member .member-history > .table.coupon-history > .tbody > .tr > .td:nth-child(2) {
		position:absolute;
		top:30px;	
	}			
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(1),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(1),		
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(3),
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(3) {
		position:absolute;
		top:30px;
		left:70px;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(9),
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(8),
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(7),
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(6),
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td.td_point_show,
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(3),
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(1),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(6),	
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(5),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(4),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(3),	
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(1),	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(3) {
		text-align:left;
		left:0px !important;
	}
	/* ship to */
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:50px;
		left:0px;
	}
	.becup-member .member-history > .table.gift-history > .tbody > .tr > .td:nth-child(3),	
	.becup-member .member-history > .table.coupon-history > .tbody > .tr > .td:nth-child(3) {
		position:absolute;
		top:50px;
	}
	.becup-member .member-history > .table.coupon-history > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		top:50px;
		right:10px;
	}
	.becup-member .member-history > .table.gift-history > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		top:70px;	
	}	
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(3),					
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		top:50px;
		left:70px;
	}
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(5),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:70px;
		left:0px;
		text-align:left;
		border-top:1px solid #f5f5f5 !important;
		width:100%;	
	}
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(6) {
		margin-top:9px;
	}
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(6),	
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(6),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(6) {
		position:absolute;
		top:90px;
		left:0px;
		text-align:left;
		width:100%;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(7),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(7) {
		position:absolute;
		top:110px;
		left:0px;
		text-align:left;
		width:100%;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(8),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(8) {
		position:absolute;
		top:130px;
		left:0px;
		text-align:left;
		width:100%;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-invoice-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(1) {
		position:absolute;
		top:0px;
		left:0px;
		text-align:left;
		border-top:1px solid #f5f5f5 !important;
		width:100%;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(2),
	.becup-member .member-invoice-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(2) {
		position:absolute;
		top:20px;
		left:0px;
		text-align:left;
		width:100%;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(3),
	.becup-member .member-invoice-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(3) {
		position:absolute;
		top:40px;
		left:0px;
		text-align:left;
		width:100%;	
	}
	.jolli-member .referral-cashdollar-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-invoice-tab-content > .table.referral_table > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		top:60px;
		left:0px;
		text-align:left;
		width:100%;	
	}					
	/* qty */
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td.td_point_show,
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(4),	
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:70px;
		left:70px;
		text-align:left;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(6),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:90px;
		left:70px;
		text-align:left;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(7),
	.jolli-member .member-profile-tab-content > .table.cashdollar_table > .tbody > .tr > .td:nth-child(6) {
		position:absolute;
		top:110px;
		left:70px;
		text-align:left;
	}
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(8) {
		position:absolute;
		top:130px;
		left:70px;
		text-align:left;
	}	
	.jolli-member .reward-trans-tab-content > .table > .tbody > .tr > .td:nth-child(9) {
		position:absolute;
		top:150px;
		left:70px;
		text-align:left;
	}				
	/* grand total */
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(5),
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(6) {
		position:absolute;
		bottom:0;
		left:0;
		width:100%;
		font-weight:bold;
		color:#EA5222;
		font-size:16px;
		text-align:right;
		border-top:1px solid #f5f5f5 !important;
	}
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(5) {
		top: 70px;
		height: 30px;
		border-bottom: 1px solid #f5f5f5 !important;
	}
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(5) {
		color:#005069;
	}	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(5) > span,		
	becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(6) > span {
		font-size:12px;
		color:#555;
		float:left;
	}
	/* view detail */	
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(7),
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		right:10px;
		width:40px;
		height:40px;
		text-align:center;
		margin-top:-20px;
		font-size:20px;
	}
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(4),
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(4) {
		top:20px;	
	}
	.becup-member .member-history > .table.voucher-history > .tbody > .tr > .td:nth-child(7){
		top:50px;	
	}
		
	.jolli-member .member-profile-tab-content > .table.order_table > .tbody > .tr > .td:nth-child(4),
	.jolli-member .referral-cashdollar-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-invoice-tab-content > .table.invoice_table > .tbody > .tr > .td:nth-child(4) {
		margin-top:-16px;
	}
	/* member point row */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr {
		height:170px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;	
	}
	.becup-member .member-history > .table.member-point-history > .tbody > .tr,
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr,
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr {
		height:130px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;
	}
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td,
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td,
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td,
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td {
		white-space:nowrap;
	}
	/* category */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(1),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(1) {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		font-weight:bold;
		color:#00A79D;
		font-size:16px;
		border-bottom:1px solid #f5f5f5 !important;
	}
	/* type */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(2),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(2),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(2),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(2) {
		position:absolute;
		top:30px;
		left:0;
		width:70%;
	}
	/* date */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(3),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(3),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(3),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(3) {
		position:absolute;
		top:0;
		right:0;
		width:100%;
		text-align:right;
	}
	/* valid date */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(4),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		top:50px;
		left:70%;
		width:30%;
	}
	/* expire date */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(5),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(5),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(5),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:70px;
		left:70%;
		width:30%;
	}
	/* invoice no */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(6),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(6),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(6),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(6) {
		position:absolute;
		top:50px;
		left:0;
		width:70%;
	}
	/* referee */
	/* 2019-1-8 - TK: hide for mobile */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(7),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(7),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(7) {
		position:absolute;
		top:90px;
		left:0;
		width:70%;
		text-align:left;	
	}
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(7) {
		display:none;
	}
	/* invoice total */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(8),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(8),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(8) {
		position:absolute;
		top:110px;
		left:0;
		width:70%;
		text-align:left;	
	}
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(8) {
		position:absolute;
		top:50px;
		left:70%;
		width:30%;
		text-align:left;
	}
	/* gain */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(9),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(9),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(9),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(9) {
		position:absolute;
		top:30px;
		left:70%;
		width:30%;
		text-align:left;
	}
	/* grand total */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(10),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(10),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(10),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(10) {
		position:absolute;
		bottom:0;
		left:0;
		width:100%;
		font-weight:bold;
		color:#EA5222;
		font-size:16px;
		text-align:right;
		border-top:1px solid #f5f5f5 !important;
	}
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(10) > span,
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(10) > span {
		font-size:12px;
		color:#555;
		float:left;
	}
	/* remark */
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(11),
	.becup-member .member-history > .table.member-point-history > .tbody > .tr > .td:nth-child(11),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(11),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(11) {
		position:absolute;
		top:70px;
		left:0;
		width:50%;
	}
	.becup-member .member-history > .table.referral-cashdollar-history > .tbody > .tr > .td:nth-child(12),
	.becup-member .member-history > .table.sent-gift-history > .tbody > .tr > .td:nth-child(12),
	.becup-member .member-history > .table.receive-gift-history > .tbody > .tr > .td:nth-child(12) {
		position:absolute;
		top:50px;
		left:70%;
		width:30%;	
	}
	.becup-member .product-tab > ul {
		margin-left:0;
		margin-right:0;
	}
	.becup-member .product-tab > ul > li > a {
		padding:10px 10px;
		font-size:12px;
	}
	.becup-member .product-tab > .tab-content {
		padding:0 15px;
	}
	/* 2019-2-12 - TK: cash out history */
	/* cash out row */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr {
		height:130px;
		border:1px solid #e3e3e3;
		margin-bottom:15px;
	}
	/* application no */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(1) {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		font-weight:bold;
		color:#00A79D;
		font-size:16px;
		border-bottom:1px solid #f5f5f5 !important;
	}
	/* application date */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(2) {
		position:absolute;
		top:0;
		right:0;
		width:100%;
		text-align:right;
	}
	/* cash out amount */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(3) {
		position:absolute;
		top:30px;
		left:0;
		width:100%;
		text-align:left;
	}
	/* actual amount */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(4) {
		position:absolute;
		bottom:0;
		left:0;
		width:100%;
		font-weight:bold;
		color:#EA5222;
		font-size:16px;
		text-align:right;
		border-top:1px solid #f5f5f5 !important;
	}
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(4) > span {
		font-size:12px;
		color:#555;
		float:left;
	}
	/* approval status */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(5) {
		position:absolute;
		top:50px;
		left:0;
		width:100%;
	}
	/* remark */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(6) {
		position:absolute;
		top:70px;
		left:0;
		width:100%;
	}
	/* view detail */
	.becup-member .member-history > .table.cash-out-history > .tbody > .tr > .td:nth-child(7) {
		position:absolute;
		top:50%;
		right:10px;
		width:40px;
		height:40px;
		text-align:center;
		margin-top:-20px;
		font-size:20px;
	}
}
/* 2018-12-31 - TK: avoid body scolling when sidr opened */
/* 2020-11-28 - TK: G said desktop allow scroll...so add media query for only mobile */
@media only screen and (max-width: 768px) {
	body.sidr-open {
		overflow-y:hidden;
		height:100vh;
	}
}
/* 2018-12-31 - TK: gridstack fixes */
.grid-stack.grid-stack-one-column-mode > .grid-stack-item {
	margin-bottom:0;
}
.seven_address{
	width:100%; 
	height:auto; 
	background-color:#FFFFFF; 
	color:#888888; 
	border-radius:3px; 
	border:1px solid #DDDDDD; 
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); 
	font-size:14px;
	padding:6px 12px;
}
/* 20190108 winston add css for validator of seven address*/
.seven_address_reminder{
	font-size:14px;
	color: #FF0000;
	margin:0px;
	display:none;
}
/* 2019-1-4 - TK: css for jolli cart */
#jolli-cart {
	display:flex;
}
#jolli-cart > .cart-nav {
	flex:0 0 300px;
	/* background-color:#f00; */
}
#jolli-cart > .cart-nav .breadcrumb {
	color:#bbb;
	border:none;
	padding:0;
}
#jolli-cart > .cart-nav .breadcrumb > a {
	color:#999;
}
#jolli-cart > .cart-nav .greeting {
	color:#0086B6;
	margin:40px 0 30px;
	font-size:30px;
	font-weight:200;
}
#jolli-cart > .cart-nav .nav-steps > li {
	margin-bottom:20px;
	line-height:24px;
	font-size:12px;
	position:relative;
}
#jolli-cart > .cart-nav .nav-steps > li > span {
	display:inline-block;
	width:24px;
	height:24px;
	border-radius:50%;
	background-color:#0086B6;
	color:#fff;
	line-height:24px;
	text-align:center;
	padding-top:1px;
	padding-left:2px;
	margin-right:15px;
}
#jolli-cart > .cart-nav .nav-steps > li.active::before {
	content:'';
	background-color:#DEC7CA;
	width:24px;
	height:3px;
	display:block;
	position:absolute;
	top:10px;
	left:-30px;
}
#jolli-cart > .cart-detail {
	flex:1 1 auto;
}
#jolli-cart > .cart-detail > .table-title {
	border-top:1px solid #E1E1E1;
	border-right:1px solid #E1E1E1;
	border-left:1px solid #E1E1E1;
	background-color:#eee;
	padding:0 40px;
	line-height:60px;
}
#jolli-cart > .cart-detail > .table {
	width:100%;
	border:1px solid #E1E1E1;
	display:table;
}
#jolli-cart > .cart-detail > .table .thead {
	display:table-header-group;
}
#jolli-cart > .cart-detail > .table .thead .tr {
	display:table-row;
}
#jolli-cart > .cart-detail > .table .thead .th {
	line-height:35px;
	padding:0 15px;
	font-weight:normal;
	display:table-cell;
}
#jolli-cart > .cart-detail > .table .thead .th:not(:last-child) {
	border-right:1px solid #E1E1E1;
}
#jolli-cart > .cart-detail > .table .tbody {
	display:table-row-group;
}
#jolli-cart > .cart-detail > .table .tbody .tr {
	display:table-row;
}
/* 2019-1-18 jaydon: jolli cart padding less */
#jolli-cart > .cart-detail > .table .tbody .td {
	padding:1px 15px;
	font-weight:normal;
	display:table-cell;
	vertical-align:top;
	border-top:1px solid #E1E1E1;
}
#jolli-cart > .cart-detail > .table .tbody .td:not(:last-child) {
	border-right:1px solid #E1E1E1;
}
#jolli-cart > .cart-detail > .table .tfoot {
	display:table-footer-group;
}
#jolli-cart > .cart-detail > .table .tfoot .tr {
	display:table-row;
}
/* 2019-1-18 jaydon: jolli cart padding less */
#jolli-cart > .cart-detail > .table .tfoot .td {
	padding:1px 15px;
	font-weight:normal;
	display:table-cell;
	border-top:1px solid #E1E1E1;
}
#jolli-cart > .cart-detail > .table .tfoot .td:not(:last-child) {
	border-right:1px solid #E1E1E1;
}
/* 2019-1-17 jaydon: jolli cart in checkout */
#jolli-cart .cart-detail > .table .delivery-method-th{
	width: 40%;
}
#jolli-cart .cart-detail > .table.full-input-table .td{
	padding: 0;
	vertical-align: middle;
	text-align: center;
}
#jolli-cart .cart-detail > .table.full-input-table .form-group{
	margin-bottom: 0;
}
#jolli-cart .cart-detail > .table.full-input-table input{
    margin: 0;
    border: 0;
    width: 100%;
    padding: 0 10px;	
}
#jolli-cart .cart-detail > .table.full-input-table .shipping-mobile{
	padding-left: 50px;
}
#jolli-cart .cart-detail > .table .td.text-left{
	text-align: left;
}
#jolli-cart > .cart-detail > .table .tfoot .td.colspan-2{
	border-right: 0;
}
#jolli-cart > .cart-detail .grand-total{
	font-size: 18px;
}
#jolli-cart > .cart-detail .delivery-total.deleted{
	text-decoration: line-through;
}
#jolli-cart > .cart-detail .cash-dollar-field{
	width: 100%;
}

/* 2019-1-30 jaydon: jolli cart new ui */
#jolli-cart > .cart-detail .table{
	border-collapse: collapse;
}
#jolli-cart > .cart-detail .table .table-tr{
	display: table-row;
}
#jolli-cart > .cart-detail .table .table-th{
	display: table-cell;
    border: .5px solid #E1E1E1;
    width: 15%;
}
#jolli-cart > .cart-detail .table .table-td{
	display: table-cell;
	
}
#jolli-cart > .cart-detail .table .sub-table{
	display: table;
	width: 100%;
}
#jolli-cart > .cart-detail .table .sub-table-tr{
	display: table-row;
}
#jolli-cart > .cart-detail .table .sub-table-td{
	display: table-cell;
	width: 15%;
    border: 1px solid #E1E1E1;		
	text-align: center;
	vertical-align: middle;	    
}
#jolli-cart > .cart-detail .table .qty-td{
	padding-left: 10px;
	padding-right:10px;
}
#jolli-cart > .cart-detail .table .qty-td button{
    background-color: #b9c2b7;	
}
#jolli-cart > .cart-detail .table .coupon-td{
	padding: 10px 10px 0 10px;
}
#jolli-cart > .cart-detail .table .coupon-td .input-group{
	margin-bottom: 10px;
}
#jolli-cart > .cart-detail .table .coupon-td input{
	height: 30px;
}
#jolli-cart > .cart-detail .table .coupon-td button{
    background-color: #b9c2b7;
    border-radius: 0;
    height: 30px;
    font-weight: 400;
    font-size: 12px;
    letter-spacing: 2px;
    padding: 5px 10px 5px 10px;	
}
#jolli-cart > .cart-detail .table .tfooter .sub-table-td{
    padding: 15px 30px;
}
#jolli-cart > .cart-detail .table .sub-table-td:first-child, #jolli-cart > .cart-detail .table .table-th:first-child{
	width: 20%;
}
#jolli-cart > .cart-detail .table .sub-table-td:first-child, #jolli-cart > .cart-detail .table .table-th:first-child{
	width: 20%;
}
#jolli-cart > .cart-detail .table .sub-table-td:nth-child(5), #jolli-cart > .cart-detail .table .table-th:nth-child(5){
	width: 25%;
}
#jolli-cart > .cart-detail .table .sub-table-td:nth-child(5), #jolli-cart > .cart-detail .table .table-th:nth-child(5){
	width: 25%;
}
#jolli-cart > .cart-detail .table .sub-table-td:last-child, #jolli-cart > .cart-detail .table .table-th:last-child{
	width: 10%;
}
#jolli-cart > .cart-detail .table .sub-table-td:last-child, #jolli-cart > .cart-detail .table .table-th:last-child{
	width: 10%;
}
#jolli-cart > .cart-detail .cart-control a, #jolli-cart > .cart-detail .cart-control button{
	border-radius: 0;
	background-color: #008cb5;
    font-weight: 300;
    padding: 15px 15px;
    letter-spacing: 3px;
}
#jolli-cart > .cart-detail .tfooter .sub-table-td:first-child, #jolli-cart > .cart-detail .tfooter .sub-table-td:last-child{
	width: 35%;
}
#jolli-cart > .cart-detail .tfooter .delivery-total, #jolli-cart > .cart-detail .tfooter .delivery-title{
	color: #38b6ce;
}





@media only screen and (max-width: 768px) {
	#jolli-cart > .cart-nav {
		display:none;
	}
}
/* 20190111 winston bug fix IE css issue */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#becup-desk-member-mine > .member-profile > .member-redeem > .member-credit-bottom > .member-redeem-content > .convert-button-margin {
		margin-left:1em !important;
	}
}
/* 2019-1-15 - TK: common class for product-detail mark price */
.common-mark-price {
	font-size:0.8em;
	color:#666;
	text-decoration:line-through;
	margin-right:10px;
	font-weight:normal;
}
/* 2019-1-29 - TK: build-to-order-modal css */
#build-to-order-modal .modal-dialog {
	margin-top:30px !important;
}
#build-to-order-modal .product-detail {
	min-height:0;
}
#build-to-order-modal .product-detail .product-title {
	margin-bottom:10px;
}
#build-to-order-modal .product-detail .touch-spin {
	text-align:center;
}
#build-to-order-modal .label-upload-wrapper {
	position:relative;
	width:200px;
	height:200px;
	border:1px dashed #ccc;
	text-align:center;
}
#build-to-order-modal .label-upload-wrapper input[type='file'] {
	cursor:pointer;
	font-size:200px !important;
	opacity:0;
	position:absolute;
	top:0px;
	left:0px;
	width:200px !important;
	height:200px !important;
}
#build-to-order-modal .label-upload-wrapper i.fa-image {
	display:block;
	margin:25px 0 25px;
	font-size:100px;
	color:#d8d8d8;
}
#build-to-order-modal .label-upload-wrapper img {
	margin:10px auto;
	max-width:180px;
	max-height:140px;
	display:block;	
}

#build-to-order-modal .label-upload-wrapper .btn {
	width:calc(100% - 20px);
	position:absolute;
	bottom:10px;
	left:10px;
}
#build-to-order-modal .label-croppie-wrapper {
	border:1px dashed #ccc;
	position:absolute;
	left:50%;
	top:50%;
	background-color:#fff;
}
#build-to-order-modal .label-croppie-wrapper .label-croppie {
	position:absolute;
	left:0;
}
#build-to-order-modal .label-croppie-wrapper .watermark {
	position:absolute;
	text-align:center;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
}
#build-to-order-modal .preview-wrapper {
	width:450px;
	height:450px;
	position:relative;
}
/* 2019-2-12 - TK: css for table style form */
.common-table-form {
	width:100%;
	display:table;
	padding-left:15px;
	padding-right:15px;
}
@media (max-width: 767px) {
	.common-table-form {
		display:block;
		padding-left:0;
		padding-right:0;
	}
}
.common-table-form > .tr {
	display:table-row;
}
.common-table-form > .tr > .th {
	display:table-cell;
	font-weight:500;
	vertical-align:top;
	padding-top:10px;
}
.common-table-form > .tr > .td {
	display:table-cell;
}
.common-table-form > .tr > .td .select2-container {
	width:100% !important;
	margin-bottom:10px;
}
.common-table-form > .tr > .td input[type="number"] {
	margin-bottom:10px;
	color:#888888;
}
.common-table-form > .tr > .td .input-group input[type="number"] {
	margin-bottom:0;
}
.common-table-form > .tr > .td .form-control[readonly],
.common-table-form > .tr > .td .form-control[disabled] {
	background-color:#f6f6f6;
}
.common-table-form > .tr > .td > .inline-group {
	display:flex;
}
.common-table-form > .tr > .td > .inline-group > span {
	line-height:36px;
	padding:0 5px;
	flex:0 1 0;
}
.common-table-form > .tr > .td > .inline-group > input[data-flex-grow='3'] {
	flex:3 1 0;
}
.common-table-form > .tr > .td > .inline-group > input[data-flex-grow='9'] {
	flex:9 1 0;
}
/* 2019-2-13 - TK: include adminlte timeline css */
.timeline {
  position: relative;
  margin: 0 0 30px 0;
  padding: 0;
  list-style: none;
}
.timeline:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #ddd;
  left: 31px;
  margin: 0;
  border-radius: 2px;
}
.timeline > li {
  position: relative;
  margin-right: 10px;
  margin-bottom: 15px;
}
.timeline > li:before,
.timeline > li:after {
  content: " ";
  display: table;
}
.timeline > li:after {
  clear: both;
}
.timeline > li > .timeline-item {
	border:1px solid #eee;
  border-radius: 10px;
  margin-top: 0;
  background: #fff;
  color: #444;
  margin-left: 60px;
  margin-right: 15px;
  padding: 0;
  position: relative;
}
.timeline > li > .timeline-item > .time {
  color: #999;
  float: right;
  padding: 10px;
  font-size: 12px;
}
.timeline > li > .timeline-item > .timeline-header {
  margin: 0;
  color: #555;
  border-bottom: 1px solid #eee;
  padding: 10px;
  font-size: 13px;
  line-height: 1.1;
}
.timeline > li > .timeline-item > .timeline-header > a {
  font-weight: 600;
}
.timeline > li > .timeline-item > .timeline-body,
.timeline > li > .timeline-item > .timeline-footer {
  padding: 10px;
  font-size:12px;
}
.timeline > li > .fa,
.timeline > li > .glyphicon,
.timeline > li > .ion {
  width: 30px;
  height: 30px;
  font-size: 15px;
  line-height: 30px;
  position: absolute;
  color: #fff;
  background: #d2d6de;
  border-radius: 50%;
  text-align: center;
  left: 18px;
  top: 0;
}
.timeline > .time-label > span {
  font-weight: 500;
  padding: 5px 15px;
  display: inline-block;
  background-color: #BFC9CA;
  border-radius: 4px;
  color:#fff;
}
.timeline-inverse > li > .timeline-item {
  background: #f0f0f0;
  border: 1px solid #ddd;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.timeline-inverse > li > .timeline-item > .timeline-header {
  border-bottom-color: #ddd;
}



/* 2019-2-21 jaydon: ad popup */
/* 2020-6-3 - TK: FOJY remove fk buggy modal and use my own */
#ad-popup-modal .modal-content {
	background-color:#fff;
}
#ad-popup-modal .modal-body {
	padding:10px;
}

/* 2019-4-16 - TK: hide spin button for input[type=number] */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}
/* 2019-5-16 - TK: referral QR code for offline scanning */
.referral-qrcode {
	text-align:center;
}
.referral-qrcode img, .referral-qrcode canvas {
	margin:0 auto;
}
/* 2019-5-19 - TK: for language flag */
.lang-flag {
	background-image: url('./img/flags2x.png');
	width:20px;
	height:14px;
	display:inline-block;
	vertical-align:middle;
	margin-right:10px;
	background-size:5630px 15px;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
	.lang-flag {
		background-size:5630px 15px;
	}
}
.lang-flag.ZH_HK {
	background-position: -2171px 0px;
}
.lang-flag.EN_US {
	background-position: -2171px 0px;
}
.lang-flag.ZH_CN {
	background-position:-1049px 0px;
}
.lang-flag.ZH_TW {
	background-position:-5131px 0px;
}
.lang-flag.EN_SG {
	background-position:-4449px 0px;
}

/* 2019-5-31 kelvin: center items */
.center-item {
	text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.overlay-right-item {
	text-align: center;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(-10%, -50%);
}

.overlay-top-left-item {
	text-align: center;
    position: absolute;
    top: 25%;
    left: 0;
    transform: translate(10%, 0%);
}

.overlay-bottom-left-item {
	text-align: center;
    position: absolute;
    top: 75%;
    left: 0;
    transform: translate(10%, 0%);
}

.overlay-left-item {
	text-align: center;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(10%, -50%);
}

.overlay-box {
	background: white;
	opacity: 0.7;
	padding: 40px 20px;
	border-radius: 6px;
}

.overlay-box-full {
	background: black;
	opacity: 0.7;
	padding: 20px;
	width: 100%;
}

.overlay-box-2 {
	background: transparent;
	padding: 40px 60px;
}

.overlay-top-item {
	text-align: center;
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translate(-50%, 0%);
}

.overlay-bottom-item {
	text-align: center;
    position: absolute;
    bottom: 0%;
    left: 50%;
    transform: translate(-50%, 0%);
}

.overlay-text-header {
	font-size: 30px;
}

@media only screen and (max-width: 768px) {
	.overlay-right-item, .overlay-top-left-item, .overlay-bottom-left-item, .overlay-top-item, .overlay-left-item, overlay-bottom-item, .center-item  {
		text-align: center;
		position: absolute;
		top: 50%;
		left: 50%;
		right: unset;
   	 	bottom: unset;
		transform: translate(-50%, -50%);
    }
    
    .overlay-text-header {
		font-size: 16px;
	}
	
	.footer-col {
		margin: 10px !important;
	}
}

.text-block-1 {
	min-height: 580px;
}

/* 2019-6-3 kelvin: footer-col */
.footer-col {
	margin: 25px 0;
}

.footer-col .footer-col-header {
    font-size: 1.2em;
    padding-left: 0px;
    font-weight: 700;
}

.footer-col li {
    line-height: 30px;
    padding-left: 5px;
}

.outline-btn {
	border: 1px solid !important;
}

@media (min-width: 769px){

	.table {
		display: table;
		width: 100%; 
	}
	.table-cell {
		 display: table-cell;
		padding: 0 20px;
		vertical-align: middle;
	}

}

/* 2019-8-7 kelvin: line-style */
.line-style {
    margin-bottom: 50px;
    position: relative;
    float: none;
    border-bottom: 1px solid #e5e2e2;
    height: 10px;
}

.line-style h4 {
    text-align: center;
    font-size: 16px;
    font-weight: normal;
    background-color: white;
    position: relative;
    display: table;
    margin: auto;
    margin-bottom: 10px;
    color: #666667;
    padding: 0 16px;
}

/* 2019-8-21 - TK: register from LayoutHelper now. so register css here */
#page-body-overlay {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,.5);
	display:none;
	z-index:900;
}
#page-body-overlay i {
	font-size:60px;
	position:absolute;
	top:240px;
	left:50%;
	margin-left:-30px;
	color:#eee;
}
/* 2019-10-9 - TK: css for payme */
.payme-process {
	padding:0 24px;
	margin-top:-36px;
}
.payme-logo {
	max-width:200px;
	max-height:70px;
}
.payme-process h1 {
	margin-top:24px;
	font-size:20px;
}
.payme-process p {
	font-size:14px;
	color:#767676;
}
.payme-process h3 {
	font-size:16px;
}
.payme-tutor {
	margin-top:12px;
	display:flex;
}
.payme-tutor li {
	float:left;
	flex:0 1 33%;
	line-height:30px;
	white-space:nowrap;
}
.payme-tutor li:not(last-child) {
	padding-right:30px;
}
.payme-tutor li > span {
	display:inline-block;
	width:30px;
	height:30px;
	color:#fff;
	background-color:#767676;
	text-align:center;
	border-radius:50%;
	margin-right:16px;
}
#pay-code-canvas {
	width:300px;
	height:300px;
	margin:16px auto;
	border:none;
}
.btn-payme {
	margin-top:24px;
	background-color:#db0011 !important;
	border-radius:21px !important;
	padding-left:24px !important;
	padding-right:24px !important;
}
/* 2020-1-21 - TK: css for mobile-preview */
#mobile-preview {
	width:100%;
	height:100vh;
	background-color:#fafafa;
	text-align:center;
}
#mobile-preview .mobile-preview-toolbar {
	height:50px;
	background-color:#fff;
	box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
	line-height:50px;
}
#mobile-preview .mobile-preview-toolbar .control {
	display:inline-block;
	width:auto;
	margin:0 25px;
}
#mobile-preview .mobile-preview-toolbar .control.device-type {
	width:180px;
}
#mobile-preview .mobile-preview-toolbar .control > * {
	display:inline-block;
	width:auto;
}
#mobile-preview .mobile-preview-toolbar .control > input[type="text"] {
	width:100px;
	text-align:center;
}
#mobile-preview .mobile-preview-toolbar .control > span {
	margin:0 10px;
}
#mobile-preview .mobile-preview-frame {
	border:1px solid #DFDFE1;
	margin:30px auto;
	box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.2);
}
#opacity-fb-send-to-messenger {
	padding-top:40px;
}
/* 2020-2-24 - TK: hide chatbot when sidr cart opened */
body.sidr-open #fc_frame, body.sidr-open #fb-root {
	display:none;
}

/* 2018-11-15 - TK: magic style sign-in */
#magic-sign-in-page {
	/* 2018-12-12 jaydon: no need top border */
	height:calc(100vh - 60px);
	display:flex;
}
#magic-sign-in-page .left-nav {
	flex:1 1 44%;
	/* 2018-11-19 jaydon: use self config image no need backgorund-color	 */
/* 	background-color:#FACF03; */
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
}
#magic-sign-in-page .right-form {
	flex:1 1 56%;
	padding:0 30px;
}
#magic-sign-in-page .right-form .container {
	width:100% !important;
}
#magic-sign-in-page h2.block-title-2 {
	font-size:32px;
	font-weight:300;
	border:none;
	margin:20px 0 40px;
}
#magic-sign-in-page h2.block-title-2::after {
	content: '';
	display: block;
	width: 96px;
	height: 4px;
	margin-top: 13px;
	background-color: #12AB98;
}
@media only screen and (max-width: 768px) {
	#magic-sign-in-page {
		height:auto;
		display:block;
	}
	#magic-sign-in-page .phone-register-nav {
		height:80px;
	}
	#magic-sign-in-page .right-form {
		padding:0 10px;
	}
	#magic-sign-in-page h2.block-title-2::after {
		width:36px;
		margin:13px auto 0;
	}
}
.slider .tooltip-inner, .slider .border-top-color {
	background-color:#bbb !important;
}
/* 2020-3-11 - TK: make 50% width and align center for mobile with 1/12 width */
.grid-stack.grid-stack-one-column-mode > .grid-stack-item.gs-component-image[data-gs-width="1"],
.grid-stack.grid-stack-one-column-mode > .grid-stack-item.gs-component-image[data-gs-width="2"] {
	width:50% !important;
	margin-left:25% !important;
}
/* 2020-3-16 - TK: disable horizontal scrolling for image as banner */
.grid-stack.grid-stack-one-column-mode > .grid-stack-item.gs-component-image {
	overflow-x:hidden;
}
.serial-no-qrcode {
	margin:10px;
}
.serial-no-qrcode > img {
	width:120px;
}
#ajax-loader-progress {
	display: block;
	text-align: center;
	width: 0;
	height: 2px;
	background:#999;
	opacity:0.5;
	transition: width .3s;
	position:fixed;
	top:0;
	z-index:10000;
	left:0;
}
#page-body {
	min-height:800px;
}
/* 2021-12-29 - TK: smaller min-height for mobile */
@media (max-width: 767px) {
	#page-body {
		min-height:400px;
	}
}
/* 2020-5-27 - TK: winston product-list loader css moved to here */
.loader {
	border: 5px solid #f3f3f3; 
	border-top: 5px solid #000;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	animation: spin 2s linear infinite;
	margin: 0 auto;
}

.hint {
	font-size: 14px;
	color: #000;
	text-align: center;
}

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

/* 2020-6-3 - TK: put shared css here (before using /templates/becup/assets/css/style.css) */
@media only screen and (max-width: 768px) {
	.catTopBar {
			margin-bottom: 10px;
			border-bottom: 1px solid #e3e3e3;
			margin-top: 0 !important;
	}
	.pc-component-location .location-map-wrapper {
		height: 80vh !important;
	}
}
/* 2020-6-5 - TK: set add modal height so it would not be flipped when rendering layout */
#ad-popup-modal .modal-dialog .modal-content {
	box-shadow:none !important;
}
#ad-popup-modal .modal-dialog.modal-sm .modal-content {
	height:calc(40vh - 100px);
}
#ad-popup-modal .modal-dialog.modal-md .modal-content {
	height:calc(70vh - 100px);
}
#ad-popup-modal .modal-dialog.modal-lg .modal-content {
	height:calc(100vh - 100px);
}
/* 2020-6-8 - TK: move shared product list css here */
.product-list-menu > .mobi-sort-by > ul > li > a > i {
	display:none;
}
.product-list-menu > .mobi-sort-by > ul > li > a.active > i {
	display:block;
}
/* 20200617 winston prevent fixed width height overflow problem */
.pc-component-text > .text-content iframe,
.pc-component-text > .text-content img {
	max-width:100% !important;
	height:auto;
}

/* 2020-6-24 - TK: MagicProductDetailImage widget css */
.zoomThumb {
    text-align: center;
    margin-top: 10px;
}

.zoomThumb a {
    display: inline-block;
    width: 120px;
    margin-bottom: 10px;
    border: 2px solid #eee;
    display: inline-block;
    margin-right: 5px;
}

.zoomThumb a img {
    max-width: 100%;
    width: 116px;
    height: 116px;
    object-fit: contain;
}

.zoomImg {
    cursor: crosshair;
}
.product-detail .productImageZoom .zoomThumb{
	text-align: left;
}
#system-info {
	z-index: 99999;
}
.font-line {
   width: 100%; 
   text-align: center; 
   border-bottom: 1px solid #ccc; 
   line-height: 0.1em;
   margin: 30px 0 30px; 
}
.font-line span { 
    background: #fff; 
    padding: 0 10px; 
}
.facebook-button {
	background-color: #395794;
	color: #FFFFFF;
}
/*20200812 winston add LINE login*/
.line-button {
	background-color: #02B902;
	color: #FFFFFF;
}
.login-button {
	/*padding: 15px !important;*/
	padding: 6px 12px !important;
}
.login-button:hover {
	color: #d6d6d6 !important;
}
.login-icon {
	font-size: 26px;
	line-height: 20px;
	float: left;
}
#otp-trigger,
#forgot-password,
#desktop-login-toggle,
#desktop-register-toggle {
	color: #0676B2;
	text-decoration: underline;
}
#show_hide_password > .input-group-addon {
	border: 0px;
	background-color: #FFFFFF;
	color: #454545;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
	border: 1px solid #ddd;
}
#show_hide_password > .input-group-addon > a:focus,
#show_hide_password > .input-group-addon > a:hover {
	color: #454545;
}
#show_hide_password > input {
	border-right: 0px;
}
#otp-password-section {
	margin: 30px 0;
}
#reset-password,
#otp-modal {
	z-index: 1600;
}
@media only screen and (max-width: 768px) {
	.modal-dialog {
		width: auto !important;
	}
	.modal-dialog.modal-xs {
		max-width: 100% !important;
	}	
}
/* 2020-7-6 - TK: booking detail modal css */
#booking-detail-modal .modal-header {
	margin-bottom:0;
}
#booking-detail-modal .modal-body {
	height:90vh;
	overflow:hidden;
	position:relative;
}
#booking-detail-modal .booking-section {
	border-top:1px solid rgba(0, 0, 0, 0.03);
	border-bottom:1px solid rgba(0, 0, 0, 0.03);
	padding:10px 0;
}
#booking-detail-modal .booking-option {
	text-align:center;
	line-height:40px;
	border:1px solid rgba(0, 0, 0, 0.03);
	margin-top:10px;
	cursor:pointer;
}
#booking-detail-modal .booking-option:hover, #booking-detail-modal .booking-option.selected {
	border-color:#9AE1FF;
	color:#2AA39E;
	background-color:#E8F7FF;
}
#booking-detail-modal .range-calendar .months .cell.selected {
	background-color:#E8F7FF;
	box-shadow:inset 0 0 1px #9AE1FF;
}
#booking-detail-modal .range-calendar .months .cell.selected .date-formatted,
#booking-detail-modal .range-calendar .months .cell.selected .date-formatted .month-name {
	color:#2AA39E;
}
#booking-detail-modal .default-theme .range-bar {
	background-color:#E8F7FF !important;
}
#booking-detail-modal .default-theme .calendar .cell.selected {
	box-shadow:inset 0 0 1px #9AE1FF;
}
#booking-detail-modal .default-theme .calendar .cell.selected,
#booking-detail-modal .default-theme .calendar .cell.selected .day-number {
	color:#2AA39E !important;
}
#booking-detail-modal .modal-data {
	height:100%;
}
#booking-detail-modal .booking-input {
	height:calc(100% - 100px);
	overflow-x:hidden;
	overflow-y:auto;
}
#booking-detail-modal .booking-summary {
	height:100px;
	border-top:1px solid rgba(0, 0, 0, 0.03);
	padding-top:15px;
}
#booking-detail-modal .booking-summary .booking-price {
	font-size:1.3em;
}
#booking-detail-modal .booking-summary .booking-price .lowlight {
	font-size:0.6em;
	color:#888;
}
#booking-detail-modal .booking-summary .booking-time {
	font-size:1em;
	color:#2AA39E;
	margin-bottom:10px;
}
#booking-detail-modal .booking-summary .booking-equipment {
	padding-top:5px;
}
#booking-detail-modal .booking-summary .booking-equipment i {
	color:#666;
	font-size:1.2em;
	margin-right:15px;
}
#booking-detail-modal .booking-summary .booking-equipment .inline-block {
	width:calc(100% - 35px);
}
#booking-detail-modal .booking-summary .booking-equipment .select2-container {
	width:100%;
}
#booking-detail-modal .booking-summary .confirm-booking {
	padding-left:28px;
	padding-right:28px;
}
#booking-detail-modal .range-calendar .calendar .cell {
	padding:10px 20px;
}
#booking-detail-modal .range-calendar {
	padding:0;
}
#booking-detail-modal .time-slot-container {
}

#boss-content {
	position:relative;
}
/* 2020-7-20 - TK: G said hide option instead of disabled */
.select2-container--default .select2-results__option[aria-disabled=true] {
	display: none;
}
.pc-component-slideshow-full-page {
	z-index: -1 !important;
}
.parsley-pattern {
	line-height: 14px;
}
/* 2020-7-29 - TK: make sure datepicker readonly still white in background */
.form-control.datepicker[readonly] {
	background-color:#fff;
}
.pc-component-text>.text-content img {
    max-width: 100% !important;
    height: auto !important;
}
/* 20200806 winston add announcement bar */
.announcement-bar {
    background-color: #6894ae;
    text-align: center;
    position: relative;
    z-index: 10;    
}
.announcement-bar-message {
	padding: 10px 55px;
	margin: 0;
	display: block;
    font-size: 16px;
    font-weight: 400;
    color: #FFFFFF;
}
.announcement-bar-message > p {
	margin: 0;
}
.product-detail .jssocials-share-link {
	color: #FFFFFF !important;
	border-color: unset !important;
}
@media only screen and (max-width: 768px) {
	.mobi-right-button {
		display: block;
		position: relative;
		top: 12px;
		font-size: 1.6em;
		color: #3A3A3A;
		width: 30px;
		text-align: center;
		right: 10px;
		float: right;
	}
	.announcement-bar-message {
		padding: 10px;
	}	
}
/* 2020-9-22 - TK: put generic css for product list here */
@media only screen and (max-width: 768px) {
	.product-list-menu {
		display:flex;
		width:calc(100% + 30px);
		margin-left:-15px;
	}
	.product-list-menu > .mobi-sort-by {
		text-align:center;
		flex:1 1 auto;
	}
	.product-list-menu > .mobi-sort-by:not(:last-child) {
		border-right:1px solid #e3e3e3;
	}
	.product-list-menu > .mobi-sort-by .icon {
		display:inline-block;
		line-height:30px;
		color:#e8477f;
		font-size:20px;
		margin-right:10px;
		vertical-align:middle;
	}
	.product-list-menu > .mobi-sort-by .icon > i {
		color:transparent;
		-webkit-text-stroke-width:1px;
		-webkit-text-stroke-color:#e8477f;
	}
	.product-list-menu > .mobi-sort-by .text {
		display:inline-block;
		line-height:30px;
		font-size:14px;
		color:#666;
		vertical-align:middle;
	}
	.product-list-menu > .mobi-sort-by .dropdown-menu {
		margin-left:10px;
		margin-top:10px;
		border-radius:0;
		background-color:#ECEAEA;
		border-color:#dfdfdf;
		font-size:14px;
	}
	.product-list-menu > .mobi-sort-by .dropdown-menu > li > a {
		color:#333;
		line-height:25px;
	}
	.product-list-menu > .mobi-sort-by .dropdown-menu > li > a > i {
		color:#e8477f;
    line-height:inherit;
    display:none;
	}
	.product-list-menu > .mobi-sort-by .dropdown-menu > li > a.active > i {
		display:block;
	}
	.product-list-menu > .mobi-sort-by .dropdown-menu > li > a:hover {
		background-color:#F6F6F6;
	}
	.product-list-menu > .mobi-sort-by .dropdown-menu:after {
		position:absolute;
		top:-8px;
		left:10px;
		display:inline-block;
		border-right:8px solid transparent;
		border-bottom:8px solid #ECEAEA;
		border-left:8px solid transparent;
		content:'';
	}
	.product-list-breadcrumb {
		width:calc(100% + 30px);
		margin-left:-15px;
		line-height:normal;
		text-align:center;
		font-weight:500;
		padding:10px;
		border-bottom:1px solid #e3e3e3;
		background-color:#F6F6F6;
		font-size:1.1em;
	}
}
.popup-bundle-dialog {
	margin-top: 15px !important;
	max-height: calc(100% - 30px);
}
/* 2020-12-3 - TK: fix plugin z-index when open from modal */
body.modal-open .ui-datepicker, body.modal-open .select2-dropdown {
	z-index:99999 !important;
}
/* 2020-12-14 - TK: input-group with intl-tel */
.input-group {
	width:100%;
}
.input-group .intl-tel-input {
	display:table-cell;
}
.input-group .input-group-btn {
	vertical-align:top;
}
.ui-datepicker {
	z-index:9999 !important;
}
@media only screen and (max-width: 768px) {
    /*20201221 winston fix all themes pagination button ui problem */
    .pagination{
    	margin: 20px 15px !important;
    }
}

/* 2021-3-1 - TK: put form helper css here...*/
.fileinput-upload-button, .fileinput-remove-button {
	display:none;
}
.fileinput-remove {
	display:none;
}
.file-preview-frame {
	position:relative;
}
.file-input-widget .file-preview {
	padding:0;
}
.file-input-widget.fileinput-sm .file-preview .file-drop-zone {
	margin:0;
}
.file-input-widget.fileinput-sm .file-preview .file-drop-zone .file-drop-zone-title {
}
.file-input-widget.fileinput-sm .file-drop-zone-title {
	font-size:20px;
	padding:15px 10px;
}
.file-input-widget .file-preview-thumbnails img {
	max-width:100%;
}
.file-input-widget .file-thumbnail-footer {
	position:absolute;
	top:-12px;
	right:-8px;
}
.file-input-widget .file-thumbnail-footer .file-caption-name {
	display:none;
}
.file-input-widget .file-thumbnail-footer .kv-file-remove {
	padding:0;
	width:16px;
	height:16px;
	border-radius:50%;
	border-color:#a94442;
	background-color:#fff;
}
.file-input-widget .file-thumbnail-footer .kv-file-remove i {
	font-size:9px;
	top:-1px;
}
.file-input-widget .fileinput-remove-button,
.file-input-widget .fileinput-upload-button {
	display:none;
}
.parsley-errors-list {
	color:#c00;
}
.option-button {
	cursor:pointer;
	float:left;
	padding:5px 10px;
	font-size:12px;
	color:#555;
	border: 1px dashed #555;
	border-radius: 5px;
	margin-right:5px;	
	margin-bottom:5px;
}
.option-button.selected{
	color:#FF0000;
	border:1px solid #FF0000;
	animation:fadeIn ease 0.5s;
	-webkit-animation:fadeIn ease 0.5s;
	-moz-animation:fadeIn ease 0.5s;
	-o-animation:fadeIn ease 0.5s;
	-ms-animation:fadeIn ease 0.5s;	
}
.product-variants {
	margin-bottom:10px;
}
/* 2021-3-16 - TK: copy knob css for referral org chart */
.kpi-container {
	display:flex;
	flex-wrap:wrap;
}
.knob {
	width:60px;
	height:60px;
	border-radius:50%;
	line-height:44px;
	text-align:center;
	font-weight:500;
	border:7px solid #000;
	position:relative;
	font-size:16px;
	margin:10px 30px 40px 30px;
	cursor:pointer;
	user-select:none;
}
.knob.knob-orange {
	border-color:rgba(255, 167, 2, 1);
}
.knob.knob-yellow {
	border-color:rgba(251, 207, 52, 1);
}
.knob.knob-green {
	border-color:rgba(99, 158, 141, 1);
}
.knob.knob-blue {
	border-color:rgba(120, 181, 205, 1);
}
.knob.knob-purple {
	border-color:rgba(192, 146, 192, 1);
}
.knob.knob-brown {
	border-color:rgba(175, 123, 88, 1);
}
.knob.knob-black {
	border-color:rgba(0, 0, 0, 1);
}
.knob.knob-red {
	border-color:rgba(223, 74, 50, 1);
}
.knob .title {
	position:absolute;
	bottom:-47px;
	left:-30px;
	font-size:13px;
	font-weight:normal;
	width:calc(100% + 60px);
	white-space:nowrap;
}
.knob:not(.active) .count {
	opacity:0.3;
}
.knob.knob-orange:not(.active) {
	border-color:rgba(255, 167, 2, 0.3);
}
.knob.knob-yellow:not(.active) {
	border-color:rgba(251, 207, 52, 0.3);
}
.knob.knob-green:not(.active) {
	border-color:rgba(99, 158, 141, 0.3);
}
.knob.knob-blue:not(.active) {
	border-color:rgba(120, 181, 205, 0.3);
}
.knob.knob-purple:not(.active) {
	border-color:rgba(192, 146, 192, 0.3);
}
.knob.knob-brown:not(.active) {
	border-color:rgba(175, 123, 88, 0.3);
}
.knob.knob-black:not(.active) {
	border-color:rgba(0, 0, 0, 0.3);
}
.knob.knob-red:not(.active) {
	border-color:rgba(223, 74, 50, 0.3);
}
.knob .title > a {
	position:absolute;
	right:0;
	bottom:0;
	/* display:none; */
}
.knob:hover .title > a {
	display:block;
}
.knob-square {
	width:180px;
	height:30px;
	border:1px solid #D7D7DB;
	margin-right:15px;
	margin-bottom:15px;
	user-select:none;
	line-height:30px;
	background-color:#F2F2F4;
	font-size:12px;
	overflow:hidden;
	cursor:pointer;
}
.knob-square .count {
	float:left;
	width:60px;
	height:30px;
	text-align:center;
	color:#fff;
	font-weight:bold;
	overflow:hidden;
	font-size:10px;
}
.knob-square .title {
	margin-left:60px;
	text-align:center;
}
.knob-square:not(.active) .count {
	opacity:0.3;
}
.knob-square.knob-square-orange .count {
	background-color:rgba(255, 167, 2, 1);
}
.knob-square.knob-square-yellow .count {
	background-color:rgba(251, 207, 52, 1);
}
.knob-square.knob-square-green .count {
	background-color:rgba(99, 158, 141, 1);
}
.knob-square.knob-square-blue .count {
	background-color:rgba(120, 181, 205, 1);
}
.knob-square.knob-square-purple .count {
	background-color:rgba(192, 146, 192, 1);
}
.knob-square.knob-square-brown .count {
	background-color:rgba(175, 123, 88, 1);
}
.knob-square.knob-square-black .count {
	background-color:rgba(0, 0, 0, 1);
}
.knob-square.knob-square-red .count {
	background-color:rgba(223, 74, 50, 1);
}
/* 2021-3-16 - TK: add css for hometasty cash out enhancement */
.fixed-width-120 {
	width:120px !important;
	text-overflow:ellipsis;
	overflow:hidden;
}
/* 2021-3-25 - TK: referral-share for hometasty */
.referral-share .share-qr-link {
}
.referral-share .share-qr-link > img {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    width:200px;
    margin:0 auto;
}
.becup-member .nav-tabs > li.active > a,
.becup-member .nav-tabs > li.active > a:hover,
.becup-member .nav-tabs > li.active > a:focus,
.becup-member .nav-tabs > li:hover > a {
	background-color:#bfc9ca !important;
}
/* 2021-9-8 - TK: form captcha */
.captcha-canvas > canvas {
	width:200px;
	height:60px;
}
.captcha-canvas > .a-refresh {
	cursor:pointer;
	color:#0474E8;
	margin-left:10px;
}
.captcha-canvas > .a-refresh i {
	margin-right:5px;
}
/* 2021-10-15 - TK: add use cookie footer */
#accept-cookies-modal {
	background-color:#555;
	color:#fff;
	padding:20px;
	position:fixed;
	width:100%;
	z-index:9999999;
	font-size:16px;
	bottom:0;
	left:0;
	opacity:0;
	display:none;
}
#accept-cookies-modal.show {
	-webkit-transition: opacity 0.5s ease-in;
	-moz-transition: opacity 0.5s ease-in;
	-o-transition: opacity 0.5s ease-in;
	opacity: 1;
	display:block;
}
body.sidr-open #accept-cookies-modal {
	display:none;
}
/* 2021-11-3 - TK: #24674 too many variant... */
/* 2022-2-4 - TK: #25902 not work by group... */
@media only screen and (max-width: 768px) {
	#product-detail-action-panel {
		max-height:50%;
		overflow-y:auto;
	}
}
/* 2021-11-30 - TK: #24850 make it smaller */
#product-detail-action-panel .row .col-xs-9 {
	padding-left:0;
	padding-right:0;
}
.intl-tel-input .country-list {
	z-index:9999;
}
/* 2022-2-22 - TK: refund order timeline */
.refund-process-timeline {
	margin:20px auto 60px;
	display:flex;
	max-width:600px;
}
.refund-process-timeline .check-point {
	flex:1 1 auto;
	position:relative;
	color:#777;
	font-weight:bold;
	text-align:center;
}
.refund-process-timeline .check-point::after {
	content:'';
	position:absolute;
	bottom:-30px;
	left:50%;
	margin-left:-10px;
	width:20px;
	height:20px;
	border-radius:50%;
	border:2px solid #2BAAFD;
	background-color:#fff;
}
.refund-process-timeline .check-point.active {
	color:#2BAAFD;
}
.refund-process-timeline .check-point.active::after {
	background-color:#2BAAFD;
}
.refund-process-timeline .check-point:not(:last-child)::before {
	content:'';
	position:absolute;
	bottom:-21px;
	width:100%;
	border-top:2px solid #2BAAFD;
	left:50%;
	margin-left:-10px;
}
/* 2022-5-19 jaydon: arrival notice modal */
#arrival-subscribe-modal .modal-dialog{
	overflow: visible;
}
@media only screen and (max-width: 768px){
	#arrival-subscribe-modal .modal-dialog{
		margin-left: 10px;
		margin-right: 10px;
	}
}
/* 2022-9-7 - TK: common map css */
.baidu-map-info {
	color:#000;
}

/* 2018-3-16 - TK: checkout css */
.list-address .list-group-item {
	position:relative;
	background-color:#fafafa;
}
.list-address .list-group-item > span {
	vertical-align:middle;
	display:inline-block;
}
.list-address .list-group-item p {
	margin-bottom:0;
}
.list-address .list-group-item .item-thumbnail {
	/* 2018-10-15 kelvin: make checkout payment icon larger */
    height:44px;
}

/* 2023-6-9 - TK: modal class for 3chembio */
.modal-dialog.modal-full {
	width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  max-width:none !important;
}
.modal-dialog.modal-full .modal-content {
  height: auto;
  min-height: 100%;
  border-radius: 0;
}
.text-white {
	color:#fff !important;
}