:root {
	--currentItem: 0;
	--currentItemWidth: 100px;
}

.clonerContainer {
	width: max-content !important;
	background: rgba(0, 0, 0, 0.4);
	backdrop-filter: var(--primary-blur);
	left: 50% !important;
	transform: translateX(-50%);
	border-radius: var(--primary-radius);
	z-index: auto;
}

.clonerContainer > .ggskin_cloner {
	width: max-content !important;
	position: relative !important;
	display: flex;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%);
	border-radius: var(--primary-radius);
	/* z-index: 2; */
}

div:has(> .clonerItem) {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

.clonerContainer .clonerItem {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

.clonerContainer div:has(> .clonerItem):not(:last-child)::after {
	content: "";
	width: 2px;
	height: 90%;
	background-color: #fff;
	position: absolute;
	top: 50%;
	right: 0px;
	transform: translate(0px, -50%);
}

.clonerContainer .clonerItem > div {
	display: flex;
	align-items: center;
	justify-content: center;
	white-space: break-spaces !important;
	border-radius: var(--primary-radius);
}

.clonerContainer .activeBackground {
	border-radius: var(--primary-radius);
	transition: left 200ms linear;
	position: absolute;
	top: 50% !important;
	transform: translateY(-50%);
	left: calc((var(--currentItemWidth) * var(--currentItem)) + 4px) !important;
}

.clonerContainer:has(div:has(> .activeTransition):last-child)
	.activeBackground {
	left: calc((var(--currentItemWidth) * var(--currentItem)) + 5px) !important;
}

.clonerContainer:has(
		.ggskin_cloner > div:last-child > .clonerItem.activeTransition
	)
	.activeBackground {
	left: calc((var(--currentItemWidth) * var(--currentItem)) + 5px) !important;
}


/* custom icon for category title */
.categoryCloner .categoryTitle:hover,
.categoryCloner.active .categoryTitle,
.subCategoryCloner .subCategoryTitle:hover,
.subCategoryCloner.active .subCategoryTitle {
	fill: #ffffff;
}


body {
    font-family: Lust-Text, Arial, sans-serif;
}

.menu_background .logoContainer{
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu_background .logoContainer svg {
    width: 100px;
    height: auto;
}

.menu_background .logoContainer svg path{
    fill: #ffffff;
}

.ggskin {
    font-family: Lust-Text, Arial, sans-serif !important;
    font-size: 16px !important;
}

.ht_flag .cntFlagInfo .flagContent > div {
    font-family: Area Normal, Arial, sans-serif;
    font-weight: 400 !important;
    font-size: 13px;
}

p[style*="font-weight: 400"],
div[style*="font-weight: 400"],
p[style*="font-weight: 500"],
div[style*="font-weight: 500"],
.ggskin[style*="font-weight: 500"],
.ggskin[style*="font-weight: 400"],
.ggskin[style*="font-weight: normal"],
.ggskin div[style*="font-weight: normal"],
strong,
.categoryCloner .nodeCloner .nodeContainer .nodeTitle,
b,
.customFont,
.swiper-pagination-custom,
.masterIconsContainer .next_prev_button.lableVisible,
.info_body {
    font-family: Area Normal !important;
}

.categoryTitle,
.splashScreenTitle > div,
.next_prev_button_title > div,
.pano_title > div {
    font-family: "Lust-Text" !important;
    font-weight: 500 !important;
}

.info_title > div {
    font-family: "Lust-Text" !important;
}

*/ h1,
h2,
h3,
h4 {
    font-family: "Lust-Text" !important;
    /* font-style: italic !important; */
}

h2.pop {
    font-family: "Lust-Text" !important;
    font-weight: 500 !important;
    /* font-style: italic !important; */
    font-size: 24px;
}

div.pop {
    font-family: "Area Normal" !important;
    font-size: 16px;
}


.pop {
    font-family: "Area Normal" !important;
    font-size: 16px;
}

button h3 {
    font-family: "Area Normal" !important;
    cursor: pointer;
}

.pop ul {
    margin: 0px;
}

/* Target the main container */
.Popup_Body {
    /* Firefox scrollbar styling */
    scrollbar-width: thin;
    /* makes scrollbar thinner */
    scrollbar-color: #888 #f1f1f1;
    /* thumb color + track color */
}

/* Apply the same to any inner element */
.Popup_Body * {
    scrollbar-width: thin;
    scrollbar-color: #888 #f1f1f1;
}

/* WebKit browsers (Chrome, Edge, Safari) */
.Popup_Body::-webkit-scrollbar,
.Popup_Body *::-webkit-scrollbar,
.info_body > div::-webkit-scrollbar {
    width: 6px;
    /* thin scrollbar width */
    height: 6px;
    /* thin horizontal scrollbar height */
}

.Popup_Body::-webkit-scrollbar-track,
.Popup_Body *::-webkit-scrollbar-track,
.info_body > div::-webkit-scrollbar-track {
    background: #f1f1f1;
    /* track color */
}

.Popup_Body::-webkit-scrollbar-thumb,
.Popup_Body *::-webkit-scrollbar-thumb,
.info_body > div::-webkit-scrollbar-thumb {
    background-color: #888;
    /* thumb color */
    border-radius: 3px;
    /* rounded corners */
}

/* Info Popup */
.Popup_Body ul {
    display: grid;
    gap: 5px;
    margin: 0;
}

.Popup_Body strong {
    margin-bottom: 10px;
}

.Popup_Body p {
    margin-bottom: -25px;
}

.td-1000 {
    transition-delay: 1s !important;
}

/* sub_popup */
/* sub_popup Transition*/
.sub_popup {
    transform: translateY(calc(-50% + 0px)) !important;
    transition: opacity 400ms, transform 400ms ease-out !important;
    visibility: visible !important;
}

.sub_popup.inactive {
    transform: translate(440px, calc(-50% + 0px)) !important;
}

.sub_popup > div {
    opacity: 0 !important;
    /* background: #00000099 !important; */
    /* backdrop-filter: var(--backdrop-filter-blur); */
    border-radius: 4px;
    transition: opacity 0.3s linear;
}

.sub_popup[style*="visibility: inherit"] > div,
.Pop_up_info {
    opacity: 1 !important;
}

.arrow-left > div {
    width: 0px !important;
    height: 0px !important;
    border-top: 7px solid transparent !important;
    border-bottom: 7px solid transparent !important;
    border-right: 15px solid #49261c !important;
}


@media (max-width : 400px) {
    .txt_description {
        font-size: 16px;
    }

    .txt_title {
        font-size: 20px !important;
    }
}

@media (max-width : 300px) {
    .txt_description {
        font-size: 10px;
    }

    .txt_title {
        font-size: 18px !important;
    }
}


@font-face {
    font-family: Lust-Text;
    src: url("fonts/fonnts.com-Lust-Text-Medium.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: Lust-Text;
    src: url("fonts/fonnts.com-Lust-Text-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Lust-Text;
    src: url("fonts/fonnts.com-Lust-Text-Medium.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Lust-Text;
    src: url("fonts/fonnts.com-Lust-Text-Medium.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: Lust-Text;
    src: url("fonts/fonnts.com-Lust-Text-Medium.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Area Normal;
    src: url("fonts/fonnts.com-Area_Normal_Regular.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Area Normal;
    src: url("fonts/fonnts.com-Area_Normal_Regular.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Area Normal;
    src: url("fonts/fonnts.com-Area_Normal_Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: Area Normal;
    src: url("fonts/fonnts.com-Area_Normal_Regular.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}