/*Fonts*/
@font-face {
    font-family: 'FuturaPTBold';
    src: url('../media/fonts/FuturaPTBold.woff2') format('woff2'),
         url('../media/fonts/FuturaPTBold.woff') format('woff'),
         url('../media/fonts/FuturaPTBold.ttf') format('opentype');
}
@font-face {
    font-family: 'FuturaPTDemi';
    src: url('../media/fonts/FuturaPTDemi.woff2') format('woff2'),
         url('../media/fonts/FuturaPTDemi.woff') format('woff'),
         url('../media/fonts/FuturaPTDemi.ttf') format('opentype');
}
@font-face {
    font-family: 'FuturaPTMedium';
    src: url('../media/fonts/FuturaPTMedium.woff2') format('woff2'),
         url('../media/fonts/FuturaPTMedium.woff') format('woff'),
         url('../media/fonts/FuturaPTMedium.ttf') format('opentype');
}
@font-face {
    font-family: 'FuturaPTBook';
    src: url('../media/fonts/FuturaPTBook.woff2') format('woff2'),
         url('../media/fonts/FuturaPTBook.woff') format('woff'),
         url('../media/fonts/FuturaPTBook.ttf') format('opentype');
}
@font-face {
    font-family: 'FuturaPTHeavy';
    src: url('../media/fonts/FuturaPTHeavy.woff2') format('woff2'),
         url('../media/fonts/FuturaPTHeavy.woff') format('woff'),
         url('../media/fonts/FuturaPTHeavy.ttf') format('opentype');
}
@font-face {
    font-family: 'LuckiestGuy';
    src: url('../media/fonts/luckiestguy-webfont.woff2') format('woff2'),
         url('../media/fonts/luckiestguy-webfont.woff') format('woff'),
         url('../media/fonts/luckiestguy-webfont.ttf') format('truetype');
}
@font-face {
    font-family: 'BalooRegular';
    src: url('../media/fonts/baloo-regular-webfont.woff2') format('woff2'),
         url('../media/fonts/baloo-regular-webfont.woff') format('woff'),
         url('../media/fonts/baloo-regular-webfont.ttf') format('truetype');
}
@font-face {
    font-family: 'FuturaPTCondExtraBold';
    src: url('../media/fonts/FuturaPTCondExtraBold.woff2') format('woff2'),
         url('../media/fonts/FuturaPTCondExtraBold.woff') format('woff'),
         url('../media/fonts/FuturaPTCondExtraBold.ttf') format('truetype');
}


@font-face {
    font-family: 'source_sans_proregular';
    src: url('../media/fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
         url('../media/fonts/sourcesanspro-regular-webfont.woff') format('woff'),
         url('../media/fonts/sourcesanspro-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'source_sans_prosemibold';
    src: url('../media/fonts/sourcesanspro-semibold-webfont.woff2') format('woff2'),
         url('../media/fonts/sourcesanspro-semibold-webfont.woff') format('woff'),
         url('../media/fonts/sourcesanspro-semibold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'dosisbold';
    src: url('../media/fonts/dosis-bold-webfont.woff2') format('woff2'),
         url('../media/fonts/dosis-bold-webfont.woff') format('woff'),
         url('../media/fonts/dosis-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'dosislight';
    src: url('../media/fonts/dosis-light-webfont.woff2') format('woff2'),
         url('../media/fonts/dosis-light-webfont.woff') format('woff'),
         url('../media/fonts/dosis-light-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'dosismedium';
    src: url('../media/fonts/dosis-medium-webfont.woff2') format('woff2'),
         url('../media/fonts/dosis-medium-webfont.woff') format('woff'),
         url('../media/fonts/dosis-medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'dosisregular';
    src: url('../media/fonts/dosis-regular-webfont.woff2') format('woff2'),
         url('../media/fonts/dosis-regular-webfont.woff') format('woff'),
         url('../media/fonts/dosis-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'dosissemibold';
    src: url('../media/fonts/dosis-semibold-webfont.woff2') format('woff2'),
         url('../media/fonts/dosis-semibold-webfont.woff') format('woff'),
         url('../media/fonts/dosis-semibold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'khandbold';
    src: url('../media/fonts/khand-bold-webfont.woff2') format('woff2'),
         url('../media/fonts/khand-bold-webfont.woff') format('woff'),
         url('../media/fonts/khand-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'khandmedium';
    src: url('../media/fonts/khand-medium-webfont.woff2') format('woff2'),
         url('../media/fonts/khand-medium-webfont.woff') format('woff'),
         url('../media/fonts/khand-medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'nunitobold';
    src: url('../media/fonts/nunito-bold-webfont.woff2') format('woff2'),
         url('../media/fonts/nunito-bold-webfont.woff') format('woff'),
         url('../media/fonts/nunito-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'arialroundedbold';
    src: url('../media/fonts/arial_rounded_bold-webfont.woff2') format('woff2'),
         url('../media/fonts/arial_rounded_bold-webfont.woff') format('woff'),
         url('../media/fonts/arial_rounded_bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'budokanroundedbold';
    src: url('../media/fonts/budokanrounded-bold-webfont.woff2') format('woff2'),
         url('../media/fonts/budokanrounded-bold-webfont.woff') format('woff'),
         url('../media/fonts/budokanrounded-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'hwtgothicroundplain';
    src: url('../media/fonts/hwt_gothic_round_plain-webfont.woff2') format('woff2'),
         url('../media/fonts/hwt_gothic_round_plain-webfont.woff') format('woff'),
         url('../media/fonts/hwt_gothic_round_plain-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
	font-family: 'RobotoExtraBold';
	src: url('../media/fonts/Roboto-ExtraBold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Quicksand';
	src: url('../media/fonts/Quicksand.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/*Layout*/
html, body {
	height: 100%;
	font-family: 'Quicksand';
	color: #404041;
	scroll-behavior: smooth;
}

#divRootContainer{
	padding: 0;
}

.container{
	padding-right:24px;
	padding-left:24px;
}

.placeholder-block{
	background: #f3f1ec;
}
.fw-block{

} 
.fh-block{
	min-height: 100%;
	overflow: hidden;
}
.fh-container-block{
	height: 100%;
}

#divLanding{
	/*width: 100%;*/
	overflow: hidden;
}
#divLandingContainer{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
/*#divLandingContainer:before{
	content: "";
	height: 5px;
	width: 100%;

	background-color: #ee1c3b;
	background-image: linear-gradient(to right, #f47721,#ee1c3b);
	background: linear-gradient(to right, #f47721, #ee1c3b);
}*/

.landing-content{
	width: 100%;
	display: flex;
	align-self: flex-start;	
	align-content: center;
	justify-content: space-around;
	flex-grow: 1;
}

.divLandingProfile{
	position: absolute;
	top: 1.5rem;
	left: 1rem;
	z-index: 8;
	width: 10rem;
}

#aSetting{
	position: absolute;
	top: 1rem;
	right: 0;
	z-index: 8;
	color: #333333;
	text-align: center;
	font-family: 'dosismedium';
	font-size: .75rem;
}
#aSetting span{
	width: 30px;
	height: 30px;
}

.divGifBackground {
	z-index: 7;
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: url('../media/img/bg-main.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-color: #FAF9F6;
	background-position: center -60px;
}

.bgs-home {
	/*z-index: 7;*/
	width: 100%;
	height: 100%;
	/*position: absolute;*/
	background-image: url('../media/img/bg-main-2025.png');
	background-repeat: no-repeat;
	background-size: 100% 47%;
	background-color: #FAF9F6;
	background-position: center -60px;
}

.bg-landing {
	/*z-index: 7;*/
	width: 100%;
	height: 100%;
	/*position: absolute;*/
	background-image: url('../media/img/bg-landing.png');
	background-size: 100% 84%;
	background-repeat: no-repeat;
}

.bgs-account {
	/*z-index: 7;*/
	width: 100%;
	height: 100%;
	/*position: absolute;*/
	background-image: url('../media/img/bg-main-3.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-color: #FAF9F6;
	background-position: center -60px;
}

.bgs-qr {
	/*z-index: 7;*/
	width: 100%;
	/*height: 100%;*/
	/*position: absolute;*/
	background: #FE002D url('../media/img/bgs-qr.png');
	background-repeat: no-repeat;
	background-size: cover;
	/*background-color: #FE002D;*/
	background-position: center top;
}

.bgs-reward {
	/*z-index: 7;*/
	width: 100%;
	height: 100%;
	/*position: absolute;*/
	background-image: url('../media/img/bg-main-rewards.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-color: #FAF9F6;
	background-position: center -60px;
}

.bgRewards {
	background: #FE002D url('../media/img/bgs-reward.png');
	background-size: auto;
	background-repeat: repeat;
	background-position: center;
	border-bottom-right-radius: 40px;
}
/*
	.bgs-qr::after {
		position: absolute;
		content: "";
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-image: url('../media/img/bgs-qr.png');
		background-size: 100% 100%;
		background-position: center;
		z-index: -1;
	}*/
.bgAccount {
	z-index: 7;
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: url('../media/img/bg-main-3.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #FAF9F6;
	background-position: center -60px;
}

.divGifBackground img{
	max-width: 100%;
}

.divGifBackground video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

#divPages.landingpg {
	/*background-image: url('../media/img/bg-land-01.png');
	background-position: center;
	background-repeat: repeat;*/
	background-size: auto 100%;
	background-color: #FAF9F6;
}
#divPages.stamppg{
	background-image: url('../media/img/bg-main.png');
    background-position: top center;
    background-repeat: repeat-x;
    background-size: auto 70%;
    background-color: #fff;
}
#divPages.pointpg{
	background-image: url('../media/img/bg-land-01.png');
	background-position: top center;
    background-repeat: repeat-x;
    background-size: auto 70%;
    background-color: #fff;
}


/*Sticky bottom navbar*/
/*.navbar.navbar-bottom {*/
	/*position: absolute;*/
	/*z-index: 10;*/
	/*bottom: 0;*/
	/*width: 100%;
	justify-content: space-around;
	align-content: center;
	align-self: flex-end;
	background-color: #fff;
    padding: .8rem 0;*/
	/*position: fixed;*/ /* Changed from absolute/relative to fixed */
	/*bottom: 0;
	left: 0;
	right: 0;
	z-index: 1000;*/ /* Ensure it stays above other content */
	/*width: 100%;
	justify-content: space-around;
	align-content: center;
	align-self: flex-end;
	background-color: #fff;
	padding: .8rem 0;
	margin: 0;
}*/

.navbar.navbar-bottom {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	width: 100%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	background-color: #fff;
	padding: 0.8rem 0;
	margin: 0;
}

.navbar.navbar-bottom .nav-indicator {
	position: absolute;
	top: -13px; /* Position at the top of the nav item */
	height: 3px;
	width: 100%;
	background-color: transparent;
	border-radius: 3px 3px 0 0;
}

.navbar.navbar-bottom .nav-link.active {
	background-color: #FAF9F6;
	border-radius: 8px;
}

.nav-indicator.active-indicator {
	background-color: red !important;
}


/*Side Pages*/
#divPages{
	max-width: 100%;
	overflow: hidden;
	background: #f1f1f1;
}

.panel-title {
	color: #000;
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	padding: 20px 30px 24px 30px;
	background-color: #fff;
	box-shadow: 0px 2px 3px 0px #00000040;
	font-family: 'RobotoExtraBold';
	position: relative;
	text-align: center;
}
.panel-title .panel-title-hyperlink {
	color: #FE002D;
	margin-right: 1rem;
	display: inline-block;
	position: absolute;
	left: 30px;
	top: 20px;
}

.panel-content{
	margin: 0px auto;
	/*height: 100%;*/
}
.panel-content .form-group{
	/*margin-bottom: 2px;*/
}
.panel-content .form-group input,
.panel-content .form-group select,
.panel-content .form-group textarea{
	border: 1px solid #B59B68;
	border-radius: 10px;
	color: #000;
    padding-left: 12px;
}
.panel-content .form-group textarea{
	height: 8rem;
}
.panel-content .form-group-wrapper{
	background: #B59B68;
	padding: 0.5rem 1rem;
	margin-bottom : 0.5rem;
}

.panel-content .regtext{
	font-size: 0.9rem;
}

.panel-content .divLinks{
	font-size: 0.7rem;
	text-align: center;
}
/*.panel-content .divLinks label{
	position: relative;
	display: block;
}
.panel-content .divLinks a{
	position: absolute;
	right: 5px;	
	top: 0.1rem;
}*/
.panel-content .divLinks a {
	color: #FE002D;
}

.panel-content .form-group ::-webkit-input-placeholder{
	color: #000;
}
.panel-content .form-group ::-moz-placeholder{
	color: #000;
}
.panel-content .form-group :-ms-input-placeholder{
	color: #000;
}
.panel-content .form-group :-moz-placeholder{
	color: #000;
}
.btn-mail-send{
	color: #006570 !important;
}
.btn-mail-send .fab{
	padding: .25rem;
	border-radius: 50%;
	border: 1px solid #006570;
	display: inline-block;
	margin-left: .25rem;
}
.form-control:disabled, .form-control[readonly] {
	background-color: #F7F7F7;
	border: 1px solid #E0E0E0 !important;
	color: #666666 !important;
	font-weight:400;
	font-size:16px;
	line-height:24px;
}
.editpg #txtMobile:disabled {
	border-color: #B59B68 !important;
	color: #000 !important;
	background-color: #fff !important;
}
.form-control option{
	color: #000;
}
.form-control:focus {
    box-shadow: none;
}
.navbar-text {
	font-size: 8px;
	color: black;
	font-family:'Quicksand';
	font-weight:700;
	padding:0;
}
.btn-comp {
	border: 0;
	padding: 12px;
	width: 100%;
	color: white;
	border-radius: 24px;
	font-weight: 700;
	font-size: 16px;
	line-height: 22px;
	height:48px;
}
.ff-quick{
	font-family:'Quicksand'
}
.text-blue {
	color: blue
}
.text-black{
	color:black;
}
.g-8 {
	gap: 8px;
}
.w-45{
	width:45%;
}
.w-64 {
	width: 64% !important;
}
.position-rel{
	position:relative;
}
.mgt-5{
	margin-top:5px;
}
.mt-8{
	margin-top:8px;
}
.mt-12{
	margin-top:12px;
}
.mt-neg-14 {
	margin-top: -14px;
}
.mt-16 {
	margin-top: 16px;
}
.mt-24 {
	margin-top: 24px;
}
.mt-34{
	margin-top:34px;
}
.mt-36 {
	margin-top: 36px;
}
.mt-40 {
	margin-top: 40px;
}
.mb-24{
	margin-bottom:24px;
}
.mb-32 {
	margin-bottom: 32px;
}
.min-h-100 {
	min-height: 100%;
}
.mh-100v{
	min-height:100vh;
}
.mh-222{
	min-height:222px;
}
.mh-374 {
	min-height: 374px;
}
.mh-330 {
	min-height: 330px;
}
.h-100v {
	height: 100vh;
}
.h-80{
	height:80px;
}
.form {
	font-family: 'Quicksand'
}
.of-y-auto {
	overflow-y:auto;
}
.br-0{
	border-radius:0;
}
.br-12{
	border-radius:12px !important;
}
.pd-5{
	padding:5px;
}
.px-24 {
	padding: 0 24px;
}
.px-45 {
	padding: 0 45px;
}
.px-69 {
	padding: 0 69px;
}
.pt-24{
	padding-top:24px;
}
.disp-inline{
	display:inline-block;
}
.border-color-sk2 {
	border: 1px solid #F3F2EF;
}
.text-no-deco {
	text-decoration: none !important;
}
.bw-img {
	filter: grayscale(100%);
}
.fw-500{
	font-weight:500;
}
.fw-700 {
	font-weight: 700;
}
.dd-border {
	border-radius: 12px;
	padding-left: 12px;
	align-items: center;
	left: 0;
	height:48px !important;
	display: flex;
	border: 1px solid #B59B68 !important;
}
.custom-select-style .span-custom {
	color: #B59B68;
}
.custom-select-style select:valid + .span-custom,
.custom-select-style:focus-within .span-custom {
	color: #000; 
}
.form-control{
	height:48px;
}
.no-box-shadow {
	box-shadow: 0px 0px 0px 0px;
}
.topNav {
	display: flex;
	align-items: center;
	padding-top: 1rem;
	position: relative;
	/*z-index: 1;*/
}
.icon-sk {
	display: block;
	width: 154.4px;
	height: 32px;
	background-size: 100%;
	background-position: center;
}
#txtPassword::placeholder,
#txtName::placeholder,
#txtIC::placeholder,
#txtEmail::placeholder,
#txtCfmPassword::placeholder,
#txtPromo::placeholder,
#txtLocation::placeholder,
#txtNPassword::placeholder,
#txtCfmNPassword::placeholder,
#txtNickname::placeholder {
	color: #B59B68;
	opacity: 1;
}
.bg-color-sk {
	background-color: #FAF9F6 !important;
}
.bg-color-sk2 {
	background-color: #F3F2EF
}
#optCcode {
	color: #0000; /* default color for placeholder */
}
.modalMsg {
	font-weight: 500;
	font-size: 12px;
	line-height: 16px;
	white-space: pre-line;
}
/*Homepage Page*/
.home-upper-container {
	width: 100%;
	height: 100%;
	padding: 40px 0 24px 0;
}

.home-title {
	text-align: left;
	color: #fff;
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	font-family: 'RobotoExtraBold';
}

.home-smilepoints-container {
	padding: 8px 8px 12px 8px;
	border: 2px solid #8E7A50;
	border-radius: 16px;
	background-color: white;
	margin-top: 16px;
}

.spanSmilePointLabel1 {
	color: black;
	text-align: left;
	font-family: 'QuickSand';
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}

#smileValue {
	font-size: 40px;
	color: black;
	line-height: 48px;
	font-weight: 900;
	padding: 6px 0;
	font-family: 'RobotoExtraBold';
	text-align: center;
}

.home-smilePoints {
	color: #B59B68;
	display: flex;
	justify-content: center;
	font-size: 12px;
	line-height: 16px;
	font-family: 'QuickSand';
	font-weight: 700;
}

.home-qr-button {
	text-align: center;
	border: 1px solid #B59B68;
	background-color: #B59B68;
	border-radius: 24px;
	padding: 12px 0;
}
.home-showqr {
	color: white;
	font-family: 'QuickSand';
	font-weight: 700;
	font-size: 16px;
	line-height: 22px;
}
.home-smileStamps {
	margin-top: 15px;
	padding: 8px 16px 12px 16px;
	border: 2px solid #8E7A50;
	border-radius: 16px;
	background-color: white;
}
.smileStampsText {
	color: black;
	text-align: left;
	font-size: 14px;
	line-height: 20px;
	font-family: 'QuickSand';
	font-weight: 700;
}
.smileStampsimg {
	width: 100%;
	height: 100%;
	margin-top: 5px;
}
.smileStampsText2 {
	color: black;
	font-size: 12px;
	line-height: 16px;
	text-align: left;
	margin-top: 7px;
	font-family: 'QuickSand';
	font-weight: 700;
}
.home-promotionText, .home-rewardsText {
	font-size: 24px;
	line-height: 32px;
	font-weight: 900;
	font-family: 'RobotoExtraBold'
}
.home-promotion-container, .home-rewards-container {
	margin-top: 8px;
	overflow: hidden;
	height: 100%;
	border: 1px solid #F3F2EF;
}
.promotion-carousell, .rewards-carousell {
	overflow-x: auto;
	white-space: nowrap;
	padding-bottom: 30px;
	scrollbar-width: none;
}
.home-promotionImg, .home-rewardsImg {
	width: 300px;
	border-radius: 16px;
	box-shadow: 0px 4px 4px 0px #00000033;
	margin-right: 8px;
}
.spinnerDiv {
	position: fixed;
	bottom: 80px;
	right: 15px;
	z-index: 1001;
}
.spinner-img {
	width: 100%;
	height: 100%
}
#gameSpinH.spinBox {
	background: #D93C43;
	color: #FFFFFF;
	position: absolute;
	top: 0px;
	left: -10px;
	padding: 0 10px;
	font-size: 20px;
	border-radius: 20px;
	border: 0px solid #FFFFFF;
	/*box-shadow: 2px 2px black;*/
}

/*Account Page*/
.acct-flex {
	position: relative;
	display: flex;
	flex-direction: column
}

.acct-bg-min-height {
	min-height: 222px;
}

.acct-div-myProfile {
	position: relative;
	z-index: 1;
	background-color: transparent;
}

.acct-myProfile {
	text-align: left;
	color: #fff;
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	padding: 40px 0 20px 0;
	font-family: 'RobotoExtraBold'
}

.acct-profiletab {
	margin-top: -84px;
	position: relative;
	z-index: 2;
	padding: 20px 0
}

.acct-profiletab2 {
	background-color: #ffffff;
	padding: 10px;
	border-radius: 16px;
	border: 2px solid #8E7A50;
}

.acct-profileSection {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.acct-profileLeftSection {
	display: flex;
	align-items: center;
	gap: 10px;
}
.acct-divProfilePic {
	padding: 2px;
	text-align: center;
	justify-content: center;
	display: flex;
}
.acct-profilePicture {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	overflow: hidden; 
}

.acct-profilePicture img {
	width: 100%;
	height: 100%;
	object-fit: cover; 
	vertical-align: middle;
}

.acct-spanName {
	font-size: 18px;
	font-weight: 700;
	line-height: 26px;
	font-family: 'Quicksand';
}

.acct-smilePointsP {
	display: flex;
	align-items: center;
	gap: 5px;
}

.acct-spanTxt {
	font-family: 'Quicksand';
	font-size: 12px;
	color: #000;
	line-height: 16px;
	font-weight: 700;
}

.acct-spanPoint {
	font-family: 'Quicksand';
	font-size: 12px;
	color: #000;
	line-height: 16px;
	font-weight: 700;
}

.acct-profileLine {
	height: 2px;
	background-color: #8E7A50;
	border-radius: 2px;
	margin-top: 10px
}

#acct-biometric {
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	margin-top: 10px;
	font-family: 'Quicksand';
}

#acct-biometric .switch {
	position: relative;
	display: inline-block;
	width: 42px;
	height: 24px;
	margin-bottom: -1px;
}

#acct-biometric .switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

#acct-biometric .slider.round {
	border-radius: 34px;
}

#acct-biometric .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}

#acct-biometric input:checked + .slider {
	background-color: #8E7A50;
}

#acct-biometric input:focus + .slider {
	box-shadow: 0 0 1px #8E7A50;
}

#acct-biometric .slider:before {
	position: absolute;
	content: "";
	height: 16px;
	width: 16px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

#acct-biometric input:checked + .slider:before {
	-webkit-transform: translateX(18px);
	-ms-transform: translateX(18px);
	transform: translateX(18px);
}

#acct-biometric .slider.round:before {
	border-radius: 50%;
}

.QuickAccess {
	padding-top: 10px;
}

.QuickAccess .qa-label {
	font-family: 'RobotoExtraBold';
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	color: #000;
}

.QuickAccess .qa-label {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.QuickAccess .qa-flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.QuickAccess .qa-flex .qa-row {
	width: 48%;
	margin-bottom: 12px;
}

.QuickAccess .qa-flex .qa-row .qa-column {
	background-color: #fff;
	align-items: center;
	justify-content: center;
	display: flex;
	padding: 15px;
	border: 2px solid #D9D9D9;
	border-radius: 16px;
	text-decoration: none;
	color: #000;
	height: 80px;
	text-align: center;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	font-family: 'Quicksand'
}

/*Account Setting*/
.acctSett {
	background-color: #FAF9F6 !important;
}

.acctSett-section {
	position: relative;
	background-color: #FAF9F6;
	padding: 16px 24px;
	font-family: 'QuickSand';
	font-weight: 500;
	font-size: 14px;
}

.acctSett-line {
	position: absolute;
	bottom: 0;
	left: 20px;
	right: 20px;
	height: 1px;
	background-color: #E0E0E0;
}

/*Delete Account*/
.delAcct {
	margin-top: 26px;
	font-family:Quicksand;
}

.delActt-modal {
	align-items: center;
	justify-content: center;
}

.delActt-modal-title {
	font-family: 'Quicksand';
	font-weight: 700;
	font-size: 16px;
	line-height: 22px;
}

.delActt-modal-body {
	font-family: 'Quicksand';
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	padding: 20px;
}

.delActt-modal-buttons {
	background-color: #fff;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 24px;
	font-family: 'Quicksand';
}

#deleteInput {
	border: 1px solid #B59B68;
	border-radius: 12px;
	height: 48px;
	font-family: 'Quicksand';
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
}

/*Edit Page*/
.edit-pen-icon {
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	border: none;
}

/*Verification Page*/
.verify-title {
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}

/*Forgot Password Page*/
.forgotpass-sms,.forgotpass-email {
	display: flex;
	align-items: center;
	margin-bottom: 0.5rem;
	justify-content: center;
}

/*QR Page*/
.qr-container {
	width: 100%;
	flex-grow: 1;
	padding: 40px 0 110px 0;
}
.qr-title {
	text-align: left;
	color: #fff;
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	font-family: 'RobotoExtraBold'
}
.divQR {
	text-align: center;
	background-color: #FFFFFF;
	border: 2px solid #8E7A50;
	border-radius: 16px;
	width: auto;
	height: auto;
	margin-top: 24px;
	position: relative;
	box-shadow: 0px 4px 4px 0px #00000033;
}
.qr-upperText {
	margin-top: 40px;
	position: relative;
	z-index: 1;
}
.qr-spanText {
	font-size: 16px;
	line-height: 16px;
	font-weight: 900;
	font-family: 'Quicksand'
}
.qr-content1 {
	margin-top: -34px;
	font-size: 16px;
	font-weight: 700;
	line-height: 24px;
	font-family: 'Quicksand';
}
.qr-content2 {
	margin: 24px 0 40px 0;
	padding: 0 24px;
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	font-family: 'Quicksand';
}

/*Promotion Page*/
.promotion-title {
	text-align: left;
	color: #fff;
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	padding: 40px 0 20px 0;
	font-family: 'RobotoExtraBold'
}
.promotion-title-container {
	position: relative;
	z-index: 1;
	background-color: transparent;
}
.promotion-container {
	top: -84px;
	position: relative;
	z-index: 1
}

.promo-coming-soon-badge {
	position: absolute;
	top: 16px;
	right: 8px;
	color: white;
	background-color: #E0052E;
	border-radius: 4px;
	padding: 4px 8px;
	line-height: 10px;
	font-size: 10px;
	font-weight: 900;
	font-family: 'Quicksand';
}

.promo-ongoing-badge {
	position: absolute;
	top: 16px;
	right: 8px;
	color: black;
	background-color: #C6E845;
	border-radius: 4px;
	padding: 4px 8px;
	line-height: 10px;
	font-size: 10px;
	font-weight: 900;
	font-family: 'Quicksand';
}
.promo-leaving-badge {
	position: absolute;
	top: 16px;
	right: 8px;
	color: white;
	background-color: #F97436;
	border-radius: 4px;
	padding: 4px 8px;
	line-height: 10px;
	font-size: 10px;
	font-weight: 900;
	font-family: 'Quicksand';
}
.promo-ended-badge {
	position: absolute;
	top: 16px;
	right: 8px;
	color: white;
	background-color: #3F90B8;
	border-radius: 4px;
	padding: 4px 8px;
	line-height: 10px;
	font-size: 10px;
	font-weight: 900;
	font-family: 'Quicksand';
}

.promo-learmore-button {
	width: 168px;
	border-radius: 24px;
	color: white;
	border: 0;
	height: 40px;
	padding: 0 16px 0 16px;
	font-weight: 700;
	font-family: Quicksand;
	font-size: 16px;
	line-height: 22px;
}
#PromotionContainer {
	margin-bottom: 22px;
	background-color: white;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 4px 4px #00000033;
}
.promo-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 0 32px 0;
}
.promo-spanTitle-container {
	font-family: Quicksand;
	font-weight: 700;
	font-size: 16px;
	line-height: 24px
}
.promo-spanDesc-container {
	font-family: Quicksand;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px
}
.PromotionFooter {
	display: flex;
	justify-content: right;
	flex-wrap: wrap;
	gap: 8px;
	padding: 8px 0;
}

/*Rewards Page*/
#rewardsSection {
	min-height: auto;
	flex-grow: 1;
	padding-bottom: 50px;
}
.rewards-smilestamp-container {
	width: 100%;
	padding: 40px 0 0 0;
	min-height: auto;
	flex-shrink: 0;
	box-sizing: border-box;
	position: relative;
	z-index: 1;
	background-color: transparent;
}
.rewards-labelTitle {
	font-family: 'RobotoExtraBold';
	font-size: 24px;
	color: #FFFFFF;
	font-weight: 900;
	line-height: 32px;
}
.rewards-smilestamp-img {
	width: 100%;
	height: 100%;
	margin-top: 5px;
}
.rewards-smilestamp-text {
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	color: #FFFFFF;
	margin-top: 16px;
	font-family: 'QuickSand'
}
.rewards-smilestamp-button-container {
	text-align: center;
	border: 1px solid #B59B68;
	background-color: #B59B68;
	border-radius: 24px;
	padding: 12px 0;
}
.rewards-smilestamp-findout-button {
	color: white;
	flex: 1;
	min-width: 120px;
	width: 100%;
	border-radius: 24px;
	border: 0;
	font-weight: 700;
	line-height: 22px;
	font-family: Quicksand !important;
}
.rewards-spanTitle {
	font-weight: 900;
	line-height: 32px;
	font-size: 24px;
	font-family: 'RobotoExtraBold';
}
.rewards-contianer {
	margin-bottom: 22px;
	background-color: white;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0px 4px 4px 0px #00000033;
}
.rewards-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 0 32px 0;
}
.rewards-button-container {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	padding: 8px 0 8px 0;
}
.rewards-button2 {
	color: white;
	flex: 1;
	min-width: 120px;
	width: 100%;
	height: 40px;
	border-radius: 24px;
	border: 0;
	font-weight: 700;
	line-height: 22px;
	font-family: Quicksand !important;
}
.rewards-button1 {
	color: white;
	flex: 1;
	min-width: 120px;
	width: 100%;
	height: 40px;
	border-radius: 24px;
	border: 0;
	font-weight: 700;
	line-height: 22px;
	font-family: Quicksand !important;
}
.rewards-span-expiring {
	color: #FE002D;
	font-family: Quicksand;
	font-weight: 900;
	font-size: 12px;
}
.rewards-px-py {
	padding: 8px 16px 18px 16px;
}
.no-overlay{
	opacity:1
}

/*Find Us Page*/
.find-us-searchbox {
	font-family: 'Quicksand';
	font-size: 16px;
}
.findus-storetitle {
	font-weight: 700;
	font-size: 16px;
	line-height: 24px;
}
.findus-storedistance {
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: #FE002D
}
.findus-storehours {
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}

/*Social Page*/
.social-left-chevron {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}
.social-container {
	flex: 0 0 100%;
	max-width: 100%;
	position: relative;
	width: 100%
}
.social-delivery-container {
	background-color: #fff;
	width: 100%;
	height: auto;
	min-height: 80px;
	border-radius: 10px;
	margin-bottom: 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 24px;
	box-shadow: 0px 4px 4px 0px #00000033;
	box-sizing: border-box;
}
.social-grab-redirecTo {
	flex-grow: 1;
	min-width: 0;
	padding-right: 16px;
	display: flex;
	justify-content: flex-start;
}
.social-img {
	flex-grow: 1;
	min-width: 0;
	padding-right: 16px;
	display: flex;
	justify-content: flex-start;
}
.social-grab-img {
	max-width: 100%;
	height: auto;
	max-height: 40px;
	width: auto;
	object-fit: contain;
}

/*Setting Page*/
.setting-text {
	position: relative;
	background-color: #FAF9F6;
	padding: 16px 24px;
	font-family: 'QuickSand';
	font-weight: 500;
	font-size: 14px;
	text-decoration:none !important;
}
.setting-line {
	position: absolute;
	bottom: 0;
	left: 20px;
	right: 20px;
	height: 1px;
	background-color: #E0E0E0;
}

/*Notification Page*/
.list-group.notification {
	overflow: hidden;
	padding: 16px;
}

.list-group.notification .list-group-item {
	padding: 1.25rem 1.25rem;
	margin-bottom: 10px;
	border-radius: 12px;
	min-height: 100px;
	box-shadow: 0px 2px 4px 0px #00000040;
}

.list-group.notification .list-group-item:last-child {
	border-bottom: 0;
}

.list-group.notification h4 {
	font-size: 1rem;
	font-family: 'QuickSand';
	margin-bottom: .25rem;
	font-weight: 700;
}

.list-group.notification p {
	font-family: 'QuickSand';
	margin: 0;
	line-height: 20px;
	font-size: 14px;
	font-weight: 500;
}

.list-group.notification .list-group-item a {
	color: #E0052E;
}

/*Survey Page*/

.btn-group {
	text-align: center;
	justify-content: flex-end;
	display: flex;
	width: 100%;
	padding: 16px 0;
}

.lang-button {
	width: 40px;
	height: 24px;
	text-align: center;
	border: none;
	background-color: #D9D9D9;
}

#btn-bm {
	border-radius: 0 99px 99px 0;
}

#btn-en {
	border-radius: 99px 0 0 99px;
}

.button:hover {
	background-color: rgb(200,200,200);
}

.active-btn {
	background: #FE002D;
	color: white;
}

.active-btn:hover {
	background: #FE002D;
	color: white;
}

.divSurveyContent {
	border-radius: 1rem;
	overflow: hidden;
	margin-bottom: 1rem;
	background: #ffffff;
	padding: 1rem;
	font-size: .9rem;
	box-shadow: 0px 4px 4px 0px #00000033;
}

/* Style for radio buttons */
.form-check-input[type="radio"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 20px;
	height: 20px;
	border: 2px solid #666666; 
	border-radius: 50%;
	outline: none;
	cursor: pointer;
	position: relative;
	margin-right: 8px;
	vertical-align: middle;
	margin-top:0;
}
/* Outer layer (circle) */
.form-check-input[type="radio"]::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	transform: scale(0);
	transition: transform 0.15s ease;
}
/* When radio is checked */
.form-check-input[type="radio"]:checked {
	border-color: #FE002D; 
}

/* Inner circle when checked */
.form-check-input[type="radio"]:checked::before {
	background-color: #FE002D; 
	transform: scale(0.6); 
}

#btn_submit_en, #btn_submit_bm {
	width: 253px;
	height: 48px;
	border-radius: 24px;
	background-color: #FE002D;
	color: white;
	border: 0;
	font-weight: 700
}

/*Point Page*/
.point-title1 {
	font-family: 'Quicksand';
	font-weight: 700;
	font-size: 16px;
	line-height: 22px;
}
.point-title2 {
	font-family: 'QuickSand';
	font-weight: 700;
	font-size: 16px;
	display: inline;
}
.smilepoint-header {
	border-bottom: 2px solid #E0052E;
	width: 50%;
	border-right: 1px solid #f1f1f1;
	font-weight: 700
}
.smilepoint-expired {
	border-bottom: 2px solid #f1f1f1;
	width: 50%;
	font-weight: 700
}

.point-tr {
	line-height: 3;
	font-family: 'QuickSand';
}

.point-box-shadow {
	box-shadow: 0px 2px 3px 0px #00000040;
}

.point-border-top {
	border-top: 1px solid #f1f1f1
}

/*Landing Page*/
#btnReg, #btnLog,{
	font-family: 'Quicksand';
	font-weight: 700;
	font-size: 16px;
	line-height: 22px;
	height: 48px;
}
.landing-discontinued {
	display: none;
	flex-direction: column;
	align-items: center;
	margin: 50px 0;
	font-family: 'Quicksand'
}
.landing-skip-btn {
	background: rgb(200,200,200);
	color: black
}

/*Register Page*/
.tell-us-textbox {
	border-radius: 12px;
	padding-left: 12px;
	align-items: center;
	left: 0;
	display: flex;
	border: 1px solid #B59B68
}
/*Edit Info Page*/
#divProfile {
	margin-bottom: 2px;
}

#divProfile .spanNameWrapper,
.divLandingProfile .spanNameWrapper{
	display: flex;
	align-items: center;
}
.divLandingProfile .spanNameWrapper{
	font-size: .75rem;	
}
.divLandingProfile .spanNameWrapper a{
	color: #333333;
	text-decoration: none;
}

#divProfile .spanTxt{
	font-size: 12px;
    color: #000;
}
#divProfile .spanPoint{
	font-size: 12px;
    color: #E0052E;
}
#divProfile .spanAvatar{
	padding-left: 1rem;
}
#divProfile .spanAvatar img{
	max-width: 100%;
}
#divProfile .linkIcon {
    padding: 0 10px;
    color: #fff;
    outline: 0;
}
#divProfile .linkIconTxt {
    padding: 0 15px;
    font-size: 0.8rem;
    color: #E0052E;
    font-family: 'FuturaPTDemi';
}
#divProfile .linkPoint {
    color: #fff;
    outline: 0;
}

.label-popup{
	cursor: pointer;
}

/*After Login*/

.divQR img{
	width: 100%;
}
.divShareNote{
	font-size: .9rem;
	line-height: 1rem;
	color: #404041;
	font-family: 'dosismedium';
	margin-bottom: 1rem;
}
.col-spanAvatarContainer{
	padding-right: 0;
	text-align: right;
}
.col-spanAvatarContainermpage{
	text-align: left;
}
.spanAvatarContainer{
	width: 6rem;
	height: 6rem; 
	display: inline-block;
	border-radius: 50%;
	overflow: hidden;
}
.spanAvatarContainer img
{
	max-width: 100%;
}
.divLandingProfile .spanAvatarContainer{
	width: 2.5rem;
    height: 2.5rem;
	border-color: #333333;
	border: 3px solid #333;
}

/*Verification Page*/
.divVerification{

}
h3.h3-verification-title {
	color: #ED193A;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	margin: 1rem 0;
}
.divVerification input.form-number {
	height: 4rem;
	border-radius: 8px;
	border: 2px solid #E0052E;
	font-size: 1.3rem;
	text-align: center;
}

.inner-container{
	padding-bottom: 30px;
}
.inner-container.landingpg{
    padding-left: 69px;
    padding-right: 69px;
    padding-top: 50%;
}
.inner-container.loginpg{
    padding-left: 50px;
    padding-right: 50px;
}
.inner-container.verifypg{
    padding-top: 16px;
    padding-left: 30px;
    padding-right: 30px;
}
.inner-container.landingpg img, .inner-container.loginpg img {
    width: 100%;
}

/*forgot password*/
#divPagesContainer .sidebar-forgot{
	background-image: url('../media/img/sidebar-forgot.png');
	background-size: 100% auto;
	background-position: top center;
	background-repeat: no-repeat;
}

.sidebar-forgot span.line-spacer{
	margin: 0 auto;
	height: 1px;
	width: 15%;
	display: inline-block;
	background: #404041;
}

.rowtext{
	margin-top: -10px;
}

/*Social Page*/
#divPagesContainer.sidebar-social{

}
.icons-group-vertical{
	display: flex;
	align-items: center;
	align-content: space-around;
	justify-content: center;
	flex-direction: column;
}
/*.icons-group-vertical a{
	width: 100%;
	display: inline-block;

}*/
/*.icons-group-vertical a img{
	max-width: 100%;
}*/
.icons-group-vertical span.icon-spacer{
	margin: 1rem auto;
	height: 2px;
	width: 20%;
	display: inline-block;
	background: #D0B883;
}



/*List group*/
.list-group a.list-group-item{
	font-family: 'QuickSand';
	/*color: #000;*/
	border: 0;
    margin-bottom: 2px;
}
.list-group .list-group-item .fas{
	/*color: #000;*/
}
.list-group .list-group-item .fas.red{
	color: #D0B883;	
}
.list-group.stripe .list-group-item:nth-child(even){
	/*background: #E9E4DC;*/
}

.list-group.board{
	border-radius: 0rem 0rem 1rem 1rem;
	overflow: hidden;
}
.list-group.board .list-group-item{
	border: 0;
	padding: 1rem 1.25rem;
	/*border-bottom: 2px solid #f2eeea;*/
    margin-bottom: 2px;
}
.board-title{
	color: #000;
	padding: .75rem 1.25rem;
	background: #fff;
    border-radius: 1rem 1rem 0 0;

}
.list-group .list-group-item span .fas{
	color: #006570;	
}

.list-group.board .list-group-item .list-label{
	/*line-height: 1;*/
	font-family: 'dosismedium';
}
.list-group.board .list-group-item .badge{
	text-align: right;
	font-size: 100%;
	font-family: 'khandmedium';
}
.list-group.board .list-group-item .badge .span_pts{
	font-size: 75%;
	font-family: 'dosisregular';
}
.list-group.board .list-group-item small{
	color: #404041;
	font-size: .75rem;
	font-family: 'source_sans_proregular';
}

.p_date{
	display: block;
	text-align: right;
	color: #ED193A;
	font-size: .75rem;
	font-family: 'dosisregular';
}
.txt_distance{
	vertical-align: middle;
	display: inline-block;
	line-height: 1;
	margin-right: .25rem;
	font-family: 'source_sans_prosemibold';
}
.txt_distance + .fas{
	vertical-align: middle;
	line-height: 1;
}
.txt_distance_info{
	color: #000;
	font-size: .75rem;
	line-height: .75rem;
	display: block;
    font-family: 'FuturaPTBook';
}
.txt_distance_info br{

}
.trans1 {
	font-family: 'Quicksand' !important;
	font-size: 12px !important;
	font-weight: 700;
	line-height: 16px;
	color: #000;
}
.trans2 {
	font-family: 'Quicksand' !important;
	font-size: 18px !important;
	font-weight: 500;
	line-height: 26px;
}
.trans3 {
	font-family: 'Quicksand' !important;
	font-size: 12px !important;
	color: #FE002D;
	font-weight: 700;
	line-height: 16px;
}
.trans4 {
	font-family: 'Quicksand' !important;
	font-size: 18px !important;
	font-weight: 500;
	line-height: 26px;
	color: #000;
}

/*halal*/
.list-group.halal{
	overflow: hidden;
	border: 0;
}
.list-group.halal .list-group-item{
	padding: 1.25rem 1.25rem;
	border: 0;
	border-bottom: 2px solid #f2eeea;
}
.list-group.halal .list-group-item.halal2{
	background: transparent;
}
.list-group.halal .list-group-item:last-child{
	border-bottom: 0;
}
	.list-group.halal h4 {
		font-size: 16px;
		line-height: 23px;
		font-weight: 700;
		font-family: 'Quicksand';
		color: black;
		margin-bottom: .25rem;
	}
	.list-group.halal p {
		font-family: 'Quicksand';
		margin: 0;
		line-height: 20px;
		color: black;
		font-size: 14px;
		font-weight: 500;
	}
div.halaltext{
    padding-top: 10pt;	
	color: #B5B5B5;
}
.list-group.halal p.texttop{
	font-family: 'FuturaPTDemi';
	font-size: 0.9rem;
	text-align: center;
	line-height: 1rem;
    color: #E0052E;
}
.list-group.halal p.textbot{
	font-family: 'FuturaPTBook';
	font-size: 0.8rem;
	text-align: center;
	padding-top: 5pt;	
	color:#B5B5B5;
}


/*smile point*/
.divSmilePoint {
	overflow: hidden;
	background: #ffffff;
	box-shadow: 0px 2px 4px 0px #00000040;
}
#spanTotalSmilePoint{
	font-family: 'khandbold';
	font-size: 2.5rem;
    line-height: 3rem;
    margin-top: .5rem;
    margin-bottom: 1rem;
}
.divExpiringPoints{
	border-radius: 1rem 1rem 0rem 0rem;
	border: 1px solid #b6b6b8;
	overflow: hidden;
	padding: .5rem 1rem .5rem;
	margin-bottom: .5rem;
}
.divActivePoints{
	border-radius: 0rem 0rem 1rem 1rem;
	border: 1px solid #b6b6b8;	
	overflow: hidden;
	padding: .5rem 1rem .5rem;
}
.divSmilePoint .text-points {
	color: #404041;
	font-family: 'QuickSand';
	font-size: 2.25rem;
}
.divSmilePoint .text-currency {
	color: #FE002D;
	font-family: 'QuickSand';
	font-size: 2.25rem;
	font-weight:900
}
.divSmilePoint .text-currency sup{
	font-size: 50%;
	top: -0.65em;
}
.divSmilePoint .col-arrow{
	padding: 0;
	text-align: center;
	padding-top: .5rem;
}
.divSmilePoint .spanLabel{
	font-size: .75rem;
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
}
.divSmilePoint .spanLabel span{
	border-bottom: 1px solid #b6b6b8;
	border-right: 1px solid #b6b6b8;
	padding-bottom: .4rem;
	padding-right: 0;
	padding-left: 0;
	margin-bottom: .5rem;
	border-radius: 0 0 .5rem 0;
	display: block;
	width: 100%;
	vertical-align: top;
	line-height: .7rem;
}
.divBottom {
    margin-top: .2rem;
    font-size: 0.65rem;
    text-align: center;
    font-style: italic;
}

/*enhancement point page*/
#point {
    width:100%;
    text-align: center;
}
#point .spanLabel{
    border-bottom:1px solid #ED193A;
    border-right:1px solid #ED193A;
    border-radius:0 0 .5rem 0;
}

#point .spanLabelBlack{
    border-bottom:1px solid #404041;
    border-right:1px solid #404041;
    border-radius:0 0 .5rem 0;
}

#point .text-currency {
    font-size: 1rem;
    font-family: 'QuickSand';
	font-weight:900;
    border-right: 1px solid #f1f1f1;
}

#point .text-points {
	font-size: 1rem;
	font-family: 'QuickSand';
	font-weight:900;
}
.pointContainer {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 200px; /* Adjust size as needed */
	height: 200px; /* Should match width for perfect circle */
	background-color: #FE002D;
	border-radius: 50%; /* This creates the circle */
	position: relative;
	margin: 0 auto; /* Center the circle if needed */
}

.pointTitle1 {
    position: relative;
    text-align: center;
    color: #fff;
    font-family: "FuturaPTMedium";
	width:100%
}

.pointTitle2 {
	position: absolute;
	top: 50%;
	font-size: 1.2rem;
	width: 100%;
	/*   margin-left: auto;
    margin-right: auto;*/
	transform: translate(-50%, -50%);
	left: 50%;
	/*   right: 0;*/
}

.pointTitle3 {
	font-family: 'RobotoExtraBold';
	font-size: 40px;
	line-height: 48px;
	font-weight:900;
}

/*Promotion page*/
.btnSushiMenu{
	position: fixed;
	bottom: 0;
	left: 15px;
	width: calc(100% - 30px);
	text-align: center;
}
.btnSushiMenu img{
	max-width: 90%;
}

.promotion .promotion-hyperlink{
	text-decoration: none;
}
.divPromotionContent{
	border-radius: 16px;
	overflow: hidden;
	margin-bottom: 1rem;
	background: #ffffff;
	text-align: center;
	color: #404041;
}
	.divPromotionContent img.promotionImage {
		max-width: 100%;
		/*border-radius: 16px 16px 32px 0;*/
	/*	width:343.38px;
		height:103px;*/
	}
.divPromotionContent .divPromotionText{
	text-align: left;
	line-height: 20px;
	font-family: 'FuturaPTBook';
	
}

.divPromotionContent .divPromotionText .Promotiontitle1{ 
	border-bottom: double;
	padding: 1rem 1rem .2rem 1rem;
	border-bottom: 0;
	margin-bottom: 0;
    font-family: 'FuturaPTBold';
}
.divPromotionContent .divPromotionText .Promotiontitle{ 
	border-bottom: double;
	padding: 0 1rem 1rem 1rem;
	border-bottom: 0;
	margin-bottom: 0;
    font-family: 'FuturaPTBook';
    font-size: .9rem;
}

.Promotioninfo{
	color: #b5b5b5;
	margin-bottom: 0;
    font-size: .9rem;
	text-align:right;
}

.Promotioninfo2{
	float: right;
    margin-bottom: 0;
    padding-top: 5px;
    font-size: .9rem;
}

.divPromotionText #redirectlink {
    text-decoration: underline;
}

/*Find us page*/
.find-us-page{
	
}
.map-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
    pointer-events: none;
}
.iframe-overlay{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
    z-index: 1999;
    background: rgba( 255, 255, 255, .1) url(../media/img/trans-img) 50% 50% no-repeat;
}
.find-us-page input#txtLocation {
	/*margin-right: 10px;*/
	border-radius:12px;
	border: 1px solid #B59B68;
	width:342px;
	height:40px
}
.find-us-page ::-webkit-input-placeholder{
	color: #B5B5B5;
}
.find-us-page ::-moz-placeholder{
	color: #B5B5B5;
}
.find-us-page :-ms-input-placeholder{
	color: #B5B5B5;
}
.find-us-page :-moz-placeholder{
	color: #B5B5B5;
}
.btn-dropdown-custom{
    color: #006570;
    background-color: #ffffff;
    border-color: #ffffff;
}
div.spanicon{
    width: 50%;
    padding-right: 5pt;
	float: left;
}
div.spanicon img{
	max-width: 100%;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
#outletH {
	border-radius: 12px;
	border-color: #f1f1f1;
	background-color: white;
	margin-bottom: 16px;
	/*height: 232px;*/
	padding:16px;
	box-shadow: 0px 4px 4px 0px #00000033;
	font-family:'Quicksand'
}

.mapmodal {
    display: none;
    position: fixed;
    z-index: 12;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}
.mapmodal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 20%;
}
.txt_red {
	width: 80%;
    color: #E0052E;
    font-family: "FuturaPTBold";
    font-size: 0.9rem;
}
.search-box-wrapper {
	width: 100%; 
	position: relative;
}
.search-box-wrapper .form-control {
	padding-right: 40px;
	height: 40px;
	border: 1px solid #B59B68;
	border-radius: 12px;
}
.search-icon-container {
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	background: transparent !important;
	border: none !important;
	z-index: 4; 
	pointer-events: none; 
}
.search-icon {
	height: 20px;
	width: 20px;
	filter: brightness(0) saturate(100%) invert(66%) sepia(19%) saturate(823%) hue-rotate(6deg) brightness(91%) contrast(86%);
}


/*FAQs page*/
.page-faqs .list-group-item {
	font-family: 'Quicksand';
	line-height: 26px;
	font-weight: 500;
	font-size: 18px;
	padding: .3rem 1rem;
	background-color: transparent;
	border: none;
	color: #FE002D;
}

	.page-faqs .list-group-item .faq-info {
		font-family: 'Quicksand';
		margin-bottom: 5px;
		color: black;
		font-weight: 500;
		font-size: 14px;
		line-height: 20px;
	}

.page-faqs .list-group-item-title {
	padding: 24px;
	font-family: 'RobotoExtraBold';
	font-size: 24px;
	font-weight: 900;
	line-height: 32px;
	color: #000000;
}


/*Terms page*/
.page-terms-container {
	color: black;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}

.page-terms-container ol{
	margin-left: -1rem;
	line-height: 20px;
}

.page-terms-container ol li{
	padding-bottom: 1rem;
}

.bullet {
    counter-reset: bullet;
    text-indent: -1.5em;
}
.bullet li {
    list-style-type: none;
}
.bullet li:before {
    counter-increment: bullet;
    content: counter(ordem)"." counter(bullet)" ";
}
li.heading {
    font-size: 16px;
    font-weight: bold;
    padding: 12px 0px;
    list-style-type: none;
    counter-increment: ordem;
}
li.heading1 {
    font-size: 16px;
    font-weight: bold;
    padding: 12px 0px;
    list-style-type: none;
}
.page-terms-title {
	text-decoration: underline;
	text-align: center;
	color: #ED193A;
}

/*Stamp Page*/
.stamp-title {
    z-index: 9;
    border-bottom: solid 1px #f1f1f1;
}
.stamp-head {
    background: #fff;
    display: inline-block;
    border-radius: 50%;
    padding: 40px 30px;
    margin-top: -25px;
    margin-bottom: -25px;

}
.stamp-head-1 {
    font-family: 'FuturaPTBold';
    font-size: 1.2rem;
    line-height: 1.2;
    padding-bottom: 6px;
    color: #E0052E;
}
.stamp-head-2 {
    font-size: .8rem;
    line-height: 1.2;
}
.stamp-content {
    border-top: solid 1px #f1f1f1;
    background: #fff;
    font-size: .9rem;
    color: #B5B5B5;
}
.stamp-content h6{
    font-size: .9rem;
    color: #000;
    margin-bottom: .2rem;
}
.stamp-content ul{
    margin-bottom: 0;
    padding-left: 20px;
}
.stamp-content li{
    line-height: 1.3;
}
.stamp-img {
    height: 21rem;
    background-size: cover;
}
.stamp-img.stamp-0{
	background-image: url('../media/img/stamp-0.png');
}
.stamp-img.stamp-1{
	background-image: url('../media/img/stamp-1.png');
}
.stamp-img.stamp-2{
	background-image: url('../media/img/stamp-2.png');
}
.stamp-img.stamp-3{
	background-image: url('../media/img/stamp-3.png');
}
.stamp-img.stamp-4{
	background-image: url('../media/img/stamp-4.png');
}
.stamp-img.stamp-5{
	background-image: url('../media/img/stamp-5.png');
}
.stamp-img.stamp-6{
	background-image: url('../media/img/stamp-6.png');
}



/*Upload photo*/
.divUploadPhoto{
	padding: 1rem;
	position: relative;
}
.a-upload-photo{
	display: block;

}
.a-upload-photo img{
	max-width: 100%;
}

.divFileInput{
	position: relative;
}
.divFileInput span{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
	line-height: 55px;
}
.divFileInput input{
	display: block;
	width: 100%;
	height: 100%;
	cursor: pointer;
}

.divPhotoMask{
	position: absolute;
	top: 1rem;
	left: 1rem;
	width: calc(100% - 2rem);
	height: calc(100% - 2rem);
	z-index: 2;
	overflow: hidden;
	background: white;
}
.divPhotoMask img{
	max-width: 100%;
}
.divPhotoMask .mask{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
	background: url('../media/img/photo-mask.png') center no-repeat;
	background-size: 100% auto;
}
.divPhotoMask img#imgFile{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/*height: 100%;*/
	z-index: 2;
}

.custom-select-style {
	position: relative;
	min-height: 38px;
	border-radius: 12px;
	color: #000;
}

.custom-select-style .span-custom {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #ffffff url('../media/img/dropdown-red-2.png') right center no-repeat;
	background-size: auto 20%;
	padding: .375rem .75rem;
	font-size: 1rem;
/*	color: #B59B68;*/
	text-transform: capitalize;
	/* padding-left: 0;*/
	border-bottom: 1px solid #e1e1e1;
}
#txtMobile::placeholder {
	color: #B59B68;
	opacity: 1; /* Override Firefox's default opacity */
}
.custom-select-style .span-custom.mr-10 {
	width: calc(100% - 10px);
}


.custom-select-style .span-custom.mr-11 {
	width: calc(100% - 10px);

}

.custom-select-style .span-custom + select.form-control{
	position: relative;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	z-index: 1;
}

/*Modal*/
.modal-header {
	color: #FFFFFF;
	font-size: 1rem;
	padding: 20px 24px;
	background-color: #FE002D;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}
.modal-header .close{
	color: #ffffff;
	opacity: 1;
	outline: 0;
}
.modal-header .close:not(:disabled):not(.disabled):focus, 
.modal-header .close:not(:disabled):not(.disabled):hover{
	color: #ffffff;
	opacity: 1;
}
.modal-header .close span{
	line-height: 0.6;
	font-size: 2rem;
	display: block;
	font-family: 'FuturaPTBook';
	font-weight: normal;
}
.modal-content {
    background-color: transparent;
    border: 0;
}
.modal-body {
    background-color: #fff;
}
.modal-footer {
	background-color: #fff;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
}


/*Message Modal*/
.msgmodal {
	display: none;
	position: fixed;
	z-index: 12;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.4);
	align-items: flex-end;
	font-family: 'Quicksand';
}

.msgmodal-content {
	background-color: #FE002D;
	/*margin: 15% auto;*/
	padding: 20px;
	/*border: 1px solid #888;*/
	width: 100%;
	color: #fff;
}

#myModalMsg {
	margin-bottom: 0;
	font-family: 'Quicksand';
}

/*Scan Modal*/
#finalConfirmationModal #deleteMessage{
	font-size: 13px;
}

#scanModal .modal-dialog, #confirmationModal .modal-dialog, #finalConfirmationModal .modal-dialog {
	margin: 1rem;
	max-width: 500px
}
#scanModal .modal-body {
    padding: 0;
    font-family: "FuturaPTBold"; 
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    text-align: center;
}

#scanModal .modal-body h6 {
    margin-top: 30px;
}

#scanModal #smilePoint2 {
    color: #E0052E;
}

#scanModal .content1 {
	font-size: 16px;
	font-weight:500;
	line-height:24px;
	font-family: 'Quicksand';
}

#scanModal .content2 {
	font-size: .6rem;
	font-family: 'Quicksand';
	padding: 10px 50px;
}

#scanModal .modal-footer {
    color: #FFFFFF;
    font-size: 1rem;
    padding: 20px 30px;
    background-color: #000;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
    font-family: "FuturaPTBold";
}

#scanModal .btn-round-corner {
    font-size: .9rem;
    outline: 0;
}

/*reward enhancement*/
#RewardHead .board-title{
    font-family: 'FuturaPTMedium';
    font-size: 1rem;
    border-radius: 0;
    padding: .5rem 1rem;
	text-align:left;
}

.text34{
	font-family:'Quicksand'
}

#RewardHead .Promotiontitle {
    padding: 1rem;
}

#reward .Promotioninfo {
	margin-bottom: .2rem;
	color: #FE002D;
	padding: 0;
	font-family: 'FuturaPTBook';
	font-size: 12px;
	font-weight:700;
	line-height:16px;
}

.RewardBtn {
	display: flex;
	gap: 8px;
	
}

.rbtn2 {
	background-color: #B59B68;
	
}

.RewardTC {
	display: none;
}

#RewardContent {
    position: relative;
    border-radius: 0;
}

#redeemR{
    position: absolute;
    width: 100%;
    left: 0;
}

#expiredR{
    position: absolute;
    width: 100%;
    left: 0;
}

.overl{
    opacity: 0.5;
}

.msgmodalR {
	display: none;
	position: fixed;
	z-index: 12;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.4);
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.msgmodalR .modal-container {
	width: 90%;
	max-width: 500px;
	background: white;
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.msgmodalR .modal-containers {
	width: 90%;
	max-width: 500px;
	border-radius: 1rem;
	overflow: hidden;
}

.msgmodal-headerRs {
	color: #FFFFFF;
	border-radius: 1rem 1rem 0rem 0rem;
	margin: 0 auto;
	padding: .75rem 1.25rem;
	width: 100%;
	text-align: left;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 500px;
}

.msgmodal-headerR {
	color: #FFFFFF;
	border-radius: 1rem 1rem 0rem 0rem;
	background-color: #FE002D;
	margin: 0 auto;
	padding: .75rem 1.25rem;
	width: 100%;
	text-align: left;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 500px;
}

#myModalHead {
	margin-bottom: 0;
	font-family: 'Quicksand';
	font-size: 14px;
	font-weight:700;
}

#myModalHeads {
	margin-bottom: 0;
	font-family: 'Quicksand';
	font-size: 22px;
	font-weight: 700;
}


.msgmodal-contentR {
	background-color: #fefefe;
	margin: 0 auto;
	padding: 20px;
	width: 100%;
	border-radius: 0rem 0rem 1rem 1rem;
	font-size: .9rem;
	max-width: 500px;
}

.msgmodal-contentRs {
	margin: 0 auto;
	padding: 20px;
	width: 100%;
	border-radius: 0rem 0rem 1rem 1rem;
	font-size: .9rem;
	max-width: 500px;
}

.closeR {
	/*float: left;*/
	color: #fff;
	opacity: 1;
	text-shadow: none;
	font-size: 1.2rem;
	line-height: 24px;
	margin-left: auto;
	padding-left: 15px;
}

/*Refer Page*/
#divPagesContainer.sidebar-refer{
	background-image: url('../media/img/line-bg.jpg');
	background-size: 100% auto;
	background-position: top center;
	background-repeat: no-repeat;
    border-radius: 50%;
}

.refercontent {
    font-family: 'source_sans_proregular';
    color: #404041;
    line-height: 1.5rem;
    margin: 50px 0;
    font-size: 1.1rem;
}

#btnRLearn {
    font-size: 1.1rem;
}

#btnRNext {
    font-size: 1.1rem;
}

.msgmodal-headerR.refer{
	margin:1rem auto 4px auto;
}

.msgmodal-contentR.refer {
    font-family: 'source_sans_proregular';
    font-size: 11pt;
    color: #404041;
    line-height: 1.1;
}

.contentRefer {
    margin-bottom: 10px;
}

.msgmodal-contentR.refer ol {
    padding-left: 15px;
}

#referBtnLanding {
    z-index: 8;
    position: absolute;
    bottom: 10rem;
    display: none;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

#popimg {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 11;
    background: rgba(0, 0, 0, 0.5);
}

/*Legends*/
.divLegends{
	margin-top: .5rem;
	font-size: 0.65rem;
	text-align: center;
	border: 1px solid #D0B883;
	border-radius: .5rem;
	overflow: hidden;
	font-family: 'dosissemibold'
}
.divLegends .col{
	padding: .15rem 0;
}
.divLegends .col:first-child{
	border-right: 1px solid #D0B883;
}
.divLegends .label-redeem{
	color: #ED193A;
}


/*Scroll*/
.jspVerticalBar{
	background: none;
	width: 8px;
	right: 4px;
}
.jspTrack{
	background: none;
}
.jspDrag{
	background: #000;
	border-radius: 7px;
	opacity: 0.5;
}

.div-texts-compact{
	line-height: 1.2rem;
	margin: 10px 0;
}
.max-width-50{
	max-width: 50% !important;
}

.line-bg{
	padding-bottom: 0.5rem;
}

.special-background{
    margin-top: 24px;
}

.overlay-decoration{
	position: absolute;
	z-index: 1;	
}
.overlay-decoration.deco-3{
	width: 35%;
	height: auto;
	top: 0;
	left: -15px;
}
.overlay-decoration.deco-4{
	width: 35%;
	height: auto;
	bottom: -10px;
	right: -15px;
}

/*Decoration*/
.deco-1{
	text-align: left;
	width: 100%;
}
.deco-1 img{
	max-width: 40%;	
}
.deco-2{
	text-align: right;
	width: 100%;
}
.deco-2 img{
	max-width: 50%;	
}


/*Buttons*/
.btn-round-corner{
	font-size: 1rem;
	color: #ffffff;
	border-radius: 30px;
	border: 0;
	padding: 12px;
	min-width: 200px;
	max-width: 100%;
	text-align: center;
	letter-spacing: 1px;
	display: block; 
	margin: 0 auto 10px;
	font-family: Quicksand;
	font-weight:700;
}
.btn-round-corner:hover,
.btn-round-corner:active{
	color: #ffffff;
	text-decoration: none;
	cursor: pointer;
}

.btn-round-corner.btn-sm {
    min-width: 120px;
    padding: 5px;
    margin: 0;
    font-size: .8rem;
    display: inline-block;
    margin-right: 5px;
}

.btn-round-corner.btn-sm.btn-short {
	min-width: 100px;
}

button:focus {
    outline: 0;
}
.btn-green{
	background-color: #D0B883;
	background: #D0B883;
}
.btn-red {
	background-color: #FE002D;
}
.btn-black{
	background-color: #000;
}
.btn-white{
	background-color: #fff;
    color: #000;
}
.btn-grey{
	background-color: #d1d1d1;
    color: #fff;
}
.btn-gold {
	background-color: #B59B68;
}

.a-logout{
	float: right;
	/*font-size: 1rem;*/
	margin: 0 !important;
}
.a-logout:hover{
	text-decoration: none;	
}


/*Fonts Style*/
.bold{
	font-family: 'dosisbold';
}
.white{
	color: #fff;
}
.red{
	color: #ED193A;
}
.green{
	color: #ED193A;
}
.highlight-red {
	color: #FE002D;
	font-size: 0.9em;
}
.highlight-black {
	color: #000;
	font-size: 12px;
	font-weight:700;
}
.highlight-green{
	color: #ED193A;
	font-size: 1.2rem;	
}
a:hover {
    color: #000;
}

.a-stripe{
	display: flex;
    width: 80%;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0 auto;
}
.a-stripe:before,
.a-stripe:after {
    content: '';
    border-top: 2px solid;
    margin: 0 10px 0 0;
    flex: 1 0 10px;
	color: #E4D5B7;
}
.a-stripe:after {
    margin: 0 0 0 10px;
}
.a-stripe.stripe-red:before,
.a-stripe.stripe-red:after{
	color: #E4D5B7;
}

.small-texts{
	font-size: 0.75rem;
	display: block;
}

.text-capitalize a,
.text-capitalize select{
	text-transform: capitalize;
}

/* Profile Section Styling */
#divProfile .spanName {
	font-family: 'FuturaPTBold';
	font-size: 18px;
	color: #000;
}

#divProfile .spanAvatarContainer {
	width: 80px;
	height: 80px;
}

#divProfile .switch {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 18px;
}

#divProfile .switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

#divProfile .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
	border: 2px solid #8E7A50;
}

#divProfile .slider:before {
	position: absolute;
	content: "";
	height: 16px;
	width: 16px;
	left: 0px;
	bottom: 0px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
	border: 2px solid #8E7A50;
}

#divProfile input:checked + .slider {
	background-color: #8E7A50;
}

#divProfile input:focus + .slider {
	box-shadow: 0 0 1px #8E7A50;
}

#divProfile input:checked + .slider:before {
	-webkit-transform: translateX(16px);
	-ms-transform: translateX(16px);
	transform: translateX(16px);
}

#divProfile .slider.round {
	border-radius: 34px;
}

#divProfile .slider.round:before {
	border-radius: 50%;
}


#divProfile .linkPoint {
	display: inline-block;
	margin: 10px 0;
	color: #000;
	text-decoration: none;
}


/* Quick Access Section Styling */
.list-group-item {
	border: none;
	border-bottom: 1px solid #f1f1f1;
	padding: 1rem 1.25rem;
	font-family: 'QuickSand';
	/*color: #000;*/
}
.lists-group-item {
	border: none;
	border-bottom: 1px solid #f1f1f1;
	padding: 1rem 1.25rem;
	font-family: 'QuickSand';
	/*color: #000;*/
}

.list-group-item:first-child {
	border-top: none;
}

.list-group-item:last-child {
	border-bottom: none;
}

.redirectTo {
	color: #000;
	text-decoration: none;
}

.redirectTo .fas {
	color: #B59B68;
}


.navbar.navbar-bottom .nav-link {
	position: relative;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0.5rem 0.5rem;
	width: 62px;
}

/* Active icon color change */
.navbar.navbar-bottom .active .px-icon {
	filter: brightness(0) saturate(100%) invert(25%) sepia(99%) saturate(2088%) hue-rotate(332deg) brightness(92%) contrast(96%);
}

#divPagesContainer.panel-content {
	padding-bottom: 70px;
}

/*Icons*/
.px-icon{
	display: block;
	width: 30px;
	height: 30px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
}

.px-icon.px-home{
	background-image: url('../media/img/icon-home-1.svg');
}
.px-icon.px-delivery{
	background-image: url('../media/img/icon-delivery-1.png');
}
.px-icon.px-location{
	background-image: url('../media/img/icon-location-1.png');
}
.px-icon.px-promotion{
	background-image: url('../media/img/icon-promotion-1.svg');
}
.px-icon.px-account{
	background-image: url('../media/img/icon-account-1.svg');
}
.px-icon.px-bell-w{
	background-image: url('../media/img/icon-notification-1.svg');
}
.px-icon.px-bell-b{
	background-image: url('../media/img/icon-notification-1.png');
}
.px-icon.px-reward {
	background-image: url('../media/img/icon-reward-1.svg');
}
.px-icon.px-qr {
	background-image: url('../media/img/icon-qr.svg');
}
.px-sk {
	background-image: url('../media/img/sk-logo-3.png');
}
.sk-reward{
	background-image: url('../media/img/reward-1.png')
}

.hide{
	display: none !important;
}
.show{
	display: flex !important;
}


.mw-25{

	min-width: 25%;

}

.mw-45{
	min-width: 45%;
}
.mw-60{
	min-width: 60%;	
}



.w-29{
	width: 29%;	
}

.w-35{
	width: 35%;
}


/*margins*/
.mt-0{
	margin-top: 0px;
}
.mb-0{
	margin-bottom: 0px;
}
.ml-0{
	margin-left: 0px;
}
.mr-0{
	margin-right: 0px;
}
.mt-10{
	margin-top: 10px;
}
.mb-10{
	margin-bottom: 10px;
}
.ml-10{
	margin-left: 10px;
}
.mr-10{
	margin-right: 10px;
}
.mt-20{
	margin-top: 20px;
}
.mb-20{
	margin-bottom: 20px;
}
.ml-20{
	margin-left: 20px;
}
.mr-20{
	margin-right: 20px;
}
.mt-100{
	margin-top: 100px;
}
.py-8{
	padding-top:8px !important;
	padding-bottom:8px !important;
}
.pt-10{
	padding-top: 10px;
}
.pt-95{
	padding-top: 95px;
}
.pb-10 {
    padding-bottom: 10px;
}

.bg-white {
    background: #fff;
}
.bg-trans {
    background: transparent;
}
.bg-grey {
    background: #f1f1f1;
}
.bb-grey {
	border-bottom: 1px solid #E0E0E0;
}

.col-pad-10{
	padding-left: 10px;
	padding-right: 10px;
}

.pad-l0-r20{
	padding-left: 0;
	padding-right: 20px;
}
.pad-l20-r0{
	padding-left: 20;
	padding-right: 0px;
}


.divLandingCircle{
	width: 19rem;
	height: 19rem;
	display: flex;
	align-self: center;
	align-content: center;
	flex-direction: column;
	justify-content: center;
	text-align: center;	
	background-size: 80% auto;
	background-position: center; 
	background-repeat: no-repeat;
/*	z-index: 8;*/
    position: relative;
	
	margin-right:24px;
	margin-left:24px
}
	.divLandingCircle .spanSmilePoint {
		font-family: 'FuturaPTBold';
		color: #B59B68;
		font-size: 12px;
/*		line-height: 2rem;*/
	}
.divLandingCircle .spanSmilePointLabel{
	font-family: 'FuturaPTMedium';
	color: #000;
	font-size: 24px;	
	line-height: 1.1rem;
}
.divLandingCircle .spanSmilePointLabel.title {
    /*margin-bottom: 50px;*/
	
    color: #fff;
    font-family: 'FuturaPTBold';
}
.divLandingCircle .spanSmilePointLabel.button {
    margin-top: 2rem;
    color: #fff;
}
.divLandingCircle .spanSmilePointLabel.button button{
    margin-bottom: 0;
    font-size: .9rem;
    outline: 0;
}
.divLandingCircle .spanRinggitValue{
	font-family: 'FuturaPTMedium';
	color: #000;
	font-size: 40px;	
	line-height: 1.3rem;
    /*position: absolute;*/
    bottom: 15%;
    left: 45%;
    margin-top: 3rem;
    margin-bottom: 2rem;
}
.divLandingCircle .spanSmileReward{
    width: 3.5rem;
	height: 1.5rem;
	background-image: url('../media/img/gift-5.gif');
	background-size: 100%;
	background-position: center; 
	background-repeat: no-repeat; 
    margin-top: .2rem;
    display: none;
}
.divLandingCircle .divSmileReward {
    align-self: center;
	align-content: center;
	flex-direction: column;
	justify-content: center;
	text-align: center;	
}

.divLandingCircle.circle-0{
	/*background-image: url('../media/img/landing-rec-01.png');*/
	
}
.divLandingCircle.circle-1{
	background-image: url('../media/img/landing-circle-1-2.png');
}
.divLandingCircle.circle-2{
	background-image: url('../media/img/landing-circle-2-2.png');
}
.divLandingCircle.circle-3{
	background-image: url('../media/img/landing-circle-3-2.png');
}
.divLandingCircle.circle-4{
	background-image: url('../media/img/landing-circle-4-2.png');
}
.divLandingCircle.circle-5{
	background-image: url('../media/img/landing-circle-5-2.png');
}
.divLandingCircle.circle-6{
	background-image: url('../media/img/landing-circle-6-2.png');
}
.divLandingCircle.circle-7{
	background-image: url('../media/img/landing-circle-7-2.png');
}
.divLandingCircle.circle-8{
	background-image: url('../media/img/landing-circle-8-2.png');
}
.divLandingCircle.circle-9{
	background-image: url('../media/img/landing-circle-9-2.png');
}
.divLandingCircle.circle-10{
	background-image: url('../media/img/landing-circle-10-2.png');
}
.divLandingCircle.circle-11{
	background-image: url('../media/img/landing-circle-11-2.png');
}
.divLandingCircle.circle-12{
	background-image: url('../media/img/landing-circle-12-2.png');
}
.divLandingCircle.circle-13{
	background-image: url('../media/img/landing-circle-13-2.png');
}
.divLandingCircle.circle-14{
	background-image: url('../media/img/landing-circle-14-2.png');
}
.divLandingCircle.circle-15{
	background-image: url('../media/img/landing-circle-15-2.png');
}
.divLandingCircle.circle-16{
	background-image: url('../media/img/landing-circle-16-2.png');
}
.divLandingCircle.circle-17{
	background-image: url('../media/img/landing-circle-17-2.png');
}
.divLandingCircle.circle-18{
	background-image: url('../media/img/landing-circle-18-2.png');
}
.divLandingCircle.circle-19{
	background-image: url('../media/img/landing-circle-19-2.png');
}
.divLandingCircle.circle-20{
	background-image: url('../media/img/landing-circle-20-2.png');
}



/*Media Queries*/

@media (max-width: 320px) {
	#rbtn1, #rbtn2 {
		height: 32px !important; /* Smaller button height */
		min-width: 100px !important; /* Smaller minimum width */
		font-size: 12px !important; /* Smaller font size */
		line-height: 18px !important; /* Adjusted line height */
	}
	.btn {
		font-size: 14px !important;
	}
	.special-background{
		padding:0 24px !important;
	}
	.day {
		min-width: 32.33% !important;
	}
	.custom-select-style .span-custom, .form-control, .um-label {
		font-size: 12px !important;
	}
	.um-label {
		font-size: 14px !important;
	}
	.panel-title{
		font-size: 18px !important;
	}
	.page-faqs .list-group-item{
		font-size:16px !important;
	}
	.page-faqs .list-group-item-title {
		font-size: 22px !important;
	}
}

@media (min-width: 321px) and (max-width: 376px) {
	.special-background {
		padding: 0 48px !important;
	}
}

@media (min-width: 360px) {

	.divLandingCircle{
		width: 22rem;
		height: 22rem;
	}
	.divLandingCircle .spanSmilePoint{
		font-size:12px;
	    line-height: 2rem;
	    margin-bottom: 2rem;
        margin-top: 2rem;
	}
	.divLandingCircle .spanSmilePointLabel{
		font-family: 'FuturaPTMedium';
		font-size: 12px;	
		line-height: 1rem;
		margin-bottom: 0;
	}

}

@media (min-width: 426px) {
	.landingctl {
		padding-top: 20% !important;
		max-width: 500px !important;
	}
}

@media (min-width: 576px) {

	.divLandingCircle{
		width: 29rem;
		height: 29rem;
	}

	.divLandingProfile{
		width: 12rem;
	}

	.divLandingProfile .spanNameWrapper{
		font-size: 1rem;	
	}
	.landingctl {
		padding-top: 0% !important; 
		/* padding-top: 15% !important; */
		max-width: 500px !important;
	}
}

@media (min-width: 768px) {

	.divLandingCircle{
		width: 34rem;
		height: 34rem;
	}
	.divLandingCircle .spanSmilePoint{
		font-size: 6rem;
	    line-height: 4rem;
	    margin-bottom: .75rem;
	}
	.divLandingCircle .spanSmilePointLabel{
		font-family: 'source_sans_prosemibold';
		font-size: 2rem;	
		line-height: 2rem;
		margin-bottom: .25rem;
	}
    .divLandingCircle .spanSmilePointLabel.title {
        margin-bottom: 0px;
    }

    .divLandingCircle .spanRinggitValue {
        margin-top: 7rem;
    }

    .divLandingCircle .spanSmilePointLabel.button {
        margin-top: 0rem;
    }

    .inner-container.landingpg {
        padding-top: 20%;
    }

	#aSetting span{
		width: 29px;
		height: 29px;
	}

	.divGifBackground{
		background-image: url('../media/img/bg-main.png');
        background-size: auto 120%;
	}

	.divGifBackground {
		background-image: url('../media/img/bgr-main.png');
		background-size: auto 120%;
	}

	.promo-badge {
		font-size: 12px !important;
		padding: 6px 10px !important;
	}

}

.smile-points-container {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem; /* Adjust the space between the number and text as needed */
	/* Adjust vertical spacing as needed */
}

	.smile-points-container .spanSmilePoint,
	.smile-points-container .spanSmilePointLabel {
		margin: 0; /* Remove any default margins */
		line-height: 1; /* Ensure consistent line height */
	}

@media (min-width: 992px) and (orientation: portrait) {
	.divLandingCircle {
		width: 49rem;
		height: 49rem;
	}

		.divLandingCircle .spanSmilePoint {
			font-size: 12px;
			line-height: 10rem;
			margin-bottom: .25rem;
			color: ##B59B68;
		}

		.divLandingCircle .spanSmilePointLabel {
			font-family: 'source_sans_prosemibold';
			font-size: 1.8rem;
			line-height: 1.8rem;
			/*margin-bottom: .25rem;*/
		}

		.divLandingCircle .spanRinggitValue {
			font-family: 'source_sans_prosemibold';
			font-size: 40px;
			line-height: 1.8rem;
		}

	#divLanding {
		border-left: 0;
	}
}

@media (min-width: 1200px) {
	.divGifBackground {
		background-image: url('../media/img/bg-main.png');
		background-size: auto 120%;
	}

	.divLandingCircle .spanRinggitValue {
		font-size: 40px;
		line-height: 1.3rem;
	}
}

@media (min-width: 992px) {
	

	#divLanding{
		border-left: 4px solid #ffffff;
	}

	.navbar.navbar-bottom .nav-link{
		padding: .15rem 1rem;
		font-size: 1rem;
	}

	.px-icon{
		width: 39px;
		height: 39px;
		margin: 0px auto 2px;		
	}

	.divLandingProfile{
		width: 15rem;
	}
	.divLandingProfile .spanAvatarContainer{
		border-color: #333333;
		width: 4rem;
    	height: 4rem;
	}

	.btnSushiMenu{
		max-width: 22%;
	}

	.navbar.navbar-bottom .nav-text {
		font-size: 0.8rem;
	}

	.container {
		max-width: 720px;
	}
}


.loadingProgress {
	display: block;
	position: fixed;
	z-index: 2000;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: rgba( 255, 255, 255, .8) url('../media/img/loader.gif') 50% 50% no-repeat;
}

@media screen and (device-aspect-ratio: 40/71) {
	#divLanding{
	}
	#divLandingContainer{
	}
	.navbar.navbar-bottom{
		position: fixed;
		bottom: 0;
	}
	.divLandingCircle{
		margin-top: 80px;
		margin-bottom: 80px;
		margin-left: auto;
		margin-right: auto;
		position: relative;
	}
	.landing-content{
		background: blue;
		display: block;
		width: 100%;
		/*position: relative;*/
	}
	.divGifBackground{
		width: 100%;
		top: 0;
		left: 0;
		background-size: 100% 100%;
	}

}

@media (max-height: 620px) {
    #referBtnLanding {
        bottom: 6rem;
    }
}

@media (min-width: 576px) {
	.navbar.navbar-bottom .nav-text {
		font-size: 0.7rem;
	}
}

@media (min-width: 768px) {
	.navbar.navbar-bottom .nav-text {
		font-size: 0.75rem;
	}

	.navbar.navbar-bottom .nav-link {
		padding: 0.5rem 0.5rem;
	}
}


@media (min-width: 1200px) {
	.container {
		max-width: 720px;
	}
}


/*Register Page*/
.font-white {
	color: #fff;
}
.registerpg h5 {
    color: #E0052E;
    font-family: 'FuturaPTBold';
    text-align: center;
    margin-bottom: 20px;
}
.registerpg h6 {
    font-size: .9rem;
    text-align: center;
    margin-bottom: 20px;
}
.register-min-width {
	min-width: 33.33%
}

.register-width {
	width: 33.33%
}

.registerpg input[type="radio"] {
	height: 20px;
}

.registerpg .subtitle {
	font-size: .9rem;
}

.registertnc-title {
	font-weight: 700;
	font-size: 16px;
	line-height: 22px
}

/*New Panel Title*/
.new-title {
	position: relative;
}

.new-title-logo {
	position: absolute;
	right: 1rem;
	top: 1rem;
}

/*Game Page*/
#divPagesContainer.sidebar-game {
	background-image: url('../media/img/sidebar-bg-game-2025-4.png');
	background-size: 100%;
	background-position: top center;
	background-repeat: no-repeat;
	min-height: 100%;
}

.gameHeaderCon {

}

.gameHeader {
	text-align: center;
	color: #005AB1;
	font-size: 18px;
	line-height: 1.8;
	font-family: 'hwtgothicroundplain';
	/*padding-top: 5px;*/
	padding-top: 165px;
}

.gameHeader-1 {
	font-size: 28px;
	line-height: 0.8;
	/*text-shadow: 0 0 6px #fff;*/
}

.gameHeader-2 {
	font-size: 38px;
	line-height: 0.8;
}

.gameHeader-3 {
	color: #FFFFFF;
	font-size: 58px;
	line-height: 0.8;
	text-shadow: 3px 3px #D92331;
}

.gameDesc1 {
	text-align: center;
	color: #D93C43;
	font-size: 25px;
	font-family: 'FuturaPTBold';
	/*margin-bottom: 10px;*/
}

.gameDesc2 {
	text-align: center;
	color: #000000;
	font-size: 16px;
	font-family: 'FuturaPTBold';
	line-height: 1.2;
}

.gameFooter {
	/*padding: 50px 0px 10px 0px;*/
	margin-top: -10px;
	/*margin-left: -30px;*/
	border-radius: 20px;
	/*background-image: url('../media/img/footer-bg-1.png');*/
	/*background: linear-gradient(180deg, rgba(196,39,43,1) 0%, rgba(230,76,16,1) 100%);*/
}

#myCanvas {
	width: 100%;
	z-index: 1;
}

#canvasContainer {
	background-image: url('../media/img/wheel-bg-2025-4.png');
	background-repeat: no-repeat;
	background-position: center;
	width: 346px;
	height: 356px;
	margin: auto;
	position: relative;
}

#spinPointer {
	position: absolute;
	left: 164px;
	top: 12px;
	z-index: 10;
}

#spinCenter {
	position: absolute;
	left: 151px;
	top: 156px;
	z-index: 10;
}

#btnSpin {
	background-color: transparent;
	border: none;
	margin: 10px 0;
}

.spinBox {
	background: #D93C43;
	padding: 0px 10px;
	color: #FFFFFF;
	font-family: 'FuturaPTHeavy';
	font-size: 30px;
	border-radius: 20px;
	border: 2px solid #FFFFFF;
	/*box-shadow: 2px 5px black;*/
}

.spinImg2 {
	position: relative;
}

.spinMini {
	position: absolute;
	left: 49%;
	transform: translateX(-50%);
	bottom: 61px;
	z-index: 10;
	width: 65vmin;
}

.spinMini img {
	width: 100%;
}

.gamepg .msgmodal-content {
	font-family: 'FuturaPTBold';
	border: 2px solid #000000;
	border-radius: 10px;
	background: #FFFFFF;
	/*background: rgb(255,199,43);*/
	/*background: linear-gradient(135deg, rgba(247,131,254,1) 0%, rgba(207,112,255,1) 43%, rgba(118,66,200,1) 100%);*/
}

.gamepg #myModalMsg {
	color: #000000;
	font-size: 20px;
}

.gamepg .btn {
	color: #FFFFFF;
	border-radius: 5px;
	background: #D93C43;
	padding: 0 1rem;
}

.msgmodal.gamepg {
	padding: 60px 20px 0 20px;
}

/*-----November update 2022------*/

#btnVerify:disabled {
	opacity: 0.5;
}


/*----------------Treasure Hunt----------*/

.treasure_floating {
	position:fixed;
	bottom:80px;
	right:15px;
	z-index:10;
}

.treasure_floating img {
	width: 100px;
	-webkit-animation: heartbeat 1.5s ease-in-out infinite both;
	animation: heartbeat 1.5s ease-in-out infinite both;
}


.treasurehunt {
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	justify-content: center;
	position: relative;
	padding-bottom: 120px;
}

.permission_overlay {
	position: absolute;
	left: 0;
	top: 0;
	padding-bottom: 120px;
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: 25px;
	z-index: 5;
	background: #f1f1f1;
}

.treasurehunt #reader, #reader_file {
	height: 90vmin;
	width: 90vmin;	
	overflow: hidden;
	border-radius: 5px;
	overflow: hidden;
	margin-bottom:20px;
}

#reader_file {
	display:none;
	margin-bottom:20px;
}

.treasurehunt #reader video{
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}

#reader_file canvas {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain;
}



.file_btn, .scan_btn, .refresh_btn, .permission_btn {
	padding: 10px 25px;
	border-radius: 99px;
	background: #E0052E;
	color: white;
	font-size: 20px;
	margin-top: 10px;
	text-align: center;
	position: relative;
	border: none;
	min-width: 250px;
}
.file_btn input{
	opacity:0;
	position:absolute;
}

.treasure_modal{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:99;
	background:rgba(0,0,0,0.5);
	display:flex;
	align-items:center;
	justify-content:center;
	display:none;
}

.treasure_modal .modal_window {
	width:90%;
	padding:20px 10px;
	border-radius: 10px;
	background: white;
	overflow: hidden;
	display:flex;
	flex-direction:column;
	align-items:center;
	max-width:500px;
	text-align:center;
}

.treasure_modal .modal_window p {
	font-size: 18px;
	white-space: pre-wrap;
}

.treasure_modal .reward_items {
	display:flex;
	flex-direction:column;
	width:90%;
	margin:0 auto 10px;
}

.treasure_modal .reward_items strong {
	margin-left:10px;
}

.treasure_modal .modal_window button {
	padding: 5px 15px;
	border-radius: 99px;
	background: #E0052E;
	color: white;
	font-size: 20px;
	text-align: center;
	border: none;
	min-width: 200px;
}

.checkboxgroup {
	display: inline-block;
	text-align: center;
	margin: 0px 6px;
}

.checkboxgroup label {
	display: block;
	margin: 10px 0px 0px 0px;
}

.survey-question {
	margin: 15px 8px 10px 8px;
}

.form-check {
	margin: 5px 8px 0px 8px;
}

.low-label{
	font-size:10px;
	font-style:italic;
	float:left;
}

.high-label {
	font-size: 10px;
	font-style: italic;
	float:right;
}



/*Login page*/
#btnLogin {
	margin-left: 0px;
	margin-right: 0px;
	display: inline-block;
}

#btnBiometric img {
	height: 44px;
	width: auto;
	display: inline-block;
	margin-bottom: 5px;
}

/*Account page*/
.page-account .list-group-item {
	padding: 0.5rem 1.25rem;
}

.navbar-bottom .active ~ .navbar-top-border,
.navbar-bottom .active + .navbar-top-border {
	background-color: #FE002D; /* Red color for active tab */
}

/*.nav-links.active::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background-color: #FE002D;
	border-radius: 3px 3px 0 0;
}*/

/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
	from {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transform-origin: center center;
		transform-origin: center center;
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	10% {
		-webkit-transform: scale(0.91);
		transform: scale(0.91);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	17% {
		-webkit-transform: scale(0.98);
		transform: scale(0.98);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	33% {
		-webkit-transform: scale(0.87);
		transform: scale(0.87);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	45% {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@keyframes heartbeat {
	from {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transform-origin: center center;
		transform-origin: center center;
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	10% {
		-webkit-transform: scale(0.91);
		transform: scale(0.91);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	17% {
		-webkit-transform: scale(0.98);
		transform: scale(0.98);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	33% {
		-webkit-transform: scale(0.87);
		transform: scale(0.87);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	45% {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}