
    /*css for the app nav bar btns*/

    .appNavBarBtn.ui-button.ui-state-default {
        height: 65px;
        width: 65px;
        border-radius: 3px;
        border-style: none;
        border-width: 0px;
        background-color: var(--gray20);
        font-family: sbn_sans_serif, Arial, Helvetica, sans-serif;
        font-weight: normal;
        font-size: 10px;
        line-height: 12px;
        color: var(--darkBlue100);
        margin-top:0px;
        margin-bottom:0px;
        margin-right:0px;
        margin-left:5px;
        padding:0px;
        flex-direction: column;
        text-transform: none;
    }

    .appNavBarBtn.ui-button.ui-state-default .ui-icon {
        width: 24px;
        height: 24px;
        margin:0px;
        line-height: normal;
        font-size: 24px;
    }

    .appNavBarBtn.ui-button.ui-state-default .ui-button-text{

        padding-top:5px;
        padding-right:0px;
    }

    .appNavBarBtn.ui-button.ui-state-default.ui-state-hover {
        background-color: var(--gray30);
    }

    .appNavBarBtn.ui-button.ui-state-default.ui-state-focus {
        background-color: var(--gray10);
    }

    appNavBarBtn.ui-button.ui-state-default.ui-state-focus.ui-state-hover {
        background-color: var(--gray20);
    }

    .appNavBarBtn.ui-button.ui-state-default.ui-state-active.ui-state-disabled,
    .appNavBarBtn.ui-button.ui-state-default.ui-state-active.ui-state-focus,
    .appNavBarBtn.ui-button.ui-state-default.ui-state-active {
        color: white;
        background-color: var(--blue100);
    }

    .appNavBarBtn.ui-button.ui-state-default.ui-state-disabled {
        color: var(--gray60);
        background-color: var(--gray20);
    }

