* { font-family: 'Montserrat', sans-serif !important }
html, body { background-color: #F1F2F5; }
.main_content { overflow-x: hidden;flex-grow: 1!important; }
.sign_bg { background-image: url('../img/backgrounds/login_bg.jpg'); padding: 1.5rem; background-size: cover; background-repeat: no-repeat; background-position: bottom }
.sign_form { padding: 2.5rem 3.5rem }
.sign_logo { height: 35px;width: fit-content;content: url('../img/logo.jpg'); }
.ft_txt { font-size: .65rem; color: #000; font-weight: 500 }
.err_msg { font-size: 10px !important; height: 10px; display: block; color: red }
.profile_img { height: 35px; width: 35px; object-fit: cover; object-position: center; border-radius: 50% }
.profile_img_menu { height: 40px; width: 40px; object-fit: cover; object-position: center; border-radius: 50% }
a { text-decoration: none !important; color: inherit !important }
.fw_100 { font-weight: 100 !important }
.fw_200 { font-weight: 200 !important }
.fw_300 { font-weight: 300 !important }
.fw_400 { font-weight: 400 !important }
.fw_500 { font-weight: 500 !important }
.fw_600 { font-weight: 600 !important }
.fw_700 { font-weight: 700 !important }
.fw_800 { font-weight: 800 !important }
.fw_900 { font-weight: 900 !important }
.fs-04 { font-size: .45rem !important }
.fs-08 { font-size: .5rem !important }
.fs-10 { font-size: .625rem !important }
.fs-12 { font-size: .75rem !important }
.fs-14 { font-size: .875rem !important }
.fs-16 { font-size: 1rem !important }
.fs-18 { font-size: 1.125rem !important }
.fs-20 { font-size: 1.25rem !important }
.fs-22 { font-size: 1.375rem !important }
.fs-24 { font-size: 1.5rem !important }
.fs-26 { font-size: 1.625rem !important }
.fs-28 { font-size: 1.75rem !important }
.fs-30 { font-size: 1.875rem !important }
.fs-32 { font-size: 2rem !important }
.fs-34 { font-size: 2.125rem !important }
.theme-1 { background-color: #0e7490 !important }
.theme-l-1 { background-color: #cffafe !important }
.theme-m-1 { background-color: #22CFCF !important }
.theme-s-1 { background-color: #0b647c !important }
.theme-txt-1 { color: #0e7490 !important }
.theme-bdr-1 { border-color: #0e7490 !important }
.w_fit { width: fit-content!important; }
.form-control:focus { box-shadow: none !important }
p { margin: 0 !important }
.form-control-sm, .form-select-sm { padding: 0.4rem 0.7rem;font-size: .75rem; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }
.btn-sm { --bs-btn-padding-y: 0.3rem }
.form-select { background-size: 10px 10px; }
.input-group-lg>.form-select, .input-group-sm>.form-select { padding-right: 1.5rem!important;  }
.pe-none { background-color: #F7F6F6; }
.card { padding: 0.5rem !important }
.card-body { padding: 0 !important }
.nav-pills { border: 0px solid #eee; width: fit-content; padding: .0rem; font-size: .6rem; }
.nav-pills .nav-link { background-color: transparent; border: transparent; color: #555; padding: .3rem .6rem; font-weight: 500; border-radius: 3px !important; }
.nav-pills .nav-link.active { background-color: #555 !important; color: #fff; }
.progress { background-color: #dee1e3 !important }
.fc-toolbar-title { font-size: 18px !important; font-weight: 600 !important }
.chart_con { max-height: 22rem }
.w-20 { width: 20% }
.divide-x > *:not(:last-child) { border-right: 1px solid #d1d5db }
.divide-y > *:not(:last-child) { border-bottom: 1px solid #d1d5db }
.dash_crd { padding: 1.25rem !important; }
.dash_crd_icn { width: 40px; height: 40px; font-size: 1.2rem; padding: .5rem; border: 1.7px solid #F1F2F5; border-radius: 5px; display: flex; align-items: center; justify-content: center; }
.profile_drop button:focus, #button-addon2 { border-color: transparent !important }
.profile_drop button { padding: 0 !important }
.dropdown-menu { padding: 0 !important }
.dropdown-toggle::after { display: none !important }
.menu_drop_icn { margin-left: .1rem }
.menus_main_con { max-height: 0rem; opacity: 0; transition: all .3s ease-in-out }
.menus_main_con.active { max-height: 99rem; opacity: 1; transition: all .5s ease-in-out }
.menu_item_con.active .menu_item_sub { max-height: 99rem; opacity: 1; transition: all .1s ease-in-out; border-bottom: 1px solid #eee; border-top: 1px solid #eee }
.menu_item_con.active .menu_drop_icn { transform: rotate(180deg); transition: all .1s ease-in-out }
.menu_item { padding: 8px 12px; cursor: pointer; position: relative }
.menu_item_sub { position: absolute; z-index: 50; top: 100%; font-size: 12px; width: 100vw; left: 0; max-height: 0; opacity: 0; transition: all .1s linear; overflow: hidden; background-color: #fff }
.menu_icn { height: 20px; width: 20px }
.menu_item_sub_item_con { display: grid; grid-template-columns: repeat(3, 1fr); padding: .5rem; }
.menu_item_sub_item { text-decoration: none !important; color: inherit !important; padding: .9rem;border-radius: 5px; }
.menu_item_sub_item:hover { background-color: #f7f7f7; }
.menu_item_sub_item p { font-weight: 700; margin-bottom: 5px; white-space: nowrap }
.menu_item_sub_item span { color: #404040 !important; white-space: normal }
.q_links_con { height: 100%;display: flex;flex-direction: column;gap: 4rem; }
.q_links { display: grid; grid-gap: .6rem }
.nav_drop { display: grid; grid-template-columns: 70% 30%; align-items: start; grid-gap: 2rem; }
.container-main { max-width: 97vw; margin: 0 auto; width: 100% }
.table th { background-color: transparent !important; }
.notf { height: 19rem; width: fit-content; content: url('../img/notf.png') }
form label, .dataTables_wrapper label { margin-bottom: 0 !important; font-size: .8rem !important; font-weight: 600 !important; color: #838383 !important }
.form-check-input:checked { background-color: #0e7490;border-color: #0e7490;}
.table-overflow { overflow-x: hidden !important; -webkit-overflow-scrolling: touch; }
.stat-won { color: #5CC02B; }
.stat-active { color: #F3C900; }
.stat-passive { color: #B257D8; }
.stat-lost { color: #E73737; }
.stat-dead { color: #666464; }
.set-tab .nav-link { line-height: 9.5px;text-transform: uppercase;color: #686868;padding: .5rem !important; border: 2px solid transparent !important; background-color: transparent !important; display: flex; flex-direction: column; text-align: center; justify-content: center; align-items: center; }
.set-tab .nav-link.active { border: 2px solid #0e7490 !important; background-color: transparent !important; color: #0e7490 !important; font-weight: 600 !important; }
.tab_icn { height: 20px; margin: 0 1.5rem; margin-bottom: .5rem; }
.profile_crd_img { height: 65px;width: 65px;object-fit: cover;object-position: center;border-radius: 50%; }
.bar_code { height: 55px;width: 170px; }
.seperate-v { display: block;min-height: 100%;width: 1px;background-color: #ddd; }
.percentage-input,.fixed-amount-input { min-width: 5rem; }
.tt_ncls { background-color: #ffe8ea!important;color: #ED2F01!important; }
.tt_cls { background-color: #c3ebd9!important;color: #188150!important; }
.tt_hday { background-color: #ebe0ff!important;color: #6318eb!important; }
.tt_brk { background-color: #FEF1CE!important;color: #F3BA1C!important; }
.form-switch { padding: 0; }
.form-check.form-switch { min-height: auto!important; }
.form-switch .form-check-input { margin: 0;padding:0; }
.bg_ans_correct { background-color: #D5FFD5!important;color: #00B300!important;border-color: #00B300!important; }
.cus_tab_btn { background-color: transparent;border: none;padding: .3rem .5rem;font-size: .7rem;cursor: pointer;border-bottom: 2px solid transparent; }
.cus_tab_btn.atv { border-bottom: 2px solid #0e7490!important; }
.cus_tab_cnt { display: none;opacity: 0;transition: all .1s linear; }
.cus_tab_cnt.atv { display: block!important;opacity: 1!important;transition: all .2s linear; }
.cus_list_sw_btn { position: absolute;right: 0;top: 0;z-index:60;outline: none!important;border: none !important; }
.cus_list_sw_btn:focus { outline: none!important;border: none !important; }
.cus_list_con { position: absolute;right: 0;top: 0;z-index: 59;width: fit-content;border-radius: .2rem;margin-right: 1.5rem; }
.cus_list_crd { background-color: #fff;padding: 0;margin-top: 2.7rem;max-height: 0;max-width: 0rem;transition: all .2s ease-in-out;opacity: 0;overflow: hidden; }
.cus_list_crd.active { max-height: 70vh;max-width: 99rem;transition: all .2s ease-in-out;opacity: 1; }
.cus_list_tb { flex-grow: 1;overflow-y: auto; }
.s_data_con { list-style: none;margin: 0;padding:0; }
.s_data { display: flex; }
.s_data .s_links { padding: .35rem 0; }
.cus_list_img { height: 20px; width: 20px; object-fit: cover; object-position: center; border-radius: 50% }
.table thead tr { background-color: #0e7490!important; }
.table thead tr th { border: none !important;color: #f1f1f1!important; }
.set-menu-ul { padding: 0!important;list-style: none!important; }
.set-menu-ul .set-menu-items { padding: .4rem!important;border: 1px solid #e1e1e1;font-size: .85rem;margin-bottom: .2rem; }
.accordion-button { font-size: .9rem!important;font-weight: 600;padding: .5rem 1.3rem; }

#photoModalCus { 
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, .7);
    z-index: 999;
    display: flex;
}
#photoModalContent {
    display: flex;
    flex-direction: column;
/*    background-color: #fff;*/
    margin: auto;
/*    overflow: hidden;*/
    position: relative;
    border-radius: 10px;
    width: calc(100vw - 200px);
    height: calc(100vh - 200px);
}
#photoModalClose {
/*    position: absolute;*/
    bottom: 100%;
    right: 0;
/*    color: #fff;*/
    background-color: #fff;
    font-size: .75rem;
    padding: .3rem .5rem;
    border-radius: 50%;
/*    margin-bottom: 15px;*/
	margin: 10px auto;
}
#photoModalFrame { 
	width: 100%;
	height: 100%;
}
.modalCon {
	overflow: hidden;
	width: 100%;
	height: 100%;
    border-radius: 10px;
}
.close-modal { display: none!important; }
.enlarge_btn { font-size: .8rem;display: flex;text-align:center;align-items:center;justify-content: center;gap: .3rem;cursor: pointer; }


/* Datatable styles */
.datatable { width: 100% !important; }
.dataTables_wrapper .dataTables_paginate { font-size: .75rem; border: 1px solid #ccc !important; margin: .8rem 0; padding: 0 !important; border-radius: 5px;overflow: hidden; }
.dataTables_wrapper .dataTables_paginate .paginate_button:focus { outline: none !important; box-shadow: none !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button:active { background: inherit !important; box-shadow: none !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button { padding: .3rem .8rem !important; color: #171717 !important; border: none !important; border-radius: 0 !important; margin: 0 !important; font-weight: 600 !important;background-color: #E4E1E1!important; }
.dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: #d1d1d1 !important; color: #171717 !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current { background: #0e7490 !important; color: #fff !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { color: #fff !important; }
.dataTables_wrapper .dataTables_scroll { margin-top: 5px; }
.dataTables_wrapper table { vertical-align: middle; }
/*.dataTables_wrapper table tfoot { background-color: #d3d3d3!important; }*/
.dataTables_wrapper table tfoot tr th { color: #4A4A4A!important; }
.dataTables_wrapper .dataTables_scrollFootInner { padding-right: 0!important }
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled { cursor: not-allowed!important;color: #838383!important;background-color: #E4E1E1!important; }
.dataTables_wrapper .dataTables_scrollHeadInner, .dataTables_wrapper .dataTables_scrollFootInner { width: 100%!important; }
/*.dataTables_wrapper.no-footer .dataTables_scrollBody { border-bottom: none!important; }*/
.dt-buttons { display: flex !important; height: fit-content !important; padding: .2rem !important; float: unset !important; justify-content: end; }
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover { background: inherit !important; color: #838383!important;background-color: #E4E1E1!important; }
.dataTables_wrapper .dataTables_filter { float: left !important; margin-top: 6px; }
.dataTables_wrapper .dataTables_filter input { margin: 0 !important; }
.dataTables_wrapper .dataTables_filter input:focus { outline: none !important; border-color: #0D6EFD !important; }
.dt-buttons>.dt-button { margin: 0 !important; padding: .3rem .5rem !important; border: none !important; background: #E4E1E1!important; }
.dt-buttons>.dt-button:focus { outline: none !important; box-shadow: none !important; }
.dt-buttons>.dt-button:hover { background: #0e7490 !important; color: #fff !important; }
.dt-button-down-arrow { display: none !important; }
.dt-button-background { display: none !important; }
.dt-button-collection { margin: 0 !important; font-size: .75rem; border: none !important; right: .5rem !important; left: unset !important; }

::-webkit-scrollbar {
  width: .3rem;
  height: .3rem;
}
 
::-webkit-scrollbar-track {
  background-color: #eee;
}
 
::-webkit-scrollbar-thumb {
  background-color: darkgrey;
}

/* Datatable custom element styles */
.datatable ul{ padding: 0!important;list-style: none!important; }
.datatable ul li{ padding: 0 .2rem!important; }
.datatable button:focus, .datatable a:focus { outline: none !important; border: none !important; }
.datatable button, .datatable a { outline: none !important; border: none !important; padding: .3rem .5rem !important; }
.datatable button:hover, .datatable a:hover { background: #F1F2F5 !important; color: #171717 !important; }
.datatable button[title=Delete] { color: #F66F6F!important; }



/*Calendar*/
.fc-h-event .fc-event-title-container { text-align: center; }




/* Responsive styles */
@media only screen and (max-width:1800px) {
	.set-tab .nav-link { padding: 1rem !important; }
/*	.crd_fnt_sz { font-size: 1.125rem!important; }*/ }
@media only screen and (max-width:1100px) {
	.set-tab .nav-link { padding: .8rem !important; }
	.nav_drop { display: grid; grid-template-columns: 60% 40%; align-items: start; grid-gap: 0rem }
/*	.q_links_con:first-child { display: none }*/
}
@media only screen and (max-width:991px) {
	.nav_drop { display: grid; grid-template-columns: 1fr; align-items: start; grid-gap: 0rem }
	.q_links_con { display: none }
	.menu_item { border: 1px solid  #eee !important }
	.menus_main_con.active { max-height: 0rem; opacity: 0; transition: all .3s ease-in-out }
	.menus_main_con { max-height: 99rem; opacity: 1; transition: all .5s ease-in-out; transition: all .3s ease-in-out; overflow-y: auto }
	input, select, textarea, button { font-size: .75rem !important }
	.table-overflow { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
	.dash_crd { padding: 1rem !important; }
	.dataTables_wrapper .dataTables_filter { float: unset !important; }
}
@media only screen and (max-width:640px) {
	.sign_logo { height: 30px;width: 70px;content: url('../img/logo_only.png') }
	.nav_drop { display: grid; grid-template-columns: 1fr; align-items: start; grid-gap: 0rem }
	.q_links_con { display: none }
	.menu_item_sub { position: static; z-index: 50; top: 100%; font-size: 12px; width: 100%; left: 0; max-height: 0; opacity: 0; transition: all .2s linear; overflow: hidden }
	.menu_item_con { position: relative }
	.menu_item_sub_item_con { display: grid; grid-template-columns: 1fr; grid-gap: 0rem; padding-top: .5rem !important }
	.menu_item_sub_item { padding: .5rem; margin-left: 2.5rem; }
	.menu_item_sub_item span { display: none }
	.menu_item_con.active .menu_item_sub { height: fit-content !important }
	.menu_item_sub { border: none !important; }
	.menu_item { border: none !important; gap: 1rem !important }
	.menu_drop_icn { margin-left: auto }
	.menu_item { padding: 12px; cursor: pointer }
	.menu_item_sub_item p { font-size: .7rem !important; font-weight: 500 }
	.menus_main_con { max-width: 80vw; margin: 0; position: absolute; z-index: 99; left: 0; top: 100%; overflow-y: auto; max-height: calc(100vh - 54px); box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); z-index: 899 !important; margin-top: .5px }
	.menus_main_con.active { max-width: 80vw; margin: 0; max-height: 100vh; position: absolute; left: -100%; top: 100%; z-index: 899 !important; margin-top: .5px }
	.dataTables_wrapper .dataTables_paginate { width: fit-content !important; margin: .5rem auto; }
	.dt-buttons { justify-content: center; }
	.dash_crd { padding: .8rem !important; }
	.set-tab .nav-link { padding: .7rem !important; font-size: .65rem !important; }
	.tab_icn { margin-bottom: .2rem !important; }
	.menu_icn { height: 15px; width: 15px }
}