@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-Regular.eot');
    src: url('../fonts/DMSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Regular.woff2') format('woff2'),
        url('../fonts/DMSans-Regular.woff') format('woff'),
        url('../fonts/DMSans-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-Italic.eot');
    src: url('../fonts/DMSans-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Italic.woff2') format('woff2'),
        url('../fonts/DMSans-Italic.woff') format('woff'),
        url('../fonts/DMSans-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-Medium.eot');
    src: url('../fonts/DMSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Medium.woff2') format('woff2'),
        url('../fonts/DMSans-Medium.woff') format('woff'),
        url('../fonts/DMSans-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-MediumItalic.eot');
    src: url('../fonts/DMSans-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-MediumItalic.woff2') format('woff2'),
        url('../fonts/DMSans-MediumItalic.woff') format('woff'),
        url('../fonts/DMSans-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-SemiBold.eot');
    src: url('../fonts/DMSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-SemiBold.woff2') format('woff2'),
        url('../fonts/DMSans-SemiBold.woff') format('woff'),
        url('../fonts/DMSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-SemiBoldItalic.eot');
    src: url('../fonts/DMSans-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-SemiBoldItalic.woff2') format('woff2'),
        url('../fonts/DMSans-SemiBoldItalic.woff') format('woff'),
        url('../fonts/DMSans-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-Bold.eot');
    src: url('../fonts/DMSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Bold.woff2') format('woff2'),
        url('../fonts/DMSans-Bold.woff') format('woff'),
        url('../fonts/DMSans-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-BoldItalic.eot');
    src: url('../fonts/DMSans-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-BoldItalic.woff2') format('woff2'),
        url('../fonts/DMSans-BoldItalic.woff') format('woff'),
        url('../fonts/DMSans-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}
:root {
    --color-White: #fff;
    --color-OffWhite: #F8F9FD;
    --color-Black: #000;
    --color-DarkBlue: #184277;
    --color-Blue: #037BCB;
    --color-SlateGray: #6D7D93;
    --color-PhilippineGray: #8D8D8D;
    --color-Indigo: #2D3748;
    --color-Red: #E81818;
    --color-Red-1: #EE6A5F;
    --color-Green-1: #62C554;

    --f-size-10: .625rem;
    --f-size-12: .75rem;
    --f-size-14: .875rem;
    --f-size-16: 1rem;
    --f-size-18: 1.125rem;
    --f-size-20: 1.25rem;
    --f-size-22: 1.375rem;
    --f-size-24: 1.5rem;
    --f-size-26: 1.625rem;
    --f-size-28: 1.75rem;
    --f-size-32: 2rem;
    --f-size-40: 2.5rem;
}

body {
    font-family: 'DM Sans';
    font-size: var(--f-size-14);
    color: var(--color-Black);
    background-color: var(--color-OffWhite);
    font-weight: normal;
    min-height: 100dvh;
    line-height: 1.4;
    padding-left: 235px;
    padding-top: 60px;
    transition: padding-left 0.2s ease-in-out;
}
.wrap_pg_main { min-height: calc(100dvh - 68px); padding-top: 1rem;padding-bottom: 1rem; }
.wrap_pg_main, .mainHeader .wrap_ins_space {padding-left: 1rem;padding-right: 1rem;}
.mainHeader {transition: all 0.2s ease-in-out;}

img, video, iframe { max-width: 100%; }
.btn { box-shadow: none !important; }

.f-sz-10 { font-size: var(--f-size-10) !important; }
.f-sz-12 { font-size: var(--f-size-12) !important; }
.f-sz-14 { font-size: var(--f-size-14) !important; }
.f-sz-16 { font-size: var(--f-size-16) !important; }
.f-sz-18 { font-size: var(--f-size-18) !important; }
.f-sz-20 { font-size: var(--f-size-20) !important; }
.f-sz-22 { font-size: var(--f-size-22) !important; }
.f-sz-24 { font-size: var(--f-size-24) !important; }
.f-sz-26 { font-size: var(--f-size-26) !important; }
.f-sz-28 { font-size: var(--f-size-28) !important; }
.f-sz-32 { font-size: var(--f-size-32) !important; }
.f-sz-40 { font-size: var(--f-size-40) !important; }

.text-DarkBlue { color: var(--color-DarkBlue) !important; }
.text-Blue { color: var(--color-Blue) !important; }
.text-SlateGray { color: var(--color-SlateGray) !important; }
.text-PhilippineGray { color: var(--color-SlateGray) !important; }
.text-Indigo { color: var(--color-Indigo) !important; }
.text-Red { color: var(--color-Red) !important; }
.text-Red-1 { color: var(--color-Red-1) !important; }
.text-Green-1 { color: var(--color-Green-1) !important; }
.bg-OffWhite {background-color:var(--color-OffWhite) !important;}

.f-W-M { font-weight: 500 !important; }
.f-W-SB { font-weight: 600 !important; }
.f-W-B, strong, b { font-weight: bold !important; }
.f-W-N, .font-normal { font-weight: normal !important; }

a { text-decoration: none; color: var(--color-DarkBlue); cursor: pointer; }
.cursor-pointer { cursor: pointer !important; }

.line-H-1 { line-height: 1 !important; }
.line-H-1_1 { line-height: 1.1 !important; }
.line-H-1_2 { line-height: 1.2 !important; }
.line-H-1_3 { line-height: 1.3 !important; }
.line-H-1_4 { line-height: 1.4 !important; }
.line-H-1_5 { line-height: 1.5 !important; }
.line-H-1_6 { line-height: 1.6 !important; }
.line-H-1_7 { line-height: 1.7 !important; }

.mb__5 { margin-bottom: .313rem !important; }
.mb__10 { margin-bottom: .625rem !important; }
.mb__15 { margin-bottom: .938rem !important; }
.mb__20 { margin-bottom: 1.25rem !important; }
.mb__25 { margin-bottom: 1.563rem !important; }
.mb__30 { margin-bottom: 1.875rem !important; }
.mb__35 { margin-bottom: 2.188rem !important; }
.mb__40 { margin-bottom: 2.5rem !important; }
.mb__45 { margin-bottom: 2.813rem !important; }
.mb__50 { margin-bottom: 3.125rem !important; }
.scroll-thin, .table-responsive { scrollbar-width: thin; }
.resize-none { resize: none !important; }

.last-p > p:last-child {margin-bottom: 0;}

.td-w-300 { max-width: 300px;min-width: 300px;width: 300px;}
.td-w-250 { max-width: 250px;min-width: 250px;width: 250px;}
.td-w-200 { max-width: 200px;min-width: 200px;width: 200px;}
.td-w-180 { max-width: 180px;min-width: 180px;width: 180px;}
.td-w-150 { max-width: 150px;min-width: 150px;width: 150px;}
.td-w-120 { max-width: 120px;min-width: 120px;width: 120px;}
.td-w-100 { max-width: 100px;min-width: 100px;width: 100px;}
.td-w-80 { max-width: 80px;min-width: 80px;width: 80px;}
.td-w-60 { max-width: 60px;min-width: 60px;width: 60px;}
.td-w-50 { max-width: 50px;min-width: 50px;width: 50px;}

.td-min-w-300 {min-width: 300px;}
.td-min-w-250 {min-width: 250px;}
.td-min-w-200 {min-width: 200px;}
.td-min-w-180 {min-width: 180px;}
.td-min-w-150 {min-width: 150px;}
.td-min-w-120 {min-width: 120px;}
.td-min-w-100 {min-width: 100px;}
.td-min-w-80 {min-width: 80px;}
.td-min-w-60 {min-width: 60px;}
.td-min-w-50 {min-width: 50px;}

.cstBtn-1 { background-color:var(--color-DarkBlue) !important; color: var(--color-White) !important; font-size: var(--f-size-14); font-weight: bold; border-radius: .75rem; line-height: 1.1; min-height: 2.625rem; display: inline-flex; justify-content: center; align-items: center; gap: .625rem; padding: .375rem 1.75rem; border-color: transparent !important; }
.cstBtn-1.btn-brd {border-color:var(--color-DarkBlue) !important;color:var(--color-DarkBlue) !important;background-color: transparent !important;}
.cstBtn-1.btn-brd:hover {background-color:var(--color-DarkBlue) !important; color: var(--color-White) !important;border-color: transparent !important;}
.iconicBtn-1 { min-width: 2.188rem; min-height: 2.188rem; padding: .5rem; display: inline-flex; justify-content: center; align-items: center; font-size: var(--f-size-16); color: var(--color-DarkBlue) !important; background-color: #EEEEEE !important; border-color: transparent !important; border-radius: .375rem; }
.btnStyle-2 {background-color: transparent !important;border: 1px solid var(--color-SlateGray) !important;color: var(--color-SlateGray) !important;padding: .625rem 1.75rem;line-height: 1.1; display: inline-flex;align-items: center;justify-content: center; gap: .625rem;border-radius: .375rem;font-size: var(--f-size-12);font-weight: 700;}
.btnStyle-2:hover {background-color: var(--color-DarkBlue) !important;color: var(--color-White) !important;border-color: transparent !important;}
.btnLink-1 {background-color: transparent;border: none;padding: 0;border-radius: 0;display: inline-flex;align-items: center;justify-content: center;gap: .5rem;color: var(--color-SlateGray) !important;font-size: var(--f-size-12);font-weight: 500;}
.btnLink-1:hover {color: var(--color-DarkBlue) !important;}
.dropdown-menu {font-size: var(--f-size-14);}
.cst-dropD {border-color: #C5CBD4;}
.cst-dropD .dropdown-item:hover {background-color: var(--color-OffWhite);color: var(--color-DarkBlue);}

.cstBtn-danger { background-color:var(--color-Red) !important; color: var(--color-White) !important; font-size: var(--f-size-14); font-weight: bold; border-radius: .75rem; line-height: 1.1; min-height: 2.625rem; display: inline-flex; justify-content: center; align-items: center; gap: .625rem; padding: .375rem 1.75rem; border-color: transparent !important; }


/* Sign In */
.pg_loginWrap {min-height: 100dvh;background-color:var(--color-OffWhite);}
.loginCol-bg {background-image: url("../images/login-bg.jpg");  background-size: 100% 100%; background-repeat: no-repeat; background-position: center center;background-color: var(--color-DarkBlue);padding: 1.25rem 1.563rem;}
.logo_login { max-width: 24.688rem; display: inline-flex; }
.loginCol-form {padding: 1.25rem 1.875rem; }
.loginF-mx-W {margin: 0 auto;max-width: 35rem;}
.cstF-label { margin-bottom: .313rem; }
.cst-f-control {background-color: var(--color-White);border-radius: .938rem;border: 1px solid #E2E8F0;box-shadow: none !important;font-size: var(--f-size-14);padding: .75rem 1.25rem;color: #2D3748 !important;}
:not(textarea).cst-f-control {height: 3.125rem;}
.cst-f-control::-webkit-outer-spin-button, .cst-f-control::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
.cst-f-control[type=number] {-moz-appearance: textfield;}
.cst-f-control:focus {border-color: #cdcfd1;}
.cst-f-control.field-invalid { border-color: var(--color-Red); }
.cst-invalidFeedback { color: var(--color-Red); margin-top: .25rem; }
select.cst-f-control { padding-right: 2.188rem; background-image: url("../images/dropdown-arrow.svg"); background-repeat: no-repeat; background-position: right .875rem center;}
.custom-file-upload { width: 100%; display: flex; align-items: center; gap: .75rem; cursor: pointer;padding: .5rem .75rem !important;margin: 0;}
.custom-file-upload .cstBtn { height: 100%; display: inline-flex; align-items: center; white-space: nowrap; background-color: var(--color-DarkBlue); color: var(--color-White); font-size: var(--f-size-14); font-weight: 500; padding: 5px 16px; line-height: 1.1; border-radius: 6px; }
.custom-file-upload .fileName {min-width: 0;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}

.form-control.cst-f-select {background-color: transparent;}
.bootstrap-select.cst-f-select .dropdown-toggle { display: flex; align-items: center; height: 3.125rem; border-radius: .938rem; padding: .625rem 2.188rem .625rem 1rem; border: 1px solid #E2E8F0; background-color: var(--color-White) !important; color: #2D3748; outline: none !important; font-size: var(--f-size-14); font-weight: 400; }
.bootstrap-select.cst-f-select .dropdown-toggle.bs-placeholder {color: #6D7D93;}
.bootstrap-select.cst-f-select .dropdown-toggle .filter-option {height: auto;}
.bootstrap-select.cst-f-select .dropdown-toggle .filter-option-inner-inner {text-overflow: ellipsis;}
.bootstrap-select.cst-f-select .dropdown-toggle::after { font-family: 'zyper-icon'; content: "\e905"; width: .75rem; height: .75rem; font-size: .75rem; line-height: 1; border: none; display: flex; justify-content: center; align-items: center; position: absolute; right: 1.125rem; color: #6D7D93; margin: 0; top: 50%; transform: translateY(-50%); }
.bootstrap-select.cst-f-select div.dropdown-menu { border-color:#cdcfd1; border-radius: .75rem; box-shadow: 0px 3px 15px rgba(255, 255, 255, 0.5); padding-top: 1rem; padding-bottom: .5rem; margin: 0 !important; font-size: var(--f-size-14); }
.bootstrap-select.cst-f-select ul.dropdown-menu {font-size: var(--f-size-14);}
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item {padding: .438rem 1.375rem;display: flex;gap: .5rem;}
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item .text {align-self: center;}
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item:hover, .bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item.active, .bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item:active {background-color: #f3f3f3;color: var(--color-Black);}
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item .check-mark {position: relative;display: flex !important; align-self: center;align-items: center; width: 1rem;height: 1rem;border: .125rem solid #D1D1D1;border-radius: 3px;background-color: var(--color-White);position: relative;right: inherit;top: inherit;}
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item .check-mark::after { content: "\e90d"; font-family: 'zyper-icon'; width: 100%; height: 100%; border: none; font-size: .625rem; display: flex; justify-content: center; align-items: center; line-height: 1; color: #fff; visibility: hidden; opacity: 0; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); }
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item.selected .check-mark {background-color: #184277;border-color: transparent;}
.bootstrap-select.cst-f-select ul.dropdown-menu .dropdown-item.selected .check-mark::after {visibility: visible; opacity: 1;}
.bootstrap-select.cst-f-select div.dropdown-menu .bs-searchbox { padding: 0 1rem 1rem 1rem; position: relative; }
.bootstrap-select.cst-f-select div.dropdown-menu .bs-searchbox::before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f002"; width: 1rem; height: 1rem; font-size: var(--f-size-14); line-height: 1; border: none; display: flex; justify-content: center; align-items: center; position: absolute; left: 1.563rem; color: #6B7280; margin: 0; top: .563rem; pointer-events: none; }
.bootstrap-select.cst-f-select div.dropdown-menu .bs-searchbox .form-control {border-color: #E2E8F0; height: 2.188rem;border-radius: .25rem;box-shadow: none !important;font-size: var(--f-size-14);color: var(--color-Black);padding: 5px 15px 5px 30px;}
.bootstrap-select.cst-f-select.styleSm .dropdown-toggle {font-size: var(--f-size-14);font-weight: 500; height: 2.375rem; border-radius: .25rem;padding: .25rem 1.563rem .25rem .625rem;}
.bootstrap-select.cst-f-select.styleSm  .dropdown-toggle::after { font-size: .625rem; right: .563rem; }
.bootstrap-select.cst-f-select.styleSm  div.dropdown-menu {border-radius: .25rem;}
.bootstrap-select.cst-f-select.smStl-select .dropdown-toggle { height: 2rem;font-size: var(--f-size-12);border-radius: .375rem; padding: .25rem 1.875rem .25rem .875rem; }
.bootstrap-select.cst-f-select.smStl-select .dropdown-toggle::after { right: .625rem;font-size: .625rem; }
.bootstrap-select.cst-f-select div.dropdown-menu { border-radius: .375rem;padding-top: .25rem; padding-bottom: .25rem;}
.bootstrap-select.cst-f-select.smStl-select ul.dropdown-menu { font-size: var(--f-size-12); }
.bootstrap-select.cst-f-select.smStl-select ul.dropdown-menu .dropdown-item { padding: .25rem .938rem; }
.bootstrap-select.cst-f-select.styleText .dropdown-toggle { height: auto; border-radius: 0; padding: 0 1.25rem 0 0; border: none; background-color: transparent !important; color: #8D8D8D; }
.bootstrap-select.cst-f-select.styleText .dropdown-toggle::after {right: 0;}
.bootstrap-select.cst-f-select.f-sz-16 .dropdown-toggle {font-size: var(--f-size-16);}
/* .bootstrap-select.cst-f-select .dropdown-toggle */

.swipeBtn_wrap {display: inline-flex;align-items: center;gap: .813rem;}
.swipeBtn_wrap .swipeBtn {width: 2.25rem;height: 1.188rem;background-color:#ffffff;border-radius: 1.875rem;border: 1px solid var(--color-DarkBlue); cursor: pointer;position: relative;}
.swipeBtn_wrap .cstInput {position: absolute;width: 0;height: 0;opacity: 0;}
.swipeBtn_wrap .swipeBtn::before { content: ""; position: absolute; width: .813rem; height: .813rem; background-color: var(--color-DarkBlue); border-radius: 100%; top: 50%; transform: translateY(-50%); left: .125rem;transition: all 0.2s ease-in-out; }
.swipeBtn_wrap .cstInput:checked ~ .swipeBtn::before { margin-left: 1.063rem; background-color: #ffffff;}
.swipeBtn_wrap .cstInput:checked ~ .swipeBtn {background-color: var(--color-DarkBlue);}
.swipeBtn_wrap .cstInput ~ .swipeBtn.stl-2 {background-color: transparent;}
.swipeBtn_wrap .cstInput ~ .swipeBtn.stl-2::before { background-color: var(--color-DarkBlue); }

.otp-fieldWrap {display: flex;gap: 1.25rem;}
.otp-fieldWrap .cst-f-control {border-radius: 10px;padding-left: .625rem;padding-right: .625rem;text-align: center;}
.modal-cst-1 .modal-content {border-radius: 50px;border: none;}
.modal-cst-1 .modal-body { padding: 30px 30px; }
.modal-cst-1 .cstClose-btn { width: 1.25rem; height: 1.25rem;  z-index: 1; font-size: 1.5rem; line-height: 1; padding: 0; background-size: 100%; font-weight: normal; opacity: 1; background-image: none; display: inline-flex; justify-content: center; align-items: center; color: #6D7D93;box-shadow: none !important; }
.modalInfo_wrapLogin.mx-w {max-width: 20.313rem;}
.modalInfo_wrapLogin .iconWrap { width: 3.25rem; height: 3.25rem; display: inline-flex; justify-content: center; align-items: center; background-color: #87C97B; border-radius: 100%; color: #fff; font-size: 1.75rem; line-height: 1; margin-bottom: 1.25rem;}
.modalInfo_wrapLogin .iconWrap.iconBg-Blue {background-color: #3A8BCB;}
.modalInfo_wrapLogin .cont-title {line-height: 1;margin-bottom: 1.125rem;}
.modalInfo_wrapLogin .subText { color: #6D7D93; }
.modal-backdrop.show { opacity: .7; }
/* End Sign In */

.mainHeader { position:fixed; z-index: 8; top: 0; left: 0;padding-left:235px; width: 100%;background-color: var(--color-OffWhite);padding-top: .5rem;padding-bottom: .5rem;}
.pgHeader {font-size: 1.75rem;font-weight: 700;line-height: 1.1;color: var(--color-DarkBlue);margin: 0;}
.headerAct-wrapp { max-width: 830px; }
.cstField-wrap-1 {position: relative;}
.cstField-wrap-1 .icon { position: absolute; color: #6D7D93; font-size: 1rem; width: 1.25rem; height: 1.25rem; display: inline-flex; justify-content: center; align-items: center; left: 1rem; top: 50%; transform: translateY(-50%); pointer-events: none; }
.cstField-wrap-1 .cst-Field-1 {height: 2.75rem;border-radius: .375rem;border-color: transparent !important;font-size: var(--f-size-14);box-shadow: none !important;padding: .563rem 1rem .563rem 3.125rem;}
.head_actionList {list-style-type: none;padding: 0;margin: 0;display: flex;align-items: center;gap: 1.125rem;}
.headerIcon-btn { padding: 0; border: none; color: var(--color-SlateGray) !important; line-height: 1; font-size: 1.25rem;}
.profileBtn {padding: 0;border-radius: 0;border: none;display: inline-flex;align-items: center;gap: .375rem;color: var(--color-SlateGray) !important;}
.profileBtn .prof-pic { object-fit: cover; width: 2.25rem; height: 2.25rem; border-radius: 100%; min-width: 2.25rem; }
.profileBtn::after {font-family: 'zyper-icon';content: "\e905";border: none;margin: 0;vertical-align: middle;font-size: var(--f-size-14);}
.dropdown-menu.dropd-profile { min-width: 7.5rem; }

.main-sidebar { position: fixed; z-index: 10; left: 0; top: 0; bottom: 0; background-color: #fff; width: 235px; display: flex; flex-direction: column; padding-bottom: 1.25rem; transition: all 0.2s ease-in-out; }
.main-sidebar .sideBtn-expand { width: 1.5rem; height: 1.5rem; padding: 0; display: inline-flex; justify-content: center; align-items: center; border-radius: 0.25rem; border: 1px solid  #E4E7EC !important; background-color: #fff !important; position: absolute; z-index: 1; right: 0; top: 1.375rem; margin-right: -0.625rem; overflow: hidden; }
.main-sidebar .sideBtn-expand .icon {display: flex;justify-content: center;align-items: center; line-height: 1;width: 100%;height: 100%;}
.main-sidebar .sideScroll { position: absolute; width: 100%; top: 0; bottom: 0; left: 0; overflow: auto; scrollbar-width: thin; }
.main-logoWrapper {display: flex;align-items: center;height: 70px;padding: .313rem .813rem;}
.main-logoWrapper .siteLogo {max-width: 10rem;width: 100%;}
.main-logoWrapper .siteSm-Logo { display: none; max-width: 30px; width: 100%; justify-self: self-start; }
.cstNavigation .nav-item .nav-link { font-size: var(--f-size-14); line-height: 1.3; color: #404040; padding: .625rem .625rem .625rem 1.25rem; position: relative; cursor: pointer; transition: all 0.2s linear; display: flex; align-items: center; gap: .625rem; font-weight: 700; }
.cstNavigation .nav-item .nav-link .navIcon {display: inline-flex; justify-content: center; align-items: center; min-width: 1.25rem; width: 1.25rem; height: 1.25rem; font-size: var(--f-size-16);color: #ACACAC;}
.cstNavigation .nav-item .nav-link .textWrap { flex-grow: 1; min-width: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.cstNavigation .nav-item .nav-link::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: .313rem; background-color: var(--color-DarkBlue); border-radius: 4px; visibility: hidden; opacity: 0; transition: all 0.2s linear; }
.cstNavigation .nav-item .nav-link.active::before {opacity: 1;visibility: visible;}
.cstNavigation .nav-item .nav-link.active, .cstNavigation .nav-item .nav-link.active .navIcon {color: var(--color-DarkBlue);}
.cstNavigation .nav-item .dropdown-menu {border-radius: 0;border: none;margin: 0 !important;padding: 0;}
.cstNavigation .nav-item .dropdown-menu .dropdown-item { font-size: .813rem; padding: .313rem .625rem .313rem 3.125rem; white-space: normal; background-color: transparent !important; color: #404040; line-height: 1.4;display: flex;align-items: center;gap: .25rem;}
.cstNavigation .nav-item .dropdown-menu .dropdown-menu .dropdown-item { padding-left: 3.75rem; }
.cstNavigation .nav-item .dropdown-menu .dropdown-item.dropdown-toggle {justify-content: space-between;}
.cstNavigation .dropdown-toggle::after { content: "\2b"; font-weight: 900; font-family: "Font Awesome 6 Free"; border: none; font-size: .75rem; margin: 0; vertical-align: middle; line-height: 1; display: inline-flex; justify-content: center; align-items: center; width: .75rem; height: .75rem; min-width: .75rem; }
.cstNavigation .dropdown-toggle.show::after {content: "\f068";}
/* Css Animation for expand & Collapse */
.cstNavbarWrap .dropdown-menu { -webkit-transition: max-height 0.4s, opacity 0.3s 0.1s, visibility 0s 0.3s, padding 0.4s ease; -moz-transition: max-height 0.4s, opacity 0.3s 0.1s, visibility 0s 0.3s, padding 0.4s ease; -ms-transition: max-height 0.4s, opacity 0.3s 0.1s, visibility 0s 0.3s, padding 0.4s ease; -o-transition: max-height 0.4s, opacity 0.3s 0.1s, visibility 0s 0.3s, padding 0.4s ease; transition: max-height 0.4s, opacity 0.3s 0.1s, visibility 0s 0.3s, padding 0.4s ease; max-height: 0; display: block; overflow: hidden; opacity: 0; visibility: hidden; }
.cstNavbarWrap .dropdown .dropdown-menu.show { -webkit-transition: max-height 0.4s, opacity 0.1s, visibility 0s, padding 0.2s ease; -moz-transition: max-height 0.4s, opacity 0.1s, visibility 0s, padding 0.2s ease; -ms-transition: max-height 0.4s, opacity 0.1s, visibility 0s, padding 0.2s ease; -o-transition: max-height 0.4s, opacity 0.1s, visibility 0s, padding 0.2s ease; transition: max-height 0.4s, opacity 0.1s, visibility 0s, padding 0.2s ease; max-height: 500px; opacity: 1; visibility: visible; }
/* End Css Animation for expand & Collapse */

body.sideCollapsed, body.sideCollapsed .mainHeader {padding-left: 58px;}
.sideCollapsed .main-sidebar .sideBtn-expand {transform: rotate(180deg);}
.sideCollapsed .main-sidebar {width: 58px;}
.sideCollapsed .main-sidebar .main-logoWrapper .siteLogo {display: none;}
.sideCollapsed .main-sidebar .main-logoWrapper .siteSm-Logo {display: inline-block;}
.sideCollapsed .main-sidebar .cstNavigation .nav-item .nav-link .textWrap, .sideCollapsed .main-sidebar .cstNavigation .dropdown-toggle::after {display: none;}

.toggleSidebarNav { position: relative; width: 1.5rem; height: 1.125rem; border: none; padding: 0; outline: none !important; border-radius: 0; }
.toggleSidebarNav .navbar-toggler-icon, .toggleSidebarNav .navbar-toggler-icon:before, .toggleSidebarNav .navbar-toggler-icon:after { width: 100%; height: 2px; border-radius: 5px; position: absolute; left: 0; transition: all 0.2s ease; background-color: #000; }
.toggleSidebarNav .navbar-toggler-icon:before, .toggleSidebarNav .navbar-toggler-icon:after { content: ""; }
.toggleSidebarNav .navbar-toggler-icon:before { bottom: 7px; }
.toggleSidebarNav .navbar-toggler-icon:after { top: 7px; }
.sidebarBackdrop { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.6); z-index: 9; opacity: 0; visibility: hidden; height: 0; transition: opacity 0.2s linear; }

.cst-Card {padding: 1.5rem;box-shadow: 4px 4px 20px -10px rgba(0, 0, 0, 0.1);border-radius: .938rem;background-color: #fff;border: 1px solid rgba(109, 125, 147, 0.15);}

.cstTable-1 thead {position: sticky;top: 0;z-index: 3;}
.cstTable-1 thead th {color: var(--color-SlateGray) !important;font-weight: bold;border-bottom-width: 0;}
.table.p-FL-0 thead tr th:first-child, .table.p-FL-0 tbody tr th:first-child, .table.p-FL-0 tbody tr td:first-child {padding-left: 0;}
.table.p-FL-0 thead tr th:last-child, .table.p-FL-0 tbody tr th:last-child, .table.p-FL-0 tbody tr td:last-child {padding-right: 0;}
.cstTable-1 th, .cstTable-1 td {vertical-align: middle;}
table.table-text-gray td, table.table-text-gray th {color: #8D8D8D;} 
.wrap-Datatable .dt-paging{margin: 1.25rem ; display: flex; justify-content: flex-end; gap: 0.5rem;}
.wrap-Datatable button.dt-paging-button{width: 1.5rem; height: 1.5rem; padding: 0 !important; font-size: var(--f-size-14) !important; line-height: 1; border-radius: 100% !important; background-color: transparent !important; border-color: #E2E8F0 !important; background: none !important;box-shadow: none !important;display: inline-flex !important;justify-content: center; align-items: center;margin: 0 !important;}
.wrap-Datatable button.dt-paging-button.current{background:var(--color-DarkBlue) !important; color: var(--color-White) !important;border-color: transparent !important;}
.tableScroll-H-Empl {max-height: 300px;}
.tableScroll-H-1 {max-height: calc(100vh - 200px);}
.td-w-Check {width: 2.5rem; min-width: 2.5rem; max-width: 2.5rem;}
.planetabal.table>:not(caption)>*>*{border: none; padding: 1.25rem 0.625rem;}

.dash-StatsCard {background: #FFFFFF; box-shadow: 4px 4px 20px -10px rgba(0, 0, 0, 0.1); border-radius: 12px;padding: 20px;color: var(--color-SlateGray);transition: all 0.2s linear;}
.dash-StatsCard .lg-text {line-height: 1.1;}
.dash-StatsCard .nbr-value {font-size: var(--f-size-14);}
.dash-StatsCard .bt-sm-Text {font-size: .688rem;}
.dash-StatsCard .bt-sm-Text.text-o {opacity: .6;}
.dash-StatsCard .indicateIcon {font-size: .75rem;}
.dash-StatsCard.cardHover:hover {background: #184277; box-shadow: 20px 20px 40px -12px rgba(0, 0, 0, 0.25);color: #fff;}
.dash-Col-R { max-width: 330px; }
.dash-comp-Logo { max-width: 12.5rem; }
.cst-navTab {border-bottom: 1px solid rgba(109, 125, 147, 0.5);gap: .25rem;}
.cst-navTab .nav-link {padding: .125rem 1rem .938rem 1rem;color: var(--color-SlateGray);font-size: var(--f-size-16);position: relative;border-bottom: 3px solid transparent;margin-bottom: -2px;}
.cst-navTab .nav-link.active {color: var(--color-DarkBlue);font-weight: 700;border-color: var(--color-DarkBlue);}
.posDah-btn-activityAdd { right: 0; top: .313rem; }
.min-h-activitySummary {min-height: 250px;}
.dash_highlightCard {display: flex;gap: .25rem; padding: 0px 2.188rem 0px .625rem;border: 1px solid rgba(109, 125, 147, 0.15); box-shadow: 4px 4px 20px -10px rgba(0, 0, 0, 0.1); border-radius: 6px;position: relative;}
.dash_highlightCard .graphCol {min-width: 55px;width: 55px;}
.dash_highlightCard::before {content: "\e903";font-family: 'zyper-icon';position: absolute;top: 50%;transform: translateY(-50%);right: .938rem;font-size: var(--f-size-14);color: var(--color-SlateGray);}
.dash_highlightCard:hover::before {color: var(--color-Black);}
.rowGap-dash1 {margin-left: -8px;margin-right: -8px;}
.rowGap-dash1>[class*=col] {padding-left: 8px;padding-right: 8px;}

.custom-checkBx {-webkit-appearance: none; appearance: none;}
.custom-checkBx {width: 1.125rem;height: 1.125rem; border: 1px solid var(--color-DarkBlue); padding: 0; cursor: pointer;border-radius: 0;display: inline-flex;}
.custom-checkBx::before { content: "\e90d"; width: 100%; height: 100%; position: relative; font-family: 'zyper-icon'; display: inline-flex; justify-content: center; align-items: center; visibility: hidden; opacity: 0; font-size: .625rem; }
.custom-checkBx:checked{background-color:  var(--color-DarkBlue);color: #fff;}
.custom-checkBx:checked::before {visibility: visible;opacity: 1;}
.custom-checkBx:disabled{opacity: .3; pointer-events: none;}
.statusLabel { display: inline-block; padding: .188rem .5rem; border-radius: 15px; line-height: 1.1;font-weight: 600;background-color: #e1e7ef;color: var(--color-Black);}
.statusLabel.status-Red { background-color: var(--color-Red-1); color: var(--color-White);}
.statusLabel.status-Green { background-color: var(--color-Green-1); color: var(--color-White);}
.statusLabel.status-Blue { background-color: var(--color-Blue); color: var(--color-White);}
.mx-W-OTP-Wrap {max-width: 31.25rem;}

.fileUploadBx{max-width: 500px; min-height: 185px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; padding: 45px; border:  1px dashed #000000; text-align: center; margin: auto;}
.fileUploadBx input{ position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; }
.errorMsg{color: rgba(225, 26, 26, 1);}
.cstBtn-1.btn-gray{background-color: #B5B5B5 !important; color: #000000 !important;}
.cstBtn-1.min-w{min-width: 140px;}
.alertM-content{max-width: 80%; margin: 30px auto;}
.servicesTotal{color: #037BCB; font-size: var(--f-size-24); font-weight: 700;}
.cstRadio{border:1px solid #BDB4FE; appearance:none; border-radius:50%; width:14px; height:14px; background-color:#fff; transition:all ease-in 0.1s;}
.cstRadio:checked{background-color:#184277;border-color: #184277;}
.hoverTable tr:hover td{font-weight: 700;}
.selectM-w{min-width: 200px; left: 0 !important;}
.bootstrap-select.statusSelect ul.dropdown-menu .dropdown-item:hover, .bootstrap-select.statusSelect ul.dropdown-menu .dropdown-item.active, .bootstrap-select.statusSelect ul.dropdown-menu .dropdown-item:active{background-color: #ffffff; }
.invoiceSelect-d{padding: 16px 24px; box-shadow: 0px 4px 4px 0px #00000040; font-size: var(--f-size-14); font-weight: 500; display: flex; margin: 10px 0;}
.invoiceSelect-d input{font-size: var(--f-size-14); font-weight: 500; border: none; width: 100%; color: rgba(0, 0, 0, 0.6); outline: none;}

.datepicker{padding: 16px;}
.datepicker table tr td, .datepicker table tr th{padding: 8px 4px;line-height: 1;}
.datepicker table tr td{border-radius: 100%; }
.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active { color: #fff; background-color: rgba(24, 66, 119, 1); border-color: rgba(24, 66, 119, 1); }
.selectLast tr:last-child td{border-bottom: none; border-top:3px solid #6D7D93;}

/* New Style */
.cst_radio:checked, .cst_radio:not(:checked) { position: absolute; left: -9999px; }
.cst_radio:checked + label, .cst_radio:not(:checked) + label { position: relative; padding-left: 28px; cursor: pointer; line-height: 20px; display: inline-block; color:#184277 ; font-size: var(--f-size-16); }
.cst_radio:checked + label:before, .cst_radio:not(:checked) + label:before { content: ''; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border: 1px solid #184277; border-radius: 100%; background: #fff; }
.cst_radio:checked + label:after, .cst_radio:not(:checked) + label:after { content: ''; width: 10px; height: 10px; background: #184277; position: absolute; top: 5px; left: 5px; border-radius: 100%; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
.cst_radio:not(:checked) + label:after, .cst_radio:not(:checked) + label:before { opacity: .3; }
.cst_radio:not(:checked) + label:after { -webkit-transform: scale(1); transform: scale(1); }
.cst_radio:not(:checked) + label:after, .cst_radio:not(:checked) + label:before { opacity: .3; }
.cst_radio:checked + label:after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
.checked_bx td{color: #000000 !important;}
.customer-Table{min-width: 700px;}
.cstStl_accordion .accordion-item:first-child {border-top-width: 1px;}
.cstStl_accordion .accordion-item {border-radius: 0; border-width: 0 0 1px 0;border-color: #eeeff1;}
.cstStl_accordion .accordion-header {padding-top: .75rem;padding-bottom: .75rem;}
.cstStl_accordion .accordion-header .accordion-button {width: auto; border-radius: 0 !important; padding: 0; background-color: transparent; box-shadow: none; outline: none !important; font-weight: normal;}
.cstStl_accordion .accordion-header .accordion-button .icon { display: flex; align-items: center; justify-content: center; width: .938rem; height: .938rem; color: var(--color-DarkBlue); transition: all 0.2s linear; }
.cstStl_accordion .accordion-header .accordion-button.collapsed .icon {transform: rotate(-180deg);}
.cstStl_accordion .accordion-header .accordion-button::after {margin: 0;display: none;}

.plansRow_wrap > [class*=col]:nth-child(2) .pricing_card .pricing_Head {background-color: #184277;}
.pricing_card{border-radius: 30px; overflow: hidden; background-color: #ffffff;box-shadow: 0px 0px 24px rgba(63, 88, 221, 0.1);}
.pricing_card .pricing_Head { background-color: #037BCB; color: #fff; padding: 2.25rem 1.5rem; min-height: 160px;  background-image: url("../images/price-bg.png"); background-position: right -20px bottom -30px; background-repeat: no-repeat; background-size: 235px auto; }
.pricing_card .plan-name {font-size: var(--f-size-24);}
.pricing_card .plan-price {font-size: 2.25rem;}
.pricing_card .plan-body {padding: .625rem 2.5rem 2.188rem 2.5rem;}
.planInfo_List > li { padding-top: 1.375rem; padding-bottom: 1.375rem; border-bottom: 1px solid #037BCB33;}
.pricing_card .btnWrapp {padding-top: 1rem;}
.pricing_card .planBtn {border-radius: 100px;}
.mx-W-subscriptionDtl {max-width: 650px;}
.mx-W-payment {max-width: 500px;}
.payment_cardWrap {position: relative; box-shadow: 4px 4px 20px -10px rgba(0, 0, 0, 0.1); border-radius: .938rem; background-color: #fff; border: 1px solid rgba(109, 125, 147, 0.15);padding: 0 30px 30px 30px; margin-top: 40px;}
.payment_cardWrap .iconCard { margin: -40px auto 20px auto; width: 80px; height: 80px; border-radius: 100%; background-color: #198754; color: #fff; display: flex; justify-content: center; align-items: center; }
.payment_cardWrap .iconCard .icon {font-size: 30px;}
.payment_cardWrap .head-cont-wrap {position: relative;padding-bottom: 20px;margin-bottom: 25px;}
.payment_cardWrap .head-cont-wrap::after { content: ""; position: absolute; bottom: 0; left: 35px; right: 35px; height: 1px; background-color: rgba(0, 0, 0, 0.08); }
.cstPayment-table thead tr > td:first-child, .cstPayment-table tbody tr > td:first-child, .cstPayment-table tfoot tr > td:first-child {padding-left: 0;}
.cstPayment-table thead tr > td:last-child, .cstPayment-table tbody tr > td:last-child, .cstPayment-table tfoot tr > td:last-child {padding-right: 0;}
.cstPayment-table tbody tr > th, .cstPayment-table tbody tr > td {border-color: transparent;padding-top: .25rem;padding-bottom: .25rem;}


/*** Responsive Start ***/


@media (min-width:992px){
    .modal-sz-md {max-width: 800px;}
    .modal-sz-sm {max-width: 600px;}
}
@media (min-width: 768px) and (max-width: 991px)  {
    .modal-sz-md {max-width: 720px;}  
}
@media (max-width:1599px){
    .dash-Col-R { max-width: 270px; }
    .rowGap-dash1 {margin-left: -4px;margin-right: -4px;}
    .rowGap-dash1>[class*=col] {padding-left: 4px;padding-right: 4px;}
    .dash-StatsCard { padding-left: 13px; padding-right: 13px; }
    .dash-StatsCard .tp-text {font-size: 13px !important;}
    .dash-StatsCard .lg-text { font-size: 22px !important; }
}
@media (max-width:1599px){
}
@media (max-width:1199px){
    /* Responsive Elements */
    body {padding-left: 0;}
    .main-pgWrapp { min-height: calc(100dvh - 60px); }
    .mainHeader { padding-left: 0 !important; }
    .main-sidebar { left: calc(-100% - 50px);box-shadow:none;top: 0; width: 253px !important; transition: all 0.4s linear; }
    .sidebarVisible .sidebarBackdrop { visibility: visible; height: 100%; opacity: 1; }
    .sidebarVisible .main-sidebar { left: 0; }
    .wrap_pg_main, .mainHeader .wrap_ins_space { padding-left: 0; padding-right: 0; }
    .sideCollapsed .main-sidebar .cstNavigation .nav-item .nav-link .textWrap, .sideCollapsed .main-sidebar .cstNavigation .dropdown-toggle::after { display: block; }
    .sideCollapsed .main-sidebar .main-logoWrapper .siteSm-Logo { display: none; }
    .sideCollapsed .main-sidebar .main-logoWrapper .siteLogo { display: inline-block; }
    /* End Responsive Elements */
}

.toast {opacity: 1 !important;}
.siteLoadingWrap {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: #ffffff;z-index: 9999;display: flex;justify-content: center;align-items: center;}
.loaderLogo { width: 5.208vw; animation: logoLoadingAnim 3s ease infinite; }
@keyframes logoLoadingAnim {
    0% { transform: scale(.95, .95); }
    50% { transform: scale(1.05, 1.05); }
    100% { transform: scale(.95, .95); }
}
@keyframes lineAnim {
    0% { left: -40%; }
    50% { left: 20%; width: 80%; }
    100% { left: 100%; width: 100%; }
}
.dragboxdisable { pointer-events: none; cursor: default; }

.erp_validation { border: 1px solid #ff0000 !important; }
.vendorSOATable tr.clickableTR, tr.clickableTR { cursor: pointer; transition: background-color 0.3s; }


.invoice-tableWrp{max-height: calc(100dvh - 200px); overflow-y: auto;}
.validationError { border: 1px solid #ff0000 !important; }
.selectedMenu { font-weight: 700; color: var(--color-DarkBlue)!important; }
.invoice_currency_error_message, .company_billing_currency_error_message { margin-bottom:0px!important; }
.invite-add-partner a { text-decoration: underline; }
.invite-add-partner { font-size: 15px; }
.cst-error-validation { color: var(--color-Red); margin-top: .25rem; }
.errorMsg{color: #EE6A5F; line-height: 16px; margin-bottom: 25px;}
.errorMsg p{margin-bottom: 10px;}