@media (min-width:1200px) {
	/* headerbottom menu */
	.container {
		max-width: 1440px;
	}

	.headerMenu ul {
		display: flex;
		flex-wrap: wrap;
		gap: 25px;
		justify-content: space-between;
		position: relative;
	}

		.headerMenu ul li a {
			color: var(--textColor);
			font-size: var(--Font-18);
			padding: 12px 0;
			font-weight: var(--Font-500);
		}

	.headerMenu > ul > li > a:first-child {
		padding-left: 0;
	}

	.headerMenu ul li li.hover > a {
		color: var(--whiteColor);
	}

	.headerMenu > ul > li.parent > a:after {
		content: "";
		width: 8px;
		height: 8px;
		display: inline-block;
		margin-left: 8px;
		border: 2px solid var(--primaryColor);
		border-top: none;
		border-right: none;
		transform: rotate(-45deg);
		top: -3px;
		position: relative;
		border-radius: 2px;
	}

	.headerMenu ul > li ul {
		margin-top: 0px;
		padding-left: 5px;
		position: absolute;
		top: 100%;
		left: 0;
		width: 300px;
		opacity: 0;
		visibility: hidden;
		top: calc(100% + 20px);
		transition: 0.3s all ease-in-out;
		background: linear-gradient(132deg, var(--c-login-1) 0%, var(--c-login-2) 100%);
		z-index: 9;
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
	}

		.headerMenu ul > li ul li:last-child a {
			border-bottom-left-radius: 10px;
			border-bottom-right-radius: 10px;
		}

	.headerMenu ul > li.hover > ul {
		opacity: 1;
		visibility: visible;
		top: calc(100% + 0px);
		gap: 0;
	}

	.headerMenu > ul > li {
		margin-right: 0px;
		overflow: hidden;
	}

		.headerMenu > ul > li:hover {
			overflow: visible;
		}

		.headerMenu > ul > li:last-child {
			margin-right: 0px;
		}

	.headerMenu ul > li ul li {
		width: 100%;
		margin: 0 10px;
	}

		.headerMenu ul > li ul li a {
			width: 100%;
			padding: 8px 0px;
			font-size: var(--Font-16);
			border-bottom: 1px solid #2d5b02;
			color: #fff;
			background: transparent;
		}

		.headerMenu ul > li ul li:last-child a {
			border-bottom: 1px solid transparent;
		}

		.headerMenu ul > li ul li > ul {
			left: 100%;
		}

	.headerMenu > ul > li > ul {
		left: -5px;
	}

	.headerMenu > ul > li:last-child > ul {
		left: auto;
		right: -5px;
	}

	.headerMenu ul > li ul li.hover > ul {
		top: 0%;
		margin-left: 9px;
		margin-top: -1px;
	}

	.headerMenu ul > li ul li.parent > a:after {
		content: "";
		width: 7px;
		height: 7px;
		display: inline-block;
		margin-left: 8px;
		border: 2px solid #fff;
		border-bottom: none;
		border-left: none;
		transform: rotate(45deg);
		position: absolute;
		right: 15px;
		top: 14px;
	}

	.parent-trigger {
		display: none;
	}

	/* Hide sidebar toggle on large screens */
	.sidebarToggle {
		display: none !important;
	}

	.sidebarHeader {
		display: none !important;
	}

	/* headerbottom mega menu */
	.headerMenu > ul > li.megaMenu {
		position: unset;
	}

		.headerMenu > ul > li.megaMenu ul {
			width: 100%;
			left: 0;
		}

		.headerMenu > ul > li.megaMenu > ul {
			padding: 0px 30px 0px;
			max-height: calc(100vh - 151px);
			overflow: auto;
			height: 0px;
			display: block;
			column-count: 4;
			column-gap: 30px;
			box-shadow: 0 10px 40px rgba(0,0,0,0.1);
			border-radius: 0;
		}

		.headerMenu > ul > li.megaMenu.hover > ul {
			height: auto;
			padding: 25px;
			background: #fff;
		}

		.headerMenu > ul > li.megaMenu ul li {
			width: 100%;
		}

		.headerMenu > ul > li.megaMenu > ul > li {
			width: 100%;
			display: block;
			border-bottom: none;
			padding-bottom: 0px;
			margin: 0px 0px 30px 0px;
			position: relative;
			break-inside: avoid;
			page-break-inside: avoid;
		}

			.headerMenu > ul > li.megaMenu > ul > li:last-child {
				border-bottom: none;
				padding-bottom: 0px;
				margin-bottom: 0px;
			}

			.headerMenu > ul > li.megaMenu > ul > li > a {
				font-weight: 500;
				font-size: var(--Font-20);
				border: 0;
				margin-bottom: 12px;
				display: block;
				background: transparent;
				color: var(--primaryColor);
				padding: 0;
			}

				.headerMenu > ul > li.megaMenu > ul > li > a[href=""] {
					pointer-events: none;
					cursor: auto;
				}

				.headerMenu > ul > li.megaMenu > ul > li > a:after {
					display: none !important;
				}

				.headerMenu > ul > li.megaMenu > ul > li > a:before {
					display: none;
				}

			.headerMenu > ul > li.megaMenu > ul > li > ul {
				box-shadow: none;
				position: relative;
				width: 100%;
				opacity: 1;
				visibility: visible;
				top: unset;
				left: unset;
				display: flex;
				flex-direction: column;
				background: transparent;
				gap: 12px;
				padding: 0;
				border: 0;
			}

				.headerMenu > ul > li.megaMenu > ul > li > ul > li {
					margin: 0px;
					width: 100%;
					padding-right: 0px;
				}

					.headerMenu > ul > li.megaMenu > ul > li > ul > li > a {
						border: none;
						padding: 0px;
						font-size: var(--Font-16);
						position: relative;
						background: transparent;
						font-weight: 400;
						display: block;
						transition: all 0.2s ease;
					}

						.headerMenu > ul > li.megaMenu > ul > li > ul > li > a::after {
							display: none;
						}

					.headerMenu > ul > li.megaMenu > ul > li > ul > li > ul > li:before {
						content: "";
						width: 6px;
						height: 6px;
						border-right: 1.6px solid var(--textColor);
						border-bottom: 1.6px solid var(--textColor);
						transform: rotate(-45deg);
						position: absolute;
						top: 9px;
						left: 0px;
					}

					.headerMenu > ul > li.megaMenu > ul > li > ul > li > ul {
						display: flex;
						flex-direction: column;
						gap: 6px;
						margin-top: 0px;
						padding-left: 10px;
						background: transparent;
						position: relative;
						opacity: 1;
						visibility: visible;
						border: 0;
						box-shadow: none;
					}

						.headerMenu > ul > li.megaMenu > ul > li > ul > li > ul > li {
							width: 100%;
							margin: 0;
							padding-left: 15px;
						}

							.headerMenu > ul > li.megaMenu > ul > li > ul > li > ul > li:first-child {
								margin-top: 10px;
							}

							.headerMenu > ul > li.megaMenu > ul > li > ul > li > ul > li > a {
								padding: 0px;
								font-size: var(--Font-14);
								font-weight: 400;
								border: none;
							}

								.headerMenu > ul > li.megaMenu > ul > li > ul > li > ul > li > a:before {
									width: 5px;
									height: 5px;
									top: 10px;
									left: 2px;
								}
	/* .headerMenu>ul>li.megaMenu>ul>li>ul>li.hover>a, .headerMenu>ul>li.megaMenu>ul>li>ul>li>ul>li.hover>a { background-color: transparent; color: var(--sttl-theme-pink); border: none; padding-left: 22px;} */
	.headerMenu ul > li.megaMenu ul li.hover > ul, .headerMenu ul > li.megaMenu ul li > ul li.hover > ul {
		margin: 0;
	}

	.headerMenu > ul > li.megaMenu > ul > li > ul > li.hover > a:before, .headerMenu > ul > li.megaMenu > ul > li > ul > li > ul > li.hover > a:before {
		border-right-color: var(--sttl-theme-pink);
		border-bottom-color: var(--sttl-theme-pink);
	}

	/* HeaderBottom mega menu */

}

@media screen and (min-device-width:1200px) and (max-device-width:1399px) {
	.headerMenu ul {
		gap: 10px;
		margin-top: 10px;
	}

		.headerMenu ul li a {
			font-size: var(--Font-16);
		}

	.quickPaySlider h3 a {
		font-size: 16px;
	}
}

@media (max-width:1399px) {
	h2.titleText, .titleBox .nav-item button {
		font-size: var(--Font-28);
	}

	.counter-item {
		padding-right: 15px;
	}

	.pmBox {
		padding: 80px 0;
	}
}

@media (max-width:1199px) {
	h2.titleText, .titleBox .nav-item button {
		font-size: var(--Font-22);
	}

	header {
		border-bottom: 1px solid #D0D0D0;
		position: relative;
	}

	.container {
		max-width: 100%;
	}

	.headerbottom {
		position: absolute;
		left: 0;
		top: 100%;
		width: 100%;
		display: none;
		height: calc(100vh - 70px);
		background-color: #E8F5FF;
	}

	header .parent-trigger {
		border-radius: 50px;
		line-height: normal;
		width: 42px;
		height: 42px;
		min-width: 42px;
		display: flex;
		align-items: center;
		margin-left: 0px;
		border: 1px solid var(--primaryColor);
		background-image: url(../../../../images/menu.svg);
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: center;
		transition: 0.3s all ease-in-out;
		filter: brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(3739%) hue-rotate(196deg) brightness(96%) contrast(100%);
	}

		header .parent-trigger.child-open {
			background-image: url(../../../../images/close.svg);
		}

	.headerMenu {
		height: calc(100vh - 115px);
		overflow: auto;
	}

		.headerMenu > ul > li > a {
			padding: 10px 15px;
			display: block;
		}

		.headerMenu > ul > li > ul > li > a {
			padding: 10px 30px;
		}

		.headerMenu > ul > li > ul > li > ul > li > a {
			padding: 10px 45px;
		}

		.headerMenu > ul > li > ul > li > ul > li > ul > li > a {
			padding: 10px 60px;
		}

		.headerMenu ul > li {
			position: relative;
		}

			.headerMenu ul > li .child-trigger {
				position: absolute;
				right: 0px;
				top: 0px;
				width: 40px;
				background-color: var(--primaryColor);
			}

				.headerMenu ul > li .child-trigger span {
					width: 8px;
					height: 8px;
					display: inline-block;
					margin-left: 8px;
					border: 1px solid var(--whiteColor);
					border-top: none;
					border-right: none;
					position: absolute;
					top: 50%;
					transform: translate(-50%, -50%) rotate(-45deg);
					left: calc(50% - 8px);
				}

		.headerMenu > ul > li > ul, .headerMenu > ul > li > ul > li > ul {
			display: none;
			margin-top: 0px;
			background: #b5d6f0;
			border: 0;
		}

		.headerMenu ul > li > a {
			border-bottom: 1px solid #0d3857;
			color: var(--textColor);
			display: block;
		}

		.headerMenu ul li a::before {
			background: #f17300
		}

	.bhashini-dropdown-content {
		inset: auto !important; /* inline inset ne cancel karva */
		top: 100% !important;
		right: 0 !important;
		left: auto !important;
	}

	.fx-officials .row > .col {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}

	.servicesBoxTitle button {
		position: static;
		margin: 0;
		padding: 0;
	}
}

@media (max-width:991px) {
	.headerTop {
		padding: 15px 0px;
	}

	.languageBox, .accessibility, header .parent-trigger {
		width: 38px;
		height: 38px;
		min-width: 38px;
	}

		.languageBox svg {
			width: 28px;
		}

		.accessibility > a {
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
			width: 25px;
			height: 25px;
		}

	.fx-header__utility {
		display: flex;
		justify-content: center;
	}

	.header-logo {
		padding-right: 0;
	}

	.fx-header__utility {
		white-space: wrap;
	}

	.fx-app-card__mockup-wrapper {
		z-index: 999;
		position: absolute;
		right: 20px;
	}

	.top-utility {
		display: none;
	}

	.fx-officials .row > .col {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.ulb-filter-left {
		justify-content: center !important;
		margin-bottom: 15px !important;
	}

	.ulb-count-badge {
		display: flex;
		width: 100%;
		justify-content: center;
	}
}

@media (max-width:767px) {
	.custom-tab-item i {
		margin-right: 0
	}

	#list-tab.list-group {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		gap: 8px;
	}

		#list-tab.list-group > a.list-group-item {
			flex: 0 0 calc(33.333% - 6px);
			max-width: calc(33.333% - 6px);
			padding: 8px 4px !important; /* Padding ghtadeli che jethi text ander fit thae */
			text-align: center;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}

			/* Icons ne proper adjust karva mate */
			#list-tab.list-group > a.list-group-item i,
			#list-tab.list-group > a.list-group-item svg {
				font-size: 16px;
				margin-bottom: 4px;
			}
}

@media (min-width:576px) and (max-width:767px) {
}

@media (max-width:575px) {
	.list-inline {
		justify-content: center;
	}

	.fx-footer__copyright {
		text-align: center;
		margin-bottom: 10px !important;
	}

	.fx-footer {
		text-align: center;
	}

		.fx-footer .text-end {
			text-align: center !important;
		}

	.searchBox button {
		width: 51px;
		font-size: 0;
	}

	.searchBox svg {
		filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7457%) hue-rotate(68deg) brightness(107%) contrast(99%);
		margin-left: 6px;
	}

	.fx-header__actions.gap-2 {
		gap: 0.7rem !important;
	}

	.bhashini-dropdown-content {
		width: 100vw; /* Screen ni width jitdi width lai le */
		max-width: 15rem;
		right: -2rem; /* Screen ni bahar na jay te mate adjust karvu */
		inset: auto !important; /* inline inset ne cancel karva */
		top: 100% !important;
		right: 0 !important;
		left: auto !important;
	}

	.image img {
		width: 100%;
		height: auto;
	}

	.servicesBoxTitle button, .servicesBoxTitle span {
		top: auto;
		bottom: 15;
	}



	.fx-officials .row > .col {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.fx-btn-registration {
		width: 106px;
	}

	.fx-app-card__content {
		padding-bottom: 220px;
	}

	.fx-app-card__mockup-wrapper {
		bottom: 0;
	}

	.service-actions {
		width: 200px;
		text-align: end;
	}

	.btn-outline-custom a, .service-row .btn-outline-custom {
		font-size: 14px;
	}

	.innerContent {
		padding: 30px 0;
	}

	#list-tab.list-group > a.list-group-item {
		flex: 0 0 calc(50% - 6px);
		max-width: calc(50% - 6px);
	}

	.fx-services__list .fx-sv-icon {
		width: 20px;
		height: 20px;
		background: none;
	}

	.fx-hero__heading {
		font-size: 18px !important;
	}

	.quickPaySlider a, .quickPaySlider h3 a {
		font-size: 16px;
	}

	.fx-services__list span {
		font-weight: 400;
	}

	.searchBox #searchQueryInput, #searchError {
		font-size: 14px;
	}

	.innerBanner {
		height: 80px;
	}

		.innerBanner h2 {
			font-size: 26px !important;
		}

	.servicesBox h2 {
		font-size: 22px !important;
	}

	.servicesBoxTitle > p {
		padding-right: 0;
	}

	.servicesBox .section-header {
		text-align: center;
	}

	.servicesBoxTitle {
		margin-bottom: 30px;
		padding: 20px;
	}

	.swiper-button-next, .swiper-button-prev {
		color: #000 !important;
		background: none;
		padding: 12px;
		border-radius: 50%;
	}
}

@media (max-width:392px) {
	.headerMenu {
		height: calc(100vh - 95px);
	}
}

@media (max-width:379px) {
	width: auto;
	padding: 0 !important;
	border: 0;
}

@media (max-width:359px) {
	header .parent-trigger {
		width: 40px;
		height: 40px;
	}
}
