/* Minification failed. Returning unminified contents.
(88,28): run-time error CSS1039: Token not allowed after unary operator: '-grey-light'
(115,28): run-time error CSS1039: Token not allowed after unary operator: '-blue-light'
(116,17): run-time error CSS1039: Token not allowed after unary operator: '-white'
(120,28): run-time error CSS1039: Token not allowed after unary operator: '-white'
(123,28): run-time error CSS1039: Token not allowed after unary operator: '-grey'
(127,17): run-time error CSS1039: Token not allowed after unary operator: '-black'
(287,22): run-time error CSS1039: Token not allowed after unary operator: '-blue-light'
(295,22): run-time error CSS1039: Token not allowed after unary operator: '-blue-light'
(296,28): run-time error CSS1039: Token not allowed after unary operator: '-grey-light'
(2013,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2049,19): run-time error CSS1039: Token not allowed after unary operator: '-fixed-header-top'
(2088,25): run-time error CSS1039: Token not allowed after unary operator: '-green-strong'
(2092,25): run-time error CSS1039: Token not allowed after unary operator: '-red-strong'
(2241,36): run-time error CSS1039: Token not allowed after unary operator: '-grey-medium'
(2391,32): run-time error CSS1039: Token not allowed after unary operator: '-grey-light'
(3793,17): run-time error CSS1039: Token not allowed after unary operator: '-grey-dark'
(3802,35): run-time error CSS1039: Token not allowed after unary operator: '-grey-medium'
(3908,28): run-time error CSS1039: Token not allowed after unary operator: '-grey-light'
(4660,17): run-time error CSS1039: Token not allowed after unary operator: '-red-strong'
(6564,27): run-time error CSS1038: Expected hex color, found '#fff0'
 */
/*global*/
.RadInput_Default,
.RadInputMgr_Default {
  font: 12px "segoe ui",arial,sans-serif; }

/*textbox states*/
html body .RadInput_Default .riTextBox,
html body .RadInputMgr_Default {
  border-color: #8e8e8e #b8b8b8 #b8b8b8 #8e8e8e;
  background: #fff;
  color: #333333;
  font: 12px "segoe ui",arial,sans-serif; }
html body .RadInput_Default .riEmpty,
html body .RadInput_Empty_Default {
  color: #a5a5a5; }
html body .RadInput_Default .riHover,
html body .RadInput_Hover_Default,
html body .RadInput_Default .riFocused,
html body .RadInput_Focused_Default {
  border-color: #515151;
  color: #333333; }
html body .RadInput_Default .riRead,
html body .RadInput_Read_Default {
  border-color: #d0d0d0; }
html body .RadInput_Default .riDisabled,
html body .RadInput_Disabled_Default {
  border-color: #d0d0d0;
  color: #8a8a8a;
  cursor: default; }
html body .RadInput_Default .riError,
html body .RadInput_Error_Default {
  border-color: #d51923;
  background: white 100% -298px no-repeat url('Input/sprite.gif');
  color: #d51923; }

.RadForm.rfdTextbox .RadInput_Default .riError[type="text"],
.RadForm.rfdTextbox .RadInput_Error_Default[type="text"] {
  border-color: #d51923;
  background: white 100% -298px no-repeat url('Input/sprite.gif');
  color: #d51923; }

html body .RadInput_Default .riNegative,
html body .RadInput_Negative_Default {
  color: #565656; }

.RadInput_Default a {
  background: transparent no-repeat url('Input/sprite.gif'); }
.RadInput_Default .riBtn a {
  width: 20px;
  height: 18px;
  line-height: 18px;
  background-position: 3px 5px; }
  .RadInput_Default .riBtn a:hover {
    background-position: 3px -45px; }
.RadInput_Default .riSpin a {
  width: 15px;
  height: 7px;
  line-height: 7px; }
.RadInput_Default a.riUp {
  background-position: 4px -98px; }
  .RadInput_Default a.riUp:hover {
    background-position: 4px -148px; }
.RadInput_Default a.riDown {
  background-position: 4px -199px; }
  .RadInput_Default a.riDown:hover {
    background-position: 4px -249px; }
.RadInput_Default .riLabel {
  color: #000; }
.RadInput_Default .riResizeIcon {
  background: url('Common/radActionsSprite.png') no-repeat transparent;
  background-position: -6.5px -966.5px;
  margin-bottom: -1px; }

html body .RadInputRTL_Default .riError,
html body .RadInputRTL_Error_Default {
  background-position: 3px -298px; }
html body .RadInputRTL_Default .riResizeIcon {
  background-position: -6.5px -986.5px; }

.RadForm.rfdTextbox .RadInputRTL_Default .riError[type="text"],
.RadForm.rfdTextbox .RadInputRTL_Error_Default[type="text"] {
  background-position: 3px -298px; }



/*Section: RadGrid Menu*/
div.RadMenu_Default .rmGroup a.rmLink:hover {
    background-color: var(--grey-light);
    cursor: pointer;
}


div.RadMenu_Default .rmGroup a.rmFocused {
    cursor: pointer;
    background-image: none;
    margin: 0;
    background-color: #113952;
    color: #FFFFFF;
}

div.RadMenu_Default .rmFirst a.rmLink {
    border-top-right-radius: 5px;
}

div.RadMenu_Default .rmLast a.rmLink {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

div.RadMenu_Default a.rmLink .rmText {
    padding: .2em 1em;
}

div.RadMenu_Default .rmGroup a.rmFocused {
    background-color: var(--blue-light);
    color: var(--white);
}

div.RadMenu_Default .rmGroup a.rmLink {
    background-color: var(--white);
    /* background-image: none; */
    /* margin: 0; */
    border: 1px solid var(--grey);
    padding: 0.1em !important;
    text-index: none;
    text-decoration: none;
    color: var(--black);
    font-family: 'Nunito';
    margin-bottom: -1px;
}

/*Section: RadMenu Top*/
#navigationBar .RadMenu_Default .rmRootGroup {
    border: 0px;
}

.customNavigationBar {
    width: 100%;
    vertical-align: middle;
    height: 24px;
    border-top: 1px solid #828282;
    border-bottom: 1px solid #828282;
    background-repeat: repeat-x;
    background-position: 0 -408px;
    background-color: #e6e6e6;
    background-image: url('/Skins/Default/Menu/rmSprite.png');
}

html .customNavigationBar .RadMenu_Silk .rmRootLink {
    padding: 1px 5px;
    line-height: 18px;
}

    html .customNavigationBar .RadMenu_Silk .rmRootLink .rmLeftImage {
        margin: 5px -8px 0 5px;
    }

    html .customNavigationBar .RadMenu_Silk .rmRootLink .rmText {
        padding: 2px 5px;
        display: block;
    }

    html .customNavigationBar .RadMenu_Silk .rmRootLink:hover {
        padding-top: 0;
        border-top: 3px solid #B5B7B9;
        color: #555555;
        line-height: 16px;
        cursor: pointer;
    }

.customNavigationBar .RadMenu_Silk .rmGroup .rmLink:hover {
    cursor: pointer;
}

html .customNavigationBar .RadMenu_Silk .rmRootLink:hover .rmLeftImage {
    margin: 1px -8px 0 5px;
}

.customNavigationBar .RadMenu_Silk .rmGroup .rmLink.rmExpanded, .customNavigationBar .RadMenu_Silk .rmGroup .rmLink:hover, .customNavigationBar .RadMenu_Silk .rmGroup .rmLink.rmSelected {
    color: #555555;
    background: #9bb7dc;
    background-image: none;
}

.customNavigationBar .RadMenu ul.rmRootGroup {
    border: 0px;
}

.customNavigationBar .RadMenu_Silk .rmRootGroup {
    background: none;
    background-image: none;
    border: 0px;
}

/*Section: RadGrid*/
.RadGrid {
    outline: none;
}

body .RadGrid .rgRow td, body .RadGrid .rgAltRow td, body .RadGrid .rgEditRow td {
    padding-top: 3px;
    padding-bottom: 2px;
}

.roundedRadTop .RadGrid, .roundedRadTop .RadGrid table.rgMasterTable thead {
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

    .roundedRadTop .RadGrid table.rgMasterTable thead th.rgHeader:first-child {
        -moz-border-radius: 5px 0 0 0;
        -webkit-border-radius: 5px 0 0 0;
        border-radius: 5px 0 0 0;
    }

    .roundedRadTop .RadGrid table.rgMasterTable thead th.rgHeader:last-child {
        -moz-border-radius: 0 5px 0 0;
        -webkit-border-radius: 0 5px 0 0;
        border-radius: 0 5px 0 0;
    }

body .RadGrid_Default .rgMasterTable, .RadGrid_Default .rgDetailTable, .RadGrid_Default .rgGroupPanel table, .RadGrid_Default .rgCommandRow table, .RadGrid_Default .rgEditForm table, .RadGrid_Default .rgPager table {
    font-family: 'lato',sans-serif;
    font-size: 11px;
    line-height: 20px;
}

.RadGrid_Default .rgMasterTable .rgActiveCell, .RadGrid_Default .rgActiveRow, .RadGrid_Default .rgHoveredRow {
    background: #d6d5d5 0 -2900px repeat-x;
    color: #000;
}

/*Section: RadTreeView*/
.RadTreeView .rtHover .rtIn, .RadTreeView .rtSelected .rtIn {
    color: #555555;
    background: #9bb7dc;
    cursor: pointer;
}

.RadTreeView li ul li {
    font-size: 9px;
}

.RadTreeView {
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

/*Section: RadPicker*/
.RadPicker {
    height: 25px;
}

#pnlFixedHeader {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: White;
    height: 60px;
}


  


    .DashboardTitle {
        text-align: left;
        display: table;
        font-size: 14pt;
        margin-top: 0px;
        text-indent: 18px;
        line-height: 37px;
        background-color: #1e96d5;
        -webkit-margin-before: 0px;
        color: white;
        float: left;
    }



:not(.switch) input[type=checkbox]:checked {
    background: var(--blue-light) url(/Images/white_tick_10.gif)no-repeat 0 50%;
    background-position: center;
    background-position-x: 49%;
}

:not(.switch) input[type=checkbox] {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: var(--blue-light);
    border: 1px solid var(--grey-light);
    width: 18px;
    height: 18px;
    cursor: pointer;
    border-radius: 3px;
    float: left;
}


/*from bootstrap*/

.caret {
    display: inline;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid #fff;
    border-left: 4px solid #fff;
}

.dropup,
.dropdown {
    position: relative;
}

.dropdown-toggle:focus {
    background-color: #fff;
    outline: 0;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
}

    .dropdown-menu.pull-right {
        right: 0;
        left: auto;
    }

    .dropdown-menu.help {
        right: -60px;
        left: auto;
    }

    .dropdown-menu .divider {
        height: 1px;
        margin: 9px 0;
        overflow: hidden;
        background-color: #e5e5e5;
    }

    .dropdown-menu > li > a {
        display: block;
        padding: 3px 20px;
        clear: both;
        font-weight: normal;
        line-height: 26px;
        color: #333;
        white-space: nowrap;
        text-decoration: none;
    }

        .dropdown-menu > li > a:hover,
        .dropdown-menu > li > a:focus {
            color: #262626;
            text-decoration: none;
            background-color: #f5f5f5;
        }

    .dropdown-menu > .active > a,
    .dropdown-menu > .active > a:hover,
    .dropdown-menu > .active > a:focus {
        color: #fff;
        text-decoration: none;
        background-color: #337ab7;
        outline: 0;
    }

    .dropdown-menu > .disabled > a,
    .dropdown-menu > .disabled > a:hover,
    .dropdown-menu > .disabled > a:focus {
        color: #777;
    }

        .dropdown-menu > .disabled > a:hover,
        .dropdown-menu > .disabled > a:focus {
            text-decoration: none;
            cursor: not-allowed;
            background-color: #fff;
            background-image: none;
            filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
        }

.open > .dropdown-menu {
    display: block;
}

.open > a {
    outline: 0;
}

.dropdown-menu-right {
    right: 0;
    left: auto;
}

.dropdown-menu-left {
    right: auto;
    left: 0;
}

.dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #777;
    white-space: nowrap;
}

.dropdown-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 990;
}

.pull-right > .dropdown-menu {
    right: 0;
    left: auto;
}

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
    content: "";
    border-top: 0;
    border-bottom: 4px solid;
}

.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 2px;
}

@media (min-width: 768px) {
    .navbar-right .dropdown-menu {
        right: 0;
        left: auto;
    }

    .navbar-right .dropdown-menu-left {
        right: auto;
        left: 0;
    }
}

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

    .nav > li {
    }

        .nav > li > a {
            padding: 10px 15px;
        }

            .nav > li > a:hover,
            .nav > li > a:focus {
                text-decoration: none;
                background-color: #eee;
            }

        .nav > li.disabled > a {
            color: #777;
        }

            .nav > li.disabled > a:hover,
            .nav > li.disabled > a:focus {
                color: #777;
                text-decoration: none;
                cursor: not-allowed;
                background-color: #fff;
            }

    .nav .open > a,
    .nav .open > a:hover,
    .nav .open > a:focus {
        background-color: #eee;
        border-color: #337ab7;
    }

    .nav .nav-divider {
        height: 1px;
        margin: 9px 0;
        overflow: hidden;
        background-color: #e5e5e5;
    }

    .nav > li > a > img {
        max-width: none;
    }

.nav-tabs {
    border-bottom: 1px solid #ddd;
}

    .nav-tabs > li {
        margin-bottom: -1px;
    }

        .nav-tabs > li > a {
            margin-right: 2px;
            line-height: 1.42857143;
            border: 1px solid #fff;
            border-radius: 4px 4px 0 0;
        }

            .nav-tabs > li > a:hover {
                border-color: #eee #eee #ddd;
            }

        .nav-tabs > li.active > a,
        .nav-tabs > li.active > a:hover,
        .nav-tabs > li.active > a:focus {
            color: #555;
            cursor: default;
            background-color: #fff;
            border: 1px solid #ddd;
            border-bottom-color: #fff;
        }

    .nav-tabs.nav-justified {
        width: 100%;
        border-bottom: 0;
    }

        .nav-tabs.nav-justified > li {
            float: none;
        }

            .nav-tabs.nav-justified > li > a {
                margin-bottom: 5px;
                text-align: center;
            }

        .nav-tabs.nav-justified > .dropdown .dropdown-menu {
            top: auto;
            left: auto;
        }

@media (min-width: 768px) {
    .nav-tabs.nav-justified > li {
        display: table-cell;
        width: 1%;
    }

        .nav-tabs.nav-justified > li > a {
            margin-bottom: 0;
        }
}

.nav-tabs.nav-justified > li > a {
    margin-right: 0;
    border-radius: 4px;
}

.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
    border: 1px solid #ddd;
}

@media (min-width: 768px) {
    .nav-tabs.nav-justified > li > a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0;
    }

    .nav-tabs.nav-justified > .active > a,
    .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs.nav-justified > .active > a:focus {
        border-bottom-color: #fff;
    }
}

.nav-pills > li {
}

    .nav-pills > li > a {
        border-radius: 4px;
    }

    .nav-pills > li + li {
        margin-left: 2px;
    }

    .nav-pills > li.active > a,
    .nav-pills > li.active > a:hover,
    .nav-pills > li.active > a:focus {
        color: #fff;
        background-color: #337ab7;
    }

.nav-stacked > li {
    float: none;
}

    .nav-stacked > li + li {
        margin-top: 2px;
        margin-left: 0;
    }

.nav-justified {
    width: 100%;
}

    .nav-justified > li {
        float: none;
    }

        .nav-justified > li > a {
            margin-bottom: 5px;
            text-align: center;
        }

    .nav-justified > .dropdown .dropdown-menu {
        top: auto;
        left: auto;
    }

@media (min-width: 768px) {
    .nav-justified > li {
        display: table-cell;
        width: 1%;
    }

        .nav-justified > li > a {
            margin-bottom: 0;
        }
}

.nav-tabs-justified {
    border-bottom: 0;
}

    .nav-tabs-justified > li > a {
        margin-right: 0;
        border-radius: 4px;
    }

    .nav-tabs-justified > .active > a,
    .nav-tabs-justified > .active > a:hover,
    .nav-tabs-justified > .active > a:focus {
        border: 1px solid #ddd;
    }

@media (min-width: 768px) {
    .nav-tabs-justified > li > a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0;
    }

    .nav-tabs-justified > .active > a,
    .nav-tabs-justified > .active > a:hover,
    .nav-tabs-justified > .active > a:focus {
        border-bottom-color: #fff;
    }
}

.tab-content > .tab-pane {
    display: none;
}

.tab-content > .active {
    display: block;
}

.nav-tabs .dropdown-menu {
    margin-top: -1px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 0px;
    border: 1px solid #fff;
    filter: none !important;
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 4px;
    }
}

@media (min-width: 768px) {
    .navbar-header {
        float: left;
    }
}

.navbar-collapse {
    padding-right: 15px;
    padding-left: 15px;
    overflow-x: visible;
    -webkit-overflow-scrolling: touch;
    border-top: 1px solid #fff;
}

    .navbar-collapse.in {
        overflow-y: auto;
    }

@media (min-width: 768px) {
    .navbar-collapse {
        width: auto;
        border-top: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .navbar-collapse.collapse {
            display: block !important;
            height: auto !important;
            padding-bottom: 0;
            overflow: visible !important;
        }

        .navbar-collapse.in {
            overflow-y: visible;
        }

    .navbar-fixed-top .navbar-collapse,
    .navbar-static-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
        padding-right: 0;
        padding-left: 0;
    }
}

.navbar-fixed-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
    max-height: 340px;
}

@media (max-device-width: 480px) and (orientation: landscape) {
    .navbar-fixed-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
        max-height: 200px;
    }
}

.container > .navbar-header,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-collapse {
    margin-right: -15px;
    margin-left: -15px;
}

@media (min-width: 768px) {
    .container > .navbar-header,
    .container-fluid > .navbar-header,
    .container > .navbar-collapse,
    .container-fluid > .navbar-collapse {
        margin-right: 0;
        margin-left: 0;
    }
}

.navbar-static-top {
    z-index: 1000;
    border-width: 0 0 1px;
}

@media (min-width: 768px) {
    .navbar-static-top {
        border-radius: 0;
    }
}

.navbar-fixed-top,
.navbar-fixed-bottom {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
}

@media (min-width: 768px) {
    .navbar-fixed-top,
    .navbar-fixed-bottom {
        border-radius: 0;
    }
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
}

.navbar-fixed-bottom {
    bottom: 0;
    margin-bottom: 0;
    border-width: 1px 0 0;
}

.navbar-brand {
    height: 50px;
    padding: 15px 15px;
    font-size: 18px;
    line-height: 20px;
}

    .navbar-brand:hover,
    .navbar-brand:focus {
        text-decoration: none;
    }

    .navbar-brand > img {
        display: block;
    }

@media (min-width: 768px) {
    .navbar > .container .navbar-brand,
    .navbar > .container-fluid .navbar-brand {
        margin-left: -15px;
    }
}

.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 8px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 4px;
}

    .navbar-toggle:focus {
        outline: 0;
    }

    .navbar-toggle .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 1px;
    }

        .navbar-toggle .icon-bar + .icon-bar {
            margin-top: 0px;
        }

@media (min-width: 768px) {
    .navbar-toggle {
        display: none;
    }
}

.navbar-nav {
    margin: 1px;
    white-space: nowrap;
}

    .navbar-nav > li > a {
        padding-top: 0px;
        padding-bottom: 0px;
        line-height: 20px;
    }

@media (max-width: 767px) {

    .navbar-nav > li > a {
        padding-top: 0px;
        padding-bottom: 0px;
        line-height: 20px;
        background-color: #fff;
    }

    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        border: 0;
        background-color: #fff;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .navbar-nav .open .dropdown-menu > li > a,
        .navbar-nav .open .dropdown-menu .dropdown-header {
            padding: 5px 15px 5px 25px;
        }

        .navbar-nav .open .dropdown-menu > li > a {
            line-height: 20px;
        }

            .navbar-nav .open .dropdown-menu > li > a:hover,
            .navbar-nav .open .dropdown-menu > li > a:focus {
                background-image: none;
            }
}

@media (min-width: 768px) {
    .navbar-nav {
        float: left;
        margin: 0;
    }

        .navbar-nav > li {
            float: left;
        }

            .navbar-nav > li > a {
                padding-top: 15px;
                padding-bottom: 15px;
                display: inline;
            }
}

.navbar-form {
    padding: 10px 15px;
    margin-top: 8px;
    margin-right: -15px;
    margin-bottom: 8px;
    margin-left: -15px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

@media (min-width: 768px) {
    .navbar-form .form-group {
        display: inline;
        margin-bottom: 0;
        vertical-align: middle;
    }

    .navbar-form .form-control {
        display: inline;
        width: auto;
        vertical-align: middle;
    }

    .navbar-form .form-control-static {
        display: inline;
    }

    .navbar-form .input-group {
        display: inline-table;
        vertical-align: middle;
    }

        .navbar-form .input-group .input-group-addon,
        .navbar-form .input-group .input-group-btn,
        .navbar-form .input-group .form-control {
            width: auto;
        }

        .navbar-form .input-group > .form-control {
            width: 100%;
        }

    .navbar-form .control-label {
        margin-bottom: 0;
        vertical-align: middle;
    }

    .navbar-form .radio,
    .navbar-form .checkbox {
        display: inline;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle;
    }

        .navbar-form .radio label,
        .navbar-form .checkbox label {
            padding-left: 0;
        }

        .navbar-form .radio input[type="radio"],
        .navbar-form .checkbox input[type="checkbox"] {
            position: relative;
            margin-left: 0;
        }

    .navbar-form .has-feedback .form-control-feedback {
        top: 0;
    }
}

@media (max-width: 767px) {
    .navbar-form .form-group {
        margin-bottom: 5px;
    }

        .navbar-form .form-group:last-child {
            margin-bottom: 0;
        }
}

@media (min-width: 768px) {
    .navbar-form {
        width: auto;
        padding-top: 0;
        padding-bottom: 0;
        margin-right: 0;
        margin-left: 0;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

.navbar-nav > li > .dropdown-menu {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
    margin-bottom: 0;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.navbar-btn {
    margin-top: 8px;
    margin-bottom: 8px;
}

    .navbar-btn.btn-sm {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .navbar-btn.btn-xs {
        margin-top: 14px;
        margin-bottom: 14px;
    }

.navbar-text {
    margin-top: 15px;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .navbar-text {
        float: left;
        margin-right: 15px;
        margin-left: 15px;
    }
}

@media (min-width: 768px) {
    .navbar-left {
        float: left !important;
    }

    .navbar-right {
        float: right !important;
        margin-right: -15px;
    }

        .navbar-right ~ .navbar-right {
            margin-right: 0;
        }
}

.navbar-default {
    background-color: #f8f8f8;
    border-color: #e7e7e7;
}

    .navbar-default .navbar-brand {
        color: #777;
    }

        .navbar-default .navbar-brand:hover,
        .navbar-default .navbar-brand:focus {
            color: #5e5e5e;
            background-color: #fff;
        }

    .navbar-default .navbar-text {
        color: #777;
    }

    .navbar-default .navbar-nav > li > a {
        color: #777;
    }

        .navbar-default .navbar-nav > li > a:hover,
        .navbar-default .navbar-nav > li > a:focus {
            color: #333;
            background-color: #fff;
        }

    .navbar-default .navbar-nav > .active > a,
    .navbar-default .navbar-nav > .active > a:hover,
    .navbar-default .navbar-nav > .active > a:focus {
        color: #555;
        background-color: #e7e7e7;
    }

    .navbar-default .navbar-nav > .disabled > a,
    .navbar-default .navbar-nav > .disabled > a:hover,
    .navbar-default .navbar-nav > .disabled > a:focus {
        color: #ccc;
        background-color: #fff;
    }

    .navbar-default .navbar-toggle {
        border-color: #ddd;
    }

        .navbar-default .navbar-toggle:hover,
        .navbar-default .navbar-toggle:focus {
            background-color: #ddd;
        }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #888;
        }

    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {
        border-color: #e7e7e7;
    }

    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:hover,
    .navbar-default .navbar-nav > .open > a:focus {
        color: #555;
        background-color: #e7e7e7;
    }

@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #777;
    }

        .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
        .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #333;
            background-color: #fff;
        }

    .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #555;
        background-color: #e7e7e7;
    }

    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #ccc;
        background-color: #fff;
    }
}

.navbar-default .navbar-link {
    color: #777;
}

    .navbar-default .navbar-link:hover {
        color: #333;
    }

.navbar-default .btn-link {
    color: #777;
}

    .navbar-default .btn-link:hover,
    .navbar-default .btn-link:focus {
        color: #333;
    }

    .navbar-default .btn-link[disabled]:hover,
    fieldset[disabled] .navbar-default .btn-link:hover,
    .navbar-default .btn-link[disabled]:focus,
    fieldset[disabled] .navbar-default .btn-link:focus {
        color: #ccc;
    }

.navbar-inverse {
    background-color: #222;
    border-color: #080808;
}

    .navbar-inverse .navbar-brand {
        color: #9d9d9d;
    }

        .navbar-inverse .navbar-brand:hover,
        .navbar-inverse .navbar-brand:focus {
            color: #fff;
            background-color: #fff;
        }

    .navbar-inverse .navbar-text {
        color: #9d9d9d;
    }

    .navbar-inverse .navbar-nav > li > a {
        color: #9d9d9d;
    }

        .navbar-inverse .navbar-nav > li > a:hover,
        .navbar-inverse .navbar-nav > li > a:focus {
            color: #fff;
            background-color: #fff;
        }

    .navbar-inverse .navbar-nav > .active > a,
    .navbar-inverse .navbar-nav > .active > a:hover,
    .navbar-inverse .navbar-nav > .active > a:focus {
        color: #fff;
        background-color: #080808;
    }

    .navbar-inverse .navbar-nav > .disabled > a,
    .navbar-inverse .navbar-nav > .disabled > a:hover,
    .navbar-inverse .navbar-nav > .disabled > a:focus {
        color: #444;
        background-color: #fff;
    }

    .navbar-inverse .navbar-toggle {
        border-color: #333;
    }

        .navbar-inverse .navbar-toggle:hover,
        .navbar-inverse .navbar-toggle:focus {
            background-color: #333;
        }

        .navbar-inverse .navbar-toggle .icon-bar {
            background-color: #fff;
        }

    .navbar-inverse .navbar-collapse,
    .navbar-inverse .navbar-form {
        border-color: #101010;
    }

    .navbar-inverse .navbar-nav > .open > a,
    .navbar-inverse .navbar-nav > .open > a:hover,
    .navbar-inverse .navbar-nav > .open > a:focus {
        color: #fff;
        background-color: #080808;
    }

@media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
        border-color: #080808;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
        background-color: #080808;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
        color: #9d9d9d;
    }

        .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
        .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #fff;
            background-color: #fff;
        }

    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #fff;
        background-color: #080808;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #444;
        background-color: #fff;
    }
}

.navbar-inverse .navbar-link {
    color: #9d9d9d;
}

    .navbar-inverse .navbar-link:hover {
        color: #fff;
    }

.navbar-inverse .btn-link {
    color: #9d9d9d;
}

    .navbar-inverse .btn-link:hover,
    .navbar-inverse .btn-link:focus {
        color: #fff;
    }

    .navbar-inverse .btn-link[disabled]:hover,
    fieldset[disabled] .navbar-inverse .btn-link:hover,
    .navbar-inverse .btn-link[disabled]:focus,
    fieldset[disabled] .navbar-inverse .btn-link:focus {
        color: #444;
    }

/*Custom*/
.navbar {
    position: absolute;
    top: 2px;
    right: 0;
    min-height: 22px;
    max-height: 22px;
    margin-bottom: 0px;
    padding-top: 0px;
}

.nav > li > a {
    position: relative;
    padding: 0px 10px 0px 10px;
    font-size: 12px;
    text-decoration: none;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 12px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
}

.navbar-custom {
    background-color: #e0e0e0;
    border-color: #cfcfcf;
    background-image: -webkit-gradient(linear, left 0%, left 100%, from(#fafafa), to(#e0e0e0));
    background-image: -webkit-linear-gradient(top, #fafafa, 0%, #e0e0e0, 100%);
    background-image: -moz-linear-gradient(top, #fafafa 0%, #e0e0e0 100%);
    background-image: linear-gradient(to bottom, #fafafa 0%, #e0e0e0 100%);
    background-repeat: repeat-x;
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffafafa', endColorstr='#ffe0e0e0', GradientType=0);*/
}

    .navbar-custom .navbar-brand {
        color: #3d3d3d;
    }

        .navbar-custom .navbar-brand:hover,
        .navbar-custom .navbar-brand:focus {
            color: #242424;
            background-color: #fff;
        }

    .navbar-custom .navbar-text {
        color: #3d3d3d;
    }

    .navbar-custom .navbar-nav > li:last-child > a {
        border-right: 1px solid #cfcfcf;
    }

    .navbar-custom .navbar-nav > li > a {
        color: #3d3d3d;
        border-left: 1px solid #cfcfcf;
    }

        .navbar-custom .navbar-nav > li > a:hover,
        .navbar-custom .navbar-nav > li > a:focus {
            color: #c0c0c0;
            background-color: transparent;
        }

    .navbar-custom .navbar-nav > .active > a,
    .navbar-custom .navbar-nav > .active > a:hover,
    .navbar-custom .navbar-nav > .active > a:focus {
        color: #c0c0c0;
        background-color: #cfcfcf;
        background-image: -webkit-gradient(linear, left 0%, left 100%, from(#cfcfcf), to(#e9e9e9));
        background-image: -webkit-linear-gradient(top, #cfcfcf, 0%, #e9e9e9, 100%);
        background-image: -moz-linear-gradient(top, #cfcfcf 0%, #e9e9e9 100%);
        background-image: linear-gradient(to bottom, #cfcfcf 0%, #e9e9e9 100%);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcfcfcf', endColorstr='#ffe9e9e9', GradientType=0);
    }

    .navbar-custom .navbar-nav > .disabled > a,
    .navbar-custom .navbar-nav > .disabled > a:hover,
    .navbar-custom .navbar-nav > .disabled > a:focus {
        color: #cccccc;
        background-color: #fff;
    }

    .navbar-custom .navbar-toggle {
        border-color: #dddddd;
    }

        .navbar-custom .navbar-toggle:hover,
        .navbar-custom .navbar-toggle:focus {
            background-color: #dddddd;
        }

        .navbar-custom .navbar-toggle .icon-bar {
            background-color: #cccccc;
        }

    .navbar-custom .navbar-collapse,
    .navbar-custom .navbar-form {
        border-color: #cecece;
    }

    .navbar-custom .navbar-nav > .dropdown > a:hover .caret,
    .navbar-custom .navbar-nav > .dropdown > a:focus .caret {
        border-top-color: #c0c0c0;
        border-bottom-color: #c0c0c0;
    }

    .navbar-custom .navbar-nav > .open > a,
    .navbar-custom .navbar-nav > .open > a:hover,
    .navbar-custom .navbar-nav > .open > a:focus {
        background-color: #cfcfcf;
        color: #c0c0c0;
    }

        .navbar-custom .navbar-nav > .open > a .caret,
        .navbar-custom .navbar-nav > .open > a:hover .caret,
        .navbar-custom .navbar-nav > .open > a:focus .caret {
            border-top-color: #c0c0c0;
            border-bottom-color: #c0c0c0;
        }

    .navbar-custom .navbar-nav > .dropdown > a .caret {
        border-top-color: #3d3d3d;
        border-bottom-color: #3d3d3d;
    }

#SiteHeader_MenuPanel1 {
    float: left;
}

#SiteHeader_MenuPanel2 {
    float: right;
}

@media (max-width: 767) {
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a {
        color: #3d3d3d;
    }

        .navbar-custom .navbar-nav .open .dropdown-menu > li > a:hover,
        .navbar-custom .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #c0c0c0;
            background-color: #fff;
        }

    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #c0c0c0;
        background-color: #cfcfcf;
    }

    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #cccccc;
        background-color: #fff;
    }

    #MenuPanel1 {
        float: none;
    }

    #MenuPanel2 {
        float: none;
    }
}

.navbar-custom .navbar-link {
    color: #3d3d3d;
}

    .navbar-custom .navbar-link:hover {
        color: #c0c0c0;
    }

#SiteHeader_MenuPanel1-button {
    float: left;
}

#SiteHeader_MenuPanel2-button {
    float: right;
}

.navbar-toggle {
    margin: 0px 10px 0px 10px;
    padding: 5px 5px 5px 5px;
}

    .navbar-toggle.collapsed {
        display: none;
    }

.dropdown:hover .dropdown-menu {
    display: block;
}

#pnlSandbox {
        background-color: red;
        color:white;
    font-weight: bold;
    font-size:2em;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    padding: 0px 10px 0px 10px;
    position: fixed;
    left: 50%;
    text-align:center;
    margin-left: -86px;
}
table.RadCalendar_Default {
  background: white;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 12px; }
body .RadPicker td a{
    position:inherit
}
.RadCalendar_Default .rcTitlebar {
  border-color: #868686 #868686 #c4c4c4;
  background: #eaeaea 0 -1000px repeat-x url('/skins/default/Calendar/sprite.gif');
  color: #000; }
  .RadCalendar_Default .rcTitlebar table {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 23px; }
  .RadCalendar_Default .rcTitlebar td {
    padding: 0 0 1px; }
  .RadCalendar_Default .rcTitlebar .rcPrev,
  .RadCalendar_Default .rcTitlebar .rcNext,
  .RadCalendar_Default .rcTitlebar .rcFastPrev,
  .RadCalendar_Default .rcTitlebar .rcFastNext {
    background-image: url('/skins/default/Calendar/sprite.gif');
    color: #ccc; }
  .RadCalendar_Default .rcTitlebar .rcFastPrev {
    margin-left: 6px;
    background-position: 1px -197px; }
  .RadCalendar_Default .rcTitlebar a.rcFastPrev:hover {
    background-position: 1px -247px; }
  .RadCalendar_Default .rcTitlebar .rcPrev {
    background-position: 4px -297px; }
  .RadCalendar_Default .rcTitlebar a.rcPrev:hover {
    background-position: 4px -347px; }
  .RadCalendar_Default .rcTitlebar .rcNext {
    background-position: 3px -397px; }
  .RadCalendar_Default .rcTitlebar a.rcNext:hover {
    background-position: 3px -447px; }
  .RadCalendar_Default .rcTitlebar .rcFastNext {
    margin-right: 6px;
    background-position: 1px -497px; }
  .RadCalendar_Default .rcTitlebar a.rcFastNext:hover {
    background-position: 1px -547px; }
.RadCalendar_Default .rcMain {
  border-color: #868686; }
.RadCalendar_Default .rcMainTable {
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 17px; }
.RadCalendar_Default .rcHeader,
.RadCalendar_Default .rcFooter {
  border-color: #868686; }
.RadCalendar_Default .rcWeek th {
  border-bottom: 1px solid #c5c5c5;
  padding: 4px 6px 3px 0;
  color: #333333; }
.RadCalendar_Default .rcWeek .rcViewSel {
  width: 13px;
  padding: 0 7px 0 9px;
  background: #eee; }
.RadCalendar_Default .rcRow th {
  width: 13px;
  padding: 0 7px 0 9px;
  background: #eee;
  color: #696969; }
.RadCalendar_Default .rcRow td {
  border-color: #fff; }
.RadCalendar_Default .rcMain .rcRow a,
.RadCalendar_Default .rcMain .rcRow span {
  color: #333333; }
.RadCalendar_Default .rcMain .rcWeekend a {
  color: #666; }
.RadCalendar_Default .rcRow .rcToday {
  border-color: #898989; }
.RadCalendar_Default .rcMain .rcOtherMonth a,
.RadCalendar_Default .rcMain .rcOutOfRange span {
  color: #898989; }
.RadCalendar_Default .rcRow .rcSelected {
  border-color: #8d8d8d #7d7d7d #6c6c6c;
  background: #828282 0 -1700px repeat-x url('/skins/default/Calendar/sprite.gif'); }
.RadCalendar_Default .rcMain .rcRow .rcSelected a {
  color: #fff; }
.RadCalendar_Default .rcRow .rcHover {
  border-color: #c4c4c4 #b2b2b2 #9e9e9e;
  background: #c5c5c5 0 -1600px repeat-x url('/skins/default/Calendar/sprite.gif'); }
.RadCalendar_Default .rcMain .rcRow .rcHover a {
  color: #333333; }

/*header, footer*/
/*week numbers and days*/
/*date cells*/
/*multimonth view*/
.RadCalendarMultiView_Default .rcTitlebar {
  border-color: #9a9a9a #9c9c9c #9c9c9c;
  background: #c5c5c5 0 -1199px repeat-x url('/skins/default/Calendar/sprite.gif'); }
  .RadCalendarMultiView_Default .rcTitlebar table {
    border: 1px solid;
    border-color: #fdfdfd #f3f3f3 #e7e7e7;
    line-height: 27px; }
  .RadCalendarMultiView_Default .rcTitlebar a.rcFastPrev:hover {
    background-position: 1px -647px; }
  .RadCalendarMultiView_Default .rcTitlebar a.rcPrev:hover {
    background-position: 4px -747px; }
  .RadCalendarMultiView_Default .rcTitlebar a.rcNext:hover {
    background-position: 3px -847px; }
  .RadCalendarMultiView_Default .rcTitlebar a.rcFastNext:hover {
    background-position: 1px -947px; }
.RadCalendarMultiView_Default .rcMain {
  border-color: #9b9b9b; }
.RadCalendarMultiView_Default .rcCalendar {
  border-color: #868686; }
  .RadCalendarMultiView_Default .rcCalendar .rcMainTable {
    height: 176px; }
.RadCalendarMultiView_Default .rcMainTable .rcTitle {
  border-color: #c4c4c4;
  padding: 0 0 2px;
  background: #eaeaea 0 -1000px repeat-x url('/skins/default/Calendar/sprite.gif');
  line-height: 22px; }

/*month view*/
table.RadCalendarMonthView_Default {
  border-color: #979797;
  background: white;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #333333; }

.RadCalendarMonthView_Default #rcMView_Feb, .RadCalendarMonthView_Default #rcMView_Apr, .RadCalendarMonthView_Default #rcMView_Jun, .RadCalendarMonthView_Default #rcMView_Aug, .RadCalendarMonthView_Default #rcMView_Oct, .RadCalendarMonthView_Default #rcMView_Dec {
  border-right: 1px solid #e0e0e0; }
.RadCalendarMonthView_Default a {
  color: #333333; }
.RadCalendarMonthView_Default .rcSelected a {
  border-color: #8d8d8d #7d7d7d #6c6c6c;
  background: #828282 0 -1700px repeat-x url('/skins/default/Calendar/sprite.gif');
  color: #fff; }
.RadCalendarMonthView_Default #rcMView_PrevY a, .RadCalendarMonthView_Default #rcMView_NextY a {
  width: 17px;
  height: 14px;
  background-image: url('/skins/default/Calendar/sprite.gif');
  color: #ccc; }
.RadCalendarMonthView_Default #rcMView_PrevY a {
  background-position: 7px -196px; }
.RadCalendarMonthView_Default #rcMView_NextY a {
  background-position: 7px -496px; }
.RadCalendarMonthView_Default .rcButtons {
  padding: 6px 7px 5px; }
.RadCalendarMonthView_Default input {
  border-color: #a7a7a7 #7b7b7b #7b7b7b #a7a7a7;
  background: #e9e9e9 0 -2300px repeat-x url('/skins/default/Calendar/sprite.gif');
  color: #000;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 12px; }

/*time view*/
table.RadCalendarTimeView_Default {
  border-color: #868686;
  background: white;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 12px; }

.RadCalendarTimeView_Default th {
  border-bottom: 1px solid #c4c4c4;
  padding: 0 0 1px;
  background: #eaeaea 0 -1000px repeat-x url('/skins/default/Calendar/sprite.gif');
  color: #000;
  line-height: 23px; }

table.RadCalendarTimeView_Default td {
  border-color: #c5c5c5; }

.RadCalendarTimeView_Default a {
  color: #333333; }
.RadCalendarTimeView_Default td.rcSelected a {
  border-color: #8d8d8d #7d7d7d #6c6c6c;
  background: #828282 0 -1700px repeat-x url('/skins/default/Calendar/sprite.gif');
  color: #fff; }
.RadCalendarTimeView_Default td.rcHover a {
  border-color: #c4c4c4 #b2b2b2 #9e9e9e;
  background: #c5c5c5 0 -1600px repeat-x url('/skins/default/Calendar/sprite.gif');
  color: #000; }
.RadCalendarTimeView_Default .rcFooter {
  border-color: #c5c5c5; }

/*pickers*/
.RadPicker_Default .rcCalPopup,
.RadPicker_Default .rcTimePopup {
  background-image: url('/skins/default/Calendar/sprite.gif'); }
.RadPicker_Default .rcCalPopup {
  background-position: 0 0; }
.RadPicker_Default a.rcDisabled.rcCalPopup:hover {
  background-position: 0 0; }
.RadPicker_Default a.rcCalPopup:hover, .RadPicker_Default a.rcCalPopup:focus, .RadPicker_Default a.rcCalPopup:active {
  background-position: 0 -50px; }
.RadPicker_Default .rcTimePopup {
  background-position: 0 -100px; }
.RadPicker_Default a.rcDisabled.rcTimePopup:hover {
  background-position: 0 -100px; }
.RadPicker_Default a.rcTimePopup:hover, .RadPicker_Default a.rcTimePopup:focus, .RadPicker_Default a.rcTimePopup:active {
  background-position: 0 -150px; }

/*rtl*/
.RadCalendarRTL_Default .rcTitlebar .rcFastPrev {
  background-position: 1px -497px; }
.RadCalendarRTL_Default .rcTitlebar a.rcFastPrev:hover {
  background-position: 1px -547px; }
.RadCalendarRTL_Default .rcTitlebar .rcPrev {
  background-position: 3px -397px; }
.RadCalendarRTL_Default .rcTitlebar a.rcPrev:hover {
  background-position: 3px -447px; }
.RadCalendarRTL_Default .rcTitlebar .rcNext {
  background-position: 4px -297px; }
.RadCalendarRTL_Default .rcTitlebar a.rcNext:hover {
  background-position: 4px -347px; }
.RadCalendarRTL_Default .rcTitlebar .rcFastNext {
  background-position: 1px -197px; }
.RadCalendarRTL_Default .rcTitlebar a.rcFastNext:hover {
  background-position: 1px -247px; }

.RadCalendarMultiViewRTL_Default .rcTitlebar a.rcFastPrev:hover {
  background-position: 1px -947px; }
.RadCalendarMultiViewRTL_Default .rcTitlebar a.rcPrev:hover {
  background-position: 3px -847px; }
.RadCalendarMultiViewRTL_Default .rcTitlebar a.rcNext:hover {
  background-position: 4px -747px; }
.RadCalendarMultiViewRTL_Default .rcTitlebar a.rcFastNext:hover {
  background-position: 1px -647px; }


/**!
*
* Copyright 2013 LinkedIn Corp. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
.animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInUp{0%{opacity:0;-moz-transform:translateY(20px)}100%{opacity:1;-moz-transform:translateY(0)}}@-o-keyframes fadeInUp{0%{opacity:0;-o-transform:translateY(20px)}100%{opacity:1;-o-transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}.fade-in-up{-webkit-animation-name:fadeInUp;-moz-animation-name:fadeInUp;-o-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInDown{0%{opacity:0;-moz-transform:translateY(-20px)}100%{opacity:1;-moz-transform:translateY(0)}}@-o-keyframes fadeInDown{0%{opacity:0;-ms-transform:translateY(-20px)}100%{opacity:1;-ms-transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}.fade-in-down{-webkit-animation-name:fadeInDown;-moz-animation-name:fadeInDown;-o-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes fadeInRight{0%{opacity:0;-moz-transform:translateX(-20px)}100%{opacity:1;-moz-transform:translateX(0)}}@-o-keyframes fadeInRight{0%{opacity:0;-o-transform:translateX(-20px)}100%{opacity:1;-o-transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translateX(-20px)}100%{opacity:1;transform:translateX(0)}}.fade-in-right{-webkit-animation-name:fadeInRight;-moz-animation-name:fadeInRight;-o-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes fadeInLeft{0%{opacity:0;-moz-transform:translateX(20px)}100%{opacity:1;-moz-transform:translateX(0)}}@-o-keyframes fadeInLeft{0%{opacity:0;-o-transform:translateX(20px)}100%{opacity:1;-o-transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translateX(20px)}100%{opacity:1;transform:translateX(0)}}.fade-in-left{-webkit-animation-name:fadeInLeft;-moz-animation-name:fadeInLeft;-o-animation-name:fadeInLeft;animation-name:fadeInLeft}div.hopscotch-bubble .hopscotch-nav-button{font-weight:bold;border-width:1px;border-style:solid;cursor:pointer;margin:0;overflow:visible;text-decoration:none!important;width:auto;padding:0 10px;height:26px;line-height:24px;font-size:12px;*zoom:1;white-space:nowrap;display:-moz-inline-stack;display:inline-block;*vertical-align:auto;zoom:1;*display:inline;vertical-align:middle;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}div.hopscotch-bubble .hopscotch-nav-button:hover{*zoom:1;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25);box-shadow:0 1px 3px rgba(0,0,0,0.25)}div.hopscotch-bubble .hopscotch-nav-button:active{-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.25) inset;-moz-box-shadow:0 1px 2px rgba(0,0,0,0.25) inset;box-shadow:0 1px 2px rgba(0,0,0,0.25) inset}div.hopscotch-bubble .hopscotch-nav-button.next{border-color:#1b5480;color:#fff;margin:0 0 0 10px;text-shadow:0 1px 1px rgba(0,0,0,0.35);background-color:#287bbc;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#287bbc',endColorstr='#23639a');background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#287bbc),color-stop(100%,#23639a));background-image:-webkit-linear-gradient(top,#287bbc 0,#23639a 100%);background-image:-moz-linear-gradient(top,#287bbc 0,#23639a 100%);background-image:-o-linear-gradient(top,#287bbc 0,#23639a 100%);background-image:linear-gradient(top,#287bbc 0,#23639a 100%)}div.hopscotch-bubble .hopscotch-nav-button.next:hover{background-color:#2672ae;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#2672ae',endColorstr='#1e4f7e');background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#2672ae),color-stop(100%,#1e4f7e));background-image:-webkit-linear-gradient(top,#2672ae 0,#1e4f7e 100%);background-image:-moz-linear-gradient(top,#2672ae 0,#1e4f7e 100%);background-image:-o-linear-gradient(top,#2672ae 0,#1e4f7e 100%);background-image:linear-gradient(top,#2672ae 0,#1e4f7e 100%)}div.hopscotch-bubble .hopscotch-nav-button.prev{border-color:#a7a7a7;color:#444;text-shadow:0 1px 1px rgba(255,255,255,0.75);background-color:#f2f2f2;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#f2f2f2',endColorstr='#e9e9e9');background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#f2f2f2),color-stop(100%,#e9e9e9));background-image:-webkit-linear-gradient(top,#f2f2f2 0,#e9e9e9 100%);background-image:-moz-linear-gradient(top,#f2f2f2 0,#e9e9e9 100%);background-image:-o-linear-gradient(top,#f2f2f2 0,#e9e9e9 100%);background-image:linear-gradient(top,#f2f2f2 0,#e9e9e9 100%)}div.hopscotch-bubble .hopscotch-nav-button.prev:hover{background-color:#e8e8e8;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FFE8E8E8',endColorstr='#FFA9A9A9');background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,#e8e8e8),color-stop(13%,#e3e3e3),color-stop(32%,#d7d7d7),color-stop(71%,#b9b9b9),color-stop(100%,#a9a9a9));background-image:-webkit-linear-gradient(top,#e8e8e8 0,#e3e3e3 13%,#d7d7d7 32%,#b9b9b9 71%,#a9a9a9 100%);background-image:-moz-linear-gradient(top,#e8e8e8 0,#e3e3e3 13%,#d7d7d7 32%,#b9b9b9 71%,#a9a9a9 100%);background-image:-o-linear-gradient(top,#e8e8e8 0,#e3e3e3 13%,#d7d7d7 32%,#b9b9b9 71%,#a9a9a9 100%);background-image:linear-gradient(top,#e8e8e8 0,#e3e3e3 13%,#d7d7d7 32%,#b9b9b9 71%,#a9a9a9 100%)}div.hopscotch-bubble{background-color:#fff;border:5px solid #000;border:5px solid rgba(0,0,0,0.5);color:#333;font-family:Helvetica,Arial;font-size:13px;position:absolute;z-index:999999;-moz-background-clip:padding;-webkit-background-clip:padding;background-clip:padding-box}div.hopscotch-bubble.animate{-moz-transition-property:top,left;-moz-transition-duration:1s;-moz-transition-timing-function:ease-in-out;-ms-transition-property:top,left;-ms-transition-duration:1s;-ms-transition-timing-function:ease-in-out;-o-transition-property:top,left;-o-transition-duration:1s;-o-transition-timing-function:ease-in-out;-webkit-transition-property:top,left;-webkit-transition-duration:1s;-webkit-transition-timing-function:ease-in-out;transition-property:top,left;transition-duration:1s;transition-timing-function:ease-in-out}div.hopscotch-bubble.invisible{opacity:0}div.hopscotch-bubble.hide,div.hopscotch-bubble .hide,div.hopscotch-bubble .hide-all{display:none}div.hopscotch-bubble h3{color:#000;font-family:Helvetica,Arial;font-size:16px;font-weight:bold;line-height:19px;margin:-1px 15px 0 0;padding:0}div.hopscotch-bubble .hopscotch-bubble-container{padding:15px;position:relative;text-align:left;-webkit-font-smoothing:antialiased}div.hopscotch-bubble .hopscotch-content{font-family:Helvetica,Arial;font-weight:normal;line-height:17px;margin:-5px 0 11px;padding-top:8px}div.hopscotch-bubble .hopscotch-bubble-content{margin:0 0 0 40px}div.hopscotch-bubble.no-number .hopscotch-bubble-content{margin:0}div.hopscotch-bubble .hopscotch-bubble-close{color:#000;background:transparent url(../img/sprite-green-0.3.png) -192px -92px no-repeat;display:block;padding:8px;position:absolute;text-decoration:none;text-indent:-9999px;width:8px;height:8px;top:0;right:0}div.hopscotch-bubble .hopscotch-bubble-close.hide,div.hopscotch-bubble .hopscotch-bubble-close.hide-all{display:none}div.hopscotch-bubble .hopscotch-bubble-number{background:transparent url(../img/sprite-green-0.3.png) 0 0 no-repeat;color:#fff;display:block;float:left;font-size:17px;font-weight:bold;line-height:31px;padding:0 10px 0 0;text-align:center;width:30px;height:30px}div.hopscotch-bubble .hopscotch-bubble-arrow-container{position:absolute;width:34px;height:34px}div.hopscotch-bubble .hopscotch-bubble-arrow-container .hopscotch-bubble-arrow,div.hopscotch-bubble .hopscotch-bubble-arrow-container .hopscotch-bubble-arrow-border{width:0;height:0}div.hopscotch-bubble .hopscotch-bubble-arrow-container.up{top:-22px;left:10px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow{border-bottom:17px solid #fff;border-left:17px solid transparent;border-right:17px solid transparent;position:relative;top:-10px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow-border{border-bottom:17px solid #000;border-bottom:17px solid rgba(0,0,0,0.5);border-left:17px solid transparent;border-right:17px solid transparent}div.hopscotch-bubble .hopscotch-bubble-arrow-container.down{bottom:-39px;left:10px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow{border-top:17px solid #fff;border-left:17px solid transparent;border-right:17px solid transparent;position:relative;top:-24px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow-border{border-top:17px solid #000;border-top:17px solid rgba(0,0,0,0.5);border-left:17px solid transparent;border-right:17px solid transparent}div.hopscotch-bubble .hopscotch-bubble-arrow-container.left{top:10px;left:-22px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow{border-bottom:17px solid transparent;border-right:17px solid #fff;border-top:17px solid transparent;position:relative;left:7px;top:-34px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow-border{border-right:17px solid #000;border-right:17px solid rgba(0,0,0,0.5);border-bottom:17px solid transparent;border-top:17px solid transparent}div.hopscotch-bubble .hopscotch-bubble-arrow-container.right{top:10px;right:-39px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow{border-bottom:17px solid transparent;border-left:17px solid #fff;border-top:17px solid transparent;position:relative;left:-7px;top:-34px}div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow-border{border-left:17px solid #000;border-left:17px solid rgba(0,0,0,0.5);border-bottom:17px solid transparent;border-top:17px solid transparent}div.hopscotch-bubble .hopscotch-actions{margin:10px 0 0;text-align:right}

.RadUpload_tsp, .RadUpload_tsp a, .RadUpload_tsp input, .RadUploadProgressArea_tsp, .RadUploadProgressArea_tsp input
{
    font: normal 11px/10px "Segoe UI" ,Arial,sans-serif;
}
.RadUpload_tsp .ruStyled .ruFileInput
{
    border-color: #b2b2b2;
}
.RadUpload_tsp .ruFakeInput
{
    border-color: #b2b2b2 #e6e6e6 #f0f0f0 #ebebeb;
    color: #333333;
}
* html .RadUpload_tsp .ruFileWrap .ruInputHover
{
    border-color: #b2b2b2;
}
* + html .RadUpload_tsp .ruFileWrap .ruInputHover
{
    border-color: #b2b2b2;
}
.RadUpload_tsp .ruReadOnly .ruFakeInput
{
    background: #f2f2f2;
}

.RadUploadProgressArea_tsp .ruButton
{
    background-image: url('Upload/ruSprite.png');
    color: #000000;
}
span.RadUpload, RadUpload_tsp .ruFileWrap
{
    height: 38px;
}

.editPanel .RadAsyncUpload span.ruFileWrap
{
    height: 28px;
}

.RadUpload_tsp .ruFileWrap .ruButton, div.RadUpload_tsp .ruRemove, div.RadUpload_tsp .ruFileWrap .ruUpload, div.RadUpload_tsp .ruCancel
{
    -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f7f7f7), color-stop(1, #dfdfdf) );
    background: -moz-linear-gradient( center top, #f7f7f7 5%, #dfdfdf 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#dfdfdf');
    background-color: #f7f7f7;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #dcdcdc;
    display: inline-block;
    font-family: Trebuchet MS;
    font-size: 12px;
    font-weight: bold;
    padding: 1px 5px 0px 3px;
    text-decoration: none;
    text-shadow: 1px 0px 0px #ffffff;
    margin-left: 3px;
}

.RadUpload_tsp .ruFileWrap .ruButton
{
    position: relative;
    width: auto;
    height: 26px;
    line-height: 21px;
    top: 0px;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f7f7f7), color-stop(1, #dfdfdf) );
    background: -moz-linear-gradient( center top, #f7f7f7 5%, #dfdfdf 100% );
    font-weight: normal;
}

div.RadUpload_tsp .ruRemove, div.RadUpload_tsp .ruFileWrap .ruUpload, div.RadUpload_tsp .ruCancel
{
    position: relative;
    width: 68px;
    height: 24px;
    top: -2px;
}

div.RadUpload_tsp .ruRemove:hover, div.RadUpload_tsp .ruCancel:hover
{
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #f7f7f7) );
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #f7f7f7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    background-color: #dfdfdf;
    cursor: pointer;
    border: 1px solid #dcdcdc;
}

div.RadUpload_tsp .ruInputs .ruButtonHover, div.RadUpload_tsp .ruActions .ruButtonHover, div.RadUploadProgressArea_tsp .ruActions .ruButtonHover
{
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #f7f7f7) );
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #f7f7f7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    background-color: #dfdfdf;
    cursor: pointer;
    border: 1px solid #dcdcdc;
}

div.RadUpload_tsp .ruFileWrap .ruButtonHover
{
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #f7f7f7) );
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #f7f7f7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    background-color: #dfdfdf;
    cursor: pointer;
    border: 1px solid #dcdcdc;
}

.RadUploadSubmit
{
    background-image: url('Upload/ruSprite.png');
    color: #000000;
}
.RadUploadProgressArea_tsp .ruProgress
{
    border-color: #878787;
    background-image: url('Upload/ruSprite.png');
    background-color: #ffffff;
}
.RadUploadProgressArea_tsp .ruProgress li
{
    color: #666666;
}
.RadUploadProgressArea_tsp .ruProgress li.ruCurrentFile
{
    color: #212121;
}
.RadUploadProgressArea_tsp .ruProgress .ruBar
{
    border-color: #b0b0b0 #a3a3a3 #8f8f8f;
    background-image: url('Upload/ruSprite.png');
}
.RadUploadProgressArea_tsp .ruProgress .ruBar div
{
    background-image: url('Upload/ruProgress.gif');
}
.RadUploadProgressArea_tsp_rtl .ruProgress .ruBar div
{
    background-image: url('Upload/ruProgress.gif');
}
.RadUploadProgressArea_tsp .ruProgress .ruActions
{
    border-top-color: #dedede;
    background: #f0f0f0;
}
.RadUploadProgressArea_tsp .ruProgress .ruActions
{
    border-top-color: #828282;
    background: #f0f0f0;
}
.RadUpload_tsp .ruUploadInvalid
{
    background-repeat: no-repeat;
    background-position: 100% -297px;
    background-image: url('Input/sprite.gif');
}
.RadUpload_tsp_rtl .ruUploadInvalid
{
    background-position: 3px -297px;
}
.RadUpload_tsp .ruFileProgress, .RadUpload_tsp .ruFileProgressWrap
{
    background-image: url('Upload/AsyncProgress.png');
}
.RadUpload_tsp .ruFileProgress, .RadUpload_tsp_rtl .ruFileProgressWrap
{
    background-position: 0 0;
}
.RadUpload_tsp .ruFileProgressWrap, .RadUpload_tsp_rtl .ruFileProgress
{
    background-position: 100% 0;
}
.RadUpload_tsp .ruProgressStarted, .RadUpload_tsp_rtl .ruProgressComplete
{
    background-position: 0 -5px;
}
.RadUpload_tsp .ruProgressComplete, .RadUpload_tsp_rtl .ruProgressStarted
{
    background-position: 100% -5px;
}
.RadUpload_tsp .ruDropZone, .RadUpload_tsp_rtl .ruDropZone
{
    border-color: #9c9c9c;
    color: #6e6e6e;
    background-color: #ededed;
}



AnfoldGrid {
    display: table;
    position: relative;
    --fixed-header-top: 0px;
}

    AnfoldGrid table {
        text-align: left;
    }

    AnfoldGrid thead th {
        position: relative;
    }



    AnfoldGrid thead .resizableHandler {
        width: 10px;
        height: 100%;
        background-color: navy;
        position: absolute;
        right: 0px;
        top: 0px;
        cursor: e-resize;
        z-index: 999;
        opacity: 0;
        transition: opacity 0.1s ease-in-out;
    }

    AnfoldGrid thead th:hover .resizableHandler {
        opacity: 1;
    }

    AnfoldGrid table[FixedHeader],
    AnfoldGrid thead {
        background-color: #FFFFFF;
        color: #666;
        font-weight: 600;
        position: sticky;
        top: var(--fixed-header-top);
        z-index: 1000; /*1 more than page bottom for the dropdown filter options*/
    }


        AnfoldGrid thead th, AnfoldGrid thead tr:not(.filterRow) td {
            padding-left: 5px;
            padding-right: 5px;
            box-sizing: border-box;
        }

        AnfoldGrid thead th, AnfoldGrid > div:not(.FixedGridHeightWrapper) thead tr:not(.filterRow) td {
            padding-top: 10px;
        }


    AnfoldGrid table[anfoldgriddatatable] tbody td p {
        margin-block-start: 0;
        margin-block-end: 0;
    }

    AnfoldGrid table[anfoldgriddatatable] tbody td {
        padding-right: 5px;
        line-height: 20px;
        padding-top: 5px;
        padding-bottom: 3px;
        vertical-align: top;
        padding-left: 5px;
        word-wrap: break-word;
        box-sizing: border-box;
        overflow-x: hidden;
        vertical-align: middle;
    }

        AnfoldGrid table[anfoldgriddatatable] tbody td.colDatePicker {
            overflow-x: unset;
        }

        AnfoldGrid table[anfoldgriddatatable] tbody td.is-success {
            color: var(--green-strong);
        }

        AnfoldGrid table[anfoldgriddatatable] tbody td.is-danger {
            color: var(--red-strong);
        }

    AnfoldGrid > .moreOptionsWrapper .moreOptions {
        background-image: url(/Images/more_details_24.png);
        height: 24px;
        width: 24px;
        display: block;
        cursor: pointer;
    }

    AnfoldGrid > .moreOptionsWrapper {
        position: absolute;
        right: 8px;
        display: table;
        width: 20px;
        height: 20px;
        top: 5px;
        z-index: 10002;
    }

        AnfoldGrid > .moreOptionsWrapper .moreOptionsPopup {
            position: absolute;
            right: 100%;
            height: 100%;
            top: 0px;
            border: 1px solid #9c9c9c;
            padding: 13px;
            border-radius: 3px;
            display: table;
            background-color: #fffdfd;
        }

            AnfoldGrid > .moreOptionsWrapper .moreOptionsPopup .tspButton {
                /* padding-right: 0px;removed as we are adding field selector in now 
                width: 100%;*/
            }

        AnfoldGrid > .moreOptionsWrapper .downloadExcel {
            float: right;
            /*   background-image: url('/Images/excel_20.gif');
            height: 20px;
            width: 20px;
            display: block;
            cursor: pointer;*/
        }

    AnfoldGrid.RowClick table[anfoldgriddatatable] tbody tr:not(.emptyRowMessage):hover td {
        background-color: #bbbbbb;
        color: #FFF;
        cursor: pointer;
    }

    AnfoldGrid.RowClick table[anfoldgriddatatable] tbody tr.selected:not(.emptyRowMessage):hover td {
        background-color: #0f417e;
    }

    AnfoldGrid tbody tr.emptyRowMessage td {
        text-align: center;
        background-color: #FFFFFF;
    }

    AnfoldGrid thead[FixedHeaderPlaceHolder] tr {
    }

    AnfoldGrid thead.HiddenHeader tr:last-child th,
    AnfoldGrid thead.HiddenHeader th {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    AnfoldGrid thead.HiddenHeader {
        border: none;
        border-bottom: none;
    }
    /* AnfoldGrid thead th {
        border-bottom: 1px solid #666;
        padding-top: 19px;
        padding-bottom: 10px;
        line-height: 29px;
        text-align: left;
        padding-left: 10px; 
        padding-right: 10px;
    }*/

    AnfoldGrid thead tr:last-child th, AnfoldGrid thead tr.filterRow td {
        border-bottom: 1px solid #666;
        padding-top: 19px;
        /* padding-bottom: 10px;*/
        line-height: 29px;
        padding-left: 5px;
        padding-right: 5px;
        box-sizing: border-box;
        word-wrap: break-word;
    }

    AnfoldGrid table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

    AnfoldGrid th.sortCol, AnfoldGrid th.sortColAsc, AnfoldGrid th.sortColDesc {
        cursor: pointer;
        background-repeat: no-repeat;
        background-position-x: 100%;
        background-position-y: 50%;
    }

    AnfoldGrid thead tr.filterRow td {
        padding-top: 0px;
        padding-bottom: 5px;
    }

    AnfoldGrid table > thead > tr.filterRow div.input[contenteditable="true"] {
        background: none;
        border: unset;
        border: 0px;
        border-bottom: 1px solid #666;
        border-radius: unset;
        border-radius: 0px;
        outline: none;
        float: left;
        cursor: pointer;
        box-shadow: none;
        width: calc(100% - 24px);
    }

    AnfoldGrid th.sortCol {
    }

    AnfoldGrid th.sortColAsc {
        background-image: url('/Images/sort_asc.png');
    }

    AnfoldGrid th.sortColDesc {
        background-image: url('/Images/sort_desc.png');
    }

    AnfoldGrid th.sortColAsc, AnfoldGrid th.sortColDesc {
        background-color: #eee;
    }

    AnfoldGrid table[anfoldgriddatatable] tbody tr {
        border-bottom: 1px solid #CCCCCC;
        background-color: #FFF;
    }

        AnfoldGrid table[anfoldgriddatatable] tbody tr.selected {
            background-color: var(--grey-medium);
        }

    AnfoldGrid [ButtonType] {
        cursor: pointer;
        display: block;
        width: -moz-fit_content;
        width: fit-content;
        display: inline-block;
    }
/* IE10+*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    AnfoldGrid [ButtonType] {
        display: inline-block;
    }
}
/*TextOnly*/
/*Removed as it will now use the bulma styling
AnfoldGrid [ButtonType='0'] { 
    color: rgb(102, 102, 102);
    font-family: "Open Sans";
    font-size: 1.1em;
    font-weight: 600;
    background: none rgb(247, 247, 249);
    padding: 0px 5px 0px 5px;
    background-color: #f7f7f7;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 4px;
    border: 1px solid #b1b1b1;
    background: -moz-linear-gradient( center top, #f7f7f7 5%, #dfdfdf 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#dfdfdf');
    text-decoration: none;
    line-height: 24px;
}

    AnfoldGrid [ButtonType='0']:hover { 
        color: rgb(255, 255, 255);
        background: none rgb(30, 150, 213);
        border-color: rgb(126, 126, 126);
    }

    AnfoldGrid [ButtonType='0']:active { 
        position: relative;
        top: 1px;
        font-style: normal;
        user-select: none;
    }*/

AnfoldGrid [ButtonType='1'] {
    /* background-repeat: no-repeat;
        width: 100%;
        height: 0;
        padding-top: 100%;
       padding-top: 50%; /*cheeky fix so height will be full cell helps to centre
        background-position: center;*/
}

AnfoldGrid [ButtonType='2'] { /*TextImage*/
}

.FixedGridHeightWrapper {
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 998;
}


AnfoldGrid thead[FixedHeaderPlaceHolder] tr {
    overflow: hidden;
    visibility: hidden;
}


AnfoldGrid thead tr.filterRow th[ScrollBarWidth],
AnfoldGrid thead tr:last-child th[ScrollBarWidth],
AnfoldGrid thead th[ScrollBarWidth] {
    width: 10px;
    padding-left: 0px;
    padding-right: 0px;
}


AnfoldGrid thead[FixedHeaderPlaceHolder] tr td div {
    overflow-y: hidden;
    height: 1px;
}

AnfoldGrid .loading.loadingVisible {
    display: block;
}

    AnfoldGrid .loading.loadingVisible + table {
        /* min-height: 148px;*/
    }

AnfoldGrid .loading {
    position: absolute;
    background-color: #dadada70;
    display: none;
    background: linear-gradient( to bottom, #dadada70, #dadada70 98%, #66666670 99%, #66666670);
    background-size: 100% 39px;
    width: 100%;
    height: 100%;
}


    AnfoldGrid .loading > div {
        width: 45px;
        height: calc(100% - 38px);
        background-image: url(/Images/anfold-logo-small.png);
        background-repeat: no-repeat;
        background-position: center;
        animation-name: loading-icon-ani;
        animation-duration: 2s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        margin: 0px auto;
    }
/*this is without the fixed header from scrolling table*/
AnfoldGrid > .loading {
    top: 59px;
    /*min-height: 79px;*/
    height: calc(100% - 59px);
}

    AnfoldGrid > .loading.containsFilter {
        top: 70px;
        /*min-height: 79px;*/
        height: calc(100% - 70px);
    }

    AnfoldGrid > .loading > div {
        width: 40px;
        height: 40px;
        background-position: top;
        margin: 39px auto;
    }

/*Page panel*/

AnfoldGrid .anfoldGridPagePanel {
    width: 100%;
    height: 30px;
    display: table;
    position: sticky;
    bottom: 0;
    z-index: 999;
    background-color: #fff;
    border-top: 1px solid var(--grey-light);
}

AnfoldGrid div.anfoldGridMorePageButton,
AnfoldGrid .anfoldGridPageButton.navToPage {
    float: left;
    width: 25px;
    text-align: center;
    border: 1px solid #666;
    margin-left: 2px;
    margin-right: 2px;
    background-color: #EEE;
    line-height: 20px;
    border-radius: 5px;
    cursor: pointer;
    display: table;
    box-sizing: border-box;
    user-select: none;
    height: 22px;
    font-size: 1.2em;
}

AnfoldGrid .anfoldGridPageButton.firstPage,
AnfoldGrid .anfoldGridPageButton.prevPage,
AnfoldGrid .anfoldGridPageButton.nextPage,
AnfoldGrid .anfoldGridPageButton.lastPage {
    float: left;
    cursor: pointer;
    background-repeat: no-repeat;
    background-color: #2a91d0;
    width: 22px;
    border-radius: 4px;
    border: 1px solid #666;
    height: 20px;
    background-position-y: -2px;
    margin-left: 2px;
    margin-right: 2px;
}

AnfoldGrid .anfoldGridPageButton.firstPage {
    background-image: url('/Images/first_24.png');
}

AnfoldGrid .anfoldGridPageButton.prevPage {
    background-image: url('/Images/previous_24.png');
}

AnfoldGrid .anfoldGridPageButton.nextPage {
    background-image: url('/Images/next_24.png');
}

AnfoldGrid .anfoldGridPageButton.lastPage {
    background-image: url('/Images/last_24.png');
}

AnfoldGrid .smallPaginationTable .anfoldGridPageButtonWrapper {
    display: table;
    margin: 10px auto;
}

AnfoldGrid :not(.smallPaginationTable) .anfoldGridPageButtonWrapper {
    display: table;
    float: right;
    margin-right: 20px;
    margin-top: 10px;
}

AnfoldGrid .anfoldGridPageButton.navToPage.selected {
    /* background-color: #193255;*/
    background-color: #2a91d0;
    color: #FFF;
}


AnfoldGrid .anfoldGridPagingWrapper {
    height: 22px;
}

AnfoldGrid .anfoldGridMorePageButton, AnfoldGrid .anfoldGridPagingWrapper {
    /* margin-top: 1px;*/
}

AnfoldGrid .anfoldGridPagingWrapper {
    display: block;
    float: left;
    /*width: 50px;*/
    overflow-x: hidden;
    position: relative;
}

AnfoldGrid .anfoldGridPagingWrapperMoveable {
    display: block;
    display: flex; /*Seems only way to force necessary width*/
    left: 0;
    position: absolute;
}

AnfoldGrid .anfoldGridPagePanel {
    width: 100%;
    height: 40px;
    display: table;
    border-bottom: 1px solid #666;
}

AnfoldGrid .anfoldGridPageInfoPage {
    float: left;
    margin-left: 5px;
}


AnfoldGrid .anfoldGridPageInfoLabel, AnfoldGrid .anfoldGridCountInfoLabel {
    line-height: 40px;
    float: left;
    margin-right: 5px;
}

AnfoldGrid .anfoldGridPageSizeComboWrapper {
    float: right;
    margin-right: 15px;
    line-height: 25px;
    margin-top: 7px;
}

    AnfoldGrid .anfoldGridPageSizeComboWrapper span {
        margin-right: 5px;
    }

.ui-sortable-helper {
    display: table;
}

.anfoldGridSortable {
    border: 1px solid #fa8072;
    animation-name: backgroundPulse;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    box-sizing: border-box;
}

@keyframes backgroundPulse {
    0% {
        box-shadow: 0px 0px 5px 0px #fa8072;
    }

    50% {
        box-shadow: 0px 0px 19px 0px #fa8072;
    }

    100% {
        box-shadow: 0px 0px 5px 0px #fa8072;
    }
}


anfoldgrid table[anfoldgriddatatable] tbody td > div.input[contenteditable="true"] {
    width: 100%;
    margin-top: 0px;
}

anfoldgrid table[anfoldgriddatatable] tbody td > select {
    width: 100%;
}

anfoldgrid table[anfoldgriddatatable] tbody td > a > img {
    width: 100%;
}

anfoldgrid table[anfoldgriddatatable] tbody td > a > img {
    width: 100%;
}

anfoldgrid table[anfoldgriddatatable] tbody .anfoldHiddenColumn, anfoldgrid thead .anfoldHiddenColumn {
    display: none;
}


.filterWrapper {
    display: flex;
    width: 100%;
}

    .filterWrapper:hover, .filterWrapper:focus {
        border-bottom: 1px solid #515e6c;
    }

    .filterWrapper div.input[contenteditable="true"] {
        border-bottom: 0px;
    }

    .filterWrapper .anfoldDatePicker .dateWrapper {
        background: none;
    }

    .filterWrapper .dropdown .dropdown-trigger button {
        padding: 0;
        border: 0;
    }

    .filterWrapper .dropdown .dropdown-trigger .icon > i {
        background-repeat: no-repeat;
    }

    .filterWrapper:focus-within .anfoldDatePicker .datewrapper:hover, .filterWrapper:hover .anfoldDatePicker .datewrapper:hover {
        -webkit-box-shadow: none;
    }

    .filterWrapper:focus-within .anfoldDatePicker .showCalendar, .filterWrapper:hover .anfoldDatePicker .showCalendar {
        opacity: 1;
    }

    .filterWrapper .anfoldDatePicker .datewrapper {
        border: none;
        border-radius: unset;
        border-radius: 0px;
        padding: 0;
    }

    .filterWrapper .anfoldDatePicker {
        margin-right: 3px;
    }

        .filterWrapper .anfoldDatePicker .showCalendar {
            opacity: 0;
        }



    .filterWrapper .dropdown {
        display: inline-flex;
        position: relative;
        vertical-align: top;
        width: 12px;
    }

        .filterWrapper .dropdown .dropdown-close {
            position: fixed;
            display: none;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        .filterWrapper .dropdown .dropdown-trigger {
            width: 100%;
        }


        .filterWrapper .dropdown.is-active .dropdown-close {
            display: block;
        }

        .filterWrapper .dropdown .dropdown-trigger button.button {
            width: 100%;
        }

    .filterWrapper .button {
        font-weight: 500;
        line-height: 1em;
        box-sizing: border-box;
        display: flex;
        width: max-content;
    }

    .filterWrapper .button {
        font-weight: 500;
        line-height: 1em;
        box-sizing: border-box;
        display: flex;
        width: max-content;
    }

    .filterWrapper .button {
        font-weight: 500;
        line-height: 1em;
        box-sizing: border-box;
        display: flex;
        width: max-content;
    }

    .filterWrapper .button {
        background-color: #fcfcfc;
        border-color: #dbdbdb;
        border-width: 1px;
        color: #515e6c;
        cursor: pointer;
        justify-content: center;
        padding-bottom: calc(0.5em - 1px);
        padding-left: 1em;
        padding-right: 1em;
        padding-top: calc(0.5em - 1px);
        text-align: center;
        white-space: nowrap;
    }

        .filterWrapper .button .icon:first-child:last-child {
            margin-left: calc(-0.5em - 1px);
            margin-right: calc(-0.5em - 1px);
            width: 100%;
        }

        .filterWrapper .button .icon {
            height: 1.5em;
            width: 1.5em;
        }

    .filterWrapper .icon {
        align-items: center;
        display: inline-flex;
        justify-content: center;
        height: 1.5rem;
        width: 1.5rem;
    }

AnfoldGrid thead tr.filterRow td .filterWrapper div.input[contenteditable="true"] {
    border-bottom: none;
}

AnfoldGrid thead tr.filterRow td .filterWrapper .dropdown .dropdown-trigger .icon > i {
    background-repeat: no-repeat;
}

.filterWrapper .dropdown .dropdown-trigger .icon > i {
    background: url(/Images/chevron_down.svg);
    width: 100%;
    height: 100%;
    background-size: contain;
    background-position: center;
}

.filterWrapper .dropdown .dropdown-menu {
    padding-top: 0;
    padding-bottom: 0;
    z-index: 1000;
    width: min-content;
    min-width: 100%;
    display: none;
    left: 0;
    min-width: 12rem;
    padding-top: 4px;
    position: absolute;
    top: 100%;
}

.filterWrapper .dropdown.is-active .dropdown-menu {
    display: block;
}

.filterWrapper .dropdown .dropdown-menu .dropdown-content {
    padding-top: 0;
    width: 100%;
    padding-bottom: 0;
    max-height: 30em;
    overflow: auto;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border: 1px solid #d8d8d8;
}

.filterWrapper .dropdown-content {
    background-color: #fcfcfc;
    border-radius: 4px;
    box-shadow: 0 0.5em 1em -0.125em rgba(1,19,5,.1), 0 0 0 1px rgba(1,19,5,.02);
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
}

.filterWrapper .dropdown .dropdown-menu .dropdown-content a.dropdown-item {
    font-size: 1em;
}

    .filterWrapper .dropdown .dropdown-menu .dropdown-content a.dropdown-item.is-active, .filterWrapper .dropdown .dropdown-menu .dropdown-content button.dropdown-item.is-active {
        background-color: #475ec6;
        color: #fff;
    }

.filterWrapper .dropdown .dropdown-menu .dropdown-content a.dropdown-item {
    font-size: 1em;
}

.filterWrapper a.dropdown-item, button.dropdown-item {
    padding-right: 3rem;
    text-align: inherit;
    white-space: nowrap;
    width: 100%;
}

.filterWrapper .dropdown-item {
    color: #494949;
    display: block;
    font-size: .875rem;
    line-height: 1.5;
    padding: 0.375rem 1rem;
    position: relative;
}

AnfoldGrid .colAlignRight {
    text-align: right;
}

.googleButton {
    display: inline-block;
    height: 40px;
    background-color:#0995D4;
    padding: 1px;
    width: 185px;
    box-sizing: border-box;
    border-radius: 2px;
}

.googleButton > img,
.googleButton > div:first-of-type {
    float: left;
    border-radius: 2px;
}

.googleButton img {
    float: left;
    width: 18px;
    background-color: white;
    padding: 10px;
    border-radius: 1px;
}

.googleButton > div:first-of-type {
padding: 11px;
    font-family: 'Roboto', Tahoma, sans-serif;
    color: white;
    font-size: 14px;
    font-weight: 500;
    padding-left: 12px;
}

.anfold-combobox ::-ms-clear {
    display: none;
}

#divContentWrapper::-webkit-scrollbar, body::-webkit-scrollbar, ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: #DADADA;
}

    #divContentWrapper::-webkit-scrollbar:vertical, body::-webkit-scrollbar:vertical {
        border-left: 1px solid #C8C8C8;
    }

    #divContentWrapper::-webkit-scrollbar:horizontal, body::-webkit-scrollbar:horizontal {
        border-top: 1px solid #C8C8C8;
    }


#divContentWrapper::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb {
    background-color: #9BB7DC;
}

    #divContentWrapper::-webkit-scrollbar-thumb:active, body::-webkit-scrollbar-thumb:active {
        background-color: #354457;
    }

    #divContentWrapper::-webkit-scrollbar-thumb:vertical, body::-webkit-scrollbar-thumb:vertical {
        border-left: 1px solid #C8C8C8;
    }

    #divContentWrapper::-webkit-scrollbar-thumb:horizontal, body::-webkit-scrollbar-thumb:horizontal {
        border-top: 1px solid #C8C8C8;
    }

::-webkit-scrollbar-corner {
    background-color: #DADADA;
}


#divContentWrapper {
    /*  scrollbar-base-color: #C8C8C8;*/
    scrollbar-face-color: #9BB7DC;
    scrollbar-3dlight-color: #354457;
    scrollbar-highlight-color: #FFF;
    /* scrollbar-track-color: rgba(0, 0, 0, 0);
    scrollbar-arrow-color: black;
    scrollbar-shadow-color: #000;
    scrollbar-dark-shadow-color: #000;*/
}

select::-ms-expand {
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    /* IE 5-7 */
    filter: alpha(opacity=0);
    /* Good browsers :) */
    opacity: 0;
}




.editFormTitle h2 {
    margin-left: 5px;
    border-bottom: none;
    line-height: 42px;
    margin-bottom: 0px;
    margin-top: 0px;
    font-size: 1.2em;
    color: #FFF;
}

.editFormTitle input {
    margin-left: 5px;
    margin-top: 9px;
}


@media print {
    .noPrint {
        display: none;
    }

    .printArea {
        display: block;
    }
}



@media screen {
}

.filterPanel.datatablesFilterPanel {
    width: 350px;
    border-bottom: 1px solid black;
    height: 25px;
}

.datatables th {
    border-bottom: 1px solid black;
}

.fullWidthFilterPanel {
    display: table;
    width: 100%;
    margin-bottom: 10px;
}

    .fullWidthFilterPanel > div {
        float: left;
    }

        .fullWidthFilterPanel > div:not(first-child) {
            padding-left: 5px;
        }

.anfoldControlsPanel {
    display: flex;
    padding-left: 10px;
    flex-wrap: wrap;
    align-items: center;
}

    .anfoldControlsPanel > div {
        display: flex;
        align-items: center;
        margin-right: 1em;
    }

        .anfoldControlsPanel > div:not(.button) {
            padding: 0.5em 0;
        }

        .anfoldControlsPanel > div > label.label:not(:last-child) {
            margin-bottom: 0;
        }

.newUI .anfoldControlsPanel div.anfold-combobox {
    line-height: unset;
    margin-top: unset;
}

.anfoldControlsPanel label.label {
    margin-right: 5px;
}

.tspButton > div {
    line-height: 20px;
}

.tspButton, input[type="submit"], input[type="file"], input[type="number"] {
    display: inline-table;
    color: #444;
    font-size: 11px; /*font-weight:bold;*/
    cursor: pointer;
    padding: 2px 6px 2px 3px;
}

.backButtonPanel .tspButtonImage {
    padding: 0 5px 0 3px;
}

.tspButton > div {
    float: left;
    line-height: 20px; /*color:Black;*/
    text-decoration: underline;
    margin-left: 3px;
}

.newUI .tspButton {
    padding: 0px 5px 0px 5px;
}

    .newUI .tspButton.newUiBtnLoad,
    .newUI .tspButton.newUiBtnLoad:hover {
        cursor: pointer;
        background-image: url(/Images/load_20.gif);
        background-repeat: no-repeat;
        /* background-position-x: 30px; */
        background-position: center;
        background-color: #e2e2e2;
        color: #AAAAAA;
    }


.newUI .tspButton {
    padding: 0px 5px 0px 5px;
}

    .newUI .tspButton > div {
        line-height: 25px;
        margin-right: 3px;
        margin-left: 3px;
        /*width: calc(100% - 6px); MG 28/07/21 Removed because it causes some buttons to show 2 lines*/
    }

.tspButtonFill > div {
    text-decoration: none; /*color:Black;*/
}

.tspButton > img {
    border: none;
    float: left;
    margin-right: 3px;
}

.tspButton.tspButtonDisabled > img {
    opacity: 0.8;
}

.tspButtonFill.tspButtonDisabled, .tspButtonFill.tspButtonDisabled:hover {
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
    background: #f0f0f0;
    color: #8e8e8e;
    border: 1px solid #b1b1b1;
}

.newUI div.tspButtonGreen {
    background-color: green;
    color: #EEEEEE;
}

    .newUI div.tspButtonGreen.tspButtonFill:hover {
        background-color: #005700 !important;
        color: white !important;
    }

.newUI div.tspButtonRed {
    background-color: #f03a5f;
    color: #EEEEEE;
}

    .newUI div.tspButtonRed.tspButtonFill:hover {
        background-color: #830101 !important;
        color: white !important;
    }

.gridFieldSelector .tspButton {
    padding: unset;
}

.showGridFilter + .gridFieldSelector {
    right: 28px;
}

.gridFieldSelector {
    position: absolute;
    top: 8px;
    right: 11px;
}

.tspButtonFill:not([disabled]):not(.tspButtonDisabled):not(.newUiBtnLoad):hover {
    background: none;
    background-color: #1e96d5;
    border-color: #7E7E7E;
    color: #fff;
}

.tspButtonFill, .tspButtonDisabled {
    background: none;
    box-shadow: unset;
    background-color: #f7f7f9;
    cursor: pointer;
    -webkit-border-radius: 4px;
    color: #666666;
    font-size: 1.1em;
    font-weight: 600;
    -moz-border-radius: 6px;
    border-radius: 4px;
    border: 1px solid #b1b1b1;
    text-decoration: none;
}
/*removed as newUi above should be the default styling now 
.tspButtonFill:not([disabled]):not(.tspButtonDisabled):not(.newUiBtnLoad):hover {
    background: none;
    background-color: #dfdfdf;
    cursor: pointer;
    border-color: #7E7E7E;
    color: #111;
}
.tspButtonFill, .tspButtonDisabled {
    border-collapse: initial;
    -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background-color: #f7f7f7;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 4px;
    border: 1px solid #b1b1b1;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f7f7f7), color-stop(1, #dfdfdf) );
    background: -moz-linear-gradient( center top, #f7f7f7 5%, #dfdfdf 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#dfdfdf');
    text-decoration: none;
}
*/

/*
    JF 02/08/22 removed margin top 
.newUI .button, .newUI .tspButtonDisabled, .newUI .cmbButtonList {
    margin-top: 5px;
}*/

.newUI .button img {
    display: none;
}






.tspButtonDisabled {
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
}

.tspButtonFullWidth {
    background-color: #dadada;
    border-bottom: 1px solid #bababa;
    border-left: 1px solid #bababa;
    border-right: 1px solid #bababa;
    width: 100%;
    padding: 5px 0px 5px 0px;
}

    .tspButtonFullWidth > div {
        margin: auto 0;
        text-decoration: none;
        width: 100%;
        text-align: -webkit-center;
    }

input, select {
    margin: 0;
    outline: 0px;
}


:not(.innerButtonCircle) > .tspButtonFill:not([disabled]):active:not(.tspButtonDropDownList), .tspButtonDropDownList > div:last-child:active {
    position: relative;
    top: 1px;
}

.innerButtonCircle .tspButtonFill:active + #divApproveLabel {
    margin-top: 9px;
}

.innerButtonCircle > .tspButtonFill:active {
    margin-top: 6px;
}

.tspButtonDropDownList div, .tspButtonDropDownList div > img {
    float: left;
}

.tspButtonNoImage {
    /*padding: 2px 2px 2px 2px;*/
}

rgCommandRow, .filterPanel {
    background-color: #FFF;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-top: 1px solid #828282;
    border-left: 1px solid #828282;
    border-right: 1px solid #828282;
    display: table;
    padding-top: 6px;
}

.filterPanelBottom {
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom: 1px solid #828282;
}

.filterPanelNoTop {
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-top: none;
}

body {
    font-size: 11px;
    color: #333;
    text-align: justify;
    background-color: transparent;
    margin: 0px;
}

html {
    font-size: 13px;
}

body input {
    font-size: 13px;
}


table {
    font-size: inherit;
}

.tabStripWindow {
    border-left: solid 1px #555555;
    border-right: solid 1px #555555;
    border-bottom: solid 1px #555555;
    border-top: solid 1px #555555;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    margin-top: -1px;
}

.topSubMenuItem {
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
}

.adminCommandLink {
    font-weight: normal;
    font-size: 10px;
    color: #000066;
    text-align: left;
    text-decoration: underline;
    padding-right: 5px;
    padding-left: 5px;
    cursor: pointer;
}

.adminCommandLinkUnpadded {
    font-weight: normal;
    font-size: 10px;
    color: #000066;
    text-align: left;
    text-decoration: underline;
}

.label {
    font-size: 12px;
    color: black;
    background-color: transparent;
}


.labelMessage {
    font-size: 12px;
    color: Red;
    background-color: transparent;
    text-align: left;
}

.adminDashboardIconTable {
    width: 100%;
    height: 70px;
}


A:active {
    color: Black;
    font-style: oblique;
}

table.editTable {
    line-height: 22px;
}

/* The header column in the edit table, which usually lists the name of the fields being edited.
Edit tables are those used for editing Charge Codes, Employees, etc */
div .RadGrid_Default .rgMasterTable {
    border-collapse: collapse;
}


table.editTable > tr > td:first-child,
table.editTable > tbody > tr > td:first-child,
.editTableHeaderColumn {
    vertical-align: top;
    height: 32px;
    color: #555;
    line-height: 24px;
}

/* Class used for columns in the edit table. These are generally the columns which have the actual fields being edited*/
table.editTable > tr > td:nth-child(2),
table.editTable > tbody > tr > td:nth-child(2),
.editTableColumn {
    padding-top: 3px;
    vertical-align: top;
    text-align: left;
    padding-left: 6px;
    height: 28px;
}

/**************************************************************************************************************************************
New edit table
**************************************************************************************************************************************/

table.editFormTable {
    line-height: 33px;
}

    table.editFormTable input[type="text"] {
        line-height: 30px;
        color: #303030;
        border-radius: 3px;
        background: -webkit-linear-gradient(top,#f1f1f1 6%, #ffffff 20%);
    }



/**************************************************************************************************************************************/

.tablePanel {
    background-color: #FFFFFF;
}

table.tablePanel tbody td {
    padding: 5px 10px;
    cursor: pointer;
}

table.tablePane tr.odd {
    background-color: #f9f9f9;
}

table.tablePane tr.even {
    background-color: #f9f9f9;
}

table.tablePanel tbody th,
table.tablePanel tbody td,
table.tablePanel tbody th {
    border-top: 1px solid #ddd;
}

.tablePanelHeader {
    font-weight: bold;
    height: 30px;
    background-color: #DDDDDD;
    border-bottom: solid 1px black;
}

.tableRulesDescriptionHeader {
    font-weight: bold;
    height: 30px;
    border-bottom: solid 1px black;
}

.editPanelLabel {
    text-align: left;
    background-color: #dcdcdc;
    font-size: 12px;
    color: black;
}

H2 {
    border-bottom: solid 1px #DDDDDD;
    margin-bottom: 4px;
    display: inline-block;
    font-size: 13px;
    font-family: 'Roboto', sans-serif;
    color: #848484;
    font-weight: normal;
    display: block;
    margin-bottom: 12px;
    width: 100%;
    -webkit-margin-before: 5px;
    -webkit-margin-after: 9px;
}

.menuHover {
    font-size: 12px;
    color: white;
    background-color: #6699ff;
    cursor: hand;
    text-align: center;
}

.menuActive {
    font-size: 12px;
    color: white;
    background-color: #ccccff;
    cursor: hand;
    text-align: center;
}

.mainMenuHover {
    font-size: 12px;
    color: Gray;
    background-color: #000066;
    cursor: hand;
}

.mainMenuItem {
    font-size: 12px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    background-color: #91bcdc;
    cursor: hand;
}

.mainMenuDynamic {
    font-size: 12px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    background-color: #91bcdc;
    cursor: hand;
    padding: 3px;
}

.mainMenuDynamicHover {
    font-size: 12px;
    color: white;
    font-weight: bold;
    background-color: #3399ff;
    cursor: hand;
    text-align: left;
    padding: 3px;
}

.menuItem:Hover {
    font-size: 12px;
    color: white;
    background-color: #285574;
    cursor: hand;
    text-align: center;
    font-weight: bold;
}

.menuItem:Active {
    font-size: 12px;
    color: white;
    background-color: #5893bc;
    cursor: hand;
    text-align: center;
    font-weight: normal;
}


.menuItem {
    font-size: 12px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    background-color: #5893bc;
    cursor: hand;
    text-align: center;
    vertical-align: middle;
}

A.menuItem:link {
    font-size: 12px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    background-color: #5893bc;
    cursor: hand;
    text-align: center;
    vertical-align: middle;
}


.menuSelected {
    font-size: 12px;
    color: white;
    font-weight: bold;
    text-decoration: none;
    background-color: #006699;
}

.tableTitle {
    font-size: 15px;
    color: black;
}

.gridHeader {
    font-weight: bold;
    font-size: 13px;
    color: white;
    background-color: #5893bc;
    height: 10px;
}

.pageSection {
    font-size: 12px;
    color: #515151;
    font-family: 'Robot', sans-serif;
    min-height: 26px;
    background-color: #DDD;
    padding-left: 10px;
    line-height: 26px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    text-align: left;
    margin-top: 4px;
    margin-bottom: 2px;
    display: block;
    height: 25px;
}

.reportSectionTitle {
    top: 0px;
    position: relative;
    z-index: 5;
}

.reportSectionPanel {
    position: relative;
    top: -10px;
    background-color: #F2F2F2;
    padding-top: 15px;
    z-index: 0;
    border-radius: 8px;
}

.panel {
    border-right: black thin solid;
    border-top: black thin solid;
    border-left: black thin solid;
    border-bottom: black thin solid;
    background-color: #f0f0e8;
}

.panelHeader {
    background-color: #778899;
    font-weight: bold;
    font-size: 13px;
    color: black;
}


BUTTON {
    border-top-style: outset;
    border-right-style: outset;
    border-left-style: outset;
    border-bottom-style: outset;
}


TABLE#editTable {
    border-right: black thin solid;
    border-top: black thin solid;
    border-left: black thin solid;
    border-bottom: black thin solid;
    background-color: #DCDCDC;
}

H1 {
    font-weight: bold;
    font-size: 13pt;
    color: #787878;
    font-family: 'Open Sans',sans-serif;
}



.pageTitle {
    font-size: 16px;
    background-color: transparent;
    color: #245170;
}

.pageTitleUnderlined {
    border-left: #122270 solid;
    border-bottom: #122270 1px solid;
}

.ticketMessage {
    display: table;
    width: 100%;
    margin-bottom: 30px;
}

.ticketMessageHeader {
    font-family: arial,sans-serif;
    font-size: 13px;
    border: 1px solid black;
    height: 24px;
    padding-left: 5px;
}

.ticketMessageContent {
    font-size: 13px;
    border-left: 1px solid #A0A0A0;
    border-right: 1px solid #A0A0A0;
    border-bottom: 1px solid #A0A0A0;
    padding: 10px;
}

.ticketMessageHeader {
    font-size: 13px;
    border: 1px solid black;
    height: 24px;
    padding-left: 5px;
}


.ticketUserHeader,
.ticketSupportHeader {
    line-height: 36px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    height: 36px;
}

.ticketUserHeader {
    color: #EEEEEE;
    border-color: #2096d3;
    background-color: #2096d3;
    padding-left: 10px;
}

.ticketSupportHeader {
    color: #444444;
    border-color: #E0E0E0;
    background-color: #e0e0e0;
    background-image: url(/images/web_logo.png);
    background-repeat: no-repeat;
    background-position-y: 10px;
    background-position-x: 8px;
    padding-left: 21px;
}

    .ticketUserHeader div:first-child,
    .ticketSupportHeader div:first-child {
        float: left;
    }

    .ticketSupportHeader div:first-child {
        margin-left: 10px;
    }

    .ticketUserHeader div:last-child, .ticketSupportHeader div:last-child {
        float: right;
        margin-right: 10px;
    }



.ticketTableHeader {
    color: #ffffff;
    background-color: #b0b0b0;
    font-size: 14px;
}

.linkPanel {
}


input ~ label[for] {
    position: relative;
    /*  top: -5px; /*Removed as it was affecting checkboxes JF 27-02-2019*/
    margin-left: 4px;
    margin-right: 3px;
    line-height: 20px; /* to fit with the 1px margin and 18px size */
}

.mozcheckbox input ~ label[for] {
    /* top: 0px; Removed as it was affecting checkboxes JF 27-02-2019*/
}

a > img {
    border-width: 0px;
}

.editPanel .RadUpload .ruStyled .ruFileInput {
    /*position:relative;*/
}

.editPanel .ruInputs .ruBrowse {
    cursor: pointer;
    padding: 4px 6px 3px 3px;
    border: 1px solid #dcdcdc !important;
    text-shadow: 1px 0px 0px #ffffff;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f7f7f7), color-stop(1, #dfdfdf) );
    background: -moz-linear-gradient( center top, #f7f7f7 5%, #dfdfdf 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    width: 122px;
    height: 26px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    font-size: 12px;
    cursor: pointer;
}

.ruBrowse:hover {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #f7f7f7) );
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #f7f7f7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    background-color: #dfdfdf;
    cursor: pointer;
    border-color: #ababab;
}

.ruBrowse {
    background: none;
    list-style: none;
    font-size: 12px;
    cursor: pointer;
}

.ruInputs li {
    list-style: none;
    padding-left: 0px;
}

.RadUpdate .ruInputs {
    margin-left: -20px;
}


.ruObject {
    width: 400px !important;
}

.ticketMessageHeader div {
    float: left;
    padding-top: 1px;
}

    .ticketMessageHeader div:nth-child(2) {
        padding-left: 5px;
    }


.ticketMessageHeader span {
    margin-left: 5px;
}

.tspSortableList {
    list-style-type: none;
    margin: 0;
    padding: 0 0 2.5em;
    float: left;
    margin-right: 10px;
    min-height: 160px;
}

.sortableIncluded,
.sortableExcluded {
    margin: 0 5px 0 11px;
    padding: 4px;
    line-height: 23px;
    width: 260px;
    cursor: hand;
    cursor: pointer;
    color: var(--grey-dark);
}

.sortableIncluded {
    background-color: #0995d438;
    border-bottom: 1px solid #FFFFFF;
}

.sortableExcluded {
    border-bottom: 1px solid var(--grey-medium);
    background-color: #EEEEEE;
}

.subscriptionModuleDisabled, .subscriptionModuleEnabled {
    width: 100%;
    display: table;
    border-radius: 5px;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    box-sizing: border-box;
}

.subscriptionModuleEnabled {
    border: 1px solid green;
    background-color: #D0F5D0;
}

    .subscriptionModuleEnabled, .subscriptionModuleEnabled a {
        color: #183D18;
    }

.subscriptionModuleDisabled {
    border: 1px solid red;
    background-color: #F8B8B8;
}

    .subscriptionModuleDisabled, .subscriptionModuleDisabled a {
        color: #440000;
    }

.optionsPanel {
    width: 100%;
    margin-left: 5px;
}

    .optionsPanel > div {
        width: 100%;
        display: table;
        margin-bottom: 8px;
    }


.messagePanelError a {
    text-decoration: none;
}






tr td.unSelectedDate a.ui-state-active {
    background: #E6E6E6;
    color: #555555;
    border: 1px solid #d3d3d3;
}

.tspButton[disabled="true"] {
    opacity: 0.5;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #F7F7F7), color-stop(1, #DFDFDF) );
}

div[actionsDisabled="true"] .tspButton, div[actionsDisabled="True"] .tspButton {
    opacity: 0.5;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #F7F7F7), color-stop(1, #DFDFDF) );
}

nav_link {
    color: Purple;
    font-size: 12px;
}

.returnButton {
    width: 216px;
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

.passwordActionButtons .tspButton {
    width: 307px;
    margin-left: 7px;
    margin-top: 5px;
    left: 0;
    padding-left: 7px;
}

body.betaTester #divContent2 #divContentWrapper.mainContentBackground,
.mainContentBackground {
    background: #f4f5f7;
}

#divContentWrapper #divMainContentWrapper {
    /*min-height: 150px; JF 2023-09-12 removed as this prevents sticky styling once this height for full height of page*/
    box-sizing: border-box;
}

#divContentWrapper {
    overflow: auto;
    position: relative;
    box-sizing: border-box;
    width: 100%;
    background-color: var(--grey-light);
    display: flex;
    flex-direction: column
}

#pnlLoading .loadingCurtain {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    z-index: 99998;
    opacity: 0.5;
    -moz-opacity: 0.5;
    filter: alpha(opacity=50);
}

#pnlLoading .loading-blanket,
.loading-blanket {
    animation-name: loading-icon-ani;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    background-image: url('/images/anfold-logo-small.png');
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
}


@keyframes loading-icon-ani {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.pageTitle {
    margin-left: 18px;
}

#pnlLoading .loadingImg {
    position: fixed;
    top: 50%;
    width: 100%;
    z-index: 99999;
}

.pageTitleBar {
    font-family: "Open Sans";
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    display: table;
    width: 100%;
    /*position: fixed;*/
    /* left: 0; 
    top: 116px;*/
    width: 100%;
    height: 36px;
    border-bottom: 1px #CECECE solid;
    background-color: #DDDDDD;
    vertical-align: middle;
    display: flex;
    /* [if lte IE 8] min-width:1212px;*/
}

    .pageTitleBar pageTitle {
        margin-left: 5px;
    }

    .pageTitleBar > div {
        float: left;
    }

    .pageTitleBar .pageTitle {
        /* padding-left: 10px; */
        line-height: 45px;
        float: left;
        color: #FFF;
    }

    .pageTitleBar > a {
        float: right;
        margin-right: 5px;
        margin-top: 5px;
    }

    .pageTitleBar .horrizonalNavBtn {
        line-height: 38px;
        text-align: center;
        font-size: 13px;
        display: block;
        color: #dfdfdf;
        cursor: pointer;
        padding-right: 10px;
        padding-left: 10px;
        border-top: 5px solid;
        border-top-color: rgba(255, 255, 255, 0);
    }



        .pageTitleBar .horrizonalNavBtn:hover {
            color: #FFF;
        }

        .pageTitleBar .horrizonalNavBtn.selectedHorizontal {
            color: #FFF;
        }



.topButtonOuter.leftNavigationButtons .tspButton {
    padding: 0px 1px 0px 0px;
    width: 232px;
    height: 29px;
    box-sizing: border-box;
}

.topButtonOuter > div:first-child {
    width: 200px;
}

.topButtonOuter > div > div:last-child {
    float: left;
    width: 117px;
    line-height: 5px;
    margin: 0px;
    margin-top: 9px;
    margin-bottom: -2px;
    color: black;
    margin-left: 3px;
    text-decoration: none;
}

.topButtonOuter > div > div:first-child {
    float: left;
}

.topButtonOuter > div:last-child {
    height: 10px;
    width: 10px;
    float: right;
    margin-right: 5px;
    color: black;
    line-height: 14px;
    margin-left: -3px;
    background: aliceblue;
    background-color: transparent;
}

.HighlightBorder .topButtonOuter {
    border: 1px solid Red;
}


/* Rules Management Panel */
.rmDay {
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    height: 20px;
}

    .rmDay > div {
        width: 7px;
        border-left: 1px solid gray;
        height: 20px;
        display: inline-block;
        background-color: #EEEEEE;
        border-top: 1px solid gray;
    }

    .rmDay:last-child > div {
        border-bottom: 1px solid gray;
    }

.rmHeader {
    display: table;
}

    .rmHeader > .rmHour {
        height: 17px;
        width: 28px;
        border-left: 1px solid black;
        float: left;
        vertical-align: bottom;
        padding-left: 3px;
    }

    .rmHeader > rmDay:last-child {
        border-right: 1px solid black;
    }

.rmDay > .rmHour {
    border-left: 1px solid black;
}

.rmDay > div:last-child {
    border-right: 1px solid black;
}

.rmDaysWrapper {
    display: table;
    width: 100%;
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

.rmDayHeader {
    float: left;
    width: 120px;
    padding: 3px 10px 0px 5px;
    height: 13px;
    text-align: right;
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

.rmTable {
    display: table;
}

    .rmTable > div {
        clear: both;
        padding-top: 10px;
    }

        .rmTable > div span.label {
            float: left;
            width: 145px;
            padding: 3px 3px 0px 0px;
            text-align: right;
        }

        .rmTable > div span.rmTableSection {
            padding-left: 132px;
            font-weight: bold;
        }


        .rmTable > div span.formw {
            float: right;
            width: 770px;
            text-align: left;
        }

.rmRateLegendWrapper {
    margin-left: 135px;
    margin-top: 10px;
    display: table;
}

.rmRateLegend {
    border-width: 1px;
    border-style: solid;
    padding: 0px 3px 0px 3px;
    float: left;
    line-height: 21px;
    margin-right: 10px;
    border-radius: 4px;
    margin-top: 3px;
}

    .rmRateLegend:hover {
        cursor: pointer;
        cursor: hand;
    }

    .rmRateLegend > span {
    }

    .rmRateLegend > input[type=image] {
        margin-top: 2px;
        margin-right: 2px;
        float: right;
        margin-left: 3px;
    }
/****************************************/





.roundedTextBox {
    padding: 4px;
    padding-left: 7px;
    border: solid 1px #E4DFDF;
    outline: 0;
    width: 500px;
    background: #FFFFFF url('bg_form.png') left top repeat-x;
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, rgba(238, 238, 238, 0.46)), to(#FFFFFF));
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    resize: vertical;
}

html .customNavigationBar, #navigationBar, #divTopNoLeftScroll, #imgHide, #pnlLoading {
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}





.topButtonOuter:hover {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #f7f7f7) );
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #f7f7f7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    background-color: #dfdfdf;
    cursor: pointer;
}


.innerButtonCircle {
    position: relative;
    height: 34px;
}

    .innerButtonCircle .HideCircle > div:last-child {
        display: none;
    }

    .innerButtonCircle > div:last-child {
        width: 20px;
        height: 20px;
        background: red;
        border-radius: 50%;
        color: white;
        text-align: center;
        font-size: small;
        float: right;
        margin-right: 0px;
        margin-top: 8px;
        text-decoration: none;
        position: absolute;
        right: 17px;
        line-height: 20px;
    }

    .innerButtonCircle > .tspButton {
        position: absolute;
    }

.HighlightBorder .topButtonOuter {
    border: 1px solid Red;
}

html .customNavigationBar .RadMenu_Silk .rmRootLink.rmFocused {
    border-top: 4px solid #DDDDDD;
    color: #555555;
    background: #EEEEEE;
}

.RadPicker {
    height: 25px;
    /*margin-top: 4px; Removed because on client invoicing page the date pickers did not line up with other drop-downs*/
}

.loadingImg {
    cursor: wait;
}

.loadingCurtain {
    cursor: wait;
}




.permissionsPanelTitle {
    background-color: #36a0d7;
    color: White;
    border-top-right-radius: 5px;
    padding: 3px 0 4px 8px;
    margin-top: 10px;
    margin-bottom: 3px;
    line-height: 23px;
    font-size: 1.1em;
    box-sizing: border-box;
}

.permissionsPanelItems > div {
    display: table;
    margin-top: 2px;
}



.invoiceTableHeaders {
    float: left;
    width: 100px;
}

.invoiceTableRow {
    display: table;
    margin-top: 5px;
    line-height: 25px;
}

.ui-datepicker .ui-datepicker-title {
    margin: 0 2.3em;
    line-height: 1.7em;
    text-align: center;
}

.ui-datepicker-header {
    height: 26px;
}

body .ui-datepicker select.ui-datepicker-month {
    width: 45%;
}

body .ui-datepicker select.ui-datepicker-year {
    width: 39%;
}

body .ui-widget-header {
    border: none;
    background: #489cc9;
    color: #f3f3f3;
    font-weight: bold;
    line-height: 20px;
    margin-left: -3px;
    margin-right: -3px;
    margin-top: -3px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    right: .3em;
    top: 50%;
    width: 16px;
    margin: -10px 0 0 0;
    padding: 1px;
    height: 16px;
}

/***************************************************************************************************************************************
    Back button panel
 ****************************************************************************************************************************************/
.backButtonPanel {
    min-height: 10px;
}

.backButtonPanelSettings {
    margin-left: 204px;
}

.backButtonPanel > div {
    float: left;
    border-radius: 0px;
    border-bottom: 0;
    background: none;
    color: #dfdfdf;
    box-shadow: none;
    border: none;
}

    .backButtonPanel > div:hover {
        background: none;
        color: #FFF;
    }

    .backButtonPanel > div > div {
        font-size: 14px;
        text-decoration: none;
        line-height: 45px;
    }

.backButtonPanel .tspButton > img {
    border: none;
    float: left;
    margin-top: 15px;
    margin-right: 5px;
}

/*JQUERY DIALOG*/

.ui-dialog-content .ui-widget-content {
    display: table;
}

.ui-front {
    z-index: 1000;
}

#dialogConfirmation {
    line-height: 26px;
}



/* Submit for others panel*/

/*Collapsible Menu*/

.CollapsibleMenu {
    border-right: 1px solid #cecece;
    font-family: 'Roboto';
}

    .CollapsibleMenu .CollapsibleMenuButton {
        cursor: pointer;
        padding-left: 5px;
        line-height: 26px;
        border-left: 4px solid rgba(255, 255, 255, 0);
        font-size: 11px;
    }

    .CollapsibleMenu .CollapsibleMenuText {
        padding-left: 8px;
        line-height: 26px;
        font-size: 9.5px;
    }

body .CollapsibleMenu .CollapsibleMenuButton:hover:not(.CollapsibleMenuSelectedItem) {
    background: #C4D3EA;
}



body .CollapsibleMenu .CollapsibleMenuSelectedItem {
    border-color: #FF00FF;
}

.ui-accordion .ui-accordion-content {
    padding: 0px;
    border: 0px;
    border-bottom: 1px solid #DADADA;
}

.CollapsibleMenuSelectedItem {
    background: #C4D3EA;
}

.CollapsibleMenu .ui-state-default .ui-icon {
    background: none;
}

.CollapsibleMenu.ui-accordion .ui-accordion-header.ui-state-active {
    background: #1e96d5;
    color: #fff;
}

.CollapsibleMenu.ui-accordion .ui-accordion-content-active .CollapsibleMenuButton {
    /* background-color: #30bbdc;
    color: white;
*/
}

.CollapsibleMenu.ui-accordion .ui-accordion-header {
    cursor: pointer;
    /* position: relative; */
    border: none;
    /* margin: 2px 0 0 0; */
    /* padding: .5em .5em .5em .7em; */
    border-top-right-radius: inherit;
    border-top-left-radius: inherit;
    border-bottom: solid 1px #DDDDDD;
    font-size: 13px;
    font-family: 'Roboto', sans-serif;
    color: #848484;
    font-weight: normal;
    display: block;
    outline: none;
    background: none;
    background: #FFF;
    margin: unset;
    padding: unset;
    line-height: 34px;
    border-right: 1px solid #ddd;
}





.RadGrid_Default .rgHeader, .RadGrid_Default th.rgResizeCol, .RadGrid_Default .rgHeaderWrapper,
.RadGrid_Default .rgFilterRow {
    background: #FFF;
    color: #666;
    font-family: 'Open Sans';
    border-bottom: none;
    font-weight: 600;
}

.RadGrid .rgCheck input {
    width: 15px;
}

.RadGrid_Default {
    border-top: 0px;
    overflow-x: auto;
}

.RadGrid_Default {
    border-left: none;
    border-right: none;
}

    .RadGrid_Default .FilterableGrid.filterRowVisible tr:first-child th {
        padding-bottom: 0px;
    }

    /*.RadGrid_Default .rgMasterTable tbody {
        border-top: 1px solid #828282;
    }*/

    .RadGrid_Default .rgAltRow {
        background-color: #FFF;
    }

    .RadGrid_Default .rgHeader {
        position: relative;
        line-height: 15px;
        padding-top: 19px;
        padding-bottom: 10px;
    }

    .RadGrid_Default tr.rgFilterRow + tr .rgHeader {
        padding-bottom: 0px;
    }

    .RadGrid_Default tbody {
        color: #555555;
    }

    .RadGrid_Default thead {
        border-bottom: 1px solid #666;
    }

    .RadGrid_Default .rgHeader a,
    .RadGrid_Default .rgHeader {
        color: #626060;
    }

    .RadGrid_Default .rgRow + .rgAltRow td,
    .RadGrid_Default .rgAltRow + .rgRow td {
        /*border-top: 1px solid #000;
        border-color: #000;*/
        border-width: 1px 0 0 0;
        border-style: solid;
    }

    .RadGrid_Default .rgAltRow td,
    .RadGrid_Default .rgRow td {
        border: none;
    }

    .RadGrid_Default .rgAltRow td,
    .RadGrid_Default .rgRow td {
        border-color: #BBB;
    }

AnfoldGrid table[anfoldgriddatatable] tbody tr.agRow,
AnfoldGrid table[anfoldgriddatatable] tbody tr.agAltRow {
    border-bottom: none;
}

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

.RadGrid_Default .showGridFilter {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 8px;
    right: 11px;
    background-image: url('/Images/filter_20.png');
    cursor: pointer;
    border-radius: 4px;
}

.RadGrid_Default .pinFilter {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50px;
    right: 11px;
    background-image: url('/Images/filter_20.png');
    cursor: pointer;
    border-radius: 4px;
    right: 2px;
}


.RadGrid div.rgHeaderWrapper {
    border-left: 0 none;
    border-right: 0 none;
    padding: 0;
    overflow: hidden;
    border-bottom: 1px solid #666;
}

.RadGrid_Default .rgMasterTable .rgActiveCell, .RadGrid_Default .rgActiveRow, .RadGrid_Default .rgHoveredRow {
    background: none;
    color: #000;
}

.RadGrid_Default .rgMasterTable .rgSelectedCell, body .RadGrid_Default .rgSelectedRow td {
    background: #1453a0;
    color: #fff;
}

.RadGrid_Default .rgHeaderDiv {
    background: none;
    border: none;
}
/*.RadGrid_Default .rgFilterRow{
    display:none;
}
.RadGrid_Default thead:hover .rgFilterRow{
    display:table-row;
}*/
.RadGrid_Default .rgFilter, .RadGrid_Default .rgFilter:hover {
    background-image: url(/Images/search_16.png);
    background-repeat: no-repeat;
    background-position: unset;
    width: 16px;
    background-position-y: bottom;
    height: 16px;
    outline: none;
}

.rgNoRecords div {
    text-align: center;
    color: var(--red-strong);
}

table input[type=text].rgFilterBox {
    background: none;
    border: unset;
    border: 0px;
    border-bottom: 1px solid #666;
    border-radius: unset;
    border-radius: 0px;
    outline: none;
    float: left;
    cursor: pointer;
    box-shadow: none;
}


.UpdatesMessagePanelBlur {
}

.UpdatesMessagePanelOuter {
    position: absolute;
    border: 1px solid black;
    top: 0;
    left: 0;
    width: 800px;
    height: 600px;
    background-color: #C8C8C8;
    border-radius: 5px 5px 5px 5px;
    z-index: 1006;
}

.UpdatesMessagePanelInner {
    height: 89%;
    overflow-y: scroll;
    background-color: #C8C8C8;
    z-index: 1006;
}

.UpdatesMessagePanelTop {
    background: rgb(185,185,185); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(185,185,185,1) 0%, rgba(163,163,163,1) 41%, rgba(132,132,132,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(185,185,185,1)), color-stop(41%,rgba(163,163,163,1)), color-stop(100%,rgba(132,132,132,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(185,185,185,1) 0%,rgba(163,163,163,1) 41%,rgba(132,132,132,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(185,185,185,1) 0%,rgba(163,163,163,1) 41%,rgba(132,132,132,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(185,185,185,1) 0%,rgba(163,163,163,1) 41%,rgba(132,132,132,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(185,185,185,1) 0%,rgba(163,163,163,1) 41%,rgba(132,132,132,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b9b9b9', endColorstr='#848484',GradientType=0 ); /* IE6-9 */
    height: 50px;
    z-index: 1006;
    border-radius: 5px 5px 0 0;
    border-bottom: 1px solid black;
}

.UpdatesMessagePanelMessage {
    background-color: transparent;
    z-index: 1006;
    margin: 10px 0px 0px 0px;
}

.UMPtitle {
    margin-top: 5px;
    margin-left: 10px;
    font-size: 10pt;
    font-weight: bold;
}

.UMPdate {
    margin-left: 10px;
    font-size: 6pt;
}

.UMPCross {
    background: rgb(231,231,231); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(231,231,231,1) 0%, rgba(238,238,238,1) 31%, rgba(225,225,225,1) 69%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(231,231,231,1)), color-stop(31%,rgba(238,238,238,1)), color-stop(69%,rgba(225,225,225,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(238,238,238,1) 31%,rgba(225,225,225,1) 69%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(238,238,238,1) 31%,rgba(225,225,225,1) 69%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(238,238,238,1) 31%,rgba(225,225,225,1) 69%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(231,231,231,1) 0%,rgba(238,238,238,1) 31%,rgba(225,225,225,1) 69%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7e7e7', endColorstr='#e1e1e1',GradientType=0 ); /* IE6-9 */
    width: 18px;
    height: 18px;
    cursor: pointer;
    z-index: 9999999;
    border-radius: 3px 3px 3px 3px;
    border: 1px solid #b7b7b7;
}

    .UMPCross:hover {
        border: 1px solid #828282;
    }

.UpdatesMessagePanelMessageTop {
    background: rgb(226,226,226); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(204,204,204,1) 75%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,226,226,1)), color-stop(75%,rgba(204,204,204,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(204,204,204,1) 75%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(204,204,204,1) 75%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(204,204,204,1) 75%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(226,226,226,1) 0%,rgba(204,204,204,1) 75%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
    height: 41px;
    z-index: 1006;
    border-radius: 5px 5px 0 0;
    border: 1px solid #848484;
    border-bottom: none;
}

.UpdatesMessagePanelMessageBottom {
    background-color: #f5f5f5;
    z-index: 1006;
    margin-top: -6px;
    padding: 0px 10px 0px 10px;
    border-radius: 0px 0px 5px 5px;
    border: 1px solid #848484;
}

.UpdateHeading1 {
    color: #001f51;
    font-size: 20pt;
    font-weight: bold;
}

.DismissNotice {
    font-size: 8pt;
}

.UpdatesMessagePanelOuter::-webkit-scrollbar {
    width: 8px;
}

.UpdatesMessagePanelOuter::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
    border-radius: 5px;
}

.UpdatesMessagePanelOuter::-webkit-scrollbar-thumb {
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.5);
}

input[type='text'][disabled='disabled'].aspNetDisabled {
    background: #ECECEC;
}

/*ComboBox widget*/
/*
select:not([enabled="false"]) + .anfold-combobox input 
}*/

.anfold-combobox {
    position: relative;
    display: inline-block;
}

.ui-dialog-content .anfold-combobox .ui-widget-content {
    display: inherit;
}

.anfold-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    /* margin-left: -1px;*/
    padding: 0;
}

/* Added newUI here otherwise the dropdown input is smaller than the arrow button when newUI is used in some cases **/
.anfold-combobox-input, div.newUI input[type=text].anfold-combobox-input {
    cursor: pointer;
    margin: 0;
    padding: 4px 6px;
    color: #555;
    outline: 0;
    width: calc(100% - 25px);
    height: 28px;
}

.anfold-combobox .ui-state-default {
    background: -webkit-linear-gradient(#e5e5e5 0%, #FeFeFe 15%);
}

.anfold-combobox .ui-corner-left {
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
}

.anfold-autocomplete-autocomplete .ui-state-active, .anfold-combobox-autocomplete .ui-state-active {
    border: none;
    margin: 0;
    margin-left: 1px;
    background: #e4e4e4;
}

.ui-autocomplete {
    line-height: 22px;
}

.anfold-combobox .anfold-combobox-input {
    border-left: 1px solid #d3d3d3;
}

.anfold-combobox .ui-button,
.anfold-combobox .anfold-combobox-input {
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    box-sizing: border-box;
}

.anfold-combobox-autocomplete {
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 10001;
    max-height: 400px;
}

.anfold-combobox .ui-button {
    background: -webkit-linear-gradient(#e5e5e5 0%, #FeFeFe 15%);
    outline: none;
    border-left: none;
    width: 25px;
}

    .anfold-combobox .ui-button:active, .anfold-combobox .ui-button:hover {
        border-left: none;
        outline: none;
    }

select[enabled="disabled"] + .anfold-combobox input {
    background: #f0f0f0;
    color: #8e8e8e;
}

select[enabled="disabled"] + .anfold-combobox a {
    background: #f0f0f0;
}

.anfold-combobox[enabled="false"] .ui-button:hover .ui-icon {
    background-image: url(https://code.jquery.com/ui/1.12.0/themes/smoothness/images/ui-icons_888888_256x240.png);
}

.anfold-combobox .ui-button {
    border-right: 1px solid #d3d3d3;
    border-left: none;
}

    .anfold-combobox .ui-button:active {
        background: -webkit-linear-gradient(#e5e5e5 0%, #FeFeFe 15%);
        border-top: 1px solid #d3d3d3;
        border-right: 1px solid #d3d3d3;
        border-bottom: 1px solid #d3d3d3;
    }

    .anfold-combobox .ui-button span {
        outline: none;
    }

.anfold-combobox-curved + .anfold-combobox .ui-corner-right {
    border-top-right-radius: 50%;
    border-bottom-right-radius: 50%;
}


/*AnfoldComboBox PlaceHolder*/
.anfoldComboBoxPlaceholder > div {
    float: left;
    background-color: #FFF;
    height: 25px;
    box-sizing: border-box;
    padding: 5px;
    line-height: 16px !important;
    border: 0px solid #d3d3d3;
    width: 100%;
}

    .anfoldComboBoxPlaceholder > div:first-child {
        width: calc(100% - 25px);
        border-top-left-radius: 3px;
        border-bottom-left-radius: 3px;
        border-width: 1px 0px 1px 1px;
        overflow: hidden;
    }

    .anfoldComboBoxPlaceholder > div:last-child {
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
        border-width: 1px;
        width: 25px;
        vertical-align: middle;
        background-repeat: no-repeat;
        background-image: url(https://ajax.googleapis.com/ajax/libs/jqueryui/1.14.1/themes/smoothness/images/ui-icons_888888_256x240.png);
        background-position: -62px -12px;
    }



.anfoldComboBoxTextboxPlaceholder {
    width: 100%;
    line-height: 16px !important;
    text-align: center;
    padding: 6px 6px;
    box-sizing: border-box;
    border: 1px solid #d3d3d3;
    border-radius: 3px;
    background: -webkit-linear-gradient(#e5e5e5 0%, #FeFeFe 15%);
    border: 1px solid #d3d3d3;
    overflow: hidden;
}

/*AutoComplete widget*/
input[type="text"][enabled="disabled"].anfold-autocomplete {
    background: #f0f0f0;
    color: #8e8e8e;
}

input[type="text"].anfold-autocomplete {
    width: 100%;
    outline: 0;
    background: -webkit-linear-gradient(#e5e5e5 0%, #FeFeFe 15%);
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
    -moz-border-radius: 6px;
    border-radius: 3px;
    color: #333;
    padding: 4px 6px;
    font-weight: normal;
    font-family: Verdana, Arial, sans-serif;
    font-size: 1.1em;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(211, 211, 211);
    border-image: initial;
    cursor: pointer;
}

.anfold-autocomplete-autocomplete {
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 1001;
}

/*CUSTOM FIELD */

.customFieldWrapper {
    display: table;
    display: inline-flex;
}

.customFieldControl {
    float: left;
    margin-left: 5px;
    width: 70%;
    max-width: -webkit-calc(70% - 5px);
    max-width: -moz-calc(70% - 5px);
    max-width: calc(70% - 5px);
    margin: auto 0;
    min-width: -webkit-calc(30% - 5px);
    min-width: -moz-calc(30% - 5px);
    min-width: calc(30% - 5px);
    display: table;
}

.customFieldName {
    float: left;
    min-width: -webkit-calc(30% - 5px);
    min-width: -moz-calc(30% - 5px);
    min-width: calc(30% - 5px);
    max-width: -webkit-calc(50% - 5px);
    max-width: -moz-calc(50% - 5px);
    max-width: calc(50% - 5px);
    display: table;
}

.customFieldPanel {
    display: table;
}


.douchebag_safari {
    position: fixed;
    width: 1px;
    left: -50px;
}

    .douchebag_safari input {
        width: 1%;
    }


/*JQueryCheckBoxList*/
/* HORIZONTAL BOX CSS*/

.JQueryCheckBoxList_Horizontal > div {
    float: left;
}

    .JQueryCheckBoxList_Horizontal > div:nth-child(2) > label {
        border-bottom-left-radius: 5px;
        border-top-left-radius: 5px;
    }

    .JQueryCheckBoxList_Horizontal > div:last-child > label {
        border-bottom-right-radius: 5px;
        border-top-right-radius: 5px;
    }

.JQueryCheckBoxList_Horizontal span:first-child {
    display: none;
}

.JQueryCheckBoxList_Horizontal span {
    margin-left: 10px;
    padding-left: 5px;
}


.JQueryCheckBoxList_Horizontal {
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-before: 0px;
    -webkit-padding-start: 0px;
    -webkit-padding-end: 0px;
    -webkit-padding-after: 0px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-block-start: 0px;
    padding-block-end: 0px;
    padding-inline-start: 0px;
    padding-inline-end: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}


    .JQueryCheckBoxList_Horizontal .ui-checkboxradio-label {
        border-bottom-left-radius: 0px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        cursor: pointer;
        box-shadow: none;
        border: 1px solid #999999;
        margin-left: 0px;
        margin-right: -4px;
    }

    .JQueryCheckBoxList_Horizontal.jqCheckbox label.ui-button, JQueryCheckBoxList_Horizontal.jqCheckbox label.ui-button:hover {
        background-image: url('/Images/cross.svg');
        background-repeat: no-repeat;
        background-position-x: 6px;
        background-position: 6px;
        background-size: 10px;
    }

    .JQueryCheckBoxList_Horizontal.jqRadio label.ui-button, .JQueryCheckBoxList_Horizontal.jqRadio label.ui-button:hover {
        padding-left: 0px;
    }

.newUI div .jqCheckbox {
    margin-top: 6px;
}

.hmrcEmployeeStatement {
    line-height: 18px;
}

table.hmrcEmployeeStatement tr td:first-child {
    width: 20px;
}

table.hmrcEmployeeStatement tr td {
    padding-bottom: 6px;
}

    table.hmrcEmployeeStatement tr td:last-child {
        text-align: justify;
    }

table.hmrcNewStarter tr.newQuestion td {
    padding-top: 15px;
}



.JQueryCheckBoxList_Horizontal.jqCheckbox label.ui-button.ui-state-active {
    background-image: url('/Images/tick.svg');
    background-repeat: no-repeat;
    background-position-x: left;
    margin-left: 0px;
    margin-right: -4px;
    background-size: 21px;
}
/*VERTICAL BOX WITH SPACE*/

.JQueryCheckBoxList_Vertical span:first-child {
    display: none;
}

.JQueryCheckBoxList_Vertical > div > label {
    width: 100%;
    padding-left: 25px;
    text-align: left;
    margin-bottom: 5px;
}


.JQueryCheckBoxList_Vertical {
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-before: 0px;
    -webkit-padding-start: 0px;
    -webkit-padding-end: 0px;
    -webkit-padding-after: 0px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-block-start: 0px;
    padding-block-end: 0px;
    padding-inline-start: 0px;
    padding-inline-end: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}

    .JQueryCheckBoxList_Vertical .ui-checkboxradio-label {
        cursor: pointer;
        box-shadow: none;
    }

    .JQueryCheckBoxList_Vertical label.ui-button, .JQueryCheckBoxList_Vertical label.ui-button:hover {
        background-image: url('/Images/white_cross_10.png');
        background-repeat: no-repeat;
        background-position-x: 6px;
        background-position: 6px;
        border: 1px solid #999999;
        margin-left: 0px;
        margin-right: -4px;
    }

        .JQueryCheckBoxList_Vertical label.ui-button.ui-state-active, .JQueryCheckBoxList_Vertical label.ui-button.ui-state-active:hover {
            background-image: url('/Images/white_tick_10.gif');
            background-repeat: no-repeat;
            background-position-x: 6px;
            background-position: 6px;
            margin-left: 0px;
            margin-right: -4px;
        }

/*Vertical NO SPACE CHECKBOX */

.JQueryCheckBoxList_VerticalNoSpace span:first-child {
    display: none;
}

.JQueryCheckBoxList_VerticalNoSpace > div > label {
    width: 100%;
    text-align: left;
    padding-left: 25px;
    border: none;
}

.JQueryCheckBoxList_VerticalNoSpace .ui-checkboxradio-label {
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    cursor: pointer;
    box-shadow: none;
}

.JQueryCheckBoxList_VerticalNoSpace {
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-before: 0px;
    -webkit-padding-start: 0px;
    -webkit-padding-end: 0px;
    -webkit-padding-after: 0px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-block-start: 0px;
    padding-block-end: 0px;
    padding-inline-start: 0px;
    padding-inline-end: 0px;
    padding-left: 0px;
    padding-right: 0px;
}

    .JQueryCheckBoxList_VerticalNoSpace > div:nth-child(2) > label {
        border-top-right-radius: 5px;
        border-top-left-radius: 5px;
    }

    .JQueryCheckBoxList_VerticalNoSpace > div:last-child > label {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .JQueryCheckBoxList_VerticalNoSpace .ui-checkboxradio-label {
        cursor: pointer;
        box-shadow: none;
    }

    .JQueryCheckBoxList_VerticalNoSpace label.ui-button, .JQueryCheckBoxList_VerticalNoSpace label.ui-button:hover {
        background-image: url('/Images/white_cross_10.png');
        background-repeat: no-repeat;
        background-position-x: 6px;
        background-position: 6px;
        border: none;
        margin-left: 0px;
        margin-right: -4px;
    }

        .JQueryCheckBoxList_VerticalNoSpace label.ui-button.ui-state-active, .JQueryCheckBoxList_VerticalNoSpace label.ui-button.ui-state-active:hover {
            background-image: url('/Images/white_tick_10.gif');
            background-repeat: no-repeat;
            background-position-x: 6px;
            background-position: 6px;
            margin-left: 0px;
            margin-right: -4px;
        }
/*END OF Checkbox CSS SECTION*/



.ContentPaddingWrapper {
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 10px;
    height: calc(100% - 45px);
    box-sizing: border-box;
}

.NoContentPaddingWrapper {
    border-left: none;
    border-right: none;
    width: 100%;
    height: calc(100% - 45px);
}


/** Downloads Panel*/


#pnlJobPrgress,
#pnlReportProgress {
    padding-left: 9px;
    padding-right: 12px;
    margin-top: 10px;
    line-height: 20px;
}


#pnlReportProgress {
    /*background-color: #dddddd;*/
}

    #pnlReportProgress div.downloadStatus {
        width: 100%;
        display: table;
        padding: 3px 0 5px 0;
    }

    #pnlReportProgress div.downloadProgressWrapperFixed,
    #pnlReportProgress div.downloadProgressWrapper {
        border: 1px solid #DDDDDD;
        border-radius: 4px;
        width: 100%;
    }

    #pnlReportProgress div.downloadProgressWrapperFixed {
        background-color: #DDDDDD;
        height: 35px;
    }

    #pnlJobProgress div.jobProgressText,
    #pnlReportProgress div.downloadProgressFixedText {
        float: left;
        margin-left: 5px;
        line-height: 33px;
    }

    #pnlJobProgress div.jobProgressFixed,
    #pnlReportProgress div.downloadProgressFixed {
        background: url('/images/ajax_loader_24.gif') no-repeat 5px 5px;
        display: block;
        width: 30px;
        height: 35px;
        float: left;
        top: 5px;
    }

    #pnlReportProgress div.downloadProgress {
        background-color: green;
        display: table;
        line-height: 35px;
        color: white;
        padding-left: 5px;
        padding-right: 5px;
    }


/*Fix for the right hand menu to not overflow on the page*/
#MenuPanel2 li:first-child > ul.dropdown-menu {
    left: -70px;
}


.divAdminProfileTopRight {
    float: left;
}

.divTriangleBorder {
    display: block;
    border-top: 5px solid #888888;
    border-bottom: 0px solid transparent;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    width: 0px;
    height: 0px;
}

.divAdminProfileTopRight:hover .divTriangleBorder {
    border-top: 5px solid #000000;
    border-bottom: 0px solid transparent;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    width: 0px;
    height: 0px;
}

.profileButtonDropdown {
    width: 43px;
    background-color: transparent;
    border: none;
    height: 38px;
}

.profileButtonDropdown {
    cursor: pointer;
}


.profileButtonDropdownContent {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    width: 160px;
    font-size: 13px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    text-align: left;
    right: 0px;
    z-index: 1001;
    top: 100%;
}

    .profileButtonDropdownContent a {
        color: black;
        text-decoration: none;
        display: block;
        line-height: 32px;
        padding-left: 8px;
        cursor: pointer;
    }

    .profileButtonDropdownContent div {
        font-size: 11px;
        text-align: right;
        line-height: 19px;
        padding: 0;
        /* margin-right: 5px; */
        border-bottom: 1px solid #dedede;
        padding-right: 10px;
    }




    .profileButtonDropdownContent a:hover {
        background-color: #e7e7e7;
    }



.supportTicketHints {
    float: right;
    position: fixed;
    right: 0;
    width: 520px;
    background-color: white;
    height: 100%;
    top: 156px;
    border-left: 1px solid #aaaaaa;
    font-size: 1.2em;
    line-height: 20px;
}

    .supportTicketHints h2 {
        color: white;
    }


.ticketSubject {
    font-size: 1.4em;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
    color: #848484;
}

.supportTicketHints > div {
    margin-left: 10px;
    /* margin-right: 10px; */
    border-left: 1px solid rgb(170, 170, 170);
    background-color: green;
    color: white;
    border-top-left-radius: 17px;
    border-bottom-left-radius: 17px;
    line-height: 24px;
    padding: 20px;
}

select[disabled='disabled'] {
    background-color: #dedede;
}

.helpButton {
    background-image: url('/Images/help_24.png');
    height: 24px;
    width: 24px;
    display: block;
    cursor: pointer;
}

/* .helpButton:hover {
        animation-name: bounce;
        animation-duration: 1s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }*/

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-10px);
    }

    60% {
        transform: translateY(-5px);
    }
}

.hideTelerikSelect > input {
    display: none;
}

/*.anfold-combobox-curved+.anfold-combobox*/

.textbox-style + .anfold-combobox .anfold-combobox-toggle {
    display: none;
}

.textbox-style + .anfold-combobox .anfold-combobox-input {
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
    text-align: center;
}

/*.textbox-style input[type=text] {
    box-shadow: none;
    border-color: transparent;
    text-align: center;
    padding: 5px 2px 3px 5px;
}*/

/*.textbox-style {
    padding: 0;
    border: solid 1px #b6b6b6;
    outline: 0;
    background: #FFFFFF url(bg_form.png) left top repeat-x;
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(0%, rgba(248, 248, 248, 0.46)), to(#FFFFFF));
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 4px;
}*/

/*.textbox-style.expenses {
    padding: 0;
}*/

/*.textbox-style.expenses input[type=text] {
    padding: 2px 0 4px 3px;
    text-align: left;
}*/


.infoBox {
    display: table;
    width: 100%;
    padding: 10px;
    background-color: #1453a0;
    color: white;
    font-size: 1.2em;
    line-height: 21px;
    border-radius: 3px;
    margin: 1em 0px 1em 1em;
    box-sizing: border-box;
}

    .infoBox a {
        color: #EFEFEF;
    }

.infoBoxSidePadding {
    width: calc(100% - 20px);
}



.onboardingDataTargetProgress {
    display: grid;
    grid-template-columns: 30px;
    align-content: space-between;
}

    .onboardingDataTargetProgress .stepBorder {
        grid-column: 1/3;
        height: 25px;
        border-radius: 5px;
        cursor: pointer;
        z-index: 2;
    }

    .onboardingDataTargetProgress .stepImageWrapper {
        grid-column: 1;
        margin: auto auto;
    }

    .onboardingDataTargetProgress .stepImage {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-repeat: no-repeat;
        background-position: center;
        border: 0.5px solid #8b8b8b;
    }

        .onboardingDataTargetProgress .stepImage.stepComplete {
            background-color: #66ff66;
            background-image: url("/Images/white_tick_10.gif");
            margin-bottom: 14px;
        }

        .onboardingDataTargetProgress .stepImage.stepIncomplete {
            background-color: #f2a0a0;
            background-image: url("/Images/white_cross_10.png");
        }

    .onboardingDataTargetProgress .taskDesc {
        grid-column: 2;
        line-height: 30px;
    }

    .onboardingDataTargetProgress .progressBarComplete,
    .onboardingDataTargetProgress .progressBarFullyComplete {
        background-color: #66ff66;
    }

    .onboardingDataTargetProgress .progressBarIncomplete,
    .onboardingDataTargetProgress .progressBarComplete,
    .onboardingDataTargetProgress .progressBarFullyComplete {
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
    }


    .onboardingDataTargetProgress .progressBarComplete,
    .onboardingDataTargetProgress .progressBarFullyComplete,
    .onboardingDataTargetProgress .progressBarIncomplete {
        grid-column: 1;
        width: 4px;
        margin: 0px auto;
        border: 0.5px solid #8b8b8b;
    }

    .onboardingDataTargetProgress .progressBarIncomplete,
    .onboardingDataTargetProgress .progressBarFullyComplete {
        border-bottom-left-radius: 3px;
        border-bottom-right-radius: 3px;
    }

    .onboardingDataTargetProgress .progressBarIncomplete {
        background-color: #dedede;
        border-top: none;
    }

    .onboardingDataTargetProgress .progressBarComplete {
        border-bottom: none;
    }

.onboardingDataTargetProgress {
}

    .onboardingDataTargetProgress .stepBorder {
        height: 25px;
        border-radius: 5px;
        cursor: pointer;
        z-index: 2;
        margin-top: 10px;
        border: 1px solid #8C8C8C;
        width: 100%;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .onboardingDataTargetProgress .stepImageWrapper {
        float: left;
        margin-left: 5px;
    }


    .onboardingDataTargetProgress .stepImage {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-repeat: no-repeat;
        background-position: center;
        border: 0.5px solid #8b8b8b;
    }

    .onboardingDataTargetProgress .onboardingDataStep.stepComplete {
        background-color: #deffde;
    }

    .onboardingDataTargetProgress .onboardingDataStep.stepIncomplete {
        background-color: #ffdede;
    }

    .onboardingDataTargetProgress .onboardingDataStep {
        background-color: #dee7ff;
    }

    .onboardingDataTargetProgress .stepImage {
        background-color: #66c7ff;
    }

    .onboardingDataTargetProgress .stepComplete .stepImage {
        background-color: #66ff66;
        background-image: url("/Images/white_tick_10.gif");
    }

    .onboardingDataTargetProgress .stepIncomplete .stepImage {
        background-color: #f2a0a0;
        background-image: url("/Images/white_cross_10.png");
    }

    .onboardingDataTargetProgress .taskDesc {
        line-height: 20px;
        float: left;
        margin-left: 5px;
    }

.onboardingDataProgressTopDesc {
    line-height: 19px;
}


/*--------------------------------------------------------------------------------------------------------------*/

div.floatLeftPanel {
    display: flex;
    width: 100%;
    line-height: 26px;
}

    div.floatLeftPanel > div {
        float: left;
    }


    div.floatLeftPanel > div {
        margin-right: 10px;
    }

div.floatRightPanel {
    display: table;
    width: 100%;
}

    div.floatRightPanel > div {
        float: right;
        margin-right: 10px;
    }

div.floatRightPanelAnchored > div:first-child {
    margin-right: 0px;
}

.tickLabel,
.newUI .tickLabel {
    background-image: url("/Images/tick_circled_20.png");
    background-position: left center;
    color: #006300;
    padding-left: 24px;
    background-repeat: no-repeat;
}

.crossLabel,
.newUI .crossLabel {
    background-image: url("/Images/cross_circled_20.png");
    background-position: left center;
    color: #750307;
    padding-left: 24px;
    background-repeat: no-repeat;
}

.topButtonPanel {
    padding-top: 10px;
    padding-bottom: 10px;
    display: table;
    width: 100%;
}

    .topButtonPanel > div {
        float: left;
        line-height: 23px;
    }

    .topButtonPanel > div {
        margin-left: 10px;
    }

        .topButtonPanel > div:first-child {
            margin-left: 15px; /* 01/12/17 Removed otherwise lots of top button panels first button out of place */
            /* 14/12/17 added 10px back in because it makes more sense to do it this way! */
        }


/*
 NEW USER INTERFACE STRUCTURE
*/

input[type=text],
.newUI input[type=number],
.newUI input[type=password],
.newUI-listbox,
.newUI .riTextBox[type="text"],
.anfoldDatePicker > div.dateWrapper {
    line-height: 20px;
    color: #555;
    /* border-radius: 3px; */
    background: -webkit-linear-gradient(top,#f1f1f1 6%, #ffffff 13%);
    border: 1px solid #dadada;
    height: 28px;
}

    input[type=text].rcbInput {
        height: 12px;
    }

.PageNumberText input[type=text] {
    height: 22px;
}

.newUI input[type=number] {
    line-height: normal;
    height: unset;
    border: none;
}


input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* This is need for all text areas that sit within newUI . */
.newUI div {
    line-height: 36px;
}

    .newUI,
    .newUI table,
    .newUI div.chkSetting,
    .newUI div.chkSettingLeft,
    .newUI div.chkSettingLeft div,
    .newUI div.chkSetting div,
    .newUI table.editForm tr {
        line-height: 36px;
        /*  height: 26px;*/
    }



div.chkSetting div.anfold-combobox {
    margin-top: 5px;
}

/*12/09/2018 added '>' as it was not was applying to some checkboxes (example: timesheetdownloadsettings include your account logo and position it)*/
.newUI div.chkSetting :not(.mozCheckBox) > input[type=checkbox],
.newUI div :not(.mozCheckBox) > input[type=checkbox] {
    display: block;
    float: left;
}

.chkSetting select {
    height: 24px !important;
}

div.newUI div textarea,
div.newUI div input[type=text],
div.newUI div input[type=password] {
    margin-top: 4px;
}

.chkSettings input ~ label[for] {
    float: left;
}

div.chkSetting {
    display: table;
}

.chkSetting input[type=text] {
    margin-top: 5px;
}

.chkSetting > div {
    float: left;
}

    .chkSetting > div:not(:first-child) {
        margin-left: 8px;
    }


.newUI div input ~ label[for] {
    /*top:1px;*/
}

/*.newUI input[type=checkbox] + label {
    line-height: 18px;
    MG removed 09/06/22 as we set the line-height on the checkboxes with the newUI class
}*/

.chkSettingLeft {
    width: unset;
    float: left;
}

div.editForm > div {
    display: table;
    width: 100%;
}

div.editForm div {
    line-height: 36px;
}

table.editForm td div.RadPicker {
    margin-top: 4px;
}

div.editForm div.RadPicker {
    margin-top: 2px;
}

/*.chkList > div {
    display: table;
    width: 100%;
    height: 36px;
    /*line-height: normal; 03/09/18 Removed this because it causes problems on some pages. eg jobs page chklist section becomes unaligned. It then requires the label to have top 0px, which in turn messes up other checkboxes*/
/*}*/


.newUI select {
    height: 28px;
    line-height: 28px;
}

.newUI .anfold-combobox-input {
    padding: 6px 6px;
    box-sizing: border-box;
}

.newUI div.anfold-combobox {
    line-height: 26px;
    margin-top: 4px;
}



.newUI table.editForm > tr > td:first-child,
.newUI table.editForm > tbody > tr > td:first-child {
    vertical-align: top;
    color: #555;
}

.supportDeskClosed,
.supportDeskOpen {
    color: white;
    border-width: 1px;
    font-size: 1.1em;
    line-height: 18px;
}

.supportDeskOpen {
    background-color: forestgreen;
    border-color: darkseagreen;
}

.supportDeskClosed {
    background-color: indianred;
    border-color: darkred;
}

.pageTitleBar .searchBar input[type=text].autoCompleteUnselected, .pageTitleBar .searchBar input[type=text].autoCompleteSelected {
    color: #fff;
}

.searchBar input[type=text].autoCompleteUnselected {
    color: #333333;
}

.searchBar input[type=text].autoCompleteSelected {
    color: #666666;
}

body .newUI input[type=text].borderless-textbox,
input[type=text].borderless-textbox {
    border: none;
    background: none;
    padding: 0px;
    margin-right: -8px;
    text-indent: 0px;
}

    input[type=text].borderless-textbox:hover, input[type=text].borderless-textbox:focus {
        border-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.div-textboxstyle {
    font-size: 12px;
}

.div-textboxstyle {
    line-height: 28px;
    color: #303030;
    background: -webkit-linear-gradient(top,#f1f1f1 6%, #ffffff 13%);
    border: 1px solid #dadada;
    height: 28px;
    border-radius: 4px;
    width: fit-content;
    padding: 0 4px 0 4px;
}

    .div-textboxstyle:hover {
        border-color: #C4D3EA;
        -webkit-box-shadow: #C4D3EA 0px 0px 8px;
    }

.div-textboxstyle-focus {
    border-color: rgba(47, 168, 189, 0.6);
    -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
}


    .div-textboxstyle-focus div:first-of-type {
        color: #787878;
    }


/* ============================================================
   Moved from tsp.timesheet-common.scss — classes used outside
   timesheet pages that must remain in the common bundle
   ============================================================ */


.timer {
    position: relative;
    font-size: 200px;
    width: 20px;
    height: 20px;
    float: left;
}

    .timer > #slice {
        position: absolute;
        width: 20px;
        height: 20px;
        clip: rect(0px,20px,20px,10px);
    }

        .timer > #slice.gt50 {
            clip: rect(auto, auto, auto, auto);
        }

        .timer > #slice > .pie {
            border: 1px solid #1F4B68;
            position: absolute;
            width: 19px;
            height: 19px;
            clip: rect(0em,10px,20px,0em);
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
        }

            .timer > #slice > .pie.circularTimerFill {
                -moz-transform: rotate(180deg) !important;
                -webkit-transform: rotate(180deg) !important;
                -o-transform: rotate(180deg) !important;
                transform: rotate(180deg) !important;
            }

    .timer.circularTimerFill > .percent {
        display: none;
    }

    .timer.circularTimerFill > #slice > .pie {
        border: transparent;
        background-color: #1F4B68;
        width: 20px;
        height: 20px;
    }

.processing-error {
    color: #A94442;
    background-color: #F2DEDE;
    border: 1px solid #EBCCD1;
}

    .processing-error > i {
        background: url("/Images/exclamation_24.png") no-repeat;
    }

.processing-success {
    color: #3C763D;
    background-color: #DFF0D8;
    border: 1px solid #D6E9C6;
}

    .processing-success > i {
        background: url("/Images/success_icon_32.png") no-repeat;
        background-size: 24px;
    }

.div-textboxstyle-focus div:nth-of-type(3) {
    color: #787878;
}

@media screen and (min-width:1680px) {
    .filterPanelSectionFloatRight {
        float: right;
    }
}


@media screen and (max-width:768px) {
    /*MOBILE DEVICES*/
    .JQueryCheckBoxList_Horizontal.jqCheckbox label.ui-button {
        width: 100%;
    }

    html body.betaTester .JQueryCheckBoxList_Horizontal.jqCheckbox label.ui-button, html body.betaTester JQueryCheckBoxList_Horizontal.jqCheckbox label.ui-button:hover {
        margin: 0;
    }

    .JQueryCheckBoxList_Horizontal > div {
        float: none;
    }

        .JQueryCheckBoxList_Horizontal > div:nth-child(2) > label {
            border-bottom-left-radius: 0px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
        }

        .JQueryCheckBoxList_Horizontal > div:last-child > label {
            border-bottom-right-radius: 5px;
            border-bottom-left-radius: 5px;
            border-top-right-radius: 0px;
        }

    .RadGrid {
        width: 100% !important;
    }

    .RadGrid_Default .showGridFilter {
        top: 2px;
        left: 5px;
    }

    .showGridFilter + .gridFieldSelector {
        top: 2px;
        left: 26px;
    }

    .gridFieldSelector {
        top: 2px;
        left: 5px;
    }

    .JQueryCheckBoxList_Horizontal {
        margin: 0 auto;
        display: table;
        width: 225px;
    }

    .fullWidthFilterPanel > .filterPanelSection {
        display: table;
        width: 100%;
        margin-bottom: 8px;
        box-sizing: border-box;
    }
}

.customFormPanel {
    font-size: 12px;
}

body .customFormPanel, body .customFormPanel table {
    color: #666;
    /*color: #FFF;*/
}


.customFormPanel, .customFormPanel table {
    color: #626060;
    width: 100%;
}

.customFormPanel {
    margin-bottom: 10px;
}

    .customFormPanel > table td:last-child {
        min-width: 265px;
    }

.customFormPanelTitle {
    border-bottom: 1px solid #666666;
    line-height: 15px;
    padding-top: 19px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.customFormPanelMessage {
    margin-left: 3px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.customFormPanel textarea {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    resize: vertical;
}

    .customFormPanel textarea[disabled="disabled"] {
        resize: none;
    }

.customFormPanel > table td {
    line-height: 21px;
}

.customFormPanelDetails {
    margin-right: 5px;
    font-size: 0.8em;
    float: right;
}

.customFormPanel fieldset[readonly="readonly"] .ui-button:hover {
    color: #555555;
    color: unset;
}

.customFormPanel fieldset[readonly="readonly"] .ui-button.ui-state-active:hover {
    color: #212121;
}

.customFormPanel fieldset[readonly="readonly"].JQueryCheckBoxList_Horizontal .ui-checkboxradio-label {
    cursor: default;
}

.smallEditPanel {
    margin-left: 5px;
    margin-top: 5px;
    display: table;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid #c0c0c0;
    padding: 25px;
    box-sizing: border-box;
    line-height: 25px;
}


.dataWarningPanel,
.warningPanel {
    background-color: indianred;
    border-color: darkred;
    line-height: 15px;
    color: white;
    margin-top: 15px;
    width: 500px;
    font-size: 1.1em;
    padding: 10px;
}

.dataWarningPanel {
    clear: both;
    margin-top: 10px;
}

.awrSettingsTable div input[type=checkbox] {
    margin-top: 4px;
}

.awrSettingsTable div > input ~ label[for] {
    top: 2px;
}

.checkBoxWrapper {
    background-color: #8a8888;
    display: table;
    padding: 6px 0 6px 6px;
    border-radius: 3px;
    color: #efefef;
}



.checkBoxWrapperLarge {
    font-size: 1.2em;
}



.checkBoxWrapper a {
    background-color: #f7f5f5;
    border: 1px solid #aaaaaa;
    float: right;
    margin: 0 10px 0 10px;
    text-decoration: none;
    color: black;
    font-family: 'Roboto';
    line-height: 20px;
    padding: 0 4px;
    margin-top: 2px;
}

/*
removed because it put the checkbox out of line on DD mandate page    
    .checkBoxWrapper input ~ label[for] {
    top: -5px !important;
}

.checkBoxWrapperLarge input ~ label[for] {
    top: -4px !important;
}*/

.checkBoxWrapperLarge input[type=checkbox] {
    background-color: #dadada;
}

    .checkBoxWrapperLarge input[type=checkbox]:checked {
        background-color: #1e96d5;
    }

div[data-t=img] > img, div[data-t=img] > div {
    cursor: pointer;
    margin-top: 7px;
}

.tooltip-icon {
    display: inline-block;
    background-size: 15px;
    height: 15px;
    width: 15px;
    background: url("/Images/question_mark_8.gif") no-repeat;
    cursor: pointer;
}


.anfoldProgressButton {
    position: relative;
    background: #f7f7f7;
    border: 1px solid #DEDEDE;
    display: table;
    border-radius: 8px;
    z-index: 2;
    overflow: hidden;
    cursor: pointer;
    line-height: 27px;
    padding: 0px 10px;
    border: 1px solid #b1b1b1;
}

    .anfoldProgressButton:hover {
        background: #808080ad;
    }

    .anfoldProgressButton.complete .progressBar {
        width: 100%;
    }

    .anfoldProgressButton .progressBar {
        background-color: #f7f7f7;
        position: absolute;
        width: 0%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 3;
    }

    .anfoldProgressButton > div:not(.progressBar ), .newUI .anfoldProgressButton > div:not(.progressBar ) {
        display: table;
        margin: 0 auto;
        z-index: 4;
        position: relative;
        color: #404040;
        line-height: 23px;
    }

    .anfoldProgressButton.complete .progressBar {
        background-color: #abefb4;
    }

    .anfoldProgressButton.error {
        background-color: #ff9999;
    }




    .anfoldProgressButton.complete .progressBar::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        background: #ffffff5e;
        z-index: 1;
        animation-name: progressBarComplete;
        animation-duration: 0.5s;
        animation-timing-function: linear;
        animation-iteration-count: 1;
        left: 0%;
        width: 4px;
        animation-fill-mode: forwards;
        border-radius: 2px;
    }

@keyframes progressBarComplete {
    0% {
        left: 0%;
        height: 100%;
    }

    70% {
        top: 0;
        height: 100%;
    }

    100% {
        height: 0%;
        top: 5px;
        left: calc(100% + 5px);
    }
}

.anfoldProgressButton.inProgress .progressBar::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ffffff52), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #ffffff52), color-stop(.75, #ffffff52), color-stop(.75, transparent), to(transparent) );
    z-index: 1;
    background-size: 50px 50px;
    animation-name: progressBarLoading;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


@keyframes progressBarLoading {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 50px 50px;
    }
}



.newUI .tspButtonFill.HightlightBorder {
    border: 1px solid #fa8072;
}

.bulkTimesheetMode .timesheetSubmitTableWrapper, .bulkTimesheetMode .timesheetWrapper {
    margin-bottom: 0px;
}

.bulkTimesheetMode.bulkTimesheetFixedFooter .bulkTimesheetsWrapper {
    margin-bottom: 40px;
}

.bulkTimesheetFooter .timesheetFooter {
    background-color: unset;
    color: unset;
}

.RadGrid .rgPageFirst, .RadGrid .rgPagePrev, .RadGrid .rgPageNext, .RadGrid .rgPageLast {
    float: left;
}

.ui-widget {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1em;
}

.ui-dialog.anfoldDialog.ui-widget.ui-widget-content.ui-front {
    height: auto;
    width: 215px;
    top: 409.503px;
    left: 826.8px;
    z-index: 1001;
    border: 2px solid #9fa0a0;
    border-radius: 2px;
    /* background-color: #489cc8; */
}

.ui-dialog.anfoldDialog .ui-dialog-content {
    min-height: unset !important;
}

.anfoldDialog .ui-dialog-content .tspButton.tspButtonFill.tspButtonImage {
    height: 20px;
}

.anfoldDialog.ui-draggable .ui-dialog-titlebar, .anfoldDialog.ui-dialog .ui-dialog-titlebar {
    display: none;
}

.anfoldDialog.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 0px;
}

.anfoldDialog .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 0px;
}

.anfoldDialog .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 0px;
}

.anfoldDialog .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 0px;
}

.anfoldDialog .closeDialog {
    display: block;
    width: 20px;
    margin: 0 auto;
    height: 20px;
    border-radius: 10px;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
    background-repeat: no-repeat;
    background-image: url(/Images/cross_16.gif);
    background-position-x: 50%;
    background-position-y: 50%;
    margin-top: 10px;
    cursor: pointer;
}

.anfoldProgressButton.tspbuttonfill.tspbutton {
    border-radius: 4px;
}

    .anfoldProgressButton.tspbuttonfill.tspbutton > div {
        margin-left: 10px;
        padding: 0px 10px 1px 10px;
    }

    .anfoldProgressButton.tspbuttonfill.tspbutton:not(.complete) > div.progressBar {
        background-color: rgba(0, 0, 0, 0);
        background-color: #fff0;
    }

    .anfoldProgressButton.tspbuttonfill.tspbutton > div.progressBar {
        background-image: url(/images/upload_20.png);
        background-position-x: 5px;
        background-position-y: 40%;
        background-repeat: no-repeat;
        margin-left: 0px;
        padding: 0px 12px 1px 15px;
    }

.anfoldProgressButton:hover {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #f7f7f7) );
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #f7f7f7 100% );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#f7f7f7');
    background-color: #dfdfdf;
    cursor: pointer;
    border-color: #7E7E7E;
    color: #111;
}

.expenseFormImportCSVForm {
    background-color: #FFF;
    position: absolute;
    width: 100%;
    top: 0px;
    left: 0px;
    z-index: 9999;
    bottom: 0;
}


.anfoldProgressButton.tspbuttonfill.tspbutton > div:last-child {
    padding-right: 0px;
}

.whiteLoader {
    background-image: url(/Images/anfold-logo-small-white.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    animation-name: loading-icon-ani;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    height: 20px !important;
    width: 20px !important;
    float: left;
}

.newUI .loading.tspButtonFill > img {
    animation-name: loading-icon-ani;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    /* background-image: url(/images/anfold-logo-small.png); */
    /* height: 100%; */
    /* width: 100%; */
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: calc(50% - 10px);
}

.newUI .tspButtonFill.loading:not([disabled]):not(.tspButtonDisabled):not(.newUiBtnLoad):hover {
    background: none;
    background-color: #f7f7f9;
    border: 1px solid #1453a0;
    color: #1453a0;
}

.loadingButton {
    background-image: url('/Images/load_20.gif');
    background-repeat: no-repeat;
    background-position-x: 90%;
    background-position-y: 50%;
    background-position: 90% center;
    opacity: 0.5;
    background-color: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #F7F7F7), color-stop(1, #DFDFDF) );
}

.newUI .loading.tspButtonFill {
    padding-right: 25px;
    position: relative;
    background: none;
    background-color: #f7f7f9;
    border: 1px solid #1453a0;
    color: #1453a0;
}

.newUI.ui-dialog-content div {
    line-height: 26px;
}

.newUI div.infoPanel {
    line-height: 24px;
}

.infoPanel {
    display: table;
    width: calc(100% - 60px);
    margin-left: 30px;
    color: white;
    line-height: 24px;
    font-size: 1.1em;
    padding: 10px;
    box-sizing: border-box;
    float: left;
    margin-top: 20px;
    margin-bottom: 20px;
}

.infoPanelGrey {
    background-color: #929292;
}

.uiDialogNotes {
    display: flex;
    flex-direction: column;
}
/*-------------------------------------------------------------------------------------------------------------------------
-- Check boxes
--------------------------------------------------------------------------------------------------------------------------*/

div.chkList {
    padding-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.chkList > div {
    display: table;
    width: 100%;
    margin: 10px 0px;
}

.chkList .chkSettingLeft {
    margin-top: 8px;
}

.chkList .chkSetting {
    display: table;
    width: 100%;
}

.JQueryCheckBoxList_Horizontal label {
    line-height: 16px;
}



/*-------------------------------------------------------------------------------------------------------------------------
-- FileUpload widget
--------------------------------------------------------------------------------------------------------------------------*/


.pnlAttachmentsWrapper .fileUploaderAttachment:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-right-width: 1px;
}

.pnlAttachmentsWrapper .fileUploaderAttachment:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.pnlAttachmentsWrapper .fileUploaderAttachment {
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background-color: #f7f7f7;
    border: 1px solid #b1b1b1;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f7f7f7), color-stop(1, #dfdfdf) );
    text-decoration: none;
    display: inline-block;
    padding: 0px 5px;
    line-height: 30px;
    border-right-width: 0px;
}

    .pnlAttachmentsWrapper .fileUploaderAttachment a {
        color: #000;
        float: left;
        margin-right: 5px;
        text-decoration: none;
    }


.pnlAttachmentsWrapper {
    max-width: calc(100% - 200px);
    min-width: 600px;
    padding-left: 9px;
    white-space: nowrap;
    overflow-x: auto;
    margin-top: 2px;
}

    .pnlAttachmentsWrapper .deleteAttachment {
        background-image: url(/Images/delete_16.png);
        width: 16px;
        height: 16px;
        margin-top: 6px;
        background-repeat: no-repeat;
        float: left;
    }

.newUI div.chkWrapper {
    line-height: 18px;
}

body .ui-widget input {
    font-size: 1rem;
}

.empProfileSectionWrapper {
    width: 100%;
    padding: 1em;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 6px;
    padding: calc(1em + 20px);
}

.copyElement:after {
    content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath class='originalStyle' d='M15.4375 12.4548V19.8398C15.4375 20.884 14.6189 21.7305 13.592 21.7305H5.59766C4.56855 21.7305 3.75 20.884 3.75 19.8398V8.49609C3.75293 7.99557 3.95306 7.51639 4.30699 7.16246C4.66092 6.80853 5.1401 6.6084 5.64062 6.60547H9.68484C9.82483 6.60568 9.96337 6.63375 10.0924 6.68805C10.2214 6.74234 10.3383 6.82178 10.4364 6.92172L15.1264 11.6913C15.326 11.8953 15.4376 12.1694 15.4375 12.4548V12.4548Z' stroke='%2369798B' stroke-width='1.5' stroke-linejoin='round'%3E%3C/path%3E%3Cpath class='originalStyle' d='M9.59375 6.60547V11.2461C9.59754 11.564 9.72552 11.8678 9.95033 12.0926C10.1751 12.3175 10.479 12.4454 10.7969 12.4492H15.4375' stroke='%2369798B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3Cpath class='originalStyle' d='M8.5625 6.60547V4.37109C8.56543 3.87057 8.76556 3.39139 9.11949 3.03746C9.47342 2.68353 9.9526 2.4834 10.4531 2.48047H14.4922C14.6329 2.48066 14.7723 2.50871 14.9021 2.56299C15.032 2.61726 15.1498 2.6967 15.2489 2.79672L19.9389 7.56625C20.1383 7.76812 20.2501 8.04047 20.25 8.32422V15.7148C20.25 16.759 19.4314 17.6055 18.4045 17.6055H15.7812' stroke='%2369798B' stroke-width='1.5' stroke-linejoin='round'%3E%3C/path%3E%3Cpath class='originalStyle' d='M14.4062 2.48047V7.12109C14.41 7.439 14.538 7.74283 14.7628 7.96764C14.9876 8.19245 15.2915 8.32043 15.6094 8.32422H20.25' stroke='%2369798B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E");
    position: absolute;
    right: 0;
    width: 16px;
    height: 16px;
    display: block;
    top: 0;
    pointer-events: auto;
    cursor: pointer;
}

.copyElement {
    position: relative;
    box-sizing: border-box;
    padding-right: 16px;
    pointer-events: none;
}

    .copyElement > * {
        pointer-events: auto;
    }


.gridIcon-24 img {
    mask: url(/images/download.svg) no-repeat center;
    max-height: 24px;
    padding: 2px 0;
}


.ui-menu .ui-menu {
    line-height: 1rem;
    font-size: 1rem;
}

.ui-menu .ui-menu-item-wrapper {
    line-height: 1.8rem;
}