

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");

* {
    margin: 0;
    padding: 0;
}

.menu-text {
    font-family: "Montserrat";
    font-size: 15px;
    padding-left: 10px;
}

.sidebar.close__sidebar .menu-text {
    display: none !important;
}

.sidebar.close__sidebar .icon-angle-down {
    display: none;
}

.sidebar.close__sidebar .main-menu {
    padding-left: 10px;
}

*:focus {
    outline: none !important;
    box-shadow: none !important;
}





.submenu::-webkit-scrollbar, .sidebar::-webkit-scrollbar, .main__section::-webkit-scrollbar {
    width: 5px;
    height: auto;
}

*::-webkit-scrollbar {
    /*    color: lightgray;*/
    /*    width: 5px;
    height: auto;*/
}

.table__block::-webkit-scrollbar-thumb {
    background-color: lightgray;
}


body {
    color: #20253a;
    font-family: "Montserrat" !important;
    font-size: 14px;
    /*    overflow-y: hidden;*/
}

.ellipsisContent {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.error {
    color: #f00;
    font-weight: normal;
}

.linkText {
    color: #008dd2 !important;
    text-decoration: none !important;
}

.heading {
    color: #4f556e;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 20px;
    font-weight: 600;
}

.mh-auto {
    min-height: auto !important;
}



.hide__label {
    opacity: 0;
    height: 20px;
}

.apexcharts-toolbar {
    display: none !important;
}

/*login page ------------------------------*/

.loginSection .form__section {
    background-color: #F1F3F6;
    min-height: 525px;
}

.main__btn.login-form_submit {
    width: 100%;
    border-radius: 20px;
}

.loginSection .form__section .login-form {
    margin: 7rem 5rem;
}

    .loginSection .form__section .login-form .login-header {
        padding-left: 4rem;
        padding-right: 4rem;
    }

.loginSection .form__section .img-fluid {
    height: 100% !important;
}

.loginSection .right_section {
    position: relative;
    height: 100vh;
}

    .loginSection .right_section .footer {
        position: absolute;
        bottom: 15px;
        width: 100%;
        font-size: 11px;
    }

.loginSection .form__section .login-form .HRMS_logo img {
    height: 3rem;
    margin: 10px !important;
}

.loginSection .form__section .login-form .viewPassIcon {
    cursor: pointer;
    right: 20px;
    position: absolute;
    top: 10px;
}

.loginSection .form__section .input__block label, .input__block label {
    font-weight: 600;
    font-size: 12px;
}

.loginSection .form__section .input__block input {
    font-family: 'Montserrat' !important;
    font-size: 12px;
}

.input__block.password-input input {
    border-radius: 20px 0px 0px 20px !important;
}

.input__block.password-input .input-group-text {
    cursor: pointer;
    height: 40px;
    border-radius: 0px 20px 20px 0px;
}



/*login page End ------------------------------*/

.login__section .login__img {
    background: url("../images/login-right-img.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100vh;
}

.login__form {
    padding: 2rem;
    box-shadow: 0px 0px 7px 5px #eaeef1;
    border-radius: 10px;
    width: 90%;
    margin: auto;
    margin-top: 2rem;
}

    .login__form .nav-tabs {
        border: 0;
    }

        .login__form .nav-tabs .nav-item {
            margin-bottom: -1px;
            max-width: 50%;
            width: 50%;
        }

        .login__form .nav-tabs .nav-link.active {
            color: #fff !important;
            background-color: #b93236;
        }

        .login__form .nav-tabs .nav-link {
            border: 1px solid #ccc;
            border-radius: 0;
            color: #4f556e;
            padding: 10px;
            text-align: center;
        }

    .login__form .tab-content {
        padding: 2rem;
        border: 1px solid #ccc;
    }

    .login__form .poweredby p {
        text-align: right;
        margin: 0;
    }

    .login__form p img {
        width: 85px;
    }

.main__btn {
    /* background: #0340fe; */
    border: none;
    border-radius: 20px !important;
    color: #fff;
    height: 40px;
    padding: 0 10px;
    min-width: 7rem;
    font-size: 14px;
    background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    cursor: pointer;
}

    .main__btn.delete__btn {
        background: linear-gradient(to bottom right, #C70000, #F14033);
    }

.btn.delete__btn:not(:disabled):not(.disabled):active {
    background: linear-gradient(to bottom right,#F14033, #C70000) !important;
}

.main__btn:not(:disabled):not(.disabled).active, .main__btn:not(:disabled):not(.disabled):active {
    background: transparent linear-gradient(96deg, #713bdb 0%,#0c45b2 100%) 0% 0% no-repeat padding-box;
}

.main__btn:hover {
    color: #fff;
}

.add__btn {
    /* background: #0340fe; */
    border: none;
    border-radius: 5px;
    color: #fff;
    height: 40px;
    padding: 0 10px;
    width: fit-content;
    font-size: 14px;
    background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    cursor: pointer;
}

.filter__btn {
    background: #0340fe;
    border: none;
    border-radius: 5px;
    color: #fff;
    height: 40px;
    padding: 0 10px;
    min-width: auto;
    font-size: 14px;
}

.form__section .input__block {
    margin-bottom: 1rem;
}

    .form__section .input__block.radio input {
        height: 20px !important;
    }
/*.form__section .input-group .input-group-addon {
    position: absolute;
    right: 15px;
    top: 7px;
}*/

.modal-backdrop {
    background-color: transparent !important;
    filter: blur(8px) !important;
}

    .modal-backdrop in {
        background-color: transparent;
        opacity: 0.5;
    }

.form__section .input__block label,
.modal-body label {
    display: block;
    color: #4f556e;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 5px;
}

.form__section.sefleave .input__block {
    display: flex;
}

.form__section .input__block input,
.form__section select {
    background: #fff 0 0 no-repeat padding-box;
    border: 1px solid #00000020;
    border-radius: 20px;
    color: #3b4452;
    height: 40px;
    opacity: 1;
    padding: 5px 10px;
    width: 100%;
}
/*sidebar design*/


.main__section .sidebar {
    background: #fff;
    height: auto;
    padding-top: 0;
    transition: all 0.5s;
    width: 17%;
    height: 100vh;
    overflow-y: auto;
    transition: all 0.5s;
    border-right: 1px solid #f0f0f0;
}

    /*  .main__section .sidebar .close__btn {
        display: none;
    }*/

    .main__section .sidebar.close__sidebar {
        width: 5%;
        transition: all 0.5s;
    }

.main__section .dashboard__logo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    padding: 1rem;
}

.main__section .menu__icon {
    color: #4f556e;
}

.main__section .sidebar.close__sidebar .dashboard__logo h3,
.main__section .sidebar.close__sidebar .sidebar__navigation .menu__text {
    display: none;
}



.main__section .sidebar.close__sidebar .sidebar__navigation ul li a,
.main__section .sidebar.close__sidebar .dashboard__logo {
    justify-content: center;
    padding: 11px 13px 11px 20px;
}

.main__section .right__section {
    width: 83%;
    background: #f1f4fd;
    transition: all 0.5s;
}

    .main__section .right__section.close__sidebar {
        width: 95%;
        transition: all 0.5s;
    }

.main__section .sidebar .dashboard__logo h3 {
    text-align: left;
    margin-top: 10px;
    color: #0340fe;
    font-size: 20px;
}

.sidebar__navigation {
    padding: 1rem;
    min-height:1200px;
}

    .sidebar__navigation ul {
        list-style: none;
    }

        .sidebar__navigation ul li a {
            padding: 7px;
            color: #4f556e;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            text-decoration: none;
            margin-bottom: 5px;
            font-size: 12px;
        }

        .sidebar__navigation ul li.active a {
            color: #0340fe;
        }

        .sidebar__navigation ul li a i.fa {
            margin-right: 10px;
        }

    /*.sidebar__navigation ul ul {
            margin-left: 27px;
        }*/

    .sidebar__navigation .panel-body {
        background: #fff;
        padding: 10px;
    }

.submenu::-webkit-scrollbar-thumb {
    background-color: #1c44b9;
}
/*.table::-webkit-scrollbar{
    width:5px;
    height:17px;
}
table::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}*/
.nav-list > li .submenu > li > a {
    display: block;
    /*  position: relative;*/
    color: #616161 !important;
    padding: 8px 15px;
    margin: 0;
    font-size: 13px;
    border:1px solid transparent;
}

.nav-list > li .submenu {
    display: none;
    list-style: none;
    position: relative;
    background-color: #e5e5e5 !important;
    border-radius: 15px;
    overflow-y: auto;
    max-height: 212px;
}

.icon-double-angle-right {
    display: none;
}

.nav-list > li .submenu > li > a:focus {
    text-decoration: none
}

/* .nav-list > li .submenu > li > a:hover {
        text-decoration: none;
        color: #4b88b7
    }*/
.nav-list > li > a:hover, .nav-list > li .submenu > li > a.active {
    background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    color: white !important;
    border-radius: 10px;
    padding: 7px;
    /*    border: 1px solid;*/
}

.nav-list > li .submenu > li > a:hover {
    background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    color: white !important;
    border-radius: 10px;
    border:1px solid white;
}

.nav-list > li a:hover > .arrow {
    color: #fff;
}

.nav-list > li > .submenu > li:after {
    content: "";
    display: block;
}

.nav-list > li > .submenu > li:before {
    content: "";
    display: inline-block;
    position: absolute;
}

.nav-list > li > .submenu li.open > a > [class*="icon-"]:first-child {
    display: none;
}
/* .main__section .sidebar .dashboard__logo img {
width: 100px;
} */
.header__section {
    box-shadow: 6px 2px 9px 0px #ccc;
    background: #fff;
    padding: 0px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .header__section .navbar-nav .nav-link {
        color: #4f556e;
        text-decoration: none;
    }

    .header__section .welcome__area {
        display: flex;
        align-items: center;
    }

        .header__section .welcome__area h2 {
            font-size: 18px;
            margin-bottom: 0;
            color: #222222;
            margin-left: 10px;
        }

    .header__section .welcome__block h4 {
        font-size: 16px;
        color: #292929;
        margin-left: 2rem;
    }

    .header__section .user__block {
        display: flex;
        margin-top: 5px;
        align-items: center;
    }

    .header__section .notification__block {
        position: relative;
        margin-right: 30px;
        cursor:pointer;
    }

        .header__section .notification__block i {
            font-size: 20px;
        }

        .header__section .notification__block .circle {
            position: absolute;
            background: #e1141e;
            color: #fff;
            font-size: 12px;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            text-align: center;
            top: -10px;
            right: -10px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .header__section .user__designation {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 100%;
    }

        .header__section .user__designation h4 {
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 5px;
        }

        .header__section .user__designation h5 {
            font-size: 12px;
        }

    .header__section .user__initial > a {
        display: inline-flex;
        width: 35px;
        height: 35px;
        background: #713bdb;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        margin-left: 10px;
        color: #fff;
    }

        .header__section .user__initial > a:active {
            background: #713bdb;
        }

.main__section .contain__area {
    margin: 0.5rem 1rem 0.2rem 1rem;
    padding: 1rem;
    height: calc(100vh - -45px);
    overflow-y: scroll;
    padding-bottom:10%;
}

.main__section .contain__area::-webkit-scrollbar {
    width: 0;
}

.main__section .table__block table.dataTable thead th,
.main__section .table__block table.dataTable thead td {
    border-bottom: none;
}


.table__block table th {
    background: #F9FAFC;
    align-content: center;
    padding-left: 10px !important;
    padding-right: 10px !important;
}
/*.table__block table td input[type=checkbox]{
    margin-left:8px;
}*/
.table__block table.noData td {
    text-align: center !important;
}

.main__section .table__block .action__btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .main__section .table__block .action__btn i {
        margin-right: 5px;
        cursor: pointer;
        font-size: 16px;
        color: #1c44b9 !important;
    }

    .main__section .table__block .action__btn em.edit__icon {
        color: #1c44b9 !important;
    }

.edit__icon {
    color: #1c44b9 !important;
}

.main__section .table__block .action__btn em.save__icon {
    color: #8bc34a !important;
}

.main__section .table__block .action__btn em.cross__icon {
    color: #ff0707 !important;
}

.main__section .table__block .table__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

    .main__section .table__block .table__heading h3 {
        font-size: 15px;
        font-weight: 600;
        margin: 0;
        color: #222222;
    }

    .main__section .table__block .table__heading .table__btn .record__exist {
        color: #222222;
        font-weight: 600;
        margin-right: 10px;
    }

    .main__section .table__block .table__heading .table__btn a:hover {
        color: #fff;
    }

    .main__section .table__block .table__heading .table__btn button {
        width: 40px;
        min-width: auto;
    }

.main__section .table__block {
    padding: 1rem;
    /* min-height: 20rem; */
    margin-bottom: 2rem;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 10px;
}

    .main__section .table__block th {
        /* background: #688dff; */
        color: #222222;
        font-weight: 600;
    }

    .main__section .table__block th,
    .main__section .table__block td {
        font-size: 14px;
        text-align: left !important;
    }

        .main__section .table__block td a em {
            color: #1c44b9;
        }

        .main__section .table__block td .fa {
            color: #1c44b9;
        }
    /* .main__section .table__block tr:hover {
background: #dee6ff;
} */
    /* .main__section .table__block tr:nth-child(even) {
background: #eaeefb;
} */
    .main__section .table__block .dataTables_wrapper .dataTables_length select {
        width: 4rem;
        border: none;
        border-bottom: 1px solid #ccc;
        margin-right: 10px;
    }

    .main__section
    .table__block
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.current {
        background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
        color: #fff !important;
        border: none;
        border-radius: 50%;
        width: 35px;
        height: 35px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .main__section .table__block .dataTables_wrapper .dataTables_filter input {
        margin-left: 10px;
        background: #fff 0 0 no-repeat padding-box;
        border: 1px solid #00000020;
        border-radius: 20px;
        color: #3b4452;
        height: 40px;
        opacity: 1;
        padding: 5px 10px;
        /* margin-bottom:10px; */
    }

.footer__section {
    position: fixed;
    bottom: 2px;
    width: 83%;
    background: #fff;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index:999;
    /* box-shadow: 0px 3px 10px #00000029; */
}

    .footer__section .footer__logo img {
        width: 80px;
    }

.main-menu .menu__dropdown {
    margin-bottom: 10px;
    cursor: pointer;
}

    .main-menu .menu__dropdown:after {
        font-family: "FontAwesome";
        content: "\f105";
        float: right;
    }

    .main-menu .menu__dropdown.collapsed:after {
        content: "\f107";
    }

    .main-menu .menu__dropdown a i,
    .main-menu .menu__dropdown a img {
        margin-right: 10px;
    }

.attendance__calendor .month ul {
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 10px 15px;
    background: #FFF2E3;
}

    .attendance__calendor .month ul li {
        font-size: 15px;
        font-weight: 700;
        margin: 0;
        color: #222222;
    }

.attendance__calendor .weekdays {
    margin: 0;
    padding: 10px 0;
}

    .attendance__calendor .weekdays li {
        display: inline-block;
        width: 13.6%;
        color: #222222;
        text-align: center;
        font-size: 12px;
    }

.attendance__calendor .days li:hover .alldts {
    opacity: 1;
    transition: all 0.5s;
    top: -20px;
    visibility: visible;
    padding: 15px 20px;
}

    .attendance__calendor .days li:hover .alldts .status {
        text-align: center;
        font-weight: bold;
    }

    .attendance__calendor .days li:hover .alldts span {
        text-align: justify;
    }

.attendance__calendor .alldts {
    position: absolute;
    box-shadow: 0px 0px 20px #00000029;
    border-radius: 20px;
    padding: 10px;
    z-index: 9;
    background: #fff;
    width: 100px;
    opacity: 0;
    top: 0px;
    transition: all 0.5s;
    visibility: hidden;
    color: black;
}

    .attendance__calendor .alldts span {
        display: block;
        margin-bottom: 5px;
        font-weight: normal !important;
        margin-right: 5px;
    }

        .attendance__calendor .alldts span b {
            font-weight: bold;
            margin-right: 5px;
        }

.attendance__calendor .days {
    padding: 10px 0;
    margin: 0;
}

    .attendance__calendor .days li {
        padding: 7px;
        list-style-type: none;
        display: inline-flex;
        width: 13.6%;
        text-align: center;
        margin-bottom: 5px;
        font-size: 12px;
        color: #222222;
        flex-direction: column;
        height: 50px;
        position: relative;
        cursor:pointer;
    }
        .attendance__calendor .days li:hover {
            cursor: pointer;
        }

        .attendance__calendor .days li.active::before {
            content: "";
            background: #713bdb;
            width: 40px;
            height: 40px;
            position: absolute;
            border-radius: 54%;
            top: -20px;
            z-index: 1;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
        }

.timesheet__calendor .days li.active::before {
    background: #2465e1 !important;
}

.atd_projectDetail .atd_details {
    background: #EBF8FF;
    padding: 10px 15px;
    border-radius: 20px;
}

    .atd_projectDetail .atd_details p {
        color: #008DD2;
        font-weight: bold;
        margin-bottom: 0px;
    }

    .atd_projectDetail .atd_details h6 {
        font-size: 12px;
    }

    .atd_projectDetail .atd_details .leave_dtl {
        padding: 5px;
    }

.attendance__calendor .days li.active span {
    color: #fff !important;
    z-index: 2;
    font-size: 11px;
}

.attendance__calendor .days li span {
    font-weight: bold;
}

.attendance__calendor .status {
    font-weight: normal !important;
}

.attendance__calendor .present {
    color: #00ac50;
    font-weight: 700 !important;
}

.attendance__calendor .absent {
    color: #f14033;
    font-weight:700 !important;
}

.attendance__calendor .incomplete {
    color: #FF7BA4;
}

.attendance__calendor .completed {
    color: #72E6A7;
}

.bg-incomplete {
    background: #FF7BA4 !important;
}

.bg-completed {
    background: #72E6A7 !important;
}

.attendance__calendor .partiallyCompleted {
    color: #FFCB8F;
}

.attendance__calendor .halfday {
    color: #ff9720;
}

.attendance__calendor .leave {
    color: #fc5f2e;
}

.attendance__calendor .holiday {
    color: #0095da;
}

.attendance__calendor .weekoff {
    color: #713bdb !important;
}

.attendance__calendor .status_pending {
    color: blue !important;
}

.attendance__calendor .deeppink {
    color: deeppink !important;
}

.attendance__calendor .not-applicable {
    color: #74798c;
}

.attendance__calendor .completed {
    color: #00ac50;
}

.attendance__calendor .partially {
    color: #ff9720;
}

.attendance__calendor .incompleted {
    color: #f14033;
}

.attendance__calendor .days li .active {
    padding: 5px;
    background: #1abc9c;
    color: white !important;
}

.attendance__calendor .calendar__notes {
    background: #f9fafc;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    border-top: 1px solid #d5d5d5;
    position: absolute;
    width: 100%;
    left: 0;
    margin: auto;
    height: 70px;
    border-radius: 0 0 10px 10px;
}

    .attendance__calendor .calendar__notes span {
        margin-right: 20px;
        margin-bottom: 5px;
        font-size: 12px;
    }

.top__navs__left ul {
    display: flex;
    list-style: none;
    margin: 0;
}

    .top__navs__left ul li a {
        padding: 12px 16px;
        background: #fff;
        border-radius: 10px;
        margin-right: 2rem;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 100px;
        color: #008dd2;
        font-size: 14px;
    }

        .top__navs__left ul li a.active {
            background: #008dd2;
            color: #fff;
        }

            .top__navs__left ul li a.active img {
                filter: invert(100%) sepia(0%) saturate(1%) hue-rotate(213deg) brightness(200%) contrast(200%);
            }

        .top__navs__left ul li a img {
            margin-right: 10px;
        }

/* .information-tooltip .tooltip {
top: 37.1562px !important;
left: 202.75px !important;
width: 325px;
}

.information-tooltip .tooltip-inner {
text-align: justify;
padding: 5px 20px;
background-color: white;
color: #20253A;
text-shadow: none;
box-shadow: 0px 0px 20px #00000029;
border-radius: 5px;
font-size: smaller;
max-width: none;
}

.tooltip-arrow {
display: none !important;
}


.information-tooltip .info-tooltip ul li::marker {
color: #008DD2;
font-weight: bold;
display: inline-block;
width: 2em;
font-size: 14px;
}

.info-tooltip ul {
margin: 0 0 20px 17px !important;
}

.info-tooltip > ul li {
margin: 10px 0px !important;
} */
card__block.calendar__section, .card__block.atd_projectDetail {
    padding: 1rem;
}

.card__block {
    padding: 1rem;
    background: #fff;
    border-radius: 10px;
    margin-top: 2rem;
    position: relative;
}

.atd_projectDetail .heading__block {
    border-bottom: 0px;
    background: #E6FFF2;
    font-weight: 600;
    padding: 25px 20px;
}

.heading__block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 15px;
    border-bottom: 1px solid #d5d5d5;
    height: 40px;
}

    .heading__block h3 {
        font-size: 15px;
        font-weight: 600;
        margin: 0;
        color: #222222;
    }

    .heading__block p {
        margin-bottom: 0;
    }

        .heading__block p img {
            width: 15px;
        }

.content.team .heading__block, .calendar__section .heading__block {
    border-bottom: 0px !important;
}

.content.team .custom_height_attendance {
    min-height: 120px;
}

.page__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    position: relative;
}

    .page__heading h3 {
        font-size: 18px;
        font-weight: 600;
        margin: 0;
        color: #1c44b9;
        display: flex;
        align-items: center;
    }

        .page__heading h3 .info__icon {
            width: 15px;
            margin-left: 5px;
        }

            .page__heading h3 .info__icon:hover + .page__info {
                visibility: visible;
                opacity: 1;
            }

    .page__heading .page__info {
        position: absolute;
        width: 70%;
        background: #fff;
        z-index: 1;
        border: 1px solid #ccc;
        border-radius: 10px;
        top: 10%;
        padding: 1rem 1rem 0 1rem;
        left: 20%;
        visibility: hidden;
        opacity: 0;
    }

.page__info ul li {
    margin-bottom: 10px;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    color: #222222;
}

.calendar__section.card__block {
    margin-bottom: 4rem;
}

.top__navs {
    display: flex;
    justify-content: space-between;
}

    .top__navs .top__navs__right {
        align-items: center;
        display: flex;
        text-align: center;
    }

        .top__navs .top__navs__right a {
            font-size: 13px !important;
            color: #008dd2;
            text-decoration: underline;
            margin-left: 5px;
        }

        .top__navs .top__navs__right img {
            width: 50%;
        }

.top__navs__right .notepad .notepad_alldts {
    position: absolute;
    box-shadow: 0px 0px 20px #00000029;
    border-radius: 5px;
    padding: 15px;
    z-index: 9;
    width: 267px;
    opacity: 0;
    top: 17px;
    right: 34px;
    transition: all 0.5s;
    color: #000;
    visibility: hidden;
}

.top__navs__right .notepad:hover .notepad_alldts,
.timesheet__calendor .days li:hover .timesheet_alldts {
    opacity: 1;
    transition: all 0.5s;
    z-index: 9999;
    background: #fff;
    visibility: visible;
}

.top__navs__right .notepad .notepad_alldts,
.top__navs__right .notepad .notepad_alldts a {
    text-align: justify;
    font-size: 14px;
}

    .top__navs__right .notepad .notepad_alldts h6 {
        margin-bottom: 10px;
        text-align: justify;
    }

    .top__navs__right .notepad .notepad_alldts b {
        font-weight: 700;
        margin-bottom: 10px;
    }

    .top__navs__right .notepad .notepad_alldts p a {
        margin-left: 0px;
    }

.tabs__section .tab__menu {
    border: 1px solid #ccc;
    border-radius: 5px;
}

    .tabs__section .tab__menu li a {
        color: #1c44b9;
        font-weight: 500;
    }

    .tabs__section .tab__menu li.active a {
        color: white !important;
        background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    }

.nav.nav-tabs.tab__menu {
    display: flex;
    width: 100%;
    justify-content: space-between;
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
}


.tab__heading h3 {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    color: #1c44b9;
    margin-bottom: 1rem;
}

.alert-success {
    position: absolute !important;
    left: 81%;
    position: fixed;
    top: 46px;
    min-width: 300px;
    z-index: 999999;
    border-radius: 5px;
}

.modal-body .alert-danger {
    font-size: 14px;
    position: fixed;
    top: 0px;
    min-width: 300px;
    z-index: 999999;
    right: 5px;
    border-radius: 5px;
}

.alert-danger {
    font-size: 14px;
    position: fixed;
    top: 46px;
    min-width: 300px;
    z-index: 999999;
    right: 5px;
    border-radius: 5px;
}



/* shruti css starts */
.sidebar.close__sidebar + .right__section {
    width: 95%; /* Adjust width when .close__sidebar is present */
}

.placeholder-red::-webkit-input-placeholder { /* WebKit browsers */
    color: red;
}

.placeholder-red::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: red;
}

.placeholder-red:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: red;
}

.placeholder-red:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: red;
}

.text-primary {
    cursor: pointer;
}

.violet {
    color: #713bdb;
}

.brainvire_Dashboard .counter__block .main {
    display: flex;
    height: 80px;
    border-radius: 20px;
    margin-bottom: 20px;
    margin-right: 2%;
    padding: 0px 5px;
}

.brainvire_Dashboard .counter__block .col-md-3 {
    max-width: 20% !important;
}

.brainvire_Dashboard .counter__block .main .heading {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 0px !important;
}

.brainvire_Dashboard .counter__block .main .card-icon {
    background-color: #ffffff;
    color: white;
    font-size: 20px;
    margin: 10px;
    line-height: 70px;
    text-align: center;
    border-radius: 100%;
    width: 50px;
    height: 50px;
    align-self: center;
}

/* top card section */

.brainvire_Dashboard .counter__block .service {
    background: transparent linear-gradient(110deg, #00c17c 0%, #009560 100%) 0% 0% no-repeat padding-box;
}

.brainvire_Dashboard .counter__block .global-offices {
    background: transparent linear-gradient(108deg, #ff9720 0%, #e87d03 100%) 0% 0% no-repeat padding-box;
}

.brainvire_Dashboard .counter__block .Customer-Retention {
    background: transparent linear-gradient(110deg, #713bdb 0%, #5913e2 100%) 0% 0% no-repeat padding-box;
}

.brainvire_Dashboard .counter__block .Projects-Complete {
    background: transparent linear-gradient(109deg, #f9004c 0%, #e10045 100%) 0% 0% no-repeat padding-box;
}

.brainvire_Dashboard .counter__block .brainers {
    background: transparent linear-gradient(111deg, #008dd2 0%, #0074ac 100%) 0% 0% no-repeat padding-box;
}

.brainvire_Dashboard .counter__block .card-icon img {
    width: 23px;
    margin-bottom: 30px;
}

.brainvire_Dashboard .counter__block .card-content {
    align-items: center;
    display: grid;
    padding: 5px 0px 5px 0px;
}

.brainvire_Dashboard .counter__block .content {
    font-size: 10px;
}

.brainvire_Dashboard .counter__block .card-content span {
    color: white;
}
/* awards-video_sec-------------------- */

.brainvire_Dashboard .card {
    border-radius: 15px !important;
    border: 0px;
}

.brainvire_Dashboard .card-body {
    padding: 15px !important;
}

.brainvire_Dashboard .awards_sec .custom-dots {
    text-align: center;
}

    .brainvire_Dashboard .awards_sec .custom-dots .owl-dot {
        display: inline-block;
        width: 12px;
        height: 12px;
        margin: 0 5px;
        border-radius: 50%;
        background-color: #8e8c8c;
        transition: background-color 0.3s ease;
        border: none; /* Remove the border */
    }

        .brainvire_Dashboard .awards_sec .custom-dots .owl-dot.active {
            background-color: #713bdb;
            width: 24px;
            height: 10px;
            border-radius: 10px;
        }

.brainvire_Dashboard .video-slider .owl-carousel {
    position: relative;
}

    .brainvire_Dashboard .video-slider .owl-carousel .item {
        border-radius: 10px;
        overflow: hidden;
        max-height: 226px;
    }

        .brainvire_Dashboard .video-slider .owl-carousel .item video {
            width: 100%;
            height: 100%;
        }

            .brainvire_Dashboard .video-slider .owl-carousel .item video[poster] {
                object-fit: cover;
            }

.brainvire_Dashboard .video-slider .owl-prev,
.brainvire_Dashboard .video-slider .owl-next {
    background: none;
    border: none;
}

.brainvire_Dashboard .video-content,
.brainvire_Dashboard .video-date,
.brainvire_Dashboard .video-arrow,
.brainvire_Dashboard .video-icon {
    position: absolute;
}

.brainvire_Dashboard .video-content {
    opacity: 1;
    top: 10%;
    left: 5%;
    text-align: left;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
}

.brainvire_Dashboard .video-date {
    opacity: 1;
    top: 20%;
    left: 5%;
    text-align: left;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
}

.brainvire_Dashboard .video-arrow {
    display: flex;
    justify-content: end;
    width: 100%;
    top: 10%;
    right: 4%;
    font-size: 10px;
}

.brainvire_Dashboard .video-icon {
    height: 17px;
    top: 68%;
    right: 43%;
}

.brainvire_Dashboard .event_sec h6 {
    font-weight: 600;
}

.brainvire_Dashboard td {
    padding: 5px;
}

.brainvire_Dashboard .event_sec td {
    min-height: 73px;
}

.Announcement_sec td, .holiday_news_sec td {
    font-size: 14px;
}

.content.Brainvire .content1 {
    font-size: 14px;
}

.Announcement_sec td,
.Announcement_sec th,
.holiday_news_sec td, .holiday_news_sec th {
    padding: 10px;
}

.bold-heading {
    font-weight: bold;
}

.Announcement_sec .header_section {
    padding: 10px;
}

.font-size10 {
    font-size: 12px !important;
    margin-bottom: 5px;
    margin-top: 5px;
    font-weight: 400;
}

.h-25 {
    height: 25px;
}

.ml-6 {
    margin-left: 6px;
}

.my-3 {
    margin: 3px 0px;
}

.height205 {
    height: 226px;
}

.table-mid-1 img {
    /*   border-radius: 5px;*/
    height: 40px;
    width: 50px;
    margin: 5px;
}

.table-mid-2 img {
    /*   border-radius: 5px;*/
    height: 40px;
    width: 40px;
    margin: 5px;
}

.table-mid td {
    text-align: left;
    font-weight: bold;
    font-size: small;
}

table th, table td {
    font-family: "Montserrat";
}

.awards-img {
    margin: 2px 17px;
}

.table-mid span {
    font-size: x-small;
}

.justify-content-start {
    justify-content: flex-start;
}

.margin-right {
    margin-right: 30px;
}

.brainvire_Dashboard .birthday-img,
.brainvire_Dashboard .info-icon,
.brainvire_Dashboard .location-img,
.brainvire_Dashboard .calendar-img,
.brainvire_Dashboard .time-img,
.brainvire_Dashboard .video-icon {
    height: 12px !important;
    width: 12px !important;
    margin: 2px 4px 2px 0px !important;
}

.size {
    height: 9px !important;
}

.dropdown-main-month {
    padding: 6px;
    background-color: white;
    border: #d5d5d5 solid 1px;
    border-radius: 20px;
    min-width: 100px;
}

.dropdown-main-year {
    padding: 6px 7px;
    background-color: white;
    border: #d5d5d5 solid 1px;
    border-radius: 20px;
}

.pdf-img,
.view-icon {
    height: 19px !important;
    width: 13px !important;
}

.color-blue {
    color: #0095da;
}

.stat-link {
    text-decoration: underline;
    color: #008dd2;
}

.ui-datepicker {
    background-color: #FFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2)
}

    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
        height: 26px;
        min-width: 32px;
        max-width: 32px;
        text-align: center;
        cursor: pointer;
        color: transparent;
        line-height: 26px;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box
    }

        .ui-datepicker .ui-datepicker-prev .ui-icon, .ui-datepicker .ui-datepicker-next .ui-icon {
            color: transparent;
            visibility: hidden
        }

        .ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover {
            background-color: #EEE;
            text-decoration: none
        }

        .ui-datepicker .ui-datepicker-prev:before, .ui-datepicker .ui-datepicker-next:before {
            display: inline;
            font-family: FontAwesome;
            font-size: 14px;
            content: "\f060";
            color: #393939
        }

    .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover {
        top: 2px
    }

    .ui-datepicker .ui-datepicker-next:before {
        content: "\f061"
    }

    .ui-datepicker .ui-datepicker-prev-hover {
        left: 2px
    }

    .ui-datepicker .ui-datepicker-next-hover {
        right: 2px
    }

    .ui-datepicker td {
        padding: 0
    }

        .ui-datepicker td > a, .ui-datepicker td > span {
            display: inline-block;
            height: 22px;
            min-width: 24px;
            max-width: 24px;
            text-align: center;
            color: #393939;
            font-size: 13px;
            -webkit-box-sizing: content-box;
            -moz-box-sizing: content-box;
            box-sizing: content-box
        }

            .ui-datepicker td > a:hover {
                background-color: #EEE
            }

            .ui-datepicker td > a.ui-state-highlight {
                background-color: #d5e5ef
            }

            .ui-datepicker td > a.ui-state-active {
                background-color: #2283c5;
                color: #FFF
            }

            .ui-datepicker td > a.ui-priority-secondary {
                color: #888
            }

        .ui-datepicker td > span {
            color: #999
        }

        .ui-datepicker td .ui-datepicker-title select {
            height: 24px;
            line-height: 24px;
            padding: 2px 3px
        }

        .ui-datepicker td .ui-datepicker-buttonpane {
            background-color: #DDD;
            height: 1px
        }

.right__section.close__sidebar .footer__section {
    width: 95%;
}
/* .tooltip {
top: 48.1562px !important;
left: 25.75px !important;
display: block;
width: 325px;
}

.tooltip-inner {
text-align: justify;
padding: 20px;
background-color: white;
color: #20253A;
text-shadow: none;
box-shadow: 0px 0px 20px #00000029;
border-radius: 20px;
font-size: smaller;
max-width: none;
}

.tooltip-arrow {
display: none !important;
}

.custom-tooltip-date {
font-weight: bold;
color: #713BDB;
font-size: 11px;
}

.tooltip-3 {
font-weight: bold;
font-size: 9px;
margin: 7px 0px;
}

.tooltip-2 span {
font-size: 7px;
} */
.float-left {
    float: left;
}

.scroll-container {
    height: 250px;
    overflow: auto;
}

    .scroll-container::-webkit-scrollbar {
        width: 3px;
        height: 5px;
    }

    .scroll-container::-webkit-scrollbar-thumb {
        background-color: #888;
    }

    .scroll-container::-webkit-scrollbar-track {
        background-color: #f1f1f1;
    }

/*.scroll-container-newsletters {
max-height: 159px;
overflow: auto;
}*/

.d-block {
    display: block;
}

.image-circle {
    width: 3rem;
    border-radius: 50%;
    overflow: hidden;
}

.top__navs {
    display: flex;
    justify-content: space-between;
}

    .top__navs .top__navs__right {
        align-items: center;
        display: flex;
        text-align: center;
    }

        .top__navs .top__navs__right img {
            width: 50%;
        }

.top__navs__right .notepad .notepad_alldts {
    position: absolute;
    box-shadow: 0px 0px 20px #00000029;
    border-radius: 5px;
    padding: 15px;
    z-index: 9;
    width: 267px;
    opacity: 0;
    top: 17px;
    right: 34px;
    transition: all 0.5s;
    color: #000;
    visibility: hidden;
}

.top__navs__right .notepad:hover .notepad_alldts {
    opacity: 1;
    transition: all 0.5s;
    z-index: 9999;
    background: #fff;
    visibility: visible;
    width: 55%;
}

.timesheet__calendor .days li:hover .timesheet_alldts {
    opacity: 1;
    transition: all 0.5s;
    z-index: 9999;
    background: #fff;
    visibility: visible;
}



.top__navs__right .notepad .notepad_alldts h6 {
    margin-bottom: 10px;
    text-align: justify;
}

.top__navs__right .notepad .notepad_alldts b {
    font-weight: 700;
    margin-bottom: 10px;
}

.top__navs__right .notepad .notepad_alldts p a {
    margin-left: 0px;
}

.timesheet__calendor .days .timesheet_alldts {
    position: absolute;
    box-shadow: 0px 0px 20px #00000029;
    border-radius: 20px;
    padding: 10px;
    z-index: 9;
    background: #fff;
    width: 272px;
    opacity: 0;
    top: 0px;
    transition: all 0.5s;
    visibility: hidden;
}

    .timesheet__calendor .days .timesheet_alldts th {
        font-weight: 700;
        padding: 5px 10px;
        /*border-bottom: 1px solid #ddd;*/
    }

    .timesheet__calendor .days .timesheet_alldts table .border-buttom {
        border-bottom: 1px solid #ddd;
    }

    .timesheet__calendor .days .timesheet_alldts table {
        padding: 10px;
        border: none;
        text-align: justify;
    }

    .timesheet__calendor .days .timesheet_alldts .alldts__container {
        border: 1px solid #ddd;
        border-radius: 10px;
        /*padding: 10px;*/
    }

        .timesheet__calendor .days .timesheet_alldts .alldts__container > span {
            text-align: justify;
            font-weight: 700;
        }

        .timesheet__calendor .days .timesheet_alldts .alldts__container td {
            padding: 5px 10px;
        }

.calendar_position {
    position: absolute;
    right: 15px;
    top: 10px;
}

.calendar_position1 {
    position: absolute;
    right: 27px;
    top: 35px;
}

.dropdown-toggle {
    position: relative;
}

    .dropdown-toggle .arrow, .dropdown-toggle .font_icon {
        position: absolute;
        right: 10px; /* Adjust as needed */
        top: 50%; /* Align vertically to the middle */
        transform: translateY(-50%); /* Center vertically */
    }

.nav-list > li a:hover > .arrow, .nav-list > li.active > a > .arrow, .nav-list > li.open > a > .arrow {
    color: #fff;
}

.expensesEdit .nav-link {
    padding: .5rem 3rem;
}

.status_min_height {
    min-height: 205px;
}

.leave_deatail_sec .card-body {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    padding: 1rem;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 10px;
}

    .leave_deatail_sec .card-body .leave_balance {
        color: #00AC50;
    }

.leave_deatail_sec .card {
    border-radius: 10px;
    margin-top: 15px;
}

.leave_deatail_sec h6 {
    font-size: 13px;
}

.leave_deatail_sec col-md-2 {
    padding: 0px 7px;
}
.modal-dialog {
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}
/*.page__info ul {
    list-style-type: none;*/ /* Remove default bullets */
/*padding-left: 20px;*/ /* Add some padding for better alignment */
/*margin-left:0px;
}
.page__info ul li:before {
    content: "\2022"; 
    color: blue;*/ /* Change the color here */
/*font-size: 1.2em;*/ /* Adjust size if needed */
/*margin-right:5px;
   }*/
/* ----------data table class---------------*/
.fa.fa-eye {
    color: gray;
}

.dataTables_filter {
    display: flex;
}

    .dataTables_filter label {
        display: flex;
        align-items: center;
    }

.input__block textarea {
    min-height: 40px;
}

.btn:not(:disabled):not(.disabled).active, .btn:not(:disabled):not(.disabled):active {
    background: transparent linear-gradient(96deg,#713bdb 0%, #0c45b2 100%) 0% 0% no-repeat padding-box !important;
}

.table__block .select {
    width: auto !important;
}

.user__profile .user__initial .dropdown-item:active {
    background-color: #713bdb !important;
}

.user__profile .nav-pills .nav-link.active {
    background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    color: white !important;
    /*    border-radius: 10px;*/
    padding: 7px;
    border: 1px solid;
}

.user__profile .nav-pills .nav-link {
    color: #1c44b9;
    font-weight: 500;
}


    .user__profile .nav-pills .nav-link:hover {
        color: #1c44b9;
    }

.border_right {
    margin: 10px 0px;
    border-right: 1px solid #b3e6ff;
}

.timesheet_chart canvas {
    min-width: 200px;
    min-height: 250px;
    margin-top: -20px;
}

.top__navs__right {
    justify-content: end;
}
/*.viewTimesheet_dtl {
    display: flex;
    justify-content: center;
    position: relative;
}*/
.sidebar.close__sidebar + .right__section .footer__section {
    width: 95%;
}

.red {
    color: red !important;
}

.paging-nav {
    width: 100% !important;
    text-align: left !important;
    display: flex;
    justify-content: end;
    text-align-last: center;
}

    .paging-nav a {
        margin: 2px 2px;
        text-decoration: none;
        display: inline-block;
        padding: 1px 7px;
        /* background: #91b9e6;
                        color: white;*/
        color: #666 !important;
        border-radius: 3px;
    }

    .paging-nav .selected-page {
        background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
        color: #fff !important;
        border: none;
        border-radius: 50%;
        width: 35px;
        height: 35px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

.width_height {
    width: 53px !important;
    height: 50px !important;
}

.font-size-13 {
    font-size: 13px;
}
.atte_prev_next button {
    border: 0px;
    background: transparent;
    cursor: pointer;
}

@media (max-width: 2560px) and (min-width:1440px) {
    body{
        zoom:105%!important;
    }
    .loginSection .form__section .login-form .login-header {
        padding-left: 7rem;
        padding-right: 7rem;
    }
    .main__section .contain__area{
        height:89vh;
    }

}
@media (max-width: 2560px) and (min-width:1680px) {
    body {
        zoom: 110% !important;
    }

}


    @media (max-width: 991px) {
        .main-menu .menu-text {
            font-size: 11px;
        }

        body {
            font-size: 10px;
        }

        .login-form .login-header {
            padding: 10px 0px !important;
        }

        .video-slider {
            margin-bottom: 2rem;
        }

            .video-slider .owl-carousel .item {
                max-height: 320px;
            }

        .counter__block {
            flex-wrap: wrap;
        }

            .counter__block .main {
                flex-basis: 48%;
                /* max-width: 48%; */
                margin-right: 2%;
            }
    }

    @media (max-width: 767px) {

        body {
            overflow-y: scroll !important;
        }

        .loginSection .right_section {
            padding-right: 0px !important;
            height: 0;
            padding: 10px;
        }

        /*.login-form .login-header {
            padding: 1rem 5rem !important;
        }*/

        .brainvire_Dashboard .counter__block .col-md-3 {
            max-width: 20%;
            padding: 0px 5px;
        }

        .counter__block .main {
            flex-basis: 100%;
            max-width: 100%;
            margin-right: 0;
        }

        .brainvire_Dashboard .col-md-4,
        .brainvire_Dashboard .col-md-6 {
            margin-top: 10px !important;
        }

        .main__section .right__section .footer__section {
            width: 100%;
            transition: all 0.5s;
        }

        .brainvire_Dashboard .counter__block .col-md-3 {
            max-width: 100% !important;
        }

        .sidebar.close__sidebar + .right__section {
            width: 100%; /* Adjust width when .close__sidebar is present */
        }

        .awards-img {
            width: 45%;
        }

        .sidebar.close__sidebar .main-menu {
            padding-left: 0px;
        }

        .brainvire_Dashboard .owl-item .item {
            display: flex;
            justify-content: center;
        }

        .top__navs__right {
            justify-content: left;
            margin-top: 10px;
        }
    }

    @media (max-width: 470px) {
        .footer__section {
            width: 100%;
        }

        .login-form .login-header {
            padding: 1rem 1rem !important;
        }

        .loginSection .form__section .login-form {
            margin: 6rem 5rem;
        }

        .attendance__calendor .calendar__notes {
            min-height: 120px;
        }

        .card__block.calendar__section {
            min-height: 500px;
        }

        .awards-img {
            width: 45%;
        }

        .brainvire_Dashboard .owl-item .item {
            display: flex;
            justify-content: center;
        }

        .top__navs__left ul li a {
            margin-right: 0.5rem;
        }

        .top__navs__right {
            margin-top: 10px;
        }

        .sidebar + .right__section .footer__section {
            width: 100% !important;
        }

        .btn.main__btn.addDep {
            margin-top: 5px;
        }
    }
    /* shruti css ends */
    /* tanmay css start */
    .f-20 {
        font-size: 20px;
    }

    .f-14 {
        font-size: 14px;
    }

    .f-12 {
        font-size: 12px !important;
    }

    .progress-padding {
        padding: 11px;
    }

    .flew-wrap {
        flex-wrap: wrap;
    }

    .nowrap {
        white-space: nowrap;
    }

    .mb-10 {
        margin-bottom: 10px;
    }

    .circle {
        display: inline-block;
        border-radius: 50%;
        padding: 5px;
    }

    .status-panel {
        font-size: 13px !important;
        color: #20253a !important;
        border: none !important;
    }

    .attendance-progress {
        display: flex;
        border-radius: 10px;
        margin: 4px 10px 0 0;
        height: 10px !important;
    }

    .border-bottom-1 {
        border-bottom: 1px solid #d5d5d5;
    }


    .color-success-alpha {
        background-color: rgba(0, 172, 80, 0.5) !important;
    }

    .color-warning-alpha {
        background-color: rgba(255, 151, 32, 0.5) !important;
    }

    .color-info-alpha {
        background-color: rgba(0, 141, 210, 0.5) !important;
    }

    .color-danger-alpha {
        background-color: rgb(249, 0, 76, 0.5) !important;
    }

    .color-normal-alpha {
        background-color: #7ED5FF !important;
    }

    .color-blue-gradient {
        background-color: #2465e1;
    }

    .normal-color {
        background-color: #008DD2 !important;
    }

    .leave-summary {
        text-align: center;
        color: #fff;
        width: 45px;
        height: 45px;
        align-items: center;
        display: flex;
        justify-content: center;
    }

    .m-0 {
        margin: 0;
    }

    .pb-10 {
        padding-bottom: 10px;
    }

    .b-radius-15 {
        border-radius: 15px;
    }

    .b-radius-10 {
        border-radius: 10px !important;
    }

    .bg-gradient-blue-purple {
        background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
    }

    .bg-gradient-pink-orange {
        background: transparent linear-gradient(103deg, #ff5387 0%, #f8603b 100%) 0% 0% no-repeat padding-box;
    }

    .ml-30 {
        margin-left: 30px;
    }

    .expenses {
        background: #713bdb1a;
        border: 1px solid #713bdb;
        border-radius: 5px;
        color: #713bdb;
    }

        .expenses:hover {
            background-color: #713bdb;
            /*        border: 1px solid #713bdb;*/
            color: #fff;
            text-decoration: none;
        }

    .tax-doc {
        background: #ff3b701a;
        border: 1px solid #ff3b70;
        border-radius: 5px;
        color: #ff3b70;
    }

        .tax-doc:hover {
            background: #ff3b70;
            /*        border: 1px solid #ff3b70;*/
            color: #fff;
            text-decoration: none;
        }

    .travels {
        background: #008dd21a;
        border: 1px solid #008dd2;
        border-radius: 5px;
        color: #008dd2;
    }

        .travels:hover {
            background: #008dd2;
            /*        border: 1px solid #008dd2;*/
            color: #fff;
            text-decoration: none;
        }

    .assets {
        background: #ff97201a;
        border: 1px solid #ff9720;
        border-radius: 5px;
        color: #ff9720;
    }

        .assets:hover {
            background: #ff9720;
            /*        border: 1px solid #ff9720;*/
            color: #fff;
            text-decoration: none;
        }

    .profile {
        background: #00ac501a;
        border: 1px solid #49b242;
        border-radius: 5px;
        color: #49b242;
    }

        .profile:hover {
            background: #49b242;
            /*        border: 1px solid #49b242;*/
            color: #fff;
            text-decoration: none;
        }

    .r-work {
        background: #f8603b1a;
        border: 1px solid #f8603b;
        border-radius: 5px;
        color: #f8603b;
    }

        .r-work:hover {
            background: #f8603b;
            /*        border: 1px solid #f8603b;*/
            color: #fff;
            text-decoration: none;
        }

    .col-completed {
        background-color: #dfffee;
        padding: 5px;
        border-radius: 6px;
        color: #00ac50;
    }

    .present_date {
        background: #E3D5FF;
    }

    .LOP_day {
        background: #FFE5E5;
        color: #C70000;
        font-weight: bolder;
    }

    .selected_day {
        background: #E6FFF2;
    }

    /*    .present_date .weekoff {
        color: #fff !important;
    }*/

    /*    .present_date .status.weekoff {
        color: #fff;
    }*/

    .col-pending {
        background-color: #ffdee8;
        padding: 5px;
        border-radius: 6px;
        color: #f9004c;
    }

    .col-red {
        color: #f9004c;
    }

    .table-header {
        background-color: #f9fafc;
        color: #222222;
    }

    .quick-links {
        list-style: none;
        margin: 20px;
    }

    .menu-items a {
        text-decoration: none;
    }

    .quick-links-menu a {
        text-decoration: none;
        position: relative;
        display: inline-block;
        padding: 10px;
        min-width: 175px;
    }

        .quick-links-menu a span {
            position: absolute;
            right: 8px;
            opacity: 1;
            transition: opacity 0.3s ease, right 0.3s ease;
        }

        .quick-links-menu a:hover span {
            right: 15px;
            opacity: 1;
        }

        .quick-links-menu a img {
            transition: opacity 0.3s ease;
            padding-right: 5px;
        }

        .quick-links-menu a:hover img {
            opacity: 0;
            display: none;
        }

        .quick-links-menu a.expense-image::before
        .quick-links-menu a.tax-doc-image::before
        .quick-links-menu a.travels-image::before
        .quick-links-menu a.asset-image::before
        .quick-links-menu a.profile-image::before
        .quick-links-menu a.remote-image::before {
            display: none;
            position: absolute;
            top: 10px;
            transition: opacity 0.3s ease;
        }

        .quick-links-menu a.expenses::before {
            content: url('../images/Expenses2.svg');
            display: none;
        }

        .quick-links-menu a.tax-doc::before {
            content: url('../images/Tax Documentation2.png');
            display: none;
        }

        .quick-links-menu a.travels::before {
            content: url('../images/Travels2.svg');
            display: none;
        }

        .quick-links-menu a.assets::before {
            content: url('../images/Assets2.svg');
            display: none;
        }

        .quick-links-menu a.profile::before {
            content: url('../images/Profile2.svg');
            display: none;
        }

        .quick-links-menu a.r-work::before {
            content: url('../images/Remote Work2.svg');
            display: none;
        }

        .quick-links-menu a:hover::before {
            display: inline;
            opacity: 1;
            padding-right: 5px;
            position: relative;
            top: 2px;
        }

    .custum__tabs .nav-tabs > li {
        border: none;
    }

        .custum__tabs .nav-tabs > li > a {
            border: none;
            border-radius: 0;
            color: black;
            background: none;
        }

            .custum__tabs .nav-tabs > li > a:hover {
                border: none;
                background: none;
            }

        .custum__tabs .nav-tabs > li.active > a,
        .custum__tabs .nav-tabs > li.active > a:hover,
        .custum__tabs .nav-tabs > li.active > a:focus {
            border-bottom: 2px solid #008dd2;
            color: #008dd2;
            box-shadow: none;
            border: 0px;
        }

    .custum__tabs .tab-content {
        border: none;
    }

    .border-style {
        border-style: solid;
    }

    .input-checkbox {
        display: flex;
        align-items: center;
        padding-top: 15px;
    }

    .custom__width {
        min-width: 7rem !important;
    }

    .modal-header {
        background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
        color: #fff;
    }

    .modal-body {
        /*background-color: #f1f4fd;*/
    }

    .modal-footer {
        background-color: #f1f4fd;
    }

    .fieldTypeCheckbox-notice {
        margin: 4px 0 0 20px;
        height: 12px !important;
        width: 15px !important;
    }

    .mt-2rem {
        margin-top: 2rem;
    }

    .mt-4rem {
        margin-top: 4rem;
    }

    .btn-close {
        min-width: 7rem;
        height: 40px;
    }

    .br-20 {
        border-radius: 20px;
    }

    .modal-custom-size {
        max-width: 1024px !important;
    }

    .leave-modal {
        background: transparent linear-gradient(96deg, #0c45b2 0%, #713bdb 100%) 0% 0% no-repeat padding-box;
        color: white;
    }

    .leave-labels {
        margin: -1px -16px 10px;
    }

    .fs-09 {
        font-size: 0.9rem !important;
    }

    .pt-35 {
        padding-top: 35px;
    }

    .rounded-20 {
        border-radius: 1.25rem !important;
    }

    .nav-list > li.open > a {
    }

    .cal-custom {
        position: absolute;
        right: 30px;
        bottom: 25px;
    }

    .contain__area .table th a {
        color: black;
    }

        .contain__area .table th a:hover {
            text-decoration: underline;
        }

    .nav__style {
        border-bottom: 1px solid #d5d5d5;
    }

    .styled__nav {
        font-size: 15px;
        font-weight: 600;
        color: #222222
    }

        .styled__nav.active {
            background-color: transparent !important;
            color: #008dd2 !important;
            border-bottom: 2px solid #008dd2 !important;
            border-radius: 0px !important;
            font-size: 15px;
            font-weight: 600;
        }

    .sidebar.close__sidebar .nav-list > li .submenu {
        position: absolute;
        z-index: 999;
        top: 60px;
        left: 43px;
    }

    sidebar close__sidebar .right__section {
        width: 95%;
    }

    .close__btn {
        display: none;
    }

    @media (max-width: 990px) {
        .bg-gradient-blue-purple {
            margin-bottom: 15px;
        }

        .main__section .right__section {
            width: 100%;
            transition: all 0.5s;
        }

        .quick-links {
            flex-wrap: wrap;
        }

        .quick-links-menu {
            margin-bottom: 10px;
        }

        .close__btn {
            display: none;
        }
    }

    @media (max-width: 425px) {
        .status-div {
            flex-wrap: wrap;
        }

        .cert-summary-div {
            flex-wrap: wrap;
        }

        .loginSection .form__section .login-form .HRMS_logo img {
            height: 27px;
            margin: 10px !important;
        }

        .login-header {
            padding: 0px 10px 0px 0px !important;
        }
    }

    /* tanmay css end */

    @media (max-width: 991px) {
        .main__section .top__count .dash-widget {
            margin-bottom: 1rem;
        }

        .login__form {
            padding: 1rem;
        }

        .header__section .logo__section img {
            width: 100px;
        }

        .header__section .welcome__block {
            display: none;
        }

        .header__section .user__block {
            display: flex;
            margin-top: 5px;
            width: 100%;
            justify-content: flex-end;
        }

        .header__section .user__designation {
            width: auto;
        }

        .top__space {
            padding-top: 2rem;
        }

        .attendance__calendor .weekdays li,
        .attendance__calendor .days li {
            width: 12.6%;
        }

        .top__navs__left ul li a {
            min-height: 65px;
        }
    }

    @media (max-width: 767px) {
        /* .nav .menu-text, icon-angle-down {
        display: none !important;
    }*/

        /* .dashboard__logo img {
        display: none;
    }*/
        .dashboard__logo h3 {
            text-align: center;
        }

        .hide__label {
            display: none !important;
        }

        .main__section .right__section.close__sidebar {
            width: 100%;
            transition: all 0.5s;
        }
        /* .main__section .sidebar.close__sidebar .close__btn {
        display: none;
    }*/
        .main__section .sidebar .close__btn {
            position: relative;
            color: #fff;
            background: #b93236;
            right: -3px;
            width: 2rem;
            height: 2rem;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .login__section .login__img {
            display: none;
        }

        .main__section .sidebar {
            position: absolute;
            z-index: 2;
            width: 60%;
            left: 0;
            max-height: 100vh;
            overflow-y: auto;
        }

            .main__section .sidebar.close__sidebar {
                left: -30rem;
                /*width: 60%;*/
            }

        .right__section .footer__section {
            bottom: 0px;
            width: 100% !important;
            z-index: 999;
        }

        .main__section .contain__area {
            height: calc(100vh - -116px) !important;
        }

        .main__section .table__block {
            margin-top: 1rem;
        }

        .main__section .chart__block {
            min-height: auto;
        }

        .loginSection {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
            background: url('../../Content/images/login_Image.png');
            background-size: cover;
        }

            .loginSection .form__section {
                background: rgba(255, 255, 255, 0.8);
                border-radius: 10px;
            }

            .loginSection .right_section .footer {
                display: flex;
                justify-content: center;
                align-items: center;
                margin-bottom: 10px;
                top: 480px;
            }
    }

    .datepicker td, .daterangepicker td, .datepicker th, .daterangepicker th {
        border-radius: 0 !important;
        font-size: 13px
    }

        .datepicker td.active, .daterangepicker td.active, .datepicker td.active:hover, .daterangepicker td.active:hover {
            background: #2283c5 !important
        }

            .datepicker td.active.disabled, .daterangepicker td.active.disabled, .datepicker td.active.disabled:hover, .daterangepicker td.active.disabled:hover {
                background: #8b9aa3 !important
            }

    .datepicker td, .datepicker th {
        min-width: 45px
    }

    .datepicker th {
        height: 35px !important
    }

    .datepicker-months .month, .datepicker-years .year {
        border-radius: 0 !important
    }

        .datepicker-months .month.active, .datepicker-years .year.active, .datepicker-months .month.active:hover, .datepicker-years .year.active:hover, .datepicker-months .month.active:focus, .datepicker-years .year.active:focus, .datepicker-months .month.active:active, .datepicker-years .year.active:active {
            background-image: none !important;
            background-color: #2283c5 !important
        }

    .nav-list > li.open {
        font-family: "Montserrat";
        content: "\f105";
        float: right;
    }

    .dropdown-toggle::after {
        visibility: hidden;
        display: none !important;
    }


    .nav.nav-list li {
        width: 100% !important;
    }

    .nav-list > li > a > [class*="fa-"]:first-child {
        display: inline-block;
        vertical-align: middle;
        min-width: 30px;
        text-align: center;
        font-size: 18px;
        font-weight: normal;
        margin-right: 5px;
    }

    .nav-list > li > a > [class*="icon-"]:first-child {
        display: inline-block;
        vertical-align: middle;
        min-width: 30px;
        text-align: center;
        font-size: 18px;
        font-weight: normal;
        margin-right: 5px;
    }

    /*  .nav.nav-list li a {
        justify-content: space-between !important;
    }
*/


    .custom_height {
        min-height: 300px;
    }

    .custom_height_attendance {
        min-height: 200px;
    }

    .custom-model {
        width: 1008px;
    }
