@font-face {
		font-family: 'hennessy_sans_1765';
		src: url('../../fonts/hennessysans1765-webfont.woff') format('woff2'),
			url('../../fonts/hennessysans1765-webfont.woff2') format('woff');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
		font-family: 'hennessysansregular';
		src: url('../../fonts/hennessysans-regular-webfont.woff') format('woff2'),
			 url('../../fonts/hennessysans-regular-webfont.woff2') format('woff');
		font-weight: normal;
		font-style: normal;
	}
	@font-face {
		font-family: 'avenirlight';
		src: url('../../fonts/avenir-light-07-webfont') format('woff2'),
			 url('../../fonts/avenir-light-07-webfont2') format('woff');
		font-weight: normal;
		font-style: normal;
	}
#emailOTPInput{
	width:250px;
}	
body {
	/* margin-left: auto; */
	/* margin-right: auto; */
	font-family: 'hennessysansregular';
	font-weight:400;
}
.item-qr > canvas:hover,
.item-qr > img:hover {
	cursor:pointer;
}
.item-qr-wrapper {
	line-height:0;
}
button.special-bg-1.btn:active,
button.special-bg-1.btn:hover {
	background-color: #f4d398;
	color:#fff;
}
button.btn-primary, .special-bg-1 {
    background: #f4d398;
    color: #414042;
    text-transform: uppercase;
    border-radius: 40px;
    padding: 15PX;
    letter-spacing: 0.5px;
    line-height: 1.2;
}

button.special-bg-2 {
	border-radius: 40px;
	border: 0px none;
    background-color: transparent !important;
}
.special-bg-2 {
    background-image: url(../../img/cny2023/btn-gradient-1.png);
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}	

.total-5.fnbtoken.item-1,
.total-5.fnbtoken.item-2 {
	width:130px;
}


.fnbtoken-type-hennessy-whiskey .img {
	width:98px;
	height:98px;
	position:relative;
	margin:0 auto;

}
.total-5.fnbtoken.item-1 .img {
	margin:0 0 20px auto;
}
.total-5.fnbtoken.item-2 .img {
	margin:0 auto 20px 0;
}


.fnbtoken-type-hennessy-whiskey .img:after {
	content: "";
    position: relative;
    width: 98px;
    height: 98px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(../../img/cny2023/hennessy-whiskey-valid.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50% 50%;
    display: block;
}

#drink-tokens-div .total-10 .fnbtoken svg,
#drink-tokens-div .total-11 .fnbtoken svg,
#drink-tokens-div .total-12 .fnbtoken svg,
#drink-tokens-div .total-13 .fnbtoken svg,
.total-10 .fnbtoken-type-hennessy-whiskey .img,
.total-11 .fnbtoken-type-hennessy-whiskey .img,
.total-12 .fnbtoken-type-hennessy-whiskey .img,
.total-13 .fnbtoken-type-hennessy-whiskey .img {
	width:74px;
	height:74px;
}
.total-10 .fnbtoken-type-hennessy-whiskey .img:after,
.total-11 .fnbtoken-type-hennessy-whiskey .img:after,
.total-12 .fnbtoken-type-hennessy-whiskey .img:after,
.total-13 .fnbtoken-type-hennessy-whiskey .img:after {
	width: 74px;
    height: 74px;
}


.fnbtoken-type-hennessy-whiskey.fnbtoken-status-used .img:after,
.fnbtoken-type-hennessy-whiskey.fnbtoken-status-invalid .img:after {
	background-image:url(../../img/cny2023/hennessy-whiskey-used.png);
}

#drink-tokens-div .fnbtoken.fnbtoken-type-hennessy-whiskey.fnbtoken-status-used:after,
#drink-tokens-div .fnbtoken.fnbtoken-type-hennessy-whiskey.fnbtoken-status-invalid:after {
	display:none;
}

#item-balance {
	width:100%
}

#item-balance span {
	display:block;
	line-height:1
}

#item-balance .balance {
	font-size:2.5em;
	background-image: url(../../img/cny2023/btn-gradient-1.png);
    background-clip: text;
    -webkit-background-clip: text;
    color: rgba(255, 255, 255, 0.01);
    background-size: 100px auto;
    filter: brightness(1) drop-shadow(0px 0px 3px rgba(0,0,0,0));
    background-position: 50% 50%;
    background-repeat: no-repeat;
    font-weight: 700;
	margin-top:20px;
}


#item-balance .text {
	text-transform:uppercase;
	margin: 1em auto;
	
}

#item-balance button {
	text-transform: uppercase;
    width: 100px;
}

.no-tokens .wrapper {
    white-space: nowrap;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;

}
.doge-menu-brand-collab .enlarge-qr #main-menu-content.show {
    transform: translate(-50%,calc( -50% + 67px )) scale(1);
}
#page:not(.enlarge-qr) #brand-collab-qr-div .item-desc {
	margin-top:30px;
    height: unset;
    position: absolute;
    top: calc(var(--vh, 1vh) * 50 );
    transform: translateY(-100%);
    z-index: 1;
}

}
#brand-collab-qr-div .item-desc .message {
	margin:0;
	text-transform:uppercase;
	font-size:16px;
	line-height:1.2;
}
#brand-collab-qr-div .item-desc .message-2 {
	font-size: 20px;
    letter-spacing: 1px;
    background-image: url(../../img/cny2023/btn-gradient-1.png);
    background-clip: text;
    -webkit-background-clip: text;
    color: rgba(255, 255, 255, 0.01);
    background-size: 250px 30px;
    filter: brightness(1) drop-shadow(0px 0px 3px rgba(0,0,0,0));
    background-position: 50% 50%;
    background-repeat: no-repeat;
    font-weight: 700;
    margin-top: 20px;
}
#brand-collab-qr-div .item-desc .item-type {    
    border-radius: 12px;
    letter-spacing: normal;    
    font-size: 16px;
    margin: 15px 0;
    width: 100%;
    padding: 0;
}


#page:not(.enlarge-qr) #brand-collab-qr-div .item-number {
	display:none;
}
#brand-collab-qr-div .item-desc .item-type span {
	background-color: #000;
    width: 300px;
    height: 100%;
    display: block;
    padding: 17px 30px;
    border-radius: 12px;
    border: 0;
    line-height: 1.2;
    background-clip: padding-box;
    border: 2px solid transparent;
}

#qr-hunt-div #item-balance {
	width: 100%;
    position: absolute;
    top: calc( var(--vh, 1vh) * 50 );
    transform: translateY( calc( -100% - 50px) );
	display:none;
}
#qr-hunt-div {
	position: relative;
    width: 300px;
    /* height: calc(var(--vh, 1vh) * 100 ); */
}
.item.qr_hunt {
	transition:transform .3s linear;
	position:absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0.3);
	width: 300px;
	height: 200px;
	perspective: 1000px;
  
}

.item.qr_hunt .hint-number {
	font-size: 1.3em;
}
.item.qr_hunt p {
	margin: 0;
    text-transform: uppercase;
    line-height: 1.2;
    font-size: 15px;
    font-weight: 400;
}
#qr-hunt-div .hint-btn {
	text-transform:uppercase;
	width:160px;
	background-size: cover;
}
.item.qr_hunt .inner-wrapper {
	width: 300px;
    height: 450px;
    transition: transform 0.3s linear;
    transform-style: preserve-3d;
	transform: translateY(-63px);
}
.item.qr_hunt.enlarged .inner-wrapper {
  transform: rotateY(180deg);
}

.item.qr_hunt .inner-wrapper .front,
.item.qr_hunt .inner-wrapper .back {
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 300px;
    height: 450px;
    position: absolute;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 20px;
	z-index:1;
}

.item.qr_hunt .inner-wrapper .back-inner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    width: calc( 100% - 8px );
    height: calc( 100% - 8px );
    border: 8px solid #000;
    background-color: #1a1a1a;
    padding: 30px 20px;
    border-radius: 20px;
}
.item.qr_hunt .inner-wrapper .front {
	background-color:#000;
	border: 6px solid #fff;
}
.item.qr_hunt .inner-wrapper .part-2 {
	width: 100%;
    height: 100%;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    padding: 15px;
}
.item.qr_hunt .part-2:before {
    content:"";
    z-index: 4;
    border-radius: 11px;
    position:absolute;
    top:0;left:0;bottom:0;right:0;
}

.item.qr_hunt-status-scanned .inner-wrapper .front {
	border-color:#555;
}
.item.qr_hunt-status-invalid .inner-wrapper .front {
	border-color:#000;
}

.item.qr_hunt-status-valid .part-2:before {
	background-color: rgba(255,255,255,0.2);
}
.item.qr_hunt-status-won .part-2:before,
.item.qr_hunt-status-scanned .part-2:before {
	background-color: rgba(0,0,0,0.7);
}

.item.qr_hunt-status-invalid .part-2:before {
	background-color: #000;
}

.item.qr_hunt:not(.qr_hunt-status-valid) .hint-btn {
	/* z-index:-1; */
    /* visibility:hidden; */
    opacity:0.12;
}
#qr-hunt-div .item .inner-wrapper .back {
	transform: rotateY(180deg);
}
.item-1.qr_hunt {
	transform: translate(calc( -50% - 103px ),calc( -50% - 73px )) scale(0.3);
}
.item-2.qr_hunt {
	transform: translate(calc( -50% ),calc( -50% - 73px )) scale(0.3);
}
.item-3.qr_hunt {
	transform: translate(calc( -50% + 103px ),calc( -50% - 73px )) scale(0.3);
}
.item-4.qr_hunt {
	transform: translate(calc( -50% - 50px ),calc( -50% + 73px )) scale(0.3);
}
.item-5.qr_hunt {
	transform: translate(calc( -50% + 50px ),calc( -50% + 73px )) scale(0.3);
}


.enlarged-hint div#main-menu-content:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: rgba(0,0,0,0.5);
    height: calc(var(--vh, 1vh) * 100 );
    width: calc(var(--vw, 1vw) * 100 );
    transform: translate(-50%,-50%);
    z-index: 1;
	max-width: 800px;
	max-height: 800px;
}
.animating-hint #main-menu-content,
.enlarged-hint #main-menu-content {
	z-index:20;
}



#qr-hunt-div .item.animating,
#qr-hunt-div .item.enlarged {
	z-index:3;
}
#qr-hunt-div .item.enlarged {
	transform: translate(-50%,calc( -50% - 125px )) scale(1) !important;
	
}

#qr-hunt-div .front:after,
#qr-hunt-div .front:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 20px;
    z-index: 1;
    
}
#qr-hunt-div .back:hover,
#qr-hunt-div .front:hover {
	cursor:pointer;
}

@media(min-height:800px) {
	#qr-hunt-div #item-balance,
	#page:not(.enlarge-qr) #brand-collab-qr-div .item-desc {
		top: 400px;
	}
}

#main-menu-logo-div.menu2:hover {
	cursor:pointer;
}

.not-local #qr-hunt-div {
	/* z-index:-1; */
	/* opacity:0; */
	/* visibility:hidden; */
}

#doge-scanner {
	    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    height: calc( (var(--vh, 1vh) * 100));
    width: calc( (var(--vw, 1vw) * 100));
    z-index: 3;
    background-color: #000;
	min-height:450px;
	/* padding-bottom:88px; */
}
#video-container {
	position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
	/* transform: translate(-50%, calc( -50% - 44px )); */
    z-index: 3;
    background-color: #000;
	/* height: calc(var(--vh, 1vh) * 100 );	     */
    display: flex;
    justify-content: center;
    align-items: center;
	margin:0;
}

#doge-scanner .bot-menu .controls {
	width:400px;
	margin-left: auto;
    margin-right: auto;
	max-width: calc(var(--vw, 1vw) * 100 - 30px )
	
}
#qr-video {
	min-width: 300px;
    min-height: 300px;
}
@media (orientation:landscape) and (max-height: 550px) and (min-width:600px) and (max-width:1000px) {
	#doge-scanner {
		/* max-width: 400px; */
		width: calc( (var(--vh, 1vh) * 100));
		height: calc( (var(--vw, 1vw) * 100));
	}
	#video-container {
		/* height: calc(var(--vw, 1vw) * 100 ); */
	}
	.bot-menu .controls select {
		max-width: calc(var(--vh, 1vh) * 100 - 176px )
	}
	
	#qr-video,
	#doge-scanner .bot-menu .controls {	
		max-width: calc( var(--vh, 1vh) * 100 - 30px );
	}
}

#back-btn-div {
    border-radius: 12px;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 13px;
    /* transform: translate(calc( -50% - 113px ) , 0% ); */
    top: 16px;
    z-index: 19;
    display: none;
}

.item-selected #back-btn-div {
	display: inline-flex;
}

#back-btn-div > div {
	background: none;
    padding: 2px;
    border-radius: 12px;
}
#back-btn {
	padding:0;
	background: none;
	width: 54px;
    height: 54px;
}


#back-btn span {
	text-transform: uppercase;
    font-weight: 500;
    text-align: center;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -0.1em;
}
.btn-wrapper-outer.drink-tokens,
.btn-wrapper-outer.brand-collab,
.btn-wrapper-outer.qr-hunt {
	/* visibility: hidden; */
    /* display: none; */
}


.item-qr {
	width:300px;
	height:300px;
}

