@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {
	--primaryColor: rgb(132, 143, 223);
	--primaryGradient: linear-gradient(to bottom, #bea2e7 0%, #86b7e7 100%);
	--primaryShadow: 0 0 5px #d4d7de;
	--primaryBackground: #eaecf1;
	--primaryFont: #545454;
	--primaryRadius: 10px;
	--primaryFontFamily: "Poppins", sans-serif;
	--secondaryShadow: 0 0 5px #dfdfdf;
}

/* ************************** start tab 2 css *********************************************** */
/* width */
::-webkit-scrollbar {
	width: 4px;
	height: 4px !important;
}

::-webkit-scrollbar-thumb:horizontal {
	height: 4px !important;
}

/* ::-webkit-scrollbar-thumb:horizontal{
  width: 4px;
} */

/* Track */
::-webkit-scrollbar-track {
	box-shadow: inset 0 0 2px rgb(232, 232, 232);
	border-radius: 10px;
	background-color: white;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: linear-gradient(to bottom, #bea2e7 0%, #86b7e7 100%) !important;
	border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(to bottom, #bea2e7 0%, #86b7e7 100%) !important;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.table {
	background: white;
}

html,
body {
	font-size: 62.5%;
	scroll-behavior: smooth;
}

body {
	font-size: 12px;
	padding: 0 0 50px;
	min-height: 100vh;
	overflow-x: hidden;
	color: var(--primaryFontColor);
	font-family: var(--primaryFontFamily) !important;
	background-color: var(--primaryBackground);
}

a {
	color: #428bca;
	text-decoration: none;
}

.label {
	display: inline;
	padding: 0.2em 0.6em 0.3em;
	font-size: 75%;
	font-weight: bold;
	line-height: 1;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 0.25em;
}

.label-success {
	background-color: #5cb85c;
}

.label-danger {
	background-color: #d9534f;
}

.label-info {
	background-color: #5bc0de;
}

.label-warning {
	background-color: #f0ad4e;
}

.label-primary {
	background-color: #428bca;
}

.label-default {
	background-color: #999;
}

th {
	text-align: center;
}

.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
	padding: 3px;
	line-height: 1.42857143;
	vertical-align: middle;
	/* border-top: 1px solid #ddd; */
}

.table th,
.table td {
	padding: 0.75rem;
	vertical-align: top;
	border-top: none;
}

.table>thead>tr>td.success,
.table>tbody>tr>td.success,
.table>tfoot>tr>td.success,
.table>thead>tr>th.success,
.table>tbody>tr>th.success,
.table>tfoot>tr>th.success,
.table>thead>tr.success>td,
.table>tbody>tr.success>td,
.table>tfoot>tr.success>td,
.table>thead>tr.success>th,
.table>tbody>tr.success>th,
.table>tfoot>tr.success>th {
	background-color: #dff0d8;
}

.table>thead>tr>td.danger,
.table>tbody>tr>td.danger,
.table>tfoot>tr>td.danger,
.table>thead>tr>th.danger,
.table>tbody>tr>th.danger,
.table>tfoot>tr>th.danger,
.table>thead>tr.danger>td,
.table>tbody>tr.danger>td,
.table>tfoot>tr.danger>td,
.table>thead>tr.danger>th,
.table>tbody>tr.danger>th,
.table>tfoot>tr.danger>th {
	background-color: #f2dede;
}

.table>thead>tr>td.info,
.table>tbody>tr>td.info,
.table>tfoot>tr>td.info,
.table>thead>tr>th.info,
.table>tbody>tr>th.info,
.table>tfoot>tr>th.info,
.table>thead>tr.info>td,
.table>tbody>tr.info>td,
.table>tfoot>tr.info>td,
.table>thead>tr.info>th,
.table>tbody>tr.info>th,
.table>tfoot>tr.info>th {
	background-color: #d9edf7;
}

.table>thead>tr>td.warning,
.table>tbody>tr>td.warning,
.table>tfoot>tr>td.warning,
.table>thead>tr>th.warning,
.table>tbody>tr>th.warning,
.table>tfoot>tr>th.warning,
.table>thead>tr.warning>td,
.table>tbody>tr.warning>td,
.table>tfoot>tr.warning>td,
.table>thead>tr.warning>th,
.table>tbody>tr.warning>th,
.table>tfoot>tr.warning>th {
	background-color: #fcf8e3;
}

.btn {
	display: inline-block;
	padding: 5px 12px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 4px;
}

.btn-primary,
.btn-warning,
.btn-info,
.btn-danger {
	color: #fff !important;
}

.btn-primary {
	color: #fff !important;
	background-color: #428bca;
	border-color: #357ebd;
}

.btn-primary {
	background-image: -webkit-linear-gradient(top, #428bca 0, #2d6ca2 100%);
	background-image: linear-gradient(to bottom, #428bca 0, #2d6ca2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #2b669a;
}

.btn-success {
	color: #fff;
	background-color: #5cb85c;
	border-color: #4cae4c;
}

.btn-success {
	background-image: -webkit-linear-gradient(top, #5cb85c 0, #419641 100%);
	background-image: linear-gradient(to bottom, #5cb85c 0, #419641 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #3e8f3e;
}

.btn-danger {
	background-color: #d9534f;
	border-color: #d43f3a;
}

.btn-danger {
	background-image: -webkit-linear-gradient(top, #d9534f 0, #c12e2a 100%);
	background-image: linear-gradient(to bottom, #d9534f 0, #c12e2a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #b92c28;
}

.btn-default {
	color: #333;
	background-color: #fff;
	border-color: #ccc;
}

.btn-default {
	background-image: -webkit-linear-gradient(top, #fff 0, #e0e0e0 100%);
	background-image: linear-gradient(to bottom, #fff 0, #e0e0e0 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #dbdbdb;
	text-shadow: 0 1px 0 #fff;
	border-color: #ccc;
}

.btn-warning {
	color: #fff;
	background-color: #f0ad4e;
	border-color: #eea236;
}

.btn-warning {
	background-image: -webkit-linear-gradient(top, #f0ad4e 0, #eb9316 100%);
	background-image: linear-gradient(to bottom, #f0ad4e 0, #eb9316 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #e38d13;
}

.btn-info {
	background-image: -webkit-linear-gradient(top, #5bc0de 0, #2aabd2 100%);
	background-image: linear-gradient(to bottom, #5bc0de 0, #2aabd2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #28a4c9;
}

.btn-info {
	color: #fff;
	background-color: #5bc0de;
	border-color: #46b8da;
}

.bg-info {
	background-color: #d9edf7 !important;
}

.radio,
.checkbox {
	display: block;
	min-height: 20px;
	padding-left: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.multiselect-container {
	position: absolute;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.input-group {
	position: relative;
	display: table;
	border-collapse: separate;
}

.input-group .form-control {
	position: relative;
	z-index: 2;
	float: left;
	width: 100%;
	margin-bottom: 0;
}

.input-group-addon:first-child {
	border-right: 0;
}

.multiselect-container .input-group {
	margin: 0 !important;
	padding: 5px;
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child>.btn,
.input-group-btn:first-child>.btn-group>.btn,
.input-group-btn:first-child>.dropdown-toggle,
.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child>.btn-group:not(:last-child)>.btn {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.input-group-addon {
	padding: 6px 12px;
	font-size: 14px;
	font-weight: normal;
	line-height: 1;
	color: #555;
	text-align: center;
	background-color: #eee;
	border: 1px solid #ccc;
	border-radius: 4px;
}

.input-group-addon,
.input-group-btn {
	width: 1%;
	white-space: nowrap;
	vertical-align: middle;
}

.multiselect-container>li {
	padding: 0;
}

.input-group-addon,
.input-group-btn,
.input-group .form-control {
	display: table-cell;
}

.input-group-addon,
.input-group-btn,
.input-group .form-control {
	display: table-cell;
}

.dropdown-menu {
	position: absolute;
	/* top: 100% !important; */
	left: 0;
	z-index: 1001;
	display: none;
	float: left;
	min-width: 160px;
	max-height: 550px;
	overflow-y: auto;
	padding: 5px 0;
	margin: 2px 0 0;
	font-size: 14px;
	list-style: none;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 4px;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}

.multiselect-container {
	top: calc(100% - 2px) !important;
}

.multiselect-container>li>a>label {
	margin: 0;
	height: 100%;
	cursor: pointer;
	font-weight: 400;
	padding: 3px 20px 3px 40px;
}

.multiselect-container>li>a>label.radio,
.multiselect-container>li>a>label.checkbox {
	margin: 0;
}

.dropdown-menu>li>a {
	display: block;
	/* padding: 3px 20px; */
	clear: both;
	font-weight: normal;
	line-height: 1.42857143;
	color: #333;
	white-space: nowrap;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
	float: left;
	margin: 3px 0 0;
	margin-left: -20px;
}

.open>.dropdown-menu {
	display: block;
}

.glyphicon {
	position: relative;
	/* top: 1px; */
	display: inline-block;
	font-family: "fontAwesome";
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.glyphicon-search:before {
	content: "\f002";
}

.glyphicon-edit:before {
	content: "\f040";
}

.glyphicon-trash::before {
	content: "\f2ed";
}

.glyphicon-question-sign::before {
	content: "\f059";
}

[class*="col"] {
	/* max-width: 100%; */
}

label {
	display: inline-block;
	margin-bottom: 5px;
	font-weight: bold;
}

[class*="col-xs"] {
	padding: 0 15px;
}

.col-xs-12 {
	width: 100%;
}

.col-xs-6 {
	width: 50%;
}

@media only screen and (max-width: 575px) {

	.col-xs-1,
	.col-xs-2,
	.col-xs-3,
	.col-xs-4,
	.col-xs-5,
	.col-xs-6,
	.col-xs-7,
	.col-xs-8,
	.col-xs-9,
	.col-xs-10,
	.col-xs-11,
	.col-xs-12 {
		width: 100%;
	}
}

.btn-xs,
.btn-group-xs>.btn {
	padding: 1px 5px;
	font-size: 12px;
	line-height: 1.5;
	border-radius: 3px;
}

.row.topFormSectionBox {
	display: flex;
	flex-wrap: wrap;
}

.row.topFormSectionBox .col-md-6:nth-child(1) {
	padding-right: 7px;
}

.row.topFormSectionBox .col-md-6:nth-child(2) {
	padding-left: 7px;
}

.row.topFormSectionBox .pageMainBoxContainer {
	height: 100%;
}

.container-fluid {
	max-width: 1860px;
}

.container {
	max-width: 100%;
	width: 1366px;
}

a {
	text-decoration: none !important;
}

img {
	max-width: 100%;
}

/*

.m-0 {
	margin: 0 !important;
}

.mt-0,
.my-0 {
	margin-top: 0 !important;
}

.mr-0,
.mx-0 {
	margin-right: 0 !important;
}

.mb-0,
.my-0 {
	margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
	margin-left: 0 !important;
}

.m-1 {
	margin: 0.25rem !important;
}

.mt-1,
.my-1 {
	margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
	margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
	margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
	margin-left: 0.25rem !important;
}

.m-2 {
	margin: 0.5rem !important;
}

.mt-2,
.my-2 {
	margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
	margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
	margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
	margin-left: 0.5rem !important;
}

.m-3 {
	margin: 1rem !important;
}

.mt-3,
.my-3 {
	margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
	margin-right: 1rem !important;
}

.mb-3,
.my-3 {
	margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
	margin-left: 1rem !important;
}

.m-4 {
	margin: 1.5rem !important;
}

.mt-4,
.my-4 {
	margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
	margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
	margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
	margin-left: 1.5rem !important;
}

.m-5 {
	margin: 3rem !important;
}

.mt-5,
.my-5 {
	margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
	margin-right: 3rem !important;
}

.mb-5,
.my-5 {
	margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
	margin-left: 3rem !important;
}

.m-auto {
	margin: auto !important;
}

.mr-auto {
	margin-right: auto !important;
}

.ml-auto {
	margin-left: auto !important;
}

.mx-auto {
	margin-left: auto !important;
	margin-right: auto !important;
}

.my-auto {
	margin-top: auto !important;
	margin-bottom: auto !important;
}

.p-0 {
	padding: 0 !important;
}

.pt-0,
.py-0 {
	padding-top: 0 !important;
}

.pr-0,
.px-0 {
	padding-right: 0 !important;
}

.pb-0,
.py-0 {
	padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
	padding-left: 0 !important;
}

.p-1 {
	padding: 0.25rem !important;
}

.pt-1,
.py-1 {
	padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
	padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
	padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
	padding-left: 0.25rem !important;
}

.p-2 {
	padding: 0.5rem !important;
}

.pt-2,
.py-2 {
	padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
	padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
	padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
	padding-left: 0.5rem !important;
}

.p-3 {
	padding: 1rem !important;
}

.pt-3,
.py-3 {
	padding-top: 1rem !important;
}

.pr-3,
.px-3 {
	padding-right: 1rem !important;
}

.pb-3,
.py-3 {
	padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
	padding-left: 1rem !important;
}

.p-4 {
	padding: 1.5rem !important;
}

.pt-4,
.py-4 {
	padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
	padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
	padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
	padding-left: 1.5rem !important;
}

.p-5 {
	padding: 3rem !important;
}

.pt-5,
.py-5 {
	padding-top: 3rem !important;
}

.pr-5,
.px-5 {
	padding-right: 3rem !important;
}

.pb-5,
.py-5 {
	padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
	padding-left: 3rem !important;
}

*/

@media only screen and (min-width: 991px) {
	.pr-md-2 {
		padding-right: 0.5rem !important;
	}

	.pl-md-2 {
		padding-left: 0.5rem !important;
	}

	.px-md-2 {
		padding-left: 0.5rem !important;
		padding-right: 0.5rem !important;
	}
}

.font10 {
	font-size: 10px !important;
}

.font11 {
	font-size: 11px !important;
}

.font12 {
	font-size: 12px !important;
}

.font14 {
	font-size: 14px !important;
}

.font16 {
	font-size: 16px !important;
}

.font-size-inherit {
	font-size: inherit !important;
}

.text-right {
	text-align: right !important;
}

.text-left {
	text-align: left !important;
}

.text-center {
	text-align: center !important;
}

.text-justify {
	text-align: justify !important;
}

@media only screen and (min-width: 757px) {
	.text-sm-right {
		text-align: right !important;
	}
}

.font-weight-thin {
	font-weight: 200 !important;
}

.font-weight-normal {
	font-weight: normal !important;
}

.font-weight-semibold {
	font-weight: 500 !important;
}

.font-weight-bold {
	font-weight: 600 !important;
}

.font-weight-heavy {
	font-weight: 700 !important;
}

.font-weight-dark {
	font-weight: bold !important;
}

.white-space-wrap {
	white-space: wrap;
}

.white-space-no-wrap {
	white-space: nowrap;
}

.fullWidth {
	width: 100%;
}

.halfWidth {
	width: 50%;
}

.width-content-max {
	width: max-content;
}

.width-content-min {
	width: min-content;
}

.d-flex {
	display: flex !important;
}

.flex-wrap {
	flex-wrap: wrap !important;
}

.flex-no-wrap {
	flex-wrap: nowrap !important;
}

.flex-direction-row {
	flex-direction: row !important;
}

.flex-direction-row-reverse {
	flex-direction: row-reverse !important;
}

.flex-direction-column {
	flex-direction: column !important;
}

.flex-direction-column-reverse {
	flex-direction: column-reverse !important;
}

.justify-content-end {
	justify-content: flex-end !important;
}

.justify-content-center {
	justify-content: center !important;
}

.justify-content-between {
	justify-content: space-between !important;
}

.align-items-center {
	align-items: center !important;
}

.align-items-end {
	align-items: flex-end !important;
}

.align-items-stretch {
	align-items: stretch !important;
}

.gap4
{
	row-gap: 4px;
	column-gap: 4px;
}
.gap8
{
	row-gap: 8px;
	column-gap: 8px;
}
.gap12
{
	row-gap: 12px;
	column-gap: 12px;
}
.gapy4
{
	row-gap: 4px;
}
.gapx4
{
	column-gap: 4px;
}
.gapy8
{
	row-gap: 8px;
}
.gapx8
{
	column-gap: 8px;
}
.gapy12
{
	row-gap: 12px;
}
.gapx12
{
	column-gap: 12px;
}


.primaryText {
	color: var(--primaryColor);
}

.fontHeavy {
	font-weight: 600;
}

b .fontHeavy {
	font-weight: 700;
}

.color-orange,
.colorOrange {
	color: orange;
}

.color-red,
.colorRed {
	color: red;
}

.color-green,
.colorGreen {
	color: green;
}

.color-inherit {
	color: inherit !important;
}

.radius-0 {
	border-radius: 0 !important;
}

.radius-4 {
	border-radius: 4px !important;
}

.radius-8 {
	border-radius: 8px !important;
}

.radius-12 {
	border-radius: 12px !important;
}

.radius-15 {
	border-radius: 15px !important;
}

.radius-full {
	border-radius: 800px !important;
}

.card
{
	border-radius: var(--primaryRadius);
	border: none;
	box-shadow: var(--secondaryShadow);
}


.primaryButton {
	padding: 7px 12px;
	/* display: block; */
	line-height: 1.3;
	border: none !important;
	outline: none !important;
	color: white;
	border-radius: 4px;
	letter-spacing: 0.2px;
	font-weight: 600;
	white-space: nowrap;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
	background-image: linear-gradient(180deg, #969fe4, #5563d3);
}

.primaryButton:active,
.primaryButton:focus,
.primaryButton:hover {
	color: white;
	background: black !important;
}

/* .customInputFields {
  font-size: 14px;
  width: 100%;
  display: block;
  color: black;
  font-weight: normal;
  border: 1px solid #eaecf1;
  outline: none;
  padding: 5px 13px;
  border-radius: 150px;
  line-height: 1.5;
}
textarea.customInputFields {
  border-radius: 12px;
  resize: vertical;
} */
.customSpecialInputContainer {
	display: flex;
	gap: 8px 12px;
	width: max-content;
	max-width: 100%;
	flex-wrap: wrap;
}

.customSpecialInputBox {
	padding: 4px 0;
	position: relative;
}

.customSpecialInputCard {
	display: flex;
	align-items: center;
	position: relative;
}

.customSpecialInputCard input {
	-webkit-appearance: none;
	appearance: none;
	height: 100%;
	width: 100%;
	outline: none !important;
	border: none !important;
	position: absolute;
	cursor: pointer;
}

.customSpecialInputCard label {
	margin: 0;
	line-height: 1.3;
	padding: 7px 32px 7px 16px;
	font-size: 14px;
	transition: 0.4s;
	box-shadow: var(--primaryShadow);
	border-radius: 60px;
	font-weight: 600;
	cursor: pointer;
	background: white;
}

.customSpecialInputCard label::after {
	content: "\f058";
	font-weight: bold;
	font-family: "FontAwesome";
	/* color: var(--primaryColor); */
	position: absolute;
	right: 7px;
	top: 48%;
	opacity: 0.2;
	font-size: 20px;
	transform: translateY(-50%);
}

.customSpecialInputCard input:checked~label,
.customSpecialInputCard:hover label {
	color: white;
	background-color: var(--primaryColor);
}

.customSpecialInputCard:hover input:checked~label {
	background-color: black;
}

.customSpecialInputCard input:checked~label::after,
.customSpecialInputCard:hover label::after {
	opacity: 1;
	color: white;
}

.customSpecialInputCard input:not(.radio):checked~label::after {
	content: "\f057";
}

.customCameraPhotoCaptureContainer {
	/* border: 1px solid #eaecf1; */
	padding: 12px 16px 16px;
	border-radius: 7px;
	background: linear-gradient(180deg, #ffffff, #fcfcfc);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.13);
}

.nav-tabs {
	border: none;
}

.customListingMobileCard {
	display: flex;
	width: 100%;
	align-items: center;
	gap: 12px;
	padding: 16px;
	border-radius: 12px;
	box-shadow: var(--primaryShadow);
	margin: 16px 0 0;
	position: relative;
	background: white;
}

.customListingMobileCardLeft {
	width: 180px;
	max-width: 100%;
}

.customListingMobileCardCount {
	font-size: 14px;
	font-weight: bold;
	color: white;
	background-color: var(--primaryColor);
	width: 28px;
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100px;
	position: absolute;
	bottom: 12px;
	left: 12px;
	z-index: 1;
	text-shadow: 1px 1px black;
	box-shadow: inset 2px 2px 5px rgba(255, 255, 255, 0.3),
		inset -2px -2px 7px rgba(0, 0, 0, 0.2), 2px 2px 10px rgba(0, 0, 0, 0.12);
}

.customListingMobileCardRight {
	width: calc(100% - 180px - 12px);
}

.customListingMobileCardContent {
	display: flex;
	gap: 8px 18px;
	flex-wrap: wrap;
	align-items: flex-end;
}

.customListingMobileCardDataCard {
	padding: 4px 6px;
	border-bottom: 1px dashed #c2c8d6;
}

.customListingMobileCardDataBox {
	width: calc(50% - 9px);
}

.customListingMobileCardDataLabel {
	font-size: 10px;
	font-weight: 500;
	color: #717171;
	line-height: 1;
}

.customListingMobileCardDataContent {
	font-size: 14px;
	font-weight: 500;
	color: black;
}

.customListingMobileCardsContainer {
	display: none;
}

@media only screen and (max-width: 767px) {
	.customListingMobileCardsContainer {
		display: block;
	}
}

@media only screen and (max-width: 600px) {
	.customListingMobileCard {
		flex-direction: column;
	}

	.customListingMobileCardRight {
		width: 100%;
	}

	.customListingMobileCardCount {
		top: 7px;
		left: 7px;
		bottom: unset;
	}
}

/* Custom Filter Work Start */

.customTableFilterBox {
	position: relative;
}

.customTableFilterToggler {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 8px;
}

.customTableFilterContent {
	margin-top: 8px;
}

.customTableFilterCard {
	display: flex;
	justify-content: space-between;
	/* flex-wrap: wrap; */
	align-items: center;
	font-size: 12px;
	gap: 8px 10px;
	padding: 4px 0 6px;
}

.customTableFilterRight,
.customTableFilterLeft {
	display: flex;
	align-items: center;
	gap: 8px 14px;
	flex-wrap: wrap;
}

.customTableFilterToggler  .customTableFilterLeft {
    gap: 0;
    padding: 0;
}
.customTableFilterRight {
	/* min-width: max-content; */
}

.customTableFilterCard .form-group {
	display: flex;
	width: max-content;
	margin-bottom: 0;
	max-width: 100%;
	gap: 2px;
}

/* .customTableFilterBox select.customInputFields ~ .btn-group .btn,
.customTableFilterCard .customInputFields {
  padding: 4px 6px;
  border-radius: 0;
  border: none !important;
  color: black;
  font-size: 12px;
  line-height: 1.4;
  background: white;
  box-shadow: none;
  cursor: pointer;
  border-bottom: 2px dotted #c2c8d6 !important;
} */

.customTableFilterBox select.customInputFields~.btn-group .btn,
.customTableFilterCard .customInputFields {
	padding: 6px 10px;
	/* min-width: 110px; */
	/* min-height: unset; */
	border-radius: 4px;
	color: black;
	font-size: 12px;
	line-height: 1.4;
	background: white;
	box-shadow: none;
	cursor: pointer;
	margin-left: 3px;
}

.customInputFields[type="number"]::-webkit-inner-spin-button,
.customInputFields[type="number"]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	appearance: none;
}

.customInputFields[type="time"],
.customInputFields[type="date"] {
	line-height: inherit !important;
	padding: 5px 12px;
}
.customInputFields[type="file"] {
	line-height: inherit !important;
	padding: 3px 12px;
}

.customInputPassword {
	position: relative;
}

.customInputPassword input {
	padding-right: 32px;
}

.customInputPassword i {
	height: calc(100% - 8px);
	top: 50%;
	right: 4px;
	max-width: 32px;
	max-height: 32px;
	aspect-ratio: 1;
	position: absolute;
	background: #f9f9f9;
	border-radius: 30px;
	display: flex;
	align-items: center;
	font-size: 120%;
	transition: 0.3s;
	transform: translateY(-50%);
	justify-content: center;
	cursor: pointer;
}

.customInputPassword i:hover {
	color: black;
	background-color: #f5f5f5;
}

.customTableFilterLeft label {
	display: flex;
	align-items: center;
	font-weight: 500;
	color: #555555;
	width: max-content;
	white-space: nowrap;
	margin: 0;
}

select.customInputFields~.btn-group a {
	margin: 0;
}

select.customInputFields~.btn-group a:hover,
select.customInputFields~.btn-group a:focus {
	background-image: none !important;
	background-image: none !important;
	background-repeat: none !important;
	filter: none !important;
	background: rgb(250, 250, 250) !important;
	transform: translateY(0px) !important;
	color: rgb(69, 69, 69) !important;
	font-weight: initial !important;
}

select.customInputFields~.btn-group .active>a {
	color: white !important;
	font-weight: initial !important;
	background: var(--primaryColor) !important;
}

select.customInputFields~.btn-group label {
	width: 100%;
	gap: 5px;
	color: inherit !important;
	font-weight: normal !important;
	padding: 4px 0 4px 27px;
}

.customInputFields[type="checkbox"] {
	height: 15px;
	width: 15px;
	margin: 0 5px;
}

input.customInputCheckBox {
	margin: 0;
}

.customTableFilterCard .btn {
	border-radius: 100px;
	padding: 4px 15px;
}

.customTableFilterBtn {
	display: none;
}

.customTableFilterBtn:hover {
	color: white;
	background: var(--primaryColor);
}

.customTableFilterBtnIcon {
	color: var(--primaryColor);
}

.customTableFilterBtn:hover .customTableFilterBtnIcon {
	color: white;
}

.customTableFilterIconCard {
	display: flex;
	gap: 8px 10px;
	flex-wrap: wrap;
}

.customTableFilterIcon {
	display: flex;
	width: 34px;
	aspect-ratio: 1;
	padding: 4px;
	border-radius: 5px;
	background: white;
	border: 1px solid #eaecf1;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.06);
}

.customTableFilterIcon img {
	height: 100%;
	width: 100%;
	object-fit: contain;
}

.customListingMobileCardImage {
	border-radius: 8px;
	border: 5px solid white;
	object-fit: cover;
	aspect-ratio: 1;
	box-shadow: var(--primaryShadow);
}

@media only screen and (max-width: 575px) {

	select.customInputFields~.btn-group,
	select.customInputFields~.btn-group .btn {
		text-align: left;
		width: 100%;
	}

	.customTableFilterBtn {
		display: flex;
		gap: 7px;
		align-items: center;
		justify-content: center;
		padding: 5px 12px;
		border-radius: 5px;
		font-size: 12px;
		font-weight: 600;
		transition: 0.5s;
		background: white;
		cursor: pointer;
		border: 1px solid var(--primaryColor);
		/* border: 1px solid #e0e3eb; */
	}

	.customTableFilterCard {
		font-size: 10px;
		gap: 4px 0;
		padding: 0 0 12px;
		flex-wrap: wrap;
	}

	.customTableFilterRight,
	.customTableFilterLeft {
		width: 100%;
		max-width: 100%;
		min-width: unset;
	}

	.customTableFilterRight {
		padding-top: 16px;
	}

	.customTableFilterCard .form-group {
		flex-wrap: wrap;
		width: 100%;
		/* width: calc(50% - 7px); */
	}

	.customTableFilterContent {
		display: none;
	}
}

/* Custom Filter Work End */

/* Custom Data Count Work Start */
.customDataCountContainer {
	margin-bottom: 12px;
}

.customDataCountCardList {
	display: flex;
	align-items: center;
	/* justify-content: space-evenly; */
	flex-wrap: wrap;
	gap: 8px 12px;
}

.customDataCountCard {
	display: flex;
	gap: 0 4px;
	width: calc(calc(100% / 6) - 10px);
	padding: 7px 12px;
	border-radius: 8px;
	align-items: center;
	min-width: 200px;
	box-shadow: var(--primaryShadow);
	justify-content: center;
	background: linear-gradient(45deg, #f8f9fc, #ffffff);
}

/* .customDataCountCardList .customDataCountCard:nth-child(even) {
  background: red;
} */
.customDataInnerTitle,
.customDataCountTitle {
	font-weight: 500;
	color: black;
}

.customDataInnerCardList {
	display: flex;
	gap: 6px;
}

.customDataInnerCard {
	display: flex;
	gap: 4px;
}

.customDataCountValue {
	font-weight: bold;
	color: green;
	font-size: 120%;
}

.customDataCountValue span {
	color: red;
	font-size: 70%;
}

/* Custom Data Count Work End */

.pageMainBoxContainer {
	/* height: 100%; */
}

.pageMainBox {
	height: 100%;
}

.pageMainCard {
	height: calc(100% - 15px);
}

.pageMainCard {
	margin-bottom: 15px;
}

.pageTitle,
.pageSubTitle {
	font-size: 20px;
	font-weight: 600;
	padding: 7px 0 4px 7px;
}

.pageSubTitle {
	font-size: 16px;
}

.pageMainCardBox {
	padding: 12px;
	/* height: 100%; */
	position: relative;
	background: white;
	border-radius: 15px;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.topFormSectionBox .pageMainCardBox {
	padding: 12px;
	height: 100%;
	display: flex;
	background: white;
	border-radius: 15px;
	box-shadow: 0 0 5px rgb(212 215 222);
	flex-direction: column;
	justify-content: center;
}

.pageTableContainer {
	width: 100%;
	position: relative;
	border-radius: 6px;
	box-shadow: 0 0 5px rgb(231 231 231);
}

table.pageTable {
	border: none;
	margin: 0;
	min-width: 630px;
}

.pageTable tbody tr:nth-child(even) {
	background: #f9f9f9;
}

.pageTable tbody tr td {
	border: none !important;
	vertical-align: middle;
	padding: 4px 9px;
}

.pageTable td b {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2px;
}

.dflBox {
	flex-wrap: wrap;
	display: flex;
	gap: 8px;
	align-items: center;
}

/*
.studentCardBoxTitle {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
*/
.customButtonCard {
	display: flex;
	width: 100%;
	gap: 7px 8px;
	flex-wrap: wrap;
	padding-top: 7px;
}

.studentIdCardBox {
	border-radius: 12px;
	padding: 8px;
	position: relative;
	background: white;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.studentIdCard {
	display: flex;
	gap: 12px;
	width: 100%;
	align-items: center;
}

.studentCardLeft {
	width: 180px;
}

.studentProfileImageContainer {
	position: relative;
	width: 100%;
	margin-bottom: 7px;
}

.studentProfileImageBox {
	aspect-ratio: 7 / 8;
	overflow: hidden;
	width: 100%;
	position: relative;
	border-radius: 4px;
}

.studentProfileImageBox img {
	display: block;
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.studentProfileBtnContainer {
	position: absolute;
	bottom: 5px;
	left: 50%;
	transform: translateX(-50%);
}

.studentCardRight {
	width: calc(100% - 180px);
	padding: 4px 4px 0px 0;
}

/* .studentInfoBox {
  padding: 5px 0 6px;
} */
.studentInfoCards {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 14px;
}

.studentInfoCard.fullWidth {
	width: 100%;
}

.studentInfoCard {
	width: calc(33.3% - 10px);
	padding: 0px 5px 1px;
	border-bottom: 1px solid rgb(234 236 241);
}

.studentInfoCard.card50 {
	width: calc(50% - 7px);
}

.studentInfoCard:last-child {
	border: none;
}

.studentInfoCardTitle {
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	color: #949494;
}

.studentInfoCardData {
	font-size: 14px;
	font-weight: 500;
	display: flex;
	gap: 3px;
	padding: 2px 0 3px;
	flex-wrap: wrap;
	line-height: 1.2;
	align-items: center;
}

a.schoolBusImageIconBox {
	cursor: pointer;
	user-select: none;
	width: 40px;
	display: inline-block;
}

img.schoolBusImageIconBox {
	pointer-events: none;
}

.feePageSearchStudentBox {
	width: 100%;
	color: #000;
	font-weight: normal;
	padding: 7px 14px;
	border-radius: 12px;
	margin: 20px 0 12px;
	background-color: white;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.feePageSearchStudentContainer {
	display: flex;
	gap: 8px 16px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.feePageSearchStudentLeft {
	display: flex;
	gap: 0 4px;
	flex-wrap: wrap;
	max-width: 100%;
	align-items: center;
}

.feeCollectionDataBox {
	font-weight: 500;
}

.searchStudentTopFilterFormContainer {
	display: flex;
	align-items: center;
	gap: 4px 8px;
	flex-wrap: wrap;
	max-width: 100%;
}

.feePageSearchStudentFullWidth {
	padding-top: 2px;
	width: 100%;
	padding-bottom: 5px;
}

.feePageSearchStudentBox label {
	margin: 0;
	display: block;
	max-width: 100%;
}

.searchStudentTopFilterForm {
	font-weight: 600;
	margin-bottom: 2px;
	margin-left: 4px;
}

.feePageSearchStudentBox textarea,
.feePageSearchStudentBox select,
.feePageSearchStudentBox input {
	display: block;
	margin: 0;
	font-weight: 500;
	text-align: left !important;
	padding: 7px 12px;
	height: unset;
	max-width: 100%;
	line-height: 1.4;
	font-size: inherit;
	outline: none !important;
	border-radius: 60px;
	border: 1px solid #acb4c8;
	outline: none !important;
}

.feePageSearchStudentBox select,
.feePageSearchStudentBox select.customInputFields {
	padding: 5.5px 12px;
}

.feePageSearchStudentBox textarea {
	resize: none;
}

.tillAmount {
	font-size: 170%;
	color: red;
	font-weight: 600;
}

.pageMainCardBox ul.customTabPanelNavContainer {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 12px;
	border: none;
}

ul.customTabPanelNavContainer::before {
	display: none;
}

li.customTabPanelNav a {
	padding: 4px 10px;
	border: none;
	transition: 0.3s;
	border-radius: 4px;
	background: white;
	display: block;
	font-weight: 600;
	box-shadow: 0 0 5px rgb(179 179 179 / 39%);
}

li.customTabPanelNav.active a,
li.customTabPanelNav a:hover {
	border: none !important;
}

li.customTabPanelNav.active.blue a,
li.customTabPanelNav.blue a:hover {
	border: none !important;
	background: #5c7ed6;
	color: white;
}

.green a {
	color: green;
}

.orange a {
	color: orange;
}

li.customTabPanelNav.active.green a {
	color: green;
}

li.customTabPanelNav.active.green a,
li.customTabPanelNav.active.green a:hover {
	background: green !important;
	color: white;
}

li.customTabPanelNav.active.orange a {
	color: orange;
}

li.customTabPanelNav.active.orange a,
li.customTabPanelNav.active.orange a:hover {
	background: orange !important;
	color: white;
}

.tabPanelTableBox .table-responsive {
	height: 320px;
	overflow-y: auto;
	overflow-x: auto;
	border-radius: 7px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
	margin-bottom: 0;
}

.tabPanelTableBox .table-responsive::-webkit-scrollbar {
	width: 7px;
	height: 7px;
}

.tabPanelTableBox .table-responsive::-webkit-scrollbar-track {
	background-color: #efefef;
}

.tabPanelTableBox .table-responsive::-webkit-scrollbar-thumb {
	background-color: #5c7ed6;
}

.customTable {
	line-height: 1.6;
	letter-spacing: 0.05px;
}

.customTable tbody tr,
.tabPanelContent .tabPanelTableRow {
	background: white;
	transition: 0.3s;
}

.customTable tbody tr:nth-child(even),
.tabPanelContent .tabPanelTableRow:nth-child(even) {
	background-color: #fdfdfd;
}

.customTable tbody tr:hover,
.tabPanelContent .tabPanelTableRow:hover {
	background: #f7f7f7;
}

thead.tabPanelHeader {
	border: 1px solid #eaecf1;
}

.customTable thead {
	background-color: #f6f8fe;
}

.customTable th,
.customTable tbody th,
.customTable tfoot tr th,
.customTable thead tr th,
.tabPanelTable .tabPanelHeader .tabPanelTableRow th.tabPanelTableHeading {
	padding: 8px 6px;
	border-bottom: 1px solid #eaecf1;
	background: #f6f8fe;
	vertical-align: middle;
}

.customTable thead tr th {
	font-size: inherit !important;
	font-family: inherit !important;
}

.customTableHeadBordered tfoot tr th,
.customTableHeadBordered thead tr th {
	color: #333333;
	border-bottom: 1px solid #e7e9ef !important;
	border-left: 1px solid #e7e9ef !important;
	border-right: 1px solid #e7e9ef !important;
}

.customTableHeadBordered tfoot tr th {
	border-bottom: none !important;
	border-top: 1px solid #e7e9ef !important;
}

.customTableHeadBordered thead tr th:first-child {
	border-top-left-radius: inherit;
}

.customTableHeadBordered thead tr th:last-child {
	border-top-right-radius: inherit;
}

.customTableHeadBordered tfoot tr th:first-child {
	border-bottom-left-radius: inherit;
}

.customTableHeadBordered tfoot tr th:last-child {
	border-bottom-right-radius: inherit;
}

.customTablePadded tbody tr td {
	padding: 4px 8px;
	line-height: 1.6;
}
.customTablePadded thead tr th,
.customTablePadded tbody tr th {
	padding: 6px 8px;
	line-height: 1.6;
}

.customTableFixedHead thead {
	z-index: 1;
	top: 66.03px;
	position: sticky;
	background-color: #f6f8fe;
}

.customTable tfoot tr:last-child th:first-child,
.customTable tbody tr:last-child th:first-child,
.customTable tr td:first-child,
.customTable tbody tr th:first-child,
.customTable tbody tr td:first-child,
.customTable thead tr th:first-child {
	border-left: none !important;
}

.customTable tfoot tr:last-child th:last-child,
.customTable tbody tr:last-child th:last-child,
.customTable tr td:last-child,
.customTable tbody tr th:last-child,
.customTable tbody tr td:last-child,
.customTable thead tr th:last-child {
	border-right: none !important;
}

.customTable tbody tr:last-child th,
.customTable tbody tr:last-child td {
	border-bottom: 0 !important;
}

.customTable tbody tr th,
.customTable tbody tr:first-child td {
	border-top: 0 !important;
}

.customTable thead tr.danger td,
.customTable thead tr.red td,
.customTable tbody tr.red td,
.customTable tbody tr.danger td {
	background-color: #fff5f5;
}

.customTable thead tr.green td,
.customTable tbody tr.green td,
.customTable thead tr.success td,
.customTable tbody tr.success td {
	background-color: #f3f9f0;
}

.customTable thead tr.blue td,
.customTable tbody tr.blue td,
.customTable thead tr.info td,
.customTable tbody tr.info td {
	background-color: #f2fafd;
}

.tabPanelTable {
	margin-bottom: 0px;
}

td.tabPanelTableDataBox {
	text-align: center;
	font-size: 11.7px;
	font-weight: 500;
	padding: 6px 4px !important;
	border: 1px solid #eaecf1;
}

.excessFeeCalcContainer {
	margin-top: 12px;
}

.excessFeeCalcBox {
	padding: 6px 12px;
	border-radius: 500px;
}

.tabPanelBottomButtonsBox.customButtonsContainer {
	margin: 0;
	padding: 7px 0 0;
	text-align: center;
}

.defaulterErroMsgTopContainer {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
}

.defaulterErroMsgBox {
	text-align: center;
	margin-bottom: 8px;
	line-height: 1.2;
}

span.defaulterErroMsg {
	width: max-content;
	display: block;
	max-width: 100%;
	padding: 6px 12px 4px;
	border-radius: 4px;
	/* background: red; */
	color: white;
	font-weight: 700;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.defaulterErroMsgBox.blue span.defaulterErroMsg {
	background-color: #5c7ed6;
}

.defaulterErroMsgBox.red span.defaulterErroMsg {
	background-color: #e40f0f;
}

.accountQuickSummaryCards {
	display: flex;
	gap: 4px 16px;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	padding: 7px 15px;
	border-radius: 7px;
	background: white;
	font-size: 14px;
	font-weight: 500;
	margin: 7px 0;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.accountQuickSummaryCards span {
	font-weight: 600;
	font-size: 110%;
	display: inline-block;
}

.acccountQuickSummary {
	text-align: center;
}

.schoolFeeSectionTitleContainer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 10px 0;
	gap: 8px 12px;
}

.schoolFeeSectionTitleBox h4 {
	margin: 0;
}

.schoolFeeSectionButtonBox {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.schoolFeePageSmallTitle {
	display: flex;
	font-size: 20px;
	margin: 0;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 4px;
}

.schoolFeeStatusTableContainer td.tabPanelTableDataBox.firstDataBox {
	background-color: hsl(38 100% 96% / 1);
	position: sticky;
	left: -1px;
	border: none;
}

.schoolFeeStatusTableContainer th:first-child {
	position: sticky;
	left: -1px;
}

.schoolFeeStatusTableContainer thead.tabPanelHeader {
	border: none;
}

.table-responsive:has(.customTable) {
	border: 1px solid #eaecf1;
	border-radius: 8px;
	box-shadow: 0 0 5px rgb(0 0 0 / 3%);
}

.table-responsive:has(.customTableFixedHeader) {
	max-height: 70vh;
}

.table-responsive .customTableFixedHeader thead {
	top: -1px;
	z-index: 1;
	position: sticky;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.06);
}

.table-responsive:has(.customTableStickyHeader) {
	max-height: unset;
}

.table-responsive .customTableStickyHeader thead {
	top: 0;
	position: sticky;
}

.customTable,
table.table.tabPanelTable.schoolFeeStatusTable {
	border-radius: 8px;
	font-size: 14px;
	/* border: 1px solid #eaecf1; */
	overflow-y: auto;
	font-family: inherit;
}

.customTable {
	font-size: inherit;
	margin: 0;
}

.headingVertical th {
	writing-mode: sideways-lr;
}

.vertical_text {
	writing-mode: vertical-rl !important;
}

.schoolFeeStatusTableContainer tr:nth-child(even) td.tabPanelTableDataBox.firstDataBox {
	background-color: hsl(38 100% 93% / 1);
}

.customTable td,
.customTable tbody th,
.schoolFeeStatusTableContainer td.tabPanelTableDataBox {
	font-size: 13px;
	border: 1px solid #eaecf194;
}

.customTable td {
	font-size: inherit;
	font-weight: 500;
	text-align: center;
	color: inherit;
}

.customTable td[align="right"] {
	text-align: right;
}

.customTable td[align="left"] {
	text-align: left;
}

.font-weight-normal td {
	font-weight: normal;
}

.customTableBordered {
	border-radius: 0;
	border: 1px solid #e7e9ef !important;
}

/*
  td.tabPanelTableDataBox.green {
    background: rgb(214 255 154);
    border-bottom: 1px solid #29e129;
  } 
*/
td.tabPanelTableDataBox.green {
	background: #ebffcc;
	border-bottom: 1px solid rgb(189, 255, 154);
}

td.tabPanelTableDataBox.orange {
	background-color: #ffeecf;
	border-bottom: 1px solid #ffc458;
}

td.tabPanelTableDataBox.violet {
	background-color: #fbe4fb;
	border-bottom: 1px solid violet;
}

.schoolFeeStatusTableContainer tr td:last-child {
	font-weight: 700;
}

.schoolFeeStatusTableContainer tr:last-child td:last-child {
	border-bottom: none;
}

.fontHeavy {
	font-weight: 600;
}

b .fontHeavy {
	font-weight: 700;
}

.colorRed {
	color: red;
}

.colorGreen {
	color: green;
}

.customUnOrderedList {
	font-size: 14px;
	margin: 0;
	padding-left: 20px;
}

.customModalHeader {
	padding: 12px 20px;
	background-color: rgb(247, 248, 253);
}

.modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.customModalBox .modal-content {
	border-radius: 12px;
	overflow: hidden;
}

.studentCardBoxTitle {
	background: white;
	font-size: 12px;
	font-weight: bold;
	padding: 5px 12px 0;
	line-height: 1;
}

.defaulterErroMsgBoxSmall span.defaulterErroMsg {
	font-size: 12px;
	padding: 5px 7px;
}

.schoolFeePageSmallTitle .defaulterErroMsgBox {
	margin: 0;
}

.schoolFeeSectionAmountCard {
	display: flex;
	gap: 8px 12px;
	flex-wrap: wrap;
	align-items: center;
	font-size: 14px;
	font-weight: 500;
	background: white;
	padding: 4px 10px;
	line-height: 1;
	border-radius: 7px;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.schoolFeeSectionAmountDetailBox {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px 12px;
}

.schoolFeeSectionAmountLabel {
	font-size: 8.6px;
	font-weight: 700;
	line-height: 1;
	color: #8c8c8c;
}

.schoolFeeSectionAmountValue {
	font-weight: 700;
	line-height: 1.4;
}

.schoolFeeSectionIcon {
	font-size: 14px;
	font-weight: 600;
}

.schoolFeeSectionAmountDue {
	font-size: 120%;
	font-weight: 700;
	color: #d92a25;
}

@media screen and (max-width: 991px) {
	.row.topFormSectionBox .col-md-6:nth-child(1) {
		padding-right: 15px;
	}

	.row.topFormSectionBox .col-md-6:nth-child(2) {
		padding-left: 15px;
	}
}

@media screen and (max-width: 768px) {
	.table-responsive {
		border-radius: 7px;
		border: none;
		margin: 0;
		overflow-x: auto;
		overflow-y: auto;
	}

	.table-responsive::-webkit-scrollbar {
		height: 5px;
	}

	.table-responsive::-webkit-scrollbar-track {
		background: #efefef;
	}

	.table-responsive::-webkit-scrollbar-thumb {
		background: rgb(0, 136, 255);
	}

	.table-responsive .pageTable tbody tr td {
		white-space: wrap;
	}
}

@media screen and (max-width: 575px) {
	.studentIdCard {
		flex-direction: column;
	}

	.studentCardLeft {
		width: 100%;
	}

	.studentCardRight {
		width: 100%;
		/* padding: 4px; */
	}

	.studentProfileBox {
		width: 180px;
		margin: auto;
		max-width: 100%;
		padding-top: 7px;
	}

	.schoolFeeSectionAmountCard {
		padding: 10px 12px;
	}

	.schoolFeeSectionAmountText {
		width: 100%;
	}

	.accountQuickSummaryCards {
		font-size: 12px;
	}
}

/* Rest Files */

.navbar.navbar-default.navbar-fixed-top {
	position: sticky;
	top: 0;
	margin: 0;
}

ul.subup a {
	font-weight: 400;
}

.editContent {
	padding: 18px 0 0;
}

/* Header Navigation */

.linkBox {
	text-align: right;
	color: #206c6d !important;
	text-transform: capitalize;
	width: 100%;
	display: block;
}

.whiteText {
	color: white !important;
}

.header ul,
.header ol,
.header li {
	margin: 0;
	list-style: none;
}

.header {
	top: 0;
	padding: 7px 0;
	position: sticky;
	z-index: 1010;
	width: 100%;
	font-size: 12px;
	color: #787878;
	transition: 0.3s;
	background-color: white;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.header div[class*="col"] {
	position: initial;
}

.header .row.align-items-stretch {
	/* display: flex; */
	/* align-items: stretch; */
}

.header .row.align-items-stretch {
	/* display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: space-between; */
}

.header .headerRow {
	display: flex;
	align-items: stretch;
	gap: 12px;
	justify-content: space-between;
}

.header.sticky {
	color: black;
	position: fixed;
}

.logoContainer {
	padding: 11px 0;
	width: 118px;
	max-width: 100%;
}

.logoContainer img {
	width: 100%;
	display: block;
}

.navigationLeft {
	display: flex;
	align-items: center;
}

.linksContainer {
	/* height: 100%; */
	width: 100%;
	transition: 0.3s;
}

.navigationLinks {
	list-style: none;
	width: 100%;
	margin: 0;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.navigationLinks.center {
	justify-content: center;
}

.navigationLinkContainer {
	padding: 0;
	gap: 4px;
	display: flex;
	align-items: center;
}

.navigationLinkContainer a {
	font-size: inherit;
	position: relative;
}

/* .navigationLinkContainer > a {
  color: inherit;
  padding: 7px 10px;
  font-weight: 500;
} */
.navigationLinkContainer>a {
	color: inherit;
	font-weight: 600;
}

.navigationLinkContainer>a {
	padding: 8px 6px 8px 12px;
	border-radius: 50px;
	/* background: linear-gradient(135deg, #ffffff, #f3f4ff, #ffffff); */
	color: black;
	background-size: 200%;
	/* box-shadow: 0 0 5px rgba(0,0,0,0.1); */
}

.navigationLinkContainer.active>a,
/* .navigationLinkContainer:hover > a { */
	{
	background: linear-gradient(139deg, #ccf1ff, skyblue);
}

a.modalBtn {
	padding: 6px 10px;
	color: white;
	display: flex;
	width: max-content;
	font-weight: 600;
	margin-right: 7px;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
	border-radius: 5px;
}

.navigationMenuOpen {
	display: none;
}

.haveDropDown,
.haveSubDropDown {
	position: relative;
}

.dropDown {
	font-weight: 400;
	top: 100%;
	left: 0;
	z-index: 1;
	width: 180px;
	opacity: 0;
	visibility: hidden;
	transition: 0.5s;
	position: absolute;
	color: black;
	/* transform: translateY(20px); */
	/* border-radius: 4px; */
	/* padding: 5px 0; */
	/* box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); */
	pointer-events: none;
}

@media screen and (min-width: 1240px) {
	/* ul.navigationLinks.center {
    gap: 4px 8px;
  } */
}

@media screen and (min-width: 991px) {
	.haveSubDropDown .dropDown {
		top: 0;
		left: 100%;
		transform: translateX(20px);
	}
}

.haveSubDropDown .dropDown.left {
	right: 100%;
	left: unset;
	transform: translateX(-20px);
}

.haveDropDown.active>.dropDown {
	opacity: 1;
	visibility: visible;
	pointer-events: initial;
	display: block !important;
	transform: translateY(0);
}

/* .haveDropDown:hover > .dropDown,
.haveSubDropDown:hover > .dropDown {
  opacity: 1;
  visibility: visible;
  pointer-events: initial;
  transform: translateY(0);
} */
.dropDown a {
	font: inherit;
	color: black;
	transition: 0.3s;
}

.dropDown a:hover {
	color: white;
	background-color: var(--primaryColor);
}

.megaMenuRow {
	border-top: 2px solid #206c6d;
	background-color: white;
	padding: 12px;
	border-radius: 0 0 10px 10px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.16), 2px 2px 7px rgba(0, 0, 0, 0.2);
}

.dropDownContainer .dropDownLinkBox.hasSubMegaMenu>a {
	font-weight: bold;
}

.dropDownContainer .dropDownLinkBox:last-child {
	border: none;
}

.dropDownLinkBox a {
	display: flex;
	padding: 10px 12px;
}

.mobileNav {
	display: none;
}

.contactInfo {
	width: 100%;
	position: relative;
}

.mobileNav .contactInfo a {
	display: block;
	font-size: 14px;
	font-weight: 600;
	padding: 7px 16px;
	position: relative;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow-x: hidden;
}

.mobileNav .contactInfo a i {
	margin-right: 5px;
}

.mobileNav .social-icons {
	padding: 7px 12px;
	display: flex !important;
}

.goBackBtn {
	display: none;
	background-color: #efefef;
}

.navigationProfile {
	display: none;
}

.navigationProfile img {
	width: 70px;
	height: 70px;
	object-fit: contain;
	border-radius: 45px;
}

.profileContainer {
	display: flex;
	align-items: center;
	padding: 20px 12px;
	background: linear-gradient(0deg, #f1f1f1, transparent);
}

.profileDetails {
	width: calc(100% - 70px);
	padding-left: 12px;
}

.profileName {
	width: 100%;
	font-size: 17px;
	line-height: normal;
	margin-bottom: 2px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.profileLogin a {
	color: red;
}

.fixedNavigationPhoneText {
	display: none;
}

.blog-wrapper .row {
	display: flex;
	flex-wrap: wrap;
}

a.viewMoreBtn {
	justify-content: flex-end;
	text-align: right;
	color: #206c6d;
}

.profileNameBox {
	padding: 7px 7px;
	font-size: 15px;
	font-weight: bold;
}

.profileNameBox span {
	display: block;
	border: 1px dashed #d8d8d8;
	padding: 10px 7px;
	border-radius: 5px;
}

a.profileBox {
	width: 36px;
	padding: 0;
	font-size: 18px;
	display: flex;
	margin: 0 8px;
}

a.profileBox i {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50%;
	margin: 0;
	aspect-ratio: 1;
	color: red;
	display: flex !important;
	align-items: center;
	justify-content: center;
	transition: 0.3s;
	box-shadow: 1px 1px 7px -2px rgb(255 0 0 / 19%),
		inset 1px 1px 4px rgb(255 255 255);
}

a.profileBox i:hover {
	color: white;
	background-color: red;
}

li.dropdown-header {
	padding: 8px 12px 5px;
	font-size: 95%;
	font-weight: 500;
	border: none;
	color: hsl(197 80% 50% / 1);
	border-radius: inherit;
	/* background: var(--primaryGradient); */
}

li.dropDownLinkBox.haveSubDropDown>a::after {
	transition: 0.3s;
}

li.dropDownLinkBox.haveSubDropDown.active>a::after {
	transform: rotate(90deg);
}

.headerTopRightContainer {
	display: flex;
	align-items: center;
}

img.eschoolPanelImage {
	max-width: 100%;
	width: 80px;
	display: block;
	padding: 0 8px;
	margin-bottom: 4px;
}

.menuSupText {
	color: red;
	font-weight: bold;
}

/* Rest Pages Work */

.resultPageSearchTitle {
	font-size: 14px;
	color: black;
	background: white;
	padding: 7px 12px;
	line-height: 1.3;
	margin: 14px 0 10px;
	border-radius: 12px;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.resultPageSearchTitle b {
	font-weight: bold;
}

.resultPageTableBox {
	padding: 10px;
	border-radius: 12px;
	background: white;
	overflow: hidden;
	box-shadow: 0 0 5px rgb(212 215 222);
}

.resultPageTableBox .table-responsive {
	overflow-y: auto;
	max-height: 75vh;
}

.tableDataBig {
	min-width: 200px;
}

.resultPageTable {
	margin: 0;
}

.resultPageTableHeader {
	background: #f6f8fe;
	position: sticky;
	top: -1px;
	box-shadow: 0 0 5px #bcc2d252;
}

.resultPageTable .resultPageTableHeader .resultPageTableRow .resultPageTableHeading {
	white-space: nowrap;
	font-weight: 700;
	border: 1px solid #edf1fd !important;
	padding: 10px 12px !important;
}

.resultPageTable .resultPageTableContent .resultPageTableRow td.resultPageTableData {
	font-weight: 500;
	border: 1px solid #edf1fd;
	padding: 4px 10px;
	text-align: center;
}

table.resultPageTable {
	border-radius: 7px;
}

a.resultPageTableDataNameField:focus {
    color: red;
}

.resultPageTable .resultPageTableContent .resultPageTableRow {
	background-color: white;
}

.resultPageTable .resultPageTableContent .resultPageTableRow:nth-child(even) {
	background-color: #fafafa;
}

.resultPageTableBtn {
	display: flex;
	gap: 5px;
}

.resultPageTableDataNameField img {
	width: 15px;
	margin-left: 5px;
	display: inline-block;
}

/* Multi Step Form Work Start */
.multiStepFormHeaderBox {
	padding: 10px 12px 6px;
	background: white;
	border-radius: 12px;
	box-shadow: var(--primaryShadow);
}

.multiStepFormHeadCardContainer {
	position: relative;
	width: 100%;
}

.multiStepFormHeadCardBox {
	display: flex;
	align-items: center;
	justify-content: space-between;
	text-align: center;
}

.multiStepFormHeadCard {
	padding: 4px 8px;
	cursor: pointer;
	position: relative;
	z-index: 2;
}

.multiStepFormHeadCount {
	height: 40px;
	width: 40px;
	border-radius: 50px;
	display: flex;
	background: linear-gradient(45deg, #eaecf1, #eaecf1);
	justify-content: center;
	font-size: 18px;
	font-weight: 600;
	transition: 0.5s;
	border: 3px solid #e6e6e6;
	box-shadow: inset 4px 4px 5px rgb(255 255 255 / 90%);
	align-items: center;
}

.multiStepFormHeadCard.active .multiStepFormHeadCount {
	text-shadow: 1px 1px 6px white;
	background: linear-gradient(45deg, rgb(174 184 255), #eaecf1);
	box-shadow: none;
	border: 3px solid var(--primaryColor);
}

.multiStepFormHeadTitle {
	font-weight: 600;
	text-align: center;
	text-transform: capitalize;
}

.multiStepFormProgressBox {
	pointer-events: none;
	height: 4px;
	width: calc(100% - 40px);
	position: absolute;
	top: 22px;
	left: 50%;
	z-index: 1;
	background-color: #f2f2f2;
	transform: translateX(-50%);
}

.multiStepFormProgress {
	height: 100%;
	width: 0;
	transition: 0.5s;
	transform-origin: left;
	background: var(--primaryGradient);
	background-color: rebeccapurple;
}

.multiStepFormContentSlide {
	display: none;
}

.multiStepFormContentSlide {
	border-radius: 12px;
	margin-top: 14px;
	padding: 1px 16px 16px;
	background: white;
	box-shadow: var(--primaryShadow);
}

.multiStepFormTitle {
	font-size: 16px;
	font-weight: 500;
	margin: 15px 0px 7px;
}

.multiStepFormInputLabel {
	margin: 0;
	display: block;
}

.multiStepFormLabelText {
	font-weight: 600;
	padding-left: 7px;
}

.multiStepFormInputCard {
	margin-bottom: 12px;
}

.multiStepFormContentTableBox {
	border-radius: 7px;
	/* border: 1px solid #eaecf1; */
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 0 5px rgb(0 0 0 / 8%);
}

.multiStepFormContentTable {
	margin: 0;
}

thead.multiStepFormContentTableHeader th.multiStepFormContentTableHeading {
	background: #f6f8fe;
	padding: 7px 12px;
	font-size: 14px;
	font-weight: 600;
	border: none;
}

thead.multiStepFormContentTableHeader th.multiStepFormContentTableHeading:first-child {
	max-width: 120px;
	width: 70px;
}

tbody.multiStepFormContentTableContent {
	background-color: white;
}

tbody.multiStepFormContentTableContent tr.multiStepFormContentTableRow:nth-child(even) {
	background-color: #fafafa;
}

tbody.multiStepFormContentTableContent tr.multiStepFormContentTableRow:hover {
	background-color: #efefef;
}

tbody.multiStepFormContentTableContent td.multiStepFormContentTableData {
	border: 1px solid #eaecf194;
	text-align: center;
	font-weight: 500;
	padding: 5px 12px;
	vertical-align: middle;
	line-height: 1.2;
}

/* Multi Step Form Work End */

/* Front Desk Header Work Start */
.frontDeskHeaderContainer {
	padding: 16px 0px 10px;
	width: 100%;
}

.frontDeskHeaderContentBoxesContainer {
	display: block;
}

.frontDeskHeaderContentBoxes {
	width: 100%;
	display: flex;
	gap: 7px 12px;
	flex-wrap: wrap;
	align-items: center;
	/* margin: 16px auto 12px; */
	justify-content: space-evenly;
}

.frontDeskHeaderBox {
	width: max-content;
	/* margin: 14px auto 12px; */
	padding: 7px;
	max-width: 100%;
	border-radius: 150px;
	background: white;
	box-shadow: var(--primaryShadow);
}

.frontDeskHeaderCardListToggler {
	display: none;
}

.frontDeskHeaderListItem.frontDeskHeaderListItemOnlyMobile {
	display: none;
}

.frontDeskHeaderCardList {
	width: max-content;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px 4px;
	flex-wrap: wrap;
	max-width: 100%;
	margin: auto;
}

a.frontDeskHeaderLink {
	padding: 7px 12px;
	display: flex;
	border-radius: 100px;
	color: black;
	font-weight: 600;
	line-height: 1.6;
	transition: 0.3s;
	align-items: center;
}

a.frontDeskHeaderLink.active {
	color: white;
	background: var(--primaryColor);
}

a.frontDeskHeaderLink:hover {
	color: white;
	background-color: black;
}

/* Front Desk Header Work End */

/* Short Leave Page Work*/

.shortLeaveMainContainer {
	padding: 10px 16px 16px;
	background: white;
	border-radius: 12px;
	box-shadow: var(--primaryShadow);
}

.customTabHeadNav,
.shortLeaveHeadNavigationContainer {
	border: none;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 8px 12px;
	padding: 0 0 0px 10px;
}

.customTabHeadNav::before {
	display: none;
	/* padding: 0; */
}

.customTabHeadNav li a,
li.shortLeaveHeadNavigationBox a {
	padding: 6px 18px;
	border: none;
	border-radius: 70px;
	font-weight: 600;
	color: var(--primaryColor);
	font-size: 15px;
	/* margin-right: 12px; */
	transition: 0.5s;
	background-image: linear-gradient(45deg, #eaecf1, #ffffff);
	background-color: #fff;
	box-shadow: 0 0 3px #c7c7c7;
}

.customTabHeadNav li.active a,
li.shortLeaveHeadNavigationBox.active a {
	border: none !important;
	color: white !important;
	text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
	background-image: linear-gradient(45deg, #848fdf, #5d6bd5);
}

.customTabHeadNav li:hover a,
.customTabHeadNav li.active:hover a,
li.shortLeaveHeadNavigationBox:hover a,
li.shortLeaveHeadNavigationBox.active:hover a {
	color: white !important;
	background-color: black;
	background-image: none;
	border: none !important;
}

.shortLeaveFormContainer {
	height: 100%;
}

.shortLeaveFormBox {
	height: 100%;
}

.shortLeaveForm {
	/* border: 1px solid #eaecf1; */
	padding: 12px 16px 16px;
	border-radius: 7px;
	height: 100%;
	background: linear-gradient(180deg, #ffffff, #fcfcfc);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.13);
}

.customTabHeadNavTitle,
.shortLeaveFormTitle {
	font-size: 18px;
	font-weight: 600;
	text-align: center;
}

.customFormGroupTitle {
	font-size: 16px;
	font-weight: 600;
	padding: 5px 12px;
	margin-top: 14px;
	margin-bottom: 8px;
	color: var(--primaryColor);
	border: 2px dotted #e0e3eb;
	border-width: 2px 0;
}

.customInputContainer,
.shortLeaveFormInputBox {
	margin-bottom: 8px;
}

.inputBox {
	padding: 4px 10px 8px;
	width: 100%;
	margin-bottom: 12px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.row [class*="col"]:last-child .inputBox {
	border: none;
	margin: 0;
}

.customInputLabel,
.shortLeaveFormInputTitle {
	font-size: 12px;
	font-weight: 600;
	color: #6b6b6b;
	padding-left: 4px;
	margin-bottom: 2px;
}

.shortLeaveFormInputFieldsBox {
	display: flex;
	gap: 8px 12px;
	flex-direction: column;
}

.shortLeaveFormInputField {
	display: flex;
	align-items: stretch;
	border: 1px solid #dadee7;
	position: relative;
	border-radius: 100px;
}

.customInputFields,
.btn.dropdown-toggle.btn-default,
select.customInputFields~.btn-group .btn,
.shortLeaveFormInputField input,
.shortLeaveFormInputField textarea,
.shortLeaveFormInputField select {
	width: 100%;
	border-radius: 150px;
	border: none !important;
	box-shadow: none !important;
	background: white;
	font-size: 14px;
	font-weight: 500;
	height: unset;
	padding: 6px 12px;
	outline: none !important;
	vertical-align: middle;
}


.customInputFields:focus,
.btn-group:focus-within button.btn,
.dropdown-toggle:focus-within {
    box-shadow: 0 0 1px 2px #0000ff5c !important;
}

select option {
	background-color: white;
}

.bootstrap-select .btn.dropdown-toggle.btn-default {
	outline: none !important;
}

select.customInputFields {
    padding: 5.5px 12px;
}

.customTable .btn.dropdown-toggle.btn-default,
.customTable select.customInputFields~.btn-group .btn,
.customTable .customInputFields {
	font-size: inherit;
}

.dropdown-toggle::after {
    vertical-align: middle;
    content: "\f078";
    font-size: 10px;
    font-family: "FontAwesome";
    border: none;
    margin: 0;
    position: absolute;
    padding-bottom: 3px;
    right: 3px;
    top: 50%;
    transform: translateY(-49%);
}

select.customInputFields~.btn-group .btn,
.customInputFields {
	border: 1px solid #dadee7 !important;
}

select.customInputFields~.btn-group .btn {
	text-overflow: ellipsis;
	overflow: hidden;
	text-align: left;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

textarea.customInputFields,
.shortLeaveFormInputField.textarea textarea {
	border-radius: 12px;
	resize: vertical;
	min-height: 60px;
}

.shortLeaveFormInputField.textarea {
	border-radius: 12px;
}

select.customInputFields~.btn-group {
	/* display: block; */
	width: 100%;
	text-align: left;
}

.feePageSearchStudentContainer select.customInputFields~.btn-group b.caret {
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
}

select.customInputFields~.btn-group input {
	border-radius: 4px;
}

select.customInputFields~.btn-group .checkbox {
	position: relative;
}

select.customInputFields~.btn-group .btn {
	text-overflow: ellipsis;
	overflow: hidden;
	text-align: left;
	position: relative;
	display: flex;
	gap: 4px;
	padding: 6.5px 12px;
	align-items: center;
	justify-content: space-between;
}

.bigForm {
	position: relative;
}

.bigForm .customInputContainer {
	margin-bottom: 12px;
}

.bigForm .customInputFields {
	border-width: 0 0 1px 0 !important;
	border-radius: 0;
	transition: 0.3s;
	background: linear-gradient(180deg, #ffffff, #fafafa);
}

.bigForm .customInputFields:focus {
	border-color: var(--primaryColor) !important;
	box-shadow: 0 1px var(--primaryColor) !important;
}

.customInlineField {
	width: unset;
}

.shortLeaveFormInputMiscBtn button,
.shortLeaveFormInputMiscBtn a {
	height: 100%;
	border-radius: inherit;
	overflow: hidden;
	position: absolute;
	right: 0px;
	border: none;
	outline: none;
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1;
	background: linear-gradient(45deg, #ff0000, #ef0000);
	color: white;
	box-shadow: inset 4px 1px 6px rgba(255, 255, 255, 0.6),
		inset -2px 0px 5px #00000038;
}

.shortLeaveFormInputMiscBtn {
	border-radius: inherit;
}

button.add_field_button {
	background: linear-gradient(45deg, #15e14e, #057f00);
}

.row.shortLeaveStudentSectionImageContainer {
	display: flex;
	flex-wrap: wrap;
	padding: 8px 1px 10px;
	/* justify-content: center; */
}

.customProfileImageBox,
.shortLeaveStudentSectionImageBox {
	padding-bottom: 12px;
}

.customProfileImageCard,
.shortLeaveStudentSectionImageCard {
	position: relative;
	width: 100%;
	padding: 7px 7px 4px 7px;
	border-radius: 5px;
	/* border: 1px solid #dadee7; */
	font-size: 10px;
	background: white;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
	text-align: center;
}

.customProfileImageCard img,
.shortLeaveStudentSectionImageCard img {
	width: 100%;
	margin: 0;
	aspect-ratio: 9/11;
	object-fit: cover;
	border-radius: 4px;
	border: 1px solid #dadee7;
}

.customProfileImageCard label,
.shortLeaveStudentSectionImageTitle {
	font-weight: 600;
	color: #676767;
	margin: 2px 0 0;
	display: block;
}

.customInputRadioList,
.shortLeaveFormInputFieldRadioListBox {
	display: flex;
	gap: 15px;
	padding: 5px 10px 10px;
	flex-wrap: wrap;
	min-height: 34px;
}

.customInputRadioLabel,
label.shortLeaveFormInputFieldRadioListItem {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	line-height: 1.3;
	font-size: 14px;
	font-weight: 600;
	color: #555555;
	cursor: pointer;
}

.customInputRadioLabel input,
label.shortLeaveFormInputFieldRadioListItem input {
	margin: 0;
	line-height: 1;
	height: 16px;
	width: 16px;
	cursor: pointer;
}

.customCameraPhotoCaptureContainer video,
.customCameraPhotoCaptureContainer canvas,
.customCameraPhotoCaptureContainer img,
.shortLeaveFormVideo,
.shortLeaveFormVideo video,
.shortLeaveFormPhotoSnapshotCard,
.shortLeaveFormPhotoSnapshotCard img {
	width: 100% !important;
	height: unset !important;
	aspect-ratio: 1.7/1;
	object-fit: cover;
}

.shortLeaveFormVideoCard {
	position: relative;
}

.shortLeaveFormVideo {}

.customCameraPhotoCaptureContainer video,
.shortLeaveFormVideo video {
	display: block;
	border: none;
	border-radius: 8px;
}

.customCameraPhotoCaptureVideo {
	position: relative;
	display: flex;
	justify-content: center;
}

.customCameraPhotoCaptureBtnsContainer {
	bottom: 7px;
	max-width: 100%;
	position: absolute;
}

.shortLeaveFormVideoBtn {
	position: absolute;
	bottom: 8px;
	width: max-content;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 52px;
	border: none;
	outline: none;
	padding: 6px 18px;
	height: unset;
	font-weight: 600;
	color: white;
	transition: 0.3s;
	background: var(--primaryColor);
	box-shadow: 0 0 10px rgb(0 0 0 / 45%), inset 2px 2px 5px #ffffff57,
		inset -2px -2px 5px #00000040;
}

.shortLeaveFormVideoBtn:hover {
	background: black;
}

.customCameraPhotoCapturedImage,
.shortLeaveFormPhotoSnapshotContainer {
	margin-top: 12px;
	border-radius: 7px;
	border: 1px solid #dadee7;
	padding: 12px;
}

.customCameraPhotoCapturedImage {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

.customCameraPhotoCapturedImage::after {
	content: "Captured Image Will appear here.";
	max-width: calc(100% - 26px);
	position: absolute;
	opacity: 0.3;
}

.customCameraPhotoCaptureContainer canvas,
.shortLeaveFormPhotoSnapshotContainer img {
	border-radius: 6px;
	box-shadow: 0 0 3px rgb(0 0 0 / 40%);
	position: relative;
	z-index: 1;
}

/* Short Leave Page end */

/* Daily Update Modal Work Start */

.dailyUpdateSectionBtnContainer {
	position: fixed;
	bottom: 80px;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	cursor: pointer;
	z-index: 300;
	background: inherit;
	padding-left: 10px;
}

.dailyUpdateSectionBtnTextCard {
	width: max-content;
	position: absolute;
	pointer-events: none;
	right: 100%;
}

.dailyUpdateSectionBtnContainer:hover .dailyUpdateSectionBtnTextCard {
	pointer-events: all;
}

.dailyUpdateSectionBtnText {
	position: relative;
	background: white;
	padding: 7px 12px 7px 16px;
	border-radius: 60px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	opacity: 0;
	transition: 0.5s;
	transform: scaleX(0);
	transform-origin: right;
	pointer-events: none;
	filter: drop-shadow(var(--primaryShadow));
}

.dailyUpdateSectionBtnContainer:hover .dailyUpdateSectionBtnText {
	opacity: 1;
	pointer-events: all;
	transform: scaleX(1);
}

.dailyUpdateSectionBtnText:hover {
	color: white;
	background-color: var(--primaryColor);
}

.dailyUpdateSectionBtnText::after {
	content: "";
	height: 10px;
	width: 10px;
	background: inherit;
	position: absolute;
	top: 50%;
	right: -2px;
	transform: translateY(-50%) rotate(45deg);
}

.dailyUpdateSectionBtnIconCard {
	background: inherit;
	position: relative;
}

.dailyUpdateSectionBtnIconCard::after,
.dailyUpdateSectionBtnIconCard::before {
	content: "";
	position: absolute;
	height: 12px;
	width: 12px;
	background: var(--primaryBackground);
	right: 0;
	z-index: 1;
}

.dailyUpdateSectionBtnIconCard::after {
	top: 100%;
	border-top-right-radius: 30px;
}

.dailyUpdateSectionBtnIconCard::before {
	bottom: 100%;
	border-bottom-right-radius: 30px;
}

.dailyUpdateSectionBtnIcon {
	padding: 12px 12px 12px 12px;
	background: white;
	border-radius: 40px 0 0 40px;
	font-size: 16px;
	color: white;
	position: relative;
	transition: 0.2s;
	font-weight: 700;
	background: var(--primaryColor);
	text-shadow: 1px 1px black;
}

.dailyUpdateSectionBtnContainer:hover .dailyUpdateSectionBtnIcon {
	background-color: black;
	padding: 12px 14px;
}

.dailyUpdateSectionBtnIcon::after,
.dailyUpdateSectionBtnIcon::before {
	content: "";
	position: absolute;
	height: 12px;
	width: 12px;
	right: 0;
	background: inherit;
}

.dailyUpdateSectionBtnIcon::after {
	top: 100%;
}

.dailyUpdateSectionBtnIcon::before {
	bottom: 100%;
}

/* Daily Update Modal */

.dailyUpdateModalContainer {
	position: fixed;
	top: 0;
	left: 0;
	padding: 40px 16px;
	z-index: 1020;
	background: rgb(255 255 255 / 83%);
	width: 100%;
	backdrop-filter: blur(5px);
	height: 100vh;
	display: none;
}

.dailyUpdateModalBox {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.dailyUpdateModalContentContainer {
	position: relative;
}

.dailyUpdateModalContent {
	max-height: calc(100vh - 80px);
	overflow-y: auto;
	background: white;
	border-radius: 6px;
	max-width: 850px;
	box-shadow: var(--primaryShadow);
	padding: 22px 16px;
}

.dailyUpdateModalCloseBtnBox {
	position: absolute;
	bottom: 100%;
	right: 20px;
	height: 24px;
	width: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	background: red;
	color: white;
	font-size: 14px;
	transition: 0.3s;
	cursor: pointer;
	border-radius: 8px 8px 0 0;
	box-shadow: inset 2px 1px 4px rgba(255, 255, 255, 0.7),
		inset -2px -1px 2px rgba(0, 0, 0, 0.2);
}

.dailyUpdateModalCloseBtnBox:hover {
	background-color: black;
}

.dailyUpdateCardBox {
	box-shadow: var(--primaryShadow);
	border-radius: 6px;
	margin-bottom: 14px;
	padding: 8px;
}

.dailyUpdateCardBox:last-child {
	margin: 0;
}

.dailyUpdateText {
	padding: 6px 12px;
	border: 2px dotted #efefef;
	font-size: 14px;
	border-radius: 5px;
	margin-bottom: 7px;
	background: linear-gradient(45deg, #fafefa, transparent);
}

.dailyUpdateUserInfo {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.dailyUpdateUserNameBox,
.dailyUpdateUserDateBox {
	display: flex;
	gap: 6px;
	line-height: 1;
	font-weight: 600;
	color: #5f5f5f;
	padding: 0px 10px;
	align-items: center;
}

.dailyUpdateUserNameIconBox,
.dailyUpdateUserDateIconBox {
	background: linear-gradient(45deg, var(--primaryColor), #29daff);
	color: black;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	font-size: 130%;
}

/* Daily Update Modal Work End*/

/* Record Visitor Page Work Start*/

.parentvisitortable {
	display: none;
}

/* Record Visitor Page Work End*/

/* Admission all Sections Start */
.timeLineList {
	display: flex;
	width: max-content;
	align-items: center;
	font-size: 12px;
	flex-wrap: wrap;
	gap: 8px 18px;
	padding: 8px;
	margin: auto;
	max-width: 100%;
	align-items: center;
	justify-content: center;
	background: white;
	border-radius: 40px;
	box-shadow: var(--primaryShadow);
}

.timeLine {
	padding: 16px 0px 0px;
}

.timeLineListItem {
	list-style: none;
	position: relative;
	text-align: center;
}

.timeLineCard {
	display: flex;
	gap: 6px;
	color: black;
	align-items: center;
	padding: 4px;
	transition: 0.5s;
	border-radius: 50px;
	background: white;
	position: relative;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.14);
}

.timeLineListItem:not(:last-child) .timeLineCard::after {
	content: "\f101";
	font-weight: bold;
	color: rgb(210 210 210);
	font-family: "fontAwesome";
	left: calc(100% + 6px);
	position: absolute;
	font-size: 100%;
}

.timeLineCount {
	font-size: calc(100% + 3px);
	width: 28px;
	height: 28px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--primaryColor);
	color: white;
	border-radius: 50px;
	font-weight: bold;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.4);
	box-shadow: inset 1px 1px 5px rgba(255, 255, 255, 0.4),
		inset -1px -1px 5px rgba(0, 0, 0, 0.2);
}

.timeLineTitle {
	font-weight: 600;
	font-size: 90%;
	padding-right: 8px;
}

.active-tl.timeLineListItem .timeLineCard {
	color: white;
	background-color: var(--primaryColor);
}

.active-tl.timeLineListItem .timeLineCount {
	background-color: white;
	color: black;
	text-shadow: none;
	box-shadow: none;
}

.timeLineListItem:hover .timeLineCard {
	background-color: black;
	color: white;
}

.timeLineListItem:hover .timeLineCount {
	background-color: white;
	color: black;
	text-shadow: none;
	box-shadow: none;
}

/* Admission all Sections End */

/* Footer Start */

.footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: unset;
	padding: 5px 0;
	background: linear-gradient(0deg, #eaecf1, white);
	z-index: 10;
	font-weight: 500;
	border: none !important;
	box-shadow: 0 0 5px #b6bcce;
}

.footer select {
	border: none;
	padding: 1px 3px;
	border-radius: 4px;
	color: var(--primaryColor);
	margin: 0 0 0 5px;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.25);
}

/* Footer End */

@media only screen and (min-width: 575px) and (max-width: 768px) {
	.col-sm-6 {
		width: 50%;
		float: left;
	}
}

@media only screen and (min-width: 575px) {
	.pl-sm-2 {
		padding-left: 7px !important;
	}

	.pr-sm-2 {
		padding-right: 7px !important;
	}

	.mt-0 {
		margin-top: 0 !important;
	}

	.mt-sm-0 {
		margin-top: 0 !important;
	}
}

@media only screen and (min-width: 768px) {
	.mt-md-0 {
		margin-top: 0 !important;
	}
}

@media only screen and (min-width: 992px) {
	.menuSupText {
		top: 2px;
		font-size: 75%;
		margin-left: 2px;
	}

	li.dropDownLinkBox.haveSubDropDown>a {
		background-color: #f9faff;
		font-weight: 600;
		border-radius: 4px;
		padding: 5px 12px 4px;
	}

	li.dropDownLinkBox.haveSubDropDown:hover>a,
	li.dropDownLinkBox.haveSubDropDown.active>a {
		background: var(--primaryColor);
		color: white;
	}

	li.dropDownLinkBox.haveSubDropDown .dropDown {
		transition: none;
	}

	li.dropDownLinkBox.haveSubDropDown .dropDown {
		display: none;
		position: static;
		visibility: visible;
		opacity: 1;
		transform: none;
		padding: 7px 12px;
		pointer-events: all;
	}

	li.dropDownLinkBox.haveSubDropDown.active .dropDown {
		/* padding: 7px 12px; */
	}

	ul.navigationLinks.center {
		padding: 0px 8px 0px 8px;
		border: 1px solid hsl(223 20% 89% / 1);
		box-shadow: 0 0 20px 0px rgb(120 120 120 / 10%);
		border-radius: 500px;
	}

	.navigationLinkContainer>a:hover {
		background-position: right;
		color: black !important;
	}

	.mainNavigationContainer .navigationLinks {
		gap: 0px;
		flex-wrap: wrap;
	}

	.mainNavigationContainer .haveDropDown>a {
		display: flex;
		align-items: center;
	}

	.mainNavigationContainer .haveDropDown>a::after {
		content: "\f107";
		font-weight: bold;
		margin: 2px 4px;
		display: inline;
		font-size: 82%;
		aspect-ratio: 1;
		transition: 0.3s;
		font-family: "fontAwesome";
	}

	.mainNavigationContainer .haveDropDown.current>a,
	.mainNavigationContainer .haveDropDown.active>a {
		background: linear-gradient(45deg, #dfe4ff, #daf1ff);
	}

	.mainNavigationContainer .haveDropDown.active>a::after {
		transform: rotate(180deg);
	}

	.dropDown {
		/* max-height: 75vh; */
		width: 220px;
	}

	.dropDownLinkBox a {
		display: flex;
		padding: 4px 12px;
		font-size: 90%;
		border-bottom: 1px solid rgb(162 162 162 / 10%);
	}

	.dropDownContainer .dropDownLinkBox:last-child>a {
		border: none;
	}

	.haveSubDropDown>a::after {
		content: "\f105";
		position: absolute;
		font-weight: bold;
		font-family: "fontAwesome";
		right: 10px;
		color: inherit;
	}

	/* New Style */

	/* li.navigationLinkContainer.haveDropDown:hover::before {
  background: white;
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  height: calc(100% + 10px);
  width: calc(100% + 10px);
  border-radius: 22px 22px 0 0;
  z-index: -1;
} */
	li.navigationLinkContainer.haveDropDown {
		padding: 7px 0;
		gap: 4px;
		display: flex;
		align-items: center;
	}

	li.navigationLinkContainer.haveDropDown.active::before {
		background: white;
		content: "";
		position: absolute;
		top: -1px;
		left: -10px;
		height: calc(100% + 10px);
		width: calc(100% + 20px);
		border-radius: 22px 22px 0 0;
		z-index: -1;
		border: solid #c2c8d6;
		border-width: 1px 1px 0 1px;
	}

	li.navigationLinkContainer.haveDropDown.active::after {
		content: "";
		left: -9px;
		height: 15px;
		width: calc(100% + 18px);
		position: absolute;
		background: #ffffff;
		top: calc(100% - 4px);
		z-index: 1;
	}

	li.navigationLinkContainer.haveDropDown>.dropDown::before {
		content: "";
		width: calc(100% + 20px);
		height: 100%;
		position: absolute;
		left: -10px;
		top: 0px;
		background: white;
		border-radius: 10px;
		z-index: -1;
		border: 1px solid #c2c8d6;
		border-radius: 0 10px 10px 10px;
	}

	li.navigationLinkContainer.haveDropDown>.dropDown .dropDownContainer {
		max-height: 75vh;
		overflow-y: auto;
		overflow-x: hidden;
		width: 100%;
		background: white;
		border-radius: 6px;
		/* border: 1px solid rgb(234 234 234); */
		box-shadow: 0 0 1px rgba(0, 0, 0, 0.4);
	}

	li.navigationLinkContainer.haveDropDown.active {
		z-index: 100;
		/* filter: drop-shadow(0px 0px 40px #eaecf189); */
	}

	li.navigationLinkContainer.haveDropDown>.dropDown {
		font-weight: 400;
		top: calc(100% + 2px);
		left: 0;
		padding: 10px 0;
		position: absolute;
		color: black;
		/* transform: translateY(20px); */
		/* border-radius: 4px; */
		/* padding: 5px 0; */
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
		pointer-events: none;
		display: none;
		pointer-events: initial;
	}

	li.navigationLinkContainer.haveDropDown.active>.dropDown {
		display: block;
		/* opacity: 1;
  visibility: visible;
  pointer-events: initial; */
		transform: translateY(0);
		transition: none;
	}

	/*New Code End*/
}

@media only screen and (min-width: 1141px) {
	.table-responsive {
		overflow-x: auto;
	}

	.col-2-5 {
		width: 20%;
	}
}

@media only screen and (min-width: 1241px) {}

@media only screen and (min-width: 1367px) {}

@media only screen and (min-width: 1400px) {
	.header {
		font-size: 13px;
	}
}

@media only screen and (max-width: 1340px) {
	.header {
		font-size: 9px;
	}

	ul.navigationLinks.center {
		padding-left: 8px;
	}

	.table-responsive {
		overflow-x: auto;
	}
}

@media only screen and (max-width: 1140px) {
	.header {
		font-size: 9px;
	}

	ul.navigationLinks.center {
		padding-left: 8px;
	}

	.navigationLinkContainer>a {
		padding: 4px 2px 4px 1px;
	}

	.mainNavigationContainer .haveDropDown>a::after {
		margin: 2px 3px 2px 2px;
	}

	.navigationLinkContainer>a {
		padding: 4px 2px 4px 7px;
	}
}

@media screen and (max-width: 991px) {
	ul.navigationLinks.center {
		padding-left: 0px;
	}

	a.modalBtn {
		font-size: 10px;
		padding: 5px 10px;
	}

	.logoContainer {
		width: 80px;
	}

	.logOutSection {
		display: none;
	}

	.header {
		color: black;
	}

	.navigationMenuOpen {
		height: 28px;
		width: 28px;
		min-width: 28px;
		display: flex;
		align-items: center;
		font-size: 15px;
		justify-content: center;
		color: var(--primaryColor);
		cursor: pointer;
		border-radius: 3px;
		background-color: white;
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
	}

	.navigationMenuOpen i {
		margin: 0;
	}

	.profileIconBox {
		display: none;
	}

	.linksContainer {
		height: 100vh;
		top: 0;
		left: 0;
		width: 100%;
		position: fixed;
		pointer-events: none;
		opacity: 0;
		z-index: 1;
		backdrop-filter: blur(5px);
		background-color: rgba(0, 0, 0, 0.16);
	}

	.linksContainer.active {
		pointer-events: initial;
		opacity: 1;
	}

	.linksContainer div[class*="col"] {
		padding: 0;
	}

	.navigationLinkContainer a {
		transition: 0.5s;
		position: relative;
	}

	.navigationLinkContainer:hover>a {
		color: #ffffff;
		background-color: var(--primaryColor);
	}

	.navigationLinks {
		/* padding-top: 30px; */
		width: 100%;
		font-size: 12px;
		max-width: 280px;
		position: relative;
		justify-content: flex-start;
		flex-direction: column;
		background-color: white;
		transition: 0.5s;
		height: 100vh;
		display: block;
		/* padding-top: 20px; */
		overflow-y: auto;
		transform: translateX(-100%);
	}

	.linksContainer.active .navigationLinks {
		transform: translateX(0);
		display: block;
	}

	.navigationProfile {
		display: block;
	}

	.mobileNav {
		display: block;
	}

	.dropDownContainer {
		margin-bottom: 0px;
	}

	.goBackBtn {
		height: 39px;
		width: 100%;
		top: 0;
		left: 0;
		transition: 0.3s;
		align-items: center;
		cursor: pointer;
		z-index: 1;
		background-color: #efefef;
		display: none;
		position: fixed;
		font-size: 16px;
		font-weight: 600;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow-x: hidden;
	}

	.hasSubMegaMenu .goBackBtn {
		z-index: 1;
	}

	.goBackBtn i {
		font-size: 13px;
		margin: 0 7px 0 10px;
	}

	.mobileNav .closeBtn {
		height: 39px;
		width: 32px;
		top: 0;
		right: 0;
		display: flex;
		transition: 0.3s;
		align-items: center;
		justify-content: center;
		position: absolute;
		cursor: pointer;
		z-index: 100;
		background-color: transparent;
	}

	.mobileNav .closeBtn i {
		margin: 0;
	}

	.fixedNavigationPhoneText {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 80%;
		max-width: 280px;
		z-index: 1;
		display: block;
		line-height: 1.5;
		padding: 7px 12px;
		font-weight: 500;
		background-color: white;
	}

	.fixedPhoneLink {
		font-size: 1.3em;
		font-weight: bold;
	}

	.haveDropDown.active .goBackBtn,
	.haveSubDropDown.active .goBackBtn {
		display: flex;
	}

	.goBackBtn i {
		pointer-events: none;
	}

	.mobileNav .closeBtn:hover {
		color: white;
		background-color: #f00;
	}

	.navigationLinkContainer {
		padding: 0;
		position: relative;
		flex: initial;
	}

	.navigationLinkContainer a {
		padding: 9px 16px;
		display: block;
		width: 100%;
		border-radius: 0;
		/* font-size: 14px; */
	}

	navigationLinkContainer .navigationLinkContainer:hover>a {
		color: white;
		background-color: var(--primaryColor);
	}

	.navigationLinkContainer a.viewMoreBtn {
		margin: 7px auto;
		text-align: center;
		width: calc(100% - 24px);
		color: #206c6d;
		padding: 7px 12px;
		border-radius: 6px;
		transition: 0.33s linear;
		border: 1px solid #206c6d;
	}

	.navigationLinkContainer a.viewMoreBtn:hover {
		background-color: #206c6d;
		color: white;
	}

	.navigationLinkContainer .haveDropDown a

	/* .navigationLinkContainer .haveSubDropDown a */
		{
		padding: 7px 35px 7px 12px;
		display: block;
		width: 100%;
	}

	.navigationLinkContainer>a::before {
		display: none;
	}

	.dropDownLinkBox {
		position: relative;
	}

	.dropDownLinkBox:hover>a {
		color: white;
		background-color: var(--primaryColor);
	}

	.dropDownLinkBox.haveSubDropDown::before,
	.navigationLinkContainer.haveDropDown::before {
		content: "\f105";
		right: 0;
		padding-right: 15px;
		height: 100%;
		width: 100%;
		display: flex;
		position: absolute;
		font-family: "fontAwesome";
		justify-content: flex-end;
		align-items: center;
		z-index: 1;
		font-size: 14px;
		color: var(--primaryColor);
		font-weight: bold;
		cursor: pointer;
	}

	.dropDownLinkBox.haveSubDropDown:hover::before,
	.navigationLinkContainer.haveDropDown:hover::before {
		color: white;
	}

	.dropDown {
		width: 100%;
		height: 100vh;
		top: 0;
		left: 0;
		color: #000;
		font-weight: 400;
		position: fixed;
		transition: 0.5s;
		z-index: 2;
		opacity: 1;
		overflow-y: auto;
		visibility: visible;
		pointer-events: initial;
		padding-top: 39px;
		box-shadow: none;
		background-color: white;
		transform: translateY(0) translateX(-107%);
	}

	.dropDown .container {
		width: 100%;
	}

	.haveDropDown:hover>.dropDown,
	.haveSubDropDown:hover>.dropDown {
		transform: translateY(0) translateX(-107%);
	}

	.subMegaMenu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-color: white;
		z-index: 2;
		transition: 0.5s;
		padding-top: 50px;
		transform: translateY(0) translateX(-107%);
	}

	.hasSubMegaMenu.active .subMegaMenu {
		transform: translateY(0) translateX(0%);
	}

	.subMegaMenu .dropDownLinkBox {
		border: none;
	}

	.haveDropDown.active>.dropDown,
	.haveSubDropDown.active>.dropDown {
		transform: translateX(0);
	}

	.dropDown>div:first-child {
		height: 100vh;
		overflow-y: auto;
	}

	.dropDown>div::-webkit-scrollbar {
		width: 8px;
		height: 8px;
		background-color: #fff;
	}

	.dropDown>div::-webkit-scrollbar-thumb {
		background-color: #dfdfdf;
	}

	.megaMenuRow {
		padding: 0;
		padding-top: 50px;
		border: none;
		display: flex;
		height: 100vh;
		overflow-y: auto;
		flex-direction: column;
		align-content: flex-start;
	}

	.dropDownContainer .dropDownLinkBox.hasSubMegaMenu>a {
		font-weight: normal;
	}

	li.dropdown-header {
		padding: 12px 12px;
		font-size: 110%;
		font-weight: 600;
	}

	.resultPageTableBtn {
		flex-direction: column;
		align-items: center;
	}

	#date_time {
		display: none;
	}

	.userInfo {
		display: none;
	}
}

@media only screen and (max-width: 768px) {

	.table-responsive>.table>thead>tr>th,
	.table-responsive>.table>tbody>tr>th,
	.table-responsive>.table>tfoot>tr>th,
	.table-responsive>.table>thead>tr>td,
	.table-responsive>.table>tbody>tr>td,
	.table-responsive>.table>tfoot>tr>td {
		white-space: wrap;
	}
}

@media only screen and (max-width: 575px) {
	.col-sm-6 {
		width: 100%;
	}

	.customTabHeadNav {
		padding: 6px 0 0 8px;
		width: 100%;
		padding: 8px 0 0;
		flex-wrap: wrap;
	}

	.customInputLabel {
		font-size: 10px;
	}

	.pageTitle {
		font-size: 18px;
	}

	.customTabHeadNav li a {
		font-size: 12px;
		margin: 0;
		padding: 6px 14px;
	}

	.flex-sm-column-reverse {
		flex-direction: column-reverse;
	}

	.row.shortLeaveStudentSectionImageContainer [class*="col"] {
		width: 50%;
	}

	.shortLeaveFormInputFieldsBox [class*="col"] {
		width: 100%;
	}

	/* */
	ul.nav.nav-tabs.shortLeaveHeadNavigationContainer {
		padding: 5px 0px 12px;
	}

	li.shortLeaveHeadNavigationBox a {
		font-size: 14px;
	}

	.frontDeskHeaderBox {
		width: 100%;
		border-radius: 7px;
		padding: 0;
		box-shadow: none;
	}

	.frontDeskHeaderCardList {
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		gap: 0;
	}

	.frontDeskHeaderListItem.frontDeskHeaderListItemOnlyMobile {
		display: block;
		font-size: 12px;
		padding: 4px 12px;
		color: var(--primaryColor);
		font-weight: 500;
	}

	.frontDeskHeaderCardListToggler {
		display: flex;
		width: 100%;
		justify-content: space-between;
		align-items: center;
		font-weight: 600;
		font-size: 14px;
		border-radius: 7px;
		background: white;
		padding: 7px 15px 7px;
		border-bottom: 1px solid transparent;
		position: relative;
		z-index: 1;
		transition: 0.3s;
		box-shadow: var(--primaryShadow);
	}

	.frontDeskHeaderCardListToggler.active {
		border-radius: 7px 7px 0 0;
	}

	.frontDeskHeaderCardListTogglerBtn {
		transition: 0.3s;
	}

	.frontDeskHeaderCardListToggler.active .frontDeskHeaderCardListTogglerBtn {
		transform: rotate(180deg);
	}

	.frontDeskHeaderContentBoxes {
		background: white;
		box-shadow: var(--primaryShadow);
		border-radius: 0 0 7px 7px;
		padding-top: 7px;
	}

	a.frontDeskHeaderLink {
		border-radius: 0;
		font-size: 11px;
		font-weight: 300;
		padding: 4px 12px;
	}

	.frontDeskHeaderContentBoxes {
		background: white;
		box-shadow: var(--primaryShadow);
		border-radius: 0 0 7px 7px;
		padding-top: 7px;
	}

	.frontDeskHeaderContentBoxesContainer {
		display: none;
	}
}

span.badge {
	font-size: inherit !important;
}

.list-unstyled {
	padding-left: 0;
	list-style: none;
	margin: 0;
}

.help-block .list-unstyled {
	font-size: 10px !important;
	margin-top: 5px;
}

.help-block {
	margin: 0;
}

/* Table Filter DropDown */

.dropdownnew {
	position: relative;
	cursor: pointer;
	margin-left: 3px;
	background: white;
	border-radius: 4px;
	border: 1px solid #dadee7 !important;
}

.dropdownnewTitle {
	display: flex;
	gap: 5px;
	padding: 5px 10px;
	padding: 4px 6px;
	color: inherit !important;
	align-items: center;
}

.dropdownnewTitle::after {
	content: "\f107";
	line-height: 1;
	font-weight: bold;
	font-family: "fontAwesome";
}

.dropdownnew-content {
	position: absolute;
	top: calc(100% + 2px);
	right: 0%;
	padding: 0;
	border-radius: 4px;
	background: white;
	z-index: 1000;
	overflow-y: auto;
	height: 400px;
	width: max-content;
	max-width: 90vh;
	transform-origin: top;
	transform: scaleY(0);
	box-shadow: 0 2px 15px rgb(0 0 0 / 31%);
}

.dropdownnew:focus-within .dropdownnew-content,
.dropdownnew-content:hover {
	transform: scaleY(1);
	transition: 0.5s;
}

.dropdownnew-content label {
	padding: 4px 10px;
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	cursor: pointer;
}

.dropDownSepratation {
	font-size: 80%;
	color: red;
	font-weight: 600;
}

.dropdownnew-content input {
	margin: 0;
}

.paymentMethodHeadContainer {
	padding: 8px 0 12px;
}

.paymentMethodHead {
	display: flex;
	gap: 8px 12px;
	flex-wrap: wrap;
}

.paymentMethodHeadCard {
	padding: 0;
	position: relative;
	margin: 0 !important;
	outline: none !important;
}

.paymentMethodHeadCard input {
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	margin: 0 !important;
	width: 100%;
	-webkit-appearance: none;
	appearance: none;
	outline: none !important;
	border: none !important;
}

span.paymentMethodPillText {
	display: flex;
	padding: 6px 16px;
	border-radius: 100px;
	font-size: 13px;
	font-weight: 600;
	color: black;
	transition: 0.5s;
	background: linear-gradient(45deg, #eaecf1, white);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.04);
}

.paymentMethodHeadCard:hover span.paymentMethodPillText {
	color: white;
	background: black;
}

.paymentMethodHeadCard input:checked~span.paymentMethodPillText {
	color: white;
	background: linear-gradient(45deg, #ffb893, #d35555);
	background: linear-gradient(45deg, #276c0d, #14ad32);
}

.totalAmountBox {
	color: black;
	font-weight: 500;
	font-size: 12px;
}

.totalAmountBox b {
	color: black;
	font-size: 16px;
}

.totalAmountBox span.totalAmount {
	color: green;
	font-size: 24px;
	font-weight: 600;
}

span.redImp {
	font-weight: bold;
	color: #d71b1b;
}

.paymentMethodBoxContainer {
	width: 100%;
}

.paymentDetailsDataCard {
	width: 100%;
	display: flex;
	gap: 12px;
	align-items: center;
	margin-bottom: 12px;
}

.paymentDetailDataBox {
	width: 100%;
}

@media only screen and (max-width: 991px) {
	.paymentDetailsDataCard {
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	.paymentDetailDataBox {
		width: calc(33% - 6px);
	}
}

@media only screen and (max-width: 775px) {
	.paymentDetailDataBox {
		width: calc(50% - 6px);
	}
}

.fade {
	opacity: 0;
	-webkit-transition: opacity 0.15s linear;
	transition: opacity 0.15s linear;
}

.fade.in {
	opacity: 1;
}

.fade.show {
	opacity: 1;
}

.modal-backdrop.in {
	filter: alpha(opacity=50);
	opacity: 0.5;
}

.modal-backdrop.show {
	filter: alpha(opacity=50);
	opacity: 0.5;
}

.modal.fade .modal-dialog {
	transition: -webkit-transform 0.3s ease-out;
	transition: transform 0.3s ease-out;
	transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
	-webkit-transform: translate(0, -50px);
	transform: translate(0, -50px);
}

.modal.fade.in .modal-dialog {
	-webkit-transform: translate(0, 0px);
	transform: translate(0, 0px);
}

.modal.fade.show .modal-dialog {
	-webkit-transform: translate(0, 0px);
	transform: translate(0, 0px);
}

.collapse.in {
	display: block;
}
/*  */

@media only screen and (min-width: 768px) {
	.modal-lg {
		width: 600px;
		margin: 30px auto;
	}
}

@media only screen and (min-width: 992px) {
	.modal-lg {
		width: 900px;
	}
}

.percentAmount {
	display: flex;
	position: relative;
	gap: 5px;
	align-items: center;
	justify-content: space-between;
}

.rounded-4 {
	border-radius: 4px;
}

.editContent {
	margin-top: 7px;
	max-height: 294px;
	overflow-y: auto;
	/* overflow-x: hidden; */
	padding: 12px 16px;
}

.editContent .row {
	/* margin: 0; */
}

.wrapper .card {
	position: relative;
	height: unset !important;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 10px 10px 10px 10px !important;
}

.wrapper .card .img {
	position: static !important;
}

.card .details {
	margin-left: 0px !important;
}

.card .content {
	gap: 8px 13px;
}

.editContent .card a {
	margin: auto;
}

@media only screen and (max-width: 575px) {
	.wrapper .card {
		flex-direction: column;
		height: unset !important;
		border-radius: 7px !important;
	}

	.card .content {
		flex-direction: column;
		text-align: center;
		margin-bottom: 7px;
	}

	.tab-content .table-responsive {
		overflow-x: auto !important;
	}
}

.with-errors {
    line-height: 1;
    color: red;
    font-weight: 600;
    margin-bottom: 5px;
}