html {
    overflow: hidden
}

/*@supports (scrollbar-width: none) {
    .scrollbar-inner {
        scrollbar-width: thin;
    }
}*/

:root {
    --whitefontcolor: #ffffff;
    --whitebgcolor: #ffffff;
    --headingcolor: #0f4f92;
    --blackfontcolor: #000000;
    --lightgreycolor: #9c9c9c;
    --lightblackcolor: #3d3b3b;
    --headingcolor: #0f4f92;
    --blackfontcolor: #000000;
    --lightgreycolor: #9c9c9c;
    --lightblackcolor: #3d3b3b;
    --bluecolor: #0a3b7e;
    --activecolor: #042758;
    --skyblue: #09bef3;
    --skyhoverblue: #07aedf;
    --greencolor: #26AC46;
    --greenhovercolor: #179b37;
}

.tableData {
    width: 100%;
    display: block !important;
}

.filterData {
    display: flex !important;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
}

    .filterData > div {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .filterData .top label {
        margin-bottom: 0;
        padding-bottom: 0px !important;
    }

.table tr td {
    vertical-align: middle !important;
    border-collapse: separate !important;
}

body .btn.btn-info, body .btn.btn-primary, body .btn.btn-success {
    height: 38px;
}

.btn.btn-info {
    display: flex !important;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
}

.d-none {
    display: none !important
}

.d-flex {
    display: flex !important
}

.border-left {
    position: relative
}

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

.w-80.text-center {
    width: 80px;
}

.w-100 {
    width: 100px;
}

.mt-25 {
    margin-top: 25px;
}

.financialYearDropDown {
    background: #fff;
    padding: 7px 9px 10px;
    border-radius: 5px;
    width: 120px;
}

.ardateoic input {
    width: 200px;
}

.arlistselect span.select2 {
    min-width: 150px;
    max-width: 150px;
}

.financialYearDropDown select {
    min-height: initial !important;
    padding: 2px 2px 0px !important;
    border: none !important;
}

body .bredcrum-financial a i.feather {
    font-size: 19px !important;
    margin-right: 5px;
    color: var(--bluecolor);
}

body {
    font-family: 'Roboto',sans-serif !important;
    overflow: hidden !important;
}

    body .ginnerscroll.scrollbar-inner .scroll-element.scroll-y {
        right: 0;
    }
/*#myModalFilterEmployee .scroll-table{height: auto !important;width: 100% !important;}*/
.itemdesc .gicon {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 20px;
    border-radius: 50%;
    background: #f5f5f5;
    text-align: center;
    cursor: pointer;
}

    .itemdesc .gicon:hover, .itemdesc.open .gicon {
        background: var(--bluecolor);
        color: var(--whitefontcolor);
    }

        .itemdesc.open .gicon i.fa-angle-double-right:before {
            content: "\f103";
        }

.itemdesc .dropdown-menu {
    min-width: 220px;
    background: var(--whitebgcolor);
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: none;
    border-radius: 5px;
    margin: 0;
    padding: 10px 0 0;
    left: 50%;
    transform: translateX(-50%);
    top: 35px;
    z-index: 1;
}

.smallboxtags .itemdesc .dropdown-menu {
    min-width: 260px;
}

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

.discitemdata {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 8px;
}

.itemdesc .dropdown-menu:after, .itemdesc .dropdown-menu:before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.itemdesc .dropdown-menu:after {
    top: -25px;
    border: 12px solid transparent;
    border-bottom-color: #eee;
}

.itemdesc .dropdown-menu:before {
    top: -23px;
    border: 12px solid transparent;
    border-bottom-color: #fff;
    z-index: 1;
}

.itemdesc .dropdown-menu {
    padding: 0;
}

    .itemdesc .dropdown-menu li, .tagsview li span {
        color: var(--headingcolor);
        font-family: 'Roboto';
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        display: block;
        padding: 4px 5px;
        margin-left: 8px;
    }

.itemdesc a {
    display: inline-block;
    padding: 0 !important;
}

.itemdesc .dropdown-menu li h2 {
    margin: 0;
    font: 500 14px/20px 'Roboto';
    color: var(--headingcolor);
    display: block;
}

.itemdesc .dropdown-menu li p {
    margin: 0;
    font: 400 12px/18px 'Roboto';
    color: var(--blackfontcolor);
}

#load {
    position: fixed;
    left: 0;
    top: 0;
    background-color: #0a3c7f;
    width: 100%;
    height: 100%;
    z-index: 99999;
}

#loader {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.loader {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99;
    background: rgba(255, 255, 255, 0.7);
}

.lds-ripple {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

    .lds-ripple div {
        position: absolute;
        border: 4px solid var(--skyblue);
        opacity: 1;
        border-radius: 50%;
        animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .lds-ripple div:nth-child(2) {
            animation-delay: -0.5s;
        }

.dash_body.scrollbar-parent {
    margin-right: 0;
}

.action.tc {
    color: #ffa902;
    background: #fff2da;
}

.action.tu {
    color: #006d23;
    background: #cdf3c6;
}

.action.td {
    color: #bd002a;
    background: #ffe0e0;
}

.action.tcl {
    color: #2196f3;
    background: #cce7fd;
}

.action.r {
    color: #ed145b;
    background: #ffcede;
}

.action.rc {
    color: #7910e2;
    background: #e1c4ff;
}

.action.npu {
    color: #0a3b7e;
    background: #c6deff;
}

.action.npr {
    color: #05e091;
    background: #dafff2;
}

.action.fc {
    color: #b90dbc;
    background: #fecdff;
}

.action.dc {
    color: #5f5f5f;
    background: #e0dfe1;
}

.action.uc {
    color: #32bf00;
    background: #c6ffbc;
}

body .goverlay {
    position: relative;
}

    body .goverlay:after {
        content: "";
        position: fixed;
        left: 0;
        top: 67px;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.2);
        z-index: -1;
        animation: overlay-fade-in .4s ease 1;
        display: none;
    }

@keyframes lds-ripple {
    0% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 72px;
        height: 72px;
        opacity: 0;
    }
}

.openticket, .reopen, .newticket, .closeticket {
    font-size: 12px;
    border-radius: 4px;
    padding: 7px 10px;
    display: inline-block;
    color: #000;
}
/*.openticket,.openticket:hover{background: #CCE7FD;color: #2196F3;}
.reopen,.reopen:hover{background: #FFF2DA;color: #FFA902;} 
.newticket,.newticket:hover{background: #CDF3C6;color: #006D23;} 
.closeticket,.closeticket:hover{background: #FFE0E0;color: #BD002A;} */
.allModuleBig .modal-dialog {
    width: 750px !important;
}
/*body .scroll-table {height: calc(100vh - 235px) !important;}*/
body .chosen-container-single .chosen-single {
    font-weight: 400;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #8e8888;
    padding: 0 8px;
    height: 40px;
    line-height: 40px;
}

.border-left:after {
    content: "";
    position: absolute;
    top: 0;
    left: -80px;
    width: 1px;
    height: 100%;
    background: rgba(0,0,0,.1)
}

.gflex {
    display: flex;
    align-items: center;
    justify-content: center
}

.gflexdata {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 5px 0
}

.radioboxlabel, .checkboxlabel {
    padding: 10px 0 15px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

    .radioboxlabel h3, checkboxlabel h3 {
        font: 500 16px/20px 'Roboto',sans-serfi !important;
        color: #333;
        text-transform: capitalize;
    }

    .radioboxlabel table, .checkboxlabel table {
        width: auto;
        margin-top: 15px;
    }

        .radioboxlabel table tr td {
            padding: 4px 20px 0 30px;
            position: relative;
        }

        .checkboxlabel table tr td {
            padding: 1px 20px 0 30px;
            position: relative;
        }

            .radioboxlabel table tr td input[type="radio"], .checkboxlabel table tr td input[type="checkbox"] {
                position: absolute;
                left: 0;
                top: 2px;
                width: 20px;
                height: 20px;
                opacity: 0;
            }

            .radioboxlabel table tr td label:after, .checkboxlabel table tr td label:after {
                content: "";
                position: absolute;
                left: 0;
                top: 2px;
                width: 20px;
                height: 20px;
                border-radius: 50%;
                border: 1px solid #dbdfea;
            }

            .radioboxlabel table tr td label:before, .checkboxlabel table tr td label:before {
                content: "";
                position: absolute;
                left: 5px;
                top: 7px;
                width: 10px;
                height: 10px;
                border-radius: 50%;
                background: #0a3b7e;
                opacity: 0;
            }

            .radioboxlabel table tr td input[type="radio"]:checked + label:after, .checkboxlabel table tr td input[type="checkbox"]:checked + label:after {
                border-color: #0a3b7e;
            }

            .radioboxlabel table tr td input[type="radio"]:checked + label:before, .checkboxlabel table tr td input[type="checkbox"]:checked + label:before {
                opacity: 1;
            }

            .checkboxlabel table tr td label:after, .checkboxlabel table tr td label:before {
                border-radius: inherit;
            }

.radioboxdatalabel, .checkboxdatalabel {
    position: relative;
    display:
}

    .radioboxdatalabel input[type="radio"], .checkboxdatalabel input[type="checkbox"] {
        position: absolute;
        left: 0;
        top: 2px;
        width: 20px;
        height: 20px;
        opacity: 0;
        margin: 0 !important;
        z-index: 1;
    }

    .radioboxdatalabel label:after, .checkboxdatalabel label:after {
        content: "";
        position: absolute;
        left: 0;
        top: 2px;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        border: 1px solid #caced9;
    }

    .radioboxdatalabel label:before, .checkboxdatalabel label:before {
        content: "";
        position: absolute;
        left: 5px;
        top: 7px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #0a3b7e;
        opacity: 0;
    }

    .radioboxdatalabel input[type="radio"]:checked + label:after, .checkboxdatalabel input[type="checkbox"]:checked + label:after {
        border-color: #0a3b7e;
    }

    .radioboxdatalabel input[type="radio"]:checked + label:before, .checkboxdatalabel input[type="checkbox"]:checked + label:before {
        opacity: 1;
    }

    .checkboxdatalabel label:after, .checkboxdatalabel label:before {
        border-radius: inherit;
    }

    .checkboxdatalabel label:before {
        font-family: 'feather' !important;
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        content: "\e92b";
        background: transparent;
        left: 2px;
        top: 3px;
        font-size: 16px;
    }

.toggleBox input[type=checkbox] + label {
    width: 48px;
    height: 20px;
    background-color: transparent;
    border: 2px solid #dbdfea;
    margin: 0;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    font: 500 12px 'Roboto',sans-serif;
}

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

.toggleBox input[type=checkbox] + label:before {
    left: 2px;
    top: 0;
    box-shadow: none;
    background: #dbdfea;
    border-color: #dbdfea;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    width: 15px;
    height: 15px;
}

.toggleBox input[type=checkbox]:checked + label {
    background-color: #0a3b7e;
    border-color: #0a3b7e;
    box-shadow: inset 0 1px 1px rgb(16 25 36 / 8%);
}

    .toggleBox input[type=checkbox]:checked + label:before {
        background-color: #fff;
        left: inherit;
        right: 2px;
        top: 0;
    }

.toggleBox {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    position: relative;
}

    .toggleBox input[type=checkbox] {
        opacity: 0;
        width: 0;
        height: 0;
        position: absolute;
        left: -9999px
    }

    .toggleBox span input[type=checkbox] {
        opacity: 1;
        left: 0;
        width: auto;
        height: auto
    }

    .toggleBox input[type=checkbox] + label {
        width: 48px;
        height: 20px;
        background-color: transparent;
        border: 2px solid #dbdfea;
        margin: 0;
        transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
        font: 500 12px 'Roboto',sans-serif;
        border-radius: 15px;
    }

        .toggleBox input[type=checkbox] + label:before {
            left: 2px;
            top: 2px;
            box-shadow: none;
            background: #dbdfea;
            border-color: #dbdfea;
            transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
            width: 15px;
            height: 15px;
            content: "";
            position: absolute;
            display: inline-block;
            background-color: #f1f1f1;
            border-radius: 21px;
        }

    .toggleBox input[type=checkbox]:checked + label:before {
        background-color: #fff;
        left: inherit;
        right: 2px;
        top: 2px;
    }

    .toggleBox span:before {
        background-color: #26a69a;
        z-index: 9999;
        left: 25px
    }

    .toggleBox input[type=checkbox] + label:after {
        content: attr(data-off);
        position: absolute;
        right: -12px;
        white-space: nowrap;
        text-transform: uppercase;
        top: 2px;
        background: #f5f5f5;
        padding: 0 8px;
        border-radius: 5px;
        color: #818181;
        -moz-transition: left .3s,background .3s,box-shadow .1s;
        -o-transition: left .3s,background .3s,box-shadow .1s;
        -webkit-transition: left .3s,background .3s,box-shadow .1s;
        transition: left .3s,background .3s,box-shadow .1s;
        -moz-transform: translate(100%,0);
        -o-transform: translate(100%,0);
        -webkit-transform: translate(100%,0);
        transform: translate(100%,0);
        font-size: 12px;
        font-weight: 500;
        font-family: 'Roboto',sans-serif;
        padding: 4px;
    }

    .toggleBox input[type=checkbox]:checked + label:after {
        content: attr(data-on);
        color: #26a69a
    }

.gresetbutton {
    background: #fecb03;
    border: none;
    color: var(--blackfontcolor);
    box-shadow: none;
    border-radius: 0 4px 4px 0;
    min-width: 35px;
    height: 35px;
    line-height: 40px;
    text-align: center;
    padding: 0;
    display: inline-block;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0
}

    .gresetbutton:hover {
        background: #ffd223
    }

    .gresetbutton i, a.fliterbutton i, a.refreshbutton i {
        font-size: 18px !important
    }

.margin-25 {
    margin: 0 -20px !important
}
/*.filterSection,body .scroll-table{padding: 0 0 0 15px;}*/
.pageHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px !important;
    background: #eaf0f7;
    padding: 15px 18px 16px;
    border-bottom: 1px solid #DFDFDF;
    height: 54px;
}

    .pageHead h4 {
        font-size: 20px;
        font-weight: 500;
        color: var(--headingcolor);
        margin: 0;
    }

    .pageHead a {
        margin-left: 15px
    }

.pageheader p {
    font-size: 16px;
    font-weight: 400;
    color: var(--blackfontcolor);
    margin: 5px 0 15px;
    font-family: Roboto,sans-serif
}

.pageheader .pagebutton {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 20px;
    margin-bottom: 15px
}

.pageHead .pageheader .pagebutton {
    margin-bottom: 0
}

.greencolor, .infobutton, .pageheader .greencolor, .pageheader .greset, .pageheader a, .pageheader input, a.skyblue {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    padding: 8px 15px;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    font-weight: 500;
    color: var(--whitefontcolor);
    border-radius: 5px;
    box-shadow: none;
    text-transform: capitalize;
    width: auto;
    height: 35px;
    min-width: 80px;
    outline: 0;
    cursor: pointer;
}

a.fliterbutton, a.refreshbutton {
    min-width: 40px;
    height: 40px;
    line-height: 42px;
    text-align: center;
    padding: 0;
    box-shadow: none;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pageheader input {
    height: 18px;
    min-width: 18px;
    margin-top: 0px;
}

.pageheader input {
    background: #e7edf4;
    border-color: var(--bluecolor);
    color: var(--bluecolor);
}

body .pageheader .greset {
    color: #d43f3a
}

    .pageheader .greencolor, .pageheader a.skyblue:hover, .pageheader a:hover, .search_button:hover i, body .pageheader .greset:hover {
        color: var(--whitefontcolor)
    }

        .greencolor:focus, .pageheader .greencolor:focus {
            outline: 0;
            text-decoration: none
        }

.deletebutton {
    background: rgba(227, 53, 30, 0.1);
    color: #e3351e !important;
    border-color: #e3351e;
    padding: 8px 10px;
    min-width: 80px;
    outline: none;
    text-transform: capitalize;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
}

.employeedata.adminemployeedata {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
}

.deletebutton:hover {
    background: #e3351e;
    color: var(--whitefontcolor);
}

ul.nav.nav-tabs {
    display: -ms-flexbox;
    display: flex;
    white-space: nowrap;
    overflow: auto hidden;
    margin: 0 0 10px;
    border-bottom: 1px solid #dde3ed;
    justify-content: flex-start;
}

    ul.nav.nav-tabs li a {
        padding: 0;
        background: transparent;
        border: none !important;
        color: #888;
        display: flex;
        align-items: center;
        justify-content: center;
        column-gap: 8px;
    }

    ul.nav.nav-tabs li a, ul.nav.nav-tabs li button {
        color: #888;
        font-size: 14px;
        padding: 8px 14px;
        font-weight: 400;
        cursor: pointer;
        display: flex;
        -webkit-transform: perspective(1px) translateZ(0);
        transform: perspective(1px) translateZ(0);
        box-shadow: 0 0 1px rgb(0 0 0 / 0%);
        position: relative;
        column-gap: 8px;
        align-items: center;
        justify-content: flex-start;
        font-family: 'Roboto',sans-serif;
    }

    ul.nav.nav-tabs li span i, ul.nav.nav-tabs li i {
        margin-right: 5px
    }

    ul.nav.nav-tabs li a:before, ul.nav.nav-tabs li button:before {
        content: "";
        position: absolute;
        z-index: -1;
        left: 51%;
        right: 51%;
        bottom: 0;
        background: #0a3b7e;
        height: 2px;
        -webkit-transition-property: left,right;
        transition-property: left,right;
        -webkit-transition-duration: .3s;
        transition-duration: .3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out
    }

    ul.nav.nav-tabs li:hover a:before, ul.nav.nav-tabs li button:before, ul.nav.nav-tabs li button:hover:before {
        background: #09bef3;
    }

    ul.nav.nav-tabs li.active a:before, ul.nav.nav-tabs li:focus a:before, ul.nav.nav-tabs li:hover a:before, ul.nav.nav-tabs li.active button:before, ul.nav.nav-tabs li button:hover:before {
        left: 0;
        right: 0
    }

    ul.nav.nav-tabs li.active a, ul.nav.nav-tabs li button:hover, ul.nav.nav-tabs li.active button, ul.nav.nav-tabs li.active:hover button {
        border-color: #0a3b7e;
        color: #0a3b7e
    }

        ul.nav.nav-tabs li.active button:before {
            background: #0a3b7e;
        }

    ul.nav.nav-tabs li:hover a {
        border-color: #09bef3 !important;
        color: #09bef3 !important;
    }

    ul.nav.nav-tabs li button {
        background: transparent;
        font-size: 18px;
        border: none;
    }

        ul.nav.nav-tabs li button:hover {
            color: #09bef3;
        }

        ul.nav.nav-tabs li button:active {
            box-shadow: none
        }

    ul.nav.nav-tabs li i img {
        filter: brightness(0) saturate(100%) invert(60%) sepia(1%) saturate(0%) hue-rotate(358deg) brightness(90%) contrast(88%);
        width: 20px;
        object-fit: contain;
    }

    ul.nav.nav-tabs li.active i img, ul.nav.nav-tabs li:hover i img, ul.nav.nav-tabs li.active:hover i img {
        filter: brightness(0) saturate(100%) invert(20%) sepia(69%) saturate(2222%) hue-rotate(196deg) brightness(89%) contrast(89%);
    }

    ul.nav.nav-tabs li:hover i img {
        filter: brightness(0) saturate(100%) invert(64%) sepia(55%) saturate(2700%) hue-rotate(154deg) brightness(95%) contrast(101%);
    }

.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
    color: var(--headingcolor) !important;
}

.pageheader a i {
    font-size: 16px !important
}

.pageheader a.skyblue {
    background: #e6f8fe;
    border-color: var(--skyblue);
    color: var(--skyblue)
}

.pageheader .infobutton, a.fliterbutton {
    color: var(--bluecolor)
}

.pageheader a.skyblue:hover {
    background: var(--skyhoverblue)
}

.infobutton, .pageheader a.bluecolor, .pageheader button.bluecolor {
    background: #e7edf4;
    border-color: var(--bluecolor);
    color: var(--bluecolor);
    display: flex;
}

    .infobutton:hover, .pageheader a.bluecolor:hover, .pageheader button.bluecolor:hover {
        background: var(--bluecolor);
        border-color: var(--bluecolor);
        color: var(--whitefontcolor)
    }

    .infobutton i, .pageheader a.bluecolor i, .pageheader button.bluecolor i {
        font-size: 18px;
        margin-right: 5px;
    }

.greencolor, .pageheader .greencolor, .pageheader a.greencolor {
    background: var(--greencolor);
    border-color: var(--greencolor)
}

.pageheader .select_competency {
    background: var(--greencolor) !important;
    border-color: var(--greencolor) !important;
    color: var(--whitefontcolor) !important;
    padding: 10px 15px !important;
    height: auto !important;
    line-height: inherit !important
}

.search_button {
    background: rgba(254, 203, 3, 0.1);
    border: 1px solid #fecb03;
    border-radius: 4px;
    padding: 8px 10px;
    cursor: pointer;
}

    .search_button i {
        font-size: 20px;
        color: #fecb03;
    }

    .search_button:hover {
        background: #fecb03;
    }

        .search_button:hover i {
            color: var(--whitefontcolor);
        }

.searchbox {
    background: rgba(254, 203, 3, 0.05);
    border: 1px solid #fecb03;
    border-radius: 4px;
    padding: 0 35px 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 15px;
    position: relative;
}

.searchbox {
    display: flex;
}

    .searchbox .theInput {
        padding: 0;
        border: none;
        background: transparent;
        text-overflow: ellipsis;
        margin-bottom: 0;
    }

    .searchbox .Applicantselect {
        background: #fff;
        border: 1px solid rgba(0, 0, 0, 0.1);
        border-radius: 4px;
        box-shadow: none;
        width: auto;
    }

    .searchbox .theButton {
        background: #f9ebcb url("../Images/menu_icon/search.png") no-repeat center;
        border: none;
        width: 35px;
        height: 35px;
    }

.breadcrumbSection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px !important;
    background: rgb(235,238,247);
    padding: 15px 15px 15px;
    border-bottom: 1px solid #DFDFDF;
    height: 60px;
    width: 100%;
}

.toprowbreadcrumbSection {
    display: flex;
    align-items: center;
    width: 100%;
    column-gap: 15px;
}

.pageheader .pagebutton .d-flex {
    padding: 4px 60px 4px 4px;
    column-gap: 10px;
    width: 400px;
    background: rgba(0,174,250,0.17);
    border: 1px solid #00aefa;
    border-radius: 5px;
    position: relative;
}

    .pageheader .pagebutton .d-flex select, .pageheader .pagebutton .d-flex input {
        padding: 4px 9px 5px 9px;
        height: auto;
        min-height: inherit;
        line-height: 14px;
        font-size: 13px;
    }

    .pageheader .pagebutton .d-flex input {
        background: transparent;
        border: none;
        color: #000;
        font: 400 14px 'Roboto',sans-serif;
    }

        .pageheader .pagebutton .d-flex input::-webkit-input-placeholder {
            opacity: 1;
            color: #000;
        }

        .pageheader .pagebutton .d-flex input::-moz-placeholder {
            opacity: 1;
            color: #000;
        }

        .pageheader .pagebutton .d-flex input::-ms-input-placeholder {
            opacity: 1;
            color: #000;
        }

        .pageheader .pagebutton .d-flex input[type=button] {
            background: rgba(0,174,250,1) !important;
            color: #fff;
            border: none;
            position: absolute;
            right: 0;
            height: 100%;
            border-radius: 0 3px 3px 0;
            font: 500 12px 'Roboto',sans-serif;
            min-width: 50px;
            text-transform: capitalize;
            height: 36px !important;
        }
/****** Header ********/
.sidebar .panel-group .panel + .panel {
    margin-top: 15px;
}

body .masterInnerBody {
    overflow-x: hidden;
    background: #fafafc;
}

    body .masterInnerBody .container-fluid {
        margin: 0;
    }

body .masterInnerNavbar {
    border: none;
    padding-left: 66px;
    background: var(--whitebgcolor);
    position: sticky;
    top: 0;
    z-index: 99;
}

.masterInnerBody {
    padding-left: 280px;
    transition: padding 500ms ease;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

body .masterInnerBody {
    overflow: hidden;
    background: #fafafc;
    height: 100%;
    padding-bottom: 30px;
    position: relative;
}

.logoContainer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    background: #fff;
}

    .logoContainer img {
        width: auto;
        height: 44px;
    }

.logo-name h3 {
    font-size: 16px;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
    color: #2cb34c;
    margin: 0;
    border-left: 1px solid #2cb34c;
    line-height: 30px;
    padding-left: 15px;
    margin-left: 15px;
    display: none;
}

.logoContainer .gmenubar {
    font-size: 24px;
    color: var(--bluecolor);
    text-align: center;
    cursor: pointer;
    position: relative;
    width: 36px;
    height: 36px;
    line-height: 36px;
    z-index: 1;
    margin-left: 10px;
}

    .logoContainer .gmenubar:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: -1;
        height: 20px;
        width: 20px;
        transform-origin: 50% 50%;
        background-color: #e5e9f2;
        border-radius: 50%;
        opacity: 0;
        transition: all .3s;
    }

    .logoContainer .gmenubar:hover:after {
        opacity: 1;
        width: 120%;
        height: 120%;
    }

.module_logo {
    background: #022f5f;
    padding: 18px 14px 18px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 10px;
    position: relative; /*overflow: hidden;*/
    position: absolute;
    left: -7px;
    top: 0;
    width: 65px;
    height: 66px;
}

    .module_logo img {
        width: 30px;
        height: auto;
        opacity: 0.85;
    }

    .module_logo h2 {
        font-weight: 300;
        font-size: 18px;
        line-height: 24px;
        color: rgba(255,255,255,1);
        margin: 0;
        white-space: nowrap;
    }

.menu_bar.d_flex {
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

    .menu_bar.d_flex .logoContainer {
        border-bottom: none;
    }

body .gmenu.scroll-wrapper {
    padding: 0 !important;
}

.menu_list {
    position: fixed;
    left: 0;
    top: 0;
    width: 260px;
    height: 100%;
    z-index: 999;
    background: #0F4F92;
    box-shadow: 5px 0px 4px rgb(0 0 0 / 30%);
    transition: .8s ease;
}
/*body .tablescrollbar {height:  calc(100vh - 200px) !important;overflow: inherit !important;}
body .tablescrollbar.scrollbar-inner > .scroll-element.scroll-y{right: -7px;}*/
body .module_menu_scroll {
    height: calc(100vh - 80px) !important;
}

body .menu_list .gmenu {
    height: calc(100vh - 165px) !important; /*margin: 8px 0 0;*/
    overflow-x: hidden !important;
}

.menu_list li a {
    position: relative;
    transition: color .3s,background-color .3s;
    padding: 14px 17px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 2px 0;
    height: auto;
    margin-bottom: 0;
    outline: none;
}

.menu_list li ul li ul {
    margin: 5px 0;
}

    .menu_list li ul li ul li a {
        position: relative;
        display: block;
        padding: 0;
        margin-left: 55px;
    }

        .menu_list li ul li ul li a span {
            font-size: 14px;
            display: block;
            position: relative;
            display: block;
            padding: 9px 5px 9px 20px;
            color: rgba(255,255,255,0.8);
        }

            .menu_list li ul li ul li a span:before {
                content: "";
                position: absolute;
                left: 0;
                top: 0;
                width: 1px;
                height: 100%;
                background: rgba(255,255,255,0.4);
            }

.menu_list li a .desk_menu {
    display: flex;
    align-items: center;
    column-gap: 10px;
    width: 100%;
}

.menu_list li a:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 0;
    background: #00F0FF;
    transition: all 500ms ease;
}

.menu_list li a i.icon {
    width: 24px;
    height: 24px;
    flex-grow: 0;
    flex-shrink: 0; /*overflow: hidden;*/
    display: block;
}

    .menu_list li a i.icon img {
        width: 100%;
        height: auto;
    }
/*.menu_list li a:hover,.menu_list li.active a,.menuactive > a{background: var(--activecolor);}*/
.menu_list li a:hover img, .menu_list li.active a img, .menuactive a img { /*transform: translateY(-50%);*/
    filter: invert(71%) sepia(16%) saturate(4928%) hue-rotate(181deg) brightness(221%) contrast(100%);
}

.menu_list li a:hover span, .menu_list li.active > a span, .menu_list li.active > a i, .menu_list li a:hover .menudrop, .menu_list li.menuactive a.submenudrop span, .menu_list li.menuactive a.submenudrop i {
    color: #00F0FF !important;
}

.menu_list li.menuactive a.submenudrop .menudrop:before {
    content: "\e996";
}
/*.menu_list li a:hover:after,.menu_list li.active a:after{height: 100%;}*/
.menu_list li a span {
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
    font-family: 'Roboto', sans-serif;
    text-align: left;
    color: rgba(255,255,255,0.8);
    text-transform: capitalize;
    flex-grow: 1;
    display: inline-block;
    white-space: nowrap;
}

.pinmenu {
    position: relative;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 16px;
}

.menubaricon {
    font-size: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center; /*background: rgba(255,255,255,0.85);color: var(--blackfontcolor);font-size: 20px;*/
    cursor: pointer;
    width: 23px;
    height: 30px;
    position: absolute;
    top: 0;
    right: 10px;
    border-radius: 5px 0 0 5px;
    z-index: 999;
}

    .menubaricon i {
        font-size: 14px;
    }

.menusmall {
    color: #fff;
    width: 30px;
    height: 30px;
    text-align: center;
    font-size: 28px;
    display: none;
    cursor: pointer;
}

.menubaricon span {
    font-size: 12px;
    line-height: 20px;
    display: none;
}

.menu_list li a .samll_menu {
    text-align: center;
    display: none;
}

.menubaricon.gmenubar.menuactive i:before {
    content: "\f104";
}

.menu_list.gclose li a .samll_menu {
    display: block;
}

.menu_list li a .samll_menu i {
    margin: 0 auto;
}

.menu_list.gclose:hover li a .samll_menu {
    opacity: 0;
    visibility: hidden;
    display: none;
}

body.gmenuclose .logoContainer {
    height: auto;
    justify-content: center;
}

.sub_ats_menu_css, .setup_sub_menu {
    position: relative;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    display: none;
}

    .sub_ats_menu_css li {
        border: none;
    }

        .sub_ats_menu_css li a {
            background: transparent !important;
            color: rgba(255,255,255,0.8);
            margin-left: 30px;
            padding: 7px 5px 7px 20px;
            margin-bottom: 0;
            position: relative;
            height: auto;
            text-align: left;
            display: block;
            font-size: 12px;
        }

            .sub_ats_menu_css li a:before {
                content: "\f105";
                position: absolute;
                left: 0;
                top: 50%;
                font: normal normal normal 18px/1 FontAwesome;
                transform: translateY(-55%);
                display: none;
            }

            .sub_ats_menu_css li a:hover {
                color: #000;
            }

            .sub_ats_menu_css li a:after {
                display: none;
            }
/*.menu_list.gclose:not(:hover) li a .desk_menu{opacity: 0;visibility: hidden;display: none;transition: .4s linear;}*/
.menu_list.gclose:not(:hover) li a .desk_menu span, .menu_list.gclose:not(:hover) .module_logo h2, .menu_list.gclose:not(:hover) .logout span {
    opacity: 0;
    visibility: hidden;
    display: none;
    transition: .4s linear;
}

.menu_list li a .menudrop {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: var(--whitefontcolor);
}

.set_down_menu {
    display: none;
}

.setup_sub_menu.menu_body.gnonemenu {
    display: none !important;
}

.menu_title {
    font-size: 14px;
    color: rgba(255,255,255,0.8);
    padding: 9px 5px 9px 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
    cursor: pointer;
    position: relative;
    margin-left: 35px;
}

    .menu_title:hover {
        color: #fff;
    }

    .menu_title span {
        font-size: 16px;
        display: none;
    }

    .menu_title .menudrop {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 18px;
    }
/*.menu_list li.menuactive a .menudrop,.menuactive > .menu_title.submenudrop .menudrop,.assessment_menu.active .submenudrop .menudrop,.set_up_slide.active > .submenudrop .menudrop{transform: translateY(-50%) rotate(90deg);}*/
.menu_body .menuactive .submenudrop .menudrop {
    transform: translateY(-50%) rotate(90deg);
}

.menu_list.gclose .menudrop {
    display: none;
}

.menu_list.gclose:hover .menudrop {
    display: inline-block;
}

.simplebar-track.horizontal {
    display: none !important;
}

.sub_ats_menu_css.menu_body.show-dropdown li.active .submenudrop .menudrop:before {
    content: "\f107";
}

body .mobilemenu {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 26px;
    color: var(--bluecolor);
    cursor: pointer;
    display: none;
}

.gdropdown .gicon {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    background: var(--bluecolor);
    text-align: center;
    font-style: normal;
    text-transform: uppercase;
    color: #fff;
}

    .gdropdown .gicon span {
        color: var(--whitefontcolor);
    }

.gdropdown > a {
    font-size: 14px;
    color: #444;
    cursor: pointer;
}

.gdropdown .dropdown-menu {
    min-width: 280px;
    max-width: 280px;
    right: 0;
    left: initial;
    display: inherit;
    top: 200%;
    opacity: 0;
    visibility: hidden;
    transition: all 500ms ease;
    border: 1px solid #e5e9f2;
    box-shadow: 0 3px 12px 1px rgb(44 55 130 / 15%);
    border-top: 4px solid var(--bluecolor);
    padding: 0;
    z-index: -1;
}

.gdropdown.open > .dropdown-menu {
    opacity: 1;
    top: 100%;
    transition: all 500ms ease;
    visibility: visible;
    z-index: 1080;
}

.gdropdown .gdropheader a {
    position: relative;
    padding: 20px 20px 20px 70px !important;
    border-bottom: 1px solid #f5f6fa;
    background: #f6f6f6;
}

.gdropdown .gdropheader .gicon {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    background: var(--bluecolor);
    text-align: center;
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--whitefontcolor);
}

.gdropdown ul li a {
    padding: 15px 15px 15px 50px !important;
    display: block;
    position: relative;
    border-left: none;
    border-top: 1px solid #eee;
    border-bottom: none;
}

    .gdropdown ul li a i {
        position: absolute;
        left: 25px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 16px;
        color: var(--bluecolor);
    }

.gdropdown .gdropheader a:hover {
    background: #f6f6f6;
    color: #333;
}

.gdropdown ul li a:hover i {
    color: var(--bluecolor) !important;
}

.gdropdown ul li a:hover {
    background: transparent;
    color: var(--bluecolor) !important;
}

.gdropdown ul li:last-child a {
    border-top: 1px solid #eee;
}

.dropdown.gdropdown.companydata {
    background: #f6f6f6;
    padding: 21px 25px;
}

.dropdown.gdropdown.userprofiledata {
    padding: 12px 0;
    display: inline-block;
}

.companydata a span {
    font-weight: 500;
    font-family: 'Roboto';
    color: var(--bluecolor);
    font-size: 16px;
}

.companydata a .fa-angle-down:before {
    font-size: 20px !important;
}

.gdropdown ul li a.companyList {
    padding: 12px 15px;
    border-top: none !important;
    border-bottom: none !important;
}

    .gdropdown ul li a.companyList.selectedCompany, .gdropdown ul li a.companyList.selectedCompany:hover {
        background: var(--bluecolor) !important;
        color: var(--whitefontcolor) !important;
    }

.orange {
    color: #ff8a1e;
}

.pink {
    color: #ed145b;
}
/*.assessment_menu.active ul.sub_ats_menu_css, .set_up_slide.active ul.sub_ats_menu_css{display: block;}
.menu_list li .sub_ats_menu_css li a span{color: var(--activecolor);}*/
.sub_ats_menu_css li a.active > span {
    color: #00F0FF !important;
    display: inline-block;
    position: relative;
    font-weight: 400;
}

    .sub_ats_menu_css li a.active > span:after {
        content: "";
        position: absolute;
        left: 15px;
        bottom: 1px;
        background: #fff;
        width: calc(100% - 20px);
        height: 1px;
        display: none;
    }

body .menu_body.submenuopen {
    display: block;
}

body.gmenuclose .menusmall {
    display: flex;
    align-items: center;
    justify-content: center;
}

body.gmenuclose .pinmenu .menubaricon img {
    opacity: 0;
    visibility: hidden;
}
/*.menu_list.gclose:hover .pinmenu .menuactive img{opacity: 1;visibility: visible;}*/
.left-menu ul li.logout {
    position: absolute;
    bottom: 65px;
    width: 100%;
    left: 0;
    padding: 0;
    background: #0F4F92;
    margin: 0;
}

.left-menu ul {
    height: 100%;
    position: relative;
}

.logout .desk_menu {
    display: flex;
    align-items: center;
    column-gap: 10px;
    width: 100%;
}

.logout .icon {
    width: 24px;
    height: 24px;
    flex-grow: 0;
    flex-shrink: 0;
    overflow: hidden;
    display: block;
}

    .logout .icon img {
        width: 100%;
        height: auto;
    }

.logout span {
    font-size: 16px;
    line-height: 15px;
    font-weight: 300;
    font-family: 'Roboto', sans-serif;
    text-align: left;
    color: rgba(255,255,255,0.8);
    text-transform: capitalize;
    flex-grow: 1;
    display: inline-block;
    white-space: nowrap;
}

.logout:hover span {
    color: #00F0FF;
}
/*.logout:hover img{transform: translateY(-50%);}*/
.dataTables_processing {
    display: none !important;
}

.ModuleNavigation.flexMiddel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-right: 0;
}

    .ModuleNavigation.flexMiddel ul {
        padding: 0;
        list-style: none;
    }

        .ModuleNavigation.flexMiddel ul .informationbtn {
            border-radius: 4px;
            margin-top: 5px;
        }

.logoContainer h3 {
    padding: 0 15px;
}

.employeecard {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
    padding: 0px 16px;
    padding: 0px 16px;
    border-bottom: 1px solid #E6E6E6;
}

.dropdown-menu.employee_info {
    min-width: 330px;
}

.employeephoto .gicon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    font: 500 24px/30px 'Roboto',sans-serif;
}

.employeedata p {
    margin: 0;
    font: 500 14px/24px 'Roboto',sans-serif;
    color: var(--bluecolor);
}

.employeedata .emp_designation, .employeedata .emp_designation a {
    font: 500 12px/18px 'Roboto',sans-serif;
    color: #022F5F;
    margin: 11px 0;
}

.employeedata .emp_company {
    font: 400 13px/16px 'Roboto',sans-serif;
    color: #526484;
    margin-top: 18px;
    margin-bottom: 18px;
}

.adminswichrool a.logout_icon {
    margin-left: 0px;
}
/*.employeedata .emp_company span{display: inline-block;padding-left: 10px;}*/
.employeedata .emp_company span:first-child {
    border-left: none;
    padding-left: 0;
    padding-right: 10px;
}

.employeedata .emp_depart {
    font: 400 12px/10px 'Roboto',sans-serif;
    color: #888;
    margin-top: 15px;
}

.empfooter {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: space-between;
    padding: 0px 0px 0px;
    text-align: center;
    margin-top: 0px;
}

    .empfooter p {
        margin: 0;
        font: 500 13px/20px 'Roboto',sans-serif;
        color: #000;
        display: flex;
        align-items: center;
        gap: 8px;
    }

        .empfooter p:last-child {
            border-right: none;
        }

        .empfooter p span {
            white-space: nowrap;
            display: block;
            color: #0F4F92;
            text-align: center;
            width: 100%;
        }

            .empfooter p span:last-child {
                font: 500 12px/20px 'Roboto',sans-serif;
                color: #022F5F;
            }

.employeedata p i {
    font-size: 15px;
    width: 15px
}

.employeedata p {
    display: flex;
    column-gap: 10px;
    align-items: center;
}

.adminemployeedata .emp_designation {
    margin: 5px 0px;
}

    .adminemployeedata .emp_designation a {
        margin: 10px 0px 5px;
    }

.bredcrum-financial {
    margin-left: auto;
    display: flex;
    column-gap: 5px;
    align-items: center;
}

a.logout_icon {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 14px;
    color: #FF7171;
    column-gap: 5px;
}

.swichrollinner .emp_depart a {
    font-size: 13px;
    color: #526484;
    margin-bottom: 0px;
    display: block;
}

.swichrollinner .emp_depart i {
    color: #526484;
    font-size: 14px;
}

.swichrollinner .emp_depart {
    display: block;
    margin-bottom: 0px;
}

.right-contentarea {
    position: relative;
    padding-bottom: 30px;
    height: 100%;
    overflow: hidden;
}

body .footerWrapper {
    width: 100%;
    z-index: 1;
    padding: 8px 0 8px 300px;
}

body.menuClose .footerWrapper {
    padding: 5px 0 5px 60px;
}

.swichroll .emp_depart {
    border-top: 1px solid #e5e9f2;
    padding: 20px 15px;
    margin-top: 10px;
    column-gap: 15px;
}

.swichroolbtn:before {
    content: "\f0ec";
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 10px;
    font-size: 14px;
}

.employeenamedate p {
    margin-bottom: 0;
}

.gicon.gimage {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f3f3;
}

.Emp_code {
    display: block;
    font: 400 12px/20px 'Roboto',sans-serif;
    color: #888;
}

.employeenamedate {
    padding: 14px 0px;
    margin: 0 20px;
    column-gap: 15px;
    border-bottom: 1px solid #e5e9f2;
    align-items: center;
    display: flex;
}
/********* Module Menu *************/
ol, ul {
    margin: 0;
    padding: 0;
}

.masterInnerNavbar {
    padding: 0;
    z-index: 33;
}

.masterInnerNavbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    width: 100% !important;
    height: auto;
    z-index: 1;
    position: relative;
}

body .masterBody {
    border: none !important;
}

body {
    background: #fafafc !important;
}

.moduleIcon {
    cursor: pointer;
    line-height: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
}
    /*body.module_open .moduleIcon{margin-bottom: 20px;}*/
    .moduleIcon:hover img, body.module_open .moduleIcon:hover img {
        filter: invert(71%) sepia(16%) saturate(4928%) hue-rotate(181deg) brightness(221%) contrast(100%);
    }

body.module_open .moduleIcon img, body.module_open .menubaricon, body.module_open .gmenubar img {
    filter: invert(0%) sepia(0%) saturate(0) hue-rotate(0deg) brightness(0) contrast(60%);
}

body.module_open .scroll-wrapper {
    padding-right: 0 !important;
}

.module_menu {
    position: fixed;
    background-color: var(--whitebgcolor);
    width: 400px;
    overflow-y: auto;
    visibility: visible;
    pointer-events: auto;
    top: 0;
    left: 0;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-duration: .18s;
    animation-duration: .18s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    z-index: 9999;
    animation-name: slideInFrames;
    padding: 15px 10px 15px 20px;
    display: none;
    box-shadow: rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px, rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;
}

body.module_open .module_menu {
    display: block;
}

body.module_open .gmenubar {
    z-index: 100;
}

body.module_open .module_menu .module_logo {
    position: relative;
    z-index: 103;
    background: #fff;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

body.module_open .module_logo h2 {
    color: var(--blackfontcolor);
    font-weight: 500;
    display: none;
}

.module_menu .module_logo {
    padding: 0;
    justify-content: space-between;
}

.closebutton {
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    font-size: 14px;
}

    .closebutton:hover {
        background: var(--skyblue);
        color: var(--whitefontcolor);
    }

body.module_open .goverlay:after {
    display: block;
    top: 0;
    z-index: 100;
}

.module_menu h3 {
    font-size: 16px;
    font-weight: 500;
    font-family: 'Roboto',sans-serif !important;
    color: var(--blackfontcolor);
    margin: 25px 0 15px;
}

.moduleIcon h3 {
    margin: 0;
    font-size: 20px;
}

.module_menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.module_menu li {
    padding: 0;
    margin-bottom: 5px;
}

    .module_menu li a {
        display: block;
        text-align: left;
        position: relative;
        padding: 14px 17px;
        padding-left: 50px;
        font-size: 14px;
        color: var(--blackfontcolor);
        white-space: nowrap;
    }

        .module_menu li a:hover {
            color: var(--skyblue);
        }

        .module_menu li a .icon {
            position: absolute;
            left: 0;
            top: 5px;
            width: 36px;
            height: 36px;
            display: inline-block;
        }

            .module_menu li a .icon img {
                width: 36px;
                height: auto;
            }

        .module_menu li a:hover .icon img {
            filter: none;
        }

body.module_open .menu_list {
    z-index: 1;
}

ul.row.Marketplace-row {
    margin: 0 0 20px;
}

@keyframes slideInFrames {
    0% {
        opacity: 0;
        -webkit-transform: scale(.95);
        -ms-transform: scale(.95);
        transform: scale(.95)
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1)
    }
}

/********* Table Design *************/
body .scroll-table table.table tr td, body .scroll-table table.table tr th, body table.gtable tr td {
    border-top: 1px solid #e5e3ef !important;
    border-bottom: 1px solid #e5e3ef !important;
    font-size: 14px
}

.pageheader .select_competency:hover {
    background: var(--greenhovercolor) !important
}

.greencolor:hover, .pageheader .greencolor:hover, .pageheader .select_competency:hover, .pageheader a.greencolor:hover {
    background: var(--greenhovercolor);
    color: var(--whitefontcolor)
}

.pageheader a.bluecolor:hover {
    background: var(--activecolor);
    color: var(--whitefontcolor)
}

a.fliterbutton {
    background: #e7edf4;
    border: 1px solid var(--bluecolor);
    border-radius: 4px
}

    a.fliterbutton:hover {
        background: var(--bluecolor);
        color: var(--whitefontcolor)
    }

a.refreshbutton {
    background: #fbe2d4;
    border: 1px solid #f97d38;
    color: #f97d38;
    border-radius: 4px
}

.recordsdata > div, ul.gaction_button a:hover i {
    color: var(--headingcolor)
}

    .recordsdata > div, .recordsdata > div label, .searchbox form, ul.gaction_button {
        display: flex;
        display: flex
    }

a.refreshbutton:hover {
    background: #f97d38;
    color: var(--whitefontcolor)
}

.recordsdata {
    column-gap: 10px
}

    .recordsdata > div {
        align-items: center;
        justify-content: center;
        padding: 0 10px 0 0;
        background: 0 0;
        border-right: 1px solid #ccc
    }

        .recordsdata > div:last-child {
            border-right: none
        }

        .recordsdata > div, .recordsdata > div label, .recordsdata > div > span {
            font: 500 14px Roboto,sans-serif;
            white-space: nowrap
        }

            .recordsdata > div > span {
                display: inline-block;
                margin-right: 3px;
            }

            .recordsdata > div label {
                align-items: center;
                justify-content: flex-start;
                column-gap: 15px
            }

    .recordsdata select {
        margin-left: 10px;
        margin-right: 15px;
        margin-bottom: 0;
        width: 150px !important;
        height: 30px !important;
        padding: 0 11px !important
    }

        .recordsdata select:focus {
            outline: 0
        }

body .recordsdata select.pagin {
    width: 70px !important;
}

body .tabs-box .tab-content {
    box-shadow: none;
}

.statusTab li a:after, .statusTab li a:before, .statusTab li button:after, .statusTab li button:before {
    position: absolute;
    bottom: 0;
    width: 0;
    height: 0;
    content: ""
}

body .recordsdata .toggleChkbox {
    margin: 0
}

.statusTab {
    border: 1px solid rgba(0,0,0,.1) !important;
    line-height: initial;
    max-width: 100%;
    display: inline-block;
    background: #fff;
    padding: 0;
}

    .statusTab::-webkit-scrollbar {
        height: 4px
    }

    .statusTab::-webkit-scrollbar-track {
        background: #f1f1f1
    }

    .statusTab::-webkit-scrollbar-thumb {
        background: #1ca1da
    }

    .statusTab li {
        margin: 0 !important;
        display: inline-block;
    }

        .statusTab li a, .statusTab li button {
            display: block;
            padding: 12px 15px 12px 30px;
            background: var(--whitebgcolor) !important;
            color: #676565;
            border: none !important;
            border-radius: 0;
            position: relative;
            background: #fff;
            line-height: normal;
        }

        .statusTab li:first-child a, .statusTab li:first-child button {
            padding: 12px 15px !important
        }

            .statusTab li:after, .statusTab li:before, .statusTab li:first-child a:after, .statusTab li:last-child a:before, .statusTab li:first-child button:after, .statusTab li:last-child button:before {
                display: none
            }

        .statusTab li.active a, .statusTab li.active button {
            background: var(--bluecolor) !important;
            color: #fff
        }

            .statusTab li.active a:hover, .statusTab li.active button:hover {
                color: #fff
            }

        .statusTab li a:after, .statusTab li button:after {
            left: 0;
            border-left: 20px solid #fff;
            border-top: 20px solid transparent;
            border-bottom: 20px solid transparent
        }

        .statusTab li a:before, .statusTab li button:before {
            right: -40px;
            border: 20px solid transparent;
            z-index: 1
        }

        .statusTab li.active a:before, .statusTab li.active button:before {
            border-left-color: var(--bluecolor)
        }

        .statusTab li.active:last-child a:before, .statusTab li.active:last-child button:before {
            display: inline-block
        }

.search_button {
    background: rgba(254,203,3,.1);
    border: 1px solid #fecb03;
    border-radius: 4px;
    padding: 8px 10px;
    cursor: pointer
}

    .search_button i {
        font-size: 20px;
        color: #fecb03
    }

    .search_button:hover {
        background: #fecb03
    }

.searchbox form, .search-dflex {
    background: rgba(254, 203, 3, 0.1);
    border: 1px solid #fecb03;
    border-radius: 4px;
    padding: 0 35px 0 4px;
    align-items: center;
    justify-content: center;
    column-gap: 15px;
    position: relative
}

.traeningsearch .searchbox.search-dflex {
    padding-right: 0;
}

.traeningsearch .gresetbutton {
    background: #fecb03 !important;
    color: #000 !important;
}

.searchbox .theInput {
    padding: 7px 10px !important;
    border: none;
    background: 0 0;
    text-overflow: ellipsis;
    margin-bottom: 0;
    color: var(--lightblackcolor);
    font-family: Roboto,sans-serif
}

.searchbox .Applicantselect {
    background: #fff;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 4px;
    box-shadow: none;
    width: auto
}

.searchbox .theButton {
    background: url("../Images/moduleIcons/search.png") center no-repeat #f9ebcb !important;
    border: none;
    width: 35px;
    height: 35px;
}

ul.nav.nav-tabs .traeningsearchli button:before, ul.nav.nav-tabs .traeningsearchli a:before {
    background: transparent !important;
}

ul.nav.nav-tabs .traeningsearchli:hover a {
    color: #000 !important;
}

body .scroll-table table.table, body table.gtable {
    border: none !important;
    border-spacing: 0 5px;
    border-collapse: separate !important;
    margin: 0;
    width: 100%
}

    body .scroll-table table.table thead tr, body .scroll-table table.table tr:hover, body .scroll-table table.table tr:nth-last-child(2n), body table.gtable thead tr, body table.gtable tr:hover, body table.gtable tr:nth-last-child(2n) {
        background: 0 0 !important
    }

    body .scroll-table table.table tr th, body table.gtable tr th {
        background: #f0f3f7 !important;
        font-weight: 500 !important;
        line-height: 20px;
        font-family: Roboto,sans-serif;
        color: var(--headingcolor);
        padding: 12px 20px;
        position: sticky !important;
        top: 0px;
        z-index: 3;
        white-space: nowrap;
        border-radius: 0
    }

body #divrecentticket table.table tr th {
    top: -12px;
}

body table.gtable tr th {
    position: relative !important;
}

.Assessmenttable .table tr {
    align-items: flex-start;
    padding: 0;
    margin: 0;
    border-radius: 0;
    border: none;
    box-shadow: none
}

body .scroll-table table.table tr td, body table.gtable tr td {
    padding: 8px 20px;
    vertical-align: middle;
    font-weight: 400;
    color: var(--lightblackcolor);
    border-radius: 0;
    position: relative;
}

table.table.table-striped > tbody > tr:nth-child(odd) > td {
    background: 0 0
}

body .scroll-table table.table tr td:first-child,
body .scroll-table table.table tr th:first-child,
body table.gtable tr th:first-child,
body table.gtable tr td:first-child {
    border-left: 1px solid #e5e3ef !important;
    padding-left: 10px
}

body .scroll-table table.table tr td:last-child,
body .scroll-table table.table tr th:last-child,
body table.gtable tr th:last-child,
body table.gtable tr td:last-child {
    border-right: 1px solid #e5e3ef !important
}

body .scroll-table table.table .pagination-ys table {
    margin: 0;
    display: inline-block
}

    body .scroll-table table.table .pagination-ys table > tbody > tr > td, table .pagination-ys table > tbody > tr > td > a, table .pagination-ys table > tbody > tr > td > span {
        position: relative;
        border: none !important;
        background: 0 0 !important;
        padding: 0
    }

table .pagination-ys table > tbody > tr > td > a, table .pagination-ys table > tbody > tr > td > span {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    box-shadow: none;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    color: var(--blackfontcolor) !important;
    background: 0 0
}

    table .pagination-ys table > tbody > tr > td > a:hover, table .pagination-ys table > tbody > tr > td > span:hover {
        color: var(--activecolor);
        background: 0 0 !important
    }

    table .pagination-ys table > tbody > tr > td > a:after, table .pagination-ys table > tbody > tr > td > span:after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 3px;
        transform: translateX(-50%);
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: var(--bluecolor);
        opacity: 0;
        transition: .2s
    }

    table .pagination-ys table > tbody > tr > td > a:hover:after, table .pagination-ys table > tbody > tr > td > span:after {
        opacity: 1
    }

.col-10 {
    width: 80px !important
}

ul.gaction_button {
    align-items: center;
    justify-content: center !important;
    column-gap: 12px !important;
    list-style: none;
    padding: 0;
    margin: 0
}

.collapsed .feather-minu-square:before {
    content: "\e9b3";
}

.pagination-ys table {
    text-align: center;
    margin: 0px auto;
}

body .scroll-table {
    overflow: inherit;
    scrollbar-width: none;
}

    body .scroll-table table.table .rating-box, body .scroll-table table.table ol {
        margin: 10px 0 0
    }

        body .scroll-table table.table .rating-box li label, body .scroll-table table.table ol li label {
            font: 500 14px/20px Roboto,sans-serif;
            display: inline-block;
            padding-left: 5px
        }

        body .scroll-table table.table .rating-box li::marker, body .scroll-table table.table ol li::marker {
            font-weight: 600;
            color: var(--headingcolor)
        }

        body .scroll-table table.table ol li.right-answer, body .scroll-table table.table ol li.right-answer::marker {
            color: #2CB34C;
        }

        body .scroll-table table.table ol li.wrong-answer, body .scroll-table table.table ol li.wrong-answer::marker {
            color: #e70c3e;
        }

body table.table a.action_icon {
    position: relative;
    width: 30px;
    height: 30px;
    text-align: center;
    display: inline-block;
    z-index: 0;
    margin: 0;
    padding: 0;
    cursor: pointer
}

    body table.table a.action_icon i {
        font-size: 22px !important;
        line-height: 25px;
        color: var(--bluecolor);
    }

    body table.table a.action_icon:after {
        position: absolute;
        z-index: -1;
        height: 20px;
        width: 20px;
        top: 54%;
        left: 54%;
        transform: translate(-54%, -54%);
        transform-origin: 50% 50%;
        content: "";
        background-color: #e5e9f2;
        border-radius: 50%;
        opacity: 0;
        transition: all .3s;
    }

    body table.table a.action_icon:hover:after {
        opacity: 1;
        height: 120%;
        width: 120%;
    }

body .gaction_list a .feather {
    position: absolute;
    left: 8px;
    top: 15px;
    background: transparent;
    color: var(--blackfontcolor);
    font-size: 18px !important;
    width: 20px;
    height: 20px;
}

    body .gaction_list a .feather img {
        width: 100%;
    }

body .gaction_list a:hover {
    background: rgb(240, 243, 247) !important;
    color: var(--activecolor) !important;
}

    body .gaction_list a:hover i {
        color: var(--activecolor) !important;
    }

body .pagebutton .gaction_list {
    z-index: 99;
}

    body .pagebutton .gaction_list a {
        padding: 15px 10px 35px 35px !important;
        border-radius: 0;
        border-left: none !important;
    }
/*body .table tr td:last-child, body .table tr th:last-child {padding-right: inherit !important;}*/
body .gaction_list {
    min-width: 180px;
    box-shadow: none;
    border-radius: 4px;
    background: var(--whitebgcolor);
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    z-index: 11;
}

body .gaction_list {
    top: 50px;
    margin: 0;
    padding: 0;
    right: 0;
    left: initial;
}

    body .gaction_list:after, body .gaction_list:before {
        content: "";
        position: absolute;
        right: 25px;
    }

.evaluation .gaction_list:after, .evaluation .gaction_list:before {
    right: 25px;
}

body .gaction_list:after {
    top: -25px;
    border: 12px solid transparent;
    border-bottom-color: #eee;
}

body .gaction_list:before {
    top: -23px;
    border: 12px solid transparent;
    border-bottom-color: #fff;
    z-index: 1;
}

body .gaction_list a {
    border-bottom: 1px solid rgba(0,0,0,0.08) !important;
    padding: 15px 10px 15px 35px !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    color: var(--lightblackcolor);
    position: relative;
    display: block !important;
    text-align: left !important;
    cursor: pointer;
    border-left: none;
}

body .gaction_list li:last-child a {
    border-bottom: none !important;
}

body .gstatus.glistdata .gaction_list:after, .gstatus.glistdata .gaction_list:before {
    right: 3px;
}

body .gstatus .gaction_list ul {
    overflow-y: auto;
    height: 200px;
}

body .gstatus .gaction_list:after, .gstatus .gaction_list:before {
    right: 35px;
}

body .gstatus .gaction_list:after, .gstatus .gaction_list:before {
    right: 35px;
}

body .gstatus .gaction_list:before {
    border-bottom-color: #f6f6f6;
}

body .gstatus .gaction_list a {
    padding: 10px 8px !important;
}

body .gstatus .gaction_list li.grpTitle {
    padding: 8px 10px;
    background: #f6f6f6;
}

body .processgrid .gaction_list:after, body .processgrid .gaction_list:before {
    right: 20px;
}

.gframe {
    background-size: cover;
    padding: 70px 90px;
}

.gpanel .panel {
    box-shadow: none !important;
    border: 1px solid #e5e3ef;
    padding: 10px 0;
    position: relative;
}

    .gpanel .panel.row:last-child {
        margin-bottom: 0;
    }

    .gpanel .panel.rowheading {
        background: #f0f3f7 !important;
        font-weight: 600 !important;
        line-height: 20px;
        font-family: Roboto,sans-serif;
        color: var(--headingcolor);
        white-space: nowrap;
    }

.gpanel p {
    margin: 0;
    font: 500 14px/20px Roboto,sans-serif
}

.iconData {
    position: relative;
    display: flex;
    width: 80%;
}

.gpanel a {
    position: relative;
    z-index: 1;
    display: inline-block;
    width: auto;
}

.assessment-collapsed {
    width: 100px !important;
}

.gpanel .panel-collapse > div {
    padding-left: 190px;
}

.iconData i, .iconDatapara i {
    cursor: pointer;
    font-size: 16px;
    position: relative;
    margin-left: 4%;
    margin-right: 15px;
}

.iconDatapara p, body .scroll-table table.table .rating-box li, body .scroll-table table.table ol li {
    font: 500 14px/20px Roboto,sans-serif
}

.iconDatapara {
    position: relative;
    padding-left: 30px
}

    .iconDatapara i img {
        width: 22px
    }

    .iconDatapara p {
        margin: 0
    }

.collapsed .feather-minus-square:before {
    content: "\e9b3";
}

body .scroll-table table.table ol, body .scroll-table table.table .rating-box {
    margin: 10px 0 0;
    list-style: upper-alpha;
}

    body .scroll-table table.table ol li, body .scroll-table table.table .rating-box li {
        font: 500 14px/20px 'Roboto',sans-serif;
    }

        body .scroll-table table.table ol li label, body .scroll-table table.table .rating-box li label {
            font: 500 14px/20px 'Roboto',sans-serif;
            display: inline-block;
            padding-left: 5px;
        }

        body .scroll-table table.table ol li::marker, body .scroll-table table.table .rating-box li::marker {
            font-weight: 600;
            color: var(--headingcolor);
        }

        body .scroll-table table.table ol li.right-answer, body .scroll-table table.table ol li.right-answer::marker, body .scroll-table table.table ul li.right-answer, body .scroll-table table.table ul li.right-answer::marker {
            color: #2CB34C;
        }

        body .scroll-table table.table ol li.wrong-answer, body .scroll-table table.table ol li.wrong-answer::marker, body .scroll-table table.table ul li.wrong-answer, body .scroll-table table.table ul li.wrong-answer::marker {
            color: #e70c3e;
        }

ul.gaction_button {
    display: flex;
    align-items: center;
    justify-content: flex-end !important;
    column-gap: 12px !important;
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    top: 10px;
}

    ul.gaction_button a {
        cursor: pointer;
        color: #263238;
    }

        ul.gaction_button a:hover i {
            color: var(--headingcolor);
        }

body .scroll-table table.table ol, body .scroll-table table.table .rating-box {
    margin: 10px 0 0;
    list-style: upper-alpha;
}

.no-bordered, body .scroll-table table.table tr td.no-bordered {
    border: none !important;
}

body .scroll-table table.table ol li, body .scroll-table table.table .rating-box li {
    font: 500 14px/20px 'Roboto',sans-serif;
}

.gpanel .panel ol, .gpanel .panel .rating-box {
    margin-bottom: 0;
}

    .gpanel .panel ol li label, .gpanel .panel .rating-box li label {
        font: 500 14px/20px 'Roboto',sans-serif;
        display: inline-block;
        padding-left: 5px;
    }

    .gpanel .panel ol li::marker, .gpanel .panel .rating-box li::marker {
        font-weight: 600;
        color: var(--headingcolor);
    }

    .gpanel .panel ol li.right-answer, .gpanel .panel ol li.right-answer::marker, .gpanel .panel ul li.right-answer, .gpanel .panel ul li.right-answer::marker {
        color: #2CB34C;
    }

    .gpanel .panel ol li.wrong-answer, .gpanel .panel ol li.wrong-answer::marker, .gpanel .panel ul li.wrong-answer, .gpanel .panel ul li.wrong-answer::marker {
        color: #e70c3e;
    }

body .assessment-panel {
    margin-bottom: 20px !important;
}

    body .assessment-panel .panel-heading {
        border-bottom: 1px solid rgba(9, 54, 121, 0.1);
        padding: 8px 20px;
        background: #f5f5f5;
        position: relative;
    }

        body .assessment-panel .panel-heading h4 a {
            font-family: 'Roboto',sans-serif;
            font-weight: 500;
            font-size: 18px;
            line-height: 28px;
            color: #263238;
            text-transform: capitalize;
            padding: 0 20px 0 0 !important;
        }

        body .assessment-panel .panel-heading h4 .datahead {
            display: inline-block;
            position: relative;
            padding-right: 30px;
        }

.assessment-setting-edit {
    position: absolute;
    top: 1px;
    right: 0;
    border: none;
    background: transparent;
    font-size: 20px;
    color: #263238;
    padding: 0;
    z-index: 11;
}

body .assessment-panel .panel-heading i.feather-chevron-right {
    position: absolute;
    right: 10px;
    top: 8px;
    font-size: 24px;
    color: #263238;
}

    body .assessment-panel .panel-heading i.feather-chevron-right:before {
        content: "\e92e";
    }

body .assessment-panel .panel-heading .collapsed i.feather-chevron-right:before {
    content: "\e930";
}

body .assessment-panel .panel-collapse {
    padding: 15px 10px 0;
}

.Total_Ques {
    display: inline-block;
    font-weight: 600;
    color: var(--headingcolor);
    position: absolute;
    left: 215px;
    top: 9px;
    font-family: 'Roboto',sans-serif;
    font-style: normal;
    font-size: 12px;
}

.gaction_list a .feather {
    position: absolute;
    left: 8px;
    top: 15px;
    background: transparent;
    color: var(--blackfontcolor);
    font-size: 20px !important;
}

.gaction_list a:hover {
    background: rgb(240, 243, 247) !important;
    color: var(--activecolor) !important;
}

    .gaction_list a:hover i {
        color: var(--activecolor) !important;
    }

.pagebutton .gaction_list {
    z-index: 99;
}

    .pagebutton .gaction_list a {
        padding: 15px 10px 35px 35px !important;
        border-radius: 0;
    }

.gaction_list {
    min-width: 180px;
    box-shadow: none;
    border-radius: 4px;
    background: var(--whitebgcolor);
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    z-index: 9;
}

.gaction_list {
    top: 50px;
    margin: 0;
    padding: 0;
    right: 0;
    left: initial;
}

    .gaction_list:after, .gaction_list:before {
        content: "";
        position: absolute;
        right: 25px;
    }

.evaluation .gaction_list:after, .evaluation .gaction_list:before {
    right: 25px;
}

.gaction_list:after {
    top: -25px;
    border: 12px solid transparent;
    border-bottom-color: #eee;
}

.gaction_list:before {
    top: -23px;
    border: 12px solid transparent;
    border-bottom-color: #fff;
    z-index: 1;
}

.gaction_list a {
    border-bottom: 1px solid rgba(0,0,0,0.08) !important;
    padding: 15px 10px 15px 35px !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    color: var(--lightblackcolor);
    position: relative;
    display: block !important;
    text-align: left !important;
    cursor: pointer;
}

.gaction_list li:last-child a {
    border-bottom: none !important;
}

.gstatus.glistdata .gaction_list:after, .gstatus.glistdata .gaction_list:before {
    right: 3px;
}

.gstatus .gaction_list ul {
    overflow-y: auto;
    height: 200px;
}

.gstatus .gaction_list:after, .gstatus .gaction_list:before {
    right: 35px;
}

.gstatus .gaction_list:after, .gstatus .gaction_list:before {
    right: 35px;
}

.gstatus .gaction_list:before {
    border-bottom-color: #f6f6f6;
}

.gstatus .gaction_list a {
    padding: 10px 8px !important;
}

.gstatus .gaction_list li.grpTitle {
    padding: 8px 10px;
    background: #f6f6f6;
}

.processgrid .gaction_list:after, .processgrid .gaction_list:before {
    right: 20px;
}
/*body.modal-open header,footer,.left-menu,.sideBarss{z-index: 1 !important;}*/
body.modal-open .sidebar {
    z-index: 1 !important;
}

body .assisment-scroll {
    min-height: calc(100vh - 127px) !important;
    padding: 15px 20px !important;
}

body .assessments-footer {
    padding: 15px;
    background: #f6f6f6;
}

body .modal-header {
    background: var(--bluecolor) !important;
    padding: 8px 15px;
    border-bottom: 1px solid var(--lightgreycolor);
}

body .allModuleBox.modal.fade .modal-dialog {
    border: none;
}

body .addmorebtn button, body .addmorebtn .btn {
    padding: 8px 20px;
    font-size: 12px;
}

    body .addmorebtn button:hover, body .addmorebtn .btn:hover {
        background: var(--activecolor);
    }

body .modal-header h4 {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    color: var(--whitefontcolor);
    margin: 0;
    padding-top: 6px;
    font: 500 14px 'Roboto',sans-serif;
}

body .modal-header .close {
    border-radius: 50%;
    border: none;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

    body .modal-header .close:hover {
        background: var(--skyblue);
        color: var(--whitefontcolor);
    }

body .modal-body label {
    display: block;
    padding-bottom: 5px;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #263238;
    font-family: 'Roboto',sans-serif;
    margin-left: 0;
}

body .modal-body .form-control {
    border: 1px solid #dadada;
    border-radius: 4px;
    width: 100%;
    height: auto;
    padding: 7px 10px;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #000;
    box-shadow: none;
    margin-bottom: 0;
    resize: none;
}

body .modal-body .isansrwo.d-flexnew {
    column-gap: 35px;
    margin-bottom: 15px;
    justify-content: flex-start;
    position: relative;
}

body .modal-body .checkboxdatalabel {
    order: 1;
    position: initial;
}

body .modal-body .inputrowinner {
    width: 50%;
    order: 2;
}

body .modal-body .isansrwotext {
    order: 3;
    margin: 0;
}

body .modal-body .RemoveBtns {
    order: 4;
    position: inherit;
    left: inherit;
    line-height: 20px;
    color: #e3351e;
}

body .modal-body .custom-file label {
    margin-bottom: 0;
    padding-bottom: 0;
}
/*new css*/
.search-dflex {
    column-gap: 0;
    display: flex;
}

    .search-dflex a {
        display: block;
        border-radius: 0px;
        width: auto;
        min-width: 35px;
        color: #000;
        padding: 0px;
    }

#main .container-fluid {
    margin-left: 0px;
}

.table button.btn.Active, .table button.btn.In-Active {
    font-size: 12px;
    border-radius: 4px;
    padding: 0.3rem 0.5rem;
    display: inline-block;
}

.table button.btn.Active {
    color: #006d23;
    background: #cdf3c6;
}

.table button.btn.In-Active {
    color: #ed145b;
    background: rgba(223, 87, 83, 0.2);
}

.Trainers-title img {
    width: 30px;
    filter: brightness(0) invert(1);
}

.Trainers-head {
    background: #0a3b7e;
    padding: 20px;
    margin: 0 0 0px;
    display: flex;
    align-items: center;
    color: #fff;
}

.closeSidePanel:hover {
    background: #09bef3 !important;
}

.closeSidePanel, .closeSidePanel.ActiveSlide {
    position: absolute;
    top: 15px;
    right: 25px;
    padding: 0px;
    color: #454545 !important;
    background: none !important;
    border: 0.5px solid rgba(9, 54, 121, 0.1);
    border-radius: 4px;
    font-size: 16px;
    width: 32px;
    height: 32px;
    text-align: center;
    line-height: 30px;
    border-radius: 50px;
}

.submit-btns .btn {
    margin-left: 15px;
    margin-right: auto;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: #f5f5f5 !important;
    border-color: #f5f5f5 !important;
    color: #0f4f92 !important;
    padding: 5px !important;
    border-radius: 50px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #323232 !important;
    margin-right: 5px !important;
    margin-left: 5px;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background: #fff !important
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #0a3b7e !important
}

.select2-search__field::placeholder {
    font-size: 14px;
    padding-left: 10px;
}
/*.select2-container .select2-selection--single{height:40px !important;}*/
.select2-container .select2-selection--single {
    height: 40px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important;
}

.selectmoderator-btn {
    color: #0F4F92;
    background: transparent;
    border: 0px;
    margin-top: 10px;
}

.skyblue.fliterbutton {
    background: #e7edf4;
    border-color: var(--bluecolor);
    color: var(--bluecolor);
    box-shadow: none;
    border-radius: 4px;
    min-width: 36px;
    height: 36px;
    position: relative;
    font-size: 18px;
}

    .skyblue.fliterbutton:hover {
        background: var(--bluecolor);
        color: var(--whitefontcolor);
    }

.filterFooter {
    padding: 12px 20px !important;
    background: #f6f6f6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

    .filterFooter #divSearch {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: relative;
        padding: 0;
        width: 100%;
    }

        .filterFooter #divSearch > div {
            display: flex;
            align-items: center;
            justify-content: center;
            column-gap: 30px;
        }

    .filterFooter .resetbtn {
        color: #09bef3;
        background: transparent;
        border: none;
        text-decoration: underline;
        font-size: 15px;
        font-weight: 400;
    }

    .filterFooter .searchbtn {
        background: #045aa0;
        padding: 8px 20px !important;
        font-size: 14px;
        font-weight: 500;
        color: var(--whitefontcolor);
        border-radius: 5px;
        box-shadow: none;
        text-transform: capitalize;
    }

.Trainers-head label {
    color: #fff !important;
}

.blue {
    background: var(--bluecolor) !important;
    color: var(--whitefontcolor) !important;
    padding: 8px 20px;
    height: auto;
}

#PopfilterBody .col-lg-12 {
    width: 25%;
}

#PopfilterBody .modal-footer .col-lg-12 {
    width: 100%;
    padding: 0;
}

.modelclosebtn {
    color: #09bef3;
    background: transparent;
    border: none;
    text-decoration: underline;
    font-size: 15px;
    font-weight: 400;
}

.justify-content-space-between {
    justify-content: space-between
}

.row-reverse {
    flex-flow: row-reverse;
}

.programdatatop .form-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ddd;
    padding: 10px 0px 15px;
    margin-bottom: 0px;
}

    .programdatatop .form-group label {
        min-width: max-content;
    }

.programdatatop .checkboxform .toggle label {
    display: inline-block
}

.programdatatop .form-group .form-control {
    text-align: right;
    background: #eaf0f7;
    max-width: max-content;
    padding: 8px 11px;
    border-radius: 5px !important;
    color: #000;
}

.programdatatop {
    margin-bottom: 20px;
}

    .programdatatop .form-group:nth-last-child(1) {
        border-bottom: 0;
        padding-bottom: 0;
    }

    .programdatatop .form-group:nth-child(1) {
        padding-top: 0px;
    }

.program-panel table tr th {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.form-group label {
    font-weight: 500;
}

body .scroll-table table.table .form-group.checkboxform {
    margin-bottom: 0;
    text-align: center;
}

body .scroll-table table.table .form-group .toggle label {
    display: inline-block;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

.d-inline-block {
    display: inline-block !important;
}

.Footersaveclose {
    justify-content: end;
}

.vertical-align-middle {
    vertical-align: middle;
}

body .btn-danger {
    color: #d43f3a;
    background-color: #f7dcd7;
    border-color: #d43f3a;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    padding: 8px 15px;
    text-transform: capitalize;
}

.dataTables_wrapper .headtop {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
    font: 500 14px 'Roboto',sans-serif;
    color: var(--headingcolor);
    margin-bottom: 10px;
}

.dataTables_wrapper .dataTables_info {
    padding: 0 10px 0 0 !important;
    border-right: 1px solid #bbb;
    margin-right: 11px;
}

div.dataTables_wrapper div.dataTables_length select {
    float: right;
    margin-left: 10px;
    margin-right: 15px;
    margin-bottom: 0;
    width: auto !important;
    height: 30px !important;
    padding: 0 8px !important;
    background: #fff;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover, .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: transparent;
    border: none;
    color: #0f4f92 !important;
    border: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border: none;
}

.dataTables_length label {
    color: #0f4f92 !important;
    font: 500 14px/30px Roboto,sans-serif !important;
    margin: 0px !important;
}

.dataTables_paginate {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
    float: inherit !important;
    background: #fff;
    border-radius: 30px;
    border: 1px solid #eee;
    padding-top: 0 !important;
}

a.paginate_button.undefined.Gfirst, a.paginate_button.undefined.gprevious {
    border-right: 1px solid #eee !important;
}

a.paginate_button.undefined.Glast, a.paginate_button.undefined.gnext {
    border-left: 1px solid #eee !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    position: relative;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 10px 6px 10px;
    line-height: 10px;
    font-size: 16px;
}

.dataTables_paginate .paginate_button.next, .dataTables_paginate .paginate_button.previous {
    background: #eaf0f7 !important;
    height: 36px;
    width: 36px;
    text-indent: -999px;
    overflow: hidden;
    border-radius: 50px;
}

.dataTables_paginate .paginate_button.next {
    background-image: url(../images/moduleIcons/rightarrow.svg) !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 9px !important;
}

.dataTables_paginate .paginate_button.previous {
    background-image: url(../images/moduleIcons/leftarrow.svg) !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 9px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    box-shadow: none !important;
}

.dataTables_wrapper .dataTables_length select {
    border-radius: 0px;
    color: #727272;
}

.dataTables_wrapper > div {
    position: relative;
    color: #0f4f92 !important;
    font: 500 14px/20px Roboto,sans-serif !important;
    margin-bottom: 10px;
}

.dataTables_paginate span {
    display: flex;
}

.top.last {
    margin-left: 11px;
}
    /*.dataTables_wrapper > div:after {content: "";position: absolute;right: 15px;top: 0;width: 1px;height: 100%;background: #ccc;}*/
    .dataTables_wrapper > div:last-child::after, .top.last::after {
        display: none;
    }

.table-footer {
    display: flex;
    text-align: center;
    justify-content: center;
    width: 100%;
    padding: 15px 0;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    position: relative;
}

    .dataTables_wrapper .dataTables_paginate .paginate_button:after {
        content: "";
        position: absolute;
        bottom: -5px;
        left: 50%;
        transform: translateX(-50%);
        width: 5px;
        height: 5px;
        background: #0f4f92;
        border-radius: 50%;
        opacity: 0;
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover:after, .dataTables_wrapper .dataTables_paginate .paginate_button.current:after, .paginate_number[active="true"]:after {
        opacity: 1 !important;
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover:after, .dataTables_wrapper .dataTables_paginate .paginate_button.current:after {
        opacity: 1;
    }

.paginate_button.previous.disabled, .paginate_button.next.disabled {
    opacity: 0.4;
}

.select2-container--default .select2-selection--multiple .select2-selection__clear {
    float: left !important;
    margin-top: 10px !important;
    font-size: 18px;
    margin-left: 10px;
}

.scrollbar-parent .validation-summary-errors ul {
    padding-left: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
}

.scrollbar-parent .validation-summary-errors {
    display: none;
}

.alignleft-check {
    display: flex !important;
}

    .alignleft-check .check {
        left: 60%;
        transform: translateX(-60%);
    }

    .alignleft-check input:checked ~ .check {
        border-color: #dedede;
    }

.select-template-main .panel {
    box-shadow: none !important;
}

.form-file {
    position: relative;
    display: inline-block;
    width: 100%;
    height: calc(3rem + 6px);
    margin: 0 !important;
}

.form-file-input {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    max-width: 350px;
    height: 40px;
}

.form-file-label {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1;
    padding: 11px;
    font-weight: 400;
    line-height: 17px;
    color: var(--blackfontcolor);
    background-color: #fff;
    border: 1px solid #dadada;
    border-radius: 4px;
    max-width: 350px;
}

    .form-file-label::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 3;
        display: block;
        height: 100%;
        padding: 0.4375rem 1rem;
        line-height: 33px;
        color: var(--blackfontcolor);
        content: "Browse";
        background-color: #ebeef2;
        border-left: inherit;
        border-radius: 0 4px 4px 0;
    }

.form-file-download {
    display: flex;
    align-items: center;
    column-gap: 3px;
}

.UserResume {
    width: auto !important;
    margin-left: 10px !important;
    margin-top: 3px;
    line-height: 13px;
}

    .UserResume img {
        max-height: 31px;
        min-height: 31px;
        max-width: 50px;
        min-width: 50px;
        object-fit: contain;
    }
/*.filterSection{position:relative;padding-top: 70px;}
.pageHead {margin-bottom: 0px !important; position: fixed;top: 72px;z-index: 5;width: -webkit-fill-available; width: -moz-available; margin-left:4px;}*/
.programdatatop input[type="checkbox"]:checked + label:before {
    background: #ccc !important;
}

.certificate-preview-modal, #certificate-preview {
    text-align: center;
}

.nofixhead {
    position: relative !important;
    top: 0;
}

.gaction_button i {
    font-size: 16px;
}
/*========================
Filter Panel
==========================*/
.select2-container--default .select2-selection--multiple {
    padding: 0 !important;
    border: 1px solid #dadada !important;
    border-radius: 4px !important;
}

.form-group label {
    display: block; /*padding-bottom: 10px;*/
    font-weight: 500 !important;
    font-size: 14px;
    line-height: 16px;
    color: #263238;
    font-family: 'Roboto',sans-serif;
    margin-left: 0;
}

.filter .form-control, .filter .select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid #dadada;
    border-radius: 4px !important;
    width: 100%;
    height: auto;
    padding: 7px 10px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #8e8888;
    box-shadow: none;
    margin-bottom: 0;
    resize: none;
}

.filter .upload-btn-wrapper {
    display: block;
}

    .filter .upload-btn-wrapper input[type=file] {
        display: block;
        margin: 0;
        width: 100%;
    }

.pageheader {
    padding: 0;
}

.pageheader-left {
    position: relative;
}

.pageheader-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    row-gap: 10px;
}

.pageheader .pagebutton {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 15px;
}

.Records-bg {
    display: flex;
    align-items: center;
    padding: 0px 0px;
    color: var(--headingcolor);
    border-radius: 5px;
    min-height: 40px;
    column-gap: 8px;
    font-size: 15px;
    font-family: 'Roboto',sans-serif;
    font-weight: 500;
}

.pageheader .d-flex {
    align-items: center;
    justify-content: flex-start;
    column-gap: 15px;
    min-width: 360px;
}
/***** Modal CSS *********/
.modal.left .modal-dialog, .modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 390px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left.fade .modal-dialog {
    left: -320px;
    -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
    -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.in .modal-dialog {
    left: 0;
}

.modal.right.fade .modal-dialog {
    right: 0;
    transform: translateX(390px);
    transition: .4s linear;
}

.modal.right.fade.in .modal-dialog {
    right: 0;
    transform: translateX(0);
    transition: .4s linear;
}

.addnewsidebar {
    position: fixed;
    top: 0;
    right: 0;
    width: 390px;
    height: 100%;
    z-index: 999;
    background: var(--whitebgcolor);
    box-shadow: -8px 4px 6px rgb(0 0 0 / 20%);
    transform: translateX(420px);
    transition: .4s linear;
    padding: 15px 0;
    display: initial !important;
}

.filter .panel-body {
    background: var(--whitebgcolor);
    padding: 15px 0 20px !important;
}

.filter .scroll-element.scroll-y, .sidebarscrollbar .scroll-element.scroll-y {
    right: 5px !important;
}

body.filteropen .filter, body.addnewsidebaropen .addnewsidebar {
    transform: translateX(0);
    transition: .4s linear;
}

body.filteropen .goverlay:after, body .goverlay.closed:after, body.addnewsidebaropen .goverlay:after {
    display: block;
}

.filter.addPanel, .addnewsidebar {
    padding-top: 0;
}

    .filterheader, .addnewsidebar .headerData {
        padding: 15px 20px;
        border-bottom: 1px solid var(--lightgreycolor);
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: var(--bluecolor);
    }

.filterbutton {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.filterheader h4, .addnewsidebar .headerData h4 {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 18px;
    color: var(--whitefontcolor);
    margin: 0;
}

.js_competencyFilterfilterbody {
    padding: 15px 0 0 15px !important;
}

.filter .filterscrollbar {
    background: var(--whitebgcolor);
}

.filter .scroll-table {
    height: calc(100vh - 150px) !important;
}

.filter .filterbody.scroll-wrapper {
    padding: 0 0 20px !important; /* height: calc(100vh - 120px); */
}

.filterbody .col100 {
    margin-bottom: 15px;
}

.filterbody .col100, .filterbody .col40, .filterbody .col60 {
    width: 100% !important;
    float: initial;
    text-align: left;
}

.filterbody label, .addnewsidebar label {
    display: block;
    padding-bottom: 10px;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #263238;
    font-family: 'Roboto',sans-serif;
}

.filterbody .hasDatepicker {
    background: #fff url(../images/menuIcon/calendar.svg) no-repeat 94% 10px;
}

.filterclose, .addfilterclose {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    color: var(--bluecolor);
    margin-left: 15px;
    cursor: pointer;
    font-size: 14px; /*display: none;*/
    position: relative;
    transition: all 500ms ease;
}

    .filterclose i, .addfilterclose i {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        font-size: 18px;
        color: var(--whitefontcolor);
    }

    .filterclose:hover, .addfilterclose:hover {
        background: var(--skyblue);
        color: var(--whitefontcolor);
    }

body.filteropen .filterclose, body.addnewsidebaropen .addfilterclose {
    display: block;
}

.filter .scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar {
    opacity: 0.9;
}

body.filteropen .DataPanel {
    position: relative;
    z-index: 1;
}

.table-responsive .fliterbutton {
    background: #e7edf4;
    border: 1px solid var(--bluecolor);
    color: var(--bluecolor);
    box-shadow: none;
    border-radius: 4px;
    min-width: 36px;
    height: 36px;
    position: absolute;
    right: 0;
    top: 15px;
    cursor: pointer;
    z-index: 1;
}

    .table-responsive .fliterbutton i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        font-size: 18px;
    }

    .table-responsive .fliterbutton:hover {
        background: var(--bluecolor);
        color: var(--whitefontcolor);
    }

input[type=submit].gbtn, .gbtn {
    background: transparent;
    border: none;
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    line-height: 14px;
    text-decoration-line: underline;
    color: var(--skyblue);
    padding: 0 15px;
    display: inline-block;
    text-align: right;
    text-transform: capitalize;
}

    input[type=submit].gbtn:hover, .gbtn:hover {
        text-decoration: none;
        color: var(--headingcolor);
    }

.filter textarea, .filter select, .filter input[type=text], .addnewsidebar textarea, .addnewsidebar select, .addnewsidebar input[type=text], .RowperPagegetlist .form-control.chosen.select {
    border: 1px solid #dadada;
    border-radius: 4px !important;
    width: 100%;
    height: auto;
    padding: 7px 10px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #8e8888;
    box-shadow: none;
    margin-bottom: 0;
    resize: none;
}

.jobbox select {
    height: 50px;
}

input[type=text]::-moz-placeholder {
    opacity: 1;
    color: #8e8888;
}

input[type=text]::-webkit-input-placeholder {
    opacity: 1;
    color: #8e8888;
}

textarea.form-control::-webkit-input-placeholder {
    opacity: 1;
    color: #8e8888;
}

textarea.form-control::-moz-placeholder {
    opacity: 1;
    color: #8e8888;
}

.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
}

    .pagination li a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        box-shadow: none;
        border-radius: 4px;
        cursor: pointer;
        position: relative;
        background: transparent;
        outline: none;
        border: none;
    }

        .pagination li a:hover {
            background: transparent !important;
        }

        .pagination li a:after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: 3px;
            transform: translateX(-50%);
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: var(--bluecolor);
            opacity: 0;
            transition: all 200ms ease;
        }

    .pagination li:first-child a:after, .pagination li:last-child a:after {
        display: none;
    }
    /*.pagination li:first-child a,.pagination li:last-child a{border: 1px solid rgba(0, 0, 0, 0.1);width: auto;}*/
    .pagination li:first-child a:hover, .pagination li:last-child a:hover, .pagination li:first-child a, .pagination li:last-child a {
        background: rgb(240, 243, 247) !important;
        color: var(--activecolor);
    }

    .pagination li:hover, .pagination li.active, .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
        background: transparent;
        border-color: transparent;
        color: var(--activecolor);
        transition: all 200ms ease;
    }

        .pagination li a:hover:after, .pagination li.active a:after {
            opacity: 1;
        }

    .pagination li.PagedList-skipToNext a, .pagination li.PagedList-skipToNext a:hover {
        background: #eaf0f7 url('../images/moduleIcons/rightarrow.svg') no-repeat center !important;
    }

    .pagination li.PagedList-skipToPrevious a, .pagination li.PagedList-skipToPrevious a:hover {
        background: #eaf0f7 url('../images/moduleIcons/leftarrow.svg') no-repeat center !important;
    }

.filter .input-group-addon, .filter .input-group.date input[type=text] {
    background: transparent;
    border: none;
}

.filter .input-group.date {
    border: 1px solid #dadada;
    border-radius: 4px;
    background: #fff url(../images/menuIcon/calendar.svg) no-repeat 98% 10px;
}

.gicondate input {
    border: 1px solid #dadada;
    border-radius: 4px;
    background: #fff url(../images/menuIcon/calendar.svg) no-repeat 97% 10px;
}

.filter .input-group.date .glyphicon-calendar:before {
    display: none;
}

.gicondate input, .gicondate input:focus {
    outline: none;
}

.filter .form-group {
    margin-bottom: 15px;
}

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

    .datatableheader.PmsFlex span {
        display: inline-block;
        margin-right: 15px;
    }
/*.filter .scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar{opacity: 0.9;}
.scrollbar-inner > .scroll-element .scroll-bar {background-color: #2196f3;}*/
.footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 10px 5px 230px;
    position: fixed;
    left: 0;
    bottom: 0;
}

    .footer .leftbar {
        display: none;
    }

.filterFooter, .addnewsidebar .footerData {
    padding: 12px 20px !important;
    background: #f6f6f6;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .filterFooter .btn {
        display: flex;
        justify-content: center;
        align-items: center;
        column-gap: 8px;
    }

        .filterFooter .btn.transition:hover, .addnewsidebar .footerData .btn.transition:hover {
            color: var(--whitefontcolor);
            background: var(--bluecolor);
        }

.btn.greencolor:hover {
    background: #0a3b7e;
    color: #fff;
    border-color: #0a3b7e;
}

.filterFooter .gbtn, .addnewsidebar .footerData .gbtn {
    background: transparent !important;
    text-align: left !important;
    padding: 0;
}

    .filterFooter .gbtn:hover, .addnewsidebar .footerData .gbtn:hover {
        text-decoration: none;
        color: var(--skyblue) !important;
    }

.filterresultlbl li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: #eaf0f7;
    border-radius: 30px;
    color: var(--headingcolor);
    font-family: 'Roboto';
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    padding: 10px 30px 10px 10px;
    margin-right: 8px;
    position: relative;
    white-space: nowrap;
    border: 1px solid rgba(0,0,0,0.05);
    margin: 0 0 5px;
}

.filterresultlbl {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 10px;
    padding: 0;
    margin: 0 0 10px;
    overflow-x: auto;
}

ul.filterresultlbl li button {
    border: none;
    background: transparent;
    padding: 0 0 0 15px;
}

.filterresultlbl li span {
    font-weight: 400;
    display: inline-block;
    padding-left: 5px;
}

.filterresultlbl li:last-child {
    margin-right: 0;
}

.filterresultlbl li i {
    font-size: 16px;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.filterresultlbl li:hover i {
    color: var(--activecolor);
}

.gpanel .panel {
    border: 1px solid rgba(9, 54, 121, 0.1);
    box-shadow: none !important;
}

.gpanel .panel-heading {
    font-family: 'Roboto';
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    color: #263238;
    text-transform: capitalize;
    border-bottom: 1px solid rgba(9, 54, 121, 0.1);
    padding: 8px 20px;
    background: #ebeef7;
    background-image: none !important;
}

    .gpanel .panel-heading .titleTxt {
        font-family: 'Roboto';
        font-weight: 500;
        font-size: 18px;
        line-height: 28px;
    }

.gpanel label {
    font-family: 'Roboto',sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #263238;
    display: block;
    margin-bottom: 5px;
}

.gpanel .input-group.date {
    border: 1px solid #dadada;
    border-radius: 4px;
    background: #fff url("../images/calendar.svg") no-repeat 98% center;
}

    .gpanel .input-group.date input {
        border: none !important;
        background: transparent !important;
        box-shadow: none;
    }

    .gpanel .input-group.date .glyphicon-calendar {
        display: none !important;
    }

    .gpanel .input-group.date .input-group-addon {
        background: transparent !important;
        border: none !important;
    }

.addnewsidebar input.btn.transition.gbtn.addfilterclose {
    width: auto;
    height: auto;
    position: relative;
    border-radius: 0;
    margin: 0;
}

.dataTables_wrapper .col-sm-7 .dataTables_paginate {
    float: none;
}

.dataTables_wrapper .col-sm-7 .dataTables_paginate {
    float: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.divEmplistPartial .col-sm-7 {
    width: 100%;
}

.dataTables_wrapper .row:nth-child(2) {
    overflow-y: scroll;
    max-height: 400px;
    scrollbar-width: thin;
    scrollbar-color: rgba(9, 190, 243, 0.5) transparent;
}

    .dataTables_wrapper .row:nth-child(2)::-webkit-scrollbar {
        width: 3px;
    }

    .dataTables_wrapper .row:nth-child(2)::-webkit-scrollbar-track {
        background: transparent;
    }

    .dataTables_wrapper .row:nth-child(2)::-webkit-scrollbar-thumb {
        background-color: #09bef3;
        border-radius: 20px;
        border: transparent;
    }

.Employeelistmodal .scroll-table {
    height: auto !important;
}

.dataTables_wrapper .dataTables_length select:focus-visible {
    border: 1px solid #aaa !important;
    outline: none;
}

.modal-footer {
    border-top: none;
}

.Moderatorfiltermain .panel-title i {
    float: right;
}

.Moderatorfiltermain .panel-heading.collapsed i {
    transform: rotate(0deg);
}

.Moderatorfiltermain .panel-heading i {
    transform: rotate(180deg);
}

.selectemployefiltermodal .row.form-group-main .col-lg-12 {
    width: 25%;
}

.scroll-table .scrollbar-parent .form-group.checkboxform {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .scroll-table .scrollbar-parent .form-group.checkboxform label.labelactive, .scroll-table .scrollbar-parent .form-group.checkboxform label.labelinactive {
        margin-bottom: 0;
        margin-left: 5px;
        background: #f5f5f5;
        border-radius: 5px;
        padding: 5px;
        min-width: 70px;
    }

label.labelactive {
    color: #26a69a !important;
    text-transform: uppercase;
    font-size: 12px !important;
}

label.labelinactive {
    color: #818181 !important;
    text-transform: uppercase;
    font-size: 12px !important;
}

.Employeelistmodal .col-sm-3, .Employeelistmodal .col-sm-12 {
    padding-left: 0;
    padding-right: 0;
}
/* input type number arrow */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}
/* input type number arrow end */
.form-group-main .tagify--custom-dropdown {
    max-width: 100%;
}

.select2-search__field {
    padding-left: 10px !important;
}
/******* Ticket Details *******/
body .Ticket-detail-btn {
    padding: 10px 15px;
    margin-bottom: 0;
    border-top: none;
    border-bottom: 1px solid #eaeaea;
}

.gform label {
    display: block;
    padding-bottom: 3px;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #263238;
    font-family: 'Roboto',sans-serif;
}

.gform .form-control {
    border: 1px solid #dadada;
    border-radius: 4px !important;
    width: 100%;
    height: auto;
    padding: 7px 10px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #8e8888;
    box-shadow: none;
    margin-bottom: 0;
    resize: none;
}

.gform {
    margin-bottom: 20px;
    margin-right: 20px;
    background: transparent;
}

    .gform .panel-default {
        margin-bottom: 20px;
        border: 1px solid #F0F0F0;
        background: #fff;
    }

    .gform .div-title {
        padding: 8px 15px;
        background: #f6f6f6;
        margin-bottom: 15px;
    }

.form-group.btnProperties {
    text-align: right;
    padding: 0;
}

    .form-group.btnProperties .btn-primary {
        padding: 8px 15px;
        font-size: 14px;
        font-family: 'Roboto',sans-serif;
        font-weight: 400;
        color: var(--whitefontcolor);
        border-radius: 5px;
        box-shadow: none;
        text-transform: capitalize;
        width: auto;
        height: 35px;
        min-width: 100px;
        background: var(--greencolor);
        border-color: var(--greencolor);
    }

        .form-group.btnProperties .btn-primary:hover {
            background: var(--greenhovercolor);
            color: var(--whitefontcolor);
        }

.gform .Ticket-client-detail {
    box-shadow: none;
    border: none;
}

.gform .panel-default > .panel-heading {
    display: block;
    position: relative;
    background: #f6f6f6;
    font-style: normal;
    font-size: 16px;
    line-height: 24px;
    color: #0F4F92;
}

    .gform .panel-default > .panel-heading.collapsed:after {
        font-family: feather !important;
        speak: none;
        font-style: normal;
        font-weight: 400;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        content: "\e9b1";
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
    }

    .gform .panel-default > .panel-heading:after {
        font-family: feather !important;
        speak: none;
        font-style: normal;
        font-weight: 400;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        content: "\e996";
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
    }

.gform .Ticket-client-detail > ul {
    display: block;
    padding: 0;
}

    .gform .Ticket-client-detail > ul li {
        display: block;
    }

.gform .gticketinfo {
    position: relative;
}

    .gform .gticketinfo i.icon {
        position: absolute;
        left: 0;
        top: 0;
        width: 50px;
        height: 50px;
        display: inline-block;
    }

        .gform .gticketinfo i.icon img {
            width: 100%;
        }

    .gform .gticketinfo ul {
        margin: 0;
        padding: 0;
    }

        .gform .gticketinfo ul li {
            display: block;
        }

            .gform .gticketinfo ul li p {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                column-gap: 10px;
            }

                .gform .gticketinfo ul li p i {
                    color: #0F4F92;
                }

            .gform .gticketinfo ul li p, .gform .gticketinfo ul li strong {
                font: 400 16px/30px 'Roboto',sans-serif;
                margin: 0;
                color: #333;
            }

            .gform .gticketinfo ul li strong {
                text-transform: capitalize;
            }

.Ticket-detail-left {
    border: 1px solid #eee;
}

    .Ticket-detail-left.gform {
        margin-right: 0;
    }

.Ticket-detail-btn .btn {
    font: 500 16px 'Roboto',sans-serif;
}

.Tickets-Description {
    padding: 0px 65px 20px 65px;
}

.Ticket-client-replied {
    margin-right: 65px;
}

.ticketproperties-box {
    border-left: 1px solid #eee;
    padding-left: 20px;
    padding-top: 20px;
    background: #fcfcfc;
}

.Ticket-client-replied.note-bg .Tickets-Description, .Ticket-client-replied.convo-bg .Tickets-Description {
    padding-right: 20px;
}

.Ticket-client-replied.note-bg .screenshort-div {
    background: #f7f2e0;
}

.Ticket-client-replied.convo-bg .screenshort-div {
    background: rgb(243,243,243);
}

.tickets_title_main {
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
    display: block;
    padding: 15px 8px;
    margin-bottom: 5px;
    margin-top: 0;
}

.message-scroll .Ticket-client-replied {
    margin-bottom: 25px;
}

.gticketbox {
    display: flex;
    align-items: center;
    position: relative;
    justify-content: flex-start;
    column-gap: 6px;
}

    .gticketbox sapn.TimeLineboxcunt {
        background: #FFFFFF;
        border: 0.3px solid #BDBDBD;
        border-radius: 5px;
        font-weight: 400;
        font-size: 14px;
        line-height: 19px;
        color: #757575;
        display: inline-block;
        padding: 5px 5px;
        min-width: 50px;
        text-align: center;
        max-width: 50px;
        word-break: break-all;
        font-family: 'Roboto',sans-serif;
    }

    .gticketbox p {
        font-weight: 500;
        margin-bottom: 0;
        white-space: nowrap;
        width: 80%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .gticketbox > div {
        text-align: left;
    }

        .gticketbox > div span {
            width: auto;
            margin: 0 0 10px;
        }

.all_list {
    margin: 0;
    padding: 0;
}

.page-heading .dropdown {
    position: relative;
}

body .all_list.gaction_list {
    right: -30px;
    top: 35px;
    min-width: 220px;
}

.all_list li a {
    text-align: left;
    margin-left: 0;
    padding: 8px 15px !important;
}

    .all_list li a:hover {
        color: var(--headingcolor);
    }

span.colorbox label {
    display: inline-block;
    width: 24px !important;
    height: 24px;
    border-radius: 5px;
    margin-bottom: 0;
}

.agentdrop {
    position: relative;
    display: inline-block;
    padding-right: 20px;
    min-width: 200px;
}

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

    .agentdata li {
        font: 400 14px/20px 'Roboto',sans-serif;
        color: #263238;
        padding: 5px 0 5px 8px;
        position: relative;
    }

        .agentdata li span {
            display: inline-block;
            padding: 0 7px;
        }

        .agentdata li button {
            background: transparent;
            border: none;
            padding: 0;
            color: #7F7F7F;
            font-size: 16px;
        }

            .agentdata li button:hover {
                color: var(--headingcolor);
            }

        .agentdata li i {
            position: absolute;
            left: 0;
            top: 5px;
            font-style: normal;
        }

.agentcount {
    display: inline-block;
    width: auto;
    height: 20px;
    text-align: center;
    border-radius: 25px;
    background: rgba(10, 59, 126, 0.2);
    color: var(--headingcolor);
    font: 600 11px/22px 'Roboto',sans-serif;
    cursor: pointer;
    margin-left: 10px;
    position: absolute;
    right: -61px;
    bottom: 5px;
    padding: 0px 5px;
}

.gmenucollapse.dropdown-menu {
    position: relative;
    box-shadow: none;
    border: none;
    background-color: transparent;
}

body .form-control.groupcolordata {
    width: 40px;
    height: 40px;
    padding: 3px;
}

.dataTables_wrapper .dataTables_length select {
    float: right;
    margin-bottom: 15px;
    margin-left: 15px;
}

.dataTables_wrapper .row.tblHeader > .col-sm-6 {
    width: 75%;
}

    .dataTables_wrapper .row.tblHeader > .col-sm-6 + .col-sm-3 {
        display: none;
    }

.dataTables_wrapper .dataTables_info {
    display: block;
    text-align: right;
    width: 100%;
    font: 500 14px/30px Roboto,sans-serif !important;
    color: #0f4f92;
}

.dataTables_wrapper > .row > .col-sm-5 .dataTables_info {
    display: none;
    text-align: left;
    width: 100%;
}

.dataTables_wrapper > .row > .col-sm-7 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.imgicon {
    width: 25px;
    height: 25px;
    padding: 1px 3px;
    border: 1px dashed #dadada;
    display: inline-block;
    text-align: center;
    line-height: 20px;
}

    .imgicon img {
        width: 100% !important;
        height: auto !important;
    }

.sysdefined { /*background: #ebebeb;border-radius: 4px;color: #000;font-size: 12px;padding: 4px;*/
    display: inline-block;
}

    .sysdefined i {
        display: inline-block;
        width: 20px;
        height: 20px;
        margin-right: 5px;
    }

        .sysdefined i img {
            width: 100%;
            height: auto;
        }

.Tickets-Description .imgicon {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: none;
    padding: 0;
}

ul.colordata {
    margin: 0;
    padding: 0;
    list-style: none;
}

    ul.colordata li {
        float: left;
        width: 20%;
        padding: 0;
        margin-left: -10px;
        margin-right: 10px;
        margin-bottom: 20px;
        text-align: left;
        position: relative;
    }

        ul.colordata li .gchecklable {
            border: none;
            padding: 0;
            text-align: center;
            position: relative;
            line-height: 40px;
            margin: 0 0 25px;
            width: 100%;
            height: 100%;
        }

            ul.colordata li .gchecklable .check {
                position: absolute;
                left: 50%;
                top: 0;
                transform: translateX(-50%);
                width: 42px;
                height: 42px;
                line-height: 37px;
                border-radius: 0;
                background: transparent;
                border: 2px dashed #dadada;
                border-radius: 5px;
                display: inline-block;
                cursor: pointer;
            }

        ul.colordata li label input {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            cursor: pointer;
        }

    ul.colordata input:checked ~ .check {
        border: 2px solid #0F4F92;
        background: rgba(15, 79, 146, 0.02);
    }

        ul.colordata input:checked ~ .check:after {
            display: none;
        }

    ul.colordata img.imglog {
        max-width: inherit;
        margin-left: 0;
        margin-top: 0;
        width: 20px;
        height: 20px;
        display: inline-block;
    }

    ul.colordata span.imglogoverlay {
        text-transform: capitalize;
        padding-left: 0;
        display: block;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        text-align: center;
        color: #000000;
        margin: 10px 0 0;
        opacity: 1;
        margin-top: 20px;
    }

i.previewicon {
    width: 20px;
    height: 20px;
    display: inline-block;
    cursor: pointer;
}

.convo-bg-emp {
    background: #f3f8ff !important;
}

    .convo-bg-emp .screenshort-div {
        background: #e5effd !important;
    }

.gform.Ticket-detail-left .dropdown .dropdown-menu {
    top: initial;
    bottom: 100%;
}
/****** Dashboard ********/
.dashwhite {
    background: var(--whitebgcolor);
    border: 1px solid #dbdfea;
    border-radius: 4px;
    margin-bottom: 20px;
    position: relative;
}

    .dashwhite .dash_head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 15px 15px;
        border-bottom: 1px solid #dbdfea;
    }

        .dashwhite .dash_head h3 {
            font: 500 18px/24px 'Roboto';
            margin: 0;
        }

        .dashwhite .dash_head span {
            font: 400 14px/24px 'Roboto';
            color: #000;
        }

        .dashwhite .dash_head a {
            font: 500 14px/24px 'Roboto';
            color: var(--skyblue);
        }

    .dashwhite .dash_body {
        padding: 10px 15px;
    }

.dashtop {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

    .dashtop li {
        min-width: 15.65%;
    }

    .dashtop .dashwhite {
        padding: 15px 20px 15px 50px;
        width: 100%;
        position: relative;
        background: transparent;
        border: none;
    }

        .dashtop .dashwhite .icon {
            font-size: 24px;
            position: absolute;
            left: 15px;
            top: 15px;
        }

        .dashtop .dashwhite h2 {
            font: 500 14px/20px 'Roboto';
            margin: 0 0 5px 0;
            color: var(--blackfontcolor);
        }

        .dashtop .dashwhite p {
            font: 400 12px/18px 'Roboto';
            margin: 0;
        }

.timeline-list {
    margin: 0;
    padding: 0;
}

.timeline-item {
    position: relative;
    display: flex;
    align-items: flex-start
}

    .timeline-item:not(:last-child) {
        padding-bottom: 1.5rem
    }

        .timeline-item:not(:last-child):before {
            position: absolute;
            height: calc(100% - 11px);
            width: 1px;
            background: #dbdfea;
            content: "";
            top: 13px;
            left: 5px
        }

.timeline-status {
    position: relative;
    height: 11px;
    width: 11px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
    background: var(--bluecolor);
}

    .timeline-status.is-outline:after {
        position: absolute;
        height: 7px;
        width: 7px;
        border-radius: 50%;
        background: #fff;
        content: "";
        top: 2px;
        left: 2px
    }

.timeline-date {
    position: relative;
    color: #8094ae;
    width: 90px;
    margin-left: .75rem;
    flex-shrink: 0;
    line-height: 2rem;
    color: var(--lightblackcolor);
}

    .timeline-date .icon {
        margin-right: .25rem;
        vertical-align: middle;
        color: #8094ae;
        display: inline-block;
        position: absolute;
        right: 0;
        top: 2px
    }

.timeline-data {
    padding-left: 8px
}

.timeline-title {
    font-size: 15px;
    color: #364a63;
    margin-top: 0;
    margin-bottom: .75rem
}

.timeline-des {
    color: #8094ae
}

    .timeline-des p {
        margin-bottom: .25rem
    }

.timeline .time {
    display: block;
    font-size: 12px;
    color: #8094ae
}

.timeline-item .action {
    position: absolute;
    right: 0;
    top: -2px;
    min-width: 50px;
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    padding: 5px;
    display: inline-block;
}

.action_list {
    ;
    min-width: 50px;
    text-align: center;
    font-size: 12px;
    border-radius: 4px;
    padding: 5px;
    display: inline-block;
}

.visibilityl-logo i {
    background: rgb(10 59 126 / 19%);
    height: 40px;
    width: 40px;
    display: inline-block;
    text-align: center;
    padding: 0px;
    border-radius: 50px;
    line-height: 37px;
}

.visibilityl-logo span {
    font-size: 16px;
    color: #2D2C2C;
    margin-left: 10px;
}

.visibility-tag span {
    color: #0F4F92;
    background: #F5F5F5;
    padding: 6px 14px;
    text-align: center;
    margin: 5px;
    display: inline-block;
    border-radius: 32px;
    font-weight: 400;
    font-size: 14px;
}

.visibility-main {
    border: 1px solid rgba(9, 54, 121, 0.2);
    border-radius: 6.67826px;
    padding: 20px;
    margin-top: 20px;
    min-height: 200px;
}

.visibilityl-logo {
    margin-bottom: 20px;
}

.programVisibilitymain .visibilitytext {
    display: block;
    text-align: center;
    background: transparent;
    border: none;
    font-size: 17px;
    color: #263238;
    width: 100%;
    text-align: left;
}

    .programVisibilitymain .visibilitytext .feather {
        float: right;
    }
/*table dropdown show last h4 table*/
.scroll-table table.table tr:nth-last-child(-n + 3) .gaction_list {
    top: auto;
    bottom: 40px;
    right: 30px;
}

body .table tr:nth-last-child(-n + 3) .gaction_list:after, body .table tr:nth-last-child(-n + 3) .gaction_list:before {
    content: "";
    position: absolute;
    right: 25px;
    transform: rotate(180deg);
    bottom: -23px;
    top: auto !important;
}

body .table tr:nth-last-child(-n + 3) .gaction_list:after {
    border: 12px solid transparent;
    border-bottom-color: #eee;
    bottom: -25px !important;
}

.scroll-table table.table tr:nth-child(-n + 3) .gaction_list {
    top: 40px;
    bottom: auto;
    right: 30px;
}

body .table tr:nth-child(-n + 3) .gaction_list:after, body .table tr:nth-child(-n + 3) .gaction_list:before {
    content: "";
    position: absolute;
    right: 25px;
    transform: rotate(0deg);
    top: -23px !important;
    bottom: auto !important;
}

body .table tr:nth-child(-n + 3) .gaction_list:after {
    border: 12px solid transparent;
    border-bottom-color: #eee;
    top: -25px !important;
}

body .table tr:nth-last-child(-n + 3) .gaction_list {
    bottom: 55px;
    top: auto;
}

body .table tr:nth-last-child(-n + 3) .gaction_list {
    bottom: 55px;
    top: auto;
}

body .table tr:nth-child(-n + 4) .gaction_list {
    bottom: auto;
    top: 50px;
}
/*table dropdown show last h4 table  end*/
#contetntablereordering td a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
    display: block;
}

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

    .timelineshortdata .activityDownSquare {
        position: relative;
        right: inherit;
        top: inherit;
    }

.dash_body.scrollbar-parent::-webkit-scrollbar-thumb {
    background-color: #2196f3;
}

.dash_body.scrollbar-parent {
    scrollbar-color: #2196f3 #f1f1f1;
    max-height: 310px;
}

.glistdataicon {
    column-gap: 10px;
    justify-content: flex-start;
}

    .glistdataicon .icon {
        position: relative;
    }

        .glistdataicon .icon i {
            font-size: 10px;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-90%);
        }

        .glistdataicon .icon span {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            z-index: 1;
            opacity: 0.4;
            display: inline-block;
        }

.filterSection .input-group.date > input {
    padding: 12px 35px 12px 15px;
    background-position: 95%;
    cursor: pointer;
    border: 1px solid #dadada;
    border-radius: 4px;
    background: #fff url(../images/moduleIcons/calendar.svg) no-repeat 96% center !important;
}

.Help-Desk-bottom-info {
    padding-top: 8px;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 90%;
    display: block;
    font-size: 12px;
}

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

.select-template-main .note-dropdown-menu {
    left: auto;
    right: 0px;
}

.select-template-main .dropdown-fontname {
    left: 0;
}

.select-template-main .dropdown-fontsize {
    left: 0;
    right: auto;
}

.program-titalinner {
    color: #0f4f92;
    font-size: 23px;
}

.logo-lable {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
}

.clr-btn {
    background: transparent;
    border: none;
    color: #09bef3;
}

body .scroll-height {
    height: calc(100vh - 200px) !important;
}

.scrollbar-parent::-webkit-scrollbar:horizontal {
    height: 5px;
    overflow: auto;
}

.certificatediv {
    max-height: calc(100vh - 100px);
    padding: 0px;
    margin: 0px;
}

.gtimeline {
    display: inline-block;
    list-style: none;
}

.certificatediv .form-group-main.select-template-main {
    background: transparent;
}

ul.gtimeline.jobtimeline {
    min-height: 45px;
}

.gtimeline li {
    font: 400 14px/20px 'Roboto',sans-serif;
    color: #2CB34C;
    position: relative;
    padding-right: 2px;
    padding-top: 1px;
}

    .gtimeline li:after, .gtimeline li:before {
        content: '';
        position: absolute;
    }

    .gtimeline li.applied:after {
        left: -3px;
        top: 18px;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #2CB34C;
    }

    .gtimeline li.updated:before {
        right: -10px;
        top: -6px;
        border: 5px solid transparent;
        border-left-color: #F44336;
    }

.gtimeline.jobtimeline li.updated:before {
    display: none;
}

.gtimeline.jobtimeline li.updated:after {
    left: 0;
    top: -4px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #2cb34c;
}

.gtimeline li.Closedate:before {
    right: -9px;
    top: -6px;
    border: 5px solid transparent;
    border-left-color: #f44336;
}

.gtimeline li span:after {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 1px;
}

.gtimeline li.applied span:after {
    background: #2CB34C;
    top: 20px;
    width: 50%;
    z-index: 2;
}

.gtimeline li.updated span:after {
    background: #F44336;
}

.gtimeline li.Closedate span:after {
    background: #f44336;
}

.gtimeline li:last-child {
    color: #F44336;
}

.reqwest-respons {
    background: #FAFAFA;
    padding: 5px 15px;
}

    .reqwest-respons label img {
        width: 25px;
    }

    .reqwest-respons .item label.title {
        color: #9C9C9C;
        font-size: 12px;
    }

    .reqwest-respons .item {
        padding: 0px 12px;
    }

    .reqwest-respons .total.requestin {
        font-size: 18px;
        color: #ED145B;
    }

    .reqwest-respons .total.res {
        font-size: 18px;
        color: #2CB34C;
    }

    .reqwest-respons .total.comment {
        font-size: 18px;
        color: #0F4F92;
    }

    .reqwest-respons .total.like {
        font-size: 18px;
        color: #09BEF3;
    }

.agentdrop .dropdown.open .feather-chevron-right:before {
    content: "\e92e";
}

.ActivityLogstab .action {
    width: auto;
    text-align: center;
    display: inline-block;
    padding: 5px;
    border-radius: 5px;
}

.convo-bg-sys .Ticket-client-name figure {
    background: #cce7fd;
}

.convo-bg-agent .Ticket-client-name figure {
    background: #ffe4e4;
}

.p-traning {
    padding: 6px 15px;
    width: auto;
    display: inline-block;
    border-radius: 5px;
    font-weight: 400;
}

.levelall {
    background: #CBFFD7;
    color: #2CB34C;
}

.levelbeg {
    background: #CBFFD7;
    color: #2CB34C;
}

.levelmed {
    background: #FFE7DA;
    color: #F47A36;
}

.leveladv {
    background: #FFD1E0;
    color: #ED145B;
}

.training-titalbox h4 {
    font-size: 26px;
    font-weight: 500;
}

    .training-titalbox h4 span {
        color: #FECB03;
        font-size: 20px;
    }

.training-titalbox .training-mode {
    background: #D9E8FF;
    color: #093679;
    font-size: 15px;
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 5px;
    text-transform: uppercase;
}

    .training-titalbox .training-mode img {
        width: 25px;
    }

.training-titalbox .training-cat {
    color: #2CB34C;
    background: #CFFFDA;
    padding: 5px 10px;
    border-radius: 6px;
    margin-right: 5px;
}

.training-titalbox .training-cet {
    color: #FECB03;
    background: #FFF7D9;
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 5px;
}

.trainings-data .trainings-info {
    border: 1px solid rgba(0, 0, 0, 0.07);
    padding: 20px;
    border-radius: 5px;
    width: 300px;
    margin-bottom: 15px;
}

    .trainings-data .trainings-info span {
        font-size: 17px;
        color: #9C9C9C;
    }

    .trainings-data .trainings-info.format p {
        margin-top: 20px;
        color: #263238;
        font-size: 18px;
        border-bottom: 1px solid #FECB03;
        padding-bottom: 5px;
    }

.trainings-data {
    column-gap: 15px;
    flex-wrap: wrap;
}

    .trainings-data .trainings-info.leval p {
        margin-top: 20px;
        color: #263238;
        font-size: 18px;
        border-bottom: 1px solid #ED145B;
        padding-bottom: 5px;
    }

        .trainings-data .trainings-info.leval p span {
            color: #ED145B;
            background: #FFCEDE;
            padding: 6px 15px;
            border-radius: 10px;
            font-size: 14px;
        }

    .trainings-data .trainings-info.duration p {
        margin-top: 20px;
        color: #263238;
        font-size: 18px;
        border-bottom: 1px solid #882CB3;
        padding-bottom: 5px;
    }

    .trainings-data .trainings-info.assessment p {
        margin-top: 20px;
        color: #263238;
        font-size: 18px;
        border-bottom: 1px solid #FD6D1C;
        padding-bottom: 5px;
    }

    .trainings-data .trainings-info span img {
        margin-right: 15px;
    }

.traninglistinfo ul {
    padding-left: 18px;
    font-size: 15px;
    color: #444444;
    margin-top: 10px;
}

    .traninglistinfo ul li {
        margin-bottom: 15px;
    }

.no-contentbtn {
    color: #0f4f92;
    font-size: 15px;
    border: 1px dashed;
    padding: 13px 30px;
}

.m-summarytable .col-sm-12 .d-flexnew {
    border-top: 1px solid #e5e3ef;
    border-right: 1px solid #e5e3ef;
    border-left: 1px solid #e5e3ef;
    padding: 8px 5px;
    margin-bottom: -5px;
}

.summarygraf .dashwhite {
    min-height: 500px;
    max-height: 500px;
}

.FormMaker .input-group .input-group-addon {
    position: relative;
}

    .FormMaker .input-group .input-group-addon input {
        position: absolute;
        left: 7px;
        top: 9px;
    }

    .FormMaker .input-group .input-group-addon label {
        margin-left: 10px;
        padding-bottom: 0px;
    }

.FormMaker input.form-control {
    margin-bottom: 5px;
}

.makeRangeBoxes .input-group input {
    position: absolute;
    top: 0;
}

.makeRangeBoxes .input-group label {
    margin-left: 15px;
}

.dcount {
    display: flex;
    justify-content: space-between;
    column-gap: 15px;
}

.dcountinner {
    border: 1px solid rgba(9, 54, 121, 0.1);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.02);
    border-radius: 20px;
    padding: 15px;
    display: flex;
    width: 100%;
    justify-content: space-between;
}

    .dcountinner label span {
        display: block;
    }

.dtext span {
    font-size: 20px;
    font-weight: 500;
}

label.dtext p {
    margin: 0;
    color: #9C9C9C;
    font-size: 14px;
}

.dconts p {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 0px;
    margin-top: 13px;
}

label.dtext {
    margin-right: 10px;
}

.polldata .progress-bar {
    font-size: 14px;
    color: #263238;
    background: #e9e9e9;
    border: none;
    box-shadow: none;
    padding: 10px;
    border-radius: 5px;
    height: 75%;
}

.pollqus {
    position: absolute;
    top: 5px;
    left: 10px;
    margin-bottom: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
    font-size: 14px;
}

    .pollqus label {
        margin-right: auto;
        font-weight: 400;
    }

.tprogress {
    margin-right: 15px;
    font-weight: 500;
}

.polldata .progress {
    height: 40px;
    background: transparent;
    box-shadow: none;
}

.polldata .highprogress .progress-bar {
    background: rgb(37 203 76 / 28%);
}

.highprogress .tprogress {
    color: #2CB34C;
}

.ps-h {
    color: #0F4F92;
    font-weight: 500;
    font-size: 20px;
    margin-bottom: 30px;
}

.polldata h4 {
    color: #000;
    font-weight: 400;
    font-size: 16px;
    border-bottom: 0.8px solid #E4E5E7;
    padding-bottom: 13px;
    margin-bottom: 25px;
    margin-top: 0px;
}

.poll-comment {
    display: flex;
    justify-content: space-between;
    border-top: 0.8px solid #E4E5E7;
    padding-top: 15px;
}

    .poll-comment label {
        color: #7C7B7B;
        font-size: 14px;
        font-weight: 500;
    }

.pollvote li {
    padding: 9px;
    margin-bottom: 5px;
    color: #060606;
    font-size: 15px;
}

.pollvote ol {
    padding-left: 28px;
}

.chart-box {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 15px;
}

    .chart-box .chart-h {
        border-bottom: 0.8px solid #E4E5E7;
        margin-top: 0;
        padding-bottom: 15px;
        font-weight: 400;
        font-size: 16px;
    }

.surveylist {
    background: rgba(136, 44, 179, 0.1);
    border-left: 5px solid #882CB3;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 10px;
    position: relative;
}

.panel:nth-child(2n) > .surveylist {
    background: rgba(9, 190, 243, 0.1);
    border-left: 5px solid #09BEF3;
}

.panel:nth-child(3n) > .surveylist {
    background: rgba(244, 122, 54, 0.1);
    border-left: 5px solid #09BEF3;
}

.panel:nth-child(4n) > .surveylist {
    background: rgba(237, 20, 91, 0.1);
    border-left: 5px solid #09BEF3;
}

.panel:nth-child(5n) > .surveylist {
    background: rgba(237, 20, 91, 0.1);
    border-left: 5px solid #09BEF3;
}

.surveylist h3 {
    margin: 0;
    font-size: 18px;
}

.surveylist p {
    margin: 0;
    font-size: 15px;
}

.traeningsearch select:focus-visible {
    border: none;
    outline: none;
}

.traeningsearch select {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 3px 5px;
    border-radius: 5px;
}

.agentdrop .dropdown {
    position: static;
}

.polldata {
    border: 1px solid #eaeaea;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 30px;
}

.chart-box .panel {
    box-shadow: none !important;
}

.surveylist .accordion-toggle i {
    position: absolute;
    right: 9px;
    top: 22px;
    font-size: 24px;
}

.surveylist .accordion-toggle.collapsed i:before {
    content: "\e92e";
}

#pdfviewer {
    border: none;
}
/*//Ratting feedbak //*/
.star-widget input {
    display: none
}

.star-widget label {
    font-size: 35px !important;
    color: #9f9f9f !important;
    padding: 10px;
    transition: .2s;
    float: right
}

.star-widget input:checked ~ label, .star-widget input:not(:checked) ~ label:hover, .star-widget input:not(:checked) ~ label:hover ~ label {
    color: #fd4 !important
}

#rate-1:checked ~ .rating-desc:before {
    content: "Poor😋"
}

#rate-2:checked ~ .rating-desc:before {
    content: "Not bad"
}

#rate-3:checked ~ .rating-desc:before {
    content: "Average"
}

#rate-4:checked ~ .rating-desc:before {
    content: "Good😋"
}

#rate-5:checked ~ .rating-desc:before {
    content: "Excellent😋"
}

.rating-desc {
    width: 100%;
    font-size: 20px;
    font-weight: 600;
    margin: 5px 0 20px;
    text-align: center;
    transition: .2s;
    clear: both;
    padding-top: 15px
}

:not(.btn-check) + .btn:active {
    outline: 0
}

.star-widget label:nth-child(2) {
    margin-right: 27%
}

.feedbacktext {
    margin-bottom: 30px
}
/*//Ratting feedbak end //*/
.t-rating-btn {
    background: transparent;
    border: none;
    color: #09bef3;
    font-size: 16px;
}

.training-rate-icon {
    display: inline-block;
}

.t-rating-btn:hover {
    text-decoration: underline;
}

body .fltr-table.scroll-table {
    height: calc(100vh - 280px) !important;
}

.pollhead {
    justify-content: space-between;
    border-bottom: 1px solid #eaeaea;
}

    .pollhead h3 {
        margin-top: 0;
        font-size: 16px;
        margin-bottom: 0;
        max-width: 66%;
    }

.pollhead {
    justify-content: space-between;
    border-bottom: 1px solid #eaeaea;
    align-items: center;
    margin-bottom: 25px;
}

.votebtn {
    background: rgba(44, 179, 76, 0.2);
    border: 0.817745px solid #2CB34C;
    color: #2CB34C;
    border-radius: 3px;
    padding: 3px 10px;
}

.votec-live span {
    position: absolute;
    right: 0;
    top: -35px;
    background: #DCDDDC;
    padding: 2px 10px;
    border-radius: 3px;
    letter-spacing: 1.53582px;
}

.votelive span {
    background: #FFE0E0;
    color: #BD002A;
}

.survyhead {
    display: flex;
    align-items: center;
    width: 70%;
}

    .survyhead .survyhead-left {
        margin-right: 10px;
    }

.survyhead-body {
    width: 100%;
}

.survy-comment {
    border-top: 0px;
}
/*-------- radio btn design with poll qus ans--------*/
.pollanspop ul {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: auto;
}

    .pollanspop ul li input[type=radio] {
        position: absolute;
        visibility: hidden;
    }

    .pollanspop ul li label {
        cursor: pointer;
        -webkit-transition: all 0.25s linear;
        background: #fff;
        padding: 11px;
        border: 1px solid rgb(33 185 183 / 51%);
        border-radius: 5px;
        margin-bottom: 11px;
        display: flex;
        column-gap: 10px;
        align-items: center;
    }

.pollanspop input[type=radio]:checked ~ label {
    color: #000;
    border: 1px solid rgb(33 185 183 / 51%);
    background: rgb(189 245 244 / 47%);
}

.pollvotemodal .modal-body {
    background: #F5F5F5;
}

.pollanspop h3 {
    font-size: 19px;
    margin-bottom: 30px;
}

.pollanspop .poll-comment button {
    border: none;
    background: transparent;
}

.pollanspop .poll-comment span {
    color: #7C7B7B;
    font-size: 14px;
    font-weight: 400;
}

.pollfooter {
    text-align: center;
}

.preview-certificate-main.scrollbar-parent {
    max-height: calc(100vh - 100px);
}
/*-------- radio btn design with poll qus ans end --------*/
body .scroll-table.attendees-table {
    height: calc(100vh - 180px) !important;
}

#tblAttendeesList th .checkboxform .toggle label::before {
    height: 12px;
    width: 30px;
}

#tblAttendeesList th .checkboxform .toggle label:after {
    width: 10px;
    height: 10px;
    top: 1px;
}

body .tabwithfilter .scroll-table {
    height: calc(100vh - 275px) !important;
}

.argetlist.scroll-table {
    height: calc(100vh - 180px) !important;
}

.scroll-table.certificatediv {
    height: calc(100vh - 150px) !important;
}

.scroll-table.scroll100 {
    height: calc(100vh - 180px) !important;
}

.choose-event-file input[type=file] {
    border: 1px dashed;
    background: transparent;
    font-size: 10px;
    width: 158px;
    padding: 5px;
    border-radius: 50px;
}

.choose-event-file input::file-selector-button {
    background: transparent;
    border: none;
}

.event-file-box-main {
    justify-content: space-between;
    flex-wrap: wrap;
}

.event-file-box-inner {
    width: 50%;
}

.event-file-box-in .btn-close {
    background: transparent;
    border: none;
}

.event-file-box {
    width: 50%;
    display: flex;
    justify-content: end;
    flex-wrap: wrap;
}

.event-file-box-in .btn-close i {
    font-size: 14px;
}

.Assessment-list-box .panel.row {
    position: relative;
    flex-wrap: wrap;
    display: flex;
}

    .Assessment-list-box .panel.row .panel-collapse {
        width: 100%;
    }

.Assessment-list-box .rowheading {
    flex-wrap: nowrap !important;
}

    .Assessment-list-box .rowheading div {
        padding: 0px 15px;
    }

    .Assessment-list-box .rowheading .a-question {
        width: 80%;
        padding-left: 81px;
    }

    .Assessment-list-box .rowheading .a-action {
        width: 15%;
    }

.gpanel .panel-collapse > div.modal-assesment {
    padding-left: 140px;
}

.justify-content-end {
    justify-content: end;
}

.top-search {
    justify-content: end;
}

.traningleftclose, .traningleftarrow {
    visibility: hidden;
}

body .scroll-table.scrollbar-modal {
    height: calc(100vh - 123px) !important;
    max-width: 100% !important;
    padding-top: 15px;
    padding-bottom: 15px;
}

.scroll-table.scrollbar-modal > .scroll-element.scroll-x {
    right: 0;
}

.radioboxdatalabel label, .checkboxdatalabel label {
    margin-left: 35px;
    font-size: 16px;
}

.scroll-table.viwerscrol1 {
    height: calc(100vh - 160px) !important;
}

.scrollbar-modal .tagify.tagify--custom-dropdown {
    width: 100%;
    max-width: 100%;
}
/*.program-trainer-label {display: flex !important;align-items: center;justify-content: space-between;}*/
.program-trainer-clr {
    color: #09bef3;
    background: transparent;
    border: none;
    position: absolute;
    z-index: 1;
    right: 0;
    top: 4px;
}

#MyCompleteEvent input#txtDate {
    width: 100%;
    height: 40px;
    padding: 10px;
}

#MyCompleteEvent #txtRemarks {
    width: 100% !important;
}

.w100 {
    width: 100%;
}

.scroll-table.scrollbar-modal .scroll-x {
    display: none;
}

.overviwerow {
    column-gap: 15px;
}

.workshop-assessment-btn {
    font-size: 15px !important;
    background: #3993d6;
    padding: 3px 10px !important;
    color: #fff !important;
}

.workshop-assessment-main {
    display: flex;
    justify-content: end;
    margin-right: 15px;
}

.gridlist {
    margin-left: 30px;
    column-gap: 10px;
}

    .gridlist button {
        padding: 6px !important;
        border: 1px solid #eaeaea !important;
    }

.griddata.col-sm-12 .Ava-Trainings-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

    .griddata.col-sm-12 .Ava-Trainings-box .training-inner1 {
        width: 60%;
    }

    .griddata.col-sm-12 .Ava-Trainings-box .training-inner2 {
        width: 40%;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

        .griddata.col-sm-12 .Ava-Trainings-box .training-inner2 .Ava-Trainings-list-info ul {
            column-gap: 15px;
        }

            .griddata.col-sm-12 .Ava-Trainings-box .training-inner2 .Ava-Trainings-list-info ul li {
                width: 70px;
            }

.griddata.col-sm-12 .Trainings-right {
    position: relative;
    left: auto;
    bottom: 0;
    transform: translatey(20%);
}

.gridlist button.active {
    color: #09bef3 !important;
    border: 1px solid #09bef3 !important;
}

.select2-container--open .select2-dropdown {
    top: 0px !important;
}

.no-data {
    display: flex;
    justify-content: center;
    border: 1px solid rgba(0, 0, 0, 0.1);
    min-height: 360px;
}

.no-training-data {
    border: 1px solid rgba(0,0,0,.05);
    text-align: center;
    padding: 20px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    min-height: 150px;
}

    .no-training-data img {
        width: 70%;
        max-width: 310px;
    }

.scrollbar-parent-modal {
    max-height: 500px;
}

.dec {
    max-width: 200px;
}

    .dec .ellipsis {
        width: 100%;
    }

.btn.excelbtn {
    background: rgba(19, 118, 42, 0.1);
    border: 1px solid #13762A;
    box-shadow: none;
    border-radius: 4px;
    min-width: 40px;
    height: 36px;
    line-height: 35px;
    text-align: center;
    position: relative;
    display: inline-block;
    cursor: pointer;
    padding: 0 !important;
}

    .btn.excelbtn:hover {
        background: #13762A !important;
    }

        .btn.excelbtn:hover img {
            filter: brightness(0) invert(1);
        }

.Attendeesimport form {
    display: flex;
    align-items: center;
}

.Attendeesimport {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

    .Attendeesimport .importlabel {
        width: 125px;
        margin-bottom: 0px;
    }

.commentcollapse .input-group-addon {
    background: #fff;
}

.commentcollapse .form-control {
    border-left: none !important;
    border-right: none !important;
}

    .commentcollapse .form-control:hover {
        border-color: #dadada !important;
    }

.commentcollapse .input-group-addon .feather-send {
    color: #0a3b7e;
    font-size: 18px;
}

.name-addon {
    background: #D9D9D9;
    padding: 5px 5px;
    border-radius: 50px;
}

.surveypop li {
    background: #fff;
    padding: 15px;
    border-radius: 5px;
    border: 1px solid #eaeaea;
}

.surveypop.pollanspop input[type=radio]:checked ~ label {
    color: #2CB34C;
    border: none;
    background: none
}

.surveypop.pollanspop ul li label {
    margin-bottom: 0px;
    border: none;
}

.surveypop ul li {
    margin-bottom: 15px;
}

.surveylist-popup {
    position: relative;
}

.pollanspop.surveypop ul li input[type=radio] {
    visibility: visible;
    left: 0px;
    top: 7px;
}

.pollanspop.surveypop ul li label {
    padding-left: 25px;
}

.Assessmenttablemodal-inner .iconData i, .iconDatapara i {
    margin-left: 12%;
}

.Certificatedropdown .select2-dropdown {
    z-index: 0;
}

.fc .fc-daygrid-body table, .fc .fc-daygrid-body {
    width: 100% !important;
}

.edit_template .panel {
    background: var(--whitebgcolor);
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: none;
}

.edit_template .panel-body {
    padding: 15px;
    display: flex;
}

.edit_template .panel-heading {
    background: transparent;
    padding: 0;
    border-bottom: none !important;
    box-shadow: none;
}

.edit_template .empbox {
    position: relative;
    padding-left: 68px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 55px;
}

    .edit_template .empbox .empicon {
        display: inline-block;
        width: 54px;
        height: 54px;
        line-height: 54px;
        background: rgba(15, 79, 146, 0.1);
        border: 1px solid #0F4F92;
        border-radius: 8px;
        text-align: center;
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 300;
        font-size: 22px !important;
        letter-spacing: 0.1em;
        color: #0a3b7e;
        position: absolute;
        left: 0;
        top: 0;
    }

    .edit_template .empbox .employeedata > span {
        display: block;
        width: 100%;
        font-family: 'Roboto',sans-serif;
    }

        .edit_template .empbox .employeedata > span.employee_name {
            font-weight: 500;
            font-size: 14px;
            line-height: 30px;
            letter-spacing: 0.04em;
            color: var(--blackfontcolor);
            margin-bottom: 5px;
            text-transform: capitalize;
        }

        .edit_template .empbox .employeedata > span.employee_code {
            font-weight: 400;
            font-size: 14px;
            line-height: 20px;
            letter-spacing: 0.04em;
            color: #0f4f92;
        }

.edit_template .label {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 500 !important;
    font-size: 14px;
    line-height: 16px;
    color: #263238;
    font-family: 'Roboto',sans-serif;
    text-align: left;
    padding-left: 0;
}

.edit_template .label_data {
    display: block;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #8e8888;
    min-height: 40px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-bottom: 0px;
    text-transform: capitalize;
}

.edit_template .form-control {
    border: 1px solid #dadada;
    border-radius: 4px !important;
    width: 100%;
    height: auto;
    padding: 7px 10px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    font-family: 'Roboto',sans-serif;
    color: #8e8888;
    box-shadow: none;
    margin: 10px 0 0;
    resize: none;
}
/****** new Dashboard css ********/
.main {
    padding: 0px 0px 0px 60px;
}

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

.noborder-top {
    border-top: none !important;
}

.calendar_box thead, .daterangepicker thead {
    background: transparent !important;
}

.pageHead {
    background: transparent;
    border-bottom: none;
    margin: 4px 0 0 0 !important;
}

.gpanel .input-group.datedash {
    border: 1px solid #0A3B7E;
    border-radius: 4px;
    background: rgba(10,59,126,0.10) url("../images/menuIcon/calendar.svg") no-repeat 97% center;
    padding: 10px 35px 10px 15px;
    font: 500 12px 'Roboto',sans-serif;
    cursor: pointer;
    color: #0A3B7E;
}

    .gpanel .input-group.datedash input {
        border: none !important;
        background: transparent !important;
        box-shadow: none;
    }

.midSection {
    padding: 10px 0;
}
/*.calendar_box{background:var(--whitebgcolor);border:1px solid rgba(0,0,0,.05);padding:15px 20px;margin-bottom: 5px;}*/
.calendar_box .fc th {
    font-weight: 500;
    font-size: 10px;
    line-height: 16px;
    text-align: center;
    text-transform: uppercase;
    color: #7e818c;
    padding: 15px 0 !important;
}

.calendar_box .fc table {
    width: 100%;
}

.calendar_box .fc td {
    min-width: 45px;
    position: relative;
    position: relative;
    text-align: center;
    padding: 5px 0;
    color: #0F2552;
    font-size: 16px;
    font-weight: 500;
}

.calendar_box td.fc-other-month.fc-future {
    opacity: .3;
}

.calendar_box .fc-icon-left-single-arrow:after {
    content: "\e900";
    font-weight: 700;
    color: #0f4f92;
}

.calendar_box .fc-icon-right-single-arrow:after {
    content: "\e901";
    font-weight: 700;
    color: #0f4f92;
}

.midSection .popover-header button {
    position: absolute;
    right: 8px;
    top: 5px;
    cursor: pointer;
    color: #0f4f92;
}

.calendar_box .fc-event-draggable, a.fc-event {
    position: absolute;
    left: 0;
    top: 0;
    background: transparent;
    border: none;
}

.calendar_box .fc-widget-content, .calendar_box .fc-widget-header {
    border: none;
    padding: 0;
}

.calendar_box .fc-direction-ltr {
    min-height: 350px
}

.calendar_box .fc .fc-toolbar.fc-header-toolbar {
    border-bottom: .87013px solid #e4e5e7;
    padding-bottom: 15px;
    margin-bottom: 0
}

    .calendar_box .fc .fc-toolbar.fc-header-toolbar h2 {
        display: none;
    }

.calendar_box .fc .fc-button-group > .fc-button {
    position: relative;
    background: transparent;
    border: none;
    box-shadow: none
}

.calendar_box a.fc-event span {
    display: none;
}

.calendar_box a.fc-event {
    width: 38px;
    height: 38px;
    background: transparent;
    border-radius: 50%;
    position: absolute;
    top: -34px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
}

    .calendar_box a.fc-event:after {
        content: "";
        position: absolute;
        width: 35px;
        height: 35px;
        border-radius: 50%;
        border: 1px solid #f00;
        z-index: 999;
        left: 0;
        top: 0;
        transform: translate(6%, 0%);
    }

    .calendar_box a.fc-event:before {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 0;
        width: 8px;
        height: 8px;
        background: #f00;
        border-radius: 50%;
        transform: translateX(-50%);
    }

.midSection h3.popover-title {
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
}

.calendar_box .fc-header-toolbar.fc-toolbar .fc-button-primary {
    background: 0 0;
    color: #848a95;
    border: none;
    padding: 0 0 0 15px
}

.calendar_box .fc .fc-button-primary:focus,
.calendar_box .fc .fc-button-primary:hover,
.calendar_box .fc .fc-button-primary:not(:disabled).fc-button-active,
.calendar_box .fc .fc-button-primary:not(:disabled).fc-button-active:focus,
.calendar_box .fc .fc-button-primary:not(:disabled):active,
.calendar_box .fc .fc-button-primary:not(:disabled):active:focus {
    background: 0 0;
    border: none;
    outline: 0;
    box-shadow: none;
    color: var(--headingcolor)
}

.calendar_box table.fc-scrollgrid {
    border: none
}

.calendar_box .fc .fc-toolbar-title {
    font-size: 15px;
    line-height: 24px;
    display: flex;
    align-items: center;
    text-align: center;
    letter-spacing: .01em;
    text-transform: uppercase;
    color: var(--headingcolor)
}

.calendar_box .fc .fc-today-button, .calendar_box .fc-popover-header {
    display: none
}

.calendar_box .fc th.fc-day a {
    font-weight: 500;
    font-size: 10px;
    line-height: 16px;
    text-align: center;
    text-transform: uppercase;
    color: #7e818c
}

.calendar_box .fc-theme-standard td, .calendar_box .fc-theme-standard th {
    border: none;
    padding: 5px 0
}

.calendar_box .fc .fc-daygrid-day-top {
    align-items: center;
    justify-content: center;
}
/*.calendar_box .fc-theme-standard td{overflow: hidden;}*/
.calendar_box .fc .fc-non-business, .fc-daygrid-dot-event.fc-event-mirror, .fc-daygrid-dot-event:hover {
    background: 0 0
}

.calendar_box .fc-theme-standard td a {
    font-weight: 500;
    font-size: 18px;
    line-height: 18px;
    display: flex;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    color: #0F2552
}

.calendar_box .fc tbody td.fc-day.fc-day-sun a, .calendar_box .fc-sun span {
    color: #f44336
}

.calendar_box .fc .fc-more-link {
    text-indent: 9999px; /*border: 1px solid #ED145B;*/
    border-radius: 50%;
    width: 30px;
    height: 30px;
    position: absolute;
    bottom: 1px;
    right: 50%;
    transform: translateX(50%);
}

    .calendar_box .fc .fc-more-link:after {
        content: "";
        position: absolute;
        top: -3px;
        left: 50%;
        width: 6px;
        height: 6px;
        background: #f00;
        border-radius: 50%;
        transform: translateX(-50%);
    }
/*.calendar_box .fc .fc-more-link:after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:#2cb34c}.calendar_box .fc .fc-h-event{background:0 0;border:none;border-radius:0}*/
.calendar_box .fc .fc-event-title {
    font-weight: 400;
    font-size: 15px;
    line-height: 18px;
    text-align: center;
    color: var(--blackfontcolor);
    display: block;
    padding: 5px
}

.calendar_box .fc td[data-date='2023-01-24'] .fc-more-link:after {
    background: #e3351e
}

.calendar_box .fc-scroller.fc-scroller-liquid-absolute {
    overflow: inherit !important
}

.calendar_box .fc .fc-daygrid-day.fc-day-today, .fc .fc-highlight {
    background: 0 0 !important
}

    .calendar_box .fc .fc-daygrid-day.fc-day-today a, .fc-highlight a {
        color: #fff
    }

    .calendar_box .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-top, .fc .fc-highlight {
        position: relative
    }

        .calendar_box .fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-top:after, .fc .fc-highlight:after {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: var(--headingcolor);
            transform: translate(-50%,-50%)
        }

.calendar_box .fc .fc-highlight:after {
    transform: translate(-50%,-10%);
    opacity: .1
}

.calendar_box .fc-popover {
    box-shadow: none
}

.calendar_box .fc-more-popover .fc-popover-body {
    min-width: initial;
    padding: 5px;
    border-radius: 5px
}

    .calendar_box .fc-more-popover .fc-popover-body .fc-event-time {
        font-size: 14px;
        color: #263238;
        text-transform: uppercase;
        font-weight: 500;
        font-family: Roboto,sans-serif
    }

.calendar_box .fc-daygrid-dot-event {
    display: block;
    padding-left: 20px
}

    .calendar_box .fc-daygrid-dot-event .fc-daygrid-event-dot {
        position: absolute;
        left: 0;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #ed145b;
        border: none;
        top: 6px
    }

    .calendar_box .fc-daygrid-dot-event .fc-event-title {
        text-align: left;
        font-size: 12px
    }

.calendarData p {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 5px 0 0;
    font-size: 13px;
    font-weight: 500;
    column-gap: 15px;
}

    .calendarData p .labelValue {
        font-weight: 600;
        font-size: 12px;
    }

.dashwhite .dash_head h3 {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 10px;
}

.monthly_stats h3 {
    font: 500 18px/24px 'Roboto',sans-serif;
    margin: 0 0 20px;
}

.dashwhite .dash_head span.picon {
    width: 32px;
    height: 32px;
    line-height: 32px;
    background: rgba(254,203,3,0.25);
    border-radius: 8px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center
}

    .dashwhite .dash_head span.picon i {
        color: #fecb03;
        font-size: 20px;
    }

.dashwhite .dash_head .count {
    background: #FFE45B;
    color: #000;
    display: inline-block;
    line-height: 24px;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    padding: 0;
    margin-right: 25px;
    margin-left: 10px;
    padding: 0px 12px;
}

.dcount {
    background: #FFE45B;
    color: #000;
    display: inline-block;
    line-height: 24px;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    padding: 0;
    margin-right: 25px;
    margin-left: 10px;
    padding: 0px 12px;
}

.feedfilter.actiondrop .action_icon:after {
    content: "\e92e";
    position: absolute;
    right: 13px;
    top: 0px;
    font-family: feather !important;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
}

.feedfilter.actiondrop.open .action_icon:after {
    transform: rotate(270deg);
}

.feedfilter .action_icon {
    padding-right: 42px;
}

.dashwhite .dash_head:after {
    transform: inherit;
}

.dashbodylist li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
    /*.dashbodylist li:first-child {padding-left: 0;}
.dashbodylist li:last-child{margin-bottom: 0;}*/
    .dashbodylist li p {
        font-size: 14px;
        font-family: 'Roboto',sans-serif;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        margin-bottom: 12px;
        white-space: nowrap;
    }

.dashbodylist .count_data {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 15px;
}

.dashbodylist i.icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 32px;
    line-height: 32px;
    text-align: center;
}

    .dashbodylist i.icon img {
        width: 32px;
        height: auto;
    }

.dashbodylist .count {
    font-size: 18px !important;
    font-family: 'Roboto',sans-serif;
    color: #000;
}

.dashwhite.task span.picon, .dashwhite.task h3 .count {
    background: #6AF38B
}

    .dashwhite.task span.picon i {
        color: #40FFA3;
    }

.dashwhite.task .dashbodylist li {
    position: relative;
}

    .dashwhite.task .dashbodylist li i.icon {
        position: absolute;
        left: 0;
        top: 0;
    }
/*.dashwhite.task .dashbodylist .count_data{flex-wrap: wrap;}*/
.dashwhite.task .dashbodylist li {
    flex-wrap: inherit;
}

    .dashwhite.task .dashbodylist li p {
        margin-bottom: 5px;
    }

    .dashwhite.task .dashbodylist li .userdata {
        color: #9C9C9C;
        font-size: 12px;
        font-family: 'Roboto',sans-serif;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .dashwhite.task .dashbodylist li .para {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 10px;
        position: relative;
        margin-bottom: 5px;
        flex-wrap: wrap;
        row-gap: 8px;
    }

.dashwhite.task .icon {
    position: absolute;
    left: 6px;
    top: 0;
}

.result-circle-bg {
    fill: none;
    stroke: #eee;
    stroke-width: 3px;
}

.result-circle {
    fill: none;
    stroke-width: 3px;
    animation: progress 1s ease-out forwards;
}

.percentage-box {
    width: 40px;
    display: inline-block;
}

.result-percentage {
    font-size: 11px;
    text-anchor: middle;
}

.green-font i {
    font-size: 20px;
    color: #2CB34C;
}

.alert-font i {
    font-size: 20px;
    color: #FF380D;
}

.green .result-percentage {
    fill: #000;
}

.green .result-circular-chart .result-circle {
    stroke: #2CB34C;
}

.alertbeginner .result-percentage {
    fill: #FF8F27;
}

.alertbeginner .result-circular-chart .result-circle {
    stroke: #FF8F27;
}

.mediumbeginner .result-percentage {
    fill: #F44336;
}

.mediumbeginner .result-circular-chart .result-circle {
    stroke: #F44336;
}

.data_label {
    font-size: 12px;
    font-family: 'Roboto',sans-serif;
    font-weight: 400;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
    padding: 5px 10px;
    border-radius: 4px;
}

.highbg {
    background: rgba(227, 53, 30, 0.10);
    color: #E3351E;
}

.lowbg {
    background: rgba(9, 190, 243, 0.10);
    color: #09BEF3;
}

    .lowbg i {
        transform: rotate(60deg);
        margin-top: -2px;
    }

.leavesdata li {
    display: inline-block;
    background: #fff;
    border-radius: 5px;
    margin: 15px 0px 0px 15px;
}

    .leavesdata li span {
        display: block;
        text-align: left;
        font: 400 14px/20px 'Roboto',sans-serif;
        color: #000;
        position: relative;
        padding: 8px 10px;
        border-radius: 100px 0px 0px 100px;
    }
    /*.leavesdata li span:first-child:after{content: "";position: absolute;top: 5px;left: 0px;width: 10px;height: 10px;border-radius: 50%;background: #eee;}*/
    /*.leavesdata li span:last-child:after{content: "";position: absolute;top: 0;left: 0;width: 1px;height: 100%;background: #eee;}*/
    .leavesdata li.paid {
        border: 1px solid #FF99C8;
    }
    /*.leavesdata li.paid span:first-child:after,.leavesdata li.paid span:last-child:after{background: #FF99C8;}*/
    .leavesdata li.earning {
        border: 1px solid #FDF28F;
    }

        .leavesdata li.earning span:first-child:after, .leavesdata li.earning span:last-child:after {
            background: #FDF28F;
        }

    .leavesdata li.normal {
        border: 1px solid #ADF8CA;
    }

        .leavesdata li.normal span:first-child:after, .leavesdata li.normal span:last-child:after {
            background: #ADF8CA;
        }

    .leavesdata li.compoff {
        border: 1px solid #A9DEF9;
    }

        .leavesdata li.compoff span:first-child:after, .leavesdata li.compoff span:last-child:after {
            background: #A9DEF9;
        }

    .leavesdata li.typea {
        border: 1px solid #E4C1F9;
        margin-bottom: 15px;
    }

        .leavesdata li.typea span:first-child:after, .leavesdata li.typea span:last-child:after {
            background: #E4C1F9;
        }

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

.dashwhite.leaves .dash_head:after {
    top: 8px;
}

.leavebutton {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background: #0A3B7E;
    color: #fff;
    font: 400 14px/20px 'Roboto',sans-serif;
    margin-bottom: 8px;
    margin-top: 5px;
}

    .leavebutton:hover {
        color: #fff;
        background: #092750;
    }

.leavesdata li.paid:nth-child(1) {
    border-color: #FF99C8;
    background: #FFEAF4
}

    .leavesdata li.paid:nth-child(1) .leavedatain {
        background: #FF99C8;
    }

.leavesdata li.paid:nth-child(2) {
    border-color: #FDF28F;
    background: #FFFDE9
}

    .leavesdata li.paid:nth-child(2) .leavedatain {
        background: #FDF28F;
    }

.leavesdata li.paid:nth-child(3) {
    border-color: #A9DEF9;
    background: #E8F7FF
}

    .leavesdata li.paid:nth-child(3) .leavedatain {
        background: #A9DEF9;
    }

.leavesdata li.paid:nth-child(4) {
    border-color: #E4C1F9;
    background: #F7E9FF
}

    .leavesdata li.paid:nth-child(4) .leavedatain {
        background: #E4C1F9;
    }

.leavesdata li.paid:nth-child(5) {
    border-color: #FF99C8;
    background: #FFEAF4
}

    .leavesdata li.paid:nth-child(5) .leavedatain {
        background: #FF99C8;
    }

.leavesdata li.paid:nth-child(6) {
    border-color: #FDF28F;
    background: #FFFDE9
}

    .leavesdata li.paid:nth-child(6) .leavedatain {
        background: #FDF28F;
    }

.leavesdata li.paid:nth-child(7) {
    border-color: #A9DEF9;
    background: #E8F7FF
}

    .leavesdata li.paid:nth-child(7) .leavedatain {
        background: #A9DEF9;
    }

.leavesdata li.paid:nth-child(8) {
    border-color: #E4C1F9;
    background: #F7E9FF
}

    .leavesdata li.paid:nth-child(8) .leavedatain {
        background: #E4C1F9;
    }

.birthday li {
    padding-left: 60px;
    position: relative;
}

.birthday .icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(188,186,186,0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
}

.birthday .gflexevent {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 5px;
}

    .birthday .gflexevent span {
        font: 400 12px/18px 'Roboto',sans-serif;
        color: #666;
    }

    .birthday .gflexevent a {
        color: rgba(15, 79, 146, 1);
        font: 400 12px/18px 'Roboto',sans-serif;
        text-decoration: underline !important;
        transition: all 500ms ease;
    }

        .birthday .gflexevent a:hover {
            text-decoration: none !important;
            transition: all 500ms ease;
        }

.birthday li {
    margin-bottom: 15px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}

    .birthday li p {
        font: 500 14px/20px 'Roboto',sans-serif;
        margin: 5px 0 5px;
        text-transform: capitalize;
    }

.birthday .userdata, .upcoming li .flex {
    color: #9C9C9C;
    font-size: 12px;
    font-family: 'Roboto',sans-serif;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
    position: relative;
}

    .birthday .userdata span, .upcoming li .flex span {
        position: relative;
    }

        .birthday .userdata span:last-child:after, .upcoming li .flex span:last-child:after {
            content: "";
            position: absolute;
            top: 0;
            left: -10px;
            width: 1px;
            height: 100%;
            background: #9C9C9C;
        }

.birthday .owl-dots {
    text-align: center;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

    .birthday .owl-dots button {
        display: inline-block;
        width: 8px;
        height: 8px;
        background: #d9d9d9 !important;
        border-radius: 50%;
        margin: 0 5px;
    }

        .birthday .owl-dots button.active {
            width: 25px;
            border-radius: 10px;
        }

.leaves.padded .birthday li {
    padding-bottom: 15px;
    margin-bottom: 15px;
}

    .leaves.padded .birthday li:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 5px;
    }

.apyleave {
    position: absolute;
    right: 40px;
    top: 9px;
    background: #E9F2FF;
    border: 1px solid #0A3B7E;
    padding: 5px 9px;
    border-radius: 8px;
    color: #0A3B7E;
}

.upcoming h4 {
    font: 400 14px/20px 'Roboto',sans-serif;
    color: #777;
    margin: 0;
    text-transform: capitalize;
}

.upcoming li {
    position: relative;
    padding-left: 45px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 20px;
    min-height: 35px;
    margin: 10px 0 0;
}

.upcoming .profile_pic {
    position: absolute;
    left: 0;
    top: 0;
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
}

    .upcoming .profile_pic img {
        width: 100%;
        height: auto;
    }

.upcoming li p {
    font: 400 14px/20px 'Roboto',sans-serif;
    color: #555;
    margin-bottom: 0;
    max-width: 92px;
}

.mypending ul.dropinner {
    padding: 0;
    max-height: 280px;
    overflow-y: auto;
}

    .mypending ul.dropinner a {
        display: flex !important;
        padding: 10px 10px 10px 15px !important;
        column-gap: 10px;
        width: 100%;
        justify-content: space-between;
    }

.upcoming li .flex {
    column-gap: 15px;
}

    .upcoming li .flex span:last-child:after {
        left: -8px;
    }

.upcoming.no-expend {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 5px;
}

    .upcoming.no-expend ul {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

        .upcoming.no-expend ul li {
            margin: 0 -5px 0 0;
            padding: 0;
            width: 30px;
        }

    .upcoming.no-expend li p, .upcoming.no-expend li .flex {
        display: none !important;
    }

    .upcoming.no-expend .profile_pic {
        border: 2px solid #fff;
    }

.leaves.padded .upcoming {
    border-top: 1px solid rgba(0,0,0,0.2);
    padding-top: 15px;
    margin-top: 15px;
}

.doku .dash_head:after {
    display: none;
}

.doku ul li {
    padding-left: 60px;
    position: relative;
    margin: 8px 0;
}

    .doku ul li .flex {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 5px;
        font: 500 14px/20px 'Roboto',sans-serif;
        color: #000;
        margin-bottom: 3px;
    }

    .doku ul li p {
        font: 400 14px/20px 'Roboto',sans-serif;
        color: #666;
        margin-bottom: 0;
    }

    .doku ul li .icon {
        width: 40px;
        height: 40px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        left: 0;
    }

        .doku ul li .icon i {
            font-size: 24px;
        }

.dolightskyblue .icon {
    background: rgba(33, 150, 243, 0.2);
    color: rgba(33, 150, 243, 1);
}

.dolightpink .icon {
    background: rgba(237, 20, 91, 0.2);
    color: rgba(237, 20, 91, 1);
}

.dolightorange .icon {
    background: rgba(255, 113, 33, 0.2);
    color: rgba(255, 113, 33, 1);
}

.dolightpurple .icon {
    background: rgba(212, 39, 255, 0.2);
    color: rgba(212, 39, 255, 1);
}
/*body .scroll-table{height: calc(100vh - 180px) !important;}*/
.scroll-table > .scroll-element.scroll-y, .scroll-tablex > .scroll-element.scroll-y {
    right: 5px;
}

ul.nav.nav-tabs li a, ul.nav.nav-tabs li.active a {
    background: transparent !important;
}

.openinglist {
    background: var(--whitebgcolor);
    border: none;
    border-radius: 4px;
    margin-bottom: 2px;
    position: relative;
    padding: 15px;
}

    .openinglist .dash_head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
    }

        .openinglist .dash_head h3 {
            font: 500 18px/24px 'Roboto',sans-serif;
            margin: 0;
        }

        .openinglist .dash_head a {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            column-gap: 5px;
            font: 400 14px/20px 'Roboto',sans-serif;
            color: rgba(0,0,0,0.5);
        }

            .openinglist .dash_head a:hover {
                color: #0a3b7e;
            }

.openinglistData .listhead, .openinglistData .listhead > div, .openinglistData .listbody {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 20px;
}

    .openinglistData .listhead > div > span {
        position: relative;
    }

        .openinglistData .listhead > div > span:after {
            content: "";
            position: absolute;
            left: -10px;
            top: 50%;
            transform: translateY(-50%);
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: #D9D9D9;
        }

    .openinglistData .listhead p {
        font: 500 16px/20px 'Roboto',sans-serif;
        margin: 0 0 15px;
        color: #181818;
    }

.openinglistData .gicon {
    font-size: 18px;
    color: #8C8C8C;
}

    .openinglistData .gicon:hover {
        color: #0a3b7e;
    }

.openinglistData {
    background: var(--whitebgcolor);
    border: 1px solid #dbdfea;
    border-radius: 4px;
    margin-bottom: 10px;
    position: relative;
    padding: 15px;
}

.listbody ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 15px;
    flex-wrap: wrap;
    margin: 0;
}

.listbody li {
    background: rgba(15, 79, 146, 0.10);
    border-radius: 20px;
    color: var(--headingcolor);
    font-family: 'Roboto',sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    display: inline-block;
    padding: 8px 15px 8px 15px;
}

    .listbody li.more {
        cursor: pointer;
    }

.shimmerloader .flex {
    column-gap: 15px;
}

.shimmerBG {
    animation-duration: 2.2s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: #ddd;
    background: linear-gradient(to right, #F6F6F6 8%, #F0F0F0 18%, #F6F6F6 33%);
    background-size: 1200px 100%;
}

.title-line {
    width: 300px;
    height: 24px;
    margin-bottom: 12px;
    border-radius: 20px;
}

.shimmerBG.list-data {
    width: 80px;
    height: 24px;
    border-radius: 20px;
}

.shimmerBG.sharebg {
    width: 24px;
    height: 24px;
    border-radius: 5px;
    margin: 0 0 0 auto;
}

.content-line {
    width: 100%;
    height: 8px;
    margin-bottom: 16px;
    border-radius: 8px;
}

.end {
    width: 40%;
}

@-webkit-keyframes shimmer {
    0% {
        background-position: -100% 0;
    }

    100% {
        background-position: 100% 0;
    }
}

@keyframes shimmer {
    0% {
        background-position: -1200px 0;
    }

    100% {
        background-position: 1200px 0;
    }
}

.shimmerloaderdiv {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 3;
    background: #fff;
}

.posloaderData {
    position: relative;
}

.nav.nav-tabs li a .count {
    display: inline-block;
    height: 24px;
    background: #FF9432;
    color: #fff;
    border-radius: 15px;
    font: 400 12px/24px 'Roboto',sans-serif;
    text-align: center;
    padding: 0px 12px;
}

.recent_body {
    background: var(--whitebgcolor); /*border: 1px solid #dbdfea;*/
    border-radius: 4px;
    position: relative;
    padding: 15px 0px 15px 70px;
}

    .recent_body .icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        line-height: 40px;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left: 15px;
        top: 15px;
    }

.planleave .recent_body .icon {
    background: #97EEAC;
}

.recent_body .postby {
    font: 400 12px 'Roboto',sans-serif;
    align-items: center;
    color: #777;
    margin-bottom: 5px;
    display: block !important;
}

    .recent_body .postby span {
        position: relative;
        padding-right: 15px;
        padding-bottom: 0px;
        display: inline-block;
        vertical-align: text-top;
    }

    /*.recent_body .postby span:after {
            content: "";
            position: absolute;
            top: 5px;
            left: -10px;
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #d9d9d9;
        }*/
    .recent_body .postby span {
        margin-bottom: 5px;
    }

        .recent_body .postby span:first-child:after {
            display: none;
        }

    .recent_body .postby .recent {
        font: 400 12px 'Roboto',sans-serif;
        color: #1B9A3A;
        text-transform: capitalize;
    }

.recent_body .attnd {
    font: 500 14px 'Roboto',sans-serif;
    color: #555;
}

.recent_body.praise {
    padding-left: 95px;
}

    .recent_body.praise .icon {
        background: transparent;
        width: 64px;
        height: 64px;
    }

        .recent_body.praise .icon img {
            width: 100%;
            height: auto;
        }

    .recent_body.praise .recent {
        color: #B6957B;
    }

    .recent_body.praise p {
        margin-bottom: 0;
        font: 400 12px/18px 'Roboto',sans-serif;
        color: #555;
    }

    .recent_body.praise .list_icon {
        position: absolute;
        right: 15px;
        top: 10px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        column-gap: 15px;
    }

        .recent_body.praise .list_icon li a {
            color: rgba(0,0,0,0.25);
            font-size: 18px;
        }

            .recent_body.praise .list_icon li a:hover {
                color: #0A3B7E;
            }

.event_body {
    background: var(--whitebgcolor); /*border: 1px solid #dbdfea;*/
    border-radius: 4px;
    margin-bottom: 10px;
    position: relative;
    padding: 15px;
}

    .event_body .eventIcon {
        width: 180px;
        height: 180px;
        border: 1px solid rgba(0,0,0,0.1);
        border-radius: 50%;
        display: inline-block;
    }

.eventinfo p {
    color: rgba(38, 50, 56, 0.65);
    font-family: 'Roboto',sans-serif;
    font-size: 12px;
    line-height: 18px;
}

.eventinfo {
    width: 100%;
}

.innericon {
    position: absolute;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    padding: 0;
}

    .innericon.blue {
        background: #1162FF;
    }

.event_body {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 30px;
}

    .event_body .messagehead {
        font-weight: 500;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 15px;
        margin-bottom: 10px;
        background-image: linear-gradient(to right, #E3351E 0%, rgba(213, 117, 48, 1.00) 16.67%, rgba(201, 204, 45, 0.99) 33.33%, rgba(41, 195, 75, 0.99) 50%, rgba(37, 130, 182, 0.99) 66.67%, rgba(37, 34, 190, 0.98) 83.33%, rgba(164, 30, 227, 0.98) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-size: 400% 400%;
        animation: gradient 10s ease infinite;
    }

    .event_body .messagename {
        font-weight: 500;
        font-size: 14px;
    }

    .event_body ul {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 20px;
    }

        .event_body ul li {
            color: rgba(38, 50, 56, 0.65);
            font-family: 'Roboto',sans-serif;
            font-size: 12px;
            line-height: 14px;
            position: relative;
        }

            .event_body ul li:first-child:after {
                content: "";
                position: absolute;
                right: -12px;
                top: 0;
                width: 1px;
                height: 100%;
                background: rgba(38, 50, 56, 0.65);
            }

.eventcircle {
    width: 140px;
    height: 140px;
    position: relative;
    min-width: 140px;
    min-height: 140px;
}

.big-circle {
    height: 100%;
    width: 100%;
    position: relative;
    border: 1px solid #D9D9D9;
    border-radius: 50%;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    animation: Rotate 20s linear infinite;
    -webkit-animation: Rotate 20s linear infinite;
}

.icon-block {
    width: 8px;
    height: 8px;
    position: absolute;
    border-radius: 50%;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    background-image: linear-gradient(180deg, #4967e6 0%, #627bf4 100%);
    -webkit-background-image: linear-gradient(180deg, #4967e6 0%, #627bf4 100%);
}

    .icon-block:first-child {
        top: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        background: #1162FF;
    }

    .icon-block:nth-child(2) {
        top: 50%;
        right: 0;
        transform: translate(50%, -50%);
        -webkit-transform: translate(50%, -50%);
        background: #FECB03;
    }

    .icon-block:nth-child(3) {
        bottom: 0;
        left: 50%;
        transform: translate(-50%, 50%);
        -webkit-transform: translate(-50%, 50%);
        background: #ED145B;
    }

    .icon-block:nth-child(4) {
        top: 50%;
        left: 0;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        background: #29C34B;
    }

.circle {
    animation: Rotate-reverse 20s linear infinite;
    -webkit-animation: Rotate-reverse 20s linear infinite;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    width: 75%;
    height: 75%;
    border: 1px solid #D9D9D9;
    border-radius: 50%;
}

.midiconcircle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    width: 55%;
    height: 55%;
    border-radius: 50%;
    background: rgba(217, 217, 217, 0.20);
}

.circle .icon-block img {
    animation: img-rotate 20s linear infinite;
    -webkit-animation: img-rotate 20s linear infinite;
}

.center-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

    .center-logo img {
        max-width: 200px;
    }

.announcement {
    border-radius: 4px;
    background: rgba(0, 113, 255, 0.10);
    padding: 20px;
    margin-bottom: 2px;
    border: 1px solid #A8CEFE;
}

    .announcement .author {
        float: right;
        width: 150px;
        padding-left: 0;
        text-align: right;
    }

        .announcement .author span {
            color: #757fef;
            font-family: 'Roboto',sans-serif;
            font-size: 12px;
            font-weight: 400;
            position: relative;
        }

            .announcement .author span:first-child:after {
                content: "";
                position: absolute;
                top: 4px;
                right: auto;
                width: 4px;
                height: 4px;
                background: #757fef;
                border-radius: 50%;
                left: -10px;
            }

    .announcement p {
        font-family: 'Roboto',sans-serif;
        font-size: 12px;
        font-weight: 400;
        color: #757fef;
        margin-bottom: 0;
    }

.annoucedata p img {
    width: 60px;
    height: auto;
    float: left;
    margin-right: 15px;
    border-radius: 5px;
    border: 2px solid #0071ff;
}

.announcement li {
    position: relative;
    padding-left: 60px;
}

.announcement .icon {
    width: 24px;
    height: 24px;
    line-height: 24px;
    border-radius: 50%;
    background: rgba(255,255,255,0.40);
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .announcement .icon img {
        width: 80%;
    }

.announcement .owl-dots {
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

    .announcement .owl-dots button {
        display: inline-block;
        width: 6px;
        height: 6px;
        background: rgba(0, 113, 255, 0.40);
        border-radius: 50%;
        margin: 0 5px;
    }

        .announcement .owl-dots button.active {
            background: rgba(0, 113, 255, 1);
        }

.newfeedbox .announcement {
    margin-bottom: 20px;
    margin-top: 10px;
    min-height: 80px;
}

    .newfeedbox .announcement .icon {
        width: 40px;
        height: 40px;
        line-height: 40px;
    }

        .newfeedbox .announcement .icon img {
            width: 100%;
        }

.certificate_body {
    border-radius: 4px;
    border-left: 5px solid #FFC300;
    background: #FFF8E0;
    padding: 0;
    margin-bottom: 10px;
}

    .certificate_body .item {
        position: relative;
        padding: 20px 20px 20px 70px;
    }

    .certificate_body .recent {
        color: #FFC300 !important;
    }

    .certificate_body.recent_body .postby {
        color: #1D1C1C;
    }

        .certificate_body.recent_body .postby span:after {
            background: #1D1C1C;
        }

    .certificate_body.recent_body p {
        margin-bottom: 0;
    }

    .certificate_body.recent_body a {
        color: #898888;
        font-family: 'Roboto',sans-serif;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        text-decoration: underline !important;
    }

        .certificate_body.recent_body a:hover {
            color: #000;
            text-decoration: none !important;
        }

    .certificate_body.recent_body .bellicon {
        position: absolute;
        left: 15px;
        top: 25px;
        font-size: 40px;
        color: #ffd23e;
    }

    .certificate_body .owl-dots {
        text-align: center;
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
    }

        .certificate_body .owl-dots button {
            display: inline-block;
            width: 6px;
            height: 6px;
            background: rgba(29, 28, 28, 0.40);
            border-radius: 50%;
            margin: 0 5px;
        }

            .certificate_body .owl-dots button.active {
                background: #FFC300;
            }
/*.monthborder{margin-bottom: 30px;border-bottom: 1px solid #ddd;}*/
.attend:after {
    display: none;
}

@keyframes Rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes Rotate {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes Rotate-reverse {
    from {
        transform: translate(-50%, -50%) rotate(360deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(0deg);
    }
}

@-webkit-keyframes Rotate-reverse {
    from {
        -webkit-transform: translate(-50%, -50%) rotate(360deg);
    }

    to {
        -webkit-transform: translate(-50%, -50%) rotate(0deg);
    }
}

@keyframes circle-rotate {
    from {
        transform: translate(-50%, -50%) rotate(45deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(405deg);
    }
}

@-webkit-keyframes circle-rotate {
    from {
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
    }

    to {
        -webkit-transform: translate(-50%, -50%) rotate(405deg);
    }
}

@keyframes img-rotate {
    from {
        transform: rotate(-45deg);
    }

    to {
        transform: rotate(-405deg);
    }
}

@-webkit-keyframes img-rotate {
    from {
        -webkit-transform: rotate(-45deg);
    }

    to {
        -webkit-transform: rotate(-405deg);
    }
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.gtablink {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0;
    justify-content: flex-start;
    column-gap: 20px;
}

    .gtablink a {
        position: relative;
        display: block;
        font: 500 16px 'Roboto',sans-serif;
    }

        .gtablink a:after {
            content: "";
            position: absolute;
            bottom: -19px;
            left: 0;
            width: 100%;
            height: 2px;
            background: #0F4F92;
            opacity: 0;
            transition: all 500ms ease;
        }

        .gtablink a:hover {
            color: #888;
        }

            .gtablink a:hover:after {
                background: #888;
                transition: all 500ms ease;
            }

            .gtablink a:hover:after, .gtablink a.active:after {
                opacity: 1;
                transition: all 500ms ease;
            }

.body .footerWrapper {
    padding: 8px 0 8px 60px;
}
/*---------- Team Dashboard -----------*/
.dashpoll {
    background: #fff;
    border-radius: 4px;
    padding: 15px;
}

    .dashpoll h3 {
        color: #333333;
        font: 500 18px/24px 'Roboto';
        margin: 0px;
    }

.dashpoll-inner {
    margin-top: 5px;
    background: #fff;
    padding: 15px;
    border-radius: 4px;
    display: flex;
    column-gap: 15px;
}

.dashpoll-left {
    width: 100px;
}

    .dashpoll-left img {
        width: 100%;
    }

    .dashpoll-left img {
        width: 100%;
        border-radius: 50px;
        border: 1px solid #eaeaea;
    }

.dashpoll-right input {
    width: 100%;
    background: #F2F2F2;
    border: 0px;
    height: 45px;
    border-radius: 50px;
    color: #777777;
    padding: 15px;
}

    .dashpoll-right input::placeholder {
        font: 400 15px/24px 'Roboto';
        color: #777777
    }

.dashpoll-right {
    width: 100%;
}

    .dashpoll-right ul {
        display: flex;
        flex-wrap: wrap;
        column-gap: 15px;
        margin-top: 15px;
        justify-content: space-between;
    }

        .dashpoll-right ul li a {
            color: #2e2e2e;
            font-size: 14px;
        }

            .dashpoll-right ul li a img {
                width: 18px;
                margin-right: 3px;
            }

.attendancetrend {
    background: #fff;
    padding: 0px 15px;
    margin-top: 15px;
}

    .attendancetrend h3 {
        color: #333333;
        font: 500 18px/24px 'Roboto';
        margin-top: 0px;
        margin-bottom: 15px;
    }

div#attendancetrend g.highcharts-legend {
    display: none;
}

.myteamd.dashwhite.task .dashbodylist li {
    padding-left: 0;
}

    .myteamd.dashwhite.task .dashbodylist li .para {
        width: 100%;
        justify-content: space-between;
    }

.myteambox {
    display: flex;
    column-gap: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 7px 10px;
    border-radius: 5px;
    align-items: center;
    margin: 5px 10px;
}

.myteamimg {
    width: 40px;
    height: 40px;
    object-fit: cover;
    position: relative;
}

    .myteamimg img {
        width: 100%;
        border-radius: 50px;
        border: 1px solid#eaeaea;
        background: #fff;
    }

.myteamname h3 {
    font-size: 15px;
    margin: 0px;
}

.myteamname p {
    color: #666666;
    font-size: 11px;
    margin-bottom: 0px;
}

.myteam-status {
    margin-top: 5px;
    padding-bottom: 10px;
}

.taskdrop li {
    border-bottom: 1px solid #eaeaea;
    padding: 10px 0px;
}

.mypending .p-requests {
    margin-bottom: 20px;
}

.empactionlist {
    display: flex;
    column-gap: 10px;
    padding: 0px !important;
}

    .empactionlist li {
        width: 100%;
    }
/*.mypending .p-requests:last-child {padding-right: 0;}*/
.taskdrop .para p {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    max-width: 200px;
}

.taskdrop {
    max-height: 400px;
    overflow-y: auto;
    padding-right: 5px;
}

.teamstatus {
    margin-left: auto;
}

    .teamstatus label {
        border-radius: 5px;
        padding: 5px 9px;
        font-size: 11px;
    }

.statusavaille label {
    background: #DAFFE2;
    color: #2CB34C;
}

.statusleave label {
    background: #FFE3DF;
    color: #F47A36;
}

.statusUnava label {
    background: #E9E9E9;
    color: #585858;
}

.myteamimg:before {
    content: "";
    height: 10px;
    width: 10px;
    position: absolute;
    border-radius: 50px;
    bottom: 4px;
    right: 2px;
}

.statusavaille .myteamimg:before {
    background: #16F44B;
}

.statusleave .myteamimg:before {
    background: #F47A36;
}

.statusUnava .myteamimg:before {
    background: #E9E9E9;
}

.asidePanel, .sidebar {
    background: #fff
}

body {
    background: #f5f6fa !important
}

.sidebar {
    width: 240px;
    height: 100%;
    position: fixed;
    z-index: 10;
    overflow-x: hidden;
    transition: .2s;
    color: #fff;
    left: 60px;
    top: 65px;
    font-family: Roboto,sans-serif;
    border-right: 1px solid #e5e9f2;
    overflow-y: hidden
}

.main, body.menuClose .main {
    transition: margin-left .5s
}

.openbtn, .openbtn:hover, .openbtn:visited {
    color: #005ca1
}

.sidebar .panel {
    box-shadow: none;
    padding: 0 10px 0 0;
    border: none !important;
}

.panel-body.asidePanel {
    border-top: none !important;
}

.ssmPanel {
    border-bottom: none
}

.asideBorder a.ssmPanel {
    font-family: Roboto,sans-serif;
    color: #000
}

.sidebar .panel-default > .panel-heading {
    background: 0 0 !important;
    border-bottom: none !important;
    padding: 5px 10px 5px 15px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

    .sidebar .panel-default > .panel-heading.collapsed i {
        transform: rotate(-90deg)
    }

    .sidebar .panel-default > .panel-heading .panelheadingtxt {
        text-transform: uppercase;
        font: 500 13px Roboto,sans-serif;
        color: #022f5f;
        position: relative
    }

.sidebar .panelBtnsRight i {
    color: #022f5f
}

.sidebar .panel-default > .panel-heading.collapsed .panelBtnsRight i, .sidebar .panel-default > .panel-heading.collapsed .panelheadingtxt {
    color: #526484
}

.sidebar .panel-default > .panel-heading .panelheadingtxt i.firsticon {
    font-size: 14px;
    position: absolute;
    left: 0;
    top: 0;
    transform: inherit !important;
    display: none
}

.sidebar .panel ul {
    margin: 0 0 0 10px;
    border-left: 1px solid #00aefa;
    padding: 0 0 0 5px;
    border-radius: 0
}

.left-menu {
    background: #0f4f92 !important
}

a.openSidepanel {
    cursor: pointer;
    display: none
}

    a .openSidepanel img {
        filter: none !important;
        width: 35%
    }

a.closeSidepanel {
    cursor: pointer;
    padding: 8px 15px;
    display: block;
    text-align: right
}

.sideBarss {
    position: absolute;
    right: 10px;
    top: 0
}

body a ul.left-menu {
    padding: 5px 0 0 !important
}

body.menuClose a.openSidepanel {
    display: block
}

body.menuClose .sidebar {
    width: 0
}

body.menuClose .sideCollpased {
    width: calc(100% - 15px)
}

body.menuClose .main {
    padding: 0 0 0 59px
}

.left-menu li, .sideBarss .openbtn {
    position: relative;
}

    .left-menu li.active a img {
        filter: invert(51%) sepia(80%) saturate(1549%) hue-rotate(164deg) brightness(98%) contrast(100%)
    }

.sideCollpased {
    width: calc(100% - 5px);
    padding: 0 10px
}

.left-menu a {
    padding: 10px 8px;
    text-align: center
}

    .left-menu a figure {
        width: 24px;
        height: 24px;
        display: inline-block
    }

.left-menu .active {
    background: 0 0
}

    .left-menu .active img {
        filter: none;
        transform: inherit !important
    }

.openbtn {
    font-size: 20px;
    cursor: pointer;
    border: none;
    left: 0;
    display: inline-block;
    position: absolute;
    right: 0;
    top: 5px
}

.btnSideBox {
    float: left
}

.main {
    padding: 0 0 0 300px
}

.open-box {
    display: none
}

.btnSideBox span {
    display: block;
    transform: rotate(90deg);
    font-size: 14px;
    font-weight: 600;
    margin-top: 8px
}

.panel .panel-body {
    background: #fff !important;
}

.panel-default > .panel-heading {
    color: #0f4f92 !important;
    font-weight: 500 !important;
    font-size: 14px !important;
}

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

.btn.btn-primary,
.btn.blue {
    display: flex !important;
    align-items: center;
    column-gap: 5px;
}

    .btn.btn-primary i {
        display: block !important;
    }

.client-list-action {
    display: flex;
    margin-bottom: 0 !important;
}

.client-action-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.client-list-action input {
    margin-right: 6px;
}

.activity-sheet {
    display: flex;
    align-items: center;
    column-gap: 5px;
    justify-content: flex-end;
}

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

.w-300 {
    width: 300px !important;
}

@media (max-width:1199px) {
    .sideBarss, .sidebar {
        display: none
    }

    .main {
        padding: 0 0 0 58px
    }

    .sideCollpased {
        width: calc(100% - 0px)
    }

    .main {
        transition: margin-left .5s;
        margin-left: 0 !important
    }
}

.left-menu li.active:after {
    content: "";
    position: absolute;
    top: 12px;
    right: -2px;
    border: 10px solid transparent;
    border-left-color: #fff;
    transform: rotate(180deg)
}
/*new-dashboard -- Monthly Stats*/
.normalbg {
    background: rgba(227, 184, 30, 0.10);
    color: #fde400;
}

.leaveperfomancelist .list-time {
    font-weight: 500;
}

.leaveperfomancelist {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

    .leaveperfomancelist li {
        width: 50%;
        column-gap: 6px;
        padding: 10px 0px;
        font-size: 11px;
    }

        .leaveperfomancelist li i {
            font-size: 10px;
            border-radius: 50px;
            padding: 1px;
            color: #fff;
        }

    .leaveperfomancelist .list-yellow i {
        background: #9d9700;
    }

    .leaveperfomancelist .list-yellow .list-time {
        color: #9d9700;
    }

    .leaveperfomancelist .list-red i {
        background: #df5753;
    }

    .leaveperfomancelist .list-red .list-time {
        color: #df5753;
    }

    .leaveperfomancelist .list-lightgreen i {
        background: #00b22a;
    }

    .leaveperfomancelist .list-lightgreen .list-time {
        color: #00b22a;
    }

    .leaveperfomancelist .list-pink i {
        background: #7d2376;
    }

    .leaveperfomancelist .list-pink .list-time {
        color: #7d2376;
    }

    .leaveperfomancelist .list-purple i {
        background: #d427ff;
    }

    .leaveperfomancelist .list-purple .list-time {
        color: #d427ff;
    }

    .leaveperfomancelist .list-orange i {
        background: #006027;
    }

    .leaveperfomancelist .list-orange .list-time {
        color: #006027;
    }

    .leaveperfomancelist .list-ot-color i {
        background: #8d8d8d;
    }

    .leaveperfomancelist .list-ot-color .list-time {
        color: #8d8d8d;
    }

    .leaveperfomancelist .list-redgreen i {
        background: #ff0000;
    }

    .leaveperfomancelist .list-redgreen .list-time {
        color: #ff0000;
    }

    .leaveperfomancelist .list-item-dark i {
        background: #000;
    }

    .leaveperfomancelist .list-item-dark .list-time {
        color: #000;
    }

    .leaveperfomancelist .list-skyblue i {
        background: #23badf;
    }

    .leaveperfomancelist .list-skyblue .list-time {
        color: #23badf;
    }

    .leaveperfomancelist .list-lighblack i {
        background: #a8a8a8;
    }

    .leaveperfomancelist .list-lighblack .list-time {
        color: #a8a8a8;
    }

    .leaveperfomancelist .list-green i {
        background: green;
    }

    .leaveperfomancelist .list-green .list-time {
        color: green;
    }

.importlinks ul li:nth-child(4n+1) .icon {
    background: rgba(33, 150, 243, 0.2);
    color: rgba(33, 150, 243, 1);
}

.importlinks ul li:nth-child(4n+2) .icon {
    background: rgba(237, 20, 91, 0.2);
    color: rgba(237, 20, 91, 1);
}

.importlinks ul li:nth-child(4n+3) .icon {
    background: rgba(255, 113, 33, 0.2);
    color: rgba(255, 113, 33, 1);
}

.importlinks ul li:nth-child(4n+4) .icon {
    background: rgba(212, 39, 255, 0.2);
    color: rgba(212, 39, 255, 1);
}

.importlinks ul li {
    padding-left: 0;
    border-bottom: 1px solid #eee;
    padding-bottom: 6px;
}

    .importlinks ul li:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .importlinks ul li .icon {
        position: relative;
        margin-right: 14px;
    }

.newjoin_body .recent_body .icon {
    background: rgba(255, 113, 33, 0.2);
    color: rgba(255, 113, 33, 1);
}

    .newjoin_body .recent_body .icon i {
        font-size: 20px;
        padding-left: 4px;
    }

.newjoin_body .recent_body .postby .recent {
    color: rgba(255, 113, 33, 1)
}

.Joineedropdown {
    position: absolute;
    top: 10px;
    right: 50px;
}

.newjoin_body .recent_body .fa-female {
    background: rgba(237, 20, 91, 0.2);
    color: rgba(237, 20, 91, 1);
}

.dashwhite .dash_head.newjoinuper span.picon {
    background: rgba(255, 113, 33, 0.2);
    color: rgba(255, 113, 33, 1);
}

    .dashwhite .dash_head.newjoinuper span.picon i {
        color: #ff7121;
    }

.dropinner span.count {
    background: #FFE45B;
    padding: 5px;
    border-radius: 8px;
    display: flex;
    width: auto;
    height: 24px;
    justify-content: center;
    align-items: center;
    font-size: 10px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dropinner {
    padding: 10px 14px;
    box-shadow: 0px 37px 66px -55px rgba(0,0,0,0.75);
}

    .dropinner li {
        column-gap: 15px;
    }

    .dropinner span {
        color: #666;
    }

body .p-requests .gaction_list {
    top: 76px;
}

.performance_list {
    padding: 10px;
}

.timeMask.form-control.clsHHMM {
    max-height: 36px;
}

.collapsebtn {
    width: 100%;
    text-align: left;
    color: #0f4f92;
    font-size: 14px;
    padding-right: 20px;
}

    .collapsebtn::before {
        content: "\f056";
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        position: absolute;
        right: 15px;
        font-size: 22px;
    }

    .collapsebtn.collapsed::before {
        content: "\f055";
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        position: absolute;
        right: 15px;
        font-size: 22px;
    }

.popover {
    z-index: 15 !important;
}

.record_filter {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 15px;
}

    .record_filter .show_record {
        position: relative;
        padding-top: 5px;
        border-radius: 4px;
        padding: 0 8px 0 5px;
    }

        .record_filter .show_record span {
            font-size: 14px;
            display: inline-block;
            font-weight: 500;
        }

        .record_filter .show_record select {
            border: 1px solid #dadada;
            height: 32px !important;
            -moz-appearance: none !important;
            -webkit-appearance: none !important;
            appearance: none !important;
            box-shadow: none !important;
            padding: 8px !important;
            padding-right: 25px !important;
            background-image: url(../../Images/menu_icon/arrow-bottom.svg);
            background-repeat: no-repeat;
            background-position: center right 9px;
            background-size: 12px;
            line-height: 15px !important;
        }

    .record_filter a.skyblue {
        background: #e6f8fe;
        border-color: var(--skyblue);
        min-width: inherit;
        width: 40px;
        height: 40px;
        line-height: 40px;
        box-shadow: none;
        margin: 0;
        border-radius: 4px;
        padding: 0 !important;
        text-align: center;
    }

    .record_filter .action {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        column-gap: 15px;
    }

    .record_filter a.skyblue i {
        color: var(--skyblue);
        padding: 0;
        margin: 0;
    }

    .record_filter a.skyblue:hover {
        background: var(--skyblue);
    }

        .record_filter a.skyblue:hover i {
            color: var(--whitefontcolor);
        }

    .record_filter button.btnTalentPool {
        background: rgba(223, 30, 255, 0.1);
        border: 1px solid #df1eff;
        border-radius: 4px;
        min-width: inherit;
        width: 40px;
        height: 38px;
        line-height: 38px;
        box-shadow: none;
        margin-right: 15px;
        border-radius: 4px;
        padding: 0;
        margin: 0 !important;
        text-align: center;
        position: relative;
    }

        .record_filter button.btnTalentPool img {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-50%);
        }

        .record_filter button.btnTalentPool:hover {
            background: #df1eff;
        }

            .record_filter button.btnTalentPool:hover img {
                color: #fff;
                filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(179deg) brightness(200%) contrast(200%);
            }

.record_menu {
    line-height: initial;
    max-width: 100%;
    display: inline-block;
    margin: 0px 0 10px;
    position: relative;
}

    .record_menu li {
        margin: 0 !important;
        position: relative;
        display: inline-block;
        float: left;
        border-top: 1px solid rgba(0,0,0,0.05);
        border-bottom: 1px solid rgba(0,0,0,0.05);
    }

        .record_menu li a {
            display: block;
            position: relative;
            padding: 10px 12px 9px 25px;
            background: var(--whitebgcolor) !important;
            color: #676565;
            border: none !important;
            border-radius: 0;
            margin-right: 0;
        }

        .record_menu li:first-child a {
            padding: 10px 15px 9px 12px !important;
        }

        .record_menu li.active a {
            background: var(--bluecolor) !important;
            color: #fff;
        }

            .record_menu li.active a:hover {
                color: #fff;
            }

        .record_menu li a {
            position: relative;
            background: white;
        }

        .record_menu li:after {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0;
            width: 0;
            height: 0;
            border-left: 19px solid white;
            border-top: 19px solid transparent;
            border-bottom: 19px solid transparent;
        }

        .record_menu li:before {
            content: "";
            position: absolute;
            right: -32px;
            bottom: 0;
            width: 0;
            height: 0;
            border: 18px solid transparent;
            z-index: 1;
        }

        .record_menu li a:after {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0px;
            width: 0;
            height: 0;
            border-left: 19px solid rgba(0,0,0,0.4);
            border-top: 19px solid transparent;
            border-bottom: 19px solid transparent;
        }

        .record_menu li a:before {
            content: "";
            position: absolute;
            right: -36px;
            bottom: 0px;
            width: 0;
            height: 0;
            border: 18px solid transparent;
            z-index: 1;
        }

        .record_menu li.active a:before {
            border-left-color: var(--bluecolor);
        }

        .record_menu li.active label.badge {
            background: #fff !important;
            color: #0a3b7e !important;
        }

        .record_menu li:first-child:after, .record_menu li:first-child:before, .record_menu li:first-child.active:after, .record_menu li:first-child.active:before {
            display: none;
        }

        .record_menu li:first-child a:after, .record_menu li:last-child a:before {
            display: none;
        }

        .record_menu li.active:last-child a:before {
            display: inline-block;
        }

td.Question-icon .icon {
    font-size: 18px;
}

.record_menu ul {
    padding-right: 42px;
    position: relative;
    margin: 0 !important;
    display: flex;
    align-items: center;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: auto;
}

.row-new {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.Assessment-list h4 {
    font-size: 20px;
    font-weight: 700;
    color: var(--headingcolor);
    margin: 0 20px 0 0;
    display: inline-block;
}

.ApplicantHistoryDetail-box .gflex {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ApplicantHistoryDetail-box {
    background: var(--whitebgcolor);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px !important;
    margin: 0 0 15px;
    padding: 18px 18px 0px;
}

    .ApplicantHistoryDetail-box .empbox {
        position: relative;
        padding-left: 70px;
        display: flex;
        align-items: center;
        min-height: 55px
    }

        .ApplicantHistoryDetail-box .empbox .empicon {
            display: inline-block;
            width: 54px;
            height: 54px;
            line-height: 54px;
            background: rgba(15, 79, 146, 0.1);
            border: 1px solid #0F4F92;
            border-radius: 8px;
            text-align: center;
            font-family: 'Roboto',sans-serif;
            font-style: normal;
            font-weight: 300;
            font-size: 26px !important;
            letter-spacing: 0.1em;
            color: #0a3b7e;
            position: absolute;
            left: 0;
            top: 0;
        }

        .ApplicantHistoryDetail-box .empbox .employeedata > span.employee_name {
            font-weight: 500;
            font-size: 24px;
            line-height: 28px;
            letter-spacing: 0.04em;
            color: var(--bluecolor);
            margin-bottom: 5px;
            font-family: 'Roboto',sans-serif;
        }

    .ApplicantHistoryDetail-box .e-application-info label {
        margin-bottom: 3px;
    }

    .ApplicantHistoryDetail-box .e-application-info p {
        margin: 0;
    }

.quickmenu {
    text-align: center;
}

    .quickmenu a i {
        font-size: 18px !important;
    }

    .quickmenu a:hover {
        color: #000;
    }

    .quickmenu p {
        margin-bottom: 0px;
        color: #000;
    }

    .quickmenu a {
        line-height: 24px;
    }

    .quickmenu .dropdown-menu.DropDesign li a {
        border-left: 0px !important;
        padding-left: 10px;
    }

    .quickmenu.open a {
        background: transparent !important;
    }

    .quickmenu .dropdown-menu-left {
        left: auto;
        right: 20px;
        transform: translate(47%);
        top: 40px;
        box-shadow: 1px 3px 17px -4px rgba(0,0,0,0.24);
    }

body .quickmenu .gaction_list:after, body .quickmenu .gaction_list:before {
    left: 85px;
    right: auto;
}

.employee_info .panel-body .form-control {
    border: 1px solid #eaeaea;
    padding: 5px;
}

.employee_info .panel-default > .panel-heading {
    background: #f5f6fa !important;
}

.eminfo li > div:before {
    position: absolute;
    z-index: -1;
    height: 20px;
    width: 20px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transform-origin: 50% 50%;
    content: "";
    background-color: #e5e9f2;
    border-radius: 50%;
    opacity: 0;
    transition: all .3s;
}

.eminfo li > div:hover:before {
    opacity: 1;
    height: 38px;
    width: 38px;
}

.eminfo li i {
    font-size: 18px !important;
}

.notiuser .NotiCounts {
    position: absolute;
    font-size: 11px;
    background: #00aefa;
    color: #fff;
    height: 19px;
    top: -7px;
    right: -12px;
    padding: 2px 3px;
    border-radius: 50px;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notiuser .dropdown.gdropdown {
    position: relative;
}

.eminfo.nav-pills li {
    margin: 0px 10px
}

.quickmenu li {
    margin: 0 !important;
}

.notiuser .Panel_title {
    font-size: 14px;
    font-weight: 500;
    padding: 6px 0px;
}

span.noft_dat {
    color: #526484;
    font-size: 12px;
    margin-right: auto;
}

.NotiFicationAction .btnViewNotification {
    color: green;
}

.notifooter .clearnoti {
    border-top: 1px solid #eaeaea;
    display: block;
    padding: 15px;
    color: #0f4f92;
    font-size: 13px;
    text-transform: uppercase;
}

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

    .showcheck label {
        margin-bottom: 0;
    }

.custom_tabs_css button {
    position: relative;
}

    .custom_tabs_css button:before {
        content: "";
        position: absolute;
        left: 0;
        right: 51%;
        bottom: 0;
        background: #0a3b7e;
        height: 2px;
        -webkit-transition-property: left,right;
        transition-property: left,right;
        -webkit-transition-duration: .3s;
        transition-duration: .3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        width: 100%;
        opacity: 0;
    }

    .custom_tabs_css button.tabs_btns_active:before {
        opacity: 1;
    }

    .custom_tabs_css button:hover:before {
        background: #09bef3;
        opacity: 1;
    }

.eadvance-modal .panel-heading.SubPanel {
    background: transparent !important;
}

.labelpending {
    background-color: #ffa902;
    color: #ffb830;
}

.labeldraft {
    background-color: #3da3f5;
    color: #3da3f5;
}

.labelexpired {
    background-color: #ef2a6a;
    color: #ffcede;
}

.employee_info .main-data .fieldset .label {
    padding-bottom: 6px;
    display: block;
    text-align: left;
}

.employee_info .main-data .fieldset {
    padding: 0 0 20px;
}

.webpunchbox.employee_info .main-data .fieldset {
    padding: 0 0 12px;
}

.webpunchbox.employee_info .timestamp {
    margin-bottom: 0;
}

.backbutton {
    background: #e7edf4;
    border-color: var(--bluecolor);
    color: var(--bluecolor);
    display: flex;
    align-items: center;
    column-gap: 7px;
}

.btn.factbtn:hover {
    background: var(--greenhovercolor);
}

label.arrow {
    margin-bottom: 0px !important;
}

.gobtn .btn {
    height: 35px !important;
    min-width: 55px !important;
}

.chanmain {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 20px;
    padding: 12px 0px;
    margin: 0px 16px;
    border-bottom: 1px solid #E6E6E6;
}

.employee-dropdown-content {
    background: none !important;
    padding: 10px 0px !important;
    margin: 0px 16px;
    border-bottom: 1px solid #E6E6E6;
}

    .employee-dropdown-content .d_flex {
        margin-top: 10px;
    }

        .employee-dropdown-content .d_flex p {
            margin-bottom: 0px;
            font-weight: 300;
            color: #022F5F;
            display: flex;
            align-items: flex-start;
            column-gap: 5px;
            font-size: 14px;
        }

.employee-details {
    display: flex;
    align-items: center;
    gap: 10px;
}

.chanmain .signout-icon {
    color: #FF7171;
    font-weight: 500;
}

.chanmain .cng-pwd-icon {
    color: #022F5F;
    font-weight: 500;
}

.editCircleName {
    background: #0f4f92;
    border-radius: 50px;
    width: 80px;
    height: 80px;
    position: relative;
    overflow: hidden;
    margin-left: 0px !important;
    margin-top: 0px !important;
}

#labelusername .emp-username, #labelusername .emp-username, #labelusername .emp-code {
    color: #404040 !important;
}

#labelusername .emp-username {
    font-weight: 500 !important;
}

#labelusername .em-code {
    font-weight: 400 !important;
}

#labelusername .emp-designation {
    font-weight: 400 !important;
}

.emp_designation img, .emp_company span#ctl00_lblBranch {
    margin-right: 4px;
    text-transform: lowercase;
    font-size: 14px;
}

.editCircleName img {
    height: 100%;
    object-fit: cover;
}

.editCircleName .profile_editimg {
    font-size: 14px;
    opacity: 0;
    position: absolute;
    top: 0;
    z-index: 1;
    left: 0;
}

.profile_editbox input[type="file"] {
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.editimges .uploadimg {
    position: absolute;
    bottom: -50px;
    font-size: 12px;
    right: 0;
    color: #fff;
    width: 100%;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: #01a8f3;
    border-radius: 15px 15px 0 0;
    opacity: 0;
    visibility: hidden;
    transition: all 500ms ease;
}

.editCircleName:hover .uploadimg {
    bottom: -6px;
    opacity: 1;
    visibility: visible;
    transition: all 500ms ease;
}

.NewJoinedata .owl-dots button {
    display: inline-block;
    width: 6px;
    height: 6px;
    background: rgba(0, 113, 255, 0.40);
    border-radius: 50%;
    margin: 0 5px;
}

    .NewJoinedata .owl-dots button.active {
        background: rgba(0, 113, 255, 1);
    }

.NewJoinedata .owl-dots {
    text-align: center;
}

.annoucedata ul li.item ul li {
    padding-left: 0;
}

.annoucedata ul li.item ul {
    display: flex;
    column-gap: 15px;
}

.calendarbox {
    width: 140px;
    border: 1px solid #0A3B7E;
    border-radius: 4px;
    font: 500 12px 'Roboto',sans-serif;
    cursor: pointer;
    color: #0A3B7E;
    background: rgba(10,59,126,0.10);
}

    .calendarbox input {
        padding: 5px 10px;
        background: transparent !important;
        border: none;
    }

    .calendarbox select {
        padding: 0px 10px;
    }

    .calendarbox span.input-group-addon {
        background: transparent;
        border: none;
        padding-left: 0px;
        color: #0A3B7E
    }

.btnbranchwise {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 10px;
    border-bottom: 1px solid #eaeaea;
}

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

        .btnbranchwise .gradiodata input[type="radio"] {
            opacity: 0;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            cursor: pointer;
            height: 100%;
        }

            .btnbranchwise .gradiodata input[type="radio"]:checked + label {
                border-bottom-color: #727272;
            }

        .btnbranchwise .gradiodata label {
            display: block;
            padding-bottom: 7px;
            padding-top: 15px;
            margin-right: 15px;
            border-bottom: 2px solid transparent;
            color: #727272;
        }

.clerboth {
    clear: both;
}

.btnbranchwise .gradiodata span {
    position: relative;
    display: flex;
    align-items: center;
}

span.opbranch:before {
    content: "";
    width: 8px;
    height: 8px;
    background: #547FBF;
    border-radius: 10px;
    display: block;
}

span.opdepart:before {
    content: "";
    width: 8px;
    height: 8px;
    background: #2caffe;
    border-radius: 10px;
    display: block;
}

.btnbranchwise h3 {
    margin-right: auto;
}

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

.teamstatsdata a {
    border: none;
    padding: 5px;
    font-size: 12px;
    text-align: center;
}

    .teamstatsdata a:before {
        content: "";
        width: 7px;
        height: 7px;
        display: inline-block;
        margin-right: 3px;
        border-radius: 50px;
    }

.steam {
    color: #09BEF3;
}

    .steam:before {
        background: #09BEF3;
    }

.sleave {
    color: #E3351E;
}

    .sleave:before {
        background: #E3351E;
    }

.spresent {
    color: #2CB34C;
}

    .spresent:before {
        background: #2CB34C;
    }

.stour {
    color: #ED145B;
}

    .stour:before {
        background: #ED145B;
    }

.sabsent {
    color: rgba(133, 62, 249, 0.85);
}

    .sabsent:before {
        background: rgba(133, 62, 249, 0.85);
    }

.sonoff {
    color: rgba(254, 203, 3, 1);
}

    .sonoff:before {
        background: rgba(254, 203, 3, 1);
    }

.sdelaye {
    color: #55DA7A;
}

    .sdelaye:before {
        background: #55DA7A
    }

.searly {
    color: #F47A36;
}

    .searly:before {
        background: #F47A36
    }

.statsrow .col-md-5, .statsrow .col-md-7 {
    padding: 0px;
}

.empCountinner label {
    font-size: 13px;
    text-align: left;
    margin-left: 0px;
}

    .empCountinner label:before {
        content: "";
        display: inline-block;
        width: 8px;
        height: 8px;
        margin-right: 5px;
        border-radius: 50px;
    }

    .empCountinner label.emylate:before {
        background: #FF993D
    }

    .empCountinner label.emyontime:before {
        background: #5AFF8D
    }

    .empCountinner label.emyabsent:before {
        background: #E3351E
    }

ul.birthday, .upcoming ul {
    max-height: 300px;
    overflow-y: auto;
}

.swichrolehr {
    display: flex !important;
    justify-content: flex-end;
    margin-top: 18px;
    border-top: 1px solid #eaeaea;
    padding-top: 13px;
}

.toggleBox.swichrolehr input[type=checkbox] + label:after {
    right: auto;
    left: 0px;
    position: relative;
}

.toggleBox.swichrolehr input[type=checkbox] + label:before {
    left: auto;
    right: 2px;
    border-top-color: #000;
    top: 15px;
}

.toggleBox.swichrolehr input[type=checkbox]:checked + label:before {
    right: auto;
    top: 15px;
    opacity: 0 !important;
}

.toggleBox.swichrolehr input[type=checkbox] + label:before {
    opacity: 0;
}

.toggleBox.swichrolehr input[type=checkbox] + label {
    border: none;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    width: 100%;
    text-align: center;
}

    .toggleBox.swichrolehr input[type=checkbox] + label:after {
        background: transparent
    }

p#pProfile2, p#pProfile2 a {
    font: 500 14px/18px 'Roboto',sans-serif;
    color: #022F5F;
    margin-bottom: 0;
}

.TSactionGroup {
    display: flex;
    column-gap: 8px;
}

    .TSactionGroup a {
        border-radius: 6px !important;
        width: 50px;
        font-size: 12px;
        font-weight: 400 !important;
    }

        .TSactionGroup a.attendance {
            background-color: #FFEBEB !important;
            border: 1px solid #CB3535 !important;
            color: #CB3535 !important;
        }

        .TSactionGroup a.book-tour {
            border: 1px solid #F55A00 !important;
            background: #FFF3EC;
            color: #F55A00;
        }

        .TSactionGroup a.apply-leave {
            border: 1px solid #36922B !important;
            background: #EDFFEB;
            color: #36922B;
        }

#containerWeeklyWorkingHours .highcharts-xaxis-labels tspan:nth-child(2), #containerWeeklyWorkingHours .highcharts-xaxis-labels tspan:nth-child(3) {
    display: none;
}

.gdropdown .dropdown-menu.notidropdown .Notifaction_body {
    padding-right: 10px;
}

.requestsAttendance {
    border: 1px solid #01D494;
    background: #E5F8F5;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border-top: 5px solid #01D494;
}

    .requestsAttendance p {
        color: #01D494;
    }

.requestsLeaves p {
    color: #FFA902;
}

.mypending .p-requests > div {
    position: relative;
}

.requestsOthers p {
    color: #ED145B;
}

.p-requeststop .p-requests:hover .dropdown-menu {
    display: block;
}

.requestsTour {
    border: 1px solid #757FEF;
    background: #F1F2FD;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border-top: 5px solid #757FEF;
}

.requestsLeaves {
    border: 1px solid #FFA902;
    background: #FEF4E8;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border-top: 5px solid #FFA902;
}

.requestsOthers {
    border: 1px solid #ED145B;
    background: #FFF0F5;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border-top: 5px solid #ED145B;
}

.requestdoc {
    border: 1px solid #f242ff;
    background: #f242ff14;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border-top: 5px solid #f242ff;
}

    .requestdoc p {
        color: #f242ff;
    }

.viewbtn {
    background: transparent;
    color: #0F4F92 !important;
    padding: 0px;
    font-weight: 400 !important;
    margin-left: 10px;
}

.mypending .dash_head h3, .task-dash h3, .myleave-dash h3 {
    display: flex;
    justify-content: space-between !important;
    width: 100%;
}

.task-dash .count, .myleave-dash .count {
    margin-right: auto !important;
}

.mypending .dash_head .count {
    margin-right: auto;
}

span.leavedatain {
    font-weight: 500 !important;
}

.eventemp {
    border-radius: 100px;
    border: 2px solid #FFF;
    box-shadow: 4px 4px 6px 0px rgba(0, 0, 0, 0.10);
}

.birthimg i.icon {
    position: absolute;
    bottom: 4px;
    right: 4px;
}

    .birthimg i.icon img {
        width: 25px;
    }

.birtinfo p {
    font-weight: 500;
    margin-top: 10px;
    margin-bottom: 0;
    font-size: 12px;
}

.birdthdayinner {
    margin-bottom: 15px;
    width: 22%;
}

    .birdthdayinner .birthimg {
        width: 73px;
        margin-left: auto;
        margin-right: auto;
    }

.eventmore {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    background: #efefef;
    border: none;
    color: #0F4F92;
    padding: 14px;
    margin: 0px auto;
    font-size: 12px;
    border: 2px solid #eaeaea;
}

.attendancebox {
    border: 1px solid #585858;
    background: #fff;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border-top: 5px solid #666666;
    display: flex;
    justify-content: space-between;
    column-gap: 15px;
    align-items: center;
}

.heddingpnal {
    font-size: 16px;
}

.attendanceboxicon {
    background: #E0E0E0;
    height: 50px;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    border-radius: 50px;
    color: #585858;
}

.attendanceboxtime {
    margin-right: auto;
    margin-left: 10px;
}

    .attendanceboxtime h4 {
        color: #666666;
        font-weight: 400;
        font-size: 16px;
        margin-top: 0px;
        margin-bottom: 5px;
    }

    .attendanceboxtime h3 {
        margin-top: 0;
        font-size: 17px;
        color: #585858;
        margin-bottom: 0px;
    }

.planleave {
    margin-top: 20px;
}

    .planleave .recent_body {
        margin-bottom: 0px;
        border-top: 1px solid #eaeaea;
    }

        .planleave .recent_body .postby {
            margin-bottom: 0px;
        }

.task-footer {
    text-align: center;
    padding: 10px;
}

    .task-footer button {
        background: transparent;
        border: none;
        font-size: 14px;
    }

.task-body li {
    border-bottom: 1px solid #eaeaea;
    padding: 15px 0px;
}

.feedfilter .gaction_list a {
    padding: 10px 15px !important;
}

.annoucedata ul li {
    padding-left: 0;
    list-style: disc;
    margin-left: 15px;
}

.leftWbox, .rightWbox {
    position: fixed;
    width: 22%;
}

.feedfilter ul {
    box-shadow: 0px 37px 66px -55px rgba(0,0,0,0.75);
}

.requestsAttendance ul.dropinner {
    background: #e5f8f5;
}

body .requestsAttendance .gaction_list:before {
    border-bottom-color: #e5f8f5;
}

body .p-requests .gaction_list:after {
    border-bottom-color: #e1e1e1;
}

.requestsTour ul.dropinner {
    background: #F1F2FD;
}

body .requestsTour .gaction_list:before {
    border-bottom-color: #F1F2FD;
}

.requestsLeaves ul.dropinner {
    background: #FEF4E8;
}

body .requestsLeaves .gaction_list:before {
    border-bottom-color: #FEF4E8;
}

.requestsOthers ul.dropinner {
    background: #FFF0F5;
}

body .requestsOthers .gaction_list:before {
    border-bottom-color: #FFF0F5;
}

.p-requeststop {
    padding-left: 10px;
    padding-right: 10px;
}

    .p-requeststop .gaction_list {
        width: 100%;
    }

.birdthdaydata {
    display: flex;
    flex-wrap: wrap;
    column-gap: 4%;
    text-align: center;
}

span.applyfeed {
    text-align: right;
    float: right;
    padding-right: 0 !important;
}

    span.applyfeed span {
        padding-right: 0 !important;
    }

.congrathead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
}

body .p-requests .gaction_list {
    left: 0;
}

span.notidate {
    float: right;
    padding-right: 0 !important;
}

.memberCountAvl {
    padding: 0px 12px;
    border-radius: 50px;
}

.FeedTypeActive, .FeedDaysActive {
    background: rgb(240, 243, 247) !important;
    color: var(--activecolor) !important;
}

.calendar_main_box select option {
    text-transform: capitalize;
}

.wishmodal h4 {
    text-align: center;
    margin-bottom: 30px;
    margin-top: 0px;
    color: #4570AB;
    font-size: 24px;
}

.wishbox {
    padding: 30px;
}

.wishboxinner {
    display: flex;
    align-items: center;
    column-gap: 15px;
    margin-bottom: 12px;
}

.birthcard {
    background: #FFE8F7;
    padding: 2px 10px;
    border: 1px solid #f6d3ea;
    color: #0F4F92;
    font-weight: 500;
    border-radius: 5px;
}

.Congratscard {
    background: #EDFFE8;
    padding: 2px 10px;
    border: 1px solid #A0EF8C;
    color: #0F4F92;
    font-weight: 500;
    border-radius: 5px;
}

.birthempinfo span {
    display: block;
    font-weight: 500;
    margin-top: 9px;
    margin-bottom: 5px;
}

.wishboxinner .birthimg i.icon img {
    width: 42px;
}

.uploadwish input {
    display: none;
}

.uploadwish {
    border: 1px solid #D9D9D9;
    padding: 14px;
    margin-top: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
}

    .uploadwish label {
        margin-bottom: 0;
        display: flex !important;
        justify-content: space-between;
        padding-bottom: 0px !important;
    }

.wihsendbtn {
    display: flex;
    justify-content: end;
}

.modal-header .close.birthclose {
    color: #418DF9 !important;
}

    .modal-header .close.birthclose:hover {
        background: transparent
    }

.AvailMemberimg .myteamimg {
    margin-right: -16px;
}

.AvailMemberimg {
    display: flex;
}

.AvailMemberin {
    display: flex;
    column-gap: 15px;
    align-items: center;
    margin-right: 15px;
    position: relative;
}

.AvailMembercount {
    text-align: center;
}

.AvailMember {
    margin: 0px;
    padding-top: 10px
}

.onteam h5, .onteam h4 {
    color: #26B348;
}

.offteam h5, .offteam h4 {
    color: #F44336;
}

.onteam .myteamimg:before {
    background: #26B348
}

.offteam .myteamimg:before {
    background: #F44336
}

.offteamcol {
    border-left: 1px solid #d4d4d4;
}

.birthList {
    background: #fff;
    border: 1px solid rgba(9, 54, 121, 0.1);
    padding: 20px;
}

    .birthList h1 {
        font: 500 24px/30px 'Roboto',sans-serif;
        color: #0F4F92;
        margin: 0 0 20px;
    }

    .birthList h2 {
        font: 500 18px/24px 'Roboto',sans-serif;
        color: #000;
        margin: 0 0 20px;
    }

    .birthList ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .birthList ul li {
            padding: 25px 0;
            border-bottom: 1px solid #D9D9D9;
        }

            .birthList ul li:last-child {
                border-bottom: none;
            }

            .birthList ul li .date span {
                text-align: center;
                display: block;
            }

            .birthList ul li .date .date_count {
                font: 500 30px/40px 'Roboto',sans-serif;
                color: #000;
            }

            .birthList ul li .date .day {
                font: 400 20px/30px 'Roboto',sans-serif;
                color: #000;
            }

            .birthList ul li .list_data {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                column-gap: 24px;
                box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.25);
                border: 1px solid #d9d9d9;
                padding: 15px;
                border-radius: 5px;
            }

                .birthList ul li .list_data .list_box_img {
                    position: relative;
                }

                    .birthList ul li .list_data .list_box_img i {
                        display: inline-flex;
                        width: 70px;
                        height: 70px;
                        border-radius: 50%;
                        box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.10);
                        overflow: hidden;
                    }

                    .birthList ul li .list_data .list_box_img .celebration_badge {
                        position: absolute;
                        bottom: -6px;
                        right: 6px;
                    }

            .birthList ul li .list_box_data span {
                display: inline-block;
                padding: 2px 10px;
                font: 500 12px/20px 'Roboto',sans-serif;
                color: #0F4F92;
                border: 1px solid transparent;
                border-radius: 5px;
                margin-bottom: 10px;
            }

                .birthList ul li .list_box_data span.birth {
                    background: #FFE8F7;
                    border-color: #FFCFEF;
                }

                .birthList ul li .list_box_data span.work {
                    background: #EDFFE8;
                    border-color: #A0EF8C;
                }

            .birthList ul li .list_box_data .emp_name, .birthList ul li .list_box_data .emp_des {
                font: 500 14px/20px 'Roboto',sans-serif;
                color: #0a3b7e;
                margin-bottom: 5px;
            }

            .birthList ul li .list_box_data .emp_deprt {
                font: 400 14px/20px 'Roboto',sans-serif;
                color: #000;
                margin: 0;
            }

            .birthList ul li .list_box_data .emp_des {
                color: #000;
            }

            .birthList ul li .date {
                margin: 30px 0;
            }

.elistbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 24px;
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.25);
    border: 1px solid #d9d9d9;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 30px;
    min-height: 140px;
}

.listboximg {
    display: inline-flex;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.10);
    overflow: hidden;
}

.emp_deg {
    font: 400 12px/18px 'Roboto', sans-serif;
    color: #000;
    margin: 0;
}

.elistboxdata .emp_name {
    font: 500 14px/20px 'Roboto',sans-serif;
    color: #000;
    margin-bottom: 5px;
}

.empstatus {
    display: inline-block;
    padding: 2px 10px;
    font: 500 12px/20px 'Roboto',sans-serif;
    border: 1px solid transparent;
    border-radius: 5px;
    margin-bottom: 10px;
}

.eavailable {
    background: #C4FFD2;
    color: #1F983C;
}

.uneavailable {
    background: #FFC6C6;
    color: #D70000;
}

.empsearchbtn {
    color: #fff !important;
}

.pageheader .empsearchbox {
    padding-right: 5px !important;
    min-width: 245px !important;
    max-width: 260px;
}

.emteamcout {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

.empteamsearch {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

span.emtotal {
    background: #cceafa;
    border: 1px solid #00aefa;
    padding: 5px 10px;
    border-radius: 5px;
}

.emteamcout a {
    margin-bottom: 0;
}

.taskdropfilter {
    max-width: 100px;
}

.pageheader .pagebutton .d-flex input.form-control {
    width: 265px !important;
}

.PoweredBy img {
    width: 70px;
}

ul.nav.nav-tabs::-webkit-scrollbar {
    height: 4px !important;
}

w-15 {
    width: 15%;
}

.norecordfound {
    text-align: center;
}

.modal.right {
    -webkit-transition: all .30s linear;
    -o-transition: all .30s linear;
    transition: all .30s linear;
}

.clearfix {
    clear: both;
}

.fixButton {
    display: none;
}

.fixPanel .filterclose {
    display: none
}

.tourtype {
    width: 150px !important;
}

.mob-panel .panel-body {
    padding-bottom: 0;
}

.mob-panel-footer .btn {
    margin: 0px;
}

    .mob-panel-footer .btn.btn-primary {
        margin-left: auto;
    }

.bookotsearch {
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
}

.gobtn {
    height: 36px;
}

.empbox {
    padding: 15px 20px;
    border: 1px solid #d9d9d9;
    background: #f6f6f6;
    margin: 10px 0 0;
}

    .empbox .empheader {
        display: flex;
        align-items: center;
        justify-content: space-between;
        column-gap: 16px;
    }

.empheader h3 {
    font: 500 24px/30px 'Roboto',sans-serif;
    color: #0F4F92;
    margin-bottom: 10px;
    margin-top: 0;
}

    .empheader h3 span {
        font-weight: 400;
    }

.empheader .emp_prop {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    column-gap: 20px;
    list-style: none;
    row-gap: 10px;
    flex-wrap: wrap;
}

    .empheader .emp_prop li {
        font: 500 14px 'Roboto',sans-serif;
        color: #0F4F92;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 8px;
    }

    .empheader .emp_prop i {
        display: flex;
        align-items: center;
        justify-content: center;
    }

.empheader .userIcon {
    display: inline-block;
    width: 60px;
    height: 60px;
    border: 2px solid #0F4F92;
    border-radius: 50%;
    overflow: hidden;
}

    .empheader .userIcon img {
        width: 100%;
        height: auto;
    }

.cldepartment h3 {
    font: 500 16px/24px 'Roboto',sans-serif;
    color: #333333;
    margin: 0;
}

.clNOtApproved {
    font: 500 12px/20px 'Roboto',sans-serif;
    color: #FF0000;
    margin: 0;
}

.clApproved {
    font: 500 12px/20px 'Roboto',sans-serif;
    color: #01D494;
    margin: 0;
}

.clPending {
    font: 500 12px/20px 'Roboto',sans-serif;
    color: #666666;
    margin: 0;
}

.cldepartment {
    border: 2px solid #F0F6FF;
    margin-top: 15px;
    padding: 10px;
}

    .cldepartment a {
        padding: 10px 15px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100%;
    }

.clnotifaction i {
    color: #0A3B7E;
    font-size: 20px;
}

.cldepartment.clactive {
    background: #F0F6FF;
}

ul.NoDuesMenu {
    display: block !important;
}

.NoDuesMenu.nav-tabs > li {
    float: none !important
}

.clnotlable {
    background: #FFC6C6;
    color: #D70000;
    padding: 8px 11px;
    margin: 0px;
    border-radius: 5px;
    font-size: 12px;
}

.clApprolable {
    background: #C4FFD2;
    color: #1F983C;
    padding: 8px 11px;
    margin: 0px;
    border-radius: 5px;
    font-size: 12px;
}

.clpenddinglable {
    background: #EEEEEE;
    color: #8E8E8E;
    padding: 8px 11px;
    margin: 0px;
    border-radius: 5px;
    font-size: 12px;
}

.cl-tab-content {
    border: 2px solid #F0F6FF;
    padding: 15px;
    margin-top: 15px;
}

p.clLabel {
    margin-bottom: 5px;
    font-weight: 500;
    color: #333
}

.cltabinner label {
    font: 500 14px/20px 'Roboto',sans-serif !important;
    color: #333;
    margin: 10px 0px 5px 0px;
}

.cltabinner {
    border-top: 1px solid #eaeaea;
    padding: 0px;
    margin-top: 15px;
}

.clDeduct {
    display: flex;
    column-gap: 10px;
}

    .clDeduct .Deductnum {
        max-width: 100px;
        text-align: center;
    }

.cltabinner textarea:focus {
    outline: none;
}

.clnotify label {
    margin: 3px 27px;
    color: #0F4F92;
}

.clnotify {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 12px 0px;
}

    .clnotify .Notifybtn {
        background: transparent;
        border: 1px solid #D9D9D9;
        padding: 5px 10px;
        color: #0F4F92;
        border-radius: 5px;
        column-gap: 8px;
        align-items: center;
        display: flex;
    }

.cl-footer {
    justify-content: flex-end;
    column-gap: 15px;
}

    .cl-footer .btn {
        height: auto !important
    }

        .cl-footer .btn.cl-cancal {
            color: #0F4F92;
            border: 1px solid #0F4F92;
            background: #fff;
        }

.Pheadingbox {
    padding: 7px 21px;
    border: 1px solid #d9d9d9;
    background: #f6f6f6;
    margin: 10px 0 0;
}

.Pheadingheader h3 {
    font: 500 16px / 30px 'Roboto', sans-serif;
    color: #0F4F92;
    margin-bottom: 0px;
    margin-top: 0;
}

.nav.nav-tabs.ClearanceMenu li {
    border: 1px solid #d9d9d9 !important;
    margin: 15px 0px;
}

.nav.nav-tabs.ClearanceMenu {
    border: none !important;
}

.Clearance-tab-content {
    padding: 7px 21px;
    border: 1px solid #d9d9d9;
}

.cl-tabsheading h4 {
    color: #0F4F92;
    margin-bottom: 3px;
    font-size: 16px;
}

.multicheck .ms-options-wrap > .ms-options > ul input[type="checkbox"] {
    left: 13px;
    right: auto;
    top: 13px;
}

.multicheck .ms-options-wrap > .ms-options > ul li.selected label {
    background: #ebeef7;
}

.multicheck .ms-options-wrap > .ms-options > ul label {
    border-bottom: 1px solid #F2F2F2
}

    .multicheck .ms-options-wrap > .ms-options > ul label.focused, .multicheck .ms-options-wrap > .ms-options > ul label:hover {
        background: #ebeef7;
        border-bottom: 1px solid #F2F2F2
    }

.multicheck .ms-options-wrap > .ms-options > ul label {
    padding: 10px 4px 10px 35px
}

.multicheck .ms-options-wrap > .ms-options > .ms-selectall.global {
    background: transparent;
    font-size: 14px;
    margin-top: 10px;
    text-transform: uppercase;
    padding-left: 13px;
}

.multicheck .ms-options-wrap > button {
    border: 1px solid #D9D9D9;
    border-radius: 5px;
    padding: 9px 13px;
}

.multicheck .ms-options-wrap > .ms-options {
    border: 1px solid #F2F2F2
}

.multicheck .ms-options-wrap > button > label.arrow {
    background: transparent
}

    .multicheck .ms-options-wrap > button > label.arrow:after {
        content: "\e9c1";
        font-family: 'feather' !important;
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        border: none;
        font-size: 17px;
        top: 11px;
        right: 26px;
        color: #0F4F92
    }

.multicheck .ms-options-wrap > .ms-options > .ms-search input {
    padding: 4px 13px;
}

.Clearcomment {
    display: flex;
    align-items: center;
    column-gap: 15px;
    margin: 15px 0px;
}

.noDuesfooter {
    display: flex;
    justify-content: flex-end;
}

    .noDuesfooter .footerbuttons {
        display: flex;
        align-items: center;
        column-gap: 15px;
    }

.clickprint {
    margin-bottom: 0;
    text-align: right;
    margin-top: 10px;
    color: #BF7676;
}

.FNFuploadfile .FNFupload {
    margin: 0px;
    border: 2px dashed #5D9ADB;
    color: grey;
    font-size: 16px;
    line-height: 23px;
    overflow: hidden;
    padding: 20px 10px 20px 10px;
    position: relative;
    resize: none;
    width: 100%;
    border-radius: 5px;
}

.FNFuploadfile [type="file"] {
    cursor: pointer !important;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    height: 100%;
}

.FNFuploadfile .FNFupload i {
    color: #0F4F92;
    display: block;
    font-size: 90px;
}

.FNFuploadfile .FNFupload label {
    font: 500 22px 'Roboto', sans-serif !important;
    color: #0F4F92;
}

.FNFuploadfile .FNFupload p {
    font-style: italic;
    font-size: 14px;
    color: #0F4F92;
}

.FNFupload {
    padding: 0px 0px;
}

.nav.nav-tabs.ClearanceMenu li a span {
    text-overflow: ellipsis;
    overflow: hidden;
}

.empJob {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

    .empJob a#lnkAddEmp {
        background: #0f4f92;
        color: #fff;
        width: 25px;
        height: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50px;
        font-size: 19px;
    }

.AddApproverModal table {
    margin-top: 10px;
}

.jobempcode .input-group-btn input {
    background: #0a3b7e;
    color: #fff;
    padding: 7px 15px;
}

.AddApproverModal table tr td:nth-child(1) img {
    margin-left: 5px;
    cursor: pointer;
}

.AddApproverModal .input-group {
    width: 100% !important;
}

.leftMenuInner.scrollbar-inner > .scroll-element.scroll-x {
    height: 3px !important;
}

.leftMenuInner.scrollbar-inner > .scroll-element.scroll-y {
    width: 3px;
}

.leftMenuInner.scrollbar-inner > .scroll-element .scroll-bar, .scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar, .statuscroll .scroll-bar {
    background-color: #a3d6ff;
}

.leftMenuInner.scrollbar-inner > .scroll-element.scroll-y {
    right: 0;
}

ul.leftMenuInner.scroll-scrollx_visible {
    overflow-x: hidden !important;
}

.leavteken {
    display: flex;
    column-gap: 10px;
    align-items: center;
}

    .leavteken i {
        color: #0a3b7e;
        padding: 5px;
        border-radius: 50px;
        font-size: 22px;
        cursor: pointer;
    }

.logs-filter input {
    height: auto;
}

.logs-filter .Records-bg {
    row-gap: 10px;
}

.ExpensePnal {
    display: flex;
    column-gap: 10px;
    flex-wrap: wrap;
    row-gap: 5px;
}

.approvepnal .panelBtnsRight {
    display: flex;
    flex-wrap: wrap;
    max-width: 440px;
    justify-content: flex-end;
    row-gap: 10px;
}

    .approvepnal .panelBtnsRight .form-control {
        max-width: 99px;
    }

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

    .approvdHeading label {
        margin-left: 0px;
    }

.topmenuicon {
    column-gap: 15px;
}

.openSidepanel .feather-chevron-right::before {
    content: "\e98f";
}

.FNFfilename span {
    display: block;
    text-align: center;
    margin: 0px auto;
}

.uplodedfile {
    list-style: none;
    display: flex;
    margin-bottom: 30px;
    column-gap: 15px;
}

    .uplodedfile li img {
        width: 70px;
        width: 70px;
    }

    .uplodedfile li {
        width: 70px;
        height: 70px;
        overflow: hidden;
        object-fit: cover;
        position: relative;
        border: 1px solid #eaeaea;
    }

        .uplodedfile li button {
            position: absolute;
            top: 0;
            background: transparent;
            border: none;
            color: red;
            right: 0;
            font-size: 15px;
        }

.FNFfilename, .file-item {
    display: flex;
    column-gap: 6px;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 10px;
}

    .FNFfilename .file-item {
        background: #eaeaea;
        padding: 5px 10px;
        border-radius: 5px;
    }

        .FNFfilename .file-item .delete-icon {
            cursor: pointer;
        }

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

.cldeparinner {
    display: flex;
    justify-content: space-between;
    column-gap: 10px;
    align-items: center;
}

.NoDuestabs table th {
    border: none !important;
}

.cldepartment h3.cldepartname {
    font-size: 14px;
}

    .cldepartment h3.cldepartname span {
        color: #727272;
    }

.dempname {
    color: #0F4F92;
    font-size: 16px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
    padding-right: 10px;
}

    .dempname img {
        width: 32px;
    }

.announcementslider .iconin {
    position: relative;
}

.announcementslider p {
    margin-right: auto;
}

.announcementslider {
    display: flex;
    justify-content: space-between;
    column-gap: 10px;
    align-items: center;
    border-radius: 4px;
    background: rgb(241,242,253);
    padding: 20px;
    border: 1px solid #757fef;
    padding: 5px;
    width: 100%;
}

.announcementmain {
    padding: 0;
    background: transparent;
    border: none;
}

    .announcementmain .owl-dots {
        transform: translateX(-2%);
    }

.dempinfo {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
}

.attendanceboxbtn .dropdown-menu {
    width: 400px;
    border-top: 5px solid #3D6D9E !important;
    background: #fff;
    box-shadow: 0px 2px 5px 0px rgba(87,87,87,1);
}

.webpunch-headding {
    border-bottom: 1px solid #dcdcdc;
}

    .webpunch-headding h3 {
        margin: 0;
        padding: 15px;
        font-size: 17px;
        color: #0F4F92;
        background: #f5f6fa
    }

.webpunchdata {
    padding: 10px 15px;
    margin-top: 5px;
    position: relative;
}

.punchtimebox {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 1px solid #dcdcdc;
    padding-bottom: 10px;
}

.punchtimeleft h4 {
    font-size: 14px;
    color: #0F4F92;
    font-weight: 500;
    margin: 0px;
}

    .punchtimeleft h4 span {
        padding-right: 5px;
    }

.punchtimeleft h5 {
    color: #0F4F92;
    font-size: 27px;
}

.punchtimeright h4 {
    color: #0F4F92;
    font-size: 19px;
    margin-bottom: 4px;
    margin-top: 6px;
    text-align: right;
}

.punchtimeright h3 {
    color: #666666;
    font-size: 14px;
    font-weight: 400;
    margin: 0px;
}

.punchtimeright h5 {
    margin: 0;
    color: #0F4F92;
    text-align: right;
}

.circular-chart {
    display: block;
    margin: 10px auto;
    max-width: 80%;
    max-height: 250px;
}

.circle-bg {
    fill: none;
    stroke: #eee;
    stroke-width: 3.8;
}

.circlein {
    fill: none;
    stroke-width: 2.8;
    stroke-linecap: round;
    animation: progress 1s ease-out forwards;
}

@keyframes progress {
    0% {
        stroke-dasharray: 0 100;
    }
}

.circular-chart.green .circlein {
    stroke: #4CC790;
}

.percentage {
    fill: #666;
    font-family: sans-serif;
    font-size: 0.3em;
    text-anchor: middle;
}

.distancekm {
    display: flex;
    column-gap: 15px;
    align-items: center;
    justify-content: center;
    border: 1px solid #eaeaea;
    padding: 15px;
    box-shadow: 0px 0px 19px -14px rgba(0, 0, 0, 0.76);
    border-radius: 5px;
}

.totalkm {
    display: flex;
    justify-content: space-between;
    column-gap: 10px;
    line-height: 24px;
    font-weight: 500;
}

.distancedetails {
    width: 100%;
}

.totalkm span {
    color: #727272;
}

.distanceicon img {
    width: 50px;
}

.durationmain .col-md-6 {
    margin-bottom: 15px;
}

.livetracfilterin {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

    .livetracfilterin label {
        font-weight: 500 !important;
        white-space: nowrap;
        margin: 0px;
    }

    .livetracfilterin select {
        width: 140px;
    }

.livetracfilter {
    column-gap: 15px;
}

.livetracfilterin.gpanel input {
    padding: 20px 31px 20px 13px;
}

.punchlocation {
    border-bottom: 1px solid #dedede;
    padding: 10px 0px;
}

    .punchlocation label, .punchtype label, .punchremark label {
        margin: 0;
        font-weight: 500 !important;
        color: #666666;
        font-size: 14px;
    }

    .punchlocation .locationtext {
        margin: 0px;
        border: 1px solid #BDD6F0;
        background: #FEFDFA;
        font-size: 12px;
        padding: 10px;
        border-radius: 5px;
        margin-top: 5px;
        color: #5F8AB7;
        display: block;
    }

.punchtypein {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    padding-top: 10px;
}

    .punchtypein div {
        width: 50%;
        border-bottom: 0;
    }

.punchtype {
    border-bottom: 1px solid #dadada;
    padding: 10px 0px;
}

.punchremark {
    padding: 10px 0px;
}

.punchtypein label {
    padding: 1px 0px 0px 26px;
    border-bottom: 0;
    font-weight: 400 !important;
}

.punchremark textarea {
    border: 1px solid #BDD6F0;
    background: #FEFDFA;
    margin-top: 10px;
}

.punchbtn {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 15px;
}

    .punchbtn .punchbtncancal {
        color: #333333;
        border: 1px solid #333333;
        font-weight: 500;
        width: 40%;
        padding: 5px 10px;
        background: #fff;
        border-radius: 5px;
    }

    .punchbtn .punchbtnrecode {
        color: #fff;
        border: 1px solid #333333;
        font-weight: 500;
        width: 60%;
        padding: 5px 10px;
        background: #0f4f92;
        border-radius: 5px;
    }

.gaction_list.webpuchdropdown::after {
    top: -27px;
    border-bottom-color: #3d6d9e;
}

.gaction_list.webpuchdropdown::before {
    top: -24px;
}

.newfeedbox {
    padding-right: 20px;
}

.announcementmain .owl-nav {
    display: none;
}

.daterangepicker .drp-buttons .btn.applyBtn {
    background: var(--bluecolor) !important;
    font-weight: 400 !important;
    border: none;
}

.disUser,
.btn.btn-primary.disUser.d-none {
    display: none !important;
}

.addNewTask {
    min-width: initial;
    display: none;
}

.greenbtn {
    min-width: auto;
}

.Scheduledmodal label.form-label {
    margin: 0;
    padding-bottom: 5px;
    font-weight: 500 !important;
}

.Scheduledmodal .input-group {
    margin-bottom: 15px;
    width: 100%;
}

.Scheduledmodal .form-check-label {
    font-size: 14px;
    font-weight: 500 !important;
    padding-top: 3px;
    margin-bottom: 0;
}

    .Scheduledmodal .form-check-label::after {
        top: 0px;
    }

.btnclose {
    position: absolute;
    right: -10px;
    top: -10px;
    color: #FF0000;
    opacity: 1;
}

    .btnclose i {
        background: #FF0000;
        color: #fff;
        border-radius: 5px;
    }

.wishdialog {
    -webkit-transform: translate(0, calc(50vh - 50%)) !important;
    -ms-transform: translate(0, 50vh) translate(0, -50%) !important;
    -o-transform: translate(0, calc(50vh - 50%)) !important;
    transform: translate(0, 50vh) translate(0, -50%) !important;
}

.anniversarytext, .anniversarytext sup {
    background: #F9B63A;
    background: linear-gradient(to bottom right, #F9B63A 0%, #FF7A17 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.anniversarytext {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-41%, -50%);
    font-size: 80px;
    font-weight: 600;
    font-family: "Abril Fatface", serif;
}

    .anniversarytext sup {
        font-size: 16px;
        top: -3em;
        left: -14px;
    }

.JobRequisitionRow .greencolor {
    min-width: auto;
}

.requisitionbutton .btn {
    width: auto;
    height: auto !important;
    padding: 6px 10px !important;
}

.settingData .checkboxdatalabel {
    display: inline-block;
    width: 20px;
    height: 25px;
}

    .settingData .checkboxdatalabel input[type="checkbox"] {
        width: 16px;
        height: 16px;
        z-index: 2;
        cursor: pointer;
    }

        .settingData .checkboxdatalabel input[type="checkbox"]:checked + label:after {
            border-color: #0a3b7e;
            background: #0a3b7e;
        }

    .settingData .checkboxdatalabel.greyboxcheck input[type="checkbox"]:checked + label:after {
        border-color: #999;
        background: #999;
    }

    .settingData .checkboxdatalabel input[type="checkbox"]:checked + label:before {
        opacity: 1;
        color: #fff !important;
        z-index: 1;
        top: 0;
    }

    .settingData .checkboxdatalabel label:after, .checkboxdatalabel label:before {
        border-radius: 2px;
        width: 16px;
        height: 16px;
    }

    .settingData .checkboxdatalabel label:before {
        left: 0px;
        top: 2px !important;
        font-size: 12px;
    }

.settingData .table {
    margin-top: 15px;
}

    .settingData .table tr th span {
        display: flex;
        margin-bottom: 7px;
        align-items: center;
        justify-content: space-between;
        column-gap: 10px;
        position: relative;
    }

        .settingData .table tr th span i {
            font-size: 16px;
        }

    .settingData .table tr .empname {
        left: 0;
        position: sticky !important;
        z-index: 999;
    }

    .settingData .table tr .empcode {
        left: 132px;
        position: sticky !important;
        z-index: 999;
        border-right: 1px solid rgba(0,0,0,0.1);
    }

    .settingData .table tr th {
        z-index: 2;
    }

        .settingData .table tr th.empname, .settingData .table tr th.empcode {
            z-index: 9999 !important
        }

.settingData .angle-arrow-right:after {
    content: "\f178";
    position: absolute;
    right: 0;
    top: 0;
    font-family: 'FontAwesome';
    font-size: 18px;
    color: #1f5aa0;
}

.settingData .table tr th.empname {
    min-width: 140px;
}

.settingData .checkboxdatalabel.angle-arrow-right {
    padding-right: 60px;
}
/*========================
	inbox chat
==========================*/
.inboxleft .leftside-chat {
    display: flex;
    align-items: center;
    column-gap: 10px;
    width: 100%;
    padding-right: 40px;
}

.inboxleft .userinfo {
    width: 82%;
}

.inboxleft .chat-icon span {
    width: 35px;
    height: 35px;
    line-height: 35px;
    border-radius: 50px;
    justify-content: center;
    display: flex;
    font-size: 19px;
    font-weight: 600;
    text-transform: uppercase;
    align-items: center;
}

    .inboxleft .chat-icon span.approved {
        background: #cbf3b2;
    }

        .inboxleft .chat-icon span.approved i {
            color: #5cb85c;
        }

    .inboxleft .chat-icon span.rejected {
        background: #ffcaca !important;
    }

        .inboxleft .chat-icon span.rejected i {
            color: #ff5959 !important;
        }

.inboxleft .userinfo h2 {
    font: 500 16px 'Roboto',sans-serif !important;
    margin: 3px 0px;
    font-weight: 400;
    min-height: 20px;
}

.inboxleft .userinfo p {
    margin-bottom: 1px;
    font-size: 14px;
}

.inboxleftmain {
    border: 1px solid #eaeaea;
    background: #fff;
}

.inboxsection {
    display: flex;
}

.inboxleftmain {
    border: 1px solid #eaeaea;
    padding: 0;
}

.inboxleft .timestatus {
    display: flex;
    justify-content: space-between;
}

.inboxleft .infotext {
    white-space: nowrap;
    overflow: hidden;
    width: 99%;
    text-overflow: ellipsis;
    color: #9f9999;
}

.inboxleft .statusinner {
    white-space: nowrap;
    overflow: hidden;
    width: 60%;
    text-overflow: ellipsis;
}

.inboxleft .statustime {
    color: #000;
    font-weight: 400 !important;
    white-space: nowrap;
    font-size: 12px;
}

.attechinner {
    border: 1px solid #eaeaea;
    max-width: 75%;
    text-overflow: ellipsis;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: middle;
    padding: 5px;
    margin-right: 7px;
    background: #fff;
}

    .attechinner i {
        color: #0F4F92;
    }

i.feather-chevron-left.backList {
    display: none;
}

.inboxleftmain .leftside {
    border-bottom: 1px solid #eaeaea;
    padding: 15px;
    cursor: pointer;
}
/*.inboxleftmain .leftside:nth-child(even) .chat-icon span {background: #a8f0cd;color: #00723b;}*/
.notimpann .chat-icon span.approved {
    background: #ff4545;
}

    .notimpann .chat-icon span.approved i {
        color: #fff;
    }

.inboxleftmain .inboxfilter .dropdown {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #eaeaea;
    padding: 10px
}

    .inboxleftmain .inboxfilter .dropdown span {
        font-size: 15px;
    }

    .inboxleftmain .inboxfilter .dropdown i {
        font-size: 16px;
    }

    .inboxleftmain .inboxfilter .dropdown span {
        font-size: 16px;
        cursor: pointer;
    }

.inboxleftmain .leftside.active {
    background: #f4f8fb;
}

.inboxleftmain .leftside:hover {
    background: #f4f8fb;
}

.inboxright {
    border: 1px solid #eaeaea;
    padding: 0;
}

.rightsubject {
    border-bottom: 1px solid #eaeaea;
    padding: 10px 15px;
    font: 500 20px 'Roboto',sans-serif;
    background: #fbfbfb;
    display: flex;
    align-items: center;
}

.apndMailDetail {
    background: #fff;
    max-width: 800px;
    margin: 30px auto;
    border: 1px solid #eee;
    border-radius: 5px;
    box-shadow: 0 0px 1px rgba(0, 0, 0, 0.2);
    padding: 0;
    width: 100%;
}

.leftside.inboxleft {
    padding: 10px 15px;
}

.inboxright .userinfo, .inboxright .leftside-chat {
    width: 100%;
}

.inboxright .infotext {
    white-space: normal;
    overflow: visible;
    width: 100%;
    margin-top: 15px;
    color: #727272;
}

.rightsubject span {
    padding: 6px 15px;
    margin-left: 7px;
    border-radius: 13px;
    margin: 0 0 0 15px;
}

    .rightsubject span.update {
        color: #006d23 !important;
        background: #cdf3c6;
    }

    .rightsubject span.pending {
        color: #ffa902;
        background: #fff2da;
    }

    .rightsubject span.Success {
        color: #006d23 !important;
        background: #cdf3c6;
        font-size: 11px;
    }

    .rightsubject span.Failed {
        color: #ff0223 !important;
        background: #ffb1b1;
        font-size: 11px;
    }

.select-item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 90vh;
}

    .select-item i {
        font-size: 47px;
        color: #cdcdcd;
    }

    .select-item h2 {
        font-size: 20px;
        color: #727272;
        margin-top: 5px;
        text-transform: capitalize;
        font-weight: 400;
    }

.inboxfilter input {
    margin-bottom: 0px;
    width: 100%;
    padding-left: 35px;
}

.inboxfilter {
    display: flex;
    justify-content: flex-start;
    padding: 5px;
    width: 100%;
    align-items: center;
    background: #f6f6f6;
    flex-wrap: wrap;
}

    .inboxfilter .date {
        max-width: 210px;
    }

.dropdownmain a.action_icon {
    cursor: pointer;
    font-size: 17px;
    color: #0a3b7e;
}

.username {
    display: flex;
    justify-content: space-between;
}

.chat-delete {
    border: none;
    color: #0a3b7e;
    background: transparent
}

.ErrorLogs-filter {
    display: flex;
    column-gap: 15px;
}

    .ErrorLogs-filter .gpanel input {
        margin-bottom: 0;
        width: 210px;
    }

.errorselect select {
    width: 160px;
    margin-bottom: 0;
}

.errorselect {
    margin-right: auto;
    margin-left: 10px;
}

.apndMailDetail .timestatus {
    justify-content: flex-start;
    column-gap: 5px;
    margin-bottom: 5px;
}

    .apndMailDetail .timestatus span {
        width: auto;
        font: 500 14px 'Roboto',sans-serif;
        color: #0f4f92;
    }

        .apndMailDetail .timestatus span:last-child {
            font-weight: 500 !important;
        }

.apndMailDetail .leftside.inboxleft {
    padding: 0;
}

.apndMailDetail .userinfo {
    padding: 20px;
}

#gborder {
    padding: 10px 0 0;
    border: 1px solid #eee;
    margin: 0 15px 20px;
    display: table;
    width: calc(100% - 4%);
}

.DeviceAccessBlcok .top, DeviceAccessBlcok .top.last {
    display: none;
}

.DeviceAccessBlcok .chosen-container {
    margin-bottom: 15px;
}

input.disable + label::after {
    border: 1px solid #999999 !important;
}

input.disable + label::before {
    background: #999999;
    border: 1px solid #999999;
}

.logsfilter {
    display: flex;
    column-gap: 15px;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 10px;
}

    .logsfilter .deletebutton {
        line-height: 1px;
    }

body .logsfiltertable .scroll-element.scroll-y {
    right: 0 !important;
}

input#hdnRowPerGrid {
    visibility: hidden;
}

.gdropdown ul li.companyList:hover {
    background: var(--bluecolor) !important;
    color: var(--whitefontcolor) !important;
}

.companydata .tablescrollbar {
    max-height: 300px !important;
}

.companydata.finYearDrop .tablescrollbar {
    min-width: 220px;
    max-width: 220px;
}

.MapEmployeline {
    display: flex;
    justify-content: flex-start;
    align-items: self-start;
    column-gap: 10px;
}

.dFinace {
    max-width: 130px;
}

.tablescrollbar.scrollbar-inner.logsfiltertable {
    height: calc(100vh - 250px) !important;
}

.Require-action .input_group {
    padding-bottom: 10px;
}

.Require-action {
    margin-top: 30px;
}

#default_settings .row {
    margin-bottom: 11px;
}

.task_checkbox {
    display: flex;
    align-items: center;
    font-size: 14px;
    margin-bottom: 8px;
    margin-top: 5px;
}

    .task_checkbox input {
        margin-right: 8px;
        margin-top: 0px;
    }

.table.dataTable thead > tr > th.sorting:nth-last-child(1):before, .table.dataTable thead > tr > th.sorting:nth-last-child(1):after {
    display: none;
}

.birthList {
    background: #fff;
    border: 1px solid rgba(9, 54, 121, 0.1);
    padding: 20px;
}

    .birthList h1 {
        font: 500 24px/30px 'Roboto',sans-serif;
        color: #0F4F92;
        margin: 0 0 20px;
    }

    .birthList h2 {
        font: 500 18px/24px 'Roboto',sans-serif;
        color: #000;
        margin: 0 0 20px;
    }

    .birthList ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .birthList ul li {
            padding: 25px 0;
            border-bottom: 1px solid #D9D9D9;
        }

            .birthList ul li:last-child {
                border-bottom: none;
            }

            .birthList ul li .date span {
                text-align: center;
                display: block;
            }

            .birthList ul li .date .date_count {
                font: 500 30px/40px 'Roboto',sans-serif;
                color: #000;
            }

            .birthList ul li .date .day {
                font: 400 20px/30px 'Roboto',sans-serif;
                color: #000;
            }
            /*.birthList ul li .list_view{display: flex;align-items: center;justify-content: flex-start;column-gap: 20px;}*/
            .birthList ul li .list_data {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                column-gap: 24px;
                box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.25);
                border: 1px solid #d9d9d9;
                padding: 15px;
                border-radius: 5px;
            }

                .birthList ul li .list_data .list_box_img {
                    position: relative;
                }

                    .birthList ul li .list_data .list_box_img i {
                        display: inline-flex;
                        width: 70px;
                        height: 70px;
                        border-radius: 50%;
                        box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.10);
                        overflow: hidden;
                    }

                    .birthList ul li .list_data .list_box_img .celebration_badge {
                        position: absolute;
                        bottom: -6px;
                        right: 6px;
                    }

            .birthList ul li .list_box_data span {
                display: inline-block;
                padding: 2px 10px;
                font: 500 12px/20px 'Roboto',sans-serif;
                color: #0F4F92;
                border: 1px solid transparent;
                border-radius: 5px;
                margin-bottom: 10px;
            }

                .birthList ul li .list_box_data span.birth {
                    background: #FFE8F7;
                    border-color: #FFCFEF;
                }

                .birthList ul li .list_box_data span.work {
                    background: #EDFFE8;
                    border-color: #A0EF8C;
                }

                .birthList ul li .list_box_data span.Anniversary {
                    background: rgba(237, 255, 232, 1);
                    border: 1px solid rgba(160, 239, 140, 1) !important;
                }

                .birthList ul li .list_box_data span.Birthday {
                    background: rgba(255, 232, 247, 1);
                    border: 1px solid rgba(255, 207, 239, 1) !important;
                }

            .birthList ul li .list_box_data .emp_name, .birthList ul li .list_box_data .emp_des {
                font: 500 14px/20px 'Roboto',sans-serif;
                color: #000;
                margin-bottom: 5px;
            }

            .birthList ul li .list_box_data .emp_deprt {
                font: 400 14px/24px 'Roboto',sans-serif;
                color: #000;
                margin: 0;
            }

            .birthList ul li .date {
                margin: 30px 0;
            }

.inboxfilter .backList {
    display: none;
}

.form-group.YearList {
    margin-bottom: 0px;
    padding: 17px 10px;
    background-color: #f6f6f6
}

.YearList select {
    border: none;
    background: transparent;
    font-weight: 500;
    cursor: pointer;
    color: #21435e;
}

.scrollbar-filter table tr td {
    vertical-align: top;
}

.dropdown-backdrop {
    display: none !important;
}

body .inboxfilter .gaction_list a {
    padding: 15px 10px 7px 35px !important;
}

.inboxsection .chatheader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 20px;
    column-gap: 15px;
    background: #f4f8fb; /*border-bottom: 1px solid #eee;*/
    width: 100%; /*position: sticky;top: 0;z-index: 999;background: #fff;*/
    margin-bottom: 15px;
    position: sticky;
    top: 0;
    z-index: 9;
}

    .inboxsection .chatheader .chatheadLeft {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 15px;
    }

.inboxsection .chatInner {
    padding: 10px 20px 50px;
    text-align: center;
    max-width: 100%;
}

    .inboxsection .chatInner h3 {
        font: 500 20px/30px 'Roboto',sans-serif;
        color: #000;
        margin: 0 0 30px;
        text-align: left;
    }

    .inboxsection .chatInner p {
        font: 400 14px/24px 'Roboto',sans-serif;
        color: #444;
        margin: 0 0 30px;
        text-align: left;
    }

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

    .inboxsection .chatInner img {
        max-width: 600px;
        height: auto;
        display: inline-block;
    }

.inboxsection .inboxright {
    background: #fff;
}

    .inboxsection .inboxright .inboxleft {
        padding: 0;
    }

    .inboxsection .inboxright .timestatus:first-child {
        margin-bottom: 5px;
    }

    .inboxsection .inboxright .timestatus span {
        width: auto;
        font: 500 14px 'Roboto', sans-serif;
        color: #0f4f92;
    }

    .inboxsection .inboxright .timestatus {
        margin-bottom: 0;
    }

    .inboxsection .inboxright .note-editable {
        background: #f2f8f9;
        padding: 15px;
        border: 1px solid rgba(0,0,0,.2);
    }

.inboxsection .chatzonebranch {
    padding: 0 20px;
    width: 100%;
}

    .inboxsection .chatzonebranch h3 {
        margin: 0 0 8px;
        font: 500 16px/24px 'Roboto',sans-serif;
        color: #000;
    }

    .inboxsection .chatzonebranch ul {
        margin: 0 0 15px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        column-gap: 15px;
    }

        .inboxsection .chatzonebranch ul li {
            display: inline-block;
            background: #f7f8f9;
            padding: 5px 10px;
            border-radius: 5px;
            color: #0f4f92;
            font: 500 12px / 20px 'Roboto', sans-serif;
            border: 1px solid #eee;
        }

.inboxsection .chatheadRight {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: 15px;
}

.bluecolor {
    background: var(--bluecolor);
    color: #fff;
}

.col-lg-3.inboxleftmain .greencolor {
    display: none !important;
}

.defaultnotice {
    color: #FF5353;
    padding-left: 10px;
}

.offstatus b {
    color: #000;
}

.offstatus.statuspending span {
    background: #FFF0E7;
    border: 1px solid #FF843F;
    padding: 5px 11px;
    color: #FF843F;
    border-radius: 5px;
}



.offstatus.statusForward span {
    background: #fffeee;
    border: 1px solid #c06f00;
    padding: 5px 11px;
    color: #c06f00;
    border-radius: 5px;
}

.offstatus.statusapprove span {
    background: rgb(0 164 55 / 18%);
    border: 1px solid #00a437;
    padding: 5px 11px;
    color: #00a437;
    border-radius: 5px;
}

.offstatus.statusreject span {
    background: rgb(255 0 0 / 7%);
    border: 1px solid #ff0000;
    padding: 5px 11px;
    color: #ff0000;
    border-radius: 5px;
}

.Requesteddays h3 {
    font-size: 17px;
    color: #FF5353;
    margin-bottom: 4px;
}

.Requesteddays p {
    color: #666666
}

.requestlable label {
    border: 1px solid #BCBCBC;
    display: inline-block !important;
    padding: 3px 10px;
    border-radius: 5px;
    margin-bottom: 0;
    font-size: 12px;
    margin-left: 0px;
}
/*.requestlable {background: #F6F6F6;}*/
.forminput {
    display: flex;
    column-gap: 10px;
    align-items: center;
    position: relative;
}

    .forminput .group-addon {
        padding: 10px 12px;
        min-height: 40px;
        display: flex;
        align-items: center;
        color: #0F4F92;
        border-radius: 5px;
        position: absolute;
        right: 0px;
    }

.form-group .forminput input {
    border-radius: 5px;
}

.requestlable {
    display: flex;
    flex-wrap: wrap;
    row-gap: 5px;
    column-gap: 5px;
}

    .requestlable.form-control {
        padding: 7px 10px !important;
        border-radius: 5px;
    }

.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

    .inputfile:focus + label {
        outline: 1px dotted #000;
        outline: -webkit-focus-ring-color auto 5px;
    }
/*.inputfile + label * {pointer-events: none;}*/
.uploadbox .uploadinput {
    margin: 0;
    border: 1px solid #D9D9D9;
    padding: 10px 15px;
    width: 100%;
    max-width: 600px;
    border-radius: 5px;
    color: #666666;
    font-size: 14px;
}

.uploadtext {
    color: #666666;
    font-size: 12px;
    font-style: italic;
}

.uploadinputmain {
    margin-bottom: 5px;
    margin-top: 20px;
}

.resignbody .panelheadingtxt {
    font-size: 16px;
    font-weight: 500;
    color: #0F4F92;
}

.resignbody .topHeaderData {
    padding: 12px 15px;
    background: #fff;
    border: 1px solid #ddd;
}

.uploadlist {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: 15px;
    flex-wrap: wrap;
}

    .uploadlist .file-item img {
        display: none;
    }

    .uploadlist .file-item .info {
        color: #0F4F92;
        display: flex;
    }

        .uploadlist .file-item .info span {
            white-space: nowrap;
            max-width: 50px;
            overflow: hidden;
            text-overflow: ellipsis;
        }

    .uploadlist .file-item {
        border: 1px solid #0F4F92;
        border-radius: 50px;
        padding: 3px 5px;
    }

        .uploadlist .file-item button {
            border: none;
            background: transparent;
            color: #ff0000;
            padding: 0;
        }

.disableformat .form-control {
    background: #f6f6f6;
    border-radius: 5px;
}

.disableformat .group-addon {
    background: #f6f6f6;
}

.approverbox label {
    margin-bottom: 15px;
}

.empDiscushead {
    margin-bottom: 20px;
}

.empDiscus .forminput {
    margin-top: 20px;
}

.empDiscus .radioboxdatalabel label:after, .empDiscus .checkboxdatalabel label:after {
    top: -2px
}

.empDiscus .checkboxdatalabel label {
    font-weight: 400 !important;
    font-size: 15px;
    margin-left: 30px;
}

    .empDiscus .checkboxdatalabel label:before {
        top: 0 !important
    }

.empDiscus .checkboxdatalabel {
    position: relative !important;
}

.togglemain {
    display: flex;
    align-items: flex-start;
    column-gap: 20px;
    margin-bottom: 15px;
}

    .togglemain p {
        color: #666666;
        font-size: 15px;
        min-width: 200px;
    }

.empheadbox {
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.6%);
    display: flex;
    align-items: center;
    padding: 15px;
    margin-bottom: 10px;
    column-gap: 15px;
    border: 1px solid #DDDDDD;
}

.empheadright h3 {
    margin-top: 0;
    color: #0F4F92;
}

    .empheadright h3 .resignempcode {
        font-weight: 400;
        padding-left: 5px;
    }

.resignempdetails {
    display: flex;
    column-gap: 10px;
}

    .resignempdetails label {
        font-weight: 400;
    }

        .resignempdetails label span {
            font-weight: 500 !important;
            color: #666;
        }

        .resignempdetails label img {
            filter: brightness(0) saturate(100%) invert(40%) sepia(19%) saturate(4%) hue-rotate(337deg) brightness(93%) contrast(94%);
        }

body .modal-body .empDesired .form-control {
    padding: 10px 10px;
}

.frdbtn {
    color: #0F4F92;
    background: transparent;
    border: 1px solid #0F4F92;
    padding: 10px 25px;
    font-weight: 500;
    font-size: 14px;
}

.approvfooter .btn {
    padding: 10px 44px !important;
    height: auto !important;
    font-weight: 400 !important;
}

.offlisttable td h3 {
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 5px;
    color: #0F4F92;
}

.colorred {
    color: #FF5353
}

.withdra-panel .panel-heading {
    background: #fff;
    padding-bottom: 0px;
}

    .withdra-panel .panel-heading h2 {
        color: #0F4F92;
        margin-top: 0;
        font-size: 24px;
        border-bottom: 1px solid #0F4F92;
        padding: 10px 0px;
    }

    .withdra-panel .panel-heading h3 {
        text-align: center;
        font-size: 20px;
        border-bottom: 1px solid #eaeaea;
        padding-bottom: 10px;
    }

.withdratext {
    line-height: 28px;
    color: #2D2D2D;
    font-size: 15px;
    padding: 20px 0px;
}

.quscheckmain {
    display: flex;
    align-items: center;
    column-gap: 20px;
    flex-wrap: wrap;
}

.withdrques {
    border: 1px solid #eaeaea;
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 15px;
}

    .withdrques h4 {
        color: #0F4F92;
    }

.withdra-panel .panel-body {
    padding-top: 0;
}

.withdrques h3 {
    color: #2D2D2D;
    font-size: 15px;
}

.withdrques p {
    color: #727272;
    font-size: 14px;
}

.optionlist {
    display: flex;
    align-items: flex-start;
    margin-bottom: 10px;
    column-gap: 10px;
}

    .optionlist .listnum {
        border: 1px solid #D9D9D9;
        padding: 4px 10px;
        border-radius: 5px;
    }

.rankingcomment {
    display: flex;
    align-items: center;
    column-gap: 15px;
    margin-top: 21px;
}

    .rankingcomment label {
        margin-left: 0;
    }

.optionlist.ratingques {
    align-items: self-start;
    margin-bottom: 50px;
}

.ratingquesin .quscheckmain {
    margin-top: 16px;
}

.quscheckmain .radioboxdatalabel label, .quscheckmain .checkboxdatalabel label {
    font-size: 14px;
}

.withdrbtn {
    display: flex;
    column-gap: 10px;
    justify-content: flex-end;
}

    .withdrbtn .withdrcancel {
        color: #0F4F92;
        background: transparent;
        border: 1px solid #0F4F92;
    }

.withdrawemp {
    background: #f3f3f3;
    box-shadow: none;
    justify-content: space-between;
}

    .withdrawemp .resignempdetails label {
        margin-left: 0;
    }

.withdrbtn .btn {
    height: auto;
}

.resignbody .panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.view_announce .para {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .view_announce .para img {
        width: 50px;
        height: 50px;
        object-fit: cover;
    }

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

    .parainner span.author {
        text-align: left
    }

    .parainner .author span {
        color: #474747
    }

.view_announce .para strong {
    font-size: 12px;
}

.parainner .author span:first-child:after {
    background: transparent
}

.doc-card {
    border: 1px solid #D9D9D9;
    border-radius: 5px;
    padding: 15px;
    background: #fff;
    margin-bottom: 15px;
    cursor: pointer;
    min-height: 155px;
}

.docinner {
    display: flex;
    align-items: self-start;
    column-gap: 10px;
    margin-bottom: 10px;
}

.docright h3 {
    color: #0F4F92;
    margin-top: 0px;
    font-size: 16px;
    margin-bottom: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 90%;
    overflow: hidden;
}

.docright {
    width: 90%;
}

.doc-info {
    display: flex;
    justify-content: space-between;
    column-gap: 5px;
}

span.docgroup {
    font-weight: 500;
    color: #333333;
}

.docsize {
    color: #666666;
    font-style: italic;
    font-size: 12px;
}

.doc-info .docupload span {
    color: #333333;
    padding-left: 5px;
}

.doc-info .docupload {
    color: #999999;
    display: block;
}

.docdec {
    color: #333333;
    margin-bottom: 0;
    font-size: 12px;
}

.docapprove {
    background: #EAFFF1;
    border: 1px solid #23A950;
    padding: 5px 10px;
    border-radius: 5px;
    color: #23A950;
    font-size: 12px;
    max-width: max-content;
}

.docpending {
    background: #FFF6ED;
    border: 1px solid #ED7300;
    padding: 5px 10px;
    border-radius: 5px;
    color: #ED7300;
    font-size: 12px;
    display: flex;
    align-items: center;
    column-gap: 5px;
    max-width: max-content;
    flex-wrap: wrap;
}

.docreject {
    background: #FFEEEE;
    border: 1px solid #EB4646;
    padding: 5px 10px;
    border-radius: 5px;
    color: #EB4646;
    font-size: 12px;
    max-width: max-content;
}

.docissue {
    margin-top: 10px;
}

.doc-card-view {
    box-shadow: 0px 24px 42px -19px rgba(107, 107, 107, 1);
    padding: 15px;
}

.docdicline {
    border: 1px solid #EB4646;
    color: #EB4646;
    padding: 6px 20px !important;
    font-size: 16px;
}

.filterFooter.docFooter {
    justify-content: center;
    column-gap: 15px;
}

.docaprove {
    background: #50CB79 !important;
    color: #fff;
    padding: 8px 20px;
}

.Clsdeclined .Completefeed {
    background: #e3351e;
}

.Requestview h3 {
    margin-top: 0px;
}

.resignleft {
    padding-left: 0px;
}

/*.panel-body.resigninfo {
    padding: 25px;
}*/

.resigninfo.rightdisable {
    background: #f0f4ff !important;
    border: 1px solid #D9D9D9;
}

    .resigninfo.rightdisable hr {
        border-top: 1px solid #dedede;
    }

.aprovresignmodal {
    background: #fff;
    padding: 0px 15px;
}

.leftcol {
    padding-left: 0px;
}

.inleft, .inright {
    border: 1px solid #DDDDDD;
    padding: 15px;
    border-radius: 5px;
}

.group-addon-in {
    border: 1px solid #0a3b7e;
    padding: 8px;
    border-radius: 5px;
    color: #0a3b7e;
    cursor: pointer;
}

.backbtn {
    color: #0a3b7e !important;
    transition: .3s;
    background: rgba(10, 59, 126, .1);
    border: 1px solid #0a3b7e;
}

.noticebutton {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 15px;
}

.btn.declinebtn {
    background: transparent;
    border: 1px solid #FF5353;
    color: #FF5353;
    font-size: 14px;
}

.btn.btnotice {
    background: var(--greencolor);
    border: 1px solid var(--greencolor);
    color: #fff;
    font-size: 14px;
}

.empboxaprove {
    justify-content: space-between;
}

.inleft {
    background: #f0f4ff;
}

.inright .form-control {
    border-radius: 5px;
}

.inleft .form-control {
    background: #f0f4ff;
    border: none;
    padding: 0 !important;
    min-height: inherit;
    color: #494949;
}

.empcheckbox {
    top: -8px;
}

body .p-requests .requestsOthers .gaction_list {
    left: auto;
}

.flex.postby.hpostby {
    justify-content: space-between;
    display: flex !important;
}

    .flex.postby.hpostby span lable {
        color: #e64a35;
        font-size: 15px;
    }

.flex.postby.hpostby {
    margin-bottom: 5px;
}

.openinglistin .listhead p {
    margin-bottom: 0;
}

.recent_body .postby.hpostby span:after {
    background: transparent;
}

.recent_body .postby.hpostby span {
    padding-right: inherit
}

.topmenuicon.quickmenu .WebPunch {
    display: none;
}

.webpunchdata:before {
    width: 23px;
    height: 26px;
    border-style: solid;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
    border-right: 19px solid #ababab;
    border-left: 0;
    content: "";
    position: absolute;
    left: -24px;
    top: 25px;
}

.webpunchdata:after {
    width: 21px;
    height: 26px;
    border-style: solid;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 19px solid #ffffff;
    border-left: 0;
    content: "";
    position: absolute;
    left: -21px;
    top: 28px;
}

body .gaction_list.webpuchdropdown {
    top: -83px;
    right: -432px;
}

.punchtype .form-control {
    font-size: 13px;
}

.coaccum-head {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.empDesired hr {
    border-top: 1px solid #dedede;
}

.webpunch-headding i {
    padding-right: 5px;
}

.birdthdayinner .birthimg a {
    position: relative;
}

.birdthdayinner .birthimg i.icon {
    right: 0px;
}

span.employee_code img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(19%) saturate(4%) hue-rotate(337deg) brightness(93%) contrast(94%);
}

.employeedatain .employee_code {
    display: flex !important;
    column-gap: 4px;
}

.module_open .settingData .table tr th.empname, .module_open .settingData .table tr td.empname, .module_open .settingData .table tr th.empcode, .module_open .settingData .table tr .empcode {
    z-index: 9 !important
}

.ResetPwd .Records-bg span {
    display: flex;
    align-items: center;
    column-gap: 5px;
}

    .ResetPwd .Records-bg span input {
        margin-top: 0;
    }

    .ResetPwd .Records-bg span b {
        white-space: nowrap;
    }

.cardheading {
    display: flex;
    align-items: center;
    column-gap: 9px;
    border-bottom: 1px solid #cdc8c8;
    padding-bottom: 10px;
}

.noticeleave p {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

    .noticeleave p img {
        width: 19px;
        height: 19px;
    }

.resignright hr {
    margin: 0px 0px 15px 0px;
}

.resignright .forminput span, .resignright .form-group p {
    color: #494949;
}

.noticeleaveinner {
    display: flex;
    align-items: center;
    column-gap: 15px;
    flex-wrap: wrap;
}

.resigleft hr {
    margin-top: 5px;
}

.rhApprove {
    background: #ccffe1;
    border: 1px solid #209952;
    padding: 3px 8px;
    color: #209952;
    border-radius: 5px;
    margin-left: auto;
}

span.empcodein .form_control_span {
    color: #0f4f92;
    font-weight: 500;
}

span.employee_code.empinfoin {
    display: flex !important;
    column-gap: 10px;
    align-items: center;
    margin-bottom: 5px;
}

    span.employee_code.empinfoin img {
        filter: none;
        width: 22px;
    }

.reginpaneltop {
    margin-bottom: 0px;
}

.reginpanel {
    margin-bottom: 15px;
}

.arempcode span.input-group-btn input {
    height: 40px;
    background: #0a3b7e;
    color: #fff;
    border-radius: 0px 5px 5px 0px;
}

.arbtnreset .red {
    height: 40px;
    border: 1px solid #ff4500;
    color: #ff4500;
    border-radius: 3px !important;
    background: transparent;
}

.aremptable .top.last {
    margin-left: 0;
    margin-bottom: 9px !important;
}

.docemp {
    margin: 0px;
    display: flex;
    flex-wrap: wrap;
}

.loder_cs {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 999999999999;
    background: url(../images/loader.gif) 50% 50% no-repeat rgb(249,249,249);
    background-position: center;
    background-size: 77px;
    background-repeat: no-repeat;
    opacity: .8;
}

.left-menu ul {
    overflow-y: initial;
}

.daterangepicker.show-calendar .drp-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.daterangepicker .drp-buttons .btn.applyBtn {
    min-width: initial;
}

.tdstable div {
    overflow: scroll;
}

.it-declar .summary-wrapper a {
    max-width: 63%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.PrevEmp {
    width: 100%;
}

    .PrevEmp .form-group {
        width: 50%;
    }

.holidayrow .pageheader-left {
    position: inherit;
}

.holidayrow .mbdrop.open {
    max-width: 260px;
}

.jobdetailsin {
    display: flex;
    align-items: center;
    column-gap: 10px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 8px;
}

    .jobdetailsin .jobexp span, .jobdetailOpen span {
        color: #828282;
    }

    .jobdetailsin .jobexp .fw-600 {
        border-left: 2px solid #b9b9b9;
        padding-left: 6px;
    }

.jobdetailOpen {
    padding-top: 10px;
}

    .jobdetailOpen .jobnumber {
        color: #fff;
        clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
        background: #09bef3;
        padding: 2px 24px;
        display: inline-block;
    }

p.joblocation .fw-600 {
    border-left: 2px solid #b9b9b9;
    padding-left: 10px;
}

.jobdetailjob .fw-600 {
    padding-right: 5px;
}

.jobpanel .panel-heading h5 {
    margin: 0;
}

.jobpanel .panel-body {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.jobpanel {
    margin-top: 10px !important;
}

    .jobpanel ul li, .jobpanel ol li {
        position: relative;
        padding-left: 18px;
        line-height: 27px;
    }

        .jobpanel ul li:before, .jobpanel ol li:before {
            content: "\e930";
            font-family: 'feather' !important;
            font-weight: 500;
            padding-right: 5px;
            font-size: 16px;
            position: absolute;
            left: 0;
        }

.offbordmain {
    display: flex;
    width: 100%;
    column-gap: 15px;
}

    .offbordmain .panel {
        width: 100%;
    }

.offstatus span {
    white-space: nowrap;
}

.offright {
    max-width: 400px;
}

    .offright .panel-body {
        background: #f0f4ff !important;
        border: 1px solid #eaeaea;
    }

    .offright .panelheadingtxt {
        background: #f0f4ff !important;
    }

    .offright hr {
        margin-top: 10px;
        margin-bottom: 10px;
        border-top: 1px solid #e5e5e5;
    }

    .offright .form-group {
        margin-bottom: 10px;
    }
/*.panel.reginpaneltop {margin-top: 10px;}*/
.col-md-7.resignleft .offbordmain {
    display: block;
}

.col-md-7.resignleft .offright {
    max-width: 100%;
}

.col-md-7.resignleft .noticeleave {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 10px;
}

    .col-md-7.resignleft .noticeleave .form-group {
        width: 33.333%;
    }

.offright .panelheadingtxt {
    border-bottom: 0;
}

.approvelistheading {
    background: #f0f4ff !important;
}

.noticesettingin .form-group {
    border-bottom: 1px solid #e1e1e1;
    padding-bottom: 10px;
}

.dateselectgoal {
    display: flex;
    align-items: center;
    column-gap: 15px;
    width: 100%;
}

    .dateselectgoal .date {
        width: 100%;
    }

.AcceptDocName {
    border: none !important;
    width: auto !important;
    height: auto !important;
    background: transparent;
    color: #fff !important;
    max-width: none;
    min-width: unset !IMPORTANT;
}

.AcceptDocRemark {
    border: none !important;
    padding: 0 !important;
    color: #0a3b7e !important;
    font-size: 16px !important;
    text-transform: capitalize;
    background: transparent;
    height: auto !important;
    margin-bottom: 10px !important;
    font-weight: 500 !important;
}

.signheading h3 {
    color: #0F4F92;
    font-size: 16px;
    margin-bottom: 5px;
    margin-top: 0px;
}

.signheading p {
    color: #333333;
    font-size: 14px;
    margin-bottom: 0px;
}

.signtabbox ul.nav.nav-tabs {
    column-gap: 5px;
    padding-bottom: 15px;
}

    .signtabbox ul.nav.nav-tabs li {
        border: 1px solid #D9D9D9 !important;
        border-bottom: 5px;
        max-width: 33.333%;
        border-radius: 5px;
    }

        .signtabbox ul.nav.nav-tabs li a {
            display: block;
            min-height: 71px;
        }

            .signtabbox ul.nav.nav-tabs li a h3 {
                color: #0F4F92;
                font-size: 14px;
                margin-top: 0px;
                margin-bottom: 5px;
            }

            .signtabbox ul.nav.nav-tabs li a span {
                color: #333333;
                font-size: 12px;
                white-space: normal;
            }

            .signtabbox ul.nav.nav-tabs li a:before {
                content: none;
            }

        .signtabbox ul.nav.nav-tabs li.active {
            background: #e1edff;
        }

.file-container h3 {
    font-size: 16px;
    color: #333333
}

label.signinputlable {
    border: 1px solid #D9D9D9;
    border-radius: 5px;
    padding: 10px;
    position: relative;
    margin: 0;
    width: 100%;
}

    label.signinputlable input#fileInput {
        position: absolute;
        top: 0;
        opacity: 0;
        height: 100%;
    }

.file-container {
    max-width: 70%;
    margin-left: auto;
    margin-right: auto;
    padding: 30px 0px;
}

.signfilesize {
    color: #666666;
    font-size: 12px;
    font-style: italic;
}

.file-container #fileDetails p {
    border-bottom: 1px solid #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#imgUploadedSign {
    width: 150px;
    height: 100px;
    object-fit: contain;
}

.signfilename {
    border: 1px solid #0F4F92;
    padding: 3px 11px;
    display: inline-block;
    margin-bottom: 5px;
    border-radius: 100px;
    color: #5c95d0;
}

    .signfilename .delete-icon {
        padding-left: 8px;
        padding-top: 3px;
        display: inline-block;
        cursor: pointer;
    }

        .signfilename .delete-icon i {
            font-weight: 600;
            color: #0F4F92;
        }

.file-container .replace-btn {
    border-radius: 10px;
    border: 1px solid;
    color: #0F4F92;
    padding: 6px 23px;
    background: transparent;
}

    .file-container .replace-btn img {
        padding-right: 8px;
        width: 26px;
    }

.typesignmain {
    display: flex;
    justify-content: space-between;
    column-gap: 5px;
    padding: 30px 15px;
}

.signoutput {
    width: 270px;
    background: #eaeaea;
    border-radius: 5px;
}

.signoutput {
    width: 270px;
    background: #eaeaea;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.typesignmain label {
    margin: 0;
    padding-bottom: 4px;
}

.typesignmain .signdate input {
    border: 0;
    background: transparent;
    padding: 0;
    height: auto !important;
    font-size: 15px;
}

.signpanel {
    margin: 0px 15px 15px
}

#signatureCanvas {
    border: 1px solid #727272;
    width: 100%;
    max-width: 600px;
    height: 200px;
    cursor: crosshair;
    display: block !important;
    background: #D9D9D9;
    border-radius: 5px;
}

.signcanva {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.signcontrols {
    display: flex;
    justify-content: flex-end;
    margin-top: 5px;
}

    .signcontrols .greencolor {
        padding: 4px 12px !important;
        min-width: auto;
        height: auto;
    }

.signtabbox .filterFooter {
    margin-top: 30px;
}

#signmodal .panel-body {
    padding-bottom: 0px !important;
}

#output {
    display: flex;
    align-items: center;
    justify-content: center;
}

@font-face {
    font-family: 'James Fajardo';
    src: url('fonts/signature/JamesFajardo.woff') format('woff2'), url('fonts/signature/JamesFajardo.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.signoutput #outputDiv {
    font-family: 'James Fajardo';
    font-size: 40px;
    word-wrap: break-word;
    word-break: break-word;
    padding: 5px;
    line-height: 31px;
}

label.signinputlable span i {
    padding-right: 10px;
}

.sightype {
    width: 250px;
}

#fileDetails #thumbnail {
    margin-left: auto;
    width: 100px;
    height: 40px;
    object-fit: contain;
    margin-bottom: 5px;
    border: 1px solid #eaeaea;
    border-radius: 5px;
}

#output img {
    max-width: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 5px;
    border: 1px solid #d3d3d3;
    border-radius: 5px;
}

.signcanvamain {
    display: flex;
    padding: 0px 15px;
    column-gap: 5px;
}

td.siftheaderdata.clsEmpName, th.siftheader.clsEmpName {
    left: 130px !important;
}

/*Probation Review*/
.empcodenum {
    color: #6c6c6c;
}

.progressnumber {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color: #000;
}

.Probationprogress .progress-bar {
    background: #5B9EE4
}

.completetext {
    margin: 0;
    color: #5B9EE4;
    padding-top: 5px;
}

.approvedtext {
    margin: 0;
    color: #2CB34C;
}

.notstatus {
    background: #E7E7E7;
    border: 1px solid #666666;
    padding: 5px 8px;
    border-radius: 5px;
    color: #666666;
}

.donestatus {
    background: #ECF5FF;
    border: 1px solid #0F4F92;
    padding: 5px 8px;
    border-radius: 5px;
    color: #0F4F92;
}

.reviewstatus {
    background: #FFF5E8;
    border: 1px solid #FF9F18;
    padding: 5px 8px;
    border-radius: 5px;
    color: #FF9F18;
    font-weight: 500;
    white-space: nowrap;
}

.deletestatus {
    background: #FFEAE8;
    border: 1px solid #FF1E00;
    padding: 5px 8px;
    border-radius: 5px;
    color: #FF1E00;
}

.pendingstatus {
    background: #FFEFE5;
    border: 1px solid #FF843F;
    padding: 5px 8px;
    border-radius: 5px;
    color: #FF843F;
}

.confirmedstatus {
    background: #E7FFEC;
    border: 1px solid #03C030;
    padding: 5px 8px;
    border-radius: 5px;
    color: #03C030;
}

.statusdate {
    color: #0F4F92;
    margin: 0;
    padding-top: 5px;
}

.empboxmain {
    display: flex;
    column-gap: 15px;
    border: 1px solid #DDDDDD;
    padding: 15px;
    align-items: center;
    border-radius: 5px;
    background: #fff;
    overflow: auto;
}

.namelatter {
    border: 1px solid #0A3B7E;
    font-weight: 500;
    font-size: 30px;
    padding: 10px;
    border-radius: 5px;
    background: #E3EFFF;
    color: #0A3B7E;
}

.empnamedetails h4 {
    font-size: 15px;
    margin-top: 0;
    margin-bottom: 5px;
    white-space: nowrap;
}

.empnamedetails p {
    color: #888888;
    margin-bottom: 0;
    font-size: 14px;
}

.empnamedetails {
    border-right: 1px solid #b3b3b3;
    padding-right: 30px;
}

.proempdetailsin h4 {
    font-size: 15px;
    margin-top: 0;
    margin-bottom: 5px;
    white-space: nowrap
}

.proempdetailsin p {
    color: #727272;
    white-space: nowrap;
}

.proempdetails {
    column-gap: 30px;
    display: flex;
    width: 100%;
}

.proempstatus {
    margin-left: auto;
    margin-right: 10px;
    padding-right: 10px;
}

.Reviewtabs .dash_head {
    padding: 0;
}

    .Reviewtabs .dash_head .nav-tabs a {
        padding: 15px;
    }

.Reviewtabs {
    margin-top: 10px;
}

.Reviewbox h3 {
    color: #0F4F92;
    margin-top: 10px;
    font-size: 16px;
}

.quesbox {
    border: 1px solid #c8c8c8;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 15px;
}

.quesnumbers {
    margin-top: 0;
    color: #0F4F92;
    font-size: 16px;
}

.ques-list {
    color: #000;
    font-size: 15px;
}

    .ques-list span {
        font-weight: 500;
        color: #ff5f3f;
    }

.queschecks {
    display: flex;
    column-gap: 15px;
    flex-wrap: wrap;
    row-gap: 10px;
}

.quescomment h4 {
    margin-bottom: 6px;
    font-size: 14px;
    color: #434343;
}

.Reviewbox textarea {
    max-width: 900px;
}

.filechoose [type=file]::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: block;
    height: 100%;
    padding: 0.4375rem 1rem;
    line-height: 33px;
    color: var(--blackfontcolor);
    content: "Browse";
    background-color: #ebeef2;
    border-left: inherit;
    border-radius: 0 4px 4px 0;
    font-size: 12px;
}

.filechoose {
    position: relative;
    max-width: 400px;
}

    .filechoose input[type=file]::file-selector-button {
        background-color: #fff;
        color: #000;
        border: 0px;
        border-right: 1px solid #e5e5e5;
        margin-right: 20px;
        transition: .5s;
    }

    .filechoose input[type=file]:focus {
        outline: none;
    }

.ReviewFormFooter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #e9e9e9;
    padding: 10px 20px;
}

.Reviewbtngroup {
    display: flex;
    column-gap: 10px;
}

.buttondrop ul.dropdown-menu {
    top: auto;
    bottom: 48px;
}

.Probationbuttondrop .dropdown-menu {
    padding: 10px;
}

.btnNotRecommend {
    background: #FFECEC;
    color: #FF5353;
    border: 1px solid #FF5353;
    font-size: 12px;
}

.btnExtentpip {
    background: #EAF4FF;
    color: #0F4F92;
    border: 1px solid #0F4F92;
    font-size: 12px;
}

.btnExtent {
    background: #EAF4FF;
    color: #0F4F92;
    border: 1px solid #0F4F92;
    font-size: 12px;
}

.btnConfirmation {
    background: #E8FFED;
    color: #2CB34C;
    border: 1px solid #2CB34C;
    font-size: 12px;
}

.Probationbuttondrop .dropdown-menu .btn {
    margin-bottom: 5px;
}

.rowdeletebutton.btn {
    background: transparent;
    color: #0f4f92;
    font-size: 18px;
}

.Improvementfilter {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    column-gap: 10px;
    align-items: center;
    padding-bottom: 10px;
}

    .Improvementfilter label {
        font-weight: 500 !important;
        margin-bottom: 0px;
    }

.commentarea label {
    margin-left: 0;
    font-weight: 500 !important;
    color: #333;
}

.submintarea {
    padding-top: 15px;
    display: flex;
    justify-content: flex-end;
}
/*.commentarea {padding-top: 15px;}*/
#EmployeeReview .radioboxdatalabel label, #EmployeeReview .checkboxdatalabel label {
    font-size: 14px;
    margin-bottom: 0;
    margin-left: 27px;
    color: #727272
}

    #EmployeeReview .radioboxdatalabel label:after, #EmployeeReview .checkboxdatalabel label:after {
        top: 0;
    }

    #EmployeeReview .radioboxdatalabel label:before {
        top: 5px;
    }

    #EmployeeReview .checkboxdatalabel label:before {
        top: 0px;
    }

#EmployeeReview .clsRatingTypeItems {
    border: 1px solid #eaeaea !important;
    padding: 15px;
    margin-bottom: 15px;
}

    #EmployeeReview .clsRatingTypeItems .title {
        display: flex;
        column-gap: 8px;
        font-size: 14px;
        font-weight: 500;
    }

#divQuestionBox .clsRankingType h5.title {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

.Rankingmain select {
    width: 100%;
    margin-bottom: 20px;
}

.buttonarrow {
    background: #EAF4FF;
    color: #0F4F92;
    border: 1px solid #0F4F92;
    font-size: 20px;
}

#divQuestionBox .quescomment {
    margin-top: 20px;
}

/*======Probation Review===========*/
.PosSticky {
    position: sticky;
    top: 20px;
}

.finalapprovtab, .finalapprovtab li a {
    display: block;
}

.levelblock2 span img {
    max-width: 30px;
    width: 100%;
}

.finalapprovtab li {
    border: 1px solid #D9D9D9;
    margin-bottom: 10px;
    background: #fcf8f8;
    border-radius: 5px;
    padding: 10px;
}

    .finalapprovtab li:last-child {
        margin-bottom: 0px;
    }

.tablequesmain span.enable_data {
    margin-right: 10px;
}

table.table tr th.bg-blue-color {
    background: #e6eff9 !important;
    border: 1px solid #d7d7d7 !important;
    padding: 10px 10px !important;
}


.finalapprovtab {
    margin-top: 10px;
}

.levelblock1 {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #000;
}

.lableExtend {
    background: #ECF5FF;
    padding: 3px 8px;
    color: #0F4F92;
    border: 1px solid #0F4F92;
    border-radius: 5px;
    font-size: 12px;
}

.levelblock2 {
    display: flex;
    align-items: flex-start;
}

.levelblock2inner label {
    display: block;
    margin-bottom: 0;
    color: #888888;
    font-size: 13px;
}

.levelblock2inner .emprh-level {
    font-weight: 500 !important;
    color: #000;
}

.approvedate label {
    display: flex;
    margin-bottom: 3px;
    column-gap: 5px;
    flex-wrap: wrap;
}

.approvedate {
    margin-left: auto;
    font-size: 12px;
}

    .approvedate label span:first-child {
        font-weight: 500;
        white-space: nowrap;
    }

.probdatestart {
    color: #03C030
}

.probdateend {
    color: #FF5353
}

.lableconfirm {
    background: #E8FFED;
    color: #2CB34C;
    border: 1px solid #2CB34C;
    padding: 3px 8px;
    border-radius: 5px;
    font-size: 12px;
}

.prapprovalmain {
    display: flex;
    column-gap: 0px;
}

    .prapprovalmain .approvalleft {
        min-width: 350px;
    }

.tableaprovans {
    background: #F8FBFF;
    border: 1px solid #B3CBE3;
    padding: 10px 10px 10px;
    border-radius: 5px;
    position: relative;
    display: inline-block;
}

.tableaprtd {
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 5px;
}

.tablecomment .tablelabel {
    display: block;
}

.attechmentmain {
    margin-top: 10px;
}

.tableattechment span {
    display: inline-block;
    padding: 4px 7px;
    border: 1px solid var(--bluecolor);
    color: var(--bluecolor);
    font: 500 10px 'Roboto', sans-serif;
    margin: 0;
    border-radius: 5px;
    background: #eaf0f7;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 200px;
    margin-bottom: 5px;
}

.tableaprtd span.enable_data {
    flex-wrap: nowrap;
}

.tablelabel {
    font-weight: 500;
}

.approvalright {
    width: 80%;
}

.probpanel {
    margin-top: 10px;
}

.finalapprovtab li.active {
    background: #edf1ff;
}

span.enable_data {
    flex-wrap: wrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    background: #F1F1F1;
    border-radius: 30px;
    column-gap: 8px;
    font: 400 13px 'Roboto', sans-serif;
    /*margin-bottom: 10px;*/
}

    span.enable_data i {
        background: #32BF00;
        color: #fff !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 17px;
        height: 17px;
        border-radius: 50%;
        font-size: 13px;
    }

.quesmain {
    border: 1px solid #eaeaea;
    border-radius: 5px;
    margin-bottom: 15px;
    padding: 15px;
}

label.commentlable {
    display: block;
    margin-top: 14px;
    margin-left: 0;
    font-weight: 500;
    font-family: Roboto, sans-serif;
    font-size: 14px;
    margin: 0;
}

.commenttext {
    color: #727272;
    margin: 0px;
}

.probcommentbox {
    display: flex;
    align-items: flex-start;
    column-gap: 10px;
    padding-top: 9px;
}

.rattingtypeques {
    border: 1px solid #eaeaea;
    margin-bottom: 10px;
    display: flex;
    column-gap: 10px;
    padding: 10px;
    border-radius: 5px;
}

.rattingtyplabe {
    border-radius: 23px;
    margin-right: 10px;
    color: #333;
    display: inline-block;
    font-size: 12px;
    margin-top: 10px;
}

.rattingqusnum {
    display: block;
}

/*.finalapprovtab li.active:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
    border-left: 25px solid #edf1ff;
    border-right: 0;
    right: -20px;
    z-index: 1;
    top: 33px;
}*/

.tableapprovedate {
    margin-left: auto;
}

.piptablecomment, .pipcommentbox {
    margin-top: 10px;
}

span.disable_data {
    flex-wrap: wrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    background: #F1F1F1;
    border-radius: 30px;
    column-gap: 8px;
    font: 400 13px 'Roboto', sans-serif;
    margin-bottom: 10px;
}

    span.disable_data i {
        background: #F65C5C;
        color: #fff !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 17px;
        height: 17px;
        border-radius: 50%;
    }

.quesmain .ansbox span.enable_data {
    margin-right: 10px;
}

span.rattingtyplabe.clsCorrectAns i {
    color: #fff;
    border-radius: 50px;
    background: #32BF00;
    padding: 2px;
    font-size: 13px;
    width: 17px;
    height: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.quesmain .clsRanking {
    display: flex;
    column-gap: 10px;
    flex-wrap: wrap;
}

    .quesmain .clsRanking .title {
        background: #f1f1f1;
        display: flex;
        padding: 6px 12px;
        border-radius: 50px;
        margin-bottom: 15px;
    }

        .quesmain .clsRanking .title .ansbox {
            background: #32bf00;
            height: 17px;
            text-align: center;
            margin-left: 5px;
            color: #fff;
            border-radius: 50px;
            min-width: 17px;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 5px;
            font-size: 12px;
        }

.panel-default > .panel-heading.protoppanalheading {
    display: flex;
    align-items: center;
    padding: 6px 15px !important;
    flex-wrap: wrap;
    row-gap: 5px;
}

.prodatepiker {
    margin-left: auto;
}

    .prodatepiker input {
        border: 1px solid #0A3B7E;
        border-radius: 4px;
        background: rgba(10, 59, 126, 0.10) url(../../images/menu_icon/calendar.svg) no-repeat 93% center;
        padding: 10px 15px 10px 12px;
        font: 500 15px 'Roboto', sans-serif;
        cursor: pointer;
        color: #0A3B7E;
        width: 173px;
    }

.relable {
    display: block;
    margin: 0;
    margin-bottom: 6px;
    font-family: Roboto, sans-serif;
    font-size: 16px;
}

div#divViewAttachments a {
    background: #f2f6fb;
    color: #0F4F92;
    padding: 8px;
    border: 1px solid #0F4F92;
    border-radius: 5px;
    font-size: 11px;
}

div#divViewAttachments {
    padding-top: 10px;
}

ul.arroveattech li a {
    width: 80px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 4px 7px;
    border: 1px solid var(--bluecolor);
    color: var(--bluecolor);
    font: 500 10px 'Roboto', sans-serif;
    border-radius: 5px;
    display: inline-block;
}

.arroveattech li {
    background: transparent;
    border: none;
    margin: 0;
    padding: 0;
}

.arroveattech {
    display: flex;
    column-gap: 5px;
    flex-wrap: wrap;
    row-gap: 5px;
    margin-top: 5px !important;
}

#divReviewActions {
    display: flex;
    flex-wrap: wrap;
    row-gap: 3px;
    column-gap: 5px;
}

.ansbox span {
    margin-bottom: 5px;
    margin-right: 5px;
}

.multiqueslable {
    display: inline-block;
    margin-bottom: 5px;
    margin-right: 5px
}

.multians span.enable_data {
    margin-right: 5px;
    margin-bottom: 5px;
}

span.enable_data.quessingal {
    flex-wrap: nowrap;
}

li.Finalattehment {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 10px;
    row-gap: 10px;
}

.skybtn {
    background: var(--skyhoverblue);
    color: #fff;
}

    .skybtn:hover {
        color: #fff;
    }

span.multinumber {
    background: #32BF00;
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: 17px;
    border-radius: 50px;
    font-size: 13px;
    min-width: 17px;
    padding: 3px;
}


.Probationth label {
    margin-left: 0px;
}

.table.rhtablemain tr th, .table.rhtablemain tr td {
    vertical-align: top !important
}

.commonarea {
    max-width: 400px;
}

    .commonarea h3 {
        font-size: 14px;
    }

.Probationth .reviewstatus {
    margin-left: 5px;
}

.rhcommentarea p {
    color: #727272
}

.rattingqusbox {
    border: 1px solid #eaeaea;
    padding: 5px 8px;
    margin: 5px 0px;
    border-radius: 5px;
}

    .rattingqusbox p.title {
        font-weight: 500;
        font-size: 14px;
    }

.ProbationReviewbody .radioboxdatalabel label, .ProbationReviewbody .checkboxdatalabel label {
    font-size: 14px;
    margin-left: 30px;
    color: #605e5e;
    padding-top: 2px;
}

    .ProbationReviewbody .radioboxdatalabel label:before {
        top: 5px
    }

    .ProbationReviewbody .radioboxdatalabel label:after {
        top: 0px;
    }

.questext {
    margin-top: 0;
    color: #0F4F92;
    font-size: 15px;
    line-height: 22px;
}

.reviverboxques {
    padding: 10px 0px;
}

.rhrattingbox {
    flex-wrap: wrap;
    display: flex;
    column-gap: 10px;
}

    .rhrattingbox .main_wrapper.eventcircle {
        min-width: 150px;
    }

.reviverboxques .quescomment {
    padding-top: 15px;
}

.rattingansbox {
    border: 1px solid #eaeaea;
    padding: 10px 10px;
    border-radius: 5px;
    margin: 5px 0px;
}

    .rattingansbox p.title {
        font-weight: 500;
        font-size: 14px;
    }

.reviverbox {
    background: #f1f7fd !important;
    border: 1px solid #ddd;
    padding: 15px;
}

    .reviverbox .levelblock1 {
        padding-bottom: 10px;
    }

        .reviverbox .levelblock1 .count {
            color: #0f4f92;
            font-weight: 500;
        }

    .reviverbox .levelblock2inner label {
        color: #727272;
    }

    .reviverbox .commonarea p {
        color: #727272;
        font-size: 13px;
    }

.feedfilterleft {
    margin-left: auto;
}

.feedlable span {
    color: #337ab7;
}

.feedlable {
    color: #727272;
}

.byfeed {
    color: #000;
}

.flex.postby.postbytwo a {
    column-gap: 15px;
    display: flex;
    flex-wrap: wrap;
}

.panel-hinner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-bottom: 5px;
    flex-wrap: wrap;
}

.SuggesExt .Probationdate {
    width: auto;
}

.SuggesExt {
    display: flex;
    align-items: center;
    padding-top: 5px;
    flex-wrap: wrap;
    row-gap: 10px;
    justify-content: center;
    border-top: 1px solid #eaeaea;
}

.Suggesdate {
    display: flex;
    align-items: center;
    column-gap: 8px;
    margin-right: 15px;
}

    .Suggesdate span {
        white-space: nowrap;
    }

    .Suggesdate .form-control {
        width: 80px;
    }

.customrowcol {
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
}

    .customrowcol .col {
        width: 24%;
        flex: 0 0 auto;
    }

.attechlable label {
    margin-left: 0;
}

.FooterAreainner {
    display: flex;
    column-gap: 10px;
    align-items: center;
}

.multichecklable span.enable_data {
    margin-bottom: 5px;
    margin-right: 5px;
}

.uploaddocbtn {
    margin-left: 5px !important;
    display: none;
}


.uploadheader .panelheadingtxt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100% !important;
}

    .uploadheader .panelheadingtxt .filterbutton {
        display: none;
    }

.emptotal {
    border-right: 1px solid #727272;
    padding-right: 10px;
}

.emprecodemian select {
    display: flex;
    width: 70px;
    height: 12px;
    line-height: 40px;
    padding: 3px;
}

.paginteam {
    border-right: 1px solid #908b8b;
    padding-right: 10px;
}

@media screen and (min-width: 1200px) and (max-width: 20000px) {
    .sidebar, .sideBarss {
        display: block !important;
    }
}

@media screen and (min-width:992px) and (max-width:20000px) {
    .menu_list.gclose:not(:hover) {
        width: 63px;
    }

        .menu_list.gclose:not(:hover) .sub_ats_menu_css {
            display: none !important;
        }

    body.gmenuclose .masterInnerNavbar, body.gmenuclose .masterInnerBody {
        padding-left: 80px;
        transition: padding 500ms ease;
    }

    #modelerror1 .modal-dialog {
        width: 740px;
    }
}

@media only screen and (max-width: 1600px) {
    .iconData i, .iconDatapara i {
        margin-left: 5%
    }
}

@media only screen and (max-width: 1500px) {
    .birdthdaydata {
        column-gap: 16%;
    }

    .leaveperfomancelist li {
        width: 100%;
    }

    .AvailMemberimg .myteamimg {
        margin-right: -24px;
    }

    .bookotsearch {
        flex-direction: column;
    }

    .customrowcol .col {
        width: 32%;
    }
}

@media only screen and (min-width: 1500px) {
    .PendingRequests .col-md-8 {
        width: 75%;
    }

    .PendingRequests .col-md-4 {
        width: 25%;
    }
}

@media only screen and (max-width: 1365px) {
    .certificaterow {
        flex-wrap: wrap;
    }

    .p-requeststop {
        padding-left: 5px;
        padding-right: 5px;
    }

    .dashbodylist .count_data {
        column-gap: 10px;
    }

    .dashbodylist li p {
        font-size: 12px;
    }

    .AvailMemberimg .myteamimg {
        margin-right: -22px;
    }

    .customrowcol .col {
        width: 48%;
    }
}

@media only screen and (max-width: 1199px) {
    .tab-program-box {
        margin-bottom: 15px;
    }

    .leftWbox, .rightWbox {
        position: relative;
        width: 100%;
    }
    /*.main {padding: 0px 0px 0px 0px !important;}*/
    a.openSidepanel {
        display: block;
    }

    .openmenu {
        background: rgb(0 0 0 / 53%);
        content: "";
        height: 100%;
        width: 100%;
        display: block;
        position: absolute;
        z-index: 10;
    }

    .open_overlay .overlaybackground {
        background: rgb(0 0 0 / 53%);
        content: "";
        height: 100%;
        width: 100%;
        display: block;
        position: absolute;
        z-index: 3;
    }

    body .footerWrapper {
        padding: 8px 0 8px 70px !important
    }

    .left-menu ul li.logout {
        bottom: 160px;
    }

    body.open_overlay .overlaybackground {
        z-index: 99;
    }

    .fixButton {
        width: auto;
        min-width: auto;
    }

    .fixPanel {
        position: fixed;
        right: 0;
        top: 0;
        width: 400px;
        background: #fff !important;
        z-index: 99;
        transform: translateX(400px);
        opacity: 0;
        transition: all 500ms ease;
        height: 100vh;
        overflow-y: auto;
        border-radius: 0px;
        border: none;
    }

        .fixPanel.open {
            opacity: 1;
            transform: translateX(0);
            transition: all 500ms ease;
        }

        .fixPanel .panel-heading {
            background: var(--bluecolor) !important;
            border: none;
            color: #fff;
        }

        .fixPanel .panel-heading {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .fixPanel .filterclose {
            display: block;
        }

    body.open_overlay .datepicker-dropdown {
        z-index: 99 !important;
    }

    .fixPanelfooter {
        background: #f6f6f6;
    }

        .fixPanelfooter .pull-right {
            float: none !important;
            width: 100%;
            display: flex;
            justify-content: space-between;
            padding-bottom: 10px;
        }

    .fixPanel .frmTxtBx {
        width: 100% !important;
    }

    .addG.modal-dialog {
        width: 90% !important;
    }

    .attendanceboxicon {
        height: 30px;
        width: 30px;
        font-size: 20px;
    }

    .attendanceboxtime h4 {
        font-size: 13px;
    }

    .attendanceboxtime {
        margin-left: 3px;
    }

    .attendanceboxbtn a.btn {
        padding: 7px 10px;
    }

    .attendanceboxtime h3 {
        font-size: 16px;
    }

    .attendanceboxtime h4 {
        margin-bottom: 5px;
    }

    .quickmenu .dropdown-menu-left {
        transform: translate(30%);
    }

    .attendancetrend h3 {
        margin-bottom: 0px;
    }

    .attendancetrend {
        margin-top: 5px;
    }

        .Departmentdata .highcharts-container, .attendancetrend .highcharts-container, #containerDepartmentWisePresent {
            height: 215px !important;
        }

    #divFailBranchAtt, #divFailDepartmentAtt {
        height: 230px !important;
    }

    .clsdivAttTrend .highcharts-container {
        height: 505px !important;
    }

    .clsdivAttTrend .clsattendancetrend {
        height: 505px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media only screen and (max-width: 1280px) {
    body .scroll-table table.table tr td, body .scroll-table table.table tr th, .dashwhite .dash_head span {
        font-size: 12px;
        padding: 8px 10px;
    }

    body .scroll-table table.table tr td, body table.gtable tr td {
        padding: 8px 10px !important;
    }

    .assessmentQues-finish-btn {
        margin-left: inherit !important;
    }

    .assessmentQues-btns button {
        margin-bottom: 15px;
    }

    .selectemployefiltermodal .row.form-group-main .col-lg-12, #PopfilterBody .col-lg-12 {
        width: 50%;
    }

    ul.nav.nav-tabs li a:before {
        top: 0 !important;
    }
}

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

    .dropfilter .mbdrop {
        width: 240px;
        right: 5px;
    }

    .dropfilter .pagebutton.livetracfilter {
        flex-direction: column-reverse;
    }

    .ExcelToggle span {
        display: none;
    }

    .btn.btn-success i,
    .btn-primary i {
        display: block !important;
    }

    .btn.btn-success span,
    .greencolor span,
    .btn-info span,
    .btn-primary span,
    .btn.blue span {
        display: none !important;
    }

    body .footerWrapper {
        display: none;
    }

    .pageHead .col-sm-12.col-lg-7, .pageHead .col-sm-12.col-lg-5 {
        width: 100% !important;
    }

    .gtablink {
        flex-wrap: inherit;
    }

    .mt-25 {
        margin-top: 0;
    }

    .md-flex-wrap {
        flex-wrap: wrap;
    }

    #addTsk {
        padding: 0 !important;
    }

    #ctl00_CPH_cmbActivityItems {
        height: 50px !important;
    }

    .filterheader h4, .addnewsidebar .headerData h4 {
        font-size: 14px;
    }

    .recorperpage, #addtskbtn {
        display: none !important
    }

    .mobieScroll {
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        row-gap: 15px;
        width: 100%;
        height: 220px;
        overflow-y: auto;
        padding: 20px;
    }

        .mobieScroll .record-item {
            width: 100%;
        }

    #mobdropdata .select2-hidden-accessible {
        position: relative !important;
    }

    #mobdropdata .input-group, #mobdropdata select, #mobdropdata input {
        width: 100% !important;
        margin-left: 0 !important;
    }

    #mobdropdata .br-1.d-flex:first-child, #mobdropdata .br-1.d-flex:last-child {
        margin-top: 0;
        margin-bottom: 0;
    }

    .disUser,
    .btn.btn-primary.disUser.d-none {
        display: inline-block !important;
        padding: 10px 18px !important;
    }

    .pageheader-left .mbdrop, .mbdrop {
        position: absolute;
        right: 30px;
        top: 50px;
        width: 540px;
        background: #fff;
        z-index: 222;
        padding: 15px;
        box-shadow: 0 0px 2px rgba(0, 0, 0, 0.4);
        display: none;
    }

    .pageheader.open .mbdrop, .open.mbdrop {
        display: block;
    }

    .pageheader-left .mbdrop:after, .pageheader-left .mbdrop:before, .mbdrop:after, .mbdrop:before {
        content: "";
        position: absolute;
        top: -23px;
    }

    .pageheader-left .mbdrop:after, .mbdrop:after {
        right: 109px;
        border: 12px solid transparent;
        border-bottom-color: #fff;
    }

    .pageheader-left .mbdrop:before, .mbdrop:before {
        right: 110px;
        border: 11px solid transparent;
        border-bottom-color: rgba(0, 0, 0, 0.4);
    }

    .pageheader-left .mbdrop .d-flex {
        display: block !important;
        margin: 15px 0;
        min-width: inherit;
    }

    .mt-15 {
        margin-top: 15px;
    }

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

    .shimmerloaderdiv {
        position: relative;
    }

    .employee_info .shimmerloaderdiv {
        position: absolute;
    }

    .listbody li {
        margin-top: 15px;
    }

    .upcoming li p {
        font: 400 12px/20px 'Roboto',sans-serif;
    }

    .recent_body .postby .recent {
        font: 400 11px 'Roboto',sans-serif;
    }

    .recent_body .postby {
        flex-wrap: wrap;
        display: flex !important;
    }



    .eventcircle {
        width: 150px;
        height: 150px;
        position: relative;
    }

    .gflexdata, .pageheader .pagebutton, .top-search {
        justify-content: center;
        flex-wrap: wrap;
        row-gap: 10px;
    }

    .page-flex-end {
        justify-content: flex-end !important;
        width: 100%;
    }

    .navbar-nav {
        margin: 0px;
    }

    #main:after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 120%;
        background: rgba(0,0,0,0.4);
        display: none;
    }

    #main.openoverlay:after {
        display: block;
        z-index: 1;
    }

    #main {
        margin: 0 !important;
        padding: 0px 0 0 0 !important;
    }

    .allModuleBox {
        width: 90%;
    }

        .allModuleBox.modal.fade .modal-dialog {
            width: 100% !important;
        }

    body .scroll-table {
        height: calc(100vh - 272px) !important;
    }

        body .scroll-table.singal-col-scroll {
            height: calc(100vh - 223px) !important;
        }

    .AssessmentSettingsbox {
        flex: 1 1 30%;
    }

    .dodonts-row {
        flex-wrap: wrap;
    }

        .dodonts-row .dosbox {
            width: 100%;
            margin: 10px 0px !important;
        }

    .gpanel .panel-collapse > div.modal-assesment {
        padding-left: 100px;
    }

    .rightnav {
        width: 0 !important;
    }

    #traningleftbar {
        margin-right: 0px !important;
    }

    .navopen .rightnav {
        width: 400px !important;
    }

    .navopen .traningleftarrow {
        display: none;
    }

    .navopen .traningleftclose {
        right: 414px;
        position: fixed;
        font-size: 19px;
        visibility: visible;
        top: 200px;
    }

    .traningleftarrow {
        visibility: visible;
    }

    .assesmentdiv-row {
        flex-wrap: wrap;
    }

    .selectemployefiltermodal .row.form-group-main .col-lg-12, #PopfilterBody .col-lg-12 {
        width: 100%;
    }

    .overviwerow {
        flex-wrap: wrap;
    }

        .overviwerow .Overviewinfo {
            margin-bottom: 15px;
        }

    .iconData {
        width: 60%;
    }

    ul.nav.nav-tabs li a:before {
        top: 0 !important;
    }

    .mob-panel.panel-default > .panel-heading {
        background: #0f4f92;
        color: #fff;
        padding: 15px !important;
        border-radius: 5px 5px 0px 0px !important;
    }

    .mob-panel {
        background: #fff !important;
    }

        .mob-panel.panel-default > .panel-heading b {
            padding-left: 10px;
        }

    .mobdateRange {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        column-gap: 30px;
        width: 100%;
    }

    .mobdateRange-row1 {
        width: 60%
    }

    .mobdateRange-row2 {
        width: 40%
    }


    .bookotsearch {
        flex-direction: row;
        margin-top: 5px;
    }

    .JobReq-button input {
        min-width: auto;
    }

    .JobReq-button .btn.btn-info {
        background: var(--bluecolor) !important;
        border-color: var(--bluecolor) !important;
        color: #fff;
    }

    .mob-panel.panel-default > .panel-heading i {
        color: #185596;
    }

    .dataBox {
        height: auto !important;
    }

    .approvepnal .panelBtnsRight {
        justify-content: flex-start;
    }

        .approvepnal .panelBtnsRight .form-control {
            max-width: 45%;
        }

    .sidebar {
        left: 58px !important;
        top: 63px !important;
    }

    .JobRequisitionRow .JobReq-button {
        flex-wrap: nowrap;
    }

    .row.PendingRequests {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }


    .main_setting_page .topHeaderData {
        margin: 15px 0;
    }

    #AssignMoreEmployee .modal-dialog {
        width: 85% !important;
    }

    .taskinputs {
        border: none !important;
    }

    .filtersPanels.panel_border_class {
        margin-bottom: 0 !important;
    }

    body .filtersPanels.panel_border_class {
        padding-top: 0 !important;
    }

    body #addTsk {
        order: 2;
        overflow-x: auto;
    }

    body #showbx, body #showbx4 {
        position: relative;
        width: 100%;
        z-index: 1;
        top: initial;
        order: 1;
        padding: 0 !important;
    }

    .btnBoxSaveTask.text-right.taskViewPanelHeader {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 15px 0 0;
        column-gap: 10px;
        padding: 0;
    }

    .addNewTask {
        display: inline-block;
        font-size: 18px;
    }

    .pageheader-row.JobRequisitionRow .Records-bg {
        display: flex;
        justify-content: space-between;
        width: 100%;
        column-gap: 0;
    }

    .pageheader-row.JobRequisitionRow .mbdrop {
        width: 200px;
    }

    .pageheader .JobRequisitionRow .d-flex {
        display: block !important;
        margin: 5px 0px;
    }

    .pageheader .JobRequisitionRow .mbdrop:after, .pageheader .JobRequisitionRow .mbdrop:before {
        right: 6px;
    }

    .pageheader .JobRequisitionRow .d-flex .radioboxdatalabel {
        margin-bottom: 10px;
    }
    /******* Inbox Mailer CSS ********/
    .inboxsection {
        overflow: hidden;
        margin: 0;
        display: block;
        padding: 0 !important;
    }

    .leftside.inboxleft {
        padding: 8px;
    }

    .inboxfilter input {
        width: 100%;
    }

    .inboxleft .timestatus, .inboxleft .statusinner {
        display: block;
    }

    .inboxleft .chat-icon span {
        width: 30px;
        height: 30px;
        line-height: 30px;
    }

    .inboxright {
        border: 1px solid #eaeaea;
        padding: 0;
        position: fixed;
        top: 0;
        right: -7px;
        opacity: 0;
        visibility: hidden;
        width: 100%;
        transition: all 500ms ease;
        z-index: 99;
        width: 630px;
        height: 100%;
        background: #fff;
        overflow-y: scroll;
    }
        /*.inboxright.mailerOpen .mailboxdatainner{height: 100% !important;}*/
        .inboxright.mailerOpen .blackoverlay {
            position: fixed;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.5);
            display: block;
        }

    .inboxleft .leftside-chat {
        padding-right: 0;
    }

    .inboxright.mailerOpen {
        opacity: 1;
        visibility: visible;
        transition: all 500ms ease;
    }

    body .backList {
        font-size: 20px;
        display: inline-flex !important;
        position: absolute;
        right: 4px;
        color: rgba(0, 174, 250, 1) !important;
        top: 2px;
        cursor: pointer;
        justify-content: center;
        width: 30px;
        height: 30px;
        background: rgba(0, 174, 250, 0.17);
        z-index: 999;
        line-height: 30px;
        border-radius: 50px;
    }

    .chatheader {
        flex-wrap: wrap;
        row-gap: 15px;
        position: sticky;
        top: 0;
        background: #fff;
        border-bottom: 1px solid #eee;
        padding: 10px 0 15px 15px !important;
        margin-bottom: 8px;
    }

    body .whitebox .tab-content {
        padding-top: 15px;
    }

    .gtablelist ul {
        padding: 0 0 0 10px;
    }

    .gtablelist ul li {
        margin-bottom: 5px !important;
    }

    .gtablelist ul li label {
        padding: 2px 8px 5px 8px !important;
    }

    body .inboxright .tablescrollbar.scrollbar-inner > .scroll-element.scroll-y {
        right: 0;
    }

    body.mobilemenuopen .inboxright.mailerOpen {
        z-index: 11;
    }

    .apndMailDetail .timestatus span {
        font: 500 11px/16px 'Roboto', sans-serif;
        white-space: nowrap;
    }

    .rightsubject {
        font-size: 12px;
    }

    .apndMailDetail {
        margin: 0;
        padding: 0 0 30px;
    }

    .inboxsection .chatzonebranch, .chatInner {
        padding: 0 10px !important;
    }

    .inboxsection .chatzonebranch ul {
        display: block;
        white-space: nowrap;
        overflow-x: auto;
        padding-bottom: 10px;
        margin-bottom: 8px;
    }

    .inboxsection .chatzonebranch ul li {
        margin-right: 10px;
    }

    .apndMailDetail {
        border-radius: 0;
    }

    .inboxfilter a.greencolor {
        font-size: 20px;
        padding: 9px 10px;
    }

    .pagebutton.gpanel.inboxfilter {
        column-gap: 6px;
    }

    .inboxsection .inboxright .timestatus .title_heading {
        font-size: 12px;
        margin-bottom: 8px;
        display: block;
    }

    .filterTop .pageHead {
        margin: 0 !important;
    }
    /*body .inboxfilter i.feather-search {position: relative;top: inherit;left: inherit;font-size: 18px;color: #000;width: 42px;height: 42px;display: flex;align-items: center;justify-content: center;background: #fecb03;border: 1px solid #fecb03;border-radius: 5px;cursor: pointer;}*/
    .mailerOpen .col-sm-12.text-right.addNew {
        display: none;
    }
    /*.msearch{display: none;position: absolute;right: -40px;bottom: -80px;z-index: 99;width: 250px;padding: 12px;background: #fff;box-shadow: 0 0 1px rgba(0, 0, 0, 0.6);}
.msearch.searchOpen{display: block;}
.msearch .form-control{padding: 8px 15px;}*/
    .gpanel .input-group.date {
        min-width: 160px !important;
    }

    body .gpanel .input-group.date input {
        font-size: 11px;
        padding: 12px 6px !important;
    }

    .col-lg-3.inboxleftmain .greencolor {
        display: inline-block !important;
    }

    .inboxsection .inboxright .timestatus span {
        font: 500 11px 'Roboto', sans-serif
    }

    .inboxsection .chatheader {
        display: block;
    }

    .inboxsection .chatheadRight {
        margin-right: 15px;
    }

    .dropdown.text-center.infomailstatus .gaction_list {
        right: 5px !important;
    }

    .mailboxdatainner {
        background: #fff;
    }

    .inboxsection .inboxfilter {
        padding: 2px 5px 5px 5px;
    }

    /*.dropdown.gfilterpagi {
        padding-left: 10px;
    }*/

    body .gaction_list.webpuchdropdown {
        top: 55px !important;
        right: 0 !important;
    }

    .recent_body .postby.hpostby span {
        margin-top: 3px
    }

    .webpunchdata:after, .webpunchdata:before {
        rotate: 90deg;
    }

    .webpunchdata:before {
        left: auto;
        right: 20px;
        top: -90px;
        border-right: 19px solid #3d6d9e;
    }

    .webpunchdata:after {
        left: auto;
        right: 21px;
        top: -80px;
        border-right: 19px solid #f5f6fa;
    }

    .recent_body .postby span span {
        margin-top: 0;
    }

    .noticebutton .btn {
        padding: 6px 8px;
    }

    .noticebutton {
        column-gap: 5px;
    }

    .leftcol, .rightcol {
        padding-left: 0px;
        padding-right: 0px;
    }

    .rightcol {
        margin-top: 10px;
    }

    .dempname {
        font-size: 12px;
    }

    .teamstatsdata {
        display: flex;
        flex-wrap: wrap;
        min-height: 110px;
    }

    .holidayrow .pagebutton {
        margin-bottom: 0px;
    }

    body .btn.btn-info, body .btn.btn-primary, body .btn.btn-success {
        min-width: 50px;
        padding: 8px;
        height: auto;
    }

    .empactionlist li {
        margin-bottom: 5px !important;
    }

    .empactionlist {
        margin-top: 15px;
    }

    .dashbodylist.empactionlist li:last-child {
        padding-right: 0px !important;
    }

    .greencolor {
        min-width: 50px !important;
    }

    .prapprovalmain {
        display: block;
    }

    .finalapprovtab {
        display: flex;
    }

    .approvalright {
        width: 100%;
    }

    .finalapprovtab li.active:before {
        bottom: -30px;
        top: auto;
        rotate: 90deg;
        left: 47%;
    }

    .ProbFinalleft {
        padding-bottom: 20px;
        overflow: auto;
    }

    .prapprovalmain .approvalleft {
        min-width: inherit;
    }

    .empnamedetails {
        padding-right: 15px;
    }

    .empboxmain, .proempdetails {
        column-gap: 10px;
    }

    .proempdetailsin h4, .proempdetailsin p, .empnamedetails p {
        font-size: 12px;
    }


    .probcommentbox {
        display: block;
    }

    .finalapprovtab li {
        margin-right: 10px;
    }

    .approvedlist {
        clear: both;
    }

    #moodIcons {
        gap: 0 !important;
        flex-wrap: wrap;
        padding: 30px 0 0px;
    }

    .reason-text {
        font-size: 12px;
        padding: 3px 8px;
    }

    .divMoodReasons {
        row-gap: 10px;
    }

    #moodModal .modal-body label {
        padding-bottom: 15px;
    }

    .arrowtopright::before, .arrowtopright::after {
        right: 15px;
    }

    .open_overlay .disUser {
        z-index: 999;
    }

    .ReviewFormFooter {
        position: fixed;
        bottom: 0;
        width: 88%;
    }

    .paginteam {
        display: none;
    }
    .FooterAreainner select#cmbSubmitAction {
        padding: 0 10px;
        height: 30px;
        min-height: 30px;
    }
}

@media only screen and (min-width: 768px) {
    .uploadfilterbody {
        height: auto !important
    }
}

@media only screen and (max-width: 767px) {
    .rRedoc {
        display: none !important;
    }

    .emprecodemian .emptotal {
        display: none;
    }

    .empdetailsbox .form-group span {
        display: block;
    }

    .btn.btn-primary.ImprestClaim {
        background-image: url(../images/send.svg) !important;
        background-position: center;
        background-repeat: no-repeat !important;
        width: 33px !important;
        text-indent: 999px;
        color: #26ac46;
        min-width: 33px;
        padding: 17px !important;
        background-position: 33% 66% !important;
        background-size: 67% !important;
    }

    .btn.btn-info.addExpense {
        background-image: url(../images/plus.svg) !important;
        background-position: center;
        background-repeat: no-repeat !important;
        width: 33px !important;
        text-indent: 999px;
        color: #26ac46;
        min-width: 33px;
        padding: 17px !important;
        background-position: center center !important;
        background-size: 55% !important;
    }

    .backbtn {
        padding: 4px 8px;
    }

    .mobshowleft {
        position: fixed;
        top: 0;
        right: -400px;
        width: 90%;
        max-width: 400px;
        height: 100%;
        transition: right 0.3s ease-in-out;
        z-index: 1000;
        padding: 0px;
    }

    .emploan span.mutedDetails {
        display: block;
        font-size: 13px;
    }

    .emploan .employeeContactDetails1 {
        font-size: 13px;
    }

    .uploadheader .panelheadingtxt .filterbutton {
        display: block;
    }

    .mob-panel.panel-default > .panel-heading.uploadheader {
        background: #0f4f92 !important;
    }

        .mob-panel.panel-default > .panel-heading.uploadheader span, .mob-panel.panel-default > .panel-heading i {
            color: #fff;
        }

    .updocrow select {
        padding: 5px 5px !important;
        min-height: inherit;
    }

    .uploaddocbtn {
        display: block
    }

    .mobshowleft.show {
        right: 0;
    }

    .offbordmain {
        flex-wrap: wrap;
        align-items: center;
    }

        .offbordmain .panel {
            width: 97%;
        }

    .customrowcol .col {
        width: 100%;
    }

    .DutyType {
        display: block;
    }

        .DutyType .frmTxtBx {
            width: 100% !important;
        }

    .skyblue {
        min-width: inherit !important;
    }

    #divDateRangeDays .gicondate.ardateoic {
        display: none;
    }

    .filterFooter, .addnewsidebar .footerData {
        padding: 16px 20px !important;
    }

    .bredcrum-financial .fliterbutton, .toprowbreadcrumbSection a.fliterbutton {
        min-width: 30px;
        height: 30px;
    }

    .openinglist .dash_head h3 {
        width: 100%;
        margin-bottom: 10px;
    }

    .dashwhite .dash_head .count {
        margin-left: 0px;
    }

    .leavesdata li span {
        font: 400 12px / 20px 'Roboto', sans-serif;
    }

    .dashwhite .dash_head h3 {
        font: 500 14px / 24px 'Roboto';
    }

    .skybtn {
        padding: 3px 10px;
        font-size: 12px;
    }

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

    .row.it-declar .col-sm-6 {
        margin-top: 10px;
    }

    body .PendingAproveBoxes .row {
        height: 7rem;
    }

    .row.form-group-main {
        display: block !important;
    }

    .gpanel .panel-collapse > div {
        padding-left: 120px;
    }

    .eventcircle {
        width: 150px;
        height: 110px;
        position: relative;
        display: none;
    }

    .panel_data_row {
        display: flex !important;
    }

        .panel_data_row .panelheadingtxt,
        .panel_data_row .panelBtnsRight {
            width: auto !important;
        }

    .pageheader .pagebutton .d-flex {
        width: 100%;
        min-width: 100%;
    }

        .pageheader .pagebutton .d-flex input.form-control {
            width: 100% !important;
        }

    .breadList .breadText {
        font-size: 12px;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 100%;
        display: inline-block;
    }

    .breadList li {
        padding-left: 8px;
        max-width: 150px;
    }

    .scrollbar-inner > .scroll-element .scroll-bar, .scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar, .statuscroll .scroll-bar {
        background-color: #a3d6ff;
    }

    ::-webkit-scrollbar-thumb {
        background: #a3d6ff;
        border-radius: 10px;
    }

    ::-webkit-scrollbar {
        width: 5px;
        height: 3px;
    }

    ul.nav.nav-tabs::-webkit-scrollbar {
        height: 2px !important;
    }

    .scrollbar-inner > .scroll-element.scroll-x {
        height: 3px !important;
    }

    .scrollbar-inner > .scroll-element.scroll-y {
        width: 3px;
    }

    ul.nav.nav-tabs li a:before, ul.nav.nav-tabs li button:before {
        height: 1px;
    }

    .module_menu {
        width: 300px;
    }

    .gfilterpagi.d-flex {
        min-width: inherit;
    }

    body .bredcrum-financial a i.feather {
        margin-right: -2px;
        display: none;
    }

    .gfilterpagi.d-flex {
        margin-top: 10px;
    }

    .Records-bg, .bookotsearch {
        flex-wrap: wrap;
    }

    .pageheader-right {
        flex-wrap: wrap;
        row-gap: 10px;
    }

    body .PendingAprovecountText span {
        font-size: 11px;
    }

    #ctl00_divImpLinks .quicklinkDrpDwn {
        padding: 0 !important;
        background: #f6f6f6;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .footerWrapper .container-fluid {
        display: none;
    }

    .toprowbreadcrumbSection {
        column-gap: 10px;
    }

        .toprowbreadcrumbSection .towSections {
            width: 160px;
        }


    .towSections {
        column-gap: 2px;
    }

    .monthlyView table th:nth-child(2), .monthlyView table th:nth-child(3), .monthlyView table th:nth-child(4), .monthlyView table th:nth-child(5), .monthlyView table th:nth-child(8) {
        display: none;
    }

    .monthlyView table td:nth-child(2), .monthlyView table td:nth-child(3), .monthlyView table td:nth-child(4), .monthlyView table td:nth-child(5), .monthlyView table td:nth-child(8) {
        display: none;
    }

    .emp-tasksheet .Records-bg {
        row-gap: 10px;
    }

    .emp-tasksheet .Records-bg {
        justify-content: center;
    }

    .filter.right .modal-dialog {
        max-width: 90%;
        width: 100% !important;
    }

    .tabsDurationRange {
        flex-wrap: wrap;
    }

    .table tr td.action-sticky {
        position: relative !important;
        right: 0 !important
    }

    .table tr th.action-sticky {
        right: auto !important
    }

    .JobRequisitionRow .Records-bg {
        display: block;
    }

    .pageheader .searchbox {
        width: 100% !important;
    }

    .JobRequisitionRow .JobReq-button {
        flex-wrap: wrap !important;
    }

        .JobRequisitionRow .JobReq-button .searchbulk {
            width: 70% !important;
        }

    .JobReq-button .btn {
        padding: 6px 8px !important;
        height: 32px !important;
        min-width: auto !important;
    }

    .JobRequisitionRow .radioboxdatalabel {
        margin-bottom: 10px;
    }

    .attendanceboxbtn .dropdown-menu {
        width: 350px;
    }
    /* ***** TopHeaderData ***** */
    .row.topHeaderData {
        margin-top: 15px;
    }

    a#ctl00_ctl00_CPH_CPH_cmdApprove {
        position: absolute;
        top: 0;
        right: 15px;
        z-index: 1;
    }

    .details {
        /*display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        column-gap: 8px;*/
        width: 50%;
    }

        .details span.textDetails {
            white-space: nowrap;
            display: block;
            line-height: normal;
        }

    .right-contentarea {
        padding-bottom: 0 !important;
    }

    .submitButton,
    .btn-primary,
    .btn-danger,
    .btn-info,
    .blue {
        height: 28px !important;
        padding: 5px 10px !important;
        font-size: 12px;
    }

    .panel-body .formElement {
        font-size: 12px;
    }

    .pageheader-row {
        margin: 0 !important;
    }

    .FlxEMPhd, .FlxEMPtext span,
    .form-group label {
        font-size: 12px;
    }

    .note-column,
    .mt-mobile-0 {
        margin-top: 0 !important;
    }

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

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

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

    .mb-mobile-15 {
        margin-bottom: 15px !important;
    }

    .no-mobile-margin {
        margin: 0 !important;
    }

    .height-mobile-auto {
        height: auto !important;
    }

    .width-mobile-auto {
        width: auto !important;
    }

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

    .employeeContactDetails,
    .employeeContactDetails span {
        font-size: 12px;
    }

    .greencolor, .greencolor {
        min-width: inherit !important;
        height: 28px !important;
        padding: 5px 10px !important;
        font-size: 12px;
    }

    .pageheader .d-flex {
        column-gap: 10px;
    }

    .page-header-action {
        min-width: inherit !important;
    }

    .status-select {
        width: auto !important;
    }

    .modal-dialog {
        width: 95%;
    }

    .FlxEMPhd {
        width: 130px !important;
    }

    .flex-wrap-mobile {
        flex-wrap: wrap;
        row-gap: 5px;
    }

    .w-50-mobile {
        justify-content: flex-start;
        width: 50%;
    }

    .TRecords {
        display: none;
    }

    .JobRequisitionRow .JobReq-button {
        column-gap: 5px;
    }

    .filterresultlbl li {
        font-size: 12px;
        padding: 5px 30px 5px 11px;
    }

    .modaltask .modal-dialog {
        margin: 10px;
    }

    .empheadleft img {
        width: 50px;
    }

    .empheadright h3 {
        font-size: 16px;
    }

    .resignempdetails label {
        margin-bottom: 0px;
        white-space: nowrap;
    }

    .empheadright {
        overflow: auto;
    }

    .Requesteddays h3 {
        margin-top: 0px;
    }

    .withdra-panel .panel-heading h2 {
        font-size: 18px;
    }

    .withdra-panel .panel-heading h3 {
        font-size: 15px;
        margin-top: 15px;
    }

    .empheadleft {
        display: none;
    }

    .empheadbox {
        padding-bottom: 0;
    }

    .resignempdetails {
        padding-bottom: 15px;
    }

    .withdratext {
        font-size: 13px;
        line-height: 25px;
        padding: 5px 0px;
    }

    .inboxright {
        width: 100%;
    }

    .pagebuttons.JobReq-button {
        margin-right: auto;
    }

    .financialYearDropDown {
        width: 30px;
        padding: 0px;
        height: 30px;
        border: 1px solid #0a3b7e;
    }

    .ardateoic input {
        width: 40px;
        text-indent: 50px;
        background-position: 50% 10px;
    }

    .empactionlist {
        flex-wrap: wrap;
    }

        .empactionlist li {
            width: 49%;
        }

        .empactionlist .dropinner li {
            width: 100%;
        }

    .financialYearDropDown select {
        background-image: url(../images/calendar.svg);
        background-size: contain;
        background-repeat: no-repeat !important;
        -moz-appearance: none; /* Firefox */
        -webkit-appearance: none; /* Safari and Chrome */
        appearance: none;
        background-position: 3px -1px;
        text-indent: -999px;
    }

    .arlistselect.financialYearDropDown select {
        background-image: url(../images/daycalandra.svg);
        background-position: 4px -1px;
    }

    .arlistselect.financialYearDropDown {
        border-color: #12CCFF;
    }

    .gtablink {
        column-gap: 10px;
    }

    .view_announce .anchors i {
        font-size: 15px !important;
    }

    .view_announce .anchors img {
        width: 20px;
    }

    .view_announce .anchors {
        width: 30px !important;
        height: 30px !important;
    }
    /*body .form-control{font-size:16px !important;}*/
}

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

    .claimlist {
        margin-top: 15px;
    }

    .btn.btn-primary.ImprestClaim, .btn.btn-info.addExpense {
        min-width: 23px;
        width: 23px;
        padding: 14px !important;
    }

    .docright h3 {
        font-size: 14px;
    }

    .inboxfilterin {
        justify-content: center;
    }

        .inboxfilterin .radioboxdatalabel label {
            font-size: 13px !important;
        }

    span.docgroup {
        font-size: 12px;
    }

    .doc-info .docupload {
        font-size: 12px;
    }

    .main .breadcrumbSection {
        padding: 15px 10px 15px;
        margin-bottom: 0 !important;
    }

    .gpanel .panel-collapse > div {
        padding-left: 55px;
    }

    .logs-filter label {
        min-width: 90px;
    }

    .logoContainer img {
        max-width: 115px;
        object-fit: contain;
    }

    body .masterInnerNavbar {
        box-shadow: none;
    }

    .wrapperInner {
        column-gap: 0 !important;
    }

    .eminfo ul {
        right: 26px !important;
    }

    .eminfo li a {
        padding: 15px 10px 15px 15px !important;
    }

    .topmenuicon {
        column-gap: 3px;
    }

    .eminfo.nav-pills li {
        margin: 0px 6px;
    }


    .dropdown-menu.webpunchbox {
        min-width: 256px;
        right: -33px;
    }

    .dropdown-menu.employee_info {
        min-width: 268px;
    }

    .attendanceboxbtn .dropdown-menu {
        width: 250px;
    }

    .punchbtn button {
        font-size: 12px;
        padding: 5px 5px !important;
    }

    .punchtimeleft h5 {
        font-size: 16px;
    }

    .punchtimeleft h4 {
        font-size: 12px;
    }

    .punchtimeright h3 {
        font-size: 11px;
    }

    .attendanceboxtime h3 {
        font-size: 14px;
    }

    .punchtimeright h4 {
        font-size: 15px;
    }

    .punchtimeright h5 {
        font-size: 12px;
    }

    .mobdateRange {
        display: inline-block;
    }

    .mobdateRange-row1,
    .mobdateRange-row2 .col-xs-6 {
        width: 100% !important;
    }

    .JobRequisitionRow {
        margin-top: 10px !important;
    }

    .pageheader-row.JobRequisitionRow {
        row-gap: 5px;
    }

    .notiuser .NotiCounts {
        right: 0;
    }

    .requisition-head .pagebutton {
        margin-bottom: 0;
        margin-top: 5px;
    }

    .requisition-head.pageheader-row {
        row-gap: 0px;
    }

    .requisitionbutton .btn {
        font-size: 12px;
    }

    .calendarData p .labelValue {
        white-space: nowrap;
    }

    .calendar_box .fc td {
        min-width: 20px;
        padding: 2px 0;
        color: #0F2552;
        font-size: 14px;
        font-weight: 500;
    }

    .calendar_box a.fc-event:after {
        top: 50%;
        left: 3px;
        width: 30px;
        height: 30px;
        transform: translateY(-43%);
    }

    .midSection .popover-content {
        padding: 4px 8px;
    }

    .resignbody .panel-heading {
        display: block;
    }

    .resignbody .panelheadingtxt {
        font-size: 13px;
    }

    .togglemain {
        display: block;
    }

    .dempname {
        display: none;
    }

    .pageheader-left .mbdrop, .mbdrop {
        width: 300px;
    }

    .mypending .p-requests.col-md-3 {
        width: 50%;
        float: left;
    }

    ul.dropinner a {
        font-size: 12px !important;
    }

    .dashbodylist li p {
        margin-bottom: 5px;
    }

    .recent_body .postby span:after {
        display: none;
    }

    .event_body {
        display: flex;
        align-items: center;
        justify-content: center;
        column-gap: 30px;
        flex-wrap: wrap;
        row-gap: 20px;
    }

        .event_body .messagehead {
            font-size: 14px;
        }

    .Notificationgroup {
        column-gap: 19px;
    }

    .gtablink a {
        font: 500 14px 'Roboto', sans-serif
    }

    .coaccum-head, .noticebutton {
        margin-top: 15px;
    }

    .empactionlist li {
        width: 48%;
    }

    .empboxmain {
        margin-top: 15px;
    }

    span.applyfeed {
        text-align: left;
        float: left;
    }

    .postbyone {
        padding-top: 10px;
    }

    .mobblock .FlxEMPdetails {
        display: block !important;
        height: 50px;
    }

    .mobblock .FlxEMPtext {
        width: 100% !important;
        padding-left: 0px;
        margin-top: 4px;
    }

    .panelheadingtxt span {
        display: flex;
        align-items: center;
        column-gap: 5px;
    }

    .panelheadingtxt {
        font-size: 13px;
        line-height: 13px;
    }

    .mob-panel.panel-default > .panel-heading b {
        line-height: 0;
    }

    .Records-bg select.form-control {
        padding: 5px 10px;
        font-size: 13px;
    }

    .note-column {
        font-size: 12px;
    }

    .mob-panel.panel-default > .panel-heading {
        font-size: 13px !important;
    }

    .datepicker-dropdown {
        z-index: 10011 !important;
    }

    .leavesumbox {
        justify-content: center;
    }

    .docapprove, .docpending, .docreject {
        padding: 3px 6px;
        font-size: 10px;
    }

    .panelBtnsRight select {
        min-height: inherit;
        padding: 5px 10px;
        font-size: 12px;
    }

    .salaryheading span {
        display: inline-block
    }

    .teamprohead {
        padding-top: 10px;
    }

    .panel-hinner {
        justify-content: center;
        text-align: center;
    }

    .panel-hinner div#divLatterPreview {
            text-align: center;
            margin-left: auto;
            margin-right: auto;
        }
    .Suggesdate span {
        white-space: normal;
        text-align: center;
    }

}



@media only screen and (max-width: 500px) {
    .hpostbody span.icon {
        width: 40px;
        height: 40px;
    }

    .view_announce .gdropdown .dropdown-menu.notidropdown {
        right: -50px;
        max-width: 250px;
        min-width: 250px;
    }

        .view_announce .gdropdown .dropdown-menu.notidropdown.notidrop {
            right: -80px;
        }
}

@media screen and (min-width:1280px) and (max-width:1390px) {
    .screenshort-div .screenshot-reply-info p {
        font-size: 10px;
    }

    body .scroll-table {
        height: calc(100vh - 220px) !important;
    }
}

@media screen and (min-width:767px) and (max-width:1290px) {
    body .scroll-table table.table tr td, body .scroll-table table.table tr th, .dashwhite .dash_head span {
        font-size: 12px;
    }

    body .scroll-table table.table tr td, body table.gtable tr td {
        padding: 8px 10px !important;
    }

    .screenshort-div .screenshot-reply-info p {
        font-size: 10px;
    }
}