/*==========Fonts Cdn==========*/
@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');
/*==========Fonts Cdn==========*/
:root {
    --animation-1--: transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
    --grey-gradient--: linear-gradient(rgb(255 255 255), #e5e5e5);
    --primary-gradient--: linear-gradient(#4285F4, #116EEA);
    --primary-color--: 29, 108, 240;
}

.left-menu:has(.nav-logo) {
    padding-top: 0;
}

.left-menu > a.nav-logo {
    height: 70px;
    display: grid;
    place-items: center;
    border-bottom: 1px solid #0056e1;
    background: transparent !important;
    cursor: pointer;
}

    .nav-logo > img {
        height: 28px;
    }

.btn {
    padding-block: 4px;
    padding-inline: 8px;
}

.textbox-shadow-none-child .form-control {
    box-shadow: none !important;
}

 
.locaion-table #grid {
    border-top-width: 0px;
}

.locaion-table th:last-child,
.locaion-table td:last-child {
    width: 55px;
    text-align: center !important;
}

    .locaion-table th:last-child span {
        justify-content: center;
    }

.locaion-table .k-grid-toolbar {
    background-color: #ffffff;
    border-top-width: 0;
}

.devider1 {
    opacity: 1;
    background: #e8ebed;
    margin: 0;
}

.manager-scanner {
    display: flex;
}

    .manager-scanner > div:nth-child(1) {
        width: 450px;
    }

    .manager-scanner > div:nth-child(2) {
        width: 600px;
    }



.branch-flt {
    width: 300px !important;
}

.leave-badges {
    background: #efefef;
    border-radius: 6px;
    padding: 3px 5px;
    margin: 0 4px 4px 0;
}

.boder-light {
    border-color: #ebebeb !important;
}

.hr-monthview-pop {
    margin: 25px -12px;
    background: #a7a7a7;
}

.k-grid .k-table-tbody > .k-table-row:not(.k-detail-row):hover td:not(.reg-leave, .cust-leave),
.k-grid .k-table-tbody > .k-table-row:not(.k-detail-row).k-hover {
    background-color: #ededed !important;
}
/*.k-grid .k-table-tbody > .k-table-row.k-selected:hover td:not(.reg-leave, .cust-leave) td {
    background-color: rgba(var(--primary-color--), 0.15) !important;
}*/

.primary-bg-1 {
    background-image: var(--primary-gradient--) !important;
}

.bbc-lt {
    border-bottom-color: #efefef;
}

.bg-light-1 {
    background: #f7f7f7 !important;
}

.list-group-item {
    border-color: #e8ebed !important;
}



.location-icon {
    height: 90px;
    opacity: .3;
    margin: 0 0 30px 0;
}

.fl-dark {
    filter: invert(35%) sepia(2%) saturate(2443%) hue-rotate(292deg) brightness(57%) contrast(91%);
}

.fl-red {
    filter: invert(35%) sepia(81%) saturate(3330%) hue-rotate(341deg) brightness(103%) contrast(98%);
}

.monthy-attendance .k-pager-md .k-pager-sizes .k-dropdownlist {
    width: 85px;
}

.switch-admin.k-switch-off .k-switch-track {
    background: #34a853 !important;
    color: #fff;
}

body {
    font-size: 15px;
}
h1 {
font-size: 1.6em;
}
h2 {
    font-size: 1.3em;
}
h3 {
    font-size: 1.2em;
}
h4 {
    font-size: 1em;
}
h5 {
    font-size: 2em;
    padding-bottom: 4px;
  
    color: #ff6358;
}
strong{
font-weight:500 !important ;
padding-bottom:4px !important;

}
s
.warning-card {
    background: #FFE4E4;
    padding: 7px 10px;
    font-size: 14px;
    border-radius: 5px;
}

.info-card {
    background: #d9e8ff;
    padding: 7px 10px;
    font-size: 14px;
    border-radius: 5px;
}

.blue-outline {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #0d6efd !important;
}

.new-calendar .calendar .months-container .month-container {
    height: 281px;
    margin-bottom: 20px;
}

.new-calendar .calendar .calendar-header {
    border: 0;
    margin: 15px 0 20px 0;
}

.new-calendar .calendar table.month th.month-title {
    background: #ebebeb;
    color: #424242;
    padding: 9px;
    border-bottom: 1px solid #ddd;
}

.new-calendar .calendar table.month {
    box-shadow: none;
    border-radius: 10px;
    overflow: hidden;
    background: #f8f8f8;
    width: 94%;
}

    .new-calendar .calendar table.month th.day-header {
        color: #ababab;
    }

.new-calendar .calendar .calendar-header .year-title {
    font-weight: 600;
    opacity: 1;
    color: #2376ff;
}

    .new-calendar .calendar .calendar-header .year-title:not(.year-neighbor):not(.year-neighbor2) {
        border-radius: 5px;
        border: 0;
        background: #2376ff;
        color: #fff;
    }

.clr-prmy {
    color: #424242 !important;
}

.btn-primary-new, .k-button-solid-base.k-selected {
    background: linear-gradient(#5092ff, #116EEA);
    border-color: #4f91fe;
    color: #fff !important;
}



.print-body {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

    .print-body h5, .print-body p {
        word-break: break-all;
    }

    .print-body > .print-card {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center;
        width: 330px;
        text-align: center;
        background: #fff;
        border-radius: 5px;
        padding: 40px 15px;
        border: 1px solid #ddd;
        margin: 10px;
        page-break-after: always;
    }

        .print-body > .print-card > .pp {
            width: 137px;
            height: 137px;
            border-radius: 80%;
            border: 2px solid #fff;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        }



.nav-link {
    color: #116EEA;
}

.form-body {
    border: 1px solid #ddd;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 3px;
}

.p-8px {
    padding: 8px !important
}

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

.fs-15 {
    font-size: 15px !important;
}

.h-30px {
    height: 30px;
}

.outline-none {
    outline: none;
}

.open-days {
    display: flex;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

    .open-days > label {
        font-size: 15px;
        height: 34px;
        width: 78px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #efefef;
        margin: 0 10px 10px 0;
        border-radius: 5px;
        cursor: pointer;
        user-select: none;
    }



        .open-days > label > span {
            margin: 0 0 0 8px;
        }


.ver-hwead {
    writing-mode: vertical-lr;
    transform: rotate(180deg);
}

.monthy-attendance .k-table-thead {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.monthy-attendance .k-grid-content-locked, .monthy-attendance .k-grid-header-locked {
    width: 575px !important;
}

    .monthy-attendance .k-grid-content-locked tr > td, .monthy-attendance .k-table-tbody tr > td {
        border-bottom-width: 1px !important;
    }

.monthy-attendance .k-auto-scrollable td.k-table-td, .monthy-attendance .month-att-head {
    padding: 0 !important;
    text-align: center;
}

.table-bgs tbody .k-table-row {
    background: #fff !important;
}

    .table-bgs tbody .k-table-row:nth-child(even) {
        background: #f5f5f5 !important;
    }



.table-bgs .k-auto-scrollable tbody .k-table-row > td:hover, .table-bgs .k-auto-scrollable tbody .k-table-row > td:hover {
    background: #b7b7b7 !important;
}

.monthy-attendance .month-att-head {
    height: 78px;
    vertical-align: middle !important;
    width: 10px;
}

.monthy-attendance tr > th.reg-leave {
    background: linear-gradient(180deg, rgba(255,185,185,1) 0%, rgba(255,152,152,1) 100%) !important;
}

.monthy-attendance tr > th.cust-leave {
    background: linear-gradient(180deg, rgba(245,204,144,1) 0%, rgba(240,178,87,1) 100%) !important;
}


.monthy-attendance.table-bgs tr:nth-child(odd) > td.reg-leave {
    background: #FF9898 !important;
}

.monthy-attendance.table-bgs tr:nth-child(even) > td.reg-leave {
    background: #F08F8F !important;
}

.monthy-attendance.table-bgs tr:nth-child(odd) > td.cust-leave {
    background: #F0B257 !important;
}

.monthy-attendance.table-bgs tr:nth-child(even) > td.cust-leave {
    background: #DFA857 !important;
}

.islatecheckin {
    color: #FE3C3C;
    font-weight: 700;
}

.select-w-mv input {
    margin: 0 8px !important;
}

.att-check-m-0 input.k-select-checkbox {
    margin: 0 !important;
}

.attendance-table .att-check.k-table-td, .att-check {
    width: 35px;
    text-align: center !important;
    padding-block: 10px !important;
    padding-inline: 0px !important;
}

.attendance-table .k-selected:nth-child(odd) .k-table-td:nth-child(odd):not(.reg-leave,.cust-leave),
.attendance-table .k-selected:nth-child(odd) .k-table-td:nth-child(even):not(.reg-leave,.cust-leave),
.attendance-table .k-selected:nth-child(even) .k-table-td:nth-child(odd):not(.reg-leave,.cust-leave),
.attendance-table .k-selected:nth-child(even) .k-table-td:nth-child(even):not(.reg-leave,.cust-leave),
.td-selected-bg .k-selected > td,
body .k-grid .k-table-tbody > .k-table-row.k-selected:not(.k-detail-row) td:not(.reg-leave, .cust-leave) {
    background-color: rgba(var(--primary-color--), 0.15) !important;
}

.dark-chek input {
    background-color: #b5b5b5;
    border-color: #b5b5b5;
    margin: 0 0;
    width: 14px;
    height: 14px;
}

.att-check input.k-select-checkbox {
    background-color: #b5b5b5;
    border-color: #b5b5b5;
    margin: 0 15px;
}

    .att-check input.k-select-checkbox:checked, .k-checkbox:checked, .k-checkbox.k-checked {
        background-color: rgba(var(--primary-color--));
        border-color: rgba(var(--primary-color--));
        box-shadow: none !important;
    }

[data-role="buttonmenu"].k-menu-popup.k-popup.k-split-wrapper {
    box-shadow: rgb(0 0 0 / 19%) 0px 5px 18px;
    border-radius: 6px;
    border: 0 !important;
    padding: 10px 0;
}

    [data-role="buttonmenu"].k-menu-popup.k-popup.k-split-wrapper .k-group.k-menu-group > li > span {
        box-shadow: none !important;
    }

.manual-att-cta-check {
    background: linear-gradient(#55CE63, #00A724);
    border: 0;
    min-height: 30px;
}

.manual-att-cta-break {
    background: linear-gradient(#FFA621, #DC8400);
    border: 0;
    min-height: 30px;
}

.manual-att-cta-absent {
    background: linear-gradient(#FE3C3C, #D70000);
    border: 0;
    min-height: 30px;
}

.k-menu-group .k-item > .k-link:active, .k-menu-group .k-item > .k-link.k-active, .k-menu-group .k-item > .k-link.k-selected, .k-menu.k-context-menu .k-item > .k-link:active, .k-menu.k-context-menu .k-item > .k-link.k-active, .k-menu.k-context-menu .k-item > .k-link.k-selected {
    background-color: rgba(var(--primary-color--)) !important;
}

.bg-gray {
    background-image: var(--grey-gradient--) !important;
}

.k-grid .k-table-row.k-table-alt-row {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.scan-action-list .k-switch-sm .k-switch-thumb {
    width: 20px !important;
    height: 20px !important;
    border: 2px solid #ffffff;
    background: linear-gradient(#DFDFDF, #ffffff);
}

.scan-action-list .k-switch-sm .k-switch-label-on {
    left: 8px;
}

.scan-action-list .k-switch-sm .k-switch-label-off {
    right: 8px;
}

.scan-action-list .k-switch-off .k-switch-track {
    background: #dddddd;
    border: 0px;
}

.border-1-new-t {
    border-top: 1px solid #e8ebed !important;
}

.border-1-new-r {
    border-right: 1px solid #e8ebed !important;
}

.border-1-new-b {
    border-bottom: 1px solid #e8ebed !important;
}

.border-1-new-l {
    border-left: 1px solid #e8ebed !important;
}

.card {
    border: 1px solid #e8ebed;
    margin-bottom:12px;
}

.dropdown-menu {
    border: 1px solid #dddddd !important;
}

.k-grid .k-grid-md .k-table-th > .k-cell-inner > .k-link, .k-grid-md .k-table-th > .k-cell-inner > .k-link {
    padding-block: 10px !important;
    padding-inline: 10px !important;
}

.k-grid .k-grid-md td,
.k-grid .k-grid-md .k-table-td,
.k-grid-md td,
.k-grid-md .k-table-td, .check-pd {
    padding-block: 10px !important;
    padding-inline: 10px !important;
}

.k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover, .k-list-item.k-selected.k-hover, .k-selected.k-hover.k-list-optionlabel {
    background-color: #eb5b51 !important;
}

.k-input-solid {
    border: 1px solid #dee2e6 !important;
    background-image: linear-gradient(rgb(255 255 255), #EDEDED) !important;
}

.k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover, .k-list-item.k-selected.k-hover, .k-selected.k-hover.k-list-optionlabel {
    background-color: rgba(var(--primary-color--)) !important;
}

.k-grid-pager {
    background: #ffffff !important;
}

.k-switch-on .k-switch-track {
    border: none !important;
    background: var(--primary-gradient--) !important;
}

.scanning-tab {
    width: 100%;
}

    .scanning-tab > .k-button {
        width: 33.3333%;
        padding: 12px 0;
        font-size: 15px;
        box-shadow: none !important;
        background: #F0F0F0;
        border: 0;
    }

        .scanning-tab > .k-button:hover {
            background: #d4d4d4;
        }

        .scanning-tab > .k-button.k-selected {
            background: var(--primary-gradient--);
            border-radius: 4px !important;
            box-shadow: rgba(var(--primary-color--), 0.25) 0px 7px 29px 0px !important;
        }

.k-list-item.k-selected, .k-selected.k-list-optionlabel {
    background-color: rgba(var(--primary-color--)) !important;
    box-shadow: none;
}

.dropdown-divider {
    border-top: 1px solid rgb(151 151 151);
}

.fs-15 {
    font-size: 15px !important;
}

.newcard {
    padding: 12px 16px !important;
    min-height: 55px;
    display: flex;
    align-items: center;
    border-color: #e8ebed;
}

.attendance-table .k-pager-numbers .k-selected, .paging-active .k-pager-numbers .k-selected, .k-button-flat-primary {
    color: #116EEA;
}

.attendance-table .k-pager.k-grid-pager {
    border-color: #ebebeb !important;
}


.me-6px {
    margin-right: 6px;
}

.fs-13 {
    font-size: 13px !important;
}

.fw-500, .k-no-data, .k-nodata {
    font-weight: 500 !important;
}

.attendance-table .k-grid-toolbar {
    padding: 12px 16px;
}

.attendance-table .k-toolbar {
    background: #fff;
}

.attendance-table .k-table-thead {
    background: #fff;
}

.navbar {
    height: 70px;
    padding: 0 12px !important;
}

.btn-default {
    width: initial;
    font-size: 14px;
    padding: 2px 2px;
    border: 1px solid #dee2e6;
    background: #ffffff !important;
}

.lh-16 {
    line-height: 16px;
}

.lh-18 {
    line-height: 18px;
}


.navbar-nav .nav-link {
    font-size: 15px;
}

.navbar-nav button.nav-link {
    width: 37px;
    height: 37px;
    padding-left: 10px !important;
}

.navbar-nav .nav-link .dp-letter {
    height: 37px;
    width: 37px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #999999;
    border-radius: 50%;
    color: #fff;
    text-transform: capitalize;
}

html {
    font-size: 14px;
    margin:10px;

    height: auto;
}
body{
   
   height: 100%;
}
* {
    font-family: "Poppins", sans-serif !important;
}

.navbar-brand {
    font-size: 24px;
    font-weight: inherit;
    padding: 0;
}

    .navbar-brand > img {
        height: 28px;
        margin-right: 2px;
    }

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body:has(.print-body), .bg-primary-fade {
    background: linear-gradient(310deg, #D2E4FF 0%, #F3F8FF 100%);
}



.body-dark, .body-dark:has(.print-body-no-bg) {
    background: linear-gradient(332deg, rgba(0, 63, 167, 1) 0%, rgb(20 109 255) 100%);
    background-repeat: no-repeat;
}

body:has(.body-white) {
    background: #fff !important;
}

.body-content {
    background: #eaeaea;
    width: calc(100% - 100px);
}

/*Quick UI CSS*/
.js-quickui {
    display: none;
}

    .js-quickui.active {
        display: block;
    }

/*Quick UI CSS Ends*/

form hr {
    border: solid 1px #999;
}



.card-app {
    max-width: 200px;
}

.sec {
    padding: 50px;
}

.sec-gray {
    background: linear-gradient(to bottom,#f5f5f5 20%, #ffffff);
}

.no-bg {
    background: transparent;
}

.card-view .k-listview-content {
    display: flex;
    overflow-x: hidden;
    flex-wrap: wrap;
   
}
.card-view .k-listview-item {
    border-color: rgba(0, 0, 0, 0.08);
    margin: 5px 0;
}
.icon-xs {
    width: 16px;
    height: 16px;
}

.no-deco {
    text-decoration: none;
}

.plan-table th {
    padding: 25px 10px;
}

    .plan-table th.head {
        position: relative;
    }

.plan-table .recommended {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 0;
}

    .plan-table .recommended span.badge {
        display: inline-block;
        background: linear-gradient(to right, #ff0000 20%, #ff6a00);
    }

.svg-icon-24 {
    width: 24px;
    height: 24px;
}

.svg-icon-18 {
    width: 18px;
    height: 18px;
}

.pos-relative {
    position: relative;
}

.btn-primary svg {
    fill: #fff;
}

.main-cta-panel {
    /* border-top: solid 1px #258cfb;
    background: #fff;*/
}

    .main-cta-panel > .panel-body {
        padding: 20px;
    }

.tab-pane {
    padding: 15px;
    background: #fff;
    border-left: solid 1px #ddd;
    border-right: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
}

.svg-active {
    fill: #3fc453;
}

.svg-inactive {
    fill: #ff0000;
}

.svg-16 {
    width: 16px;
    height: 16px;
}

.svg-24 {
    width: 24px;
    height: 24px;
}

.text-muted {
    font-size: .75em;
}

.left-bar {
    height: 100vh;
    text-align: center;
    width: 100px;
}

    .left-bar svg {
        fill: #fff;
        text-align: center;
        background: transparent;
    }

    .left-bar a span {
        display: block;
        margin-top: 10px;
    }

    .left-bar a:active {
        color: red;
    }

.left-menu {
    padding-top: 69px;
    vertical-align: middle;
}

.left-menu {
    font-size: .8em;
}

    .left-menu svg {
        width: 22px;
        height: 22px;
    }

    .left-menu a {
        color: #fff;
        font-size: 1.09375em;
        display: block;
        padding: 20px 0 18px 0;
        text-decoration: none;
        border-bottom: 1px solid #0056e1;
        position: relative;
    }

    .left-menu .nav > *:last-child > a, .left-menu .nav > a:last-child {
        border: none;
    }

    .left-menu a:hover, .left-menu a.active {
        background: #1350b3;
    }

    .left-menu .nav-link:focus, .nav-link:hover {
        color: #fff;
    }

    .left-menu .dropend > .nav-link.show:before {
        content: '';
        position: absolute;
        top: 15px;
        right: -10px;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid #1b67e5;
        transition: var(--animation-1--);
    }

    .left-menu .dropend > .nav-link.show:hover:before {
        border-left-color: #1350b3;
    }

.promo-icon {
    max-width: 80px;
}

.progress {
    position: absolute;
    top: 0;
    width: 100%;
    background: none;
    overflow: visible;
}

    .progress > .indicator {
        margin: auto;
        background: #ffea00;
        padding: 5px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

.dropdown.dropend .side-popup {
    left: 12px !important;
    padding: 10px 0;
    border: 0;
    border-radius: 6px;
    box-shadow: rgb(0 0 0 / 19%) 0px 5px 18px;
}

.side-popup a {
    color: #666 !important;
    padding: 0px 12px;
    white-space: nowrap;
    font-size: 14px;
    border: none;
    line-height: 28px;
}

    .side-popup a:last-child > span {
        border: none
    }


    .side-popup a:hover, .side-popup a.active {
        background: #ececec;
    }

    .side-popup a > span {
        margin: 0;
        padding: 6px 0;
        border-bottom: 1px solid #ececec;
    }

.alert-sm {
    padding: 2px 10px;
}

.k-grid a.btn-link {
    color: #0d65f5 !important;
}


.stretched-link::after {
    z-index: 3;
}

.shortcut {
    background: #e2e2e2;
    position: relative;
}

    .shortcut div.grad-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        display: block;
        z-index: 2;
        background: transparent linear-gradient(to bottom, #ffffffee, transparent) repeat-x;
    }

.camerablock {
    min-width: 300px;
    min-height: 300px;
    background-color: #465250;
}

    .camerablock > div > div:nth-child(1), .camerablock > div > div:nth-child(3) {
        border-radius: 0px 50px 50px 0px;
    }

    .camerablock > div > div:nth-child(2), .camerablock > div > div:nth-child(4) {
        border-radius: 50px 0px 0px 50px;
    }

    .camerablock > div > div:nth-child(5), .camerablock > div > div:nth-child(7) {
        border-radius: 0px 0px 50px 50px;
    }

    .camerablock > div > div:nth-child(6), .camerablock > div > div:nth-child(8) {
        border-radius: 50px 50px 0px 0px;
    }


.k-grid .k-grid-header-locked, .k-grid .k-grid-content-locked, .k-grid .k-grid-header-locked .k-table-th, .k-grid .k-grid-content-locked td, .k-grid .k-grid-content-locked .k-table-td {
    border-color: rgba(0, 0, 0, 0.08);
}

button.html5-qrcode-element {
    border-radius: 5px;
    border: solid 1px #ddd;
    padding: 5px 15px !important;
}

.camera-bg {
    overflow: hidden;
    background: linear-gradient(to bottom, #52524d, #070706);
    position: relative;
    border-radius: 10px;
    box-shadow: rgba(var(--primary-color--), 0.10) 0px 7px 29px 0px !important;
    width: 50%;
}

.attendee {
    background: #fff;
    padding: 5px;
    border-radius: 10px;
}

    .attendee p {
        margin: 0;
        padding: 0;
    }

.pba {
    page-break-after: always;
}

.legend-bar {
    line-height: 15px;
}

.legend-block {
    display: inline-block;
    width: 15px;
    height: 15px;
}

@media (max-width: 1400px) {
    .attendance-table.attendance-manual-res .k-grid-toolbar,
    .monthy-attendance .k-grid-toolbar,
    #gridAttendees .k-grid-toolbar,
    #gridBranches .k-grid-toolbar {
        flex-wrap: wrap;
    }
    /* .attendance-table.attendance-manual-res {
    }

        .attendance-table.attendance-manual-res > div {
            display: block;
            overflow: scroll;
        }

            .attendance-table.attendance-manual-res > div > .k-grid-toolbar {
                width: max-content;
            }

            .attendance-table.attendance-manual-res > div > table {
                width: 1170px;
            }*/
}

@media (max-width: 1300px) {
    /*   #gridAttendees {
        display: block;
        overflow: scroll;
    }

        #gridAttendees > .k-grid-toolbar {
            width: max-content;
        }

        #gridAttendees > table {

        }*/

    .manager-scanner > div:nth-child(1) {
        width: 380px;
    }

    .manager-scanner > div:nth-child(2) {
        width: 490px;
    }

    .attendance-table.attendance-dash-res table.k-grid-table.k-table.k-table-md {
        display: block;
        overflow: scroll;
    }
}

@media (max-width: 767px) {
    .open-days > label {
        font-size: 13px;
        height: 30px;
        width: 70px;
        margin: 0 7px 7px 0;
    }

    .left-bar a span {
        font-size: 11px;
    }

    .body-content {
        width: calc(100% - 80px);
        min-height: 100vh;
    }

    .left-bar {
        width: 80px;
    }

    .branch-flt {
        width: 150px !important;
    }

    .attendee-view .left-bar {
        height: 0;
        width: 0;
    }

    .attendee-view .left-menu svg {
        fill: #1350b3;
    }

    .attendee-view .left-menu .active svg {
        fill: #0d6efd;
    }

    .attendee-view .left-menu a:hover, .attendee-view .left-menu a.active {
        background: #0d6efd21;
    }

    .camera-bg {
        width: 100%;
    }

    .camerablock {
        height: 100% !important;
        width: 100% !important;
    }
    .attendee-view .left-menu:has(.nav-logo) .nav-logo {
        display: none;
    }
    .attendee-view .navbar-brand > img {
        display: inline-block;
    }
    .attendee-view main {
        margin-bottom: 60px;
    }


    .attendee-view .left-menu {
        position: fixed;
        z-index: 999;
        background: #fff;
        height: auto;
        width: 100%;
        padding: 10px 0;
        backdrop-filter: blur(10px);
        bottom: 0;
        border-top: 1px solid #ddd;
    }

        .attendee-view .left-menu .left-menu {
            padding-top: 0;
        }

        .attendee-view .left-menu > .mb-3 {
            margin: 0 !important;
        }

        .attendee-view .left-menu .nav.flex-column {
            flex-direction: row !important;
            justify-content: center;
        }

            .attendee-view .left-menu .nav.flex-column > a {
                padding: 0;
                width: 110px;
                height: 50px;
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                align-items: center;
                border-radius: 10px;
                margin: 0 3px;
                border: 0;
            }

                .attendee-view .left-menu .nav.flex-column > a > span {
                    margin: 0 0 0 6px;
                    font-size: 14px;
                    color: #212529;
                }

                .attendee-view .left-menu .nav.flex-column > a.active > span {
                    color: #0d6efd;
                }

    .manager-scanner > div {
        width: 100% !important;
    }
}

@media (max-width: 575px) {

    #kAttendanceMode > button > span {
        text-wrap: balance;
        font-size: 11px;
    }



    .list-group-item > span:nth-child(1) {
        font-size: 12px;
    }

    .navbar-main-menu {
        position: absolute;
        right: 3px;
        top: 71px;
        background: #fff;
        z-index: 999;
        padding: 12px 0;
        border: 0;
        border-radius: 6px;
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
    }

        .navbar-main-menu > ul {
            flex-direction: column !important;
            width: 150px;
        }


            .navbar-main-menu > ul > li:nth-child(2) > a > span.dp-letter {
                width: auto;
                height: auto;
                background: #fff;
                color: #212529;
                font-size: 14px;
            }

            .navbar-main-menu > ul > li svg {
                width: 16px;
                height: 16px;
                margin: 0 3px 0 0;
                fill: #666666;
            }

            .navbar-main-menu > ul > li > form, .navbar-main-menu > ul > li:nth-child(2) a {
                width: 100%;
                padding: 0px 12px;
            }


            .navbar-main-menu > ul > li:nth-child(3) button {
                width: 100%;
                height: initial;
                background: #fff !important;
                border: 0 !important;
                padding: 0 !important;
            }

            .navbar-main-menu > ul .nav-link {
                font-size: 14px;
            }

    .border-sm-none {
        border: none !important;
    }
}

.justify-full {
    justify-content: space-between;
}
.full-link {
    color: #0d6efd !important;
}
.k-image.k-file-image{
    width:50px;
    height:50px;
}
.sub-head{
    font-size:1.25em;
    color:#116EEA;
}
.k-item{
 margin-left:3px;

}
.k-treeview-item {
    margin-left: 0;
    padding-left: 2px !important;
    padding-bottom: 2px !important;
    font-size: 1.1em;
   
    border-bottom: medium grey 1px !important;
}
.col-md-3 {
    padding-left: 5px;
    border-right: solid 5px #ddd;
    border-bottom: medium grey 1px !important;
    height: 100vh !important;
    overflow-y:auto !important;
}
img{
padding-bottom:3px !important;
}
.description {
    height: 90vh !important;
    overflow-y: auto !important;
    padding-bottom: 20px!important;

}
#appTemplate .k-listview-content {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.card {
    border-radius: 15px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    padding: 10px;
    position: relative;
}

.list_group ul {
    padding-bottom: 8px !important;
}