@font-face {
	font-family: antonSCRegular;
	src: url('../../fonts/AntonSC-Regular.ttf');
}
@font-face {
	font-family: timesNewRomanRegular;
	src: url('../../fonts/TimesNewRoman-Regular.ttf');
}
@font-face {
	font-family: cormorantBold;
	src: url('../../fonts/Cormorant-Bold.ttf');
}
@font-face {
	font-family: poppinsRegular;
	src: url('../../fonts/Poppins-Regular.ttf');
}
@font-face {
	font-family: poppinsSemiBold;
	src: url('../../fonts/Poppins-SemiBold.ttf');
}
@font-face {
	font-family: poppinsBold;
	src: url('../../fonts/Poppins-Bold.ttf');
}
@font-face {
	font-family: robotoLight;
	src: url('../../fonts/Roboto-Light.ttf');
}
@font-face {
	font-family: robotoCondensedRegular;
	src: url('../../fonts/Roboto_Condensed-Regular.ttf');
}
@font-face {
	font-family: robotoBlack;
	src: url('../../fonts/Roboto-Black.ttf');
}
@font-face {
	font-family: robotoExtraLight;
	src: url('../../fonts/Roboto-ExtraLight.ttf');
}
@font-face {
	font-family: robotoMedium;
	src: url('../../fonts/Roboto-Medium.ttf');
}
@font-face {
	font-family: robotoRegular;
	src: url('../../fonts/Roboto-Regular.ttf');
}
@font-face {
	font-family: robotoCondensedSemiBold;
	src: url('../../fonts/Roboto_Condensed-SemiBold.ttf');
}
@font-face {
	font-family: robotoCondensedExtraBold;
	src: url('../../fonts/Roboto_Condensed-ExtraBold.ttf');
}
@font-face {
	font-family: robotoSemiBold;
	src: url('../../fonts/Roboto-SemiBold.ttf');
}
@font-face {
	font-family: robotoBold;
	src: url('../../fonts/Roboto-Bold.ttf');
}


*,
*::before,
*::after
{
  -ms-overflow-style: none;
  scrollbar-width: none;
}

*::-webkit-scrollbar
{
  display: none;
}

html
{
	--themeDarkBlue: #101928;
	--themeLightBlue0: #6c97bf;
	--themeLightBlue1: #1f4483;
	--themeDarkGreen: #036B26;
	--themeLightGreen: #8AC53E;
	--themeDarkOrange: #B96000;
	--themeLightOrange: #FFD043;
	--themeGrey: #737373;
	--themeLightGrey: #7373736e;
	--themeWhite: #fff;
	--themeYellow: #FFA500;
	--themeGreen: #036B26;
}

a
{
	text-decoration: none;
	transition: 0.4s;
}
a:link
{
	color: #000;
	text-decoration: none;
}
a:visited
{
	color: #000;
	text-decoration: none;
}
a:hover
{
	color: #000;
	text-decoration: none;
}
a:active
{
	color: #000;
	text-decoration: none;
}

body
{
	width: 100vw;
	font-size: 14px;
	font-family: poppinsRegular, sans-serif;
	color: var(--themeWhite);
}

.processingOverlay
{
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 3000;
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	gap: 10px;
	background-color: #55555591;
	display: none;
	visibility: hidden;
}
#processingOverlayText
{
	font-family: robotoBold, sans-serif;
	color: #fff;
	font-size: 20px;
}

.indexBodyBox
{
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	align-items: center;
}
.loginHeader
{
	width: 100%;
	padding: 5px;
	font-family: robotoBold, sans-serif;
	font-size: 20px;
	background-color: #00000050;
	color: var(--themeGreen);
	text-align: center;

	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
	padding: 10px;
	padding-left: 20px;
	padding-right: 20px;
}
.ticketingLoginHeaderImg
{
	width: 60px;
	height: 60px;
	background-image: url(../../img/sakrebailuLogo.png);
	background-size: cover;
	background-repeat: no-repeat;
	filter: drop-shadow(1px 0px 0px #fff);
}
.ticketingLoginHeaderText
{
	flex-grow: 1;
	font-family: robotoBold, sans-serif;
	font-size: 20px;
	text-transform: uppercase;
	color: var(--themeGreen);
}

.loginFooter
{
	width: 100%;
	padding: 5px;
	font-family: robotoBold, sans-serif;
	font-size: 16px;
	background-color: var(--themeDarkBlue);
	color: var(--themeWhite);
	text-align: center;
}
.loginBox
{
	font-family: robotoRegular, sans-serif;
	width: 30vw;
	padding: 10px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
	border-radius: 5px;
	background-color: #ffffff;
	border: 1px solid var(--themeGreen);
	color: var(--themeGreen);
}
.loginBoxInputBox
{
	width: 100%;
	border: 1px solid var(--themeLightBlue0);
	border-radius: 3px;
	padding: 10px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 5px;
}
.loginBoxLabel
{

}
.loginBoxInput
{
	width: 100%;
	border: 1px solid var(--themeGreen);
	padding: 3px;
	border-radius: 3px;
}
.loginBtn
{
	width: 100%;
	padding: 5px;
	background-color: var(--themeGreen);
	color: #fff;
	font-family: robotoMedium;
	text-align: center;
	border-radius: 3px;
	cursor: pointer;
	transition: 0.2s;
}
.loginBtn:hover
{
	background-color: #036b2696;
	color: #000;
}

.loginBoxGenOTPBtn
{
	font-family: robotoMedium, sans-serif;
	width: 100%;
	text-align: center;
	padding: 5px;
	border-radius: 3px;
	border: 2px solid var(--themeYellow);
	background-color: var(--themeYellow);
	color: #000;
	margin-top: 10px;
	transition: 0.2s;
	cursor: pointer;
}
.loginBoxGenOTPBtn:hover
{
	background-color: #ffa50033;
}

.loginStatusBox
{
	min-height: 30px;
	font-family: robotoRegular, sans-serif;
	font-size: 13px;
	color: #000;
	border: 1px solid #00000033;
	width: 100%;
	padding: 3px;
	margin-top: 10px;
	text-align: center;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.ticketingBodyBox
{
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: center;
}
.ticketingMenuBox
{
	width: 20vw;
	height: 100vh;
	background-color: var(--themeDarkBlue);
	color: var(--themeWhite);
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	align-items: center;
	padding: 10px;
}
.ticketingMenuBoxToggleBtn
{
	position: fixed;
	left: 20vw;
	top: 100px;
	padding: 0px;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 15px;
	transform: translateX(-100%);
	background-color: var(--themeLightBlue1);
	border-radius: 0px;
	border-top-left-radius: 70%;
	border-bottom-left-radius: 70%;
	height: 50px;
	width: 15px;
	color: #fff;
	border: 1px solid #ffffff47;
}
.ticketingMenuBoxToggleBtn:hover
{
	color: #fff;
	box-shadow: 0px 0px 2px 1px #ffffff47;
}

.ticketingMenuBoxHeader
{
	display: flex;
	flex-flow: row;
	/*justify-content: flex-start;*/
	justify-content: center;
	align-items: center;
	gap: 10px;
	padding-top: 13px;
	padding-bottom: 10px;
}
.ticketingMenuBoxHeaderBold
{
	font-family: poppinsBold, sans-serif;
	color: var(--themeWhite);
	font-size: 14px;
}
.ticketingMenuBoxHeaderLight
{
	font-family: poppinsLight, sans-serif;
	color: var(--themeWhite);
	font-size: 10px;
	letter-spacing: 3px;
}
.ticketingMenuBoxBody
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: 10px;
	flex-grow: 1;
}
.ticketingMenuBoxBodyOperationListBox
{
	color: var(--themeWhite);
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	padding-top: 50px;
}
.ticketingMenuBoxBodyOperationListBoxItem
{
	padding: 10px;
	border-radius: 3px;
	width: 100%;
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
	cursor: pointer;
}
.ticketingMenuBoxBodyOperationListBoxItem:hover
{
	background-color: #1D2739;
}
.ticketingMenuBoxBodyOperationListBoxItemText
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
}
.ticketingMenuBoxBodyMsgBox
{
	background: linear-gradient(43.31deg, rgba(15, 22, 36, 0) 2.65%, #0640B5 125.88%);
	padding: 15px;
	border-radius: 5px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 5px;
}
.ticketingMenuBoxBodyMsgBoxHeading
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 15px;
	text-transform: uppercase;
	color: var(--themeWhite);
}
.ticketingMenuBoxBodyMsgBoxBody
{
	color: var(--themeWhite);
	text-align: justify;
	font-size: 12px;
}
.ticketingMenuBoxBodyMsgBoxFooter
{
	padding-top: 10px;
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
}
.ticketingMenuBoxBodyMsgBoxNavBox
{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketingMenuBoxBodyMsgBoxCloseBtn, .ticketingMenuBoxBodyMsgBoxNextBtn, .ticketingMenuBoxBodyMsgBoxPrevBtn
{
	color: #98A2B3;
	cursor: pointer;
}
.ticketingMenuBoxBodyMsgBoxCloseBtn:hover, .ticketingMenuBoxBodyMsgBoxNextBtn:hover, .ticketingMenuBoxBodyMsgBoxPrevBtn:hover
{
	color: #fff;
	/*color: #cde2f09e;*/
}
.ticketingMenuBoxFooter
{
	width: 100%;
	border-top: 1px solid #1D2739;
	padding-top: 30px;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}
.ticketingMenuBoxFooterPic
{
	width: 60px;
	height: 60px;
	border: 1px solid var(--themeWhite);
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.ticketingMenuBoxFooterTextBox
{
	flex-grow: 1;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
}
.ticketingMenuBoxFooterTextBoxName
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
}
.ticketingMenuBoxFooterTextBoxMobile
{
	font-size: 12px;
}
.ticketingMenuBoxFooterLogoutBtn
{
	padding: 3px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 2px;
	cursor: pointer;
	font-size: 20px;
}
.ticketingMenuBoxFooterLogoutBtn:hover
{
	background-color: #1D2739;
}

.menuTargetBoxes
{
	height: 100vh;
	flex-grow: 1;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
}

.ticketingOperationBox
{
	height: 100vh;
	width: 100%;
	padding: 20px;
	/*padding-top: 0px;*/
	background-color: var(--themeWhite);
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
}
.ticketingOperationBoxHeader
{
	width: 100%;
	padding: 20px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 10px;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
	background-color: var(--themeWhite);
	color: var(--themeGrey);
	border-bottom: 1px solid #00000033;
}
.ticketingOperationBoxHeaderWelcome
{
	font-family: poppinsBold, sans-serif;
}
.ticketingOperationBoxHeaderTimestamp
{
	font-family: poppinsBold, sans-serif;
}
.ticketingOperationBoxBody
{
	width: 100%;
	height: 100%;
	/*padding-top: 17px;*/
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 10px;
}
.ticketingOperationBoxBodyFunction
{
	width: 65%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 20px;
	overflow-y: scroll;
}
.ticketingOperationBoxBodyPreview
{
	flex-grow: 1;
	height: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 5px;
}
.ticketingOperationBoxBodyPreviewHeading
{
	background-color: var(--themeDarkBlue);
	padding: 5px;
	border-radius: 5px;
	color: #fff;
	font-family: poppinsSemiBold, sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	width: 100%;
	text-align: center;
	/*font-family: poppinsMedium, sans-serif;*/
}
.ticketingOperationBoxBodyPreviewBody
{
	width: 100%;
	height: 100%;
	flex-grow: 1;
	border-radius: 5px;
	background-color: var(--themeWhite);
	border: 1px solid #0000001F;
	padding: 10px;
	overflow-y: scroll;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}
.paymentModeBox
{
	width: 100%;
	padding: 10px;
	padding-left: 0px;
	padding-right: 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
}
.paymentModeBoxBtn
{
	/*background-color: var(--themeDarkBlue);*/
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	color: #fff;
	width: 120px;
	flex-grow: 1;
	height: 60px;
}
.paymentModeBoxBtn:hover
{
	color: #fff;
	box-shadow: 0px 0px 2px 1px #000;
}
.ticketingOperationBoxBodyPreviewBodyTicket
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
	background-color: #F7F7F7;
}
.ticketingOperationBoxBodyPreviewBodyTicketInner
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
}
.ticketingOperationBoxBodyPreviewBodyTicketHeader
{
	width: 100%;
	display: flex;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	gap: 10px;
}
.ticketingOperationBoxBodyPreviewBodyTicketHeaderTextBox
{
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
}
.ticketingOperationBoxBodyPreviewBodyTicketHeaderTextBoxTop
{
	font-family: robotoMedium, sans-serif;
	font-size: 20px;
	letter-spacing: 3px;
	color: #000;
	line-height: 17px;
}
.ticketingOperationBoxBodyPreviewBodyTicketHeaderTextBoxBottom
{
	font-family: robotoRegular, sans-serif;
	font-size: 12px;
	letter-spacing: 3px;
	color: #000;
}
.ticketingDeactivatedItemsBox, .ticketingActivatedItemsBox
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 5px;
}
.ticketingDeactivatedItemsBoxHeading, .ticketingActivatedItemsBoxHeading
{
	background-color: var(--themeDarkBlue);
	color: #fff;
	border-radius: 5px;
	padding: 5px;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	width: 100%;
	text-align: center;
	/*font-family: poppinsMedium, sans-serif;*/
}
.ticketingDeactivatedItemsBoxHeadingIcon
{
	color: #fff;
	font-size: 15px;
	width: 30px;
	height: 30px;
	background-color: var(--themeGrey);
	border-radius: 3px;
	text-align: center;
	padding-left: 4px;
	padding-right: 4px;
	cursor: pointer;
	transition: 0.2s;
}
.ticketingDeactivatedItemsBoxHeadingIcon:hover
{
	box-shadow: 0px 0px 2px 1px var(--themeGrey);
}
.ticketingDeactivatedItemsBoxBody, .ticketingActivatedItemsBoxBody
{
	width: 100%;
	/*box-shadow: 0px 4px 12.5px 0px #00000030;*/
	border: 1px solid #0000001F;
	border-radius: 5px;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
}
.ticketingDeactivatedItemsBoxBodyInner, .ticketingActivatedItemsBoxBodyInner
{
	width: 100%;
	padding: 12px;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	align-items: center;
	gap: 20px;
}
.ticketingDeactivatedItemsBoxBodyItem, .ticketingActivatedItemsBoxBodyItem
{
	border-radius: 5px;
	border: 2px solid var(--themeWhite);
	width: 180px;
	height: 120px;
	padding: 15px;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	align-items: center;
	gap: 5px;
	cursor: pointer;
	transition: 0.2s;
}

.ticketingDeactivatedItemsBoxBodyItemIcon, .ticketingActivatedItemsBoxBodyItemIcon
{
	font-size: 30px;
	padding: 5px;
	border-radius: 3px;
	background-color: #ffffff29;
}
.ticketingDeactivatedItemsBoxBodyItemDesc, .ticketingActivatedItemsBoxBodyItemDesc
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
}
.ticketingDeactivatedItemsBoxBodyItemActivateBtn, .ticketingActivatedItemsBoxBodyItemActivateBtn
{
	font-family: poppinsLight, sans-serif;
	font-size: 10px;
	color: #fff;
	cursor: pointer;
	padding: 5px;
	padding-left: 15px;
	padding-right: 15px;
	border-radius: 3px;
	background-color: #ffffff75;
	color: #000;
}
.ticketingDeactivatedItemsBoxBodyItemActivateBtn:hover, .ticketingActivatedItemsBoxBodyItemActivateBtn:hover
{
	background-color: #ffffffa8;
}
.ticketingItemsBoxBodyItemGrey
{
	background-color: var(--themeGrey);
}
.ticketingItemsBoxBodyItemGreen
{
	background-color: var(--themeDarkGreen);
}
.ticketingItemsBoxBodyItemBlue
{
	background-color: var(--themeLightBlue1);
}
.ticketingItemsBoxBodyItemOrange
{
	background-color: var(--themeDarkOrange);
}

.ticketingBillModBox
{
	width: 100%;
	color: #000;
}
.ticketingBillModBoxItem
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketingBillModBoxHeading
{
	/*padding-left: 5px;*/
	/*padding-right: 5px;*/
	width: 100%;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
}
.ticketingBillModBoxHeadingText
{
	font-family: poppinsSemiBold, sans-serif;
	text-transform: uppercase;
}
.ticketingBillModBoxHeadingCountryBtnBox
{
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
	gap: 5px;
}
.ticketingBillModBoxHeadingCountryBtn
{
	width: 100px;
	cursor: pointer;
	text-align: center;
	padding: 5px;
	padding-left: 15px;
	padding-right: 15px;
	font-family: poppinsSemiBold, sans-serif;
	text-transform: uppercase;
	border-radius: 3px;
	transition: 0.2s;
	font-size: 12px;
}
.ticketingBillModBoxHeadingCountryBtn:hover
{
	box-shadow: 0px 0px 3px 1px #00000068;
}
.ticketingBillModBoxBody
{
	width: 100%;
	border-radius: 5px;
	padding: 15px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 5px;
}
.ticketingBillModBoxBodyIndian, .ticketingBillModBoxBodyForeigner
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 5px;
}
.ticketingBillModBoxBodyItem
{
	width: 100%;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 3px;
}
.ticketingBillModBoxBodyItemDesc
{
	color: #000;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
}
.ticketingBillModBoxBodyItemCountBox
{
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
	gap: 5px;
}
.ticketingBillModBoxBodyItemCountBoxBtn
{
	color: #fff;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 16px;
	height: 40px;
	width: 40px;
	text-align: center;
	border-radius: 3px;
	cursor: pointer;
	transition: 0.1s;
}
.ticketingBillModBoxBodyItemCountBoxBtn:hover
{
	color: #fff;
	box-shadow: 0px 0px 3px 1px #00000068;
}
.ticketingBillModBoxBodyItemCountBoxVal
{
	height: 40px;
	border-radius: 3px;
	text-align: center;
	width: 50px;
	text-align: center;
	background-color: transparent;
	border: none;
	font-family: poppinsSemiBold, sans-serif;
	border: 1px solid #0000004d;
}
.ticketingOperationBoxBodyPreviewBodyTicketHeaderImg
{
	height: 70px;
	width: 40px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.ticketingOperationBoxBodyPreviewBodyTicketParticulars
{
	width: 100%;
	padding: 20px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	/*gap: 5px;*/
	color: #000;
}
.ticketingPreviewRefNum, .ticketingPreviewDateTime
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	width: 100%;
	text-align: left;
}
.ticketingPreviewDateTime
{
	padding-bottom: 5px;
}
.ticketingPreviewParticularsBox
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
}
.ticketingPreviewParticularsBoxHeading, .ticketingPreviewParticularsBoxBodyEntry
{
	width: 100%;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: flex-start;
}
.ticketingPreviewParticularsBoxBodyEntry
{
	font-family: poppinsRegular, sans-serif;
}
.ticketingPreviewParticularsBoxHeadingColParticulars, .ticketingPreviewParticularsBoxBodyEntryColParticulars
{
	width: 50%;
}
.ticketingPreviewParticularsBoxHeadingColRate, .ticketingPreviewParticularsBoxHeadingColQty, .ticketingPreviewParticularsBoxBodyEntryColRate, .ticketingPreviewParticularsBoxBodyEntryColQty
{
	width: 16%;
}
.ticketingPreviewParticularsBoxHeadingColAmount, .ticketingPreviewParticularsBoxBodyEntryColAmount
{
	width: 18%;
}
.ticketingPreviewTotalBox
{
	width: 100%;
	font-family: poppinsBold, sans-serif;
	font-size: 12px;
	color: #000;
	display: flex;
	flex-flow: row;
	justify-content: flex-end;
	align-items: center;
}
.ticketingPreviewTotalBoxText
{
	flex-grow: 1;
	text-align: left;
}
.ticketingPreviewTotalBoxVal
{
	width: 18%;
	text-align: left;
}

.ticketingPreviewVerificationQRBox
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketingPreviewVerificationQRBoxHeading
{
	font-family: poppinsSemiBold, sans-serif;
	color: #000;
	font-size: 12px;
	text-transform: uppercase;
}
.ticketingPreviewVerificationQRBoxImg
{
	width: 100px;
	height: 100px;
	background-image: url('../img/ticketPreviewQR.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.ticketingPreviewFooterThanksText
{
	font-size: 12px;
}
.ticketingPreviewFooter
{
	font-family: poppinsSemiBold, sans-serif;
	color: #000;
	font-size: 10px;
	text-transform: uppercase;
	padding: 10px;

	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
}
.ticketingPreviewFooterMoreInfoText
{
	padding-top: 20px;
	font-family: poppinsRegular, sans-serif;
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	font-size: 10px;
}
.ticketingPreviewFooterMoreInfoLink
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 10px;
}
.ticketingPreviewFooterContactBox
{
	font-size: 10px;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
}
.ticketingPreviewFooterContactBoxNumber, .ticketingPreviewFooterContactBoxEmail
{
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
}
.ticketingPreviewFooterContactBoxNumberText, .ticketingPreviewFooterContactBoxEmailText
{
	font-family: poppinsRegular, sans-serif;
}

.tkFooter
{
	padding: 10px;
	margin-top: 20px;
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 5px;
	background-color: #00000000;
	color: #fff;
	font-family: robotoLight, sans-serif;
	font-size: 12px;
	background-color: #00000078;
}
.tkFooterRight
{
	display: flex;
	flex-flow: row;
	justify-content: flex-end;
	align-items: center;
}
.tkFooterElement
{
	color: #fff;
	border-right: 1px solid #fff;
	padding: 0px;
	padding-left: 10px;
	padding-right: 10px;
	cursor: pointer;
	text-align: center;
}
.tkFooterElement:hover
{
	color: var(--themeYellow);
}
.tkFooterElementNoBorder
{
	border: none;
}
.tkFooterLeft
{
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
}

.dot:nth-child(1) { animation-delay: 0s; }
.dot:nth-child(2) { animation-delay: 0.2s; }
.dot:nth-child(3) { animation-delay: 0.4s; }

.customDotColor
{
	color: #555;
	width: 5px;
	height: 5px;
}

.customDotColorWhite
{
	color: #fff;
	width: 8px;
	height: 8px;
}

.ticketingPreviewParticularsBoxBodyEntryCatWrapper
{
	padding-top: 5px;
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
}
.ticketingPreviewParticularsBoxBodyEntryCatWrapperHeading
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	color: #000;
	text-align: left;
	text-transform: uppercase;
}
.ticketingPreviewParticularsBoxBodyEntryCatWrapperBody
{
	width: 100%;
}
.ticketingActivatedItemsBoxBodyVisitorNumber
{
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-end;
	align-items: center;
	gap: 10px;
	border: 1px solid #00000029;
	border-radius: 5px;
	padding: 5px;
	background-color: #00000029;
}
.ticketingActivatedItemsBoxBodyVisitorNumberLabel
{
	color: #000;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
}
#ticketingActivatedItemsBoxBodyVisitorNumberInput
{
	border: none;
}
.vProfileNavbar
{
	width: 100vw;
	padding: 6px;
	padding-left: 10px;
	padding-right: 10px;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	background-color: #00000026;
}
.vProfileNavbarLeft
{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.vProfileNavbarLogo
{
	border: 1px solid #11101036;
	border-radius: 2px;
	background-color: #0000002e;
	width: 50px;
	height: 50px;
	background-image: url(../../img/sakrebailuLogo.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.vProfileNavbarDetailBox
{
	color: #000;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
}
.vProfileNavbarUserDetailName
{
	font-family: poppinsSemiBold, sans-serif;
	text-transform: uppercase;
	font-size: 14px;
}
.vProfileNavbarUserDetailVPointDetail
{
	font-family: poppinsRegular, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
}
.vProfileNavbarLogoutBtn
{
	border-radius: 3px;
	border: none;
	border: 1px solid #1211113d;
	color: #af0314;
	background-color: #0000004a;
	text-align: center;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 20px;
	text-transform: uppercase;
}
.logoutModalBodyBox
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.logoutModalBodyBoxHeading
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	color: #000;
	text-transform: uppercase;
}
.logoutModalBodyBoxBody
{
	padding: 10px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 20px;
}
.logoutModalBodyBoxBodyBtn
{
	width: 100px;
}
.vProfileBodyBox
{
	width: 100%;
	padding: 20px;
	padding-top: 20px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketRefIDBox
{
	width: 100%;
	max-width: 500px;
	padding: 10px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketRefIDBoxHeading
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	color: #000;
}
#ticketRefIDInput
{
	width: 100%;
	text-align: center;
	border: none;
	border: 1px solid #0000003d;
	border-radius: 2px;
	height: 30px;
}
.ticketRefIDBoxOperations
{
	width: 100%;
	padding: 5px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
}
.ticketRefIDBoxOperationBtn
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	width: 150px;
	padding: 5px;
	border: none;
	border: 1px solid #0000003d;
}
#qr-reader
{
	width: 250px;
	/*height: 250px;*/
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketScanBox
{
	padding: 5px;
	border: 1px solid #0000003d;
	border-radius: 2px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
}
.ticketVerificationDataBox
{
	width: 100%;
	padding: 10px;
	border: 1px solid #0000003d;
	border-radius: 2px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
	gap: 10px;
}
.ticketDataBox
{
	width: 100%;
	border-radius: 2px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 10px;
}
.ticketDataBoxItem
{
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
}
.ticketDataBoxItemHeading
{
	width: 100%;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	color: #000;
	padding: 3px;
	padding-left: 10px;
	border: 1px solid #0000003d;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	background-color: #0000004a;
}
.ticketDataBoxItemBody
{
	width: 100%;
	padding: 5px;
	border: 1px solid #0000003d;
	border-top: none;
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 5px;
}
.ticketDataBoxSubCatItem
{
	width: 100%;
	padding: 5px;
	padding-left: 8px;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	color: #000;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	background-color: #00000026;
	border: 1px solid #0000003d;
	border-radius: 2px;
}
.ticketDataBoxSubCatItemOperations
{
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	align-items: center;
	gap: 5px;
}
.ticketDataBoxSubCatItemMinusOperation
{
	width: 36px;
	padding: 5px;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	border-radius: 2px;
}
.ticketDataBoxSubCatItemCountInput
{
	padding: 5px;
	width: 60px;
	border: 1px solid #0000003d;
	border-radius: 2px;
}
.ticketDataBoxSubCatItemClearOperation
{
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-radius: 2px;
}
.ticketVerificationDataBoxOperationsBox
{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
}
.ticketVerificationDataBoxClearAllBtn, .ticketVerificationDataBoxUpdateBtn
{
	width: 150px;
	padding: 5px;
	padding-left: 20px;
	padding-right: 20px;
	font-family: poppinsSemiBold, sans-serif;
	font-size: 14px;
}




























@media all and (max-width: 400px)
{
	.tkFooter
	{
		flex-flow: column;
		gap: 3px;
	}
	.tkFooterElement
	{
		padding-left: 5px;
		padding-right: 5px;
	}
	.tkFooterLeft
	{
		flex-flow: column;
	}
	.loginBox
	{
		width: 40vw;
	}
}
@media all and (max-width: 750px)
{
	.ticketingLoginHeaderText
	{
		font-size: 18px;
	}
	.loginHeader
	{
		flex-flow: column;
		gap: 0px;
	}
	.ticketingLoginHeaderImg
	{
		width: 50px;
		height: 50px;
		filter: drop-shadow(0px 0px 0px #fff);
	}
}
@media all and (max-width: 650px)
{
	.loginBox
	{
		width: 80vw;
	}
}
@media all and (max-width: 550px)
{
	.ticketingLoginHeaderText
	{
		font-size: 15px;
	}
	.ticketRefIDBoxOperationBtn
	{
		width: 120px;
	}
	.vProfileBodyBox
	{
		gap: 0px;
		padding-top: 10px;
	}
	.ticketVerificationDataBox
	{
		padding: 5px;
		gap: 5px;
	}
}