/* Site CSS*/
:root {
    --pageBackground: #ffffff;
    --mainNavigationBackground: #5C5C59;
    --mainNavigationAltBackground: #F1F1F2;
    --mainNavigationHoverBackground: #4C4C4E;
    --pageWidth: 960px;
    --headerForeground: #444444;
    --subnavigationForeground: #808284;
    --subnavigationSelectedForeground: 000000;
    --orangeColor: #F48120
}

#components-reconnect-modal,
.components-reconnect-show, .components-reconnect-failed, .components-reconnect-rejected {
    display: none !important;
}

/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: #4793d9;
}

#externalMenu .btn-primary,
.btn-primary {
    color: #FEFEFE;
    background-color: #50A930;
    border-color: #50A930;
}

    .btn-primary:hover {
        color: #fff;
        background-color: #3BA718;
        border-color: #3BA718;
    }

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #50A930;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
    font-family: 'Open Sans', sans-serif !important;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 0px;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 12px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    font-size: 14px;
    line-height: 36px;
}

#externalMenu .btn,
.btn.small {
    font-family: "Open Sans";
    font-size: 12px;
    letter-spacing: 0;
    line-height: 17px;
    text-align: center;
    padding: 2px 20px;
    border-radius: 2px;
}

.form-control {
    font-size: 12px;
    border-radius: 2px;
    border: 1px solid #9B9B9A;
    height: 24px;
    background-color: initial;
    font-weight: 400;
    color: initial;
}

input[type='number'].form-control,
input[type='text'].form-control {
    height: 26px;
}

.search-container {
    border: 1px solid #979797;
    padding: 10px 10px 20px 10px;
    border-radius: 2px;
    margin-bottom: 20px;
}

i.close.icon {
    position: relative;
    width: 15px;
    height: 15px;
    opacity: 0.3;
    cursor: pointer;
}

    i.close.icon:hover {
        opacity: 1;
    }

    i.close.icon:before, i.close.icon:after {
        position: absolute;
        left: 6px;
        content: ' ';
        height: 15px;
        width: 2px;
        background-color: #333;
    }

    i.close.icon:before {
        transform: rotate(45deg);
    }

    i.close.icon:after {
        transform: rotate(-45deg);
    }

i.btn-close.icon {
    position: relative;
    width: 15px;
    height: 15px;
    opacity: 0.3;
    cursor: pointer;
    padding: 0;
}

    i.btn-close.icon:hover {
        opacity: 1;
    }

    i.btn-close.icon:before, i.close.icon:after, i.btn-close.icon:after {
        position: absolute;
        left: 6px;
        content: ' ';
        height: 16px;
        width: 2px;
        background-color: #333;
    }

i.close_ach:after {
    position: absolute !important;
    left: 6px !important;
    content: ' ' !important;
    height: 16px !important;
    width: 2px !important;
    background-color: #333 !important;
}

i.btn-close.icon:before {
    transform: rotate(45deg);
}

i.btn-close.icon:after {
    transform: rotate(-45deg);
}

a.ctrl_btn.orange {
    color: #fff;
    background-color: #F48120;
    cursor: pointer;
}

    a.ctrl_btn.orange:hover {
        color: #fff;
        background-color: #F37006;
    }

a.ctrl_btn.large {
    padding: 8px 15px 8px 45px;
    height: 40px;
    font-size: 18px;
    width: initial;
    margin-right: 0px;
}

a.ctrl_btn.add-project {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/add-project-icon.svg);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-invoice {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/invoices/add-invoice.svg);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-contact {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/contacts/contact.svg);
    display: inline-block;
    background-size: 30px;
}


a.ctrl_btn.add-client {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/clients/add-client.svg);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-payment {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/Billing/add-adjustment.svg);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-adjustment {
    background-image: url(../Images/Billing/add-adjustment.svg);
    background-position: 10px center;
    background-repeat: no-repeat;
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-trust {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/Billing/icon-addnewtrustaccount.png);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-bank {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/Billing/icon-addbankaccount.png);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn,
h2.page-title {
    text-transform: capitalize;
}

.overlay {
    background-color: #000000aa;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: 100%;
    display: none;
}

.modal-window {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: 100%;
    z-index: 1;
    align-items: center;
    justify-content: center;
    line-height: normal;
}

    .modal-window.visible {
        display: flex;
    }

    .modal-window .overlay {
        display: block;
    }

    .modal-window .content {
        z-index: 1;
        width: 740px;
        height: 416px;
        background-color: White;
        overflow: hidden;
        box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
        border-radius: 2px;
        color: #000;
    }

        .modal-window .content iframe {
            width: 740px;
            height: 416px;
            overflow: hidden;
            border: none;
        }

    .modal-window.small .content {
        width: 532px;
    }

        .modal-window.small .content iframe {
            width: 550px;
            height: 380px;
            overflow: hidden;
            border: none;
        }

.import-link {
    color: #4793d9;
    font-size: 12px;
    cursor: pointer;
    text-decoration: underline;
    float: right;
}

.modal-window.confirmation .content {
    width: auto;
    height: auto;
    padding: 20px;
    font-size: 12px;
    max-width: 400px;
}

.modal-window .processing .datatable-loading {
    display: block !important;
}

.lds-spinner {
    display: inline-block;
    position: absolute;
    width: 80px;
    height: 80px;
    margin: auto;
    border: 0;
    top: 50%;
    left: 0;
    right: 0;
    margin-top: -40px;
}

    .lds-spinner.small {
        width: 40px;
        height: 40px;
        margin-top: -29px;
    }

    .lds-spinner div {
        transform-origin: 40px 40px;
        animation: lds-spinner 1.2s linear infinite;
    }

        .lds-spinner div:after {
            content: " ";
            display: block;
            position: absolute;
            top: 23px;
            left: 37px;
            width: 3.5px;
            height: 8px;
            border-radius: 40%;
            background: #333;
        }

    .lds-spinner.small div:after {
        top: 30px;
        left: 39px;
        width: 1.8px;
        height: 4px;
        border-radius: 20%;
    }

    .lds-spinner.light div:after {
        background: #fff;
    }

    .lds-spinner div:nth-child(1) {
        transform: rotate(0deg);
        animation-delay: -1.1s;
    }

    .lds-spinner div:nth-child(2) {
        transform: rotate(30deg);
        animation-delay: -1s;
    }

    .lds-spinner div:nth-child(3) {
        transform: rotate(60deg);
        animation-delay: -0.9s;
    }

    .lds-spinner div:nth-child(4) {
        transform: rotate(90deg);
        animation-delay: -0.8s;
    }

    .lds-spinner div:nth-child(5) {
        transform: rotate(120deg);
        animation-delay: -0.7s;
    }

    .lds-spinner div:nth-child(6) {
        transform: rotate(150deg);
        animation-delay: -0.6s;
    }

    .lds-spinner div:nth-child(7) {
        transform: rotate(180deg);
        animation-delay: -0.5s;
    }

    .lds-spinner div:nth-child(8) {
        transform: rotate(210deg);
        animation-delay: -0.4s;
    }

    .lds-spinner div:nth-child(9) {
        transform: rotate(240deg);
        animation-delay: -0.3s;
    }

    .lds-spinner div:nth-child(10) {
        transform: rotate(270deg);
        animation-delay: -0.2s;
    }

    .lds-spinner div:nth-child(11) {
        transform: rotate(300deg);
        animation-delay: -0.1s;
    }

    .lds-spinner div:nth-child(12) {
        transform: rotate(330deg);
        animation-delay: 0s;
    }

@keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.client-selector .ctrl_btn {
    margin-right: 0;
}

.reddot-label {
    font-weight: bold;
    font-size: 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    color: black;
}

    .reddot-label > span {
        background-color: #C81F18;
        border-radius: 50%;
        width: 6px;
        height: 6px;
        margin-right: 10px;
    }

.in-prebilled {
    background-image: url('../images/invoices/icon_prebilled.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px;
}

.in-billed {
    background-image: url('../images/invoices/icon_billed.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px;
}

.in-sent {
    background-image: url('../images/invoices/sent.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 27px;
}

.in-delivered {
    background-image: url('../images/invoices/Delivered.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 27px;
}

.in-opened {
    background-image: url('../images/invoices/Opened.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 27px;
}

.in-bounced {
    background-image: url('../images/invoices/Bounced.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 27px;
}

.hide {
    display: none;
}

.bold-link {
    font-weight: 600;
    color: #4793d9;
    text-decoration: underline;
    cursor: pointer;
    font-size: 12px;
}

.disabled .bold-link {
    color: #A7A9AB;
    text-decoration: underline;
    cursor: default;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
.checkbox-list {
    margin-top: 4px;
}

    .checkbox-list label {
        display: block;
        margin-top: 2px;
    }

#component-date-range {
    font-size: 12px;
}

.btn_blue:disabled {
    background: #b2c0ca !important;
}

.modal-window .modal-header {
    border-bottom: 0;
    position: sticky;
    top: 0;
    background: rgba(255,255,255,0.5);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-radius: 0;
    height: 30px;
    padding: 8px;
}

.modal-window .content.with-scroll {
    overflow-y: auto;
}

.message-header {
    margin-top: -15px;
    height: 20px;
    margin-bottom: 20px;
    margin-right: -15px;
    margin-left: 25px;
    font-weight: 400;
}

    .message-header label {
        padding: 0;
    }

.muted {
    color: #929396;
}

.timepicker.form-control {
    background-color: white;
}


#squatchModal {
    display: none;
}

#info, .info {
    background-image: url(../images/icons/exclamation.png);
    font-weight: 300;
    background-repeat: no-repeat;
}

    #info span, .info span {
        margin-left: 20px;
    }

    #info.nomargin {
        margin: 0px;
        line-height: 16px;
    }

.validation-message {
    color: red;
}

.disabledEmail {
    pointer-events: none;
    opacity: 0.6;
    background-color: lightgray;
}

ul.tabs > li > a {
    border: none !important;
    border-bottom: 0;
    position: relative;
    bottom: 1px !important;
    font-size: 13px !important;
    margin-left: 9px !important;
    margin-bottom: -1px !important;
    cursor: pointer;
}

    ul.tabs > li > a.active {
        border: none !important;
        border-bottom: 5px solid #F48120 !important;
        bottom: 1px !important;
        height: 30px;
    }

ul.tabs {
    border-bottom: 2px solid #B9B9B9 !important;
    min-width: 100%;
}

.country-list {
    width: 300px;
}

h1.page-title {
    color: #444444;
    font-family: "Open Sans";
    font-size: 24px !important;
    letter-spacing: 0.55px;
    line-height: 33px;
    border-bottom: 1px solid #B9B9B9;
    padding-bottom: 14.5px;
    margin-bottom: 20px;
}

.admin-home-btn {
    background-image: url('../images/settings-menu-icons/back arrow-normal.svg');
    width: 18px;
    height: 15px;
    background-size: cover;
    display: inline-block;
    cursor: pointer;
}

    .admin-home-btn:hover {
        opacity: 0.7;
    }


a.ctrl_btn.add-timeoff {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/timeofflist/PTO_addTimeOff.svg);
    display: inline-block;
    background-size: 30px;
}

.submited {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    font-weight: 600;
    text-align: center;
}

.approved {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    font-weight: 600;
    text-align: center;
    --color: var(--color-label) !important;
}

.rejected {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    font-weight: 600;
    text-align: center;
}

.canceled {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    font-weight: 600;
    text-align: center;
}

.pending {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    font-weight: 600;
    text-align: center;
    --color: var(--color-label) !important;
}


.timeoffstatus {
    clear: both;
    float: left;
    margin-top: 50px;
    margin-left: -1px;
    display: none;
}

a.ctrl_btn.add-time {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/icons/track-time.svg);
    display: inline-block;
    background-size: 30px;
}

a.ctrl_btn.add-expense {
    background-position: 10px center;
    background-repeat: no-repeat;
    background-image: url(../Images/icons/add-expense.svg);
    display: inline-block;
    background-size: 30px;
}

.displaySuccessImg {
    background: url("../Images/Icons/tick.png") no-repeat scroll 5px 10px rgba(0, 0, 0, 0);
    display: inline-block;
    font-size: 12px;
    font-weight: 400;
    height: 36px;
    line-height: 36px;
    margin-top: -2px;
    padding-left: 30px;
    padding-right: 15px;
    padding-top: 3px;
}

.displayErrorImg {
    color: #ED1C24 !important;
    font-size: 12px;
    padding-left: 30px;
    padding-right: 15px;
    font-weight: 400;
    min-height: 36px;
    line-height: 38px;
    display: inline-block;
    vertical-align: middle;
}

.displayWarningImg {
    background-image: url(../Images/Icons/warning.png);
    background-repeat: no-repeat;
    color: #FF9900 !important;
    font-size: 12px;
    padding-left: 30px;
    padding-right: 15px;
    font-weight: 400;
    min-height: 36px;
    line-height: 38px;
    display: inline-block;
    vertical-align: middle;
}

.lockImg {
    border-width: 0px;
    float: left;
    border: none;
    padding-top: 2px;
}

.True {
    display: block;
}

.False {
    display: none;
}

.multi-checkboxes_wrap:before {
    font-family: fontAwesome;
    color: #999;
    content: "\f096";
    width: 25px;
    height: 25px;
    padding-right: 10px;
}

.multi-checkboxes_wrap[aria-selected=true]:before {
    content: "\f14a";
}







/************ New menu *************/

#verticalBar {
    background: #fff url('../images/dolphin_bg_55.gif') repeat-x left bottom;
    text-decoration: none;
    height: 40px;
}

    #verticalBar ul {
        padding: 0;
        list-style: none;
        text-align: center;
        width: 100%;
        height: 61px;
        float: left;
        padding-left: 50px;
    }

    #verticalBar li {
        background: url('../images/BlueTabLeftBar.gif') left;
        background-repeat: no-repeat;
        float: left;
        padding: 40px 0 40px 14px;
        display: block;
    }

    #verticalBar ul li span {
        background: url('../images/Menu_bg.png') right bottom;
        background-repeat: repeat;
        padding: 40px 8px 40px 0px;
        width: 200px;
    }

    #verticalBar ul li a {
        color: white;
        background: url('../images/BlueTab_RightBar.gif') right;
        background-repeat: no-repeat;
        padding: 40px 8px 40px 0px;
    }


/***************** Menu Navigation*****************/

#navibar .nav_dashboard,
#navibar .nav_entries,
#navibar .nav_setting,
#navibar .nav_billing,
#navibar .nav_legal,
#navibar .nav_wcsynclogs,
#navibar .nav_qb,
#navibar .nav_reckon,
#navibar .nav_accounting,
#navibar .nav_project,
#navibar .nav_client,
#navibar .nav_invoice,
#navibar .nav_xero,
#navibar .nav_ADP,
#navibar .nav_Sage,
#navibar .nav_clio,
#navibar .nav_intacct,
#navibar .nav_zenpayroll,
#navibar .nav_myob,
#navibar .nav_concur,
#navibar .nav_sync,
#navibar .nav_morepartner,
#navibar .nav_Autofy,
#navibar .nav_schedule,
#navibar .nav_invTracker,
#navsubnav .dashboard,
#navsubnav .entries,
#navsubnav .setting,
#navsubnav .billing,
#navsubnav .legal,
#navsubnav .wcsynclogs,
#navsubnav .qb,
#navsubnav .reckon,
#navsubnav .accounting,
#navsubnav .approval,
#navsubnav .project,
#navsubnav .client,
#navsubnav .invoice,
#navsubnav .xero,
#navsubnav .adp,
#navsubnav .sage,
#navsubnav .myob,
#navsubnav .zenpayroll,
#navsubnav .concur,
#navsubnav .sync,
#navsubnav .morepartner,
#navsubnav .clio,
#navsubnav .intacct,
#navsubnav .autofy,
#navsubnav .schedule,
#navsubnav .invTracker {
    width: 960px;
}



.navibar_container {
    padding: 0px;
    width: 100%;
}

#navsubnav div {
    margin: auto;
    /* width: 1003px; 
	width: 950px;*/
    height: 55px;
}

.navibarOut {
    float: left;
    width: 100%;
}

#navibar {
    /*background: #FFFFFF url(../Images/Common/tabmenu-bg.jpg) repeat-x scroll left top;*/
    background: #5C5C59;
    /*font: 9pt Arial;*/
    text-decoration: none;
    height: 40px;
    /*width:1003px;*/
    width: 100%;
    margin: auto;
}

    #navibar div {
        margin: auto;
        /* width: 1003px; 
	width: 950px;*/
    }

    #navibar ul {
        list-style: none;
        text-align: center;
        height: 30px;
        /*position: relative;*/
        /*padding-left: 65px;*/
        padding-left: 0px;
        margin: 0px;
        margin: auto;
    }

    #navibar li {
        /* background-image: url('../Images/Common/tabmenu-left.jpg'); */
        height: 40px;
        background-position: top left;
        background-repeat: no-repeat;
        display: block;
        float: left;
        padding: 0px;
        cursor: pointer;
        margin-right: 3px;
        font-size: 14px;
        font-weight: 400;
    }

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

#navibar li.scheduling {
    /*
	background-image: url('../Images/scheduling/tabmenu-sch-hover-left.jpg');
	background-position: top left;
	background-repeat: no-repeat;
    */
    background: #F48120;
    display: block;
    float: right;
    padding: 0px;
    cursor: pointer;
    width: 100px;
    margin-top: 4px;
    height: 36px;
}

    #navibar li.scheduling:hover {
        /*background: #f37006;*/
    }

#navibar li.moremenu {
    background: #5D5C58;
    display: block;
    float: right;
    padding: 0px;
    cursor: pointer;
    width: 59px;
    margin-top: 4px;
    height: 36px;
}

#navibar li.search {
    display: block;
    float: right;
    padding: 0px;
    margin-top: 4px;
}


#navibar li.menu_selected {
    display: block;
    float: left;
    padding: 0px;
    background-repeat: no-repeat;
}
/* Safari Hack

 @media screen and (-webkit-min-device-pixel-ratio:0)
 {

 }
*/
#navibar ul li a {
    /* background-image: url('../Images/Common/tabmenu-right.jpg'); */
    height: 27px;
    background-repeat: no-repeat;
    background-position: right top;
    color: #FFF;
    margin-left: 8px;
    padding: 10px 13px 0 0;
    text-decoration: none;
    /*font-size: 14px;
	 font-weight: bold; */
    display: block;
}

.navibar-a-german {
    margin-left: 5px !important;
}

#navibar ul li.scheduling a {
    background-image: url('../Images/white-cross.png');
    background-repeat: no-repeat;
    background-position: 0px 11px;
    height: 25px;
    color: #FFF;
    margin-left: 15px;
    padding: 5px 5px 5px 0;
    text-decoration: none;
    /*font-size: 13px;
	font-weight: bold;*/
    display: block;
}

#navibar ul li.moremenu a {
    background-image: url('../Images/Icons/dropdown_white.png');
    background-repeat: no-repeat;
    background-position: 60px 6px;
    height: 25px;
    color: #FFF;
    margin-left: -10px;
    padding: 5px 5px 5px 0;
    text-decoration: none;
    /*font-size: 13px;
	font-weight: bold;*/
    display: block;
}

#navibar ul li.menu_selected a,
#navibar ul li.menu_hover a {
    color: #FFFFFF;
    padding: 10px 13px 0 0;
    /*margin-left: 10px;*/
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: right top;
    display: block;
}


#navibar ul li.menu_selected a {
    font-weight: 600 !important;
    color: #000000 !important;
    background-color: #f1f1f2 !important;
}


#navibar li.menu_selected.dashboard {
    /* background-image: url('../Images/Dashboard/tabmenu-dashboard-hover-left.jpg'); 
	height:42px; */
    background: #F1F2F2;
    background-image: url('../Images/dashboard-icon.png');
    background-repeat: no-repeat;
    width: 50px;
    background-position: 15px 11px;
}


#navibar li.menu_hover.dashboard {
    /* background-image: url('../Images/Dashboard/tabmenu-dashboard-hover-left.jpg'); 
	height:42px; */
    /*background: #F3F3F4;*/
}

#navibar li.menu_hover.dashboard {
    background-color: #4C4C4E;
    /*background-image: url('../Images/dashboard-icon-w.png');
    background-color: #4C4C4E !important;
    background-repeat: no-repeat;
    /*width: 20px;*/
    /*background-position: 15px 11px;*/
}



#navibar ul li.menu_selected.dashboard a,
#navibar ul li.menu_hover.dashboard a {
    /* background-image: url('../Images/Dashboard/tabmenu-dashboard-hover-right.jpg'); */
    height: 27px;
    /*background: #F3F3F4;*/
}

#navibar li.menu_selected.user,
#navibar li.menu_hover.user {
    /* background-image: url('../Images/User/tabmenu-user-hover-left.jpg'); */
}

#navibar ul li.menu_selected.user a,
#navibar ul li.menu_hover.user a {
    /* background-image: url('../Images/User/tabmenu-user-hover-right.jpg'); */
}

#navibar li.menu_selected.client,
#navibar li.menu_hover.client {
    /* background-image: url('../Images/Client/tabmenu-client-hover-left.jpg'); */
}

#navibar ul li.menu_selected.client a,
#navibar ul li.menu_hover.client a {
    /* background-image: url('../Images/Client/tabmenu-client-hover-right.jpg'); */
}

#navibar li.menu_selected.project,
#navibar li.menu_hover.project {
    /* background-image: url('../Images/Project/tabmenu-project-hover-left.jpg'); */
}

#navibar ul li.menu_selected.project a,
#navibar ul li.menu_hover.project a {
    /* background-image: url('../Images/Project/tabmenu-project-hover-right.jpg'); */
}

#navibar li.menu_selected.timeexpense,
#navibar li.menu_hover.timeexpense {
    /* background-image: url('../Images/TimeExpense/tabmenu-te-hover-left.jpg'); */
}

#navibar ul li.menu_selected.timeexpense a,
#navibar ul li.menu_hover.timeexpense a {
    /* background-image: url('../Images/TimeExpense/tabmenu-te-hover-right.jpg'); */
}

#navibar li.menu_selected.scheduling,
#navibar li.menu_hover.scheduling {
    /* background-image: url('../Images/scheduling/tabmenu-sch-hover-left.jpg'); */
}

#navibar ul li.menu_selected.scheduling a,
#navibar ul li.menu_hover.scheduling a {
    /* background-image: url('../Images/scheduling/tabmenu-sch-hover-right.jpg'); */
}

#navibar li.menu_selected.invoice,
#navibar li.menu_hover.invoice {
    /* background-image: url('../Images/invoice/tabmenu-in-hover-left.jpg'); */
}

#navibar ul li.menu_selected.invoice a,
#navibar ul li.menu_hover.invoice a {
    /* background-image: url('../Images/invoice/tabmenu-in-hover-right.jpg'); */
}

#navibar li.menu_selected.accounting,
#navibar li.menu_hover.accounting {
    /* background-image: url('../Images/Accounting/tabmenu-acc-hover-left.jpg'); */
}

#navibar ul li.menu_selected.accounting a,
#navibar ul li.menu_hover.accounting a {
    /* background-image: url('../Images/Accounting/tabmenu-acc-hover-right.jpg'); */
}

#navibar li.menu_selected.contact,
#navibar li.menu_hover.contact {
    /* background-image: url('../Images/Contact/tabmenu-con-hover-left.jpg'); */
}

#navibar ul li.menu_selected.contact a,
#navibar ul li.menu_hover.contact a {
    /* background-image: url('../Images/Contact/tabmenu-con-hover-right.jpg'); */
}

#navibar li.menu_selected.report,
#navibar li.menu_hover.report {
    /* background-image: url('../Images/Report/tabmenu-rep-hover-left.jpg'); */
}

#navibar ul li.menu_selected.report a,
#navibar ul li.menu_hover.report a {
    /* background-image: url('../Images/Report/tabmenu-rep-hover-right.jpg'); */
}

#navibar li.menu_selected.setting,
#navibar li.menu_hover.setting {
    /* background-image: url('../Images/Setting/tabmenu-set-hover-left.jpg'); */
}

#navibar ul li.menu_selected.setting a,
#navibar ul li.menu_hover.setting a {
    /* background-image: url('../Images/Setting/tabmenu-set-hover-right.jpg'); */
}

#navibar li.menu_selected.prepaidhour,
#navibar li.menu_hover.prepaidhour {
    /* background-image: url('../Images/scheduling/tabmenu-sch-hover-left.jpg'); */
}

#navibar ul li.menu_selected.prepaidhour a,
#navibar ul li.menu_hover.prepaidhour a {
    /* background-image: url('../Images/scheduling/tabmenu-sch-hover-right.jpg'); */
}

#navibar li.menu_selected.moremenu,
#navibar li.menu_hover.moremenu {
    /* background-image: url('../Images/scheduling/tabmenu-sch-hover-left.jpg'); */
}

#navibar ul li.menu_selected.moremenu a,
#navibar ul li.menu_hover.moremenu a {
    /* background-image: url('../Images/scheduling/tabmenu-sch-hover-right.jpg'); */
}

#navibar li.menu_selected.user,
#navibar li.menu_hover.user,
#navibar ul li.menu_selected.user a,
#navibar ul li.menu_hover.user a,
#navibar li.menu_selected.client,
#navibar li.menu_hover.client,
#navibar ul li.menu_selected.client a,
#navibar ul li.menu_hover.client a,
#navibar li.menu_selected.project,
#navibar li.menu_hover.project,
#navibar ul li.menu_selected.project a,
#navibar ul li.menu_hover.project a,
#navibar li.menu_selected.timeexpense,
#navibar li.menu_hover.timeexpense,
#navibar ul li.menu_selected.timeexpense a,
#navibar ul li.menu_hover.timeexpense a,
#navibar li.menu_selected.scheduling,
#navibar li.menu_hover.scheduling,
#navibar ul li.menu_selected.scheduling a,
#navibar ul li.menu_hover.scheduling a,
#navibar li.menu_selected.invoice,
#navibar li.menu_hover.invoice,
#navibar ul li.menu_selected.invoice a,
#navibar ul li.menu_hover.invoice a,
#navibar li.menu_selected.accounting,
#navibar li.menu_hover.accounting,
#navibar ul li.menu_selected.accounting a,
#navibar ul li.menu_hover.accounting a,
#navibar li.menu_selected.approval,
#navibar li.menu_hover.approval,
#navibar ul li.menu_selected.approval a,
#navibar ul li.menu_hover.approval a,
#navibar li.menu_selected.contact,
#navibar li.menu_hover.contact,
#navibar ul li.menu_selected.contact a,
#navibar ul li.menu_hover.contact a,
#navibar li.menu_selected.report,
#navibar li.menu_hover.report,
#navibar ul li.menu_selected.report a,
#navibar ul li.menu_hover.report a,
#navibar li.menu_selected.setting,
#navibar li.menu_hover.setting,
#navibar ul li.menu_selected.setting a,
#navibar ul li.menu_hover.setting a,
#navibar li.menu_selected.legal,
#navibar li.menu_hover.legal,
#navibar ul li.menu_selected.legal a,
#navibar ul li.menu_hover.legal a,
#navibar li.menu_selected.wcsynclogs,
#navibar li.menu_hover.wcsynclogs,
#navibar ul li.menu_selected.wcsynclogs a,
#navibar ul li.menu_hover.wcsynclogs a,
#navibar li.menu_selected.entries,
#navibar li.menu_hover.entries,
#navibar ul li.menu_selected.entries a,
#navibar ul li.menu_hover.entries a,
#navibar li.menu_selected.qb,
#navibar li.menu_hover.qb,
#navibar ul li.menu_selected.qb a,
#navibar ul li.menu_hover.qb a,
#navibar li.menu_selected.reckon,
#navibar li.menu_hover.reckon,
#navibar ul li.menu_selected.reckon a,
#navibar ul li.menu_hover.reckon a,
#navibar li.menu_selected.prepaidhour,
#navibar li.menu_hover.prepaidhour,
#navibar ul li.menu_selected.prepaidhour a,
#navibar ul li.menu_hover.prepaidhour a,
#navibar li.menu_selected.xero,
#navibar li.menu_hover.xero,
#navibar ul li.menu_selected.xero a,
#navibar ul li.menu_hover.xero a,
#navibar li.menu_selected.zenpayroll,
#navibar li.menu_hover.zenpayroll,
#navibar ul li.menu_selected.zenpayroll a,
#navibar ul li.menu_hover.zenpayroll a,
#navibar li.menu_selected.myob,
#navibar li.menu_hover.myob,
#navibar ul li.menu_selected.myob a,
#navibar ul li.menu_hover.myob a,
#navibar li.menu_selected.sage,
#navibar li.menu_hover.sage,
#navibar ul li.menu_selected.sage a,
#navibar ul li.menu_hover.sage a,
#navibar li.menu_selected.intacct,
#navibar li.menu_hover.intacct,
#navibar ul li.menu_selected.intacct a,
#navibar ul li.menu_hover.intacct a,
#navibar ul li.menu_hover.sync,
#navibar li.menu_selected.adp,
#navibar li.menu_hover.adp,
#navibar ul li.menu_selected.adp a,
#navibar ul li.menu_hover.adp a,
#navibar li.menu_selected.morepartner,
#navibar li.menu_hover.morepartner,
#navibar ul li.menu_selected.morepartner a,
#navibar ul li.menu_hover.morepartner a,
#navibar li.menu_selected.schedule,
#navibar li.menu_hover.schedule,
#navibar ul li.menu_selected.schedule a,
#navibar ul li.menu_hover.schedule a
#navibar li.menu_selected.invTracker,
#navibar li.menu_hover.invTracker,
#navibar ul li.menu_selected.invTracker a,
#navibar ul li.menu_hover.invTracker a {
    background-color: #4C4C4E;
    color: #FFFFFF;
}

#navibar li.menu_selected,
#navibar li.menu_selected a {
    background-color: #f1f1f2 !important;
    color: #000000 !important;
}


#navibar ul li a span.menu_label_container {
    background-color: transparent;
    background-repeat: no-repeat !important;
    background-position: center top;
    padding: 0px 0px 0px !important;
    display: block;
    /* For IE */
    /*filter:alpha(opacity=65);*/
    /* For firefox */
    /*opacity:0.65;	*/
}

#navibar ul li a {
    /* For IE */
    /*filter:alpha(opacity=65);	*/
}


    #navibar ul li a:hover span.menu_label_container,
    #navibar ul li.menu_selected a span.menu_label_container {
        /* For IE */
        /*filter:alpha(opacity=100);*/
        /* For firefox */
        /*opacity:1;	*/
    }

/*#navibar ul li a span#nav_dashboard_right
{
	background-image: url(../Images/Icons/m-ico-dashboard.png);
}
#navibar ul li a span#nav_user_right
{
	background-image: url(../Images/Icons/m-ico-user.png);
}
#navibar ul li a span#nav_client_right
{
	background-image: url(../Images/Icons/m-ico-client.png);
}
#navibar ul li a span#nav_project_right
{
	background-image: url(../Images/Icons/m-ico-project.png);
}
#navibar ul li a span#nav_timeexpense_right
{
	background-image: url(../Images/Icons/m-ico-time-expense.png);
}
#navibar ul li a span#nav_scheduling_right
{
	background-image: url(../Images/Icons/m-ico-scheduling.png);
}
#navibar ul li a span#nav_invoice_right
{
	background-image: url(../Images/Icons/m-ico-invoicing.png);
}
#navibar ul li a span#nav_accounting_right
{
	background-image: url(../Images/Icons/m-ico-accounting.png);
}
#navibar ul li a span#nav_contact_right
{
	background-image: url(../Images/Icons/m-ico-contacts.png);
}
#navibar ul li a span#nav_report_right
{
	background-image: url(../Images/Icons/m-ico-report.png);
}
#navibar ul li a span#nav_promocode_right
{
	background-image: url(../Images/Icons/m-ico-settings.png);
}

#navibar ul li a span#nav_prepaidhour_right
{
	background-image: url(../Images/Icons/m-ico-prepaidhours.png);
}*/

.invisible {
    display: none;
}

.visibility-hidden {
    visibility: hidden !important;
}


#navibar li.dashboard {
    background-image: url('../Images/dashboard-icon-w.png');
    background-repeat: no-repeat;
    background-position: 15px 11px;
    width: 50px;
    /*padding: 10px;*/
}

/* *********** SUB-NAVIGATION */

#navsubnav {
    margin: 0;
    padding: 0px 0 0;
    /*font-size: 11px;*/
    height: 32px !important;
    background-repeat: repeat-x;
    /*width: 1003px;*/
    width: 100%;
    background: #F1F1F2;
    border-bottom: 1px solid #818285;
    box-sizing: border-box;
}

.dashboard #navsubnav {
    /* background-image: url(../Images/Dashboard/submenubg-dashboard.gif); */
}

.user #navsubnav {
    /* background-image: url(../Images/User/submenubg-user.gif); */
}

.client #navsubnav {
    /* background-image: url(../Images/Client/submenubg-client.gif); */
}

.project #navsubnav {
    /* background-image: url(../Images/Project/submenubg-project.gif); */
}

.timeexpense #navsubnav {
    /* background-image: url(../Images/TimeExpense/submenubg-te.gif); */
}

.scheduling #navsubnav {
    /* background-image: url(../Images/Scheduling/submenubg-sch.gif); */
}

.invoice #navsubnav {
    /* background-image: url(../Images/Invoice/submenubg-in.gif); */
}

.accounting #navsubnav {
    /* background-image: url(../Images/Accounting/submenubg-acc.gif); */
}

.contact #navsubnav {
    /* background-image: url(../Images/Contact/submenubg-con.gif); */
}

.report #navsubnav {
    /* background-image: url(../Images/Report/submenubg-rep.gif); */
}

.setting #navsubnav {
    /* background-image: url(../Images/Setting/submenubg-set.gif); */
}

.prepaidhour #navsubnav {
    /* background-image: url(../Images/scheduling/submenubg-sch.gif); */
}

#navsubnav ul,
#navsubnav li {
    margin: 0;
    padding: 0;
    list-style: none;
}

#navsubnav ul {
    /*line-height: 26px; */
    min-width: 750px;
    max-width: 960px;
    float: left;
    position: absolute;
}

#navsubnav li {
    margin: 0 0 0 1px;
    display: inline;
    /*\*/ float: left; /**/
    height: 32px;
    background-position: top right;
    background-repeat: no-repeat;
}

#navsubnav li {
    /* background-image: url(../Images/Common/submenu-sep-bg.gif); */
}

    #navsubnav li.noSep {
        background-image: none;
    }

#navsubnav a {
    display: block;
    float: left;
    text-decoration: none;
    padding: 0px 20px 0px 0px;
    position: relative;
    margin-top: 1px;
    /*font-size: 11px;*/
}

    /*
#navsubnav .project a 
{
    padding: 0px 10px 0 !important; 
}
#navsubnav .client a 
{
    padding: 0 10px !important; 
}*/

    #navsubnav a:link {
        color: #818285;
    }

/*#navsubnav a:visited 
{
	color:#666;
}*/

#navsubnav li.selected,
#navsubnav .selected a:link,
#navsubnav .selected a:visited {
    background: white;
    border-bottom-color: white;
    /*border-right: 1px solid #888;*/
    z-index: 1;
}

#navsubnav a:hover,
#navsubnav a:focus {
    /*color: orange; */
    text-decoration: none;
}

#navsubnav ul li.selected a span,
#navsubnav ul li.selected span a,
#navsubnav ul li.selected a {
    color: #000;
}

#navsubnav ul li a span.submenu_label_container,
#navsubnav ul li span.submenu_label_container {
    background-color: transparent;
    background-repeat: no-repeat !important;
    background-position: center top;
    padding: 6px 0px 0px !important;
    /*width: 50px;
	font-weight:bold;
	color: #FFF;*/
    color: #808284;
    /*line-height: 28px;*/
    display: block;
}

    #navsubnav ul li span.submenu_label_container.fleft {
        padding: 7px 0px 0px !important;
    }

        #navsubnav ul li span.submenu_label_container.fleft .menu-arrow-submenu {
            padding-bottom: 6px;
        }

#navsubnav ul li a {
    /* For IE */
    /*filter:alpha(opacity=65);*/
    /* For firefox */
    /*opacity:0.65;		*/
}


    #navsubnav ul li a:hover span.submenu_label_container,
    #navsubnav ul li a:hover,
    #navsubnav ul li.selected a span,
    li.selected a {
        /* For IE */
        /*filter:alpha(opacity=100);*/
        /* For firefox */
        /*opacity:1;		*/
    }

#navsubnav ul li.active a span span {
    /* color: Yellow !important; */
    color: #000 !important;
    font-weight: 400;
    cursor: pointer !important;
    background-image: url(../images/active_arrow.png?2);
    background-position: center 16px;
    background-repeat: no-repeat;
    display: block;
    /*height:11px;*/
    padding-bottom: 4px;
    -ms-background-size: 15px 10px;
    background-size: 15px 10px;
}

/******* Sub Menu *********/
/******* Dashboard *********/

/*#nav_subdboverview_right
{
	background-image: url(../Images/Icons/m-ico-myprojects.png);
}
li.active a span#nav_subdboverview_right,
li.hover a span#nav_subdboverview_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-o.png);
}
li.click a span#nav_subdboverview_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-c.png);
}
    
#nav_subdbreport_right
{
	background-image: url(../Images/Icons/m-ico-report.png);
}
li.active a span#nav_subdbreport_right,
li.hover a span#nav_subdbreport_right
{
    background-image: url(../Images/Icons/m-ico-report-o.png);
}
li.click a span#nav_subdbreport_right
{
    background-image: url(../Images/Icons/m-ico-report-c.png);
}

#nav_subdbschedule_right
{
	background-image: url(../Images/Icons/m-ico-scheduling.png);
}
li.active a span#nav_subdbschedule_right,
li.hover a span#nav_subdbschedule_right
{
    background-image: url(../Images/Icons/m-ico-scheduling-o.png);
}
li.click a span#nav_subdbschedule[_right
{
    background-image: url(../Images/Icons/m-ico-scheduling-c.png);
}

#nav_subdbconflict_right
{
	background-image: url(../Images/createmenu.png);
}
li.active a span#nav_subdbconflict_right,
li.hover a span#nav_subdbconflict_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-h.png);
}
li.click a span#nav_subdbconflict_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-c.png);
}

#nav_subdbconflict_right
{
	background-image: url(../Images/Icons/m-ico-confictchecker.png);
}
li.active a span#nav_subdbconflict_right,
li.hover a span#nav_subdbconflict_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-h.png);
}
li.click a span#nav_subdbconflict_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-c.png);
}

#nav_subdbcontact_right
{
	background-image: url(../Images/Icons/m-ico-addnewcontact.png);
}
li.active a span#nav_subdbcontact_right,
li.hover a span#nav_subdbcontact_right
{
    background-image: url(../Images/Icons/m-ico-addnewcontact-h.png);
}
li.click a span#nav_subdbcontact_right
{
    background-image: url(../Images/Icons/m-ico-addnewcontact-c.png);
}


#nav_subdbtimeentry_right
{
	background-image: url(../Images/Icons/m-ico-singletimeentry.png);
}
li.active a span#nav_subdbtimeentry_right,
li.hover a span#nav_subdbtimeentry_right
{
    background-image: url(../Images/Icons/m-ico-singletimeentry-o.png);
}
li.click a span#nav_subdbtimeentry_right
{
    background-image: url(../Images/Icons/m-ico-singletimeentry-c.png);
}

#nav_subdbexpenseentry_right
{
	background-image: url(../Images/Icons/m-ico-expenseentry.png);
}
li.active a span#nav_subdbexpenseentry_right,
li.hover a span#nav_subdbexpenseentry_right
{
    background-image: url(../Images/Icons/m-ico-expenseentry-o.png);
}
li.click a span#nav_subdbexpenseentry_right
{
    background-image: url(../Images/Icons/m-ico-expenseentry-c.png);
}

#nav_subdbclient_right
{
	background-image: url(../Images/Icons/m-ico-addnewclient.png);
}
li.active a span#nav_subdbclient_right,
li.hover a span#nav_subdbclient_right
{
    background-image: url(../Images/Icons/m-ico-addnewclient-h.png);
}
li.click a span#nav_subdbclient_right
{
    background-image: url(../Images/Icons/m-ico-addnewclient-c.png);
}

#nav_subdbprojectt_right
{
	background-image: url(../Images/Icons/m-ico-addprojects.png);
}
li.active a span#nav_subdbproject_right,
li.hover a span#nav_subdbproject_right
{
    background-image: url(../Images/Icons/m-ico-addprojects-h.png);
}
li.click a span#nav_subdbproject_right
{
    background-image: url(../Images/Icons/m-ico-addprojects-c.png);
}

#nav_subdbinvoice_right
{
	background-image: url(../Images/Icons/m-ico-iinvoice.png);
}
li.active a span#nav_subdbinvoice_right,
li.hover a span#nav_subdbinvoice_right
{
    background-image: url(../Images/Icons/m-ico-iinvoice-h.png);
}
li.click a span#nav_subdbinvoice_right
{
    background-image: url(../Images/Icons/m-ico-iinvoice-c.png);
}

#nav_subdbbatchentry_right
{
	background-image: url(../Images/Icons/m-ico-timebatchentry.png);
}
li.active a span#nav_subdbbatchentry_right,
li.hover a span#nav_subdbbatchentry_right
{
    background-image: url(../Images/Icons/m-ico-timebatchentry-h.png);
}
li.click a span#nav_subdbbatchentry_right
{
    background-image: url(../Images/Icons/m-ico-timebatchentry-c.png);
}

#nav_subcreatemenu_right
{
	background-image: url(../Images/Icons/m-ico-myprojects.png);
}
li.active a span#nav_subcreatemenu_right,
li.hover a span#nav_subcreatemenu_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-o.png);
}
li.click a span#nav_subcreatemenu_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-c.png);
}*/

/******** user *********/
/*#nav_subuserlist_right
{
	background-image: url(../Images/Icons/m-ico-userlist.png);
}
li.active a span#nav_subuserlist_right,
li.hover a span#nav_subuserlist_right
{
    background-image: url(../Images/Icons/m-ico-userlist-h.png);
}
li.click a span#nav_subuserlist_right
{
    background-image: url(../Images/Icons/m-ico-userlist-c.png);
}

#nav_subadduser_right
{
	background-image: url(../Images/Icons/m-ico-addnewuser.png);
}
li.active a span#nav_subadduser_right,
li.hover a span#nav_subadduser_right
{
    background-image: url(../Images/Icons/m-ico-addnewuser-h.png);
}
li.click a span#nav_subadduser_right
{
    background-image: url(../Images/Icons/m-ico-addnewuser-c.png);
}

#nav_subViewUserMain_right
{
    background-image: url(../Images/Icons/m-ico-userlist.png);
}
li.active a span#nav_subViewUserMain_right,
li.hover a span#nav_subViewUserMain_right
{
    background-image: url(../Images/Icons/m-ico-userlist-h.png);
}
li.click a span#nav_subViewUserMain_right
{
    background-image: url(../Images/Icons/m-ico-userlist-c.png);
}

#nav_subViewUserGeneral_right
{
    background-image: url(../Images/Icons/m-ico-user-small.png);
}
li.active a span#nav_subViewUserGeneral_right,
li.hover a span#nav_subViewUserGeneral_right
{
    background-image: url(../Images/Icons/m-ico-user-small-h.png);
}
li.click a span#nav_subViewUserGeneral_right
{
    background-image: url(../Images/Icons/m-ico-user-small-c.png);
}

#nav_subViewUserAutoText_right
{
    background-image: url(../Images/Icons/m-ico-userautotext.png);
}
li.active a span#nav_subViewUserAutoText_right,
li.hover a span#nav_subViewUserAutoText_right
{
    background-image: url(../Images/Icons/m-ico-userautotext-h.png);
}
li.click a span#nav_subViewUserAutoText_right
{
    background-image: url(../Images/Icons/m-ico-userautotext-c.png);
}

#nav_subViewLoginHistory_right
{
	background-image: url(../Images/Icons/m-ico-loginhistory.png);
}
li.active a span#nav_subViewLoginHistory_right,
li.hover a span#nav_subViewLoginHistory_right
{
    background-image: url(../Images/Icons/m-ico-loginhistory-h.png);
}
li.click a span#nav_subViewLoginHistory_right
{
    background-image: url(../Images/Icons/m-ico-loginhistory-c.png);
}

#nav_subViewUserClientRates_right
{
	background-image: url(../Images/Icons/m-ico-userbillingrates.png);
}
li.active a span#nav_subViewUserClientRates_right,
li.hover a span#nav_subViewUserClientRates_right
{
    background-image: url(../Images/Icons/m-ico-userbillingrates-h.png);
}
li.click a span#nav_subViewUserClientRates_right
{
    background-image: url(../Images/Icons/m-ico-userbillingrates-c.png);
}*/

/********** Client ***********/
/*#nav_subclientlist_right
{
	background-image: url(../Images/Icons/m-ico-clientlist.png);
}
li.active a span#nav_subclientlist_right,
li.hover a span#nav_subclientlist_right
{
    background-image: url(../Images/Icons/m-ico-clientlist-h.png);
}
li.click a span#nav_subclientlist_right
{
    background-image: url(../Images/Icons/m-ico-clientlist-c.png);
}

#nav_subaddclient_right
{
	background-image: url(../Images/Icons/m-ico-addnewclient.png);
}
li.active a span#nav_subaddclient_right,
li.hover a span#nav_subaddclient_right
{
    background-image: url(../Images/Icons/m-ico-addnewclient-h.png);
}
li.click a span#nav_subaddclient_right
{
    background-image: url(../Images/Icons/m-ico-addnewclient-c.png);
}

#nav_subclientconflictchecker_right
{
	background-image: url(../Images/Icons/m-ico-confictchecker.png);
}
li.active a span#nav_subclientconflictchecker_right,
li.hover a span#nav_subclientconflictchecker_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-h.png);
}
li.click a span#nav_subclientconflictchecker_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-c.png);
}


#nav_subclientmain_right
{
	background-image: url(../Images/Icons/m-ico-clients-main.png);
}
li.active a span#nav_subclientmain_right,
li.hover a span#nav_subclientmain_right
{
    background-image: url(../Images/Icons/m-ico-clients-main-h.png);
}
li.click a span#nav_subclientmain_right
{
    background-image: url(../Images/Icons/m-ico-clients-main-c.png);
}


#nav_subclientgeneral_right
{
	background-image: url(../Images/Icons/m-ico-clients-general.png);
}
li.active a span#nav_subclientgeneral_right,
li.hover a span#nav_subclientgeneral_right
{
    background-image: url(../Images/Icons/m-ico-clients-general-h.png);
}
li.click a span#nav_subclientgeneral_right
{
    background-image: url(../Images/Icons/m-ico-clients-general-c.png);
}

#nav_subclientsummary_right,
#nav_subclientsummary a
{
	background-image: url(../Images/Icons/m-ico-clients-summary.png);
}
li.active a span#nav_subclientsummary_right,
li.hover a span#nav_subclientsummary_right,
li.active span#nav_subclientsummary_right,
li.hover span#nav_subclientsummary_right
{
    background-image: url(../Images/Icons/m-ico-clients-summary-h.png);
}
li.click a span#nav_subclientsummary_right,
li.click #nav_subclientsummary_right
{
    background-image: url(../Images/Icons/m-ico-clients-summary-c.png);
}

#nav_subclientuserbilling_right
{
	background-image: url(../Images/Icons/m-ico-user-small.png);
}
li.active a span#nav_subclientuserbilling_right,
li.hover a span#nav_subclientuserbilling_right
{
    background-image: url(../Images/Icons/m-ico-user-small-h.png);
}
li.click a span#nav_subclientuserbilling_right
{
    background-image: url(../Images/Icons/m-ico-user-small-c.png);
}

#nav_subclientrate_right
{
    background-image: url(../Images/Icons/m-ico-billling.png);
}
li.active a span#nav_subclientrate_right,
li.hover a span#nav_subclientrate_right
{
    background-image: url(../Images/Icons/m-ico-billling-h.png);
}
li.click a span#nav_subclientrate_right
{
    background-image: url(../Images/Icons/m-ico-billling-c.png);
}
#nav_subclienttimeexpense_right,
#nav_subclienttimeexpense a
{
	background-image: url(../Images/Icons/m-ico-expenses.png);
}
li.active a span#nav_subclienttimeexpense_right,
li.hover a span#nav_subclienttimeexpense_right,
li.active span#nav_subclienttimeexpense_right,
li.hover span#nav_subclienttimeexpense_right
{
    background-image: url(../Images/Icons/m-ico-expenses-h.png);
}
li.click a span#nav_subclienttimeexpense_right,
li.click span#nav_subclienttimeexpense_right
{
    background-image: url(../Images/Icons/m-ico-expenses-c.png);
}

#nav_subclientcontact_right
{
	background-image: url(../Images/Icons/m-ico-contacts.png);
}
li.active a span#nav_subclientcontact_right,
li.hover a span#nav_subclientcontact_right,
li.active span#nav_subclientcontact_right,
li.hover span#nav_subclientcontact_right
{
    background-image: url(../Images/Icons/m-ico-contacts-h.png);
}
li.click a span#nav_subclientcontact_right,
li.click span#nav_subclientcontact_right
{
    background-image: url(../Images/Icons/m-ico-contacts-c.png);
}
#nav_subclientFileExplorer_right,
#nav_subclientFileExplorer_right a
{
    background-image: url(../Images/Icons/m-ico-fileexplorer.png);
}
li.active a span#nav_subclientFileExplorer_right,
li.hover a span#nav_subclientFileExplorer_right,
li.active span#nav_subclientFileExplorer_right,
li.hover span#nav_subclientFileExplorer_right
{
    background-image: url(../Images/Icons/m-ico-fileexplorer-h.png);
}
li.click a span#nav_subclientFileExplorer_right,
li.click #nav_subclientFileExplorer_right
{
    background-image: url(../Images/Icons/m-ico-fileexplorer-c.png);
}

#nav_subclientschedule_right,
#nav_subclientschedule a
{
    background-image: url(../Images/Icons/icon-scheduleentry.png);
}
li.active a span#nav_subclientschedule_right,
li.hover a span#nav_subclientschedule_right,
li.active span#nav_subclientschedule_right,
li.hover span#nav_subclientschedule_right
{
    background-image: url(../Images/Icons/icon-scheduleentry-h.png);
}
li.click a span#nav_subclientschedule_right,
li.click #nav_subclientschedule_right
{
    background-image: url(../Images/Icons/icon-scheduleentry-c.png);
}

#nav_subclientaccount_right,
#nav_subclientaccount a
{
    background-image: url(../Images/Icons/m-ico-billling.png);
}
li.active a span#nav_subclientaccount_right,
li.hover a span#nav_subclientaccount_right,
li.active span#nav_subclientaccount_right,
li.hover span#nav_subclientaccount_right
{
    background-image: url(../Images/Icons/m-ico-billling-h.png);
}
li.click a span#nav_subclientaccount_right,
li.click #nav_subclientaccount_right
{
    background-image: url(../Images/Icons/m-ico-billling-c.png);
}


#nav_subclientinvoicesetup_right,
#nav_subclientinvoicesetup a
{
    background-image: url(../Images/Icons/m-ico-invoicesetup.png);
}
li.active a span#nav_subclientinvoicesetup_right,
li.hover a span#nav_subclientinvoicesetup_right,
li.active span#nav_subclientinvoicesetup_right,
li.hover span#nav_subclientinvoicesetup_right
{
    background-image: url(../Images/Icons/m-ico-invoicesetup-h.png);
}
li.click a span#nav_subclientinvoicesetup_right,
li.click #nav_subclientinvoicesetup_right
{
    background-image: url(../Images/Icons/m-ico-invoicesetup-c.png);
}

#nav_subclientautoexpense_right,
#nav_subclientautoexpense a
{
    background-image: url(../Images/Icons/m-ico-clientautoexpense.png);
}
li.active a span#nav_subclientautoexpense_right,
li.hover a span#nav_subclientautoexpense_right,
li.active span#nav_subclientautoexpense_right,
li.hover span#nav_subclientautoexpense_right
{
    background-image: url(../Images/Icons/m-ico-clientautoexpense-h.png);
}
li.click a span#nav_subclientautoexpense_right,
li.click #nav_subclientautoexpense_right
{
    background-image: url(../Images/Icons/m-ico-clientautoexpense-c.png);
}

#nav_subportalsetup_right,
#nav_subportalsetup a
{
    background-image: url(../Images/Icons/m-ico-clientportalsetup.png);
}
li.active a span#nav_subportalsetup_right,
li.hover a span#nav_subportalsetup_right,
li.active span#nav_subportalsetup_right,
li.hover span#nav_subportalsetup_right
{
    background-image: url(../Images/Icons/m-ico-clientportalsetup-h.png);
}
li.click a span#nav_subportalsetup_right,
li.click #nav_subportalsetup_right
{
    background-image: url(../Images/Icons/m-ico-clientportalsetup-c.png);
}*/

/************ Project *********/
/*#nav_subprojectmain_right,
#nav_projectmain_right
{
	background-image: url(../Images/Icons/m-ico-myprojects.png);
}
li.active a span#nav_subprojectmain_right,
li.hover a span#nav_subprojectmain_right,
li.active a span#nav_projectmain_right,
li.hover a span#nav_projectmain_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-h.png);
}
li.click a span#nav_subprojectmain_right,
li.click a span#nav_projectmain_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-c.png);
}

#nav_subaddproject_right,
#nav_subeditproject_right
{
	background-image: url(../Images/Icons/m-ico-addprojects.png);
}
li.active a span#nav_subaddproject_right,
li.hover a span#nav_subaddproject_right,
li.active a span#nav_subeditproject_right,
li.hover a span#nav_subeditproject_right
{
    background-image: url(../Images/Icons/m-ico-addprojects-h.png);
}
li.click a span#nav_subaddproject_right,
li.click a span#nav_subeditproject_right
{
    background-image: url(../Images/Icons/m-ico-addprojects-c.png);
}

#nav_subsummary_right
{
	background-image: url(../Images/Icons/m-ico-summary.png);
}
li.active a span#nav_subsummary_right,
li.hover a span#nav_subsummary_right
{
    background-image: url(../Images/Icons/m-ico-summary-h.png);
}
li.click a span#nav_subsummary_right
{
    background-image: url(../Images/Icons/m-ico-summary-c.png);
}

#nav_subprojectcontacts_right
{
    background-image: url(../Images/Icons/m-ico-contacts.png);
}
li.active a span#nav_subprojectcontacts_right,
li.hover a span#nav_subprojectcontacts_right
{
    background-image: url(../Images/Icons/m-ico-contacts-h.png);
}
li.click a span#nav_subprojectcontacts_right
{
    background-image: url(../Images/Icons/m-ico-contacts-c.png);
}


#nav_subuserbillrate_right,
#nav_subuserbillrate a
{
	background-image: url(../Images/Icons/m-ico-user-small.png);
}
li.active a span#nav_subuserbillrate_right,
li.hover a span#nav_subuserbillrate_right,
li.active span#nav_subuserbillrate_right,
li.hover span#nav_subuserbillrate_right
{
    background-image: url(../Images/Icons/m-ico-user-small-h.png);
}
li.click a span#nav_subuserbillrate_right,
li.click span#nav_subuserbillrate_right
{
    background-image: url(../Images/Icons/m-ico-user-small-c.png);
}

#nav_subprojectrate_right
{
    background-image: url(../Images/Icons/m-ico-billling.png);
}
li.active a span#nav_subprojectrate_right,
li.hover a span#nav_subprojectrate_right
{
    background-image: url(../Images/Icons/m-ico-billling-h.png);
}
li.click a span#nav_subprojectrate_right
{
    background-image: url(../Images/Icons/m-ico-billling-c.png);
}

#nav_subtimeentry_right,
#nav_subtimeentry a
{
	background-image: url(../Images/Icons/m-ico-quickentriesandnotes.png);
}
li.active a span#nav_subtimeentry_right,
li.hover a span#nav_subtimeentry_right,
li.active span#nav_subtimeentry_right,
li.hover span#nav_subtimeentry_right
{
    background-image: url(../Images/Icons/m-ico-quickentriesandnotes-h.png);
}
li.click a span#nav_subtimeentry_right,
li.click span#nav_subtimeentry_right
{
    background-image: url(../Images/Icons/m-ico-quickentriesandnotes-c.png);
}

#nav_subexpense_right,
#nav_subexpense a
{
	background-image: url(../Images/Icons/m-ico-expenses.png);
}
li.active a span#nav_subexpense_right,
li.hover a span#nav_subexpense_right,
li.active span#nav_subexpense_right,
li.hover span#nav_subexpense_right
{
    background-image: url(../Images/Icons/m-ico-expenses-h.png);
}
li.click a span#nav_subexpense_right,
li.hover span#nav_subexpense a
{
    background-image: url(../Images/Icons/m-ico-expenses-c.png);
}

#nav_subprojectschedule_right
{
	background-image: url(../Images/Icons/m-ico-projectschedule.png);
}
li.active a span#nav_subprojectschedule_right,
li.hover a span#nav_subprojectschedule_right
{
    background-image: url(../Images/Icons/m-ico-projectschedule-h.png);
}
li.click a span#nav_subprojectschedule_right
{
    background-image: url(../Images/Icons/m-ico-projectschedule-c.png);
}

#nav_subfileexplorer1_right,
#nav_subfileexplorer_right
{
	background-image: url(../Images/Icons/m-ico-fileexplorer.png);
}
li.active a span#nav_subfileexplorer1_right,
li.hover a span#nav_subfileexplorer1_right,
li.active a span#nav_subfileexplorer_right,
li.hover a span#nav_subfileexplorer_right
{
    background-image: url(../Images/Icons/m-ico-fileexplorer-h.png);
}
li.click a span#nav_subfileexplorer1_right,
li.click a span#nav_subfileexplorer_right
{
    background-image: url(../Images/Icons/m-ico-fileexplorer-c.png);
}

#nav_subtrustaccounting2_right,
#nav_subtrustaccounting_right
{
	background-image: url(../Images/Icons/m-ico-trustaccounting.png);
}
li.active a span#nav_subtrustaccounting2_right,
li.hover a span#nav_subtrustaccounting2_right,
li.active a span#nav_subtrustaccounting_right,
li.hover a span#nav_subtrustaccounting_right,
li.active span#nav_subtrustaccounting2_right,
li.hover span#nav_subtrustaccounting2_right,
li.active span#nav_subtrustaccounting_right,
li.hover span#nav_subtrustaccounting_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-h.png);
}
li.click a span#nav_subtrustaccounting2_right,
li.click a span#nav_subtrustaccounting_right,
li.click span#nav_subtrustaccounting2_right,
li.click span#nav_subtrustaccounting_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-c.png);
}

#nav_subprojectlist_right
{
	background-image: url(../Images/Icons/m-ico-myprojects.png);
}
li.active a span#nav_subprojectlist_right,
li.hover a span#nav_subprojectlist_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-h.png);
}
li.click a span#nav_subprojectlist_right
{
    background-image: url(../Images/Icons/m-ico-myprojects-c.png);
}

#nav_subprojectsummary_right
{
	background-image: url(../Images/Icons/m-ico-summary.png);
}
li.active a span#nav_subprojectsummary_right,
li.hover a span#nav_subprojectsummary_right
{
    background-image: url(../Images/Icons/m-ico-summary-h.png);
}
li.click a span#nav_subprojectsummary_right
{
    background-image: url(../Images/Icons/m-ico-summary-c.png);
}


#nav_subtimenotes_right
{
	background-image: url(../Images/Icons/m-ico-quickentriesandnotes.png);
}
li.active a span#nav_subtimenotes_right,
li.hover a span#nav_subtimenotes_right
{
    background-image: url(../Images/Icons/m-ico-quickentriesandnotes-h.png);
}
li.click a span#nav_subtimenotes_right
{
    background-image: url(../Images/Icons/m-ico-quickentriesandnotes-c.png);
}



#nav_subexpenses_right
{
	background-image: url(../Images/Icons/m-ico-expenses.png);
}
li.active a span#nav_subexpenses_right,
li.hover a span#nav_subexpenses_right
{
    background-image: url(../Images/Icons/m-ico-expenses-h.png);
}
li.click a span#nav_subexpenses_right
{
    background-image: url(../Images/Icons/m-ico-expenses-c.png);
}


#nav_subprojecttrustaccounting_right
{
	background-image: url(../Images/Icons/m-ico-trustaccounting.png);
}
li.active a span#nav_subprojecttrustaccounting_right,
li.hover a span#nav_subprojecttrustaccounting_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-h.png);
}
li.click a span#nav_subprojecttrustaccounting_right,
li.click a span#nav_subprojecttrustaccounting_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-c.png);
}*/
/************ Time & Expense ************/
/*
#nav_subtime_right
{
	background-image: url(../Images/Icons/m-ico-time.png);
}
li.active a span#nav_subtime_right,
li.hover a span#nav_subtime_right
{
    background-image: url(../Images/Icons/m-ico-time-h.png);
}

li.click a span#nav_subtime_right
{
    background-image: url(../Images/Icons/m-ico-time-c.png);
}
#nav_subSingleTimeEntry
{
	background-image: url(../Images/Icons/m-ico-singletimeentry.png);
}
li.active a span#nav_subSingleTimeEntry,
li.hover a span#nav_subSingleTimeEntry
{
    background-image: url(../Images/Icons/m-ico-singletimeentry-h.png);
}
li.click a span#nav_subexpenseEntry
{
    background-image: url(../Images/Icons/m-ico-expenseentry-c.png);
}
#nav_subexpenseEntry
{
	background-image: url(../Images/Icons/m-ico-expenseentry.png);
}
li.active a span#nav_subexpenseEntry,
li.hover a span#nav_subexpenseEntry
{
    background-image: url(../Images/Icons/m-ico-expenseentry-h.png);
}
li.click a span#nav_subexpenseEntry
{
    background-image: url(../Images/Icons/m-ico-expenseentry-c.png);
}
#nav_subtimebatchentry_right
{
	background-image: url(../Images/Icons/m-ico-timebatchentry.png);
}
li.active a span#nav_subtimebatchentry_right,
li.hover a span#nav_subtimebatchentry_right
{
    background-image: url(../Images/Icons/m-ico-timebatchentry-h.png);
}
li.click a span#nav_subtimebatchentry_right
{
    background-image: url(../Images/Icons/m-ico-timebatchentry-c.png);
}

#nav_subexpense1_right
{
	background-image: url(../Images/Icons/m-ico-expenses.png);
}
li.active a span#nav_subexpense1_right,
li.hover a span#nav_subexpense1_right
{
    background-image: url(../Images/Icons/m-ico-expenses-h.png);
}
li.click a span#nav_subexpense1_right
{
    background-image: url(../Images/Icons/m-ico-expenses-c.png);
}

#nav_subprepaidlist_right
{
	background-image: url(../Images/Icons/m-ico-prepaidlist.png);
}
li.active a span#nav_subprepaidlist_right,
li.hover a span#nav_subprepaidlist_right
{
    background-image: url(../Images/Icons/m-ico-prepaidlist-h.png);
}
li.click a span#nav_subprepaidlist_right
{
    background-image: url(../Images/Icons/m-ico-prepaidlist-c.png);
}

#nav_subaccprepaid_right
{
	background-image: url(../Images/Icons/m-ico-prepaidhours.png);
}
li.active a span#nav_subaccprepaid_right,
li.hover a span#nav_subaccprepaid_right
{
    background-image: url(../Images/Icons/m-ico-prepaidhours-h.png);
}

#nav_subgeneral_right
{
	background-image: url(../Images/Icons/m-ico-scheduling-general.png);
}
li.active a span#nav_subgeneral_right,
li.hover a span#nav_subgeneral_right
{
    background-image: url(../Images/Icons/m-ico-scheduling-general-h.png);
}
li.click a span#nav_subgeneral_right
{
    background-image: url(../Images/Icons/m-ico-scheduling-general-c.png);
}

#nav_subprojectaccounting_right
{
    background-image: url(../Images/Icons/m-ico-billling.png);
}
li.active a span#nav_subprojectaccounting_right,
li.hover a span#nav_subprojectaccounting_right
{
    background-image: url(../Images/Icons/m-ico-billling-h.png);
}
li.click a span#nav_subprojectaccounting_right
{
    background-image: url(../Images/Icons/m-ico-billling-c.png);
}

#nav_subprojectconflictchecker_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker.png);
}
li.active a span#nav_subprojectconflictchecker_right,
li.hover a span#nav_subprojectconflictchecker_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-h.png);
}
li.click a span#nav_subprojectconflictchecker_right
{
    background-image: url(../Images/Icons/m-ico-confictchecker-c.png);
}*/

/******* Invoice *********/
/*
#nav_subinvoicelist_right
{
	background-image: url(../Images/Icons/m-ico-invoicelist.png);
}
li.active a span#nav_subinvoicelist_right,
li.hover a span#nav_subinvoicelist_right
{
    background-image: url(../Images/Icons/m-ico-invoicelist-h.png);
}
li.click a span#nav_subinvoicelist_right
{
    background-image: url(../Images/Icons/m-ico-invoicelist-c.png);
}

#nav_subaddinvoice_right
{
	background-image: url(../Images/Icons/m-ico-addnewinvoice.png);
}
li.active a span#nav_subaddinvoice_right,
li.hover a span#nav_subaddinvoice_right
{
    background-image: url(../Images/Icons/m-ico-addnewinvoice-h.png);
}
li.click a span#nav_subaddinvoice_right
{
    background-image: url(../Images/Icons/m-ico-addnewinvoice-c.png);
}

#nav_subinvoicebatchdetails_right
{
	background-image: url(../Images/Icons/m-ico-invoicebatchdetails.png);
}
li.active a span#nav_subinvoicebatchdetails_right,
li.hover a span#nav_subinvoicebatchdetails_right
{
    background-image: url(../Images/Icons/m-ico-invoicebatchdetails-h.png);
}
li.click a span#nav_subinvoicebatchdetails_right
{
    background-image: url(../Images/Icons/m-ico-invoicebatchdetails-c.png);
}


#nav_subaccsearch_right
{
	background-image: url(../Images/Icons/m-ico-invoicelist.png);
}
li.active a span#nav_subaccsearch_right,
li.hover a span#nav_subaccsearch_right
{
    background-image: url(../Images/Icons/m-ico-invoicelist-h.png);
}
li.click a span#nav_subaccsearch_right
{
    background-image: url(../Images/Icons/m-ico-invoicelist-c.png);
}


#nav_subaccadjust_right
{
	background-image: url(../Images/Icons/m-ico-addnewpayment.png);
}
li.active a span#nav_subaccadjust_right,
li.hover a span#nav_subaccadjust_right
{
    background-image: url(../Images/Icons/m-ico-addnewpayment-h.png);
}
li.click a span#nav_subaddnewpayment_right
{
    background-image: url(../Images/Icons/m-ico-addnewpayment-c.png);
}

#nav_subaccstatement_right
{
	background-image: url(../Images/Icons/m-ico-statement.png);
}
li.active a span#nav_subaccstatement_right,
li.hover a span#nav_subaccstatement_right
{
    background-image: url(../Images/Icons/m-ico-statement-h.png);
}
li.click a span#nav_subaccstatement_right
{
    background-image: url(../Images/Icons/m-ico-statement-c.png);
}
#nav_subFinanceCharges_right
{
	background-image: url(../Images/Icons/m-ico-financecharges.png);
}
li.active a span#nav_subFinanceCharges_right,
li.hover a span#nav_subFinanceCharges_right
{
    background-image: url(../Images/Icons/m-ico-financecharges-h.png);
}
li.click a span#nav_subFinanceCharges_right
{
    background-image: url(../Images/Icons/m-ico-financecharges-c.png);
}

#nav_subtrustbankaccount_right
{
	background-image: url(../Images/Icons/m-ico-trustaccounting.png);
}
li.active a span#nav_subtrustbankaccount_right,
li.hover a span#nav_subtrustbankaccount_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-h.png);
}
li.click a span#nav_subtrustbankaccount_right
{
    background-image: url(../Images/Icons/m-ico-trustaccountings-c.png);
}



#nav_submakepayment_right
{
	background-image: url(../Images/Icons/m-ico-addnewpayment.png);
}
li.active a span#nav_submakepayment_right,
li.hover a span#nav_submakepayment_right
{
    background-image: url(../Images/Icons/m-ico-addnewpayment-h.png);
}
li.click a span#nav_submakepayment_right
{
    background-image: url(../Images/Icons/m-ico-addnewpayment-c.png);
}*/


/******** Contact *********/
/*#nav_subcontactlist_right
{
	background-image: url(../Images/Icons/m-ico-contactlist.png);
}
li.active a span#nav_subcontactlist_right,
li.hover a span#nav_subcontactlist_right
{
    background-image: url(../Images/Icons/m-ico-contactlist-h.png);
}
li.click a span#nav_subcontactlist_right
{
    background-image: url(../Images/Icons/m-ico-contactlist-c.png);
}


#nav_subaddnewcontact_right
{
	background-image: url(../Images/Icons/m-ico-addnewcontact.png);
}
li.active a span#nav_subaddnewcontact_right,
li.hover a span#nav_subaddnewcontact_right
{
    background-image: url(../Images/Icons/m-ico-addnewcontact-h.png);
}
li.click a span#nav_subaddnewcontact_right
{
    background-image: url(../Images/Icons/m-ico-addnewcontact-c.png);
}

*/

/******** Report ********/
/*#nav_subreportuser_right
{
	background-image: url(../Images/Icons/m-ico-user-small.png);
}
li.active a span#nav_subreportuser_right,
li.hover a span#nav_subreportuser_right
{
    background-image: url(../Images/Icons/m-ico-user-small-h.png);
}
li.click a span#nav_subreportuser_right
{
    background-image: url(../Images/Icons/m-ico-user-small-c.png);
}


#nav_subreportcliententry_right
{
	background-image: url(../Images/Icons/m-ico-cliententry.png);
}
li.active a span#nav_subreportcliententry_right,
li.hover a span#nav_subreportcliententry_right
{
    background-image: url(../Images/Icons/m-ico-cliententry-h.png);
}
li.click a span#nav_subreportcliententry_right
{
    background-image: url(../Images/Icons/m-ico-cliententry-c.png);
}


#nav_subreportprojectsummary_right
{
	background-image: url(../Images/Icons/m-ico-projectsummary.png);
}
li.active a span#nav_subreportprojectsummary_right,
li.hover a span#nav_subreportprojectsummary_right
{
    background-image: url(../Images/Icons/m-ico-projectsummary-h.png);
}
li.click a span#nav_subreportprojectsummary_right
{
    background-image: url(../Images/Icons/m-ico-projectsummary-c.png);
}


#nav_subreportexpenses_right
{
	background-image: url(../Images/Icons/m-ico-expenses.png);
}
li.active a span#nav_subreportexpenses_right,
li.hover a span#nav_subreportexpenses_right
{
    background-image: url(../Images/Icons/m-ico-expenses-h.png);
}
li.click a span#nav_subreportexpenses_right
{
    background-image: url(../Images/Icons/m-ico-expenses-c.png);
}


#nav_subreportcontractor_right
{
	background-image: url(../Images/Icons/m-ico-contractors.png);
}
li.active a span#nav_subreportcontractor_right,
li.hover a span#nav_subreportcontractor_right
{
    background-image: url(../Images/Icons/m-ico-contractors-h.png);
}
li.click a span#nav_subreportcontractor_right
{
    background-image: url(../Images/Icons/m-ico-contractors-c.png);
}


#nav_subreporttax_right
{
	background-image: url(../Images/Icons/m-ico-tax.png);
}
li.active a span#nav_subreporttax_right,
li.hover a span#nav_subreporttax_right
{
    background-image: url(../Images/Icons/m-ico-tax-h.png);
}
li.click a span#nav_subreporttax_right
{
    background-image: url(../Images/Icons/m-ico-tax-c.png);
}


#nav_subreportaccountreceivable_right
{
	background-image: url(../Images/Icons/m-ico-accountrecievable.png);
}
li.active a span#nav_subreportaccountreceivable_right,
li.hover a span#nav_subreportaccountreceivable_right
{
    background-image: url(../Images/Icons/m-ico-accountrecievable-h.png);
}
li.click a span#nav_subreportaccountreceivable_right
{
    background-image: url(../Images/Icons/m-ico-accountrecievable-c.png);
}


#nav_subreportprepaidhours_right
{
	background-image: url(../Images/Icons/m-ico-prepaidhours.png);
}
li.active a span#nav_subreportprepaidhours_right,
li.hover a span#nav_subreportprepaidhours_right
{
    background-image: url(../Images/Icons/m-ico-prepaidhours-h.png);
}
li.click a span#nav_subreportprepaidhours_right
{
    background-image: url(../Images/Icons/m-ico-prepaidhours-c.png);
}


#nav_subtrustaccount_right
{
	background-image: url(../Images/Icons/m-ico-trustaccounting.png);
}
li.active a span#nav_subtrustaccount_right,
li.hover a span#nav_subtrustaccount_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-h.png);
}
li.click a span#nav_subtrustaccount_right
{
    background-image: url(../Images/Icons/m-ico-trustaccounting-c.png);
}


#nav_subreportproductivity_right
{
	background-image: url(../Images/Icons/m-ico-productivity.png);
}
li.active a span#nav_subreportproductivity_right,
li.hover a span#nav_subreportproductivity_right
{
    background-image: url(../Images/Icons/m-ico-productivity-h.png);
}
li.click a span#nav_subreportproductivity_right
{
    background-image: url(../Images/Icons/m-ico-productivity-c.png);
}


#nav_subreportrate_right
{
    background-image: url(../Images/Icons/icon-generateratesreport.png);
}
li.active a span#nav_subreportrate_right,
li.hover a span#nav_subreportrate_right
{
    background-image: url(../Images/Icons/icon-generateratesreport-h.png);
}
li.click a span#nav_subreportrate_right
{
    background-image: url(../Images/Icons/icon-generateratesreport-c.png);
}
*/


/******** Setting *********/
/*#nav_subgeneralsetting_right
{
	background-image: url(../Images/Icons/m-ico-general-settings.png);
}
li.active a span#nav_subgeneralsetting_right,
li.hover a span#nav_subgeneralsetting_right
{
    background-image: url(../Images/Icons/m-ico-general-settings-h.png);
}
li.click a span#nav_subgeneralsetting_right
{
    background-image: url(../Images/Icons/m-ico-general-settings-c.png);
}


#nav_subsystemsetting_right
{
	background-image: url(../Images/Icons/m-ico-system.png);
}
li.active a span#nav_subsystemsetting_right,
li.hover a span#nav_subsystemsetting_right
{
    background-image: url(../Images/Icons/m-ico-system-h.png);
}
li.click a span#nav_subsystemsetting_right
{
    background-image: url(../Images/Icons/m-ico-system-c.png);
}


#nav_subcustomlistsetting_right
{
	background-image: url(../Images/Icons/m-ico-customlists.png);
}
li.active a span#nav_subcustomlistsetting_right,
li.hover a span#nav_subcustomlistsetting_right
{
    background-image: url(../Images/Icons/m-ico-customlists-h.png);
}
li.click a span#nav_subcustomlistsetting_right
{
    background-image: url(../Images/Icons/m-ico-customlists-c.png);
}


#nav_subusersetting_right
{
	background-image: url(../Images/Icons/m-ico-user-small.png);
}
li.active a span#nav_subusersetting_right,
li.hover a span#nav_subusersetting_right
{
    background-image: url(../Images/Icons/m-ico-user-small-h.png);
}
li.click a span#nav_subusersetting_right
{
    background-image: url(../Images/Icons/m-ico-user-small-c.png);
}


#nav_subtimeexpensesetting_right
{
	background-image: url(../Images/Icons/m-ico-timeexpenses.png);
}
li.active a span#nav_subtimeexpensesetting_right,
li.hover a span#nav_subtimeexpensesetting_right
{
    background-image: url(../Images/Icons/m-ico-timeexpenses-h.png);
}
li.click a span#nav_subtimeexpensesetting_right
{
    background-image: url(../Images/Icons/m-ico-timeexpenses-c.png);
}


#nav_subgeneralsetting_right
{
	background-image: url(../Images/Icons/m-ico-timeexpenses.png);
}
li.active a span#nav_subgeneralsetting_right,
li.hover a span#nav_subgeneralsetting_right
{
    background-image: url(../Images/Icons/m-ico-timeexpenses-h.png);
}
li.click a span#nav_subgeneralsetting_right
{
    background-image: url(../Images/Icons/m-ico-timeexpenses-c.png);
}


#nav_subinvoicesetting_right
{
	background-image: url(../Images/Icons/m-ico-invoicesetup.png);
}
li.active a span#nav_subinvoicesetting_right,
li.hover a span#nav_subinvoicesetting_right
{
    background-image: url(../Images/Icons/m-ico-invoicesetup-h.png);
}
li.click a span#nav_subinvoicesetting_right
{
    background-image: url(../Images/Icons/m-ico-invoicesetup-c.png);
}


#nav_subnotificationsetting_right
{
	background-image: url(../Images/Icons/m-ico-notifications.png);
}
li.active a span#nav_subnotificationsetting_right,
li.hover a span#nav_subnotificationsetting_right
{
    background-image: url(../Images/Icons/m-ico-notifications-h.png);
}
li.click a span#nav_subnotificationsetting_right
{
    background-image: url(../Images/Icons/m-ico-notifications-c.png);
}


#nav_subclientportalsetting_right
{
	background-image: url(../Images/Icons/m-ico-clientportal.png);
}
li.active a span#nav_subclientportalsetting_right,
li.hover a span#nav_subclientportalsetting_right
{
    background-image: url(../Images/Icons/m-ico-clientportal-h.png);
}
li.click a span#nav_subclientportalsetting_right
{
    background-image: url(../Images/Icons/m-ico-clientportal-c.png);
}


#nav_subprepaidhourssetting_right
{
	background-image: url(../Images/Icons/m-ico-prepaidhours.png);
}
li.active a span#nav_subprepaidhourssetting_right,
li.hover a span#nav_subprepaidhourssetting_right
{
    background-image: url(../Images/Icons/m-ico-prepaidhours-h.png);
}
li.click a span#nav_subprepaidhourssetting_right
{
    background-image: url(../Images/Icons/m-ico-prepaidhours-c.png);
}


#nav_sublookfeelsetting_right
{
	background-image: url(../Images/Icons/m-ico-lookandfeel.png);
}
li.active a span#nav_sublookfeelsetting_right,
li.hover a span#nav_sublookfeelsetting_right
{
    background-image: url(../Images/Icons/m-ico-lookandfeel-h.png);
}
li.click a span#nav_sublookfeelsetting_right
{
    background-image: url(../Images/Icons/m-ico-lookandfeel-c.png);
}


#nav_subbillingsetting_right
{
	background-image: url(../Images/Icons/m-ico-billling.png);
}
li.active a span#nav_subbillingsetting_right,
li.hover a span#nav_subbillingsetting_right
{
    background-image: url(../Images/Icons/m-ico-billling-h.png);
}
li.click a span#nav_subbillingsetting_right
{
    background-image: url(../Images/Icons/m-ico-billling-c.png);
}*/

.dummyMenuBarout {
    width: 100%;
    background-image: url(../Images/eBillity_dummy_menuBarBg.png);
    background-repeat: repeat-x;
    clear: both;
    background-position: 0px -4px;
}

. {
    width: 1002px;
    margin: auto;
    background-image: url(../Images/eBillity_dummy_menuBar.png);
    background-repeat: no-repeat;
    height: 66px;
    background-position: 0px -4px;
}


/* Create new menu */
#navibar ul li.scheduling div {
    display: none;
    z-index: 2002;
    width: 200px;
    position: relative;
    background-color: #F48120;
    background-repeat: repeat;
    list-style: none;
    float: left;
    height: auto;
    margin-left: 0;
    * margin-left: -51px; /* for IE8*/
    margin-top: -2px;
}

#newmenubar ul {
    height: auto;
    list-style: none outside none;
    margin: 0;
    padding-left: 0px;
    text-align: left;
}

#navibar ul li.scheduling ul li {
    background-image: none;
    background-position: left;
    background-repeat: repeat-y;
    cursor: pointer;
    display: block;
    float: none;
    margin: 0;
    padding-left: 0px;
    height: 22px;
}

    #navibar ul li.scheduling ul li a {
        background-image: none;
        background-position: right top;
        background-repeat: no-repeat;
        background-color: #f48120;
        color: #FFF;
        display: block;
        /*font-size:11px;
font-weight:bold;*/
        margin-left: 0px;
        padding: 2px 2px 2px 0;
        text-decoration: none;
        height: 12px;
    }

#newmenubar ul li span {
    padding-left: 23px;
    font-size: 12px;
}

#navibar ul li.scheduling ul li a:hover {
    background-color: #FFF;
    color: #FF5500;
    /*font-weight:bold;*/
    height: 18px;
}

.showsubmenu {
    z-index: 1001;
}


#navsubnav li a:hover span span {
    color: #000000;
}

/* More menu */
#navibar ul li.moremenu div {
    display: none;
    z-index: 1001;
    width: 170px;
    position: relative;
    background-color: #5D5C58;
    background-repeat: repeat;
    list-style: none;
    float: left;
    height: auto;
    margin-left: 0;
    * margin-left: -51px; /* for IE8*/
    margin-top: -2px;
}

#mormenubar {
    z-index: 2001;
}

    #mormenubar ul {
        height: auto;
        list-style: none outside none;
        margin: 0;
        padding-left: 0px;
        text-align: left;
    }

#navibar ul li.moremenu ul li {
    background-image: none;
    background-position: left;
    background-repeat: repeat-y;
    cursor: pointer;
    display: block;
    float: none;
    margin: 0;
    padding-left: 0px;
    height: 22px;
}

    #navibar ul li.moremenu ul li a {
        background-image: none;
        background-position: right top;
        background-repeat: no-repeat;
        background-color: #5D5C58;
        color: #FFF;
        display: block;
        /*font-size:11px;
font-weight:bold;*/
        margin-left: 0px;
        padding: 2px 2px 2px 0;
        text-decoration: none;
        height: 12px;
    }

#mormenubar ul li span {
    padding-left: 23px;
    font-size: 12px;
}

#navibar ul li.moremenu ul li a:hover {
    background-color: #FFF;
    color: #FF5500;
    /*font-weight:bold;*/
    height: 18px;
}

.showsubmenu {
    z-index: 1001;
}


#navsubnav li a:hover span span {
    color: #000000;
}

/* Report Sub menu*/

#navsubnav div div {
    background-color: #f48120;
    display: none;
    list-style: none outside none;
    margin-left: 5px;
    margin-top: 34px;
    min-width: 130px;
    min-height: 50px;
    position: relative;
    width: 140px;
    z-index: 1001;
    height: 200px
}

#navsubnav ul ul {
    background-image: none;
    background-position: left;
    background-repeat: repeat-y;
    cursor: pointer;
    display: block;
    float: none;
    padding: 0;
    height: auto;
    min-width: 98%;
}

    #navsubnav ul ul li a {
        background-image: none;
        background-position: right top;
        background-repeat: no-repeat;
        /*color:#FFF;
font-size:11px;
/*font-weight:bold;*/
        margin-left: 0px;
        padding: 2px 2px 2px 0;
        text-decoration: none;
        height: 14px;
        width: 100%;
    }

    #navsubnav ul ul li span {
        padding-left: 8px;
        background: none;
    }

    #navsubnav ul ul li a:hover {
        /*color:#002AFF;*/
        color: #333;
        background-color: #FFF;
    }

    #navsubnav ul ul li:hover {
        background-color: #FFF;
    }

    #navsubnav ul ul li {
        margin: 0px;
        display: block;
        /*\*/ float: none; /**/
        height: auto;
        background-image: none;
        width: 100%;
    }

.noSep {
}


/******** Dropdown menu ********/
ul.dropdown {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    z-index: 2;
}

    ul.dropdown a {
        display: block;
        color: #444444;
        text-decoration: none;
    }

    ul.dropdown li {
        float: left;
    }

        ul.dropdown li ul {
            display: none;
            position: absolute;
            z-index: 200;
            list-style-type: none;
            padding: 0px 10px;
        }

            ul.dropdown li ul li {
                clear: both;
                margin-left: -13px;
                padding-left: 5px;
                border: 0;
                min-width: 100px;
            }

                ul.dropdown li ul li:hover {
                    background-color: #ffffff;
                }

                    ul.dropdown li ul li:hover a {
                    }

#user.dir {
    color: #444444;
    padding-right: 15px;
}

#toplinks {
    float: right;
}

#language.dir {
    color: #444444;
    padding-right: 15px;
}

#language.dirSelected {
    color: #444444;
    padding-right: 15px;
    font-weight: 400;
}

#integrations.dir {
    color: #444444;
}

#integrations.dirSelected {
    color: #444444;
    font-weight: 400;
}

.clientsubmenu {
    margin-top: 20px;
}

    .clientsubmenu ul, .projectsubmenu ul, .entriessubmenu ul {
        list-style: none;
        padding: 0px;
        margin: 0px;
        border-bottom: 1px solid #999A9B;
    }

        .projectsubmenu ul li, .clientsubmenu ul li, .entriessubmenu ul li {
            display: inline;
        }

.entriessubmenu, .entriessubmenu ul {
    width: 100% !important;
}

.clientsubmenu ul li span, .projectsubmenu ul li span {
    color: #A7A9AB;
    padding: 3px 5px 1px 5px;
    font-weight: 400;
    font-size: 14px;
}

.entriessubmenu ul li > a > span {
    /*color: #A7A9AB;
    padding: 3px 5px 1px 5px;
    font-weight: 400;
    font-size: 14px;*/
}

.client-portal .clientsubmenu ul li span, .client-portal .projectsubmenu ul li span {
    padding: 3px 5px 2px 5px;
}

.clientsubmenu ul li a:hover, .projectsubmenu ul li a:hover, .entriessubmenu ul li > a {
    color: #000;
    font-weight: 400;
    text-decoration: none;
}

    .clientsubmenu ul li span:hover, .projectsubmenu ul li span:hover, .entriessubmenu ul li > a > span:hover {
        color: #000;
        font-weight: 400;
    }

    .clientsubmenu ul li > a.active > span, .projectsubmenu ul li > a.active > span, .entriessubmenu ul li > a.active > span {
        color: #000;
        font-weight: bold;
    }

    .clientsubmenu ul li span.selected, .projectsubmenu ul li span.selected, .entriessubmenu ul li > a.selected > span {
        border: 1px solid #A7A9AB;
        border-bottom: 3px solid white;
        margin-left: 5px;
        color: #000000;
        font-weight: 600;
    }

.menu-item-selected .grey_tab_title .grey_tab_title_middle .client {
    color: #000000;
}

.menu-item-selected .grey_tab_title .grey_tab_title_middle {
    background-repeat: repeat-x;
    float: left;
    height: 24px;
    text-align: left;
    color: #000000;
    background: url('../Images/tab_sel.png');
    background-repeat: no-repeat;
    background-position: center 28px;
}

.menu-item-newui {
    padding-top: 7px !important;
    padding-bottom: 2px !important;
}

.menu-page-separator {
    border-top: 25px solid #E6E7E8;
    margin-bottom: 15px;
    width: 950px;
}

.arrow-down-orange {
    background-image: url("../Images/Icons/dropdown_orange.png");
    background-position: right;
    background-repeat: no-repeat;
    height: 20px;
}

.arrow-down-white {
    background-image: url("../Images/Icons/dropdown_black_down.png");
    background-position: right;
    background-repeat: no-repeat;
    height: 20px;
}


.arrow-up-orange {
    background-image: url("../Images/Icons/dropdown_orange_up.png");
    background-position: right;
    background-repeat: no-repeat;
    height: 20px;
    font-weight: 600;
}

.arrow-up-white {
    background-image: url("../Images/Icons/dropdown_black_up.png");
    background-position: right;
    background-repeat: no-repeat;
    height: 20px;
    font-weight: 600;
}

.arrow-up-black {
    background-image: url("../Images/Icons/dropdown_black_up.png");
    background-position: right;
    background-repeat: no-repeat;
    height: 20px;
    font-weight: 600;
}

.help {
    padding-right: 15px;
}

#newmenubar ul li a {
    font-size: 12px;
    color: #FFFFFF;
    font-weight: 400;
}

#newmenubar ul li, #newmenubar ul li a {
    height: 30px !important;
    line-height: 30px !important;
}

    #newmenubar ul li:hover, #newmenubar ul li a:hover {
        background-color: #5c5c59 !important;
    }

        #newmenubar ul li a:hover span {
            color: #FFFFFF;
        }

#mormenubar ul li a {
    font-size: 12px;
    color: #FFFFFF;
    font-weight: 400;
}

#mormenubar ul li, #mormenubar ul li a {
    height: 30px !important;
    line-height: 30px !important;
}

    #mormenubar ul li:hover, #mormenubar ul li a:hover {
        background-color: #404041 !important;
    }

        #mormenubar ul li a:hover span {
            color: #FFFFFF;
        }

#navibar ul li.menu_selected.dashboard a,
#navibar li.menu_hover.dashboard a {
    background-color: transparent !important;
}


/*Hack id menus for apply design that apply to 2 submenus*/
.menu-arrow-submenu {
    background-image: url(../Images/Icons/active_arrow.png?2);
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-bottom: 7px !important;
    -ms-background-size: 15px 10px;
    background-size: 15px 10px;
}

@-moz-document url-prefix() {
    .menu-arrow-submenu {
        padding-bottom: 6.7px !important;
    }
}

#navsubnav ul li.active a span span.left-menu {
    color: #A7A9AC !important;
}

    #navsubnav ul li.active a span span.left-menu:hover {
        color: #000 !important;
    }

.first_level_menu_width {
    width: 1085px;
}


#header_my_account a {
    font-size: 14px;
    text-decoration: underline;
    color: #000000 !important;
    font-weight: 600;
    padding-left: 25px;
    text-align: right;
}

    #header_my_account a:hover {
        color: #F48120 !important;
        text-decoration: none !important;
    }

#header_logout a {
    font-size: 14px;
    text-decoration: underline;
    color: #000000 !important;
    font-weight: 600;
    padding-left: 25px;
    text-align: right;
}

    #header_logout a:hover {
        color: #F48120 !important;
        text-decoration: none !important;
    }

.daySelection > p {
    font-weight: 600;
    margin-left: 0px;
    margin-top: 20px;
    font-size: 12px;
}

.daySelection > .displayDays {
    width: 35px;
    height: 20px;
    margin: 0;
    padding: 4px;
    background-color: #F48120;
    color: white;
    display: inline-block;
    box-sizing: content-box;
    display: inline-block;
    border: 1px solid black;
    margin: 0 -2px;
    text-align: center;
}

.daySelection > .off,
.daySelection > .temp-off {
    background-color: white;
    color: black;
}

.daySelection > .weekDay1 {
    border: 1px solid black;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    margin-left: 2px;
}

.daySelection > .weekDay7 {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
/* Report Left Menu */
.report_left_6 {
    float: left;
    width: 150px;
    border-right: 1px solid #000000;
    margin-left: 5px;
}

.report_left_nav {
    width: 151px;
}

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

    .report_left_6 ul li {
        margin-bottom: 20px;
        font-size: 14px;
        color: #CECECE;
        text-decoration: none;
        text-align: right;
        padding-right: 20px;
        font-weight: 400;
    }

        .report_left_6 ul li a {
            color: #A7A9AB;
        }

            .report_left_6 ul li a:hover {
                text-decoration: none;
            }

            .report_left_6 ul li a span:hover {
                color: #000;
            }


        .report_left_6 ul li.selected {
            background-image: url(../images/report_bullet.png?2);
            background-repeat: no-repeat;
            background-position: right center;
            -ms-background-size: 8px 20px;
            background-size: 8px 15px;
            color: #000;
            font-weight: 600;
            text-decoration: none;
        }

            .report_left_6 ul li.selected a, .report_left ul li.selected a:hover {
                color: #000;
                text-decoration: none;
            }

                .report_left_6 ul li.selected a span:hover {
                    color: #000;
                    text-decoration: none;
                }

.report_lateral_line {
    height: unset;
}

.reports-center-div {
    margin: auto auto 20px auto;
    width: 920px;
    display: flex;
}

.report-filter-50 {
    width: 50%;
}

.lockLogfor {
    color: #444444;
    font-family: "Open Sans";
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
}

.lockLogWindow {
    margin-top: 0px;
    margin-left: 0px;
    top: 0;
    left: 0;
    z-index: 1050;
    background-color: #ffffff;
    box-sizing: content-box;
    position: relative;
    overflow-y: auto;
    padding-right: 30px;
    padding-left: 30px;
    padding-top: 25px;
    min-height: 95%;
}

ul#tab > li > a:not([href]):not([tabindex]),
ul#tabs > li > a:not([href]):not([tabindex]) {
    color: inherit;
    text-decoration: none;
}

/* Site CSS */

/* Common css */
.navibar_li_german {
    font-size: 13px !important
}

.navibar-a-german {
    margin-left: 5px !important
}

.invisible {
    display: none
}

.visibility-hidden {
    visibility: hidden !important
}

.noSep {
}

.clientsubmenu {
    margin-top: 20px
}

.menu-item-newui {
    padding-bottom: 2px !important;
    padding-top: 7px !important
}

.menu-page-separator {
    border-top: 25px solid #E6E7E8;
    margin-bottom: 15px;
    width: 950px
}

.help {
    padding-right: 15px
}

.menu-arrow-submenu {
    -ms-background-size: 15px 10px;
    background-image: url(../Images/Icons/active_arrow.png?2);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 15px 10px;
    padding-bottom: 7px !important
}

.first_level_menu_width {
    width: 1085px
}

.report_left_nav {
    width: 151px
}

.project_client {
    color: #A7A9AC;
    font-size: 12px;
    margin-left: 10px
}

.marginLeft25 {
    margin-left: 25px
}

.marginLeft30 {
    margin-left: 30px
}

.marginLeft10 {
    margin-left: 10px
}

.fright {
    float: right
}

.width100 {
    width: 100% !important
}

.displayNone {
    display: none
}

.text-center {
    text-align: center
}

.close-banner {
    background-position-x: 0%;
    background-position-y: 0%;
    background-position: center;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background: url('../../Images/Icons/list_remove.png') no-repeat;
    cursor: pointer;
    float: right;
    height: 20px;
    line-height: 36px;
    position: absolute;
    right: 2px;
    top: 8px;
    width: 20px
}

.add-new-code-button {
    background-color: #F48120;
    background-image: url(../../Images/Icons/Calendar28x30.svg);
    background-position: left 14px top 7px;
    background-repeat: no-repeat;
    color: #FFFFFF;
    cursor: pointer;
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: normal;
    height: 44px;
    letter-spacing: 0.79px;
    line-height: 40px;
    position: relative;
    text-align: center;
    top: 20px;
    width: 214px
}

.last-div-above {
    border-top: 1px solid #000000 !important;
    clear: both;
    margin-top: -1px
}

.loginTitle {
    background: #F1F1F2;
    color: #000;
    font-size: 24px;
    height: 60px
}

.topSpacing {
    height: 60px;
    line-height: 60px
}

.button_right {
    float: right;
    height: 24px
}

.button_left {
    float: left;
    padding: 0 5px 0 0px
}

.bank-account-label {
    display: inline-block;
    width: 90px
}

.repeaterTblHead {
    float: left;
    padding-top: 10px
}

.fullWidthContainerButtonsRightAlign {
    clear: both;
    float: left;
    text-align: right;
    width: 950px
}

.clientacclongColumn {
    clear: both;
    float: left;
    margin-left: 0px;
    padding-bottom: 9px
}

.width520 {
    width: 520px !important
}

.timeListControl {
    height: 105px !important;
    width: 120px
}

.availableFoundsMessage {
    background-color: #FEF799;
    height: 40px;
    line-height: 40px;
    margin-top: 20px;
    padding-left: 20px;
    padding-right: 20px
}

.circleContainerAvailableFounds {
    background-color: #F7941E;
    border-radius: 50%;
    float: left;
    height: 25px;
    line-height: 25px;
    margin-right: 15px;
    margin-top: 10px;
    text-align: center;
    width: 25px
}

.receptacle152 {
    width: 152px
}

.importCSVLink {
    text-decoration: underline
}

.importDataContent {
    float: left;
    left: 30px;
    position: relative;
    top: 40px;
    width: 680px
}

.closeImportaData {
    float: right;
    left: -30px;
    position: relative;
    top: 30px
}

.downloadButton {
    background-color: #c3c3c3;
    background-position: 10px center;
    background-repeat: no-repeat;
    border-color: #c3c3c3;
    color: #000;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    padding: 0px 15px 8px 35px;
    width: 40%
}
/* Common css */


/* MainNavigationVertical */
html,
body {
    height: 100%;
    margin: 0;
}

body {
    min-width: 1024px;
    display: flex;
    flex-flow: column;
    height: 100%;
}

.vertical-wrapper {
    display: flex;
    align-items: stretch;
    flex: 1 1 auto;
}

#vertical-wrapper {
    display: table;
    table-layout: fixed;
    height: 100%;
    border-collapse: collapse;
}

.sync-list-w, .project-list-w, .client-list-w, .invoice-list-w,
.app-padding {
    min-width: unset !important;
}

.app-padding {
    padding-left: 45px !important;
    padding-right: 45px !important;
    padding-top: 45px !important;
    display: block;
}

.app-modalpadding {
    padding-left: 45px !important;
    padding-right: 45px !important;
    padding-top: 70px !important;
    display: block;
}

#externalMenu #sidebar,
#sidebar {
    width: 200px;
    max-width: 200px;
    min-width: 200px;
    background-color: #7A7A7A;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
}

    #externalMenu #sidebar a,
    #sidebar a {
        color: #fff;
        font-size: 12px;
        font-weight: 400;
        display: block;
        letter-spacing: 0;
        transition: all 0.25s ease-in-out;
        text-decoration: none;
        position: relative;
        font-weight: 400;
    }

    #externalMenu #sidebar li.active > a.collapsed,
    #sidebar li.active > a.collapsed {
        background: #5C5C59;
        transition-delay: 0.25s;
    }

#externalMenu div.app-header,
#externalMenu div.app-header:hover,
div.app-header {
    background-color: #5C5C59 !important;
    height: 50px !important;
    color: #fff;
    box-shadow: 0 2px 4px 0 rgba(68,68,68,0.75);
    position: relative;
    z-index: 4;
    min-width: 1036px;
}

    #externalMenu div.app-header .text-right > a,
    #externalMenu div.app-header .text-right > a,
    #externalMenu div.app-header .text-right > a :hover,
    div.app-header .text-right > a,
    div.app-header .text-right > a,
    div.app-header .text-right > a :hover {
        color: #fff !important;
        text-decoration: none;
        font-weight: 600;
        font-size: 12px;
        cursor: pointer;
    }

        #legacySync .language_container,
        #externalMenu div.app-header .text-right > a :hover,
        div.app-header .text-right > a :hover {
            font-size: 16px;
        }

    div.app-header .app-logo {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: row;
    }

    div.app-header a.logo {
        width: 144px;
        background-repeat: no-repeat;
        background-size: auto 31px;
        background-position: left center;
    }

    div.app-header .app-logo a.logo {
        background-image: url('../images/branding/time-tracker.svg');
        margin-right: 40px;
    }

    div.app-header .law-logo a.logo {
        background-image: url('../images/branding/lawbillity.svg');
    }

    div.app-header .tb-logo a.logo {
        background-image: url('../images/branding/time-and-billing.svg');
    }

#externalMenu .nav-bar-width,
.nav-bar-width {
    background-color: var(--mainNavigationBackground) !important;
}

#externalMenu nav.main-navigation,
nav.main-navigation {
    padding: 0 !important;
    min-width: var(--pageWidth);
}

    nav.main-navigation .toolbar {
        display: flex;
        align-items: center;
        margin-right: 43px;
    }

    nav.main-navigation .navbar-nav {
        height: 40px;
        display: -ms-flexbox;
        display: flex;
        padding-left: 0;
        margin: 0;
        margin-bottom: 0;
        list-style: none;
    }

#externalMenu .navbar-light .navbar-nav .nav-link:hover,
#externalMenu .navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
    color: var(--pageBackground);
}

#externalMenu nav.main-navigation.bg-light .nav-link,
#externalMenu nav.main-navigation.bg-light .nav-item:hover > .nav-link,
#externalMenu nav.main-navigation.bg-light .nav-link,
nav.main-navigation.bg-light .nav-link,
nav.main-navigation.bg-light .nav-item:hover > .nav-link,
nav.main-navigation.bg-light .nav-link {
    color: var(--pageBackground);
    font-size: 14px;
    padding-top: 10px;
    padding-bottom: 9px;
    min-width: 45px;
    text-align: center;
    display: flex;
}

#externalMenu nav.main-navigation.bg-light .nav-item.active.preview a,
#externalMenu nav.main-navigation.bg-light .nav-item.active a,
nav.main-navigation.bg-light .nav-item.active.preview a,
nav.main-navigation.bg-light .nav-item.active a {
    color: var(--mainNavigationHoverBackground) !important;
    font-weight: 600;
}

.subnav {
    display: none;
    color: black;
    background-color: var(--mainNavigationAltBackground) !important;
}

    .subnav.preview {
        background-color: var(--mainNavigationHoverBackground) !important;
        color: var(--mainNavigationAltBackground) !important;
    }

        .subnav.preview a:hover {
            font-weight: 500;
        }

    .subnav.activeContent {
        display: block;
    }

        .subnav.activeContent.preview {
            background-color: var(--mainNavigationAltBackground) !important;
        }

    .subnav > ul {
        list-style: none;
        padding: 0;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 0
    }

        .subnav > ul > li {
            display: inline-block;
        }

            #externalMenu .subnav > ul > li > span,
            #externalMenu .subnav > ul > li > a,
            .subnav > ul > li > span,
            .subnav > ul > li > a {
                display: inline-flex;
                color: #808284;
                font-size: 12px;
                padding: 7px 20px 7px 0px;
            }

    #externalMenu .subnav.preview > ul > li > a,
    .subnav.preview > ul > li > a {
        color: var(--mainNavigationAltBackground);
    }

    #externalMenu .subnav.preview:not(.activeContent) > ul > li > a:hover,
    .subnav.preview:not(.activeContent) > ul > li > a:hover {
        color: white !important;
        text-shadow: 0px 0px 1px white;
        font-weight: 500;
    }

    #externalMenu .subnav.preview.activeContent > ul > li > span,
    #externalMenu .subnav.preview.activeContent > ul > li > a,
    .subnav.preview.activeContent > ul > li > span,
    .subnav.preview.activeContent > ul > li > a {
        color: #808284;
    }

    #externalMenu .subnav.preview.activeContent > ul > li.active > span,
    #externalMenu .subnav.preview.activeContent > ul > li.active > a,
    #externalMenu .subnav.preview.activeContent > ul > li.active > a:hover,
    #externalMenu .subnav > ul > li.active > span,
    #externalMenu .subnav > ul > li.active > a,
    #externalMenu .subnav > ul > li.active > a:hover,
    .subnav.preview.activeContent > ul > li.active > span,
    .subnav.preview.activeContent > ul > li.active > a,
    .subnav.preview.activeContent > ul > li.active > a:hover,
    .subnav > ul > li.active > span,
    .subnav > ul > li.active > a,
    .subnav > ul > li.active > a:hover {
        font-weight: 600;
        color: black;
    }

    #externalMenu .subnav.activeContent > ul > li > a:hover,
    .subnav.activeContent > ul > li > a:hover {
        color: black;
    }

.menu-dropdown {
    width: 300px;
    background-color: var(--mainNavigationBackground);
    position: absolute;
    z-index: 40000;
    top: 100%;
    right: 15px;
    display: none;
    cursor: default;
    transition: all 0.5s ease-in-out;
    opacity: 0;
    text-align: left;
}

    .menu-dropdown.show {
        display: block;
        opacity: 1;
        animation-name: showAnimation;
        animation-duration: 150ms;
        animation-iteration-count: 1;
        color: #444444;
        box-shadow: rgb(0 0 0 / 20%) 0px 15px 15px;
    }

    .menu-dropdown > .title {
        color: #444444;
        font-family: "Open Sans";
        font-size: 18px;
        letter-spacing: 0;
        line-height: 33px;
        text-align: left;
        padding-left: 10px;
        padding-top: 10px;
        font-weight: 400;
    }

    .menu-dropdown .list {
        padding-left: 0px;
        padding-top: 10px;
        font-size: 16px;
    }

    .menu-dropdown label {
        display: block;
        margin-bottom: .5rem;
        height: 24px;
    }

#languageSelector {
    position: relative;
    display: inline-block;
    margin-right: 30px;
}

#languageList.menu-dropdown {
    width: 260px;
    padding-right: 10px;
    background-color: #D8D8D8;
    box-shadow: 0 2px 4px 2px rgb(0 0 0 / 50%);
    top: -165px;
}

#languageSelector .currentLanguage {
    text-decoration: none;
    background-image: url(../images/vertical-nav-icons/language.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    cursor: pointer;
    width: 18px;
    height: 18px;
}

#moreMenu {
    display: flex;
    align-items: center;
    position: relative;
    margin-left: 15px;
    height: 40px;
    display: flex;
    align-items: center;
}

    #moreMenu .moreTitle {
        color: var(--pageBackground) !important;
        text-decoration: none;
        font-weight: 600;
        font-size: 14px;
        background-image: url('../images/arrow-down-light.svg');
        background-repeat: no-repeat;
        background-position: right center;
        background-size: 13px;
        padding-right: 20px;
        margin-right: 10px;
        cursor: pointer;
    }

    #moreMenu .list a {
        color: var(--pageBackground);
        text-decoration: none;
        font-size: 14px;
        display: block;
        margin-bottom: 5px;
        padding: 5px 10px;
    }

        #moreMenu .list a:hover {
            background-color: var(--mainNavigationHoverBackground);
        }

    #moreMenu .menu-dropdown {
        width: 165px;
        padding-bottom: 10px;
        top: 40px;
        left: -10px;
    }

#createMenu {
    display: flex;
    align-items: center;
    position: relative;
    background-color: var(--orangeColor);
    height: 32px;
    padding-left: 11.5px;
    width: 100px;
    font-size: 14px;
    box-shadow: 0 2px 4px 0 #444444;
}

    #createMenu .createTitle {
        color: var(--pageBackground) !important;
        text-decoration: none;
        font-weight: 600;
        background-image: url('../images/plus-light.svg');
        background-repeat: no-repeat;
        background-position: left center;
        background-size: 9px;
        padding-left: 24px;
        cursor: pointer;
        color: white;
    }

    #createMenu .list a {
        color: #444444;
        text-decoration: none;
        font-size: 15px;
        display: block;
        margin-bottom: 5px;
        padding: 5px 10px;
        color: white;
    }

        #createMenu .list a:hover {
            background-color: var(--mainNavigationBackground);
        }

    #createMenu .menu-dropdown {
        width: 168px;
        padding-bottom: 10px;
        top: 32px;
        background-color: var(--orangeColor);
        left: 0px;
        border-radius: 0px;
        box-shadow: 0 4px 4px 0 rgba(0,0,0,0.5);
    }

#legacySync {
    position: relative;
    display: inline-block;
    margin-right: 20px;
}

#top-links {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: flex-end;
    margin-right: 45px;
}

#legacySync .arrow-up-black,
#legacySync .arrow-down-white {
    background-image: url(../images/arrow-down-light.svg) !important;
    background-position: right 6px !important;
    background-size: 12px !important;
}

#legacySync .languageButtonToggle .arrow-down-white {
    background-image: url(../images/arrow-up-light.svg) !important;
    background-position: right 8px !important;
    background-size: 12px !important;
}

#legacySync .language_container,
#legacySync .languageButtonToggle {
    border: none !important;
    font-weight: 600 !important;
    display: flex;
}

div.app-header .text-end div#helpSupportlink {
    color: #5C5C59 !important;
    cursor: pointer;
    margin-right: 20px;
}

#username {
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    cursor: pointer;
    padding-right: 0px;
    margin-right: 20px;
    display: flex;
    max-width: 140px;
    align-items: center;
}

.logout img {
    width: 26px;
    vertical-align: baseline;
}

#externalMenu input[type="radio"], #externalMenu input[type="checkbox"] {
    padding-top: initial !important;
    height: auto;
}

#externalMenu .rowActive input[type=checkbox]#PersistLanguage,
#externalMenu .row input[type=checkbox]#PersistLanguage,
.row input[type=checkbox]#PersistLanguage {
    padding-top: initial !important;
    height: auto;
}

#externalMenu .rowActive,
#externalMenu .rowSelected {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

#externalMenu .rowSelected {
    padding-top: initial;
    margin: 0px;
    border-bottom: initial;
    height: initial;
    line-height: initial;
    background-color: initial;
}

#userinfo {
    color: #fff;
    line-height: 16px;
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
}

    #userinfo .light-label {
        font-weight: 300;
    }

#externalMenu div.userinfo_content,
div.userinfo_content {
    overflow: auto;
    display: none;
    background: #404041;
    width: 100%;
    padding: 20px 0;
}

#externalMenu div.help_content * {
    box-sizing: content-box !important;
}

#externalMenu div.userinfo_content ul li,
div.userinfo_content ul li {
    display: inline;
    list-style-type: none;
    padding-right: 20px;
}

    #externalMenu div.userinfo_content ul li a,
    div.userinfo_content ul li a {
        font-size: 16px;
        text-decoration: underline;
        color: #ffffff;
        font-weight: 600;
    }

.change-firm-link:hover,
.change-firm-link {
    text-decoration: underline !important;
    margin-left: 5px;
    color: #4793d9
}

#externalMenu .row {
    line-height: initial;
    height: auto;
    border-bottom: none;
}

    #externalMenu .row:hover {
        background-color: transparent !important;
    }

.app-logo .dateTimeCard {
    margin-left: 180px;
    margin-top: 7px;
}

#externalMenu div.app-header .text-right a span:not(.language_container):hover,
#externalMenu .a-under span:not(.language_container):hover {
    color: #4793d9 !important;
    font-size: 12px;
}

#externalMenu div.app-header .text-right a span.red-text:hover,
#externalMenu .a-under span.red-text:hover {
    color: #ED1C24 !important;
}

#externalMenu div.app-header .text-right a.blue-text,
#externalMenu div.app-header .text-right a.blue-text:hover,
div.app-header .text-right a.blue-text,
div.app-header .text-right a.blue-text:hover {
    color: #4793d9 !important;
}

#externalMenu div.userinfo_content ul li a:hover, div.userinfo_content ul li a:hover {
    color: var(--orangeColor) !important;
    text-decoration: none !important;
}

#languageSelector label.radio {
    font-size: 1rem;
    color: var(--color);
    display: grid;
    grid-template-columns: min-content auto;
    grid-gap: 0.5em;
}

#languageSelector .radio__input input {
    opacity: 0;
    width: 0;
    height: 0;
    display: none;
}

#languageSelector .radio__control {
    display: block;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    border: 1.4px solid #444444;
}

#languageSelector .radio__input {
    display: flex;
    line-height: 1;
    transform: translateY(0.25em);
}

#languageSelector input:checked + .radio__control {
    background: radial-gradient(currentcolor 55%, rgba(255, 0, 0, 0) 56%);
}

/* Customize the label (the container) */
#languageSelector .container {
    display: block;
    position: relative;
    padding-left: 25px !important;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 1em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
    #languageSelector .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
#languageSelector .checkmark {
    position: absolute;
    top: 4px;
    left: 0;
    height: 15px;
    width: 15px;
    background-color: transparent;
    border: 1.5px solid #444444;
}

    /* Create the checkmark/indicator (hidden when not checked) */
    #languageSelector .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

/* Show the checkmark when checked */
#languageSelector .container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
#languageSelector .container .checkmark:after {
    left: 4px;
    top: 0px;
    width: 5px;
    height: 10px;
    border: solid #444444;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#externalMenu .dasboardactivationbar {
    width: auto !important;
    margin-top: -1px !important;
    margin-left: 0 !important;
    padding: 2px !important;
    color: black;
    min-width: 230px;
}

    #externalMenu .dasboardactivationbar .activationtext {
        font-size: 11px;
        margin: 0 !important;
    }

#externalMenu a.activatebtn {
    color: #F48120;
}

    #externalMenu a.activatebtn:hover {
        color: #0f77d7;
    }

.nav-item a {
    display: inline-block;
    text-transform: capitalize;
}

    .nav-item a:first-letter,
    .nav-item:first-letter {
        text-transform: uppercase;
    }

    .nav-item a img {
        margin: auto;
    }


.logout-link {
    text-decoration: underline !important;
    cursor: pointer;
}

logout-link:hover {
    text-decoration: none;
}

#sidebar > ul > li > a > .img {
    padding: 4px 8px 5px 21px;
    width: 26px;
    height: 26px;
    max-width: 26px;
    display: inline-block;
    box-sizing: content-box;
}

#sidebar .sub-menu {
    margin: 0 0 5px 0;
    transition: all 0.25s ease;
}

    #sidebar .sub-menu a,
    #sidebar .sub-menu span {
        font-size: 12px;
        margin-left: 56px;
        font-weight: 400;
        overflow: hidden;
        text-overflow: ellipsis;
        text-decoration: none;
        line-height: 20px;
    }

#sidebar .dropdown-toggle {
    padding-right: 45px;
    overflow: hidden;
    text-overflow: ellipsis;
}

    #sidebar .dropdown-toggle:hover,
    #sidebar .collapsed:hover,
    #sidebar .sub-menu:hover,
    #sidebar .sub-menu.active {
        transition-delay: 0.20s;
        background-color: #5C5C59;
        transition-timing-function: ease-in-out;
        text-decoration: none;
    }

        #sidebar .sub-menu.active a {
            font-weight: 400;
            text-shadow: 0.5px 0 0 currentColor;
        }

    #sidebar .dropdown-toggle::after {
        display: inline-block;
        vertical-align: middle;
        margin-left: 10px;
        content: "";
        border-bottom: 2px solid white;
        border-right: 2px solid white;
        border-top: 0;
        border-left: 0;
        transform: rotate(-135deg);
        width: 10px;
        height: 10px;
        left: 165px;
        position: absolute;
        top: 15px;
    }

    #sidebar .dropdown-toggle.collapsed::after {
        display: inline-block;
        vertical-align: middle;
        margin-left: 10px;
        margin-bottom: 10px;
        content: "";
        border-bottom: 2px solid white;
        border-right: 2px solid white;
        border-top: 0;
        border-left: 0;
        transform: rotate(45deg);
        width: 10px;
        height: 10px;
        top: 9px;
    }

.footerEb.vertical {
    margin-top: 0 !important;
    position: relative;
    display: table-row;
    height: 25px !important;
    background-color: #D8D8D8 !important;
    color: #5C5C59 !important;
    line-height: normal;
    line-height: 25px;
    font-size: 12px;
    box-shadow: -1px -1px 4px 0 rgba(68,68,68,0.75) !important;
}

    .footerEb.vertical .noHover:hover {
        background-color: #D8D8D8 !important;
    }

.for-vertical-menu #userinfo > div.no-gutters {
    margin-left: 15px !important;
    margin-right: 15px !important;
}

#username .user-image {
    background-color: #B1B1B1;
    width: 26px;
    min-width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 12px;
    text-align: center;
    line-height: 28px;
    color: #fff;
}

#username .user-name {
    margin-right: 5px;
    max-width: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
}


#legacySync .arrow-down-white {
    height: auto;
}

#externalMenu #sidebar > ul > li,
#sidebar > ul > li {
    margin-top: 10px;
}


.social-media {
    display: flex;
    flex-direction: row;
    margin: 30px 45px 15px 45px;
    height: 30px;
}

.media-link {
    position: relative;
    width: 24px;
    max-width: 100%;
    height: 24px;
    margin: auto;
}

    .media-link img.image-hover {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        object-fit: contain;
        opacity: 0;
    }

    .media-link:hover img.image-hover {
        opacity: 1;
    }

    .media-link:hover img.image-main {
        opacity: 0;
    }

#sidebar > ul.list-unstyled.components {
    flex-grow: 1;
    margin-left: 0;
}

.vertical #schedule,
#vertical-wrapper .search-container,
#vertical-wrapper .invoice-filter-w {
    min-width: 1006px;
}

.activationtext {
    color: #000;
}

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

.top-bar-hover-effect {
    position: relative;
    width: 26px; /* can be omitted for a regular non-lazy image */
    height: 26px;
    max-width: 100%;
}

    .top-bar-hover-effect img.image-hover {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        object-fit: contain;
        opacity: 0;
    }

    .top-bar-hover-effect:hover img.image-hover {
        opacity: 1;
    }

    .top-bar-hover-effect:hover img.image-main {
        opacity: 0;
    }

#trialPeriodStatistics {
    max-width: 250px;
    min-width: 230px;
}

@keyframes user-menu-in-animation {
    0% {
        opacity: 0;
        visibility: visible;
        top: 10px;
        right: 45px;
    }

    100% {
        opacity: 1;
        top: 48px;
        right: 45px;
    }
}

#user-info-menu-wrapper {
    position: absolute;
    height: auto;
    width: 250px;
    background-color: #5C5C59;
    box-shadow: 0 2px 4px 0 #444444;
    overflow: hidden;
    right: 0px;
    top: 40px;
    z-index: 3;
    display: none;
    max-height: 273px;
    transition: all 350ms;
    transition-timing-function: ease-in-out;
}

    #user-info-menu-wrapper.extra {
        max-height: 500px;
    }

    #user-info-menu-wrapper.slide-in {
        visibility: visible;
        opacity: 0;
        display: flex;
        flex-direction: row;
        top: 10px;
        z-index: 99;
        animation-name: user-menu-in-animation;
        animation-fill-mode: forwards;
        animation-duration: 150ms;
        animation-delay: 0ms;
        animation-timing-function: ease-out;
        animation-iteration-count: 1;
    }

        #user-info-menu-wrapper.slide-in ul#main-panel {
            margin-left: 0;
            opacity: 1;
            transition-timing-function: ease-in;
            transition-delay: 0ms !important;
            transition: all 550ms;
        }

            #user-info-menu-wrapper.slide-in ul#main-panel.forward {
                margin-left: -250px;
            }

        #user-info-menu-wrapper.slide-in ul#plan-panel {
            transition-timing-function: ease-in;
            transition-delay: 0ms !important;
            transition: all 1000ms;
            max-height: 0;
        }

        #user-info-menu-wrapper.slide-in.extra ul#plan-panel {
            transition-timing-function: ease-in;
            transition-delay: 0ms !important;
            transition: all 1000ms;
            max-height: 500px;
        }

    #user-info-menu-wrapper ul {
        list-style: none;
        padding: 0;
        margin: 0;
        text-align: left;
        width: 250px;
        min-width: 250px;
    }

        #user-info-menu-wrapper ul .menu-item a,
        #user-info-menu-wrapper ul .menu-item:not(.plan-info) a:hover {
            color: #FFFFFF;
            font-family: "Open Sans";
            font-size: 16px !important;
            letter-spacing: 0;
            line-height: 22px !important;
            text-decoration: none;
            font-weight: 400 !important;
        }

        #user-info-menu-wrapper ul .menu-item {
            padding: 6px 30px;
            position: relative;
            height: 39px;
        }

            #user-info-menu-wrapper ul .menu-item.next::after {
                display: inline-block;
                vertical-align: middle;
                margin-left: 10px;
                margin-bottom: 10px;
                content: "";
                border-bottom: 2px solid white;
                border-right: 2px solid white;
                border-top: 0;
                border-left: 0;
                transform: rotate(-45deg);
                width: 10px;
                height: 10px;
                position: absolute;
                right: 13px;
                top: 15px;
            }

            #user-info-menu-wrapper ul .menu-item:not(.plan-info) {
                background-color: #5C5C59;
                transition-delay: 100ms !important;
                transition: all 150ms;
            }

                #user-info-menu-wrapper ul .menu-item:not(.plan-info):hover {
                    background-color: #959595;
                }

            #user-info-menu-wrapper ul .menu-item.back::before {
                display: inline-block;
                vertical-align: middle;
                margin-left: 10px;
                margin-bottom: 10px;
                content: "";
                border-bottom: 2px solid white;
                border-right: 2px solid white;
                border-top: 0;
                border-left: 0;
                transform: rotate(-225deg);
                width: 10px;
                height: 10px;
                position: absolute;
                left: 0px;
                top: 15px;
            }

    #user-info-menu-wrapper.slide-in ul li.plan-info {
        font-size: 14px !important;
        font-weight: 400 !important;
        cursor: default;
        height: auto;
    }

        #user-info-menu-wrapper.slide-in ul li.plan-info .user-link:hover,
        #user-info-menu-wrapper.slide-in ul li.plan-info .user-link {
            font-size: 14px !important;
            font-weight: 400 !important;
            text-decoration: underline;
            color: #4D82B1 !important;
            text-transform: capitalize;
            cursor: pointer;
        }


#user-menu-mask.selection-mask:not(.visible) {
    display: none;
}

#user-info-menu-wrapper p {
    overflow-wrap: break-word;
    margin-bottom: 1rem;
}

.selection-mask {
    border: 0;
    margin: 0;
    padding: 0;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: -1;
    background-color: #fff;
    filter: alpha(opacity=0);
    display: none;
}

    .selection-mask.visible {
        display: block;
    }


#sidebar .top-buttons {
    margin-top: 16px;
    margin-left: 19px;
    margin-bottom: 15px;
}

#sidebar.nav-bar-collapsed .top-buttons {
    margin-left: 19px;
}

.entry-progress {
    z-index: 2;
}


#externalMenu #sidebar.nav-bar-collapsed, #sidebar.nav-bar-collapsed {
    width: 70px !important;
    max-width: 70px !important;
    min-width: 70px !important;
}

#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed li.active > a,
#sidebar:not(.flyout-view).nav-bar-collapsed li.active > a {
    background: #5C5C59;
    transition-delay: 0.25s;
}

#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed ul > li > a > .mnuName,
#sidebar:not(.flyout-view).nav-bar-collapsed ul > li > a > .mnuName,
#sidebar:not(.flyout-view).nav-bar-collapsed .dropdown-toggle::after,
#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed li > ul,
#sidebar:not(.flyout-view).nav-bar-collapsed li > ul {
    display: none;
}

#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed .dropdown-toggle,
#sidebar:not(.flyout-view).nav-bar-collapsed .dropdown-toggle {
    text-overflow: initial;
}

#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed #createMenu .menu-dropdown,
#sidebar:not(.flyout-view).nav-bar-collapsed #createMenu .menu-dropdown {
    left: 0px;
}

#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed #createMenu,
#sidebar:not(.flyout-view).nav-bar-collapsed #createMenu {
    width: 32px;
    padding: 0;
    margin: 0;
}

    #externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed #createMenu #createTitle,
    #sidebar:not(.flyout-view).nav-bar-collapsed #createMenu #createTitle {
        text-indent: -9999px;
        margin: 0;
        padding: 0;
        width: 40px;
        background-position: center;
    }

#mnuToggle {
    width: 25px;
    height: 25px;
    min-height: 25px;
    font-size: 25px;
    position: fixed;
    top: 66px;
    z-index: 4;
    left: 187px;
    cursor: pointer;
    background: #7A7A7A;
    color: white;
    border: 1px solid #5C5C59;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    #mnuToggle:not(.nav-bar-collapsed ) .fa-angle-right {
        display: none;
    }

    #mnuToggle.nav-bar-collapsed {
        left: 57px;
    }

        #mnuToggle.nav-bar-collapsed .fa-angle-left {
            display: none;
        }

    #mnuToggle > i {
        position: absolute;
        top: -2px;
    }

#sidebar:not(.flyout-view).nav-bar-collapsed .social-media {
    flex-direction: column;
    margin: 30px 0px 15px 0px;
    height: auto;
}

    #sidebar:not(.flyout-view).nav-bar-collapsed .social-media > a {
        margin-top: 16px;
    }


#main-sub-navigation,
#main-sub-navigation.nav-bar-collapsed {
    display: block;
    margin-top: 70px;
    margin-left: 110px;
    margin-bottom: 20px;
    text-align: left;
}

#main-sub-navigation {
    margin-left: 240px;
}


    #main-sub-navigation > ul {
        list-style: none;
        padding: 0;
    }

#vertical-wrapper-legacy #main-sub-navigation > ul {
    margin-left: 0px;
}

#main-sub-navigation > ul > li {
    display: inline-flex;
    border: 1px solid #959595;
    border-radius: 4px;
    padding: 10px 6px;
    margin-right: 10px;
    font-weight: 400;
    color: #959595;
    background-color: #fff;
    cursor: pointer;
    height: 30px;
    align-items: center;
    margin-bottom: 10px;
}

    #main-sub-navigation > ul > li:hover {
        background-color: #f7f7f7;
    }

    #main-sub-navigation > ul > li a,
    #main-sub-navigation > ul > li a:hover {
        text-decoration: none;
        color: #959595;
    }


    #main-sub-navigation > ul > li.active a,
    #main-sub-navigation > ul > li.active a:hover {
        color: #444;
    }

    #main-sub-navigation > ul > li.active:hover,
    #main-sub-navigation > ul > li.active {
        border: 1px solid #444444;
        background-color: #e8e8e8;
    }


#externalSubNavigation #main-sub-navigation {
    margin-top: 0px;
    margin-left: 0px;
    margin-bottom: 20px;
}

.vertical #footereb-legacy.nav-bar-collapsed:not(.full-width) {
    margin-left: 70px;
}

#sidebar.nav-bar-collapsed.flyout-view {
    position: absolute;
    overflow: hidden;
    max-height: calc(100vh - 78px);
    margin-bottom: 100px;
    overflow-y: auto;
    width: 250px !important;
    max-width: 250px !important;
    min-width: 250px !important;
    z-index: 1000;
    background: rgba(71,71,71,0.7);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    box-shadow: 0 6.4px 14.4px 0 rgb(0 0 0 / 13%), 0 1.2px 3.6px 0 rgb(0 0 0 / 11%);
}


/* width */
.flyout-view::-webkit-scrollbar {
    width: 10px;
}

/* Track */
.flyout-view::-webkit-scrollbar-track {
    background: rgb(0 0 0 / 0.00);
}

/* Handle */
.flyout-view::-webkit-scrollbar-thumb {
    background: #474747;
}

    /* Handle on hover */
    .flyout-view::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

.flyout-view-margin {
    margin-left: 70px !important;
}

#externalMenu #sidebar > ul > li, #sidebar > ul > li,
#externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed > ul > li, #sidebar:not(.flyout-view).nav-bar-collapsed > ul > li {
    margin-top: 0px;
    margin-bottom: 10px;
}

    #externalMenu #sidebar > ul > li > a, #sidebar > ul > li > a,
    #externalMenu #sidebar:not(.flyout-view).nav-bar-collapsed > ul > li > a, #sidebar:not(.flyout-view).nav-bar-collapsed > ul > li > a {
        padding-top: 0px;
        padding-bottom: 0px;
    }

#sidebar .mnuName {
    opacity: 1 !important;
    position: absolute;
    top: 7px;
    font-size: 14px;
    font-weight: 600;
}

#sidebar li.active .mnuName {
    font-weight: 800;
}

#sidebar.nav-bar-collapsed .mnuName {
    opacity: 0 !important;
}

#main-sub-navigation img {
    width: 20px;
    height: 20px;
    vertical-align: top;
}


#sidebar.nav-bar-collapsed {
    transition: all;
    transition-duration: 200ms;
}

#sidebar.expanding {
    transition: all;
    transition-duration: 200ms;
}

    #sidebar.expanding ul > li > a > .mnuName,
    #sidebar.expanding li > ul {
        display: none;
        text-overflow: initial;
        overflow: visible;
    }

    #sidebar.expanding .dropdown-toggle {
        text-overflow: initial;
    }

        #sidebar.expanding .dropdown-toggle::after {
            display: none;
        }


#mnuToggle {
    transition: left;
    transition-duration: 200ms;
}

#trialPeriodStatistics,
#legacyActivation {
    display: inline-block;
}

.app-logo #trialPeriodStatistics .dasboardactivationbar {
    margin-top: 0px !important;
    height: 44px !important;
}

.fa.fa-angle-right {
    left: 8px;
}

.fa.fa-angle-left {
    left: 7px;
}

.headerProduct {
    padding-top: 4px !important;
}

.hover-effect {
    position: relative;
    width: 26px; /* can be omitted for a regular non-lazy image */
    height: 26px;
    max-width: 100%;
}

    .hover-effect img.image-hover {
        position: absolute;
        top: 4px;
        right: 0;
        left: 21px;
        bottom: 0;
        object-fit: contain;
        opacity: 0;
        width: 26px;
        height: 26px;
        transition-delay: 250ms;
    }

    #sidebar.nav-bar-collapsed > ul > li:hover .hover-effect img.image-hover,
    .hover-effect:hover img.image-hover {
        opacity: 1;
    }

    #sidebar.nav-bar-collapsed > ul > li:hover .hover-effect img.image-main,
    .hover-effect:hover img.image-main {
        opacity: 0;
        transition-delay: 250ms;
    }

#sidebar:not(.nav-bar-collapsed) > ul > li:hover .hover-effect.hover-always img.image-hover {
    opacity: 1;
    transition-delay: 250ms;
}

#sidebar:not(.nav-bar-collapsed) > ul > li:hover .hover-effect.hover-always img.image-main {
    opacity: 0;
    transition-delay: 250ms;
}

.hover-tooltip {
    display: none;
}

#sidebar.nav-bar-collapsed img.image-hover:hover + .hover-tooltip {
    display: block;
}

#help-support-mask.visible {
    z-index: 1;
}

#syncFirmCentral {
    font-size: 16px !important;
    margin-right: 20px;
    position: relative;
}

.walkme-custom-icon-outer-div {
    z-index: 2 !important;
}


#chatBot-menu-wrapper {
    position: absolute;
    height: 0px;
    width: 414px;
    overflow: hidden;
    right: 224px;
    top: 50px;
    z-index: 3;
    display: block;
    transition: all 250ms ease-out;
    transition-delay: 50ms;
    background-color: #5C5C59;
    box-shadow: 0 2px 4px 0 #444444;
    margin-right: -25px;
}

    #chatBot-menu-wrapper.extra {
        max-height: 500px;
    }

    #chatBot-menu-wrapper.slide-in {
        visibility: visible;
        opacity: 1;
        display: block;
        top: 50px !important;
        z-index: 99;
        position: fixed;
        margin-right: -25px;
        height: 600px;
        transition: all 250ms ease-in !important;
        transition-delay: 100ms !important;
    }

        #chatBot-menu-wrapper.slide-in ul#main-panel {
            margin-left: 0;
            opacity: 1;
            transition-timing-function: ease-in;
            transition-delay: 0ms !important;
            transition: all 550ms;
        }

            #chatBot-menu-wrapper.slide-in ul#main-panel.forward {
                margin-left: -250px;
            }

        #chatBot-menu-wrapper.slide-in ul#plan-panel {
            transition-timing-function: ease-in;
            transition-delay: 0ms !important;
            transition: all 1000ms;
            max-height: 0;
        }

        #chatBot-menu-wrapper.slide-in.extra ul#plan-panel {
            transition-timing-function: ease-in;
            transition-delay: 0ms !important;
            transition: all 1000ms;
            max-height: 500px;
        }

    #chatBot-menu-wrapper ul {
        list-style: none;
        padding: 0;
        margin: 0;
        text-align: left;
        width: 250px;
        min-width: 250px;
    }

        #chatBot-menu-wrapper ul .menu-item a,
        #chatBot-menu-wrapper ul .menu-item:not(.plan-info) a:hover {
            color: #FFFFFF;
            font-family: "Open Sans";
            font-size: 16px !important;
            letter-spacing: 0;
            line-height: 22px !important;
            text-decoration: none;
            font-weight: 400 !important;
        }

        #chatBot-menu-wrapper ul .menu-item {
            padding: 6px 30px;
            position: relative;
            height: 39px;
        }

            #chatBot-menu-wrapper ul .menu-item.next::after {
                display: inline-block;
                vertical-align: middle;
                margin-left: 10px;
                margin-bottom: 10px;
                content: "";
                border-bottom: 2px solid white;
                border-right: 2px solid white;
                border-top: 0;
                border-left: 0;
                transform: rotate(-45deg);
                width: 10px;
                height: 10px;
                position: absolute;
                right: 13px;
                top: 15px;
            }

            #chatBot-menu-wrapper ul .menu-item:not(.plan-info) {
                background-color: #5C5C59;
                transition-delay: 100ms !important;
                transition: all 150ms;
            }

                #chatBot-menu-wrapper ul .menu-item:not(.plan-info):hover {
                    background-color: #959595;
                }

            #chatBot-menu-wrapper ul .menu-item.back::before {
                display: inline-block;
                vertical-align: middle;
                margin-left: 10px;
                margin-bottom: 10px;
                content: "";
                border-bottom: 2px solid white;
                border-right: 2px solid white;
                border-top: 0;
                border-left: 0;
                transform: rotate(-225deg);
                width: 10px;
                height: 10px;
                position: absolute;
                left: 0px;
                top: 15px;
            }

    #chatBot-menu-wrapper.slide-in ul li.plan-info {
        font-size: 14px !important;
        font-weight: 400 !important;
        cursor: default;
        height: auto;
    }

        #chatBot-menu-wrapper.slide-in ul li.plan-info .user-link:hover,
        #chatBot-menu-wrapper.slide-in ul li.plan-info .user-link {
            font-size: 14px !important;
            font-weight: 400 !important;
            text-decoration: underline;
            color: #4D82B1 !important;
            text-transform: capitalize;
            cursor: pointer;
        }


#user-menu-mask.selection-mask:not(.visible) {
    display: none;
}

#chatBot-menu-wrapper p {
    overflow-wrap: break-word;
    margin-bottom: 1rem;
}

#chatBot-menu-mask.selection-mask:not(.visible) {
    display: none;
}

#frameContainer.fade-in {
    animation: fadeInAnimation ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

#frameContainer.fade-out {
    animation: fadeOutAnimation ease 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}


@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOutAnimation {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

##settings-bot.slide-in {
    visibility: visible;
    opacity: 0;
    display: flex;
    flex-direction: row;
    top: 10px;
    z-index: 99;
    animation-name: user-menu-in-animation;
    animation-fill-mode: forwards;
    animation-duration: 150ms;
    animation-delay: 0ms;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
}

.hover-effect img.image-main {
    height: 26px !important;
    width: 26px !important;
}

/*Thomson reuters*/

#migrateBannerContainer {
    z-index: 3;
    width: 100%;
    position: fixed;
    left: 188px;
    top: 50px;
    height: 55px;
    background-color: #F8E71C;
    color: #444444;
}

    #migrateBannerContainer.nav-bar-collapsed {
        left: 58px !important;
    }

.marginTop105 {
    margin-top: 105px !important;
}

.marginTop45 {
    margin-top: 45px !important;
}

#migrateToLawLink {
    color: #F8E71C !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: center !important;
}

#closeBannerThomson {
    height: 10px;
    width: 10px;
}

#migrateContent {
    font-size: 14px !important;
    font-weight: 600 !important;
    padding-left: 40px !important;
    width: 70% !important;
}

.hideImportant {
    display: none !important;
}
/* MainNavigationVertical */

/* Quick Search */
#quick-search-container {
    margin-right: 20px;
}

    #quick-search-container .qs-search-row {
        clear: both;
    }

    #quick-search-container .qs-search-button .qs-btn {
        display: inline-block;
        margin-bottom: 0;
        font-size: 14px;
        color: #fff;
        text-align: center;
        text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
        vertical-align: middle;
        cursor: pointer;
        width: 26px;
        margin: 0px;
        height: 26px;
        border: 0px;
    }

        #quick-search-container .qs-search-button .qs-btn i {
            display: inline-block;
            width: 14px;
            height: 14px;
            margin-top: 1px;
            *margin-right: .3em;
            line-height: 14px;
            vertical-align: text-top;
            background-image: url("../../img/glyphicons-halflings.png");
            background-position: 14px 14px;
            background-repeat: no-repeat;
        }

    #quick-search-container .qs-search-form {
        position: absolute;
        padding: 19px;
        margin-bottom: 20px;
        background-color: #ffffff;
        border: 1px solid #000000;
        padding: 0px;
        display: none;
        z-index: 2001; /*ie7 fix*/
        min-height: 40px;
        line-height: 40px;
        box-sizing: border-box;
        box-shadow: rgb(0 0 0 / 15%) 0px 15px 15px;
        text-align: left;
        color: #000 !important;
    }

        #quick-search-container .qs-search-form .qs-nav a {
            color: #000 !important;
        }

        #quick-search-container .qs-search-form .qs-search-input {
            font-size: 12px;
            z-index: 80; /*ie7 fix*/
            width: 445px !important; /*ie7 fix*/
            padding-top: 2px;
        }

        #quick-search-container .qs-search-form input[type='text'] {
            width: 360px;
            font-size: 12px;
            display: block; /*ie7 fix*/
            float: left; /*ie7 fix*/
        }

@-moz-document url-prefix() {
    #quick-search-container .qs-search-form input[type='text'] {
        width: 358px;
    }
}

#quick-search-container .qs-search-form input[type='checkbox'] {
    margin: 0px 0px 4px 4px;
}

#quick-search-container .qs-search-form .qs-result-container {
    display: none;
    position: relative;
    width: 436px; /*ie7 fix*/
    margin-left: 5px;
    margin-right: 5px;
}

    #quick-search-container .qs-search-form .qs-result-container .qs-result-list {
        font-size: 10px;
        line-height: 14px;
        height: 300px;
        overflow-y: auto;
        margin-top: 15px;
        position: relative; /*ie7 fix*/
        width: 100%; /*ie7 fix*/
    }

        #quick-search-container .qs-search-form .qs-result-container .qs-result-list a.qs-itemDisabled {
            display: block;
            clear: left;
            height: auto;
            text-decoration: none;
            background-color: #eeeeee;
        }

        #quick-search-container .qs-search-form .qs-result-container .qs-result-list ul {
            padding: 0;
            margin: 0px 0px 0px 0px;
            height: auto;
        }

        #quick-search-container .qs-search-form .qs-result-container .qs-result-list .qs-nav-header a {
            font-size: 12px;
            font-weight: 400;
            color: #000000;
            padding: 0;
            margin: 0;
            height: 25px;
            line-height: 25px;
            padding-left: 10px;
            text-align: left;
        }

            #quick-search-container .qs-search-form .qs-result-container .qs-result-list .qs-nav-header a:hover {
                text-decoration: none;
                background-color: transparent;
            }

        #quick-search-container .qs-search-form .qs-result-container .qs-result-list > span.qs-item {
            padding: 8px 15px;
            display: block;
            font-size: 12px;
            font-weight: 300;
            text-align: left;
        }

        #quick-search-container .qs-search-form .qs-result-container .qs-result-list > li > a.qs-item {
            font-size: 12px;
            text-decoration: underline;
            display: block;
            margin: 0;
            padding: 0;
            color: #4793D9 !important;
            text-align: left;
            padding-left: 10px;
            height: auto !important;
            height: 30px;
            line-height: 30px;
            border-bottom: 1px solid #BBBDC0;
        }

            #quick-search-container .qs-search-form .qs-result-container .qs-result-list > li > a.qs-item:last-child {
                border-bottom: 0 !important;
            }

            #quick-search-container .qs-search-form .qs-result-container .qs-result-list > li > a.qs-item:hover {
                color: #0F77D7 !important;
            }

            #quick-search-container .qs-search-form .qs-result-container .qs-result-list > li > a.qs-item:hover {
                /*text-decoration: none;
                        background-color: #0088cc;
                        color: white;
                        font-weight: bold;*/
            }

        #quick-search-container .qs-search-form .qs-result-container .qs-result-list > li > a.qs-itemDisabled {
            padding: 8px 15px;
            font-size: 14px;
            color: rgb(134, 134, 134);
            display: block;
            font-size: 14px;
            text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
        }

            #quick-search-container .qs-search-form .qs-result-container .qs-result-list > li > a.qs-itemDisabled:hover {
                text-decoration: none;
                background-color: #0088cc;
                color: white;
                font-weight: bold;
            }

#quick-search-container input[type="text"] {
    display: inline-block;
    height: 24px;
    padding: 4px 4px;
    --margin-bottom: 10px;
    line-height: 24px;
    color: #D1D2D4;
    font-size: 12px;
    vertical-align: middle;
    background-color: #ffffff;
    border: 1px solid #939597;
    margin:5px;
}

#quick-search-container .qs-search-form .qs-search-input .qs-input-append {
    --margin-top: 5px;
    --margin-left: 5px;
    display: flex;
    align-items: center;
}

    #quick-search-container .qs-search-form .qs-search-input .qs-input-append input {
        line-height: 1em;
        margin-right: 2px;
        height: 24px;
        display: block;
    }

    #quick-search-container .qs-search-form .qs-search-input .qs-input-append .qs-add-on:last-child,
    #quick-search-container .qs-search-form .qs-search-input .qs-input-append .qs-btn:last-child {
        -webkit-border-radius: 0 4px 4px 0;
        -moz-border-radius: 0 4px 4px 0;
        border-radius: 0 4px 4px 0;
    }

.qs-nav {
    margin-bottom: 0px;
    margin-left: 0px;
    padding-left: 0px;
    list-style: none;
}

    .qs-nav li {
        float: none !important;
        height: auto !important;
        margin: 0;
        padding: 0;
    }

.qs-nav-list {
    padding-right: 0px;
    padding-left: 0px;
    margin-bottom: 0px;
    margin-top: 0px;
}

.qs-nav-header {
    display: block;
    padding: 3px 15px;
    font-size: 11px;
    font-weight: bold;
    line-height: 20px;
    color: #999999;
    text-transform: uppercase;
    padding: 0px;
    font-size: 11px;
    font-weight: normal;
    text-transform: none;
}

.qs-navbar {
    *position: relative;
    margin-bottom: 20px;
    overflow: visible;
    margin-bottom: 0px;
}

.qs-navbar-inner {
    background-color: #E6E7E8;
    padding-left: 0px;
    min-height: 0px;
    border-right-width: 0px;
    border-left-width: 0px;
}

#qs-button-search {
    height: 24px;
    top: -12px;
    left: -6px;
    margin-right: 5px !important;
    display: inline-block;
}

/* Position Fix to avoid z-Index issues */
.ie7 .RadScheduler .rsTopWrap, .ie7 .rsContentScrollArea, .ie7 .rsHeader, .ie7 .rsInnerFix {
    position: static !important;
}

.deletable::-ms-clear {
    display: none;
}

div.deleteicon {
}

    div.deleteicon div {
        position: absolute;
        display: none;
        top: 7px;
        right: 6px;
        width: 16px;
        height: 16px;
        z-index: 1;
        background: url("../img/../clear-icon.png");
        cursor: pointer;
    }

.qs-nav-header.qs-category {
    height: auto;
}

.qs-search-button.active {
}

input[type="text"]:active,
input[type='password']:active,
input[type="text"]:focus,
input[type='password']:focus,
textarea:active,
textarea:focus,
input[type="tel"]:active,
input[type="tel"]:focus {
    border: 1px solid #F48120;
    box-shadow: none !important;
    border-color: var(--orangeColor) !important;
    resize: none;
    outline: none;
}

.legacy_ctrl_btn {
    background-color: #939597;
    height: 24px;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 400;
    font-style: normal;
    color: #FFFFFF;
    border: 0px;
    min-width: 70px;
    margin-right: 5px;
    margin-left: 0;
    padding: 0 15px;
    cursor: pointer !important;
}

#quick-search-container.search svg.icon {
    fill: #fff;
    height: 26px;
    width: 26px;
    top: 1px;
    background: none;
}

    #quick-search-container.search svg.icon:hover {
        fill: #BABABA;
    }

#quick-search-container.search .qs-search-row.active svg.icon,
#quick-search-container.search .qs-search-row.active svg.icon:hover {
    fill: #fff;
}

/* Quick Search */

/* SettingsMenu */
div.settings-icon {
    width: 20px;
    height: 20px;
    font-size: 19px;
    cursor: pointer;
    color: var(--mainNavigationBackground);
    right: 15px;
    position: relative;
    z-index: 100;
    top: 0;
}

    div.settings-icon.customized {
        color: #D0021B;
    }

div.settings-menu {
    width: 205px;
    background-color: #E6E7E8;
    box-shadow: 0 2px 4px 2px rgb(68 68 68 / 50%);
    padding: 5px 20px 15px 20px;
    position: absolute;
    z-index: 2;
    right: 27px;
    top: 17px;
    border-radius: 2px;
    display: none;
    text-align: left;
}

    div.settings-menu .checkboxEntries,
    div.settings-menu .checkbox {
        display: inline-block;
        width: 13px;
        font-size: 12px;
        cursor: pointer;
        color: var(--mainNavigationBackground);
    }

    div.settings-menu span {
        font-size: 12px;
        font-weight: 600;
        cursor: pointer;
    }

        div.settings-menu span.title {
            cursor: default;
            display: inline-block;
            margin-bottom: 10px;
        }

    div.settings-menu .visible {
        background-color: red;
        display: inline-block;
        width: 20px;
        height: 20px;
    }

.settings-row {
    display: block;
    line-height: 20px;
    cursor: pointer;
}

div.True {
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

div.False {
    display: none;
}

@keyframes settings-menu-in-animation {
    0% {
        opacity: 0;
        visibility: visible;
        top: 10px;
    }

    100% {
        opacity: 1;
        top: 17px;
    }
}

div.settings-menu.slide-in {
    visibility: visible;
    opacity: 0;
    display: block;
    top: 10px;
    animation-name: settings-menu-in-animation;
    animation-fill-mode: forwards;
    animation-duration: 200ms;
    animation-delay: 0ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
}

.link-list.horizontal {
    display: inline-block;
    margin-right: 40px;
    margin-top: 5px;
}

    .link-list.horizontal .link-container {
        display: inline-block;
        border-right: 1px solid var(--mainNavigationBackground);
        padding: 0 10px;
    }

        .link-list.horizontal .link-container:last-child {
            display: inline-block;
            border-right: none;
        }

        .link-list.horizontal .link-container .link-button {
            color: #4793d9;
            font-size: 12px;
            cursor: pointer;
            text-decoration: underline;
        }

            .link-list.horizontal .link-container .link-button:hover {
                text-decoration: underline;
            }

            .link-list.horizontal .link-container .link-button.active:hover,
            .link-list.horizontal .link-container .link-button.active {
                color: var(--mainNavigationBackground);
                text-decoration: none;
                cursor: default !important;
            }

/* SettingsMenu */

/* Sticky Content */
#externalMenu div.app-header, #externalMenu div.app-header:hover, div.app-header,
#navTopLink {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
}

#sidebar {
    position: fixed;
    top: 50px;
    left: 0;
    overflow-y: auto;
    height: calc(100vh - 50px);
    z-index: 3;
}

    #sidebar.nav-bar-collapsed.show-menu {
        overflow: initial;
    }

.footerEb.vertical > .container-fluid {
    padding-left: 210px;
}

.nav-bar-collapsed ~ .footerEb.vertical > .container-fluid {
    padding-left: 80px;
}

/* width */
#sidebar::-webkit-scrollbar {
    width: 8px;
}

/* Track */
#sidebar::-webkit-scrollbar-track {
    background: rgb(0 0 0 / 0.00);
}

/* Handle */
#sidebar::-webkit-scrollbar-thumb {
    background: rgb(109 109 109 / 0.80);
    width: 8px;
}

    /* Handle on hover */
    #sidebar::-webkit-scrollbar-thumb:hover {
        background: rgb(94, 94, 94);
    }

.app-padding {
    padding-left: 240px !important;
    padding-top: 0px !important;
}


.vertical .body_contentOut > div.container {
    padding-left: 245px !important;
    padding-top: 70px !important;
}

#externalMenu div.help_content, div.help_content {
    top: 50px;
    position: fixed;
}

.nav-bar-collapsed ~ .app-padding {
    padding-left: 110px !important;
    padding-top: 0 !important;
}

.widget-modal-overlay {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: lightgray;
    z-index: 4;
}

.n_Wizard_Set_OverTime_Timer_Rectangle
.n_Wizard_Add_User_rectangle {
    box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px !important;
}

/* Sticky Content */

/* Achievement Notifications */
.achievement-notifications-icon {
    background-image: url('../images/notifications/achievement-no-notifications.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center 1px;
    width: 26px;
    height: 26px;
    position: relative;
    cursor: pointer;
    margin-right: 20px;
}

    .achievement-notifications-icon.unread {
        background-image: url('../images/notifications/achievement-notifications.svg');
    }

.calendar-event-notification-icon {
    background-image: url(../images/notifications/achievement-notifications.svg);
    width: 27px !important;
    height: 39px !important;
    margin-top: 0px !important;
}

.achievement-notifications-icon #badgecount-unread {
    display: none;
}

.achievement-notifications-icon.unread #badgecount-unread {
    display: block;
}

#badgecount-unread {
    width: 20px;
    height: 20px;
    background-color: white;
    position: absolute;
    top: -4px;
    right: -9px;
    border-radius: 50%;
    overflow: hidden;
    color: #444444;
    font-family: "Open Sans";
    font-size: 11px;
    letter-spacing: 0;
    text-align: center;
    padding-top: 0px;
    box-sizing: border-box;
    font-weight: 800;
    line-height: 20px;
}

#badgeList {
    width: 340px;
    /*width: 385px;*/
    background-color: #5C5C59;
    box-shadow: 0 2px 4px 2px rgb(68 68 68 / 50%);
    position: absolute;
    z-index: 40000;
    top: 38px;
    display: none;
    cursor: default;
    transition: all 0.5s ease-in-out;
    opacity: 0;
}

@keyframes showAnimation {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#badgeList.show {
    display: block;
    opacity: 1;
    animation-name: showAnimation;
    animation-duration: 150ms;
    animation-iteration-count: 1;
    border-radius: 2px;
}

#badgeList .title {
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 24px;
    letter-spacing: 0;
    line-height: 33px;
    text-align: left;
    padding-left: 10px;
    padding-top: 10px;
    font-weight: 400;
}

#toggleAchievementNotificationOptions {
    background-image: url('../images/notifications/hamburger.svg');
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    width: 15px;
    height: 16px;
    position: absolute;
    right: 15px;
    top: 18px;
    cursor: pointer;
}

#achievementNotificationOptions {
    background-color: #5C5C59;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.5);
    position: absolute;
    left: 0;
    right: 0;
    top: 53px;
    height: 60px;
    transition: all 0.25s ease-in-out;
    overflow: hidden;
    z-index: 10000;
}

    #achievementNotificationOptions.show {
        height: 80px;
    }

    #achievementNotificationOptions a {
        color: #FFFFFF !important;
        font-family: "Open Sans";
        font-size: 14px;
        letter-spacing: 0;
        line-height: 19px;
        display: block;
        margin: 3px 0px;
        height: auto;
        padding: 2px 10px;
        font-weight: 400;
    }

        #achievementNotificationOptions a:hover {
            background-color: #7A7A7A;
            color: #FFFFFF;
        }

#externalMenu div.app-header #achievementNotificationOptions a, div.app-header #achievementNotificationOptions a {
    color: #FFFFFF !important;
    font-family: "Open Sans";
    font-size: 14px;
    letter-spacing: 0;
    line-height: 19px;
    display: block;
    margin: 3px 0px;
    height: auto;
    padding: 2px 10px;
    font-weight: 400;
}

    #externalMenu div.app-header #achievementNotificationOptions a:hover, div.app-header #achievementNotificationOptions a:hover {
        background-color: #7A7A7A;
        color: #FFFFFF;
    }

#badgeList .scrollable {
    max-height: 465px; /*before max-height: 624px;*/
    overflow-x: auto;
    margin-top: 11px;
}

#badgeList table {
    border-collapse: collapse;
    width: auto;
    vertical-align: bottom;
}

#badgeList th,
#badgeList tr,
#badgeList td,
#badgeList tbody,
#badgeList table {
    vertical-align: bottom;
}

    #badgeList table tr {
        opacity: 1;
        transform: scale(1);
        transition: opacity 0.5s ease-in;
        animation-name: newNotificationAnimationIn;
        animation-duration: 0.25s;
        animation-iteration-count: 1;
        cursor: pointer;
        display: flex;
    }

        #badgeList table tr.hide {
            opacity: 0;
            transform: scale(0.9);
            animation-name: newNotificationAnimationOut;
            animation-duration: 0s;
            animation-iteration-count: 1;
        }

        #badgeList table tr td {
            color: #FFFFFF;
            font-family: "Open Sans";
            font-size: 13px;
            font-weight: 600;
            letter-spacing: 0;
            line-height: 17px;
            text-align: left;
            padding-top: 16px;
            border-bottom: 1px solid #BBBBBB;
            max-width: 280px;
            /*width: 280px;*/
            height: 60px;
            display: inline-block;
            position: relative;
            box-sizing: content-box;
            padding-right: 5px;
        }

            #badgeList table tr td:first-child {
                margin-left: 5px;
                /*width: 50px;*/
                min-width: 50px;
                text-align: center
            }

            #badgeList table tr td:last-child {
                width: 15px;
            }

            #badgeList table tr td .time-ago {
                color: #F48120;
            }

            #badgeList table tr td .unread {
                background-color: #F48120;
                border-radius: 50%;
                width: 15px;
                height: 15px;
                margin-top: 19px;
                position: absolute;
                right: 5px;
            }

    #badgeList table .icon {
        display: inline-block;
        background-repeat: no-repeat;
        background-size: cover;
        width: 50px;
        height: 50px;
    }

        #badgeList table .icon.achievement {
            background-image: url('../images/notifications/achievement-notifications.svg');
            width: 27px;
            height: 39px;
            margin-top: 5px;
        }

.no-achievement-notifications {
    text-align: center;
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0;
    height: 60px;
}

    .no-achievement-notifications a {
        text-decoration: underline !important;
        font-size: 14px !important;
        font-weight: 300 !important;
    }

    .no-achievement-notifications p {
        margin: unset !important;
    }

/* Achievement Notifications */

/* SyncMenu */
.sync-status-table {
    position: absolute;
    top: 40px;
    padding-right: 10px;
    background-color: #ffffff;
    box-shadow: 0 2px 4px 2px rgb(0 0 0 / 50%);
    z-index: 99;
    width: 640px;
    right: 20px;
    padding: 0;
    border-radius: 2px;
    display: none;
    color: var(--headerForeground);
}

@keyframes sync-menu-in-animation {
    0% {
        opacity: 0;
        visibility: visible;
        top: 30px;
    }

    100% {
        opacity: 1;
        top: 38px;
    }
}

.sync-status-table.slide-in {
    visibility: visible;
    opacity: 0;
    display: block;
    top: 10px;
    animation-name: sync-menu-in-animation;
    animation-fill-mode: forwards;
    animation-duration: 200ms;
    animation-delay: 0ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
}

.syncStatusOpen {
    opacity: 1;
    top: 38px;
    display: block;
}

#sync-menu-component {
    position: relative;
    display: inline-block;
    min-width: 125px;
}

    #sync-menu-component .menu-title {
        color: #fff !important;
        text-decoration: none;
        font-weight: 600;
        font-size: 16px;
        margin-right: 30px;
        cursor: pointer;
    }

        #sync-menu-component .menu-title:hover {
            opacity: 0.5;
        }

        #sync-menu-component .menu-title::after {
            content: '';
            display: inline-block;
            background-image: url('../images/arrow-down-light.svg');
            background-repeat: no-repeat;
            background-position: center 1px;
            background-size: 12px;
            width: 12px;
            height: 12px;
            margin-left: 10px;
        }

        #sync-menu-component .menu-title.opened::after {
            transform: rotate(180deg);
            background-position: center -1px;
        }


.sync-status-table table thead th {
    background-color: #D8D8D8;
    text-align: left;
    padding: 10px;
    font-size: 12px;
    font-weight: 600;
}

.title {
    min-height: 25px;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.sync-status-table table tbody td {
    text-align: left;
    padding: 10px;
    font-size: 12px;
}

.sync-status-table table tbody tr {
    border-bottom: 1px solid #D8D8D8;
}

    .sync-status-table table tbody tr:last-child {
        border-bottom: none;
    }

td.integrationStatus a {
    font-weight: 400;
}

td.status_1 a:hover,
td.status_1 a,
td.status_1 a > i:hover,
td.status_1 a > i {
    color: #ED1C24 !important;
    text-decoration: underline;
    font-size: 12px;
}

td.status_0 a:hover,
td.status_0 a,
td.status_0 a > i,
td.status_2 a:hover,
td.status_2 a,
td.status_2 a > i {
    color: #2484c6 !important;
    text-decoration: underline;
    font-weight: 600;
}

td.integrationStatus a > i:hover,
td.integrationStatus a > i {
    text-decoration: none;
    margin-right: 5px;
}

td.integrationStatus,
td.integrationName {
    width: 110px;
    vertical-align: baseline;
}

td.integrationDate {
    width: 175px;
    vertical-align: baseline;
}

td.integrationQueue {
    vertical-align: baseline;
}

td.integrationButton {
    width: 135px;
    padding: 10px 0 10px 0 !important;
}

.integrationButton button {
    border-radius: 2px;
}

.syncing {
    background-image: url('../images/icon_syncing.gif');
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    background-position: center;
    background-size: contain;
    width: 100%;
}

/* Sync Menu */

/* Demo Account */

.entry-window2 {
    margin: 20px;
    padding: 10px;
    width: 500px;
    position: fixed;
    overflow: hidden;
    top: 35%;
    left: 50%;
    margin-left: -250px;
    margin-top: -120px;
    z-index: 1050;
    background-color: #ffffff;
    box-sizing: content-box;
}

.modalBackground2 {
    background-color: rgba(0,0,0,0.5);
    filter: alpha(opacity=90);
    opacity: 0.9;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: fixed;
    z-index: 4;
}

.demo-button {
    height: 34px;
    width: 220px;
}

.try-our-demo {
    height: 15px;
    width: 136px;
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 15px;
    text-align: center;
}

    .try-our-demo:hover, .lev-button-gray-regular-button-ora:hover, .button-gray-regular-button-ora:hover, .exit-playground-rectangle:hover {
        background-color: #E87A1E !important;
    }

.demo-rectangle {
    height: 34px;
    width: 220px;
    border-radius: 3.35px;
    background-color: #F48120;
    box-shadow: 0 1px 3px 0 #444444;
}

.try-our-demo2 {
    height: 15px;
    /*width: 109px;*/
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 15px;
    text-align: center;
}

.demo-is-available-fo {
    height: 15px;
    /*width: 197px;*/
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 12px;
    letter-spacing: 0;
    line-height: 15px;
    text-align: center;
}

.rectangle-popup {
    height: 393px;
    width: 500px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 4px 0 #444444;
    top: 25%;
    left: 35%;
    position: fixed;
    padding: 25px;
    z-index: 4;
}

.youre-about-to-ente {
    /*height: 24px;*/
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    padding-bottom: 20px;
    /*text-align: left;*/
}

.see-how-time-tracker {
    /*height: 255px;*/
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 12px;
    letter-spacing: 0;
    line-height: 17px;
    padding-bottom: 20px;
}

.button-gray-regular {
    height: 24px;
    width: 231px;
}

.button-gray-regular-button-ora {
    height: 24px;
    width: 168px;
}

.legalChangeModal {
    margin: 20px;
    position: absolute;
    overflow: hidden;
    top: 47%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 4;
    background-color: #ffffff;
}

.bg-gray {
    background-color: #939597;
    margin-right: 20px;
}

ul {
    list-style-position: inside;
    list-style: none;
}

#demo-ul > li:before {
    content: "•";
    color: #000000;
    text-shadow: #000000 0 0 0px;
    margin: 0px;
}

.fill-1 {
    height: 24px;
    width: 231px;
    background-color: #939597;
    margin-right: 10px;
}

.fill-2 {
    height: 24px;
    width: 168px;
    background-color: #F48120;
}

.demo-cancel {
    height: 30px;
    color: #FFFFFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 16px;
    text-align: center;
    border-radius: 5px;
    border: none;
}

.wid-143 {
    width: 143px;
}

.wid-206 {
    width: 206px;
}

.rectangle-dark-bar {
    height: 16px;
    width: 450px;
    background-color: #F48120;
}

.populating-sample-w {
    height: 24px;
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
}

.populate-rectangle {
    height: 141px;
    width: 500px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 4px 0 #444444;
}

.bg-yellow {
    background-color: yellow;
}

.h-100-px {
    height: 100px !important;
}

.you-are-in-the-time {
    height: 15px;
    width: 457px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0;
    /*line-height: 15px;*/
    text-align: center;
    padding-top: 0px !important;
    margin-top: 14px !important;
}

.exit-playground-rectangle {
    height: 34px;
    width: 180px;
    border-radius: 3.35px;
    background-color: #F48120;
    box-shadow: 0 1px 3px 0 #444444;
    /*margin-top: 15px;*/
    cursor: pointer;
}

.exit-playground {
    color: rgb(255, 255, 255);
    font-family: "Open Sans";
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0px;
    line-height: 15px;
    text-align: center;
    /* height: 15px; */
    /* width: 151px; */
    background-color: transparent;
    border: none;
    padding: 8.5px 10.5px 5.5px 12.5px;
}

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

.use-the-playground-t {
    height: 102px;
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 12px;
    letter-spacing: 0;
    line-height: 17px;
}

.rectangle-light-bar {
    height: 16px;
    width: 450px;
    background-color: #FEE8D6;
}

.ml-0-px {
    margin-left: 0px !important;
}

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

.welcome-to-your-time {
    /*height: 24px;*/
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    padding-bottom: 20px;
}

.wel-rectangle {
    height: 240px;
    width: 500px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 4px 0 #444444;
    top: 35%;
    position: fixed;
    left: 35%;
    z-index: 4;
    padding: 25px;
}

.wel-button-gray-regular {
    height: 24px;
    width: 70px;
}

.lev-rectangle {
    height: 155px;
    width: 500px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 4px 0 #444444;
    top: 35%;
    position: fixed;
    left: 35%;
    z-index: 4;
    padding: 25px;
}

.youre-about-to-leav {
    /*height: 24px;*/
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
}

.well-save-any-chang {
    /*height: 17px;*/
    width: 450px;
    color: #444444;
    font-family: "Open Sans";
    font-size: 12px;
    letter-spacing: 0;
    line-height: 19px;
}

.lev-button-gray-regular-button-ora {
    height: 24px;
    width: 131px;
}

.lev-button-gray-regular {
    height: 24px;
    width: 70px;
}
/* Demo Account */

/* Input Field Styles */

.input-wrapper {
    margin-bottom: 1rem;
    position: relative;
}

.input-wrapper label {
    font-family: var(--font-base);
    font-weight: 600;
    font-size: var(--font-size-base);
    color: var(--color-label);
    display: block;
    margin-bottom: 4px;
}

.input-wrapper label.required::after {
    content: '*';
    color: var(--color-error);
    margin-left: 2px;
}

input[type="text"]:not(#recurWeekTextBox):not(#taxTextBox):not(#totalVal):not(.filter-textbox):not(#txtCommission):not(#txtFrom_DateRange):not(#txtTo_DateRange):not(#txtNameCustomization):not(.dx-texteditor-input):not(.x-form-text-default):not(#costTextBox):not(#qtyTextBox):not(#markupRatioTextBox):not(#recurDailyTextBox):not(#monthlyDayTextBox):not(#monthlyMonthTextBox):not(#monthlyNoMonths):not(#addExpenseDate):not(#addExpenseFormContainer input[type="text"]):not(#mainwell input[type="text"]):not(.userGroupPopup #searchUser):not(.select2-search input[type="text"]):not(#custom_fields input[type="text"]),
input[type="text"].filterDate,
input[type="tel"],
input[type="number"],
input[type="email"],
#userNameTextBox,
#EmailTextBox,
#firm-info-panel input[type="text"],
#minimumAmount,
#invNo,
#txtEmail,
#txtPassword,
#currentPasswordTextBox,
#newPasswordTextBox,
#retypeNewPasswordTextBox,
#daysPastDue_Inv,
#InvoiceAmt {
    height: var(--input-height) !important;
    border-radius: var(--input-radius);
    border: 1px solid var(--color-border);
    color: var(--color-label);
    padding: 0 10px;
    font-family: var(--font-base);
    font-size: var(--font-size-base);
    --width: 100%;
    background: var(--color-input-bg);
}

textarea:not(#txtEmailTo):not(#descTextBox):not(.detailcontainer textarea):not(.row-report textarea):not(:disabled):not([readonly]) {
    border-radius: var(--input-radius) !important;
    border: 1px solid var(--color-border);
    color: var(--color-label) !important;
    padding: 12px;
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    background: var(--color-input-bg) !important;
}

#txtComments {
    padding: 6px 12px !important;
}

.report_right textarea:not(#txtEmailTo):not(#reportNotes) {
    border-radius: inherit !important;
    font-size: 14px !important;
    padding: 5px !important;
    border: 0.85px solid #444444 !important;
}

.report_right .asterisk-red {
    color: #EF4F25 !important;
}

.entryContainer input[type="text"]:not(#recurWeekTextBox):not(#taxTextBox):not(#totalVal),
.entryContainer input[type="tel"] {
    height: var(--input-height) !important;
    border-radius: var(--input-radius);
    border: 1px solid var(--color-border);
    padding: 0 12px;
    font-family: var(--font-base);
    font-size: var(--font-size-base);
    background: var(--color-input-bg);
}

.entry_desc textarea:not(#descriptionTE) {
    height: var(--input-height) !important;
    border-radius: var(--input-radius);
    border: 1px solid var(--color-border);
    padding: 0 12px;
    font-family: var(--font-base);
    font-size: var(--font-size-base);
}

input[type="text"]:focus:not(.error):not(#recurWeekTextBox):not(#txtNameCustomization):not(.x-form-text-default):not(#costTextBox):not(#qtyTextBox):not(#markupRatioTextBox):not(#recurWeekTextBox):not(#recurDailyTextBox):not(#taxTextBox):not(#monthlyDayTextBox):not(#monthlyMonthTextBox):not(#monthlyNoMonths):not(#yearlyDayTextBox):not(#addExpenseDate):not(#addExpenseFormContainer input[type="text"]):not(#mainwell input[type="text"]):not(.userGroupPopup #searchUser):not(.select2-focused):not(.row-report input[type="text"]):not(#custom_fields input[type="text"]),
#timeexpContentContainer #custom_fields input[type="text"]:focus,
input[type="tel"]:focus:not(.error),
input[type="email"]:focus,
input[type="number"]:focus,
#minimumAmount:focus,
#invNo:focus,
#txtEmail:focus,
#txtPassword:focus,
#currentPasswordTextBox:focus:not(.error),
#newPasswordTextBox:focus:not(.error),
#retypeNewPasswordTextBox:focus:not(.error),
#descriptionTextBox:focus,
#description:focus,
#commentTextBox:focus,
#txtComments:focus,
textarea:not(#descTextBox):not(#txtEmailTo):not(.detailcontainer textarea):not(.row-report textarea):focus,
#daysPastDue_Inv:focus,
#InvoiceAmt:focus {
    outline: none;
    border-color: var(--color-border) !important;
    box-shadow: 0 0 0 1.5px rgba(234, 150, 6, 0.25) !important;
}

input[type="number"]:focus {
    outline: none;
    border-color: var(--color-border) !important;
    box-shadow: 0 0 0 1.5px rgba(234, 150, 6, 0.25) !important;
}

input[type="text"]:focus.error {
    border-color: var(--color-error) !important;
}

input[type="text"]::placeholder,
input[type="tel"]::placeholder {
    color: var(--color-border);
}

input[type="text"]:disabled,
input[type="email"]:disabled,
textarea[disabled]:not(#txtEmailTo),
textarea[readonly] {
    color: var(--color-font-disabled) !important;
    background-color: var(--color-disabled) !important;
    border-color: var(--color-disabled-border) !important;
    cursor: not-allowed !important;
    border-radius: var(--input-radius) !important;
}

input[type="text"].error,
textarea.error,
#currentPasswordTextBox.error,
#newPasswordTextBox.error,
#retypeNewPasswordTextBox.error {
    border-color: var(--color-error) !important;
}

.input-wrapper .error-message {
    font-size: 12px;
    color: var(--color-error);
    margin-top: 4px;
}

.days .hasDatepicker {
    width:100px !important;
}


/* Input size variations */
.input-short {
    max-width: 183px;
}

.input-medium {
    max-width: 408px;
}

.input-long {
    width: 634px;
}

/* Select2 */
.select2-container--default .select2-selection--single:not(#monthlyWeekDropDownList + .select2-container .select2-selection--single):not(#monthlyDayDropDownList + .select2-container .select2-selection--single):not(#accountManagersAdd + .select2-container .select2-selection--single):not(#clientsAdd + .select2-container .select2-selection--single):not(#projectsAdd + .select2-container .select2-selection--single):not(#expenseTypeAdd + .select2-container .select2-selection--single):not(#yearlyMonthDropDownList + .select2-container .select2-selection--single):not(#yearlyWeekDropDownList + .select2-container .select2-selection--single):not(#yearlyDayDropDownList + .select2-container .select2-selection--single):not(#yearlySecondMonthDropDownList + .select2-container .select2-selection--single):not(#ddlReportCustomizations + .select2-container .select2-selection--single):not(.row-report #ddl_DateRange + .select2-container .select2-selection--single):not(#addExpenseFormContainer select + .select2-container .select2-selection--single):not(.row-report #BillableDropDownList + .select2-container .select2-selection--single):not(#cust_client_id + .select2-container .select2-selection--single):not(#cust_user_id + .select2-container .select2-selection--single):not(#cust_list_id + .select2-container .select2-selection--single) {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    line-height: 14px;
    color: var(--color-label) !important;
    border: 1px solid #B1B1B1;
    border-radius: var(--input-radius);
    background: linear-gradient(0deg, #FFFFFF 60%, #F0EFEF 100%);
    height: var(--input-height) !important;
    --display: flex;
    align-items: center;
    box-sizing: border-box;
}

.widgetContainerColumn #ddlProjects + .select2-container .select2-selection--single {
    background: unset !important;
}

.row-report .select2-container--default .select2-selection--single {
    font-size: 12px !important;
    background: transparent !important;
    height: 28px !important;
    display: flex;
    align-items: center;
}

.select2-container .select2-selection--single:not(#monthlyWeekDropDownList + .select2-container .select2-selection--single):not(#monthlyDayDropDownList + .select2-container .select2-selection--single):not(#accountManagersAdd + .select2-container .select2-selection--single):not(#clientsAdd + .select2-container .select2-selection--single):not(#projectsAdd + .select2-container .select2-selection--single):not(#expenseTypeAdd + .select2-container .select2-selection--single):not(#yearlyMonthDropDownList + .select2-container .select2-selection--single):not(#yearlyWeekDropDownList + .select2-container .select2-selection--single):not(#yearlyDayDropDownList + .select2-container .select2-selection--single):not(#yearlySecondMonthDropDownList + .select2-container .select2-selection--single):not(#ddlReportCustomizations + .select2-container .select2-selection--single):not(.row-report #ddl_DateRange + .select2-container .select2-selection--single):not(#addExpenseFormContainer select + .select2-container .select2-selection--single):not(.row-report #BillableDropDownList + .select2-container .select2-selection--single):not(#cust_client_id + .select2-container .select2-selection--single):not(#cust_user_id + .select2-container .select2-selection--single):not(#cust_list_id + .select2-container .select2-selection--single) {
    height: var(--input-height) !important;
    line-height: var(--input-height) !important;
}

.row-report .select2-container .select2-selection--single {
    height: 28px !important;
    line-height: 28px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered:not(#monthlyWeekDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#monthlyDayDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#accountManagersAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#clientsAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#projectsAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#expenseTypeAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlyMonthDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlyWeekDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlyDayDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlySecondMonthDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#ddlReportCustomizations + .select2-container--default .select2-selection--single .select2-selection__rendered):not(.row-report #ddl_DateRange + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#addExpenseFormContainer select + .select2-container--default .select2-selection--single .select2-selection__rendered):not(.row-report #BillableDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#cust_client_id + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#cust_user_id + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#cust_list_id + .select2-container--default .select2-selection--single .select2-selection__rendered) {
    line-height: var(--input-height) !important;
}

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

.select2-container--default .select2-selection--single .select2-selection__arrow:not(#monthlyWeekDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#monthlyDayDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#accountManagersAdd + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#clientsAdd + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#projectsAdd + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#expenseTypeAdd + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#yearlyMonthDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#yearlyWeekDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#yearlyDayDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#yearlySecondMonthDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#ddlReportCustomizations + .select2-container--default .select2-selection--single .select2-selection__arrow):not(.row-report #ddl_DateRange + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#addExpenseFormContainer select + .select2-container--default .select2-selection--single .select2-selection__arrow):not(.row-report #BillableDropDownList + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#cust_client_id + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#cust_user_id + .select2-container--default .select2-selection--single .select2-selection__arrow):not(#cust_list_id + .select2-container--default .select2-selection--single .select2-selection__arrow) {
    height: var(--input-height) !important;
}

.row-report .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 28px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered:not(#monthlyWeekDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#monthlyDayDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#accountManagersAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#clientsAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#projectsAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#expenseTypeAdd + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlyMonthDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlyWeekDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlyDayDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#yearlySecondMonthDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#ddlReportCustomizations + .select2-container--default .select2-selection--single .select2-selection__rendered):not(.row-report #ddl_DateRange + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#addExpenseFormContainer select + .select2-container--default .select2-selection--single .select2-selection__rendered):not(.row-report #BillableDropDownList + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#cust_client_id + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#cust_user_id + .select2-container--default .select2-selection--single .select2-selection__rendered):not(#cust_list_id + .select2-container--default .select2-selection--single .select2-selection__rendered) {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    padding-left: 10px !important;
}

.row-report .select2-container--default .select2-selection--single .select2-selection__rendered,
#divListReports .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-family: var(--font-base) !important;
    font-size: 12px !important;
    color: var(--color-label) !important;
}

.select2-results__option,
.select2-selection__placeholder {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
}

.row-report .select2-results__option,
.row-report .select2-selection__placeholder {
    font-family: var(--font-base) !important;
    font-size: 12px !important;
}
.select2-container--default .select2-selection--single.select2-error {
    border: 1px solid var(--error-border) !important;
}


/* Select2 for daily timesheets */
/*.entry_client .select2-container--default .select2-selection--single {
    border-radius: 4px;
    background: #fff;
    height: 28px !important;
    font-size: 12px !important;
}

.entry_client .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size:12px !important;
    
}*/
/* Select2 for daily timesheets */
@keyframes blink {
    0%, 100% {
        background-color: #3875d7;
    }

    25%, 75% {
        background-color: #ffffff;
    }

    50% {
        background-color: #3875d7;
    }
}

.select2-results__option.blink {
    animation: blink .3s ease;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    background: #F4F4F4 !important;
    border-color: #CCCCCC !important;
    color: #6D6E70 !important;
}

    .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
        color: #6D6E70 !important;
    }

    .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__arrow b {
        border-color: #B1B1B1 transparent transparent transparent !important;
    }


/* Standard Dropdowns */
/*select:not(.ui-datepicker-month):not(.ui-datepicker-year):not(.filter-control):not(.userReportListControl):not(.row-report select):not(#changeWhichInclude)*/
select:not(.ui-datepicker-month):not(.ui-datepicker-year):not(.filter-control):not(.userReportListControl):not(#changeWhichInclude):not(#txtRecureWeeks):not(#txtDayOfMonth):not(#txtEveryMonth1):not(#ddlWeekOfMonth):not(#ddlDayOfWeek):not(#txtEveryMonth4):not(#txtYearDayOfMonth):not(#ddlYearlyMonth):not(#ddlWeekofMonthYear):not(#ddlDayOfWeekYear):not(#Month2):not(#customMonthlySelect):not(.ptoCodes):not(#MessageClientListBox) {
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    line-height: var(--line-height) !important;
    font-weight: 400 !important;
    /*width: 100%;*/
    height: var(--input-height) !important;
    padding: 8px 20px 8px 10px !important;
    border: 1px solid var(--color-border);
    border-radius: var(--input-radius) !important;
    white-space: nowrap;
    text-overflow: ellipsis;
}

select:not(.ui-datepicker-month):not(.ui-datepicker-year):focus {
    outline: none !important;
    box-shadow: none !important;
}
/* Standard Dropdowns */

/* Label */
label:not(#taxableLabel):not(.customCheckBox):not(.redWarningNote):not(.asterisk-red):not(.x-form-cb-label-default):not(.ptoError):not(#PaymentListGrid #LabelDate):not(#mainwell label),
#project_Name,
.row-title span:not(.red_required),
.labelGeneral,
.validatorlabel:not(#recurringDetails .validatorlabel):not(#addExpenseFormContainer .validatorlabel) {
    font-weight: 400;
    color: var(--color-label);
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base);
    margin-bottom: 0;
    padding: 0;
    line-height: 1;
}

#addExpenseFormContainer label {
    font-size:12px !important;
}

.labelGeneral {
    line-height: 1 !important;
}

.labelDetail,
.description{
    font-weight: 400 !important;
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
    font-size: var(--font-size-labeldescription) !important;
    margin-bottom: 0;
    padding: 0;
}

.row-title span:not(.red_required){
    margin-bottom:3px;
}

.pending label,
.approved label {
    font-weight: 600 !important;
    color: var(--color-label) !important;
    font-size: var(--font-size-base) !important;
}

.submitted label {
    color: var(--color-label) !important;
    font-size: var(--font-size-base) !important;
}

#innerGridContent label {
    font-size: 12px !important;
}

span[disabled] {
    --font-size: var(--font-size-base);
}

.div-label {
    margin-top:3px;
}
/* Label */
/* Buttons */
.ctrl_btn {
    background-color: var(--backgroundRegularCancelButton);
    height: var(--button-height);
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base);
    font-weight: 400 !important;
    font-style: normal !important;
    color: var(--buttonFontColor) !important;
    border: 0px !important;
    min-width: 70px !important;
    padding: 0 15px;
    cursor: pointer !important;
    border-radius: var(--input-radius) !important;
    text-align:center;
}

.report_right .ctrl_btn {
    font-size: inherit;
}

.ctrl_btn:nth-child(n+2):not(.bottom_buttons .ctrl_btn:nth-child(n+2)):not(.qs-search-input .ctrl_btn:nth-child(n+2)):not(#repeaterButtons .ctrl_btn:nth-child(n+2)):not(#exportOptions .ctrl_btn:nth-child(n+2)):not(#applyTemplateModal .ctrl_btn:nth-child(n+2)):not(.inline-te-buttons .ctrl_btn:nth-child(n+2)):not(#publishOptions .ctrl_btn:nth-child(n+2)) {
    margin-right: 0px !important;
    margin-left: 7px !important;
}

.ctrl_btn:hover:not(:disabled),
.newEventCancel:hover {
    background-color: var(--backgroundRegularCancelButtonHover);
}

.btn_green {
    background: var(--backgroundRegularGreenButton) !important;
}

.btn_darkBlue {
    background: var(--backgroundRegularDarkBlueButton) !important;
}

.btn_darkBlue:hover{
    background: var(--backgroundHoverDarkBlueButton) !important;
}

.btn_blue:hover {
    background: var(--backgroundHoverIntegrationBlueButton) !important;
}

.btn_green:hover,
.newEventSave:hover {
    background: var(--backgroundHoverGreenButton) !important;
}

.btn_orange {
    background-color: var(--bacgroundOrangeButton) !important;
}

.btn_yellow {
    background-color: var(--backgroundRegularYellowButton) !important;
}

.btn_yellow:hover {
    background: var(--backgroundHoverYellowButton) !important;
}

.btn_orange:hover:not(:disabled),
a.ctrl_btn.orange:hover:not(:disabled),
.btn_import:hover,
.btn_print:hover,
#googleCalendarButton:hover,
#outlookCalendarButton:hover {
    background-color: var(--backgroundHoverOrangeButton) !important;
}

.btn_qbblue:hover,
.ctrl_btn.btn_qbblue:hover {
    background: #187ed2 !important;
}

.btn_green:disabled,
.ctrl_btn.btn_green:disabled {
    background: var(--backgroundDisabledGreenButton) !important;
}

.btn_darkBlue:disabled,
.ctrl_btn.btn_darkBlue:disabled {
    background: var(--backgroundDisabledDarkBlueButton) !important;
}

.btn_yellow:disabled,
.ctrl_btn.btn_yellow:disabled {
    background: var(--backgroundDisabledYellowButton) !important;
}

.btn_red:hover {
    background: var(--backgroundHoverRedButton) !important;
}

.ctrl_btn:not(#btnAchievementsAdd):disabled {
    background: var(--backgroundRegularDisabledButton);
}

#btnAchievement1:disabled {
    background-color: #F48120 !important;
}

#btnAchievement2:disabled {
    background-color: var(--backgroundRegularCancelButton) !important;
}

#btnAchievement3:disabled {
    background-color: #EF4F25 !important;
}

/* Buttons */
/* Calendar */
i.datepicker.icon {
    background-image: url(../images/icons/calendarbtn.svg) !important;
    width: 25px !important;
    height: 25px !important;
    display: block;
    background-size: 25px !important;
    background-repeat: no-repeat;
    position: absolute;
    right: 8px !important;
    top: 5px;
    cursor: pointer;
}

#divDescontainer i.datepicker.icon {
    background-image: url(../images/icons/calendarbtn.svg) !important;
    width: 38px !important;
    height: 38px !important;
    display: block;
    background-size: 38px !important;
    background-repeat: no-repeat;
    position: absolute;
    right: -7px !important;
    top: 5px;
    cursor: pointer;
}

#divPayrollDate i.datepicker.icon {
    background-image: url(../images/icons/calendarbtn.svg) !important;
    width: 38px !important;
    height: 38px !important;
    display: block;
    background-size: 38px !important;
    background-repeat: no-repeat;
    position: absolute;
    right: 8px !important;
    top: 5px;
    cursor: pointer;
}

/* Calendar */

/* Tooltips */
.projectLeadToolTip[data-title]:hover:after {
    content: attr(data-title);
    position: absolute;
    left: 20px;
    width: 270px;
    height: auto !important;
    padding: 5px;
    border: 0;
    background-color: var(--tooltip-bgcolor) !important;
    color: var(--buttonFontColor) !important;
    z-index: 2147000001;
    box-sizing: content-box;
    word-break: break-word;
    white-space: normal;
    text-align: left;
    font-size: var(--tooltip-fontsize);
    border-radius: var(--input-radius);
}

.showHelp:not(#rptCheckboxes .showHelp):not(#totalDiv .showHelp),
.showHelpLeft,
.showHelpRight,
.showHelpQueue {
    display: none;
    position: absolute;
    padding: 5px;
    max-width: 190px !important;
    border: 0;
    background-color: var(--tooltip-bgcolor) !important;
    color: var(--buttonFontColor) !important;
    line-height: 16px;
    z-index: 2147000001;
    box-sizing: content-box;
    font-size: var(--tooltip-fontsize);
    border-radius: var(--input-radius);
    top: 2px;
    left: 12px;
}

#rptCheckboxes .showHelp::after,
#totalDiv .showHelp::after {
    content: none !important;
}

#rptCheckboxes .showHelp {
    background-color: var(--tooltip-bgcolor) !important;
}

#totalDiv .showHelp {
    background-color: var(--tooltip-bgcolor) !important;
    max-width:400px !important;
}
    .showHelp::after {
        content: "";
        position: absolute;
        top: 100%; /* places it below the tooltip */
        left: 50%; /* center horizontally */
        transform: translateX(-50%);
        border-width: 6px;
        border-style: solid;
        border-color: #3a3a3a transparent transparent transparent;
    }

.showHelpLeft22 {
    display: none;
    position: absolute;
    top: 50%;
    left: calc(100% + 10px); /* shows to the right of the icon */
    transform: translateY(-50%);
    padding: 8px 10px;
    max-width: 300px;
    background-color: var(--tooltip-bgcolor, #3a3a3a);
    color: var(--buttonFontColor, white);
    line-height: 16px;
    font-size: 13px;
    border-radius: 6px;
    z-index: 2147000001;
    box-sizing: border-box;
    top:9px;
    left:27px;
}

    /* Arrow pointing from left to tooltip */
    .showHelpLeft::after {
        content: "";
        position: absolute;
        top: 50%;
        left: -11px; /* push outside left edge */
        transform: translateY(-50%);
        border-width: 6px;
        border-style: solid;
        border-color: transparent var(--tooltip-bgcolor, #3a3a3a) transparent transparent;
    }

.showHelpRight::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -11px; /* push outside left edge */
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent transparent var(--tooltip-bgcolor, #3a3a3a);
}

/* New class for tooltip appearing below with arrow pointing up */
/* Styles for the down-pointing tooltip */
.showHelpDown {
    /* Keep existing styles */
    display: none;
    position: absolute;
    padding: 5px;
    border: 0;
    background-color: var(--tooltip-bgcolor) !important;
    color: var(--buttonFontColor) !important;
    line-height: 16px;
    z-index: 2147000001;
    box-sizing: content-box;
    font-size: var(--tooltip-fontsize);
    border-radius: var(--input-radius);
    /* Position below and center */
    top: 24px;
    left: 50%;
    transform: translateX(-50%);
    /* Fix width issues */
    min-width: min-content !important; /* Add minimum width */
    max-width: 200px !important; /* Increase maximum width */
    width: 100px; /* Allow width to adjust to content */
    white-space: normal;
    word-wrap: break-word;
}

    /* Add arrow pointing up */
    .showHelpDown:before {
        content: "";
        position: absolute;
        top: -8px;
        left: 50%;
        transform: translateX(-50%);
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 8px solid var(--tooltip-bgcolor);
    }

.fixdiv_newUi {
    clear:both;
    overflow:inherit;
    padding-top:8px;
}
/* Tooltips */

/* Customs */
.expense_divider {
    margin-right: 12px !important;
 }

#recurWeekTextBox {
    margin-left: 8px;
}

.daily-timesheet input[type="text"] {
    --width: 40px !important;
}

.daily-timesheet-input {
    height: var(--button-height);
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base);
    border-radius: var(--input-radius);
}

.clientDetailsAdd {
    --line-height:22px !important;
}

#divClient h4 {
    line-height: 15px !important;
    font-family: var(--font-base) !important;
    font-size: var(--font-size-h4) !important;
    font-weight: 400 !important;
    --padding-top:26px;
    --margin-bottom:10px !important;
}

#chkCustomClientId {
    padding-top:3px;
}

#addressDetails h4,
.contactDetailsControl h4,
#sys-sett h4,
#lblOvertimeTitle,
#lblAddAlertTitle,
.general-title {
    line-height: 1 !important;
    font-family: var(--font-base) !important;
    font-size: var(--font-size-h4) !important;
    font-weight: 400 !important;
    --padding-top: 26px;
    color: var(--color-label) !important;
    --margin-bottom: 10px !important;
}

.showInfoClient {
    padding-left: 2px;
    padding-top: 4px;
}

.clientInformation .input-panel {
    --margin-top
}

.clientDetailsAdd h4 {
    line-height: 15px !important;
    font-family: var(--font-base) !important;
    font-size: var(--font-size-h4) !important;
    font-weight: 400 !important;
    --padding-top: 26px;
    --margin-bottom: 10px !important;
    color: var(--color-label) !important;
}

#rdbBillabletext_CO,
#rdbBillabletext_CO:disabled,
#rdbNonBillabletext_CO,
#rdbNonBillabletext_CO:disabled{
    font-size: var(--font-size-base) !important;
}

.divRowSpace {
    margin-top:17px !important;
}

#firm-info-panel span {
    font-family: var(--font-base);
    font-size: var(--font-size-base);
    line-height:19px;
}

#firm-info-panel span:not(.Compulsory) {
    color: var(--color-label);
}

.bold {
    font-weight:bold !important;
}

.radioSpace {
    margin-left:70px !important;
}

.error-border {
    border-color: var(--error-border) !important;
}

.search-input .qs-btn {
    top: 10px !important;
}

i.clear.icon {
    right: 38px !important;
    top: 13px !important;
}

.space-between-radios {
    margin-left:70px !important;
}

.space-between-radios-vertical {
    margin-bottom: 12px !important;
    line-height: 0;
}

.filterBox > .searchInputContainer > input[type=text] {
    background-image: url('/firm4.0/Images/locking/Search Icon.svg') !important;
    background-position: right !important;
    background-position-x: 10px;
    background-repeat: no-repeat !important;
    width: 100%;
    font-size: 12px;
    padding-right: 30px !important;
    border: 1px solid #F4882E;
    margin-bottom: 12px;
    margin-right: 7px;
}

.flatFiles .rowb {
    height: 50px;
}

.intl-tel-input .flag-container {
    height: 38px !important;
}

.icon-tooltip {
    padding-left:5px;
}

.fixdiv {
    padding-top:0px !important;
    padding-bottom: 20px !important;
}

.fixdiv12 {
    padding-top: 0px !important;
    padding-bottom: 12px !important;
}

.textboxvalidatorsendEmailNoBold {
    --margin-bottom: 5px;
}

.clientInformation,
#projectDetails,
#activityDetails,
#OtherDetails,
#workerDetails,
#firm-info-panel,
#sys-sett,
#timerMethod,
#timeCardMethod,
.timecard-settings-content {
    margin-top: 26px;
    overflow-x: hidden;
    overflow-y: hidden;
}

.Compulsory {
    line-height:1 !important;
}

div.row-custom-field:nth-child(1) {
    padding-top: 0px !important;
}

#TimesheetSection,
#Schedule,
#Monitoring,
#ProjectManagement,
#Achievements {
    font-size: var(--font-size-base) !important;
    line-height:1.5;
}

.red-text span {
    font-size: var(--tooltip-fontsize) !important;
    color: var(--color-error) !important;
}

#tab-timeMethod,
#tab-timeMethod p,
.timerOptLoad,
#overtimesettings,
.breakOptLoad,
#TimeOffSettings,
#timeoffContentPopup,
#divAssignUser,
#kisok,
#divFacialRecgn,
#TimeCard,
#TimesheetSection,
.schedule-container,
.monitoring-container,
.project-management-container,
.multilevel-container,
.achievements-container,
#startPaymentGateway,
#tab-geo,
#tab-geoLocation,
#tab-fence,
#tab-location {
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
}

.breakOptLoad {
    line-height: 1 !important;
}

.switch-to-time-cards-label {
    color: var(--color-label) !important;
    line-height:1 !important;
    margin-top:0px !important;
    display:block !important;
}

.switch-general-text {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.switch-button-container {
    margin: 20px 0px !important;
}

.if-you-switch-to-tim {
    margin-bottom:0px;
}

h2,
.vertical-tab > div.active {
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
}

.vertical-tab > div {
    font-size: var(--font-size-base) !important;
    max-width: 151px !important;
}

.subtitle {
    font-size: var(--font-size-h4) !important;
    color: var(--color-label) !important;
}

#AlertRuleListTable,
#breakDatatable,
#timeOffCodeTable,
#userListTable,
#workerachievement,
#UserTeams {
    font-size: var(--tooltip-fontsize);
}

.fixdiv-controls {
    padding-bottom:10px;
}

.marginLeftInput {
    margin-left:8px;
}

.administrators-and-m {
    padding-left: 23px;
    width: 935px;
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
    font-size: var(--tooltip-fontsize) !important;
    letter-spacing: -0.16px;
    line-height: 1 !important;
}

#timeoffContentPopup {
    height:auto !important;
}

.enter-initials {
    width:120px;
}

#userGrpList {
    height:533px !important;
}

.buttons-section {
    margin:0px !important;
}

#kioskDeviceTable tbody tr {
    height:60px;
}

.paddingLabelVertical {
    padding-top:7px !important;
}

.clockInOut {
    width:65px !important;
}

.width815tc {
    width:860px !important;
}

.width150tc {
    width:200px !important;
}

.margin-left-7tc {
    margin-left: 11px !important;
}

.margin-left-42tc {
    margin-left: 48px !important;
}

.margin-Left10tc {
    margin-left: 17px !important;
}

.margin-Left42tc {
    margin-left: 46px !important;
}

.width65tc {
    width:65px !important;
}

.topschedule-8 {
    top:-13px;
}

.monitoringNotifications th {
    line-height: 1 !important;
}

.subtitle_lawpay {
    font-size: var(--font-size-h4) !important;
    color: var(--color-label) !important;
    margin-block-start: 0 !important;
    margin-block-end: 0 !important;
    height: fit-content !important;
    line-height: 1 !important;
}

#startPaymentGateway p {
    margin-bottom:0px !important;
}

#tab-geo h4,
#tab-fence h4,
.rulesubtitle,
#lblTitleScreen,
#titleAbbr,
.customize-color-code {
    font-size: var(--font-size-h4) !important;
    line-height: 1 !important;
    color: var(--color-label) !important;
}

.geoEnableDisableMessage {
    margin-bottom: 0px !important;
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
    line-height: initial !important;
}

.geolocation-info{
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
    line-height: 1;
}

.geofence-info {
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    font-family: var(--font-base) !important;
    line-height: initial !important;
}

.redWarningNote {
    font-size: var(--font-size-base) !important;
    color: var(--color-error) !important;
}

.app-padding:not(.ptoError),
h1:not(#projectEstimateSummaryContent h1):not(.app-padding h1):not(.widgetContainerColumn h1), h2, h3, h4, h5, h6,
ul li:not(.select2-results__option--highlighted):not(.select2-highlighted):not(.select2-result-selectable):not(#dropList_Leaderboard_AchievementNames ul li):not(#dropList_CompanyRankings_AchievementNames ul li):not(#user-info-menu-wrapper ul li):not(.row-report + .select2-results__option) {
    color: var(--color-base) !important;
    font-size: var(--font-size-base);
}

#plan-panel li {
    color: inherit !important;
}

.required {
    font-size: var(--tooltip-fontsize) !important;
}

.toggle .labels {
    top: 11px !important;
}

#achievementSettings .achievement,
#achievementTango,
#abbrDiv span,
#autoCmpTxtDiv span,
#changePasswordDiv span:not(.Compulsory):not(.red-text),
#trustAccountUpdatePanel span,
.generalText{
    color: var(--color-base) !important;
    font-size: var(--font-size-base) !important;
}

.auto-sync-title,
.auto-sync-desc,
.your-scheduled-sync,
.repeat-settings {
    color: var(--color-base) !important;
}

.rulesubdesc #clockInTime,
.rulesubdesc #clockOutTime,
.rulesubdesc #workAnniversaryTerm {
    width: 110px !important;
}

.rulesubdesc #txtClockInTime,
.rulesubdesc #txtClockOutTime,
.rulesubdesc #txtAtleastTimeHours,
.rulesubdesc #txtNoMoreTimeHours {
    width: 60px !important;
}

#achievementReward #grdMyEntries_wrapper {
    overflow: visible !important;
}

.report_right,
.report_right label{
    font-size: 12px !important;
}

.daily-timesheet .w-row > div.day > input {
    color: var(--color-base) !important;
    padding: 0px !important;
}

.daily-timesheet input.pendingEntry,
.daily-timesheet div.w-row > div.day > input.pending {
    border-color: orange !important;
}

.daily-timesheet input.submitted,
.daily-timesheet div.w-row > div.day > input.submitted {
    border-color: blue !important;
}

.daily-timesheet input.approvedEntry,
.daily-timesheet div.w-row > div.day > input.approved {
    border-color: green !important;
}

.daily-timesheet div.w-row > div.day > input.rejected {
    border-color: #d0021b !important;    
}

.datefield-container .ui-datepicker-trigger {
    width: 38px !important;
    height: 38px !important;
    margin-left: 8px !important;
    margin-top: -8px !important;
}

.validations {
    font-size: 12px !important;
}

.local-styles .inline-placeholder > .availableText {
    padding-top: 9px !important;
}

.user-buttons {
    display: flex;
}

.local-styles .save-button {
    margin-top:0px !important;
}

.local-styles .cancel-button,
.local-styles .save-button {
    font-size: var(--font-size-base) !important;
}

.datepicker-component {
    width: 138px;
}

#exportOptions .btn_white,
#publishOptions .btn_white {
    color: var(--color-base) !important;
}

#exportOptions .ctrl_btn,
#publishOptions .ctrl_btn {
    margin-right: 0px !important;
    margin-left: 0px !important;
    border-radius: 0px !important;
}

#exportOptions > .btn_white:hover,
#publishOptions > .btn_white:hover {
    border-radius: 0px !important;
}

.templateModal p,
#simpleAlert,
.colorWrapper p,
#lblSetAs {
    color: var(--color-base) !important;
    font-size: var(--font-size-base) !important;
    line-height: var(--font-size-base) !important;
}

#applyTemplateModal .ctrl_btn:nth-child(n+2) {
    margin-right: 0px !important;
    margin-left: 4px !important;
}

.buttonsBar {
    padding: 5px 0px !important;
}

.colorList {
    height: 432px !important;
}

#colorManager, #receivesAlertPopUp {
    height: 614px !important;
    width: 260px !important;
}

#grdMyEntries,
#allowClientTable {
    font-size: var(--tooltip-fontsize) !important;
}

#dayVisibilityManager {
    height: auto !important;
}

#showHideDays > .daySelection {
    height: auto !important;
}

.height450 {
    height: 530px !important;
}

.achievementDetailsAdd {
    width:660px !important;
}

#eventPopUp.arrow_right.arrow_top:after {
    z-index: 2 !important;
}

#popupWrapper .ui-datepicker-trigger,
#repeatsEndDate .ui-datepicker-trigger {
    width: 38px !important;
    height: 38px !important;
    margin-left: 8px !important;
    margin-top: -8px !important;
}

.col-timebox {
    width: 85px !important;
}

#frequencyPopUp {
    height: 135px;
}

.frequencyExpandModal {
    height: 287px !important;
}

.frequencyExpandModalCustom {
    height: 370px !important;
    width: 300px !important;
}

.frequencyExpandModalCustomWeek {
    height: 450px !important;
}

.frequencyExpandModalCustomMonth {
    height: 433px !important;
}

#div_DateRange .datepicker-component,
#div_DateRangeExp .datepicker-component,
#div_TimeEntryLogs .datepicker-component,
.search-container .datepicker-component {
    width: 100% !important;
}

.col-pixel-width-autosync {
    width: 45px !important;
}

#userGroupModal .userGroupPopup {
    height: 500px !important;
}

#erroNoUser {
    font-size: 12px !important;
    color: var(--color-error) !important;
}

.inline-te-buttons .ctrl_btn{
    font-size: 12px !important;
}

.inline-te-buttons .ctrl_btn:nth-child(n+2) {
    margin-left: 0px !important;
}

.dataTable input[type="text"] {
    margin: 5px 0px !important;
}

#MyAccountUserDetailDiv .phoneFormat {
    width:100% !important;
}

.red-text {
    font-size: 12px !important;
    padding-top:3px !important;
}

.labelLegend {
    font-size: 12px !important;
}

.ptoCodes,
.defaultSelect{
    font-family: var(--font-base) !important;
    font-size: var(--font-size-base) !important;
    color: var(--color-label) !important;
    line-height: 14px !important;
    font-weight: 400 !important;
    --width: 100%;
    height: var(--input-height) !important;
    padding: 8px 12px !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--input-radius) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: linear-gradient(0deg, #FFFFFF 60%, #F0EFEF 100%);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5"><path fill="%23888888" d="M4 5L0 0h8z"/></svg>'), linear-gradient(to bottom, #ffffff 0%, #f8f8f8 100%);
    background-repeat: no-repeat, repeat;
    background-position: right 10px center, 0 0;
    background-size: 8px 5px, 100% 100%;
}

.dateTimeOff::placeholder {
    color: var(--color-border);
    font-size: 13px !important;
    padding: 0px !important;
}

.timeOffEntries .ui-datepicker-trigger {
    width: 38px !important;
    height: 38px !important;
    margin-left: 4px !important;
    margin-top: -8px !important;
}

.timeOffEntries .datepicker,
.timeOffEntries .datepickers1 {
    display: flex;
    align-items: center;
}

.ptoHours,
.ptoMinutes {
    width: initial !important;
}

.trashcanTimeOffEntry1,
.trashcanTimeOffEntry {
    top: 26px !important;
    left: 0px !important;
}

.validatorlabel {
    line-height: 17px !important;
}

.customer-info input[type="checkbox"]:nth-child(1) {
    margin-left: 0px !important;
}

.borderError {
    border: 1px solid var(--color-error) !important;
}

.minmaxForEmail {
    min-height:initial;
}

#emailTitle[disabled] {
    font-size: var(--font-size-base) !important;
}

i.datepicker-outer.datepicker.icon {
    width: 38px !important;
    height: 38px !important;
    background-size: contain !important;
    top: 0px !important;
}

/* SELECT THAT IS NOT A SELECT2*/
/* Selector that excludes all select2 variants */
select:not(.select2):not(.select2-hidden-accessible):not([data-select2-id]):not([class*="select2"]):not([id*="select2"]):not(.ui-datepicker-month):not(.ui-datepicker-year):not([multiple]) {
    /* Remove native browser triangle */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none !important;
    /* Combined background with gradient and triangle */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='5' viewBox='0 0 10 5'%3E%3Cpath fill='%23888888' d='M0,0 L10,0 L5,5 Z'/%3E%3C/svg%3E"), linear-gradient(0deg, #FFFFFF 60%, #F0EFEF 100%) !important;
    /* Position both backgrounds */
    background-position: right 10px center, 0 0 !important;
    /* Size of backgrounds */
    background-size: 10px 5px, 100% 100% !important;
    /* No repeat */
    background-repeat: no-repeat !important;
    /* Space for the triangle */
    padding-right: 30px;
    height: var(--input-height) !important;
}

    /* Styles for options */
select:not(.select2):not(.select2-hidden-accessible):not([data-select2-id]):not([class*="select2"]):not([id*="select2"]):not([multiple]) option:hover {    
    color: white !important;
}
select:not([multiple]) option:hover {
    background-color: #5897fb !important;
    color: #fff;
}

.generalLineHeight {
    line-height:1.5 !important;
}

#trustAccountUpdatePanel i.datepicker.icon {
    width: 38px !important;
    height: 38px !important;
    background-size: 38px !important;
    right: -15px !important;
    top: -3px !important;
}

.searchbar #ddlUsers + .select2-container--default {
    width: 410px !important;
}

.approvalDateRange input#txtFrom_DateRange,
.approvalDateRange input#txtTo_DateRange {
    height: var(--input-height) !important;
    border-radius: var(--input-radius);
    border: 1px solid var(--color-border);
    color: var(--color-label);
    padding: 0 12px;
    font-family: var(--font-base);
    font-size: var(--font-size-base);
    --width: 100%;
    background: var(--color-input-bg);
}

.alignItemsCenter{
    align-items:center;
}

.approvalContainerButtons button.ctrl_btn {
    padding: 0 5px !important;
    margin-left: 0 !important;
}

.help-wrapper {
    position: relative;
    display: inline-block;
}

.showInfoHelp {
    display: none;
    position: absolute;
    padding: var(--tooltip-padding);
    background: var(--tooltip-bgcolor);
    color: var(--tooltip-color);
    font-size: var(--tooltip-fontsize);
    line-height: var(--tooltip-lineheight);
    border-radius: var(--tooltip-radius);
    box-sizing: border-box;
    word-wrap: break-word;
    z-index: var(--tooltip-z);
    white-space: normal;
    width: 170px;
    min-width: 100px;
    max-width: var(--tooltip-max-width);
}

    .showInfoHelp a {
        color: var(--tooltip-color);
        text-decoration: underline;
    }

    .showInfoHelp::after {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
    }

    .showInfoHelp.arrow-up {
        top: calc(100% + var(--tooltip-arrow-size));
        left: 50%;
        transform: translateX(-50%);
    }

        .showInfoHelp.arrow-up::after {
            top: 0;
            left: 50%;
            transform: translate(-50%, -100%);
            border-left: var(--tooltip-arrow-size) solid transparent;
            border-right: var(--tooltip-arrow-size) solid transparent;
            border-bottom: var(--tooltip-arrow-size) solid var(--tooltip-bgcolor);
        }

    .showInfoHelp.arrow-down {
        bottom: calc(100% + var(--tooltip-arrow-size));
        left: 50%;
        transform: translateX(-50%);
    }

        .showInfoHelp.arrow-down::after {
            bottom: 0;
            left: 50%;
            transform: translate(-50%, 100%);
            border-left: var(--tooltip-arrow-size) solid transparent;
            border-right: var(--tooltip-arrow-size) solid transparent;
            border-top: var(--tooltip-arrow-size) solid var(--tooltip-bgcolor);
        }

    .showInfoHelp.arrow-left {
        right: calc(100% + var(--tooltip-arrow-size));
        top: 50%;
        transform: translateY(-50%);
    }

        .showInfoHelp.arrow-left::after {
            right: 0;
            top: 50%;
            transform: translate(100%, -50%);
            border-top: var(--tooltip-arrow-size) solid transparent;
            border-bottom: var(--tooltip-arrow-size) solid transparent;
            border-left: var(--tooltip-arrow-size) solid var(--tooltip-bgcolor);
        }

    .showInfoHelp.arrow-right {
        left: calc(100% + var(--tooltip-arrow-size));
        top: 50%;
        transform: translateY(-50%);
    }

        .showInfoHelp.arrow-right::after {
            left: 0;
            top: 50%;
            transform: translate(-100%, -50%);
            border-top: var(--tooltip-arrow-size) solid transparent;
            border-bottom: var(--tooltip-arrow-size) solid transparent;
            border-right: var(--tooltip-arrow-size) solid var(--tooltip-bgcolor);
        }



.start-application,
.cpa-start-app {
    border-radius: var(--input-radius) !important;
    background: var(--bacgroundOrangeButton) !important;
}

.start-application:hover,
.cpa-start-app:hover{
    border-radius: var(--input-radius) !important;
    background: var(--backgroundHoverOrangeButton) !important;
}

.fixdiv label{
    line-height:18px !important;
}

.new-code {
    border-radius: var(--input-radius) !important;
}

.new-code:hover {
    background-color: var(--backgroundHoverOrangeButton) !important;
    border-radius: var(--input-radius) !important;
}

.calendar-form-inputSelect {
    appearance: none !important;
    -webkit-appearance: none !important;
}

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

#estimate-box .datepicker-component {
    width: initial !important;
}

.addInvoice-datepicker-component .ui-datepicker-trigger {
    margin-left: 10px;
    vertical-align: middle;
    cursor: pointer;
}

.datepicker-custom-ui {
    display: grid !important;
    grid-template-columns: 10px 290px auto !important;
    grid-template-areas:
        "star message message"
        "input input calendar"
        "warning warning warning" !important;
}

#projectSearchDiv{
    display:inline-block;
}

#config_btn .btnSaveAndConfigure {
    width:initial !important;
}

#timeoffContentPopup .enter-initials {
    width: 120px !important;
}

#accrualControlsYearly .allowEntriesOutsideYear {
    top: initial !important;
    position: relative !important;
}

.accrualsContentPopupYearly, .accrualsContentPopupPayPeriod, .accrualsContentPopupHoursWorked {
    width: 540px !important;
}

    .accrualsContentPopupYearly .maximumBalanceLimit,
    .accrualsContentPopupYearly .maximumBalanceLimitValue,
    .accrualsContentPopupYearly .allowNegativeBalance,
    .accrualsContentPopupYearly .giveExtraHours,
    .accrualsContentPopupYearly .firstRowExtraHour,
    .accrualsContentPopupYearly .bottomContainerYearly,
    .accrualsContentPopupPayPeriod .maximumBalanceLimit,
    .accrualsContentPopupPayPeriod .maximumBalanceLimitValue,
    .accrualsContentPopupPayPeriod .allowNegativeBalance,
    .accrualsContentPopupPayPeriod .giveExtraHours,
    .accrualsContentPopupPayPeriod .firstRowExtraHour,
    .accrualsContentPopupPayPeriod .bottomContainerYearly,
    .accrualsContentPopupPayPeriod .maximumBalanceLimitPayPeriod,
    .accrualsContentPopupPayPeriod .maximumBalanceLimitValuePayPeriod,
    .accrualsContentPopupPayPeriod .allowNegativeBalancePayPeriod,
    .accrualsContentPopupPayPeriod .giveExtraHoursPayPeriod,
    .accrualsContentPopupPayPeriod .firstRowExtraHourPayPeriod,
    .accrualsContentPopupPayPeriod .bottomContainerPayPeriod,
    .accrualsContentPopupHoursWorked .maximumBalanceLimitPerHour,
    .accrualsContentPopupHoursWorked .maximumBalanceLimitValuePerHour,
    .accrualsContentPopupHoursWorked .allowNegativeBalancePerHour,
    .accrualsContentPopupHoursWorked .giveExtraHoursPerHour,
    .accrualsContentPopupHoursWorked .firstRowExtraHourPerHour,
    .accrualsContentPopupHoursWorked .bottomContainerPerHour {
        position: initial !important;
    }

    .accrualsContentPopupYearly .extraHoursSectionYearly,
    .accrualsContentPopupPayPeriod .extraHoursSectionPayPeriod {
        display: grid !important;
        width: initial !important;
    }


    .accrualsContentPopupYearly .yearly-fields,
    .accrualsContentPopupPayPeriod .payperiod-fields {
        position: relative !important;
        padding: 30px !important;
        top: 20px;
        left: initial !important;
    }

    .accrualsContentPopupYearly .clonedRowYearly,
    .accrualsContentPopupYearly .secondRowExtraHourYearly,
    .accrualsContentPopupPayPeriod .secondRowExtraHourPayPeriod,
    .accrualsContentPopupPayPeriod .clonedRowPayPeriod {
        width: initial !important;
        float: left;
        margin-top: 10px;
        display: grid;
        gap: 9px;
    }

    .accrualsContentPopupYearly #addLevelYearly,
    .accrualsContentPopupPayPeriod #addLevelPayPeriod,
    .accrualsContentPopupHoursWorked #addLevelPerHour {
        width: 100px;
        margin-top: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .accrualsContentPopupYearly .settingName,
    #accrualsContentPopup .settingName {
        top: 0px !important;
        overflow:initial !important;
    }

    .accrualsContentPopupPayPeriod .secondRowExtraHourPayPeriod,
    .accrualsContentPopupPayPeriod .clonedRowPayPeriod {
        display:grid;
        gap:7px;
    }

.width840 {
    width:840px !important;
}

.width60 {
    width:60px !important;
}

.client div, .projectTime div {
    white-space: normal !important;
    overflow: visible !important;
}

select:not([multiple]):disabled {
    background: url(/Firm4.0/Images/Icons/dropdown-disabled.png) no-repeat 100% 0px #fff;
    background-color: #f1f1f2;
    background: #F4F4F4;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='5' viewBox='0 0 10 5'%3E%3Cpath fill='%23888888' d='M0,0 L10,0 L5,5 Z'/%3E%3C/svg%3E"), linear-gradient(0deg, #F4F4F4 60%, #F4F4F4 100%) !important;
    background-position: right 10px center, 0 0 !important;
    background-size: 10px 5px, 100% 100% !important;
    background-repeat: no-repeat !important;
}

.ptoErrorCode,
.ptoError,
.ptoErrorCode label,
.ptoError label{
    font-size: var(--tooltip-fontsize) !important;
    color: var(--color-error) !important;
}

#grdMyEntries .approved {
    color: #50A930 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-weight: 600;
    text-align: center;
}

#grdMyEntries .rejected {
    color: #EF4F25 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-weight: 600;
    text-align: center;
}

#grdMyEntries .pending {
    color: #FFA500 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-weight: 600;
    text-align: center;
}

#grdMyEntries .canceled {
    color: #939597 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-weight: 600;
    text-align: center;
}

#grdMyEntries .submited {
    color: #485A71 !important;
    font-family: "Open Sans";
    font-size: 12px !important;
    font-weight: 600;
    text-align: center;
}

.divEstimatedHoursIcon {
    grid-template-columns: 122px auto;
}

.errorLabelBudgetWorker {
    grid-area:error;
}

#lblEstimateByHours_Po, #lblEstimateByActivity_Po, #lblEstimateByWorker_Po {
    font-weight: 600 !important;
}

.app-padding .text-danger{
    font-size: 12px !important;
}

#workersList {
    padding-top:1px;
}

.container-fluid-time:first-child {
    margin-bottom: 5px !important;
}

#ddlAccrualsTypes + span {
    position: relative;
    top: 35px;
    left: 30px;
    width: 350px;
}

#timer-sidebar .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #000 !important;
    font-size: 13px !important;
}

.bottom_buttons {
    display:flex;
    gap:10px;
}

.new_item_modal .btn-group {
    display: grid !important;
    justify-content: center !important;
}

.fw-semibold {
    font-weight: 600 !important;
}

.period-select {
    width: 548px !important;
}

#leaderboard-period-select,
#rankings-period-select {
    width: 564px !important;
}

.period-select > div {
    width: 180px !important;
}

.achievements-period-select > div,
.rankings-period-select > div {
    width: 138px !important;
}

#gridBalance_wrapper {
    overflow:visible !important;
}

#userControlTextBoxValidatorDiv {
    padding-top:4px;
}

#userBillingRateList .activityCheckCol {
    padding-top:0px !important;
}

#projectSummaryInfo .currency {
    margin-top:0px !important;
}

#exportOptions > .ctrl_btn {
    text-align:left !important;
}

#addExpenseFormContainer i.datepicker.icon {
    background-image: url(../images/calendar.png) !important;
    width: 25px !important;
    height: 25px !important;
    display: block;
    background-size: 25px !important;
    background-repeat: no-repeat;
    position: absolute;
    right: 0px !important;
    top: 5px !important;
    cursor: pointer;
}

.clientDetailsAdd {
    padding-bottom: 20px !important;
    height: auto !important;
}

#addExpenseFormContainer .select2-results__option, #addExpenseFormContainer .select2-selection__placeholder {
    font-size: 12px !important;
}

#mainwell,
#logDetailsDataTable,
.detail-balance {
    font-size:12px;
}

.row-report textarea:focus {
    border: 1px solid #f48120 !important;
    box-shadow: none !important;
    border-color: #f48120 !important;
}

.infoTooltip {
    width:16px !important;
    height:16px !important;
    border-bottom: none !important;
}

.expensewidgetWidth .ctrl_btn {
    background-color: #939597;
    height: 24px;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: 400;
    font-style: normal;
    color: #FFFFFF;
    border: 0px;
    min-width: 70px;
    margin-right: 5px;
    margin-left: 0;
    padding: 0 15px;
    cursor: pointer !important;
    border-radius: 5px;
}

.expensewidgetWidth .ctrl_btn:hover {
    background-color: #6D6E70 !important;
    color: #FFFFFF !important;
}

#changePasswordDiv #CharLenerrorDiv {
    font-size: 12px !important;
    font-weight: 300 !important;
    color: #a7a9ab !important;
}

#repeaterButtons button {
    font-size: 12px !important;
    padding:0px !important;
}

#hdnOverTime_AC {
    font-size: 12px !important;
}

#lblOvertimeStatus_AC {
    color: var(--color-label) !important;
}


#TimecardSection .tab-title,
#TimesheetSection .tab-title,
#Schedule .tab-title,
#Monitoring .tab-title,
#ProjectManagement .tab-title {
    font-size: 24px !important;
}

#everyWeeks i.datepicker.icon {
    width: 38px !important;
    height: 38px !important;
    background-size: 38px !important;
    right: -10px !important;
    top: -2px !important;
}

.donshowagainentries,
#prepaidDatatable {
    font-size: 12px !important;
}

.entry-window-container.dynamic.confirm,
#eventsListFilter .checkBoxContainer label{
    font-size: var(--font-size-base) !important;
}

#inlineTimeEntryUpdatePanel .infoTooltip2 {
    width: 17px !important;
    height: 17px !important;
    border: none !important;
    background-repeat: no-repeat !important;
}

#divAddBreak #divAddEditBreak > div[style*="z-index: 3"] {
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
}

.entry_desc #descriptionTE {
    padding:5px !important;
    line-height:26px !important;
}