/*Webvise V9 CSS*/

/*custom modal and table styling to free up space*/

/*TODO apply to all modals and tables*/

#findAbsPopupModal .modal-body {
    padding: 0 !important;
}

#findAbsPopupModal .modal-header {
    padding: 5px !important;
}

#findAbsPopupModal .modal-footer {
    margin-top: 0 !important;
    padding: 5px !important;
}

#findAbsPopupModal .fixed-table-container thead th .th-inner {
    padding: 4px !important;
}

#findAbsPopupModal .bootstrap-table .table:not(.table-condensed)>tbody>tr>td {
    padding: 3px !important;
}

#findAbsPopupModal .fixed-table-pagination .pagination a {
    padding: 2px 8px !important;
}

#backToEss {
    width: 40px;
    height: 40px;
    display: inline-block;
}

#backToEss>img {
    margin-left: 10px;
    cursor: pointer;
}

.calendar .month-container {
    margin-bottom: 20px;
}

.navbar {
    height: 60px;
}

::selection {
    background-color: #3cc4ff;
    color: #265783;
}

.tourBut {
    font-size: 20px;
    height: 34px;
    width: 34px;
    padding: 8px;
    padding-top: 3px;
    cursor: pointer;
}

.tour-backdrop {
    background-color: #131313 !important;
    opacity: .5 !important;
    filter: alpha(opacity=50) !important;
}

.skillWarning td {
    color: darkorange;
}

.skillExpired td {
    color: red;
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-right-radius: -1px;
    border-top-left-radius: -1px;
}

#tableScroll {
    overflow-x: auto;
    width: 100%;
}

.table-loading-overlay {
    position: absolute;
    top: 215px;
    left: 14px;
    right: 14px;
    z-index: 10;
    background: rgba(229, 229, 229, 0.89);
    opacity: 0.89;
}

.table-loading-inner {
    position: absolute;
    top: -70px;
    left: 40%;
}

.SectionHeader {
    color: #808080;
    font-weight: bold;
    padding-bottom: 4px;
    font-size: 13px;
}

/*KPI Panels*/

.no-padding {
    padding: 0;
    margin: 0;
}

.panel-widget {
    padding: 0;
    position: relative;
}

.panel-widget .panel-footer {
    border: 0;
    text-align: center;
}

.panel-footer .input-group {
    padding: 0px;
    margin: 0 -5px;
}

.panel-footer .input-group-btn:last-child>.btn, .panel-footer .input-group-btn:last-child>.btn-group {
    margin: 0;
}

.panel-widget .panel-footer a {
    color: #999;
}

.panel-widget .panel-footer a:hover {
    color: #666;
    text-decoration: none;
}

.panel-blue {
    background: #30a5ff;
    color: #fff;
}

.panel-blue-light {
    background: rgba(48, 165, 255, 0.61);
    color: #fff;
}

.panel-teal {
    background: #1ebfae;
    color: #fff;
}

.panel-teal-light {
    background: rgba(30, 191, 174, 0.67);
    color: #fff;
}

.panel-orange {
    background: #ffb53e;
    color: #fff;
}

.panel-orange-light {
    background: rgba(255, 181, 62, 0.63);
    color: #fff;
}

.panel-red {
    background: #f9243f;
    color: #fff;
}

.panel-green {
    background: #32cd32;
    color: #fff;
}

.panel-purple {
    background: #9932cc;
    color: #fff;
}

.panel-red-light {
    background: rgba(249, 36, 63, 0.56);
    color: #fff;
}

.panel-blue-graphs {
    background-color: #f2f2f2;
    border-radius: 4px;
    border-left: 7px solid #30a5ff;
}

.panel-orange-graphs {
    background-color: #f2f2f2;
    border-radius: 4px;
    border-left: 7px solid #ffb53e;
}

.panel-teal-graphs {
    background-color: #f2f2f2;
    border-radius: 4px;
    border-left: 7px solid #1ebfae;
}

.panel-red-graphs {
    background-color: #f2f2f2;
    border-radius: 4px;
    border-left: 7px solid #f9243f;
}

.panel-blue .panel-body p, .panel-teal .panel-body p, .panel-orange .panel-body p, .panel-red .panel-body p, .panel-green .panel-body p, .panel-purple .panel-body p {
    color: #fff;
    color: rgba(255, 255, 255, .8);
}

.panel-blue .panel-heading, .panel-teal .panel-heading, .panel-orange .panel-heading, .panel-red .panel-heading, .panel-green .panel-heading, .panel-purple .panel-heading {
    border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.panel-blue .text-muted, .panel-teal .text-muted, .panel-orange .text-muted, .panel-red .text-muted, .panel-green .text-muted, .panel-purple .text-muted {
    color: rgba(255, 255, 255, .5);
}

.dark-overlay {
    background: rgba(0, 0, 0, .05);
    text-align: center;
}

.widget-left {
    height: 60px;
    padding: 3px;
    text-align: center;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    font-size: 250%;
}

.widget-right {
    text-align: left;
    line-height: 1.6em;
    margin: 0px;
    padding: 10px;
    height: 60px;
    color: #999;
    font-weight: 300;
    background: #ececec;
    /*border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;*/
}

.widget-right-dep {
    text-align: left;
    line-height: 1.6em;
    margin: 0px;
    padding: 10px;
    height: 60px;
    color: #999;
    font-weight: 300;
    background: #ececec;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.widget-far-right {
    height: 60px;
    padding: 3px;
    text-align: center;
    background: #ececec;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    padding-top: 19px;
    color: gray;
}

.widget-far-right:hover {
    background: #d9d9d9;
    /*color: #ececec;*/
}

@media (max-width: 768px) {
    .widget-right {
        width: 100%;
        margin: 0;
        text-align: center;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
    }
}

@media (max-width: 768px) {
    .widget-left {
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }
}

.widget-right .text-muted {
    color: #9fadbb;
}

.widget-right .large {
    color: #5f6468;
}

.panel-pink .widget-left {
    background: #ea00d2;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-blue .widget-left {
    background: #30a5ff;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-teal .widget-left {
    background: #1ebfae;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-orange .widget-left {
    background: #ffb53e;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-red .widget-left {
    background: #f9243f;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-green .widget-left {
    background: #32cd32;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-purple .widget-left {
    background: #9932cc;
    color: #fff;
    font-size: 25px;
    padding: 0;
    padding-top: 12px;
    padding-left: 1%;
}

.panel-widget {
    background: #fff;
}

.kpiHeader {
    font-size: 17px;
    color: #9fadbb;
}

.kpiColGraph {
    margin-left: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.kpiColGraph:hover {
    background-color: #d9d9d9;
    cursor: pointer;
}

.kpiColGraph.active {
    background-color: #d9d9d9;
}

.kpi-day-but {
    height: 150px;
    width: 100%;
    border-top-right-radius: 4px;
}

.kpi-day-but.active {
    background-color: #d9d9d9;
}

.kpi-month-but.active {
    background-color: #d9d9d9;
}

.kpi-month-but {
    height: 150px;
    width: 100%;
    border-bottom-right-radius: 4px;
}

.kpi-day-but:hover {
    background-color: #d9d9d9;
    cursor: pointer;
}

.kpi-month-but:hover {
    background-color: #d9d9d9;
    cursor: pointer;
}

.img-center {
    display: block;
    margin: 0 auto;
}

.kpiIcon {
    width: 15px;
    height: 10px;
    display: inline-block;
    border-radius: 4px;
    margin-right: 10px;
    margin-left: 10px;
}

#absGrpCol {
    height: 300px;
    overflow: auto;
}

#shiftsCol {
    height: 300px;
    overflow: auto;
}

.kpiColGraph2 {
    margin-left: 25px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.text-muted {
    color: #666666 !important;
}

.kpi1Header {
    font-weight: bold;
    color: #30a5ff;
}

.kpi2Header {
    font-weight: bold;
    color: #ffb53e;
}

/*///////////////*/

.panel-balance {
    margin-bottom: 7px !important;
}

.eventIcon {
    margin-top: 6px;
    width: 15px;
    /* height: 15px; */
    display: inline-flex;
    border-radius: 4px;
    padding: 3px;
    position: absolute;
    left: 10px;
}

.tooltipHeader {
    padding: 2px;
    margin-top: -5px;
    margin-bottom: 5px;
    border-bottom: 1px solid #e5e5e5;
    position: initial;
    font-weight: bold;
    color: #428bca;
}

.shiftTooltip {
    padding: 2px;
}

.btn-group-vertical>.btn:first-child:not(:last-child) {
    border-top-right-radius: 3px !important;
    border-top-left-radius: 3px !important;
}

.btn-group-vertical>.btn:last-child:not(:first-child) {
    border-bottom-right-radius: 3px !important;
    border-bottom-left-radius: 3px !important;
}

.btn-grey {
    color: #808080 !important;
    background-color: #ededed;
    border-color: #ededed;
}

.btn-grey:hover {
    color: #808080 !important;
    background-color: #dcdcdc;
    border-color: #dcdcdc;
}

.btn-grey.active {
    color: #808080 !important;
    background-color: #c7c7c7;
    border-color: #c7c7c7;
}

.yearCalBack {
    width: 5%;
    height: 300px;
    display: inline;
    font-size: xx-large;
    position: absolute;
}

.yearCalBack:hover {
    background-color: #e5e5e5;
    cursor: pointer;
}

.fullscreen-bg {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: 100;
    background-color: rgba(229, 229, 229, 0.89);
}

.fullscreenLoadingImg {
    position: absolute;
    top: 50%;
    left: 50%;
}

#loadingDiv {
    display: block !important;
    position: absolute;
    top: 40%;
    left: 40%;
    margin-top: -50px;
    margin-left: -50px;
    /* width: 400px;
    height: 200px; */
    background: rgba(220, 220, 220, 0.91);
    border-radius: 3px;
    padding: 4%;
}

.loadingImg {
    display: block;
    margin: auto;
}

.loadingText {
    color: #428bca !important;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}

.highlight {
    color: #dd4b39;
    font-weight: bold;
}

.empInfoHead {
    color: #428bca !important;
    border-color: transparent !important;
    display: grid;
    grid-template-columns: 1fr 2fr;
}

#empDeetsTable>tbody>tr>td {
    padding: 3px !important;
}

/*Custom absence icons*/

@font-face {
    font-family: 'icomoon';
    src: url('fonts/icomoon.eot?g42tww');
    src: url('fonts/icomoon.eot?g42tww#iefix') format('embedded-opentype'), url('fonts/icomoon.ttf?g42tww') format('truetype'), url('fonts/icomoon.woff?g42tww') format('woff'), url('fonts/icomoon.svg?g42tww#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-softworks:before {
    content: "\e906";
}

.icon-abs-end-p:before {
    content: "\e901";
}

.icon-abs-end-t:before {
    content: "\e902";
}

.icon-abs-start-t:before {
    content: "\e903";
}

.icon-abs-during-t:before {
    content: "\e904";
}

.icon-abs-during-p:before {
    content: "\e905";
}

.icon-abs-start-p:before {
    content: "\e900";
}

.icon-office:before {
    content: "\e907";
}

/*Custom absence icons end*/

.detailHeading {
    font-weight: bold;
    color: #428bca;
}

.listDiv {
    height: 600px;
}

.bdLarge>.modal-dialog {
    width: 90%;
}

/* .fixed-table-header>table {
    width: 100% !important;
} */

#clickSelectJS>button {
    width: 100%;
    white-space: normal;
}

.alert-dangerLight {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.alert-infoLight {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #cddcdf;
}

.alert-warningLight {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

.rsd {
    margin-bottom: 10px;
}

.spinner input {
    text-align: right;
}

.input-group-btn-vertical {
    position: relative;
    white-space: nowrap;
    width: 2%;
    vertical-align: middle;
    display: table-cell;
}

.input-group-btn-vertical>.btn {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%;
    padding: 8px;
    margin-left: -1px;
    position: relative;
    border-radius: 0;
}

.input-group-btn-vertical>.btn:last-child {
    margin-top: -2px;
}

.input-group-btn-vertical i {
    position: absolute;
    top: 0;
    left: 4px;
}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th {
    border-bottom: 3px solid #2582c3 !important;
    color: #2582c3 !important;
}

.spinner input {
    text-align: right;
}

.input-group-btn-vertical {
    position: relative;
    white-space: nowrap;
    width: 2%;
    vertical-align: middle;
    display: table-cell;
}

.input-group-btn-vertical>.btn {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%;
    padding: 8px;
    margin-left: -1px;
    position: relative;
    border-radius: 0;
}

.input-group-btn-vertical i {
    position: absolute;
    top: 0;
    left: 4px;
}

.table-bordered>tbody>tr>td {
    border: 1px solid #eee !important;
}

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

#filterCell {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #428bca;
    font-weight: bold;
    font-style: italic;
}

.ptb {
    padding-top: 5px;
    padding-bottom: 5px;
}

h4 {
    color: #428bca !important
}

.modal-dialog-fw {
    width: 90% !important;
}

.fullWidth {
    width: 100% !important;
}

.form-control-2[disabled], .form-control-2[readonly] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.form-control-3[disabled], .form-control-3[readonly] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.ui-datepicker .ui-datepicker-prev {
    left: 2px;
    background: url('../images/left.png') center no-repeat;
}

.ui-datepicker .ui-datepicker-next {
    background: url('../images/right.png') center no-repeat;
}

.ui-datepicker {
    /*width: 17em;*/
    /* padding: .2em .2em 0; */
    display: none;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
}

.ui-datepicker table thead {
    background-color: #2e6ea7!important;
    color: white;
}

.ui-datepicker table a:hover {
    height: 32px;
    width: 32px;
    background: #ddd;
    border-radius: 20px;
}

.ui-datepicker table a {
    color: #7c7c7c;
}

.ui-datepicker .ui-datepicker-header {
    position: relative;
    background-color: #255783;
    padding-bottom: 0.5em;
    padding-top: 1.3em;
    height: 60px;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    position: absolute;
    width: 1.8em;
    height: 1.8em;
}

/*.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}*/

.ui-datepicker .ui-datepicker-prev {
    left: 2px;
}

.ui-datepicker .ui-datepicker-next {
    right: 2px;
}

/*.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}*/

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -8px;
    top: 50%;
    margin-top: -8px;
}

.ui-datepicker .ui-datepicker-title {
    margin: 0 2.3em;
    line-height: 1.8em;
    text-align: center;
    color: white;
    font-weight: bold;
}

.ui-datepicker .ui-datepicker-title select {
    font-size: 1em;
    margin: 1px 0;
}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    width: 45%;
    background-color: #255783;
    border: 0;
    color: white !important;
}

.ui-datepicker table {
    width: 100%;
    font-size: .9em;
    border-collapse: collapse;
    margin: 0 0 .4em;
}

.ui-datepicker th {
    padding: .7em .3em;
    text-align: center;
    font-weight: bold;
    border: 0;
}

.ui-datepicker td {
    border: 0;
    padding: 1px;
}

.ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: 0.55em;
    text-align: center;
    text-decoration: none;
    width: 32px;
    height: 32px;
    font-weight: 600;
}

.ui-datepicker .ui-datepicker-buttonpane {
    background-image: none;
    margin: .7em 0 0 0;
    padding: 0 .2em;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}

.ui-datepicker .ui-datepicker-buttonpane button {
    float: right;
    margin: .5em .2em .4em;
    cursor: pointer;
    padding: .2em .6em .3em .6em;
    width: auto;
    overflow: visible;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    float: left;
}

/* with multiple calendars */

.ui-datepicker.ui-datepicker-multi {
    width: auto;
}

.ui-datepicker-multi .ui-datepicker-group {
    float: left;
}

.ui-datepicker-multi .ui-datepicker-group table {
    width: 95%;
    margin: 0 auto .4em;
}

.ui-datepicker-multi-2 .ui-datepicker-group {
    width: 50%;
}

.ui-datepicker-multi-3 .ui-datepicker-group {
    width: 33.3%;
}

.ui-datepicker-multi-4 .ui-datepicker-group {
    width: 25%;
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
    border-left-width: 0;
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
    clear: left;
}

.ui-datepicker-row-break {
    clear: both;
    width: 100%;
    font-size: 0;
}

/* RTL support */

.ui-datepicker-rtl {
    direction: rtl;
}

.ui-datepicker-rtl .ui-datepicker-prev {
    right: 2px;
    left: auto;
}

.ui-datepicker-rtl .ui-datepicker-next {
    left: 2px;
    right: auto;
}

.ui-datepicker-rtl .ui-datepicker-prev:hover {
    right: 1px;
    left: auto;
}

.ui-datepicker-rtl .ui-datepicker-next:hover {
    left: 1px;
    right: auto;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane {
    clear: right;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button {
    float: left;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group {
    float: right;
}

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
    border-right-width: 0;
    border-left-width: 1px;
}

/* Icons */

.ui-datepicker .ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
    left: .5em;
    top: .3em;
}

.ui-datepicker .ui-state-active {
    height: 32px;
    width: 32px;
    background: #b9d8f9;
    color: #0d80fe !important;
    border-radius: 20px;
    font-weight: bold;
}

.ui-datepicker .ui-state-highlight {
    color: #f2aa37 !important;
    font-weight: bold;
}

.ui-datepicker .ui-button {
    font-weight: normal;
    color: #454545;
}

.ui-datepicker .ui-state-disabled {
    color: #ddd;
    cursor: not-allowed;
}

.ui-spinner {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 0;
    vertical-align: middle;
    border: 1px solid #ccc;
    /*background-color: #e2e2e2 !important;*/
    width: 49%;
}

.ui-spinner-input {
    border: none !important;
    background: none;
    color: inherit;
    padding: .322em 0;
    vertical-align: middle;
    margin-right: 2em;
}

.ui-spinner-input:focus {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

.ui-spinner-button {
    width: 1.6em;
    height: 50%;
    font-size: .5em;
    padding: 0;
    margin: 0;
    text-align: center;
    position: absolute;
    cursor: default;
    display: block;
    overflow: hidden;
    right: 3px;
}

/* more specificity required here to override default borders */

.ui-spinner a.ui-spinner-button {
    border-style: none;
    color: #255783;
}

.ui-spinner .ui-state-hover {
    text-decoration: none !important;
    color: #428bca !important;
}

.ui-spinner-up {
    top: -3px;
    font-size: inherit;
}

.ui-spinner-down {
    bottom: 3px;
    font-size: inherit;
}

/* Spinner specific style fixes */

.ui-controlgroup-vertical .ui-spinner-input {
    /* Support: IE8 only, Android < 4.4 only */
    width: 75%;
    width: calc( 100% - 2.4em);
}

.ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
    border-top-style: solid;
}

.padding {
    padding-left: 10px;
    padding-right: 10px;
}

.ui-menubar {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

table.ui-menubar {
    display: block;
    width: 100%;
    border-collapse: collapse;
    padding: 0;
    margin: 0;
}

.ui-menubar-item {
    float: left;
}

.ui-menubar-item td {
    padding: 0;
}

.ui-menubar .ui-button {
    float: left;
    font-weight: normal;
    border-top-width: 0 !important;
    border-bottom-width: 0 !important;
    margin: 0;
    outline: none;
}

.ui-menubar .ui-menubar-link {
    border-right: 1px dashed transparent;
    border-left: 1px dashed transparent;
}

.ui-menubar .ui-menu {
    width: 200px;
    position: absolute;
    z-index: 9999;
}

.containerV9 {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
    width: 99%;
}

.mb {
    margin-bottom: 10px;
}

/*bootstrapafying jquery dialogs*/

.ui-tooltip {
    padding: 8px;
    position: absolute;
    z-index: 9999;
    max-width: 300px;
    top: 377px;
    left: 623px;
    display: block;
    border-radius: 3px;
    border-radius: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    background-clip: padding-box;
    outline: none;
    border-top: 3px solid #428bca;
    border-radius: 3px;
    font-size: 13px;
}

.ui-dialog {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    border-top: 3px solid #428bca;
    border-radius: 3px;
}

.ui-dialog-titlebar {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    min-height: 16.42857143px;
    color: gray;
}

.ui-dialog-content {
    padding: 20px;
    line-height: 1.7em
}

.ui-dialog-buttonset {
    margin-top: 15px;
    padding: 19px 20px 20px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
}

.form-control-2 {
    display: block;
    width: 100%;
    height: 27px;
    padding: 6px 6px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #555555;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #cccccc;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.downBut {
    background-color: #428bca;
    width: 50px;
    margin-top: -15px;
    margin-left: 45%;
    border-radius: 5px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    color: white;
    font-size: 14px;
    padding-left: 20px;
}

.hideR {
    overflow: hidden;
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    transition: 0.3s ease-in-out;
}

.showR {
    transition: 1s ease;
    max-height: 1000px;
    overflow: hidden;
}

.infoRow {
    /*box-shadow: inset 0 0 10px #9d9d9d;*/
    padding-left: 0;
    margin-left: -15px;
    /*background-color: #eee;*/
    margin-bottom: 15px;
}

.wellDis {
    width: 80%;
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: rgb(66, 139, 202);
    border: 1px solid #e3e3e3;
    color: white;
    border-radius: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
}

.pt {
    padding-top: 10px;
}

.pad {
    margin-right: 3px;
    margin-bottom: 1px !important;
}

.tab-content {
    margin-top: 20px;
}

.nav>li>a:hover, .nav>li>a:focus, .nav>li>a::visited {
    text-decoration: none;
    background-color: #b0b0b0;
    color: inherit !important;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    color: #555;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
    cursor: default;
    outline: none;
    border-top: 3px solid #428bca !important;
    border-radius: 3px;
}

.nav>li>a:hover, .nav>li>a:focus {
    text-decoration: none;
    background-color: #eee;
    outline: none;
}

#UlWrapper {
    background: transparent;
    /*border: 0px solid transparent;*/
    padding-bottom: 1px;
    padding: .2em .2em 0;
}

#page-content-wrapper {
    width: 100%;
    transition: all 0.4s ease 0s;
}

/***** small top widgets *****/

.bg-aqua {
    background-color: #00c0ef !important;
}

.bg-green {
    background-color: #00e87e !important;
}

.bg-red, .bg-yellow, .bg-aqua, .bg-blue, .bg-green, .bg-purple, .bg-radRed, .bg-dodgerBlue, .bg-gossip {
    color: #fff !important;
}

.bg-yellow {
    background-color: #f2aa37 !important;
}

.bg-red {
    background-color: #dd4b39 !important;
}

.bg-purple {
    background-color: #AD5CF1 !important;
}

.bg-radRed {
    background-color: #F62459 !important;
}

.bg-dodgerBlue {
    background-color: #19B5FE !important;
}

.bg-gossip {
    background-color: #87D37C !important;
}

.small-box {
    border-radius: 2px;
    position: relative;
    display: block;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.small-box>.inner {
    padding: 10px;
}

.small-box .icon {
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
    position: absolute;
    top: -10px;
    right: 10px;
    z-index: 0;
    font-size: 90px;
    color: rgba(0, 0, 0, 0.15);
}

.small-box>.small-box-footer {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
    display: block;
    z-index: 10;
    background: rgba(0, 0, 0, 0.1);
    text-decoration: none;
}

/***** small HR top widgets *****/

.bg-aqua2 {
    color: #00c0ef !important;
}

.small-box>.small-box-footer-aqua {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
    display: block;
    z-index: 10;
    background: #00acd7;
    text-decoration: none;
}

.bg-green2 {
    color: #00a65a !important;
}

.small-box-footer-green {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
    display: block;
    z-index: 10;
    background: #00cf70;
    text-decoration: none;
}

.bg-red2, .bg-yellow2, .bg-aqua2, .bg-blue2, .bg-green2, .bg-purple2, .bg-radRed2, .bg-dodgerBlue2, .bg-gossip2 {
    color: #428bca !important;
}

.small-box2 {
    border-radius: 2px;
    position: relative;
    display: block;
    margin-bottom: 20px;
    /*box-shadow: 0 1px 1px rgba(0,0,0,0.1);*/
}

.small-box2>.inner {
    padding: 10px;
}

.small-box2 .icon {
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
    position: absolute;
    top: -10px;
    right: 10px;
    z-index: 0;
    font-size: 90px;
}

.small-box2>.small-box-footer {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
    display: block;
    z-index: 10;
    background: #428bca;
    text-decoration: none;
}

.sw-menu-logo {
    height: 60px;
}

/*@media (min-width: 992px){
.col-md-2 {
    width: 10% !important;
}
}

@media (min-width: 768px){
.col-sm-2 {
    width: 10% !important;
}
}*/

.btn-ts {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 4px 1px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.form-control-ts {
    /* height: 34px; */
    padding: 6px 12px;
    font-size: 11px;
    /* line-height: 1; */
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control-ts:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.form-control-3 {
    width: 72%;
    height: 34px;
    padding: 4px !important;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555555;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #cccccc;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control-3:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.box-table {
    margin-left: 17px !important;
    margin-right: 23px !important;
    border-top-color: #428bca;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px 0px, rgba(0, 0, 0, 0.188235) 0px 6px 20px 0px;
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border-top: 3px solid #428bca;
    height: 100%;
    padding-bottom: 15px
}

.box-table-inner {
    margin-right: 23px;
    border-top-color: #428bca;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px 0px, rgba(0, 0, 0, 0.188235) 0px 6px 20px 0px;
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border-top: 3px solid #428bca;
    height: 100%;
}

.rowSelected {
    background-color: #d6d7dc !important;
}

.nameToolbar {
    top: 2px;
    right: 2px;
    position: absolute;
}

.ui-widget-content {
    background-color: white;
}

@media screen and (min-width: 992px) {
    #loginForm {
        margin-top: 15% !important;
    }
}

/*core CSS*/

body {
    /*height: 100%;*/
    /*font-size: 12px;*/
    /*font-family: Segoe UI, Arial, Sans-serif;*/
    font-family: Verdana, Geneva, sans-serif;
    overflow: auto, hidden;
}

body * {
    font-size: 100%;
    font-family: Verdana, Geneva, sans-serif;
}

html {
    height: 100%;
}

body, html, input, div, form, td, tr, hr, select, textarea {
    margin: 0;
    padding: 0;
}

/*a:link {color: inherit;}*/

/*a:visited {color: inherit;}*/

/*a:active {color: inherit;}*/

#ChangedLayer {
    position: relative;
    visibility: hidden;
}

H2, H3 {
    color: black;
}

.STDWINDOW, .StdWindow {
    border: 0px solid black;
    /* If border is 0px, it's invisible. It would be better to specify "border-style: none;" */
    /*background-color: #ECE9D8;*/
    margin-bottom: 0;
}

TABLE.INNERWINDOW, table.InnerWindow {
    /*background-color: #ECE9D8;*/
    margin: 0;
}

TABLE.QUICKBAR {
    margin: 0;
}

HR {
    margin-top: 5px;
    margin-bottom: 10px;
    border-top: 1px solid #ccc;
}

.STDWINDOWHEADER, .StdWindowHeader {
    /*background-color: #2C96C8;*/
    color: #255783;
    text-align: center;
}

.StdRJText, .STDRJTEXT {
    text-align: right;
    white-space: nowrap;
    margin-right: 4px;
}

.STDTEXT, .StdText {
    text-align: left;
}

.StdLJText, .STDLJTEXT {
    text-align: left;
    white-space: nowrap;
    margin: 4px;
    color: #fff;
    font-size: 10pt;
}

.StdCJText, .STDCJTEXT {
    text-align: center;
}

.StdRJRedText, .STDRJREDTEXT {
    text-align: right;
    white-space: nowrap;
    margin-right: 4px;
    color: #c2382b !important
}

.StdRedText, .STDREDTEXT {
    text-align: left;
    color: #c2382b !important
}

.STDBLUETEXT {
    text-align: right;
    color: #255783
}

.LBLUETEXT, .LEFTBLUETEXT, .StdLJBlueText {
    text-align: left;
    color: #255783;
}

.STDLJNAVY {
    color: #255783;
    text-align: left;
}

.WRJ {
    /*background-color: white;*/
    text-align: right;
}

.WLJ {
    /*background-color: white;*/
    text-align: left;
}

.WCJ {
    /*background-color: white;*/
    text-align: center;
}

/*.INPUT {
    width: 30%;
    min-width: 150px;
}*/

.CINPUT {
    font-family: Courier, "Courier New";
    white-space: pre;
}

.TRIMINPUT {
    padding: 0;
    margin: 0;
}

.BOLDINPUT {
    font-weight: bold;
}

.DISABLEDINPUT {
    color: gray;
}

.UPPERINPUT, .upperinput {
    text-transform: uppercase;
}

.SmallSectionHeader {
    color: #428bca;
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 5px;
    padding-top: 5px;
}

.LARGESECTIONHEADER, .LargeSectionHeader {
    text-align: left;
    font-size: 12pt;
}

.TABUP {
    /*background-color: #ECE9D8;*/
    text-decoration: none;
}

.TABDOWN {
    /*background-color: white;*/
    text-decoration: none;
}

.CWPOPUP {
    /*background-color: #ECE9D8;*/
}

.scrollpop {
  overflow: auto;
  width: 760px;
  height: 350px;
}

.scrollpop tbody tr td {
    padding: 4px;
}

.authhead tbody tr td {
    padding: 4px;
}

IMG.TOOLBAR {
    margin-top: 2px
}

/*IMG.INDICATOR {float: right; border: 0px}*/

.REPTOOLBAR {
    background-color: #ECE9D8;
    background-image: none;
    margin: 1pt;
}

.SELECT1 {
    width: 100%;
}

/* all new tabs (still table based) */

.HIDDEN {
    visibility: hidden;
}

.TABCLASS, .tabclass, .tab {
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
    z-index: 3;
}

.TABCLASSNEW {
    position: absolute;
    visibility: hidden;
}

.TABCLASSNEWVIS {
    position: absolute;
    visibility: visible;
}

.TABSELECTLEFT {
    background: url('../images/CW_LTAB.GIF') center no-repeat;
    width: 7px;
    height: 14px;
}

.TABSELECTRIGHT {
    background: url('../images/CW_RTAB.GIF') center no-repeat;
    width: 7px;
    height: 14px;
}

.TABUNSELECTTOP {
    background-color: black;
    height: 1px;
}

.TABSELECTTOP {
    height: 1px;
}

.TABUNSELECT {
    background-color: white;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.TABSELECT {
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.TABUNSELECTLEFT {
    background: url('../images/CW_LWTAB.GIF') center no-repeat;
    width: 7px;
    height: 14px;
}

.TABUNSELECTRIGHT {
    background: url('../images/CW_RWTAB.GIF') center no-repeat;
    width: 7px;
    height: 14px;
}

/* Internet Explorer Fixes */

/* :hover Fix
   Add to this list any element which should support :hover pseudo class. When you declare the :hover pseudo class, make sure
   to add a second real class, like in the following example
   p:hover,
   p.hover
   {
     <CSS Attributes>
   } */

label {
    behavior: url('IEFixes.htc');
    /*display: initial !important;*/
}

/* Class Styles */

#FormTitle, .FormTitle {
    width: 100%;
    margin: 0;
    padding: 1px 0px;
    background-color: #2C96C8;
    color: white;
    font-weight: bold;
    height: 16px;
}

/* Common Styles */

#Wrapper {
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

#Container {
    height: 100%;
    float: left;
}

.Buttons {
    text-align: center;
    padding: 4px;
}

#Toolbar {
    margin: 0;
    padding: 0;
    text-align: left;
}

.Clr {
    clear: both;
}

.Unchanged {
    background: url(../images/buttoff.gif) top left no-repeat;
}

.Changed {
    background: url(../images/flash.gif) top left no-repeat;
}

/* Window Header Styles */

body#ShiftSelector * {
    font-size: 100%;
}

#Content {
    display: block;
    text-align: center;
}

#statusbutton, .Indicator {
    width: 16px;
    height: 16px;
    float: right;
}

.ui-dialog-titlebar-close {
    display: none;
}

.ui-tabs .ui-tabs-panel {
    padding: 0.5em;
}

.ui-widget-overlay {
    background: none;
}

/******************************* Custom Styles *******************************/

/* 12/03/2008 - Added styles for Shift Selector Dialog */

#ShiftSelector #Wrapper {
    /*width: 650px;*/
    /*height: auto;*/
}

#ShiftSelector #Container {
    /*width: 640px;*/
    /*height: auto;*/
    /*text-align: center;*/
}

#ShiftSelector #Content {
    border: 1px dotted gray;
}

/* Header Styles */

#ShiftSelector #Header02 {
    border: 1px solid gray;
}

#ShiftSelector #EmployeeData {
    width: 632px;
    height: 60px;
    float: left;
    padding: 0 4px;
    text-align: center;
}

#ShiftSelector #EmployeeData h1, #ShiftSelector #EmployeeData h3 {
    margin: 8px 0;
    font-size: 150%;
}

#ShiftSelector #SelectedWeek {
    margin: 0;
    font-size: 130%;
}

#ShiftSelector fieldset {
    border-style: none;
    border-bottom: 1px dotted gray;
    padding: 8px 0;
    margin: 0;
}

#ShiftSelector .RangeParam {
    width: 60px;
    float: right;
    text-align: center;
}

#ShiftSelector .RangeParam h5 {
    height: 28px;
    margin: 0;
    padding: 12px 0 0 0;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
}

#ShiftSelector .RangeParam p {
    height: 35px;
    border-left: 1px solid gray;
    margin: 0;
    padding-top: 17px;
    font-weight: bold;
    font-size: 130%;
}

#ShiftSelector #Content .Label {
    margin: 0 8px;
    font-weight: bold;
    font-size: 120%;
}

#ShiftSelector #Content #Selection .Label {
    float: left;
    margin: 2px 8px 0 100px;
}

#ShiftSelector #Content #Selection .Fields {
    float: left;
    margin: 0;
    padding: 0;
}

#ShiftSelector #Content #Selection .Fields input, #ShiftSelector #Content #Selection .Fields select {
    width: 200px;
    display: block;
}

#ShiftSelector #DaysQuickSelect {
    height: 30px;
    margin-left: 8px;
    text-align: left;
}

/*
#ShiftSelector #DaysQuickSelect input
{
  display: block;
  width: 100%;
}*/

/*
#ShiftSelector #Days .DayInfo,
#ShiftSelector #Days #WeekTotals
{
  width: 80px;
  height: 60px;
  float: left;
  text-align: center;
  margin: 0;
  padding: 0;
  border: 1px solid red;
}

#ShiftSelector #Days .DayInfo label,
#ShiftSelector #Days .DayInfo input,
#ShiftSelector #Days .DayInfo p
{
  margin: 0 auto 0 auto;
  display: block;
  font-size: 110%;
}*/

#ShiftSelector #Days td {
    width: 80px;
    text-align: center;
    padding: 4px 2px;
}

#ShiftSelector #Days td .Absence {
    font-weight: bold;
    color: red;
}

#ShiftSelector #Days table {
    border-collapse: collapse;
    margin-top: 4px;
}

#ShiftSelector table #WeekRow1 td {
    border-top: 1px solid gray;
    vertical-align: top;
    padding-bottom: 0;
}

#ShiftSelector table #WeekRow1 td h3 {
    margin: 0;
}

#ShiftSelector table #WeekRow5 td {
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
}

#ShiftSelector table td label {
    margin: 0;
    padding: 0;
}

#ShiftSelector td .DayWorkDescr, #ShiftSelector td .DayBreakDescr {
    font-size: 90%;
}

#ShiftSelector #ErrorMessages {
    display: none;
}

/* Slider and TrackBar styles */

#ShiftSelector #TrackBar {
    width: 600px;
    margin: 0 auto;
}

#ShiftSelector .Slider {
    width: 600px;
    height: 16px;
    background: url(../images/sliderbk.png) center left no-repeat;
    background-color: transparent;
    position: relative;
    border: none;
}

#ShiftSelector .Indicator:hover {
    cursor: pointer;
}

#ShiftSelector #TrackBar #IndicatorStart {
    background: url(../images/Indicator01.gif) top left no-repeat;
    border: none;
    margin-left: -0.75em;
    width: 1.5em;
}

#ShiftSelector #TrackBar #IndicatorEnd {
    background: url(../images/Indicator02.gif) top left no-repeat;
    border: none;
    margin-left: -0.75em;
    width: 1.5em;
}

#ShiftSelector #TrackBar .TimeLabel {
    float: left;
    margin-left: 64px;
}

#ShiftSelector #Selections {
    height: 50px;
    position: relative;
    border: 1px solid gray;
}

#ShiftSelector .SelectionRect {
    height: 50px;
    background-color: green;
    /*border: 1px solid black;*/
    position: absolute;
    float: left;
    opacity: .5;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    left: 0;
}

#ShiftSelector #ChangeIndicator {
    width: 16px;
    height: 16px;
    font-size: 1px;
    float: right;
    margin-top: -17px;
}

#ShiftSelector #BreakGroupBox {
    width: 180px;
    margin: 8px auto 10px auto;
    border: 1px solid gray;
    padding: 4px 0 8px 0;
}

#ShiftSelector #BreakGroupBox legend {
    margin-left: 4px;
}

/* 27/03/2008 - Merged styles for File Selector Dialog */

body#FileSelector {
    text-align: center;
}

#FileSelector .STDWINDOWHEADER h4 {
    margin: 0;
    padding: 4px 0 4px 12px;
    font-size: 9px;
}

#FileSelector #Wrapper {
    width: 660px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

#FileSelector #Container {
    width: 650px;
    height: 100%;
    float: left;
}

#FileSelector #CaptionData {
    width: 300px;
    float: right;
    text-align: right;
    padding-right: 8px;
}

#FileSelector #Content {
    display: block;
    text-align: center;
}

#FileSelector #FileNavigator {
    width: 620px;
    border: 1px solid black;
    margin: 10px auto;
    text-align: left;
}

#FileSelector #FileNavigator #Directory h3 {
    margin: 4px;
    font-size: 9px;
}

#FileSelector #FileNavigator table#FileList {
    width: 100%;
    background-color: white;
    border-collapse: collapse;
    margin: 0;
    font-size: 9px;
}

#FileSelector #FileList .NoFilesFound {
    text-align: center;
    border-style: none;
}

#FileSelector #FileList thead {
    width: 100%;
    display: block;
}

#FileSelector #FileList tfoot {
    /* Footer is not used at the moment, so it's made invisible */
    display: none;
}

#FileSelector #FileList thead th {
    background-color: gray;
    color: white;
    border-left: 1px solid silver;
    border-right: 1px solid silver;
    font-weight: bold;
    padding: 0px 4px;
}

/* Data Cells */

#FileSelector #FileList tbody {
    height: 480px;
    overflow: auto;
    display: block;
}

#FileSelector #FileList tbody tr {
    height: 16px;
}

#FileSelector #FileList tbody td {
    border-left: 1px solid gray;
    border-right: 1px solid gray;
    padding: 0px 4px;
}

#FileSelector #FileList tbody input {
    margin: 0;
}

#FileSelector #FileList .Selector {
    width: 20px;
    text-align: center;
}

#FileSelector #FileList img.Icon {
    width: 16px;
    height: 16px;
    text-align: center;
    margin: 2px 6px 0 0;
}

#FileSelector #FileList .Name {
    width: 320px;
    text-align: left;
}

#FileSelector #FileList .Name label:hover, #FileSelector #FileList .Name label.hover {
    color: blue;
    cursor: pointer;
}

#FileSelector #FileList .Size {
    width: 70px;
    text-align: right;
}

#FileSelector #FileList .Date {
    width: 110px;
    text-align: right;
}

#FileSelector #FileList .Type {
    width: 40px;
    text-align: center;
}

/* Training */

.TrainingScheduleLayer {
    /*background-color: #EFEBDE;*/
    position: relative;
    visibility: visible;
    width: 300px;
    height: 350px;
    overflow: auto;
    text-align: left;
}

/* Project Select screen */

.ProjectTreeView {
    background-color: #F1F5FA;
    text-align: center;
    border: black 1px solid;
}

span.ProjectTreeviewSpanArea a {
    font-size: 10pt;
    text-decoration: none;
    color: black;
}

span.ProjectTreeviewSpanArea a:hover {
    color: blue;
}

.ProjectSelectedHighLight {
    color: black;
    background-color: red;
    text-align: left;
    margin-top: 4px;
    margin-bottom: 4px;
}

.absent {
    text-align: center;
    color: red;
}

.Attend {
    background-color: #dcebee;
    text-align: left;
}

.BANNERTEXT {
    text-align: left;
    font-size: 12pt;
}

.bigred {
    font-size: 12pt;
    color: red;
}

/*rostdet.htm*/

.Blank {
    text-decoration: none;
    background-color: white;
    color: white
}

.BLJ {
    text-decoration: none;
    color: black;
    background-color: #EAF6F6;
    text-align: left
}

.blue {
    color: blue
}

.BlueCJText {
    text-align: center;
    color: blue;
}

.BlueRJText {
    text-align: right;
    color: blue;
}

.BlueHeader {
    text-decoration: none;
    font-size: 10pt;
    color: blue
}

.BlueLJVerdana {
    text-decoration: none;
    color: blue;
    font-size: 8pt;
    font-family: verdana, MS Sans Serif, Arial, Sans-serif;
    text-align: left
}

.BoldRed {
    color: red;
    font-weight: bold;
    text-align: center;
}

.BottomAll {
    background-color: #F0EEEF;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomAllPRD {
    background-color: #FFFFFF;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomAllPT {
    background-color: #D7DEE6;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomAllURD {
    background-color: #FFF8E8;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomAllUT {
    background-color: #DEDEC6;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomLeft {
    background-color: #F0EEEF;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomLeftPRD {
    background-color: #FFFFFF;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomLeftPT {
    background-color: #D7DEE6;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomLeftURD {
    background-color: #FFF8E8;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BottomLeftUT {
    background-color: #DEDEC6;
    border-color: black;
    border-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: solid;
}

/*selfro.htm*/

.BRJ {
    text-decoration: none;
    color: black;
    background-color: #EAF6F6;
    text-Align: Right
}

.BSTDCJTEXT {
    /*background-color: #F6F6EA;*/
    text-align: center;
}

.BSTDLJTEXT {
    /*background-color: #F6F6EA;*/
    text-align: left;
}

.BSTDRJTEXT {
    /*background-color: #F6F6EA;*/
    text-align: right;
}

.BSTDLJTEXTG {
    /*background-color: #F6F6EA;*/
    text-align: left;
    color: gray;
}

.butimg {
    vertical-align: bottom;
}

.CHECKBOX2 {
    text-decoration: none;
}

.Closed {
    background-color: #dcebee;
    text-align: left;
}

.clPubRD {
    background-color: #FFFFFF;
}

/*selfro.htm*/

.clPubT {
    background-color: #D7DEE6;
}

/*selfro.htm*/

.clUnpubRD {
    background-color: #FFF8E8;
}

/*selfro.htm*/

.clUnpubT {
    background-color: #DEDEC6;
}

/*selfro.htm*/

.Comments {
    color: navy;
}

/*pwcom.htm*/

.CONTENTS {
    text-decoration: none;
    font-family: Courier;
}

/*repsel.htm*/

#FindPlanForm .planlist {
    text-decoration: none;
    font-family: Courier, Arial;
    font-size: 8pt;
    white-space: pre;
}

#AlloReportForm .Courier {
    text-decoration: none;
    font-family: Courier, Arial;
    font-size: 9pt;
    white-space: pre;
    color: black;
}

#BalanceAdjustmentsForm .Adjustmentlist, #BalanceListForm .BalanceList {
    background-color: #DCE8E7;
    text-align: right;
    color: black;
    font-size: 8pt;
    font-family: Courier;
}

#TrainingCourseForm .RequiredGainedList {
    background-color: white;
    text-align: left;
    font-size: 8pt;
    color: black;
    width: 150px;
}

.Courier {
    text-decoration: none;
    font-family: Courier, Arial;
    font-size: 8pt;
    white-space: pre;
    background-color: white;
}

/*Standard Task Form*/

#UserFieldForm .Courier {
    text-decoration: none;
    font-family: Courier, Arial;
    font-size: 8pt;
}

#SelectPlanForm .PlanList {
    text-decoration: none;
    font-family: Courier, Arial;
    font-size: 8pt;
    white-space: pre;
}

/*selpln.htm*/

#SelfAllocationForm .PostsList {
    background-color: white;
    text-align: right;
    font-family: Courier;
    color: white;
}

/*selfal.htm*/

.CURTIME {
    position: relative;
    visibility: visible;
}

.CURTIMEN4 {
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
}

.DATERANGE {
    text-decoration: none;
}

.Default {
    background-color: #dcebee;
    text-align: left;
}

.EmpAbsent {
    background-color: #dcebee;
    text-align: left;
}

.Filled {
    background-color: #dcebee;
    text-align: left;
}

.FilledPost {
    background-color: #dcebee;
    text-align: left;
}

.Green1 {
    text-decoration: none;
    color: black;
    background-color: #DCE8E7;
    text-align: Right
}

.Green2 {
    text-decoration: none;
    color: black;
    background-color: #EAF6F6;
    text-Align: Right
}

.GSTDCJTEXT {
    background-color: #E7E8DC;
    text-align: center;
}

.GSTDLJTEXT {
    background-color: #E7E8DC;
    text-align: left;
}

.GSTDLJTEXTG {
    background-color: #E7E8DC;
    text-align: left;
    color: gray;
}

.GSTDRJTEXT {
    background-color: #E7E8DC;
    text-align: right;
}

.H3 {
    font-size: 11pt;
}

/*alldel.htm, alodte.htm*/

.Header, .HEADER {
    color: #840000;
    text-align: left;
    font-size: 11pt;
    font-weight: bold;
}

.Image {
    position: relative;
    visibility: visible;
}

.InfoText {
    color: #800000;
}

.IsRO {
    background-color: #dcebee;
    text-align: left;
}

.LAYER {
    /*background-color: #EFEBDE;*/
    position: relative;
    visibility: visible;
    width: 300px;
    height: 350px;
    overflow: auto;
    text-align: left;
}

/*enrem.htm*/

.LJArial {
    text-decoration: none;
    color: maroon;
    font-size: 10pt;
    font-family: arial, MS Sans Serif, Arial, Sans-serif;
    text-align: left
}

.LJHeader {
    text-decoration: none;
    font-size: 10pt;
    color: black;
}

.Navy {
    text-decoration: none;
    color: navy;
    text-align: right;
}

/*tskalo.htm*/

.NavyHeader {
    text-decoration: none;
    font-weight: bold;
    color: white;
    background-color: navy;
    text-align: Right
}

.NavyLJText {
    text-align: left;
    color: navy;
}

/*pwtim.htm*/

.NotAvail {
    background-color: #DCEBEE;
    text-align: left;
}

.NotEmployed {
    background-color: #dcebee;
    text-align: left;
}

.NSTDCJTEXT {
    /*background-color: #ECE9D8;*/
    text-align: center;
}

.NSTDLJTEXT {
    /*background-color: #ECE9D8;*/
    text-align: left;
}

.NSTDRJTEXT {
    /*background-color: #ECE9D8;*/
    text-align: right;
}

.PartAbs {
    background-color: #dcebee;
    text-align: left;
}

#MainPage .PLAIN {
    text-decoration: none;
    font-size: 120%;
}

/*main.htm*/

#SelectionFilter .PLAIN {
    text-decoration: none;
    white-space: pre;
}

.PLAIN {
    text-decoration: none;
    border-color: transparent;
}

.btn-is-disabled {
    pointer-events: none;
    /* Disables the button completely. Better than just cursor: default; */
}

/*rsave.htm repsel.htm ProBar.htm*/

.PLAINBLUE {
    text-decoration: none;
    color: blue
}

#ClockinForm .purple, #ClockinForm .PURPLE {
    font-size: 10pt;
    font-weight: bold;
    color: Purple
}

/*clockin.htm*/

.purple, .PURPLE {
    text-decoration: none;
    color: purple;
}

.ReadOnly {
    background-color: #dcebee;
    text-align: left;
}

.red, .RED, .PLAINRED {
    text-decoration: none;
    color: red !important;
}

.Relief {
    background-color: #dcebee;
    text-align: left;
}

.ReliefPost {
    background-color: #dcebee;
    text-align: left;
}

.RestDay {
    background-color: #dcebee;
    text-align: left;
}

/*.RJTEXT {
  text-align: right;
}*/

.LJTEXT {
    text-align: left;
}

.RosteredOn {
    background-color: #dcebee;
    text-align: left;
}

/* #CourseEvaluationsForm .ScrollBar,
#EmployeeCourseCreditsForm .ScrollBar {
  position: relative;
  visibility: visible;
  width: 300px;
  height: 350px;
  overflow: auto;
}*/

/*coueva.htm*/

.spacer {
    margin: 0;
}

.StdCJMaroon {
    text-align: center;
    font-size: 12pt;
    color: maroon;
    font-weight: bold;
}

.StdLJMaroon {
    text-align: left;
    color: maroon;
    font-weight: bold;
}

.StdLJTextB {
    text-align: left;
    color: blue;
}

.StdLJTextM {
    text-align: left;
    color: maroon;
    font-weight: bold;
}

.StdLJTextP {
    text-align: left;
    color: purple;
}

.StdLJTextV {
    text-align: left;
    font-size: 7pt;
    font-family: verdana;
}

.StdRJTextV {
    text-align: right;
    font-family: verdana;
}

.StdCJVerdana {
    text-decoration: none;
    font-size: 8pt;
    font-family: verdana, MS Sans Serif, Arial, Helvetica, Sans-serif;
    text-align: center;
}

.StdLJVerdana {
    text-decoration: none;
    font-size: 8pt;
    font-family: verdana, MS Sans Serif, Arial, Helvetica, Sans-serif;
    text-align: left;
}

.StdLJVerdanaB {
    text-decoration: none;
    font-size: 8pt;
    font-family: verdana, MS Sans Serif, Arial, Helvetica, Sans-serif;
    text-align: left;
    color: blue;
}

.StdNText {
    text-align: right;
    color: navy
}

.StdRJVerdana {
    text-decoration: none;
    font-size: 8pt;
    font-family: verdana, MS Sans Serif, Arial, Helvetica, Sans-serif;
    text-align: right;
}

.StdRJVerdanaB, .StdRJBlueVerdana {
    text-decoration: none;
    font-size: 8pt;
    font-family: verdana, MS Sans Serif, Arial, Helvetica, Sans-serif;
    text-align: right;
    color: blue;
}

.SUBMENU {
    position: absolute;
    top: 53px;
    left: 0;
    visibility: hidden;
    z-index: 3
}

.ToBeFilled {
    background-color: #dcebee;
    text-align: left;
}

.TopAll {
    background-color: #F0EEEF;
    border-color: black;
    border-width: 1px;
    border-style: solid;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopAllPRD {
    background-color: #FFFFFF;
    border-color: black;
    border-width: 1px;
    border-style: solid;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopAllPT {
    background-color: #D7DEE6;
    border-color: black;
    border-width: 1px;
    border-style: solid;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopAllURD {
    background-color: #FFF8E8;
    border-color: black;
    border-width: 1px;
    border-style: solid;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopAllUT {
    background-color: #DEDEC6;
    border-color: black;
    border-width: 1px;
    border-style: solid;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopLeft {
    background-color: #F0EEEF;
    border-color: black;
    border-width: 1px;
    border-Top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopLeftPRD {
    background-color: #FFFFFF;
    border-color: black;
    border-width: 1px;
    border-Top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopLeftPT {
    background-color: #D7DEE6;
    border-color: black;
    border-width: 1px;
    border-Top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopLeftURD {
    background-color: #FFF8E8;
    border-color: black;
    border-width: 1px;
    border-Top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: none;
}

/*selfro.htm*/

.TopLeftUT {
    background-color: #DEDEC6;
    border-color: black;
    border-width: 1px;
    border-Top-style: solid;
    border-left-style: solid;
    border-right-style: none;
    border-bottom-style: none;
}

/*selfro.htm*/

.TOTALS {
    position: relative;
    visibility: visible;
}

/*48hour.htm, absopt.htm, balance.htm*/

/*#CourseEnrollmentForm .TOTALS,
#SelectCourseForm .TOTALS,
#TrainingEnrollEmpForm .TOTALS,
#TrainingScheduleFormDat .TOTALS,
.ScrollBar {
  position: relative;
  visibility: visible;
  width: 300px;
  height: 350px;
  overflow: auto;
}
*/

/*couenr.htm*, enrem.htm, schdat.htm, selpk3.htm*/

.TOTALSN4 {
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
}

.TreeView {
    background-color: #F6F6EA;
    text-align: center;
    border: 1px black solid;
}

/*selcou.htm*/

.WLJb {
    background-color: #dcebee;
    text-align: left;
}

.WLJRed {
    background-color: white;
    text-align: left;
    color: red;
}

.WRJb {
    background-color: #dcebee;
    text-align: right;
}

.WSTDLFTEXT {
    background-color: white;
    position: relative;
    text-align: left;
    overflow: auto;
}

#DetailButton {
    position: relative;
    right: 0;
    bottom: 0;
    float: right;
}

#InputLayer {
    position: relative
}

/*login,logout,clockin - was for N4*/

#MainScreen {
    position: relative
}

/*login,logout,clockin*/

#ToolPanel {
    position: absolute;
    top: 40px;
    left: 0;
    z-index: 0;
    background-color: #ECE9D8;
}

#NameLayer {
    position: relative;
    visibility: hidden;
}

#Emboss {
    position: absolute;
    top: 100px;
    left: 100px;
    visibility: hidden;
}

/*end*/

/*extfiles.htm*/

.SType {
    text-align: center;
    width: 100px
}

.SFile {
    text-align: center;
    width: 250px
}

.SComment {
    text-align: center;
    width: 250px
}

.SAdded {
    text-align: center;
    width: 110px
}

.SModified {
    text-align: center;
    width: 110px
}

.FILTER {
    margin-top: 4px;
    margin-bottom: 4px;
    color: black;
}

TABLE.LISTWINDOW {
    background-color: white;
}

#ClockcardForm {
    color: #656567;
}

#ClockcardForm .DataCell {
    text-align: right;
    padding: 0 35px 0 0;
    margin: 0;
    width: 10%;
}

#ClockcardForm .UserLineBox {
    /*font-family: "Courier New", Courier, monospace;
    margin-top: 6px;
    margin-right: 6px;
    padding: 6px;
    border: 1px solid #000;
    background-color: white;
    text-align: left;
    min-height: 100px;*/
}

#ClockcardForm .EmpName {
    color: #255783 !important;
    font-weight: bold;
    text-align: left;
    font-size: 11pt;
}

#ClockcardForm .EmpNo {
    color: #428bca;
    text-align: left;
    font-size: 11pt;
}

#ClockcardForm .DeptName {
    text-align: left;
    font-size: 10pt;
}

#ClockcardForm .DateCaption {
    text-align: left;
    font-size: 10pt;
    font-weight: bold;
    color: #666666;
}

#ClockcardForm .gridCaption {
    padding-right: 6px;
    text-align: right;
    width: 10%;
}

.LoginTitle {
    font-size: 18pt;
    text-align: center;
    text-decoration: bold;
    color: #2C96C8;
    height: 41px;
    width: 314px;
}

.BottomReg1 {
    font-size: 10pt;
    text-align: center;
    text-decoration: bold;
    /*color: #2C96C8;*/
    color: #fff;
}

.BottomReg2 {
    font-size: 10pt;
    text-align: center;
    text-decoration: bold;
    color: #fff;
}

.LoginBox {
    width: 222px;
    height: 39px;
    background-image: url('../images/cw_lout.gif');
}

.LoginText {
    font-size: 14pt;
    text-align: center;
    text-decoration: none !important;
    color: white;
    margin: 0;
    padding: 5px 0 0 0;
}

#LoginForm .title {
    color: #61ABFF;
    text-align: left;
    /*font-weight: bold;*/
    font-size: 14pt;
}

#LoginForm .logintitle {
    margin: 20px;
    text-align: left;
}

#TopLogos {
    background: url('../images/login_header.png');
    background-repeat: repeat-x;
    height: 90px;
}

#TopLogos #Logo1 {
    background: url('../images/login_logo.png') no-repeat;
    height: 99px;
    width: 366px;
    margin-left: 25px;
}

#LogoutScreen #InputLayer {
    position: relative;
    text-align: center;
    color: red;
    font-weight: bold;
}

#LogoutScreen #RegDet {
    position: fixed;
    top: 0;
    left: 0;
    visibility: hidden;
}

#WebRepSelForm #NameLayer {
    position: relative;
    visibility: hidden;
    font-size: large;
}

#WebRepSelForm #content_container {
    /*width: 25em;*/
}

#WebRepSelForm #content_container #content_header {
    font-size: large;
    color: #255783;
    display: inline;
}

.reportHeader {
    font-size: large;
    color: #255783;
    padding-bottom: 10px;
}

#WebRepSelForm #content_container #content_list {
    background-color: #eaeaea;
    cursor: default;
    overflow: auto;
    width: 100%;
    float: left;
    font-family: "Courier New", Courier, monospace;
    height: 335px;
}

#WebRepSelForm #content_container #content_list .included {
    background-color: #255783;
    color: white;
}

#WebRepSelForm #content_container #content_select_image {
    float: right;
    display: inline;
    padding-bottom: 10px;
}

#WebRepSelForm #content_container #content_button_div {
    width: 100%;
    padding: 0;
    position: absolute;
    bottom: 65px;
    left: 37%;
    bottom: -100px;
}

/*#WebRepSelForm #content_container #content_button_div .contentbutton {
    width: 32%;
    margin: 0;
    padding: 0;
    background-color: #ECE9D8;
}*/

#WebRepSelForm #content_container #content_button_div .selected {
    background-color: #275c8a;
}

#WebRepSelForm #E_COMBO {
    width: 100%;
    display: block;
}

#WebRepSelForm #E_LIST {
    width: 100%;
}

#WebRepSelForm .RangeLayer {
    display: none;
    padding: 6px 0 0 4px;
    width: 170px;
}

#DailyCommentsForm .DateCell {
    text-align: right;
    vertical-align: top;
    white-space: nowrap;
    font-size: 14px;
    color: #428bca;
    font-weight: bold;
    padding: 10px;
}

#ReturnToWorkForm #infopanel {
    font-size: 160%;
    font-weight: bold;
}

/* selabs.htm */

#AbsList {
    background-color: white;
    border-collapse: collapse;
}

#AbsList td {
    border: 1px solid black;
}

.testclass {
    background-color: #FF0000;
    color: #FFFF00;
}

#ProjectOverview {
    display: none;
}

#ProjectOverview table {
    border-collapse: collapse;
}

#ProjectOverview table thead th {
    text-align: center;
}

#ProjectOverview table tbody td {
    text-align: right;
    white-space: nowrap;
}

#ProjectOverview table tfoot td {
    text-align: right;
    white-space: nowrap;
    border-top: 2px #d70400 solid;
    font-weight: bold;
}

#ProjectOverview table tbody td.SumCol {
    border-left: 2px solid #d70400 !important;
    font-weight: bold;
}

#ProjectOverview table tbody td.DescCol {
    white-space: normal;
    text-align: left;
}

#ProjectComment {
    display: none;
}

#RosterDefForm #shiftbox wrapper {
    position: relative;
    float: left;
}

#RosterDefForm #shiftbox {
    position: static;
    top: 100px;
    background-color: #ECE9D8;
    width: 210px;
}

#RosterDefForm #shiftbox button {
    display: block;
    width: 100%;
}

#RosterDefForm .ui-dialog-titlebar-close {
    display: none;
}

#RosterDefForm td.selectable {
    cursor: pointer;
}

#RosterDefForm tbody {
    vertical-align: top;
}

#RosterDefForm td.notselectable {
    background-color: #FFFC3D;
}

#RosterDefForm td.selected {
    background-color: #D243FA;
}

#RosterDefForm #maintable {
    border-collapse: collapse;
    width: 100%;
}

#RosterDefForm #status_panel {
    padding: 5px 0;
}

#RosterDefForm #status_panel label {
    padding: 5px;
}

#RosterViewDialog {
    display: none;
}

#RosterViewDialog #rosterlist, #RosterViewDialog #rostersearch {
    width: 215px;
}

#RosterViewDialog #tablediv {
    overflow: scroll;
    height: 27em;
    width: 34em;
}

#RosterViewDialog #tablediv table {
    width: 100%;
    border-collapse: collapse;
}

#RosterViewDialog #tablediv td {
    white-space: nowrap;
}

#RosterViewDialog #tablediv .formrow {
    padding: .2em 0;
    clear: left;
}

#RosterViewDialog #tablediv .formrow label {
    float: left;
    width: 9em;
    font-weight: bold;
}

#HRScreenForm .hrtable td {
    vertical-align: top;
    padding: 0.3em;
}

#HRScreenForm .hrtable td input, #HRScreenForm .hrtable td select, #HRScreenForm .hrtable td label {
    margin: 0;
    padding: 0;
}

#HRScreenForm .hrtable td label {
    display: block;
}

#HRScreenForm .hrhistorydiv {
    overflow: auto;
    height: 10em;
}

/*#HRScreenForm .hrhistorydiv table {
    border: 1px solid #000000;
    border-collapse: collapse;
    background-color: #ffffff;
    width: 100%;
}*/

/*#HRScreenForm .hrhistorydiv table td {
    border: 1px solid #000000;
}*/

#HRScreenForm .hrfloat, #HRScreenForm .hrint {
    text-align: right;
}

#HRScreen #event_dialog {
    display: none;
}

table.tablesorter .headerDefault {
    background: url('../images/tablesorter.png') right center no-repeat;
    padding-right: 1em;
    cursor: pointer;
}

table.tablesorter .headerSortDown {
    background: url('../images/tablesorter.png') right bottom no-repeat;
}

table.tablesorter .headerSortUp {
    background: url('../images/tablesorter.png') right top no-repeat;
}

#HRScreen #eventlist_dialog {
    display: none;
}

#HRScreen #eventlist_content {
    overflow: auto;
    height: 15em;
}

/*#HRScreen #eventlist_content table {
    border: 1px solid #000000;
    border-collapse: collapse;
    background-color: #ffffff;
    width: 100%;
}*/

/*#HRScreen #eventlist_content table th {
    white-space: nowrap;
    text-align: left;
}*/

/*#HRScreen #eventlist_content table td {
    border: 1px solid #000000;
    white-space: nowrap;
}*/

.rightText {
    text-align: right;
}

.leftText {
    text-align: left;
}

.centerText {
    text-align: center;
}

.boldText {
    font-weight: bold;
    color: #428bca;
}

.buttonContainer {
    text-align: center;
    padding: 35px;
}

/*#tabs .ui-tab {
    display: none;
}*/

.bootstrap-dialog .bootstrap-dialog-title {
    font-size: 16px !important;
    color: #428bca !important;
}

#SelectDateScreen #DateText {
    padding: 2px 0;
    clear: left;
    font-size: 18px;
    color: #428bca;
}

#SelectDateScreen .formrow {
    padding: .8em 0;
    clear: left;
}

#SelectDateScreen .formrow label {
    float: left;
    width: 9em;
    font-weight: bold;
}

.clockingDetailsTable {
    padding: 10px;
    border-spacing: 4px;
}

.clockingEdit {
    size: 50px;
}

.pad-bottom {
    margin-bottom: 10px;
}

.clockingComments {
    resize: none;
    width: 100%;
    height: 100px !important;
}

.input100 {
    width: 100% !important;
}

#TreeLayer {
    height: 650px;
    width: 650px;
    overflow: auto;
}

#TreeLayer table {
    margin: 0;
}

#TreeLayer a {
    text-decoration: none;
}

#TreeLayerNew {
    overflow: auto;
}

#TreeLayerNew table {
    margin: 0;
}

#TreeLayerNew a {
    text-decoration: none;
}

.cw_suna {
    background-image: url('../images/cw_suna.gif');
    background-repeat: no-repeat;
    background-position: center;
    height: 12px;
    width: 12px;
}

.cw_sauth {
    background-image: url('../images/cw_sauth.gif');
    background-repeat: no-repeat;
    background-position: center;
    height: 12px;
    width: 12px;
}

.cw_stsh {
    background-image: url('../images/cw_stsh.gif');
    background-repeat: no-repeat;
    background-position: center;
    height: 12px;
    width: 12px;
}

.cw_sund {
    background-image: url('../images/cw_sund.gif');
    background-repeat: no-repeat;
    background-position: center;
    height: 12px;
    width: 12px;
}

#loading {
    width: 100%;
    text-align: center;
}

#waitdiv {
    display: inline-block;
}

.optionsdate {
    width: 90px;
}

#initdiv {
    width: 600px;
}

.dialoginit {
    display: none;
}

#options {
    position: relative;
    margin: 20px;
}

#ExpenseOptions #options {
    position: relative;
    margin: 20px;
    width: 100%;
}

/*.login_window_header{
  margin: 24px 0px 0px 30px;
  font-size: 2.2em;
  height: 60px;
}*/

#LoginScreen #InputLayer {
    position: relative;
    text-align: center;
    color: red;
    font-weight: bold;
}

#LoginScreen #RegDet {
    /*position: absolute;*/
    bottom: 0;
    width: 100%;
    margin: 0px auto;
    z-index: -1;
}

#LoginScreen .myTableBack {
    background-image: url('../images/loginWindow_bg.png');
    background-repeat: no-repeat;
    height: 267px;
    width: 467px;
}

#LoginScreen .langlink {
    color: white;
}

.logindiv {
    min-height: 267px;
    min-width: 467px;
    width: 467px;
}

/*
#outer {

  margin-left: 20px;
  position: absolute;
  overflow: scroll;
  float: left;
  overflow: auto;
}
*/

.alert {
    font-size: 10pt;
}

#sfpFilter {
    width: 100%;
    font-size: 1.3em;
    margin-bottom: 1rem;
}

#pickHeader {
    margin-bottom: 1rem;
    display: inline-block;
}

.pickselect {
    width: 100%;
    height: 300px;
    font-size: 10pt;
}

.border_l {
    display: none;
}

.border_r {
    display: none;
}

.border_bl {
    display: none;
}

.border_br {
    display: none;
}

.border_b {
    display: none;
}

.border_tl {
    display: none;
}

.border_t {
    display: none;
}

.border_tr {
    display: none;
}

.border2_l {
    display: none;
}

.border2_r {
    display: none;
}

.border2_bl {
    display: none;
}

.border2_br {
    display: none;
}

.border2_b {
    display: none;
}

.border2_tl {
    display: none;
}

.border2_t {
    display: none;
}

.border2_tr {
    display: none;
}

.formback {
    padding-left: 10px;
}

/*.formback {

	background-image: url('../images/bg_transition.png');
	background-repeat: repeat-x;
	background-size: auto;
	background-color:#dfedfa;

}*/

.formback_ie_7_8 {
    background-color: #ECF3FB;
}

.empdept {
    color: #255783 !important;
}

.empname {
    /*background-image: url('../images/empname_bg.png');*/
    float: left;
    height: 51px;
    color: #255783;
    padding-left: 10px;
    padding-top: 6px;
    /*overflow: hidden;*/
}

.empname_tail {
    /*background-image: url('../images/empname_bg_tail.png');*/
    float: left;
    width: 46px;
    height: 51px;
}

#EmpCalendarForm .trans {
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 35px;
    border: 2px solid #ddd;
    margin-right: 7px;
}

#EmpCalendarForm .year {
    color: #666666;
    font-weight: bold;
    font-size: 12px;
}

#EmpCalendarForm .curdate {
    color: #0C64D0;
}

#EmpCalendarForm .dayvalue {
    text-align: left;
    font-size: 8pt;
}

#clockingDetailsDialog, #dayPopup {
    display: none;
}

#rangepane {
    margin-left: 0;
    font-size: 14px;
    color: #428bca;
    font-weight: bold;
    margin-bottom: 10px;
}

.FilterDesc {
    width: 400px;
}

.myClockingTableBack {
    background-image: url('../images/clockingWindow_bg.png');
    background-repeat: no-repeat;
    height: 350px;
    /*267px;*/
    width: 467px;
}

#clockingScreenOuter {
    /*margin-left: 20px;
  position: absolute;
  overflow: visible;
  float: left;*/
}

.splitter_top {
    background-image: url('../images/Splitter_Top.png');
    background-repeat: no-repeat;
    vertical-align: top;
    height: 1px;
}

.splitter_bottom {
    background-image: url('../images/Splitter_Top.png');
    background-repeat: no-repeat;
    vertical-align: bottom;
    height: 1px;
    min-width: 250ps;
}

#EmployeeDetailsForm .photoFrame {
    border: 2px solid grey;
    width: 154px;
    height: 154px;
}

#EmployeeDetailsForm .upload {}

a:link {
    color: inherit;
    text-decoration: none;
}

/* unvisited link */

a:visited {
    color: inherit;
    text-decoration: none;
}

/* visited link */

a:hover {
    color: inherit;
    text-decoration: none;
}

/* mouse over link */

a:active {
    color: inherit;
    text-decoration: none;
}

/* selected link */

#ExpensesForm .currency {
    min-width: 140px;
    width: 140px;
}

#ExpensesForm .exptype {
    min-width: 140px;
    width: 140px;
}

#EmployeeSummary #centerpane table {
    /*border:  1px solid #000000;*/
    border-collapse: collapse;
    width: 100%;
}

#EmployeeSummary #centerpane table td {
    border: 1px solid #000000;
    background-color: white;
    padding: 5px;
}

#WtdDataEntryForm .mtable {
    vertical-align: bottom;
    padding: 4px;
}

#ChangePassForm #required {
    margin-left: 20px;
    font-size: 10pt;
}

#CostClockingsForm #MainDiv {
    min-width: 250px;
}

#RepSaveForm #rightCell {
    min-width: 250px;
}

#RepSaveForm .repNames {
    min-width: 250px;
}

#buttondiv {
    margin: 6px;
    text-align: center;
    width: 100%;
}

.hilite {
    color: #255783;
}

.hilite2 {
    color: #c43235;
}

.findemplink {
    color: #255783;
    cursor: pointer;
    cursor: hand;
}

#SumExpenseForm .headerrow td, #SumExpenseForm .datarow .DataCell, #SumExpenseForm .footerrow td {
    padding: 0 5px;
}

.empdetails {
    min-width: 860px;
}

.MSELECT {
    min-width: 225px;
}

.stdSelect {
    min-width: 150px;
}

.selectAlloc {
    min-width: 350px;
}

.ChildrenTable {
    table-layout: fixed;
}

.dateEdit {
    /*width: 98px;*/
}

.nm {
    margin-left: 0 !important;
}

.intEdit {
    width: 50px;
}

[name="InnerForm"] td {
    padding: 0em 1em 0em 1em;
    border-right: 1px solid #ddd;
}

#TheTree {
    width: auto;
    height: auto;
    overflow: auto;
}

#SelectDeptScreen {}

.treebox {
    padding: 10px;
    width: auto;
    height: auto;
    clear: left;
    margin-bottom: 30px;
}

.treerow {
    clear: left;
}

.treelink {
    width: 38px;
    height: 36px;
    float: left;
}

.treebutton {
    float: left;
    margin-top: 2px;
}

.treenode {
    margin-left: 9px;
    margin-right: 9px;
}

.filterbox {
    float: left;
    margin-top: 8px;
}

.deptdisable2 {
    border-width: 1px;
    margin: 0;
    height: 34px;
    background-color: #a5d2e0;
    color: #FFFFFF;
    cursor: not-allowed;
    display: inline-block;
    float: left;
    margin-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 6px;
}

.deptpart2 {
    border-width: 1px;
    margin: 0;
    height: 34px;
    background-color: #FFFFFF;
    color: #000000;
    display: inline-block;
    float: left;
    margin-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 6px;
}

/*.deptsel2 {
  border-style: solid;
  border-color: aqua;
  border-bottom-color: #000000;
  border-right-color: #000000;
  border-width: 1px;
  margin: 0;
  height: 19px;
  background-color: #0D9B9B;
  color: #ffffff;
  display: inline-block;
  float: left;
  margin-top: 2px;
  padding-left: 10px;
  padding-right: 10px;
}*/

/*.deptunsel2 {
  border-style: solid;
  border-color: #ffffff;
  border-bottom-color: #808080;
  border-right-color: #808080;
  border-width: 1px;
  margin: 0;
  height: 19px;
  background-color: #D9D5C5;
  color: #0000ff;
  display: inline-block;
  float: left;
  margin-top: 2px;
  padding-left: 10px;
  padding-right: 10px;
}*/

.deptsel2 {
    /* border-style: solid; */
    /* border-color: #255783; */
    border-width: 1px;
    /* border-left-width: 0; */
    margin: 0;
    height: 34px;
    background-color: #5bc0de;
    color: #FFFFFF;
    display: inline-block;
    float: left;
    margin-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 6px;
}

.deptunsel2 {
    /* border-style: solid; */
    /* border-color: #255783; */
    border-width: 1px;
    margin: 0;
    height: 34px;
    background-color: #FFFFFF;
    color: #000000;
    display: inline-block;
    float: left;
    margin-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 6px;
}

#currDeptDiv {
    height: 30px;
    margin-left: 22px;
    margin-top: 4px;
    font-size: 16px;
    font-weight: bold;
}

.selDeptBox {
    /*  width: 800px;
  height: 500px;*/
    clear: left;
    overflow: auto;
    height: 380px;
}

.selDeptRow {
    /*width: 1600px;*/
    /*height: 27px;*/
    clear: left;
    overflow: hidden;
}

.selDeptNode {
    display: inline-block;
    float: left;
    height: 30px;
    background-color: #ffffff;
    border-style: solid;
    border-color: #255783;
    /* border-bottom-color: #808080; */
    /* border-right-color: #808080; */
    border-width: 3px;
    margin: 0;
    height: 30px;
    margin-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;
    /* background-image: url(../images/pro_on2.gif); */
    background-repeat: repeat;
    color: #255783;
    cursor: pointer;
    font-weight: 700;
    border-radius: 0;
}

#selDeptBottom {
    overflow: hidden;
}

.selDeptSpacer {
    display: inline-block;
    float: left;
    height: 30px;
    width: 5px;
}

.selDeptBottMess {
    margin-top: 5px;
    margin-left: 22px;
}

#toggleShifts {
    text-align: center;
    width: 120px;
    position: fixed;
    top: 50px;
    right: 0px;
    z-index: 1000;
}

#waitdialog {
    text-align: center;
}

textarea {
    white-space: pre-wrap
}

/******************************Employee scheduler******************************/

#findStuff {
    display: none;
    position: fixed;
    padding: 5px 10px;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2000;
    background: none;
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 1.0;
}

#fs_container {
    position: relative;
    margin: 12vh auto 10px;
    max-width: 480px;
    height: 100%;
}

#fs_search {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    margin-bottom: 15px;
    border: none;
    padding: 13px 20px 15px;
    font-size: 20px;
    font-family: "Open Sans", sans-serif;
    background-color: #fff;
    border-radius: 0;
    font-weight: 300;
    box-shadow: 0 0 120px rgba(0, 0, 0, .7);
    margin-left: 18px;
}

#fs_results {
    position: relative;
    width: 100%;
    height: 63%;
    direction: ltr;
    text-align: left;
}

#fs_list {
    overflow: auto;
    max-height: 95%;
    margin-bottom: 7px;
}

#fs_list>li {
    font-family: "Open Sans", sans-serif;
    font-weight: 300;
    overflow: hidden;
    white-space: nowrap;
    color: #544e52;
    position: relative;
    padding: 5px 45px 5px 8px;
    border-bottom: 1px #e3e3e3 solid;
    cursor: pointer;
    background-color: #f1f1f1;
    font-size: 1.8em;
}

#fs_list>li:hover {
    color: rgb(14, 177, 186);
}

#fs_list>li[data="selected"] {
    background-color: rgb(150, 204, 209);
}

#fs_list>li>p {
    position: absolute;
    width: 36px;
    height: 36px;
    right: 5px;
    opacity: .75;
    top: 50%;
    margin-top: -18px;
    background-color: rgb(215, 212, 201);
    font-size: x-large;
    text-align: center;
    overflow: hidden;
}

#fs_list>li>p::after {
    content: '\1F4CE';
}

.fs_shift::after {
    content: '\21E7' !important;
}

.fs_flag::after {
    content: '\2691' !important;
}

.fs_rosters::after {
    content: '\1F553' !important;
}

/******************************************************************************/

.hrmemo {
    width: 100%;
}

/******************************************************************************/

#imgCol>img {
    border: 4px solid #4582c3;
    margin-right: 25px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 15%;
}

#panel-body {
    width: 99%;
}

#contractedEmp {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

#contractedEmp img {
    height: 2.5em;
    width: 2.5em;
    border: 2px solid;
    margin-left: 0.5em;
}

#contractedEmp b, #contractedEmp span {
    margin: 0px 0.5em;
    white-space: nowrap;
}

#panel-body>div>div.col-sm-10 label {
    width: 14em;
    font-weight: bold;
}

.chart-title {
    text-align: center;
    font-weight: bold;
    font-size: 1.5em;
}

.bigImg {
    width: 100%;
    max-width: 150px;
}

.yearEntitle {
  /* display: inline-block;
  margin-left: 1em;
  font-weight: bold;
  -webkit-transition: all 0.2s;
  transition: all 0.2s; */
  font-size: 1.8rem;
  text-align: right;
  display: grid;
  grid-template-rows: auto;
}
.yearEntitle>span:nth-child(1) {
    font-size: 2.2rem !important;
}
.yearEntitle>span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.toolbarFloat {
    background-color: white;
    border-radius: 4px;
    position: absolute;
    padding: 10px;
    box-shadow: grey 4px 4px 10px 0px;
    z-index: 1000000;
}

#alertButton a {
    border-radius: 2em;
    padding: 0.5em;
}

.helpBtn {
    border: 0px !important;
    padding: 0px !important;
}

.helpBtnIcon {
    height: 33px;
    width: 34px;
    display: block;
    background-image: url(images/NanoRep_icon_34x34.png);
}

.hrForm {
    width: 100%;
}

.ui-timespinner-disabled {
    background-color: #eee;
}

/* checkbox style  */

.checkbox-custom {
    display: none;
}

.checkbox-custom-label {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 5px;
    cursor: pointer;
    margin-left: 0px;
}

.checkbox-custom+.checkbox-custom-label:before {
    content: '';
    background: #fff;
    border-radius: 4px;
    border: 2px solid #428bca;
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: middle;
}

.checkbox-custom:checked+.checkbox-custom-label:after {
    content: "";
    background: #428bca;
    position: absolute;
    width: 1em;
    height: 1em;
    border-radius: 5px;
    top: 4px;
    left: 0px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
    background-position: center center;
    background-size: 10px;
    background-repeat: no-repeat;
}

/* end of checkbox style */

.tt-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
    cursor: pointer;
}

.tt-suggestion {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #333333;
    white-space: nowrap;
}

.tt-suggestion:hover, .tt-suggestion:focus {
    color: #ffffff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca;
}

.tt-cursor {
    color: #ffffff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca;
}

#mailBox {
    text-align: center;
    width: 3.5em;
}

#mailBox .mailBoxIcon {
    font-size: 1.7em;
    line-height: 1.8em;
    color: white;
}

#mailBox .badge {
    bottom: 0.5em;
    right: 0em;
    position: absolute;
    background-color: red;
    color: white;
}

#mailBox .composeButton {
    float: right;
}

#mailBox .list>div:hover {
    background-color: #d6ebfd;
}

#mailBox .list>div:hover>.mail_from {
    text-decoration: underline;
}

#mailBox .list>div {
    padding: 0.1em 0.5em 0.1em 1.6em;
    position: relative;
    cursor: pointer;
    text-align: left;
    color: black;
}

#mailBox>ul>div>div:nth-child(n+2) {
    border-top: 1px solid lightgray;
}

#mailBox label {
    font-size: 0.9em;
    display: block;
    margin: 0px;
    cursor: pointer;
}

#mailBox .mail_unread {
    position: absolute;
    left: 0.26em;
    top: 0.3em;
    color: cornflowerblue;
}

#mailBox .mail_hasAttachment {
    position: absolute;
    right: 0.3em;
    top: 0.5em;
    color: gray;
}

#mailBox .mail_reply {
    position: absolute;
    left: 0.3em;
    top: 1.6em;
    color: lightgray;
}

#mailBox .mail_from {
    font-weight: bold;
}

#mailBox .mail_preview {
    color: gray;
}

#viewMessageModal .mailFrom {
    font-weight: bold;
    margin-bottom: 0.3em;
}

#viewMessageModal div.reply {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
}

#viewMessageModal div.reply div.level-line {
    border-left: 2px solid cornflowerblue;
    width: 1em;
}

#composeModal .form-control {
    width: 100%;
}

#composeModal .badge {
    margin-left: 0.8em;
}

#viewMessageAttachments .mail_attach:hover {
    background-color: cornflowerblue;
}

#viewMessageAttachments .mail_attach {
    float: left;
    border: 1px solid lightgray;
    padding: 1em;
    border-radius: 0.5em;
    margin: 0.5em;
    cursor: pointer;
}

#viewMessageAttachments .mail_attach i {
    display: block;
    font-size: 2.5em;
    text-align: center;
    cursor: pointer;
}

#viewMessageAttachments .mail_attach label {
    word-break: break-word;
    max-width: 6em;
    margin: 0px;
    cursor: pointer;
}

.left {
    float: left;
}

.bootstrap-tagsinput {
    width: 100%;
}

.accordion {
    margin-bottom: -3px;
}

.accordion-group {
    border: none;
}

.twitter-typeahead .tt-query, .twitter-typeahead .tt-hint {
    margin-bottom: 0;
}

.twitter-typeahead .tt-hint {
    display: none;
}

.tt-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
    cursor: pointer;
}

.tt-suggestion {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #333333;
    white-space: nowrap;
}

.tt-suggestion:hover, .tt-suggestion:focus {
    color: #ffffff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca;
}

.tt-cursor {
    color: #ffffff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca;
}

#mailBox .list, #attachmentsModal .list {
    height: 15em;
    overflow-y: auto;
    border: 1px solid lightgrey;
    min-width: 20em;
    width: 100%;
}

.UMfileRow:first-child {
    border-top: 0px !important;
}

.UMfileRow {
    height: 3.5em;
    padding: 0.6em;
    border-top: 1px solid lightgrey;
    width: 95%;
    margin: auto;
}

.UMfileRow label {
    font-size: 1.2rem;
}

.UMfileRow button {
    float: right;
}

.hrForm {
    width: 100%;
}

.findbox {
    padding-left: 80px;
}

#innerbox {
    min-height: 300px;
}

.helpBtn {
    border: 0px !important;
    padding: 0px !important;
}

.helpBtnIcon {
    height: 33px;
    width: 34px;
    display: block;
    background-image: url(images/NanoRep_icon_34x34.png);
}

.ui-timespinner-disabled {
    background-color: #eee;
}
#alertMenu {
  width: 20em;
  overflow: hidden;
}

.select2-results__options {
  font-size: small;
}

/* autocomplete */

/*the container must be positioned relative:*/
.autocomplete {
    position: relative;
    display: inline-block;
}

.autocomplete-items {
    position: absolute;
    border: 1px solid #d4d4d4;
    border-bottom: none;
    border-top: none;
    z-index: 99;
    /*position the autocomplete items to be the same width as the container:*/
    top: 100%;
    left: 0;
    right: 0;

    /* don't make a huge unscrollable list */
    max-height: 20em;
    overflow-y: auto;
    width: 20em;
}

.autocomplete-items div {
    padding: 10px;
    cursor: pointer;
    background-color: #fff;
    border-bottom: 1px solid #d4d4d4;
    text-align: left;
}

/*when hovering an item:*/
.autocomplete-items div:hover {
    background-color: #e9e9e9;
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
    background-color: DodgerBlue !important;
    color: #ffffff;
}

#notificationsContainer {
    position: fixed;
    right: 0px;
    bottom: 0px;
    top: 0px;
    left: 0px;
    background: rgba(0,0,0,0.8);
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-evenly;
    z-index: 9999;
}

#notificationsContainer .panel {
    width : 19vw;
    height: 40vh;
    margin: 0px;
}

.panel-body {
    padding: 1em;
}

#ninedotstable {
    display: grid;
}

#ninedotstable .btn-group {
    text-align: center;
    padding: 1em;
}

.ninedot_button_ess {
    min-height: 32px;
}

.floatRight, .float-right {
    float: right;
}
.floatLeft, .float-left {
    float: left;
}

.bold {
    font-weight: bold;
}

.w-25 {
    width: 25%;
}
.w-50 {
    width: 50%;
}
.w-75 {
    width: 75%;
}
.w-100 {
    width: 100%;
}

.m-0 {
margin: 0 !important;
}

.m-1 {
margin: 0.25rem !important;
}

.m-2 {
margin: 0.5rem !important;
}

.m-3 {
margin: 1rem !important;
}

.m-4 {
margin: 1.5rem !important;
}

.m-5 {
margin: 3rem !important;
}

.m-auto {
margin: auto !important;
}

.mx-0 {
margin-right: 0 !important;
margin-left: 0 !important;
}

.mx-1 {
margin-right: 0.25rem !important;
margin-left: 0.25rem !important;
}

.mx-2 {
margin-right: 0.5rem !important;
margin-left: 0.5rem !important;
}

.mx-3 {
margin-right: 1rem !important;
margin-left: 1rem !important;
}

.mx-4 {
margin-right: 1.5rem !important;
margin-left: 1.5rem !important;
}

.mx-5 {
margin-right: 3rem !important;
margin-left: 3rem !important;
}

.mx-auto {
margin-right: auto !important;
margin-left: auto !important;
}

.my-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
}

.my-1 {
margin-top: 0.25rem !important;
margin-bottom: 0.25rem !important;
}

.my-2 {
margin-top: 0.5rem !important;
margin-bottom: 0.5rem !important;
}

.my-3 {
margin-top: 1rem !important;
margin-bottom: 1rem !important;
}

.my-4 {
margin-top: 1.5rem !important;
margin-bottom: 1.5rem !important;
}

.my-5 {
margin-top: 3rem !important;
margin-bottom: 3rem !important;
}

.my-auto {
margin-top: auto !important;
margin-bottom: auto !important;
}

.mt-0 {
margin-top: 0 !important;
}

.mt-1 {
margin-top: 0.25rem !important;
}

.mt-2 {
margin-top: 0.5rem !important;
}

.mt-3 {
margin-top: 1rem !important;
}

.mt-4 {
margin-top: 1.5rem !important;
}

.mt-5 {
margin-top: 3rem !important;
}

.mt-auto {
margin-top: auto !important;
}

.me-0 {
margin-right: 0 !important;
}

.me-1 {
margin-right: 0.25rem !important;
}

.me-2 {
margin-right: 0.5rem !important;
}

.me-3 {
margin-right: 1rem !important;
}

.me-4 {
margin-right: 1.5rem !important;
}

.me-5 {
margin-right: 3rem !important;
}

.me-auto {
margin-right: auto !important;
}

.mb-0 {
margin-bottom: 0 !important;
}

.mb-1 {
margin-bottom: 0.25rem !important;
}

.mb-2 {
margin-bottom: 0.5rem !important;
}

.mb-3 {
margin-bottom: 1rem !important;
}

.mb-4 {
margin-bottom: 1.5rem !important;
}

.mb-5 {
margin-bottom: 3rem !important;
}

.mb-auto {
margin-bottom: auto !important;
}

.ms-0 {
margin-left: 0 !important;
}

.ms-1 {
margin-left: 0.25rem !important;
}

.ms-2 {
margin-left: 0.5rem !important;
}

.ms-3 {
margin-left: 1rem !important;
}

.ms-4 {
margin-left: 1.5rem !important;
}

.ms-5 {
margin-left: 3rem !important;
}

.ms-auto {
margin-left: auto !important;
}

.p-0 {
padding: 0 !important;
}

.p-1 {
padding: 0.25rem !important;
}

.p-2 {
padding: 0.5rem !important;
}

.p-3 {
padding: 1rem !important;
}

.p-4 {
padding: 1.5rem !important;
}

.p-5 {
padding: 3rem !important;
}

.px-0 {
padding-right: 0 !important;
padding-left: 0 !important;
}

.px-1 {
padding-right: 0.25rem !important;
padding-left: 0.25rem !important;
}

.px-2 {
padding-right: 0.5rem !important;
padding-left: 0.5rem !important;
}

.px-3 {
padding-right: 1rem !important;
padding-left: 1rem !important;
}

.px-4 {
padding-right: 1.5rem !important;
padding-left: 1.5rem !important;
}

.px-5 {
padding-right: 3rem !important;
padding-left: 3rem !important;
}

.py-0 {
padding-top: 0 !important;
padding-bottom: 0 !important;
}

.py-1 {
padding-top: 0.25rem !important;
padding-bottom: 0.25rem !important;
}

.py-2 {
padding-top: 0.5rem !important;
padding-bottom: 0.5rem !important;
}

.py-3 {
padding-top: 1rem !important;
padding-bottom: 1rem !important;
}

.py-4 {
padding-top: 1.5rem !important;
padding-bottom: 1.5rem !important;
}

.py-5 {
padding-top: 3rem !important;
padding-bottom: 3rem !important;
}

.pt-0 {
padding-top: 0 !important;
}

.pt-1 {
padding-top: 0.25rem !important;
}

.pt-2 {
padding-top: 0.5rem !important;
}

.pt-3 {
padding-top: 1rem !important;
}

.pt-4 {
padding-top: 1.5rem !important;
}

.pt-5 {
padding-top: 3rem !important;
}

.pe-0 {
padding-right: 0 !important;
}

.pe-1 {
padding-right: 0.25rem !important;
}

.pe-2 {
padding-right: 0.5rem !important;
}

.pe-3 {
padding-right: 1rem !important;
}

.pe-4 {
padding-right: 1.5rem !important;
}

.pe-5 {
padding-right: 3rem !important;
}

.pb-0 {
padding-bottom: 0 !important;
}

.pb-1 {
padding-bottom: 0.25rem !important;
}

.pb-2 {
padding-bottom: 0.5rem !important;
}

.pb-3 {
padding-bottom: 1rem !important;
}

.pb-4 {
padding-bottom: 1.5rem !important;
}

.pb-5 {
padding-bottom: 3rem !important;
}

.ps-0 {
padding-left: 0 !important;
}

.ps-1 {
padding-left: 0.25rem !important;
}

.ps-2 {
padding-left: 0.5rem !important;
}

.ps-3 {
padding-left: 1rem !important;
}

.ps-4 {
padding-left: 1.5rem !important;
}

.ps-5 {
padding-left: 3rem !important;
}

.fixedModal {
    position: fixed !important;
    top: 50% !important;
    left: calc(50% - 150px) !important;
}