/* Hacks
------------------------------------------------------------------*/

*:focus {
    /* remove dotted outline on focusable elements */
    outline: none !important;
}

::-moz-focus-inner {
    /* remove dotted outline on inputs and buttons */
    border:0;
}

body {
    /* Disable tap overlay color on links - set alpha to %0 = invisible */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    /* Disable context menu */
    -webkit-touch-callout: none;
    /*    -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;*/
}

/* Web developer tools
------------------------------------------------*/

/*span[class^="web-developer"] {
    z-index: 1000 !important;
    display: none !important;
    opacity: 0.3 !important;
}

span[class^="web-developer"]:hover {
    z-index: 9999 !important;
    opacity: 1 !important;
}

.ui-primary-content span[class^="web-developer"],
.ui-dialog span[class^="web-developer"] {
    display: inline-block !important;
}*/


/* Text selection
------------------------------------------------------------------*/

button, button:disabled {
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

/* Console
------------------------------------------------------------------*/

div#console {
    overflow: auto;
    height: 150px;
}
/* Reset html elements
------------------------------------------------------------------*/

* {
    margin: 0;
    padding: 0;
}

ul,li {
    list-style-type:none;
}

a {
    text-decoration: none;
}

a img {
    border: 0px; /*IE10-*/
}

/* Utils
------------------------------------------------------------------*/

.inline {
    display: inline-block;
}

.hidden {
    display: none;
}

.clear {
    clear: both;
}

.right {
    float: right;
}

.left {
    float: left;
}

.metadata {
    display: none;
}

.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

.bold {
    font-weight: bold;
}

.javascript {
    display: none;
}

.big-padding-left-25 {
    padding-left: 25px;
}

/* Basic Style
------------------------------------------------------------------*/

body {
    font-family: Arial;
}

/* Layout
------------------------------------------------------------------*/

body {
    /*    min-height: 400px;
        min-width: 320px;*/
    font-family: 'Tahoma','Helvetica','Verdana','Arial Black','Arial';
}

/* Header
------------------------------------------------------------------*/

.ui-page .ui-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 80px;
    z-index: 1000;
}

/*IPad keyboard fixed header fix*/
.fixfixed .ui-page .ui-header {
    position: absolute;
}

.ui-page > .ui-header > h1 {
    text-indent:-99999px;
    line-height: 80px;

    background-repeat: no-repeat;
    background-position: 20px 17px;
}

/* Top menu bar
------------------------------------------------------------------*/

#top-menu-bar {
    position: absolute;
    top: 0px;
    left: 240px;
    right: 0px;
    height: 40px;
    z-index: 1000;
}

#top-menu-bar a {

    border: 4px solid transparent;

    box-sizing:border-box;
    -moz-box-sizing:border-box;  /* Firefox */
    -webkit-box-sizing:border-box;  /* Safari*/

}

#top-menu-bar .main-menu {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 94px;
}

#top-menu-bar .main-menu a {
    float: left;

    width: 20%;
    height: 40px;
    margin: 0px;
    padding: 0px;

    font-family: 'Tahoma','Helvetica','Verdana','Arial Black','Arial';
    font-size: 18px;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;

    border: 1px solid;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#top-menu-bar .main-menu .icon-time-menu,
#top-menu-bar .main-menu .icon-pda-menu,
#top-menu-bar .main-menu .icon-favourites-menu,
#top-menu-bar .main-menu .icon-management-menu,
#top-menu-bar .main-menu .icon-process-application-menu {
    display: inline-block;
    padding-right: 6px;
    width: 24px;
}

#top-menu-bar .main-menu a:first-child {
    border-radius: 0em 0em 0em 0.4em;
}

#top-menu-bar .logout,
#top-menu-bar .settings {
    position: absolute;
    right: 0px;
    top: 0px;

    width: 47px;
    height: 40px;

    font-size: 19px;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    border: 1px solid;
}

#top-menu-bar .logout {
    right: 0px;
    border-radius: 0em 0em 0.4em 0em;
}

#top-menu-bar .settings {
    right: 37px;
}

#top-menu-bar a.settings:focus, #top-menu-bar a.logout:focus {
    line-height: 36px;
}

#top-menu-bar a.one-of-5 {
    width: 20%;
}

#top-menu-bar a.one-of-4 {
    width: 25%;
}

#top-menu-bar a.one-of-3 {
    width: 33.3%;
}

#top-menu-bar a.one-of-2 {
    width: 50%;
}

#top-menu-bar a.one-of-1 {
    width: 100%;
}

#top-menu-bar a.settings:focus, #top-menu-bar a.logout:focus, #top-menu-bar .main-menu a:focus {
    border: 3px solid;
}

#top-menu-bar .main-menu a:focus {
    line-height: 36px;
}

#top-menu-bar a.button-selected {
    font-weight: bold;
}

@media all and (max-width: 600px) {
    #top-menu-bar .main-menu a {
        text-indent: -99999px;
    }
    #top-menu-bar .main-menu .icon-time-menu,
    #top-menu-bar .main-menu .icon-pda-menu,
    #top-menu-bar .main-menu .icon-favourites-menu,
    #top-menu-bar .main-menu .icon-management-menu,
    #top-menu-bar .main-menu .icon-process-application-menu {
        display: block;
        width: auto;
    }
}

/* Top information bar
------------------------------------------------------------------*/

#top-information-bar {
    min-width: 320px;
    height: 40px;
    right:0px;
    top:40px;
    position:absolute;
    z-index: 1000;
}

#session-timeout-start,
#server-datetime-start {
    display: none;
}

#user-notifications {
    padding: 2px 15px 0px 5px;
    font-size: 14px;
    font-weight: bold;
    float: right;
}

#lower-border-div {
    border-radius: 8px 8px 0 0;
    height: 8px;
    left: 0;
    position: absolute;
    right: 0;
    top: 72px;
    min-width: 320px;
    z-index: 1000;
}

#top-information-bar #user-notifications a .icon-letter,
#top-information-bar #user-notifications a .icon-letter-blink,
#top-information-bar #user-notifications a .icon-supervisorSubs,
a .icon-checkLike-on,
a .icon-checkLike-off {
    display: inline-block;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    text-indent: -99999px;
    width: 32px;
}

a .icon-checkLike-on,
a .icon-checkLike-off {
    width: 20px;
}

#top-information-bar #user-notifications a .icon-letter,
#top-information-bar #user-notifications a .icon-letter-blink {
    line-height: 25px;
    margin-left: 15px;
}

#top-information-bar #user-notifications a .icon-supervisorSubs {
    line-height: 38px;
    margin-left: 5px;
}

/* Content
------------------------------------------------------------------*/

.ui-primary-content {
    min-height: 400px;
    min-width: 290px;
}

/* Panels
------------------------------------------------------------------*/

.ui-fit-panel,
.ui-full-panel,
.ui-fixed-panel-1,
.ui-fixed-panel-2,
.ui-fixed-panel-3,
.ui-fixed-panel-4,
.ui-fixed-panel-5,
.ui-full-minPanel-1 {
    -moz-border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    box-shadow: 4px 4px 4px #666666;
}

.ui-fit-panel {
    display: table;
}

.ui-overflow-panel {
    display: table; /* Needed in all browsers except IE */
    width: 100%;
}

.ui-fixed-panel-1 {
    width: 320px;
}

.ui-fixed-panel-2 {
    width: 640px;
}

.ui-fixed-panel-3,
.ui-fixed-subpanel-3 {
    width: 960px;
}

.ui-fixed-panel-4 {
    width: 1280px;
}

.ui-fixed-panel-5 {
    width: 1600px;
}

.ui-full-minPanel-1 {
    display: table; /* Needed in all browsers except IE */
    min-width: 960px;
    width: 100%;
}

.ui-flow-panel {
    float: left;
}

.ui-group {
    display: inline-block;
    white-space: normal;
    word-spacing: -5px;
}

.ui-group-horizontal {
    display: inline-block;
    white-space: nowrap;
    word-spacing: -5px;
}

.ui-group-inline,
.ui-force-group-inline {
    display: inline-block;
    vertical-align: top;
    word-spacing: normal;
}

.ui-group-block {
    display: block;
    vertical-align: top;
    word-spacing: normal;
}

/* Container
------------------------------------------------------------------*/

.ui-fixed-container-1 {
    width: 320px;
}

.ui-fixed-container-2 {
    width: 640px;
}

.ui-fixed-container-3 {
    width: 960px;
}

.ui-fixed-container-4 {
    width: 1280px;
}

/* Spacing
------------------------------------------------------------------*/

.ui-small-padding-top {
    padding-top: 2px;
}

.ui-small-padding-left {
    padding-left: 2px;
}

.ui-small-padding-bottom {
    padding-bottom: 2px;
}

.ui-small-padding-right {
    padding-right: 2px;
}

.ui-small-margin-top {
    margin-top: 2px;
}

.ui-small-margin-left {
    margin-left: 2px;
}

.ui-small-margin-bottom {
    margin-bottom: 2px;
}

.ui-small-margin-right {
    margin-right: 2px;
}

.ui-medium-padding-top {
    padding-top: 5px;
}

.ui-medium-padding-left {
    padding-left: 5px;
}

.ui-medium-padding-bottom {
    padding-bottom: 5px;
}

.ui-medium-padding-right {
    padding-right: 5px;
}

.ui-medium-margin-top {
    margin-top: 5px;
}

.ui-medium-margin-left {
    margin-left: 5px;
}

.ui-medium-margin-bottom {
    margin-bottom: 5px;
}

.ui-medium-margin-right {
    margin-right: 5px;
}

.ui-big-padding-top {
    padding-top: 12px;
}

.ui-big-padding-left {
    padding-left: 12px;
}

.ui-big-padding-bottom {
    padding-bottom: 12px;
}

.ui-big-padding-right {
    padding-right: 12px;
}


.ui-big-margin-top {
    margin-top: 12px;
}

.ui-big-margin-left {
    margin-left: 12px;
}

.ui-big-margin-bottom {
    margin-bottom: 12px;
}

.ui-big-margin-right {
    margin-right: 12px;
}

.ui-vertical-space {
    height: 10px;
}

.ui-fieldcontainer {
    padding: 15px 15px 0;
    font-size: 16px;
}

.ui-dialog .ui-fieldcontainer {
    padding: 15px 5px 0;
}

.ui-fieldcontainer.extra-space {
    padding-top: 20px;
}

.ui-fieldcontainer.double-space {
    padding-top: 30px;
}

.ui-fieldcontainer.triple-space {
    padding-top: 45px;
}

.ui-fieldcontainer.last {
    padding-bottom: 30px;
}

.ui-fieldcontainer.bottom-space-15 {
    padding-bottom: 15px;
}

.ui-cellcontainer {
    padding-right: 10px;
}

.ui-cellcontainer-min {
    padding-right: 5px;
}

.ui-cellcontainer.last {
    padding-right: 0;
}

.ui-listcontainer {
    padding-bottom: 5px;
}

.ui-small .ui-toolbar {
    float: right;
    padding: 0px;
}

.ui-small .ui-fieldcontainer {
    padding: 5px 15px 0;
    font-size: 12px;
}

.ui-small .ui-fieldcontainer.min {
    padding: 5px 1px 0;
    font-size: 12px;
}

.ui-small .ui-fieldcontainer.last {
    padding-bottom: 15px;
}

.ui-small .ui-fieldcontainer.extra-space {
    padding-top: 15px;
}

.ui-small .ui-fieldcontainer.double-space {
    padding-top: 20px;
}

.ui-small .ui-fieldcontainer.triple-space {
    padding-top: 30px;
}

/* Dialog
------------------------------------------------------------------*/

.ui-dialog-overlay {
    height:100%;
    width:100%;
    position:fixed;
    left:0;
    top:0;
    z-index: 1100;
}

.ui-dialog-wrapper-outer {
    display: table;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    min-width: 300px;
    z-index: 1101;
}

.ui-dialog-wrapper-inner {
    display: table-cell;
    vertical-align: middle;
    padding: 10px;
}

@media all and (max-width: 320px), all and (max-height: 500px) {
    .ui-dialog-wrapper-outer {
        position: absolute;
    }
}

.ui-dialog .ui-header,
.ui-dialog .ui-messages .message,
.ui-dialog .ui-content,
.ui-dialog .ui-footer,
.ui-inline-dialog .ui-dialog-header,
.ui-inline-dialog .ui-dialog-messages .message,
.ui-inline-dialog .ui-dialog-content,
.ui-inline-dialog .ui-dialog-footer {
    position: relative;
    margin: 0 auto;
    box-shadow: 0 0 4px 0 #555;
}

.ui-dialog .ui-header,
.ui-dialog .ui-content,
.ui-dialog .ui-footer,
.ui-inline-dialog .ui-dialog-header,
.ui-inline-dialog .ui-dialog-content,
.ui-inline-dialog .ui-dialog-footer {
    padding: 15px;
    min-width: 270px;
    max-width: 500px;
}

/* max width exception for select employee sub-dialog */
#selectEmployee .ui-header,
#selectEmployee .ui-content,
#selectEmployee .ui-footer {
    max-width: 1200px;
}

.ui-dialog .ui-messages .message,
.ui-inline-dialog .ui-messages .message {
    min-width: 210px;
    max-width: 440px;
}

.ui-wide-dialog .ui-messages .message {
    min-width: 840px;
    max-width: 840px;
}

.ui-dialog .ui-header,
.ui-inline-dialog .ui-dialog-header {
    border-top-left-radius: 0.6em;
    border-top-right-radius: 0.6em;
    border-top: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;

}

.ui-dialog .ui-content,
.ui-inline-dialog .ui-dialog-content {
    border-left: 1px solid;
    border-right: 1px solid;
}

/* fit height in format dialog */
.ui-dialog .format-column-dialog,
.ui-inline-dialog .format-column-dialog {
    max-height: 660px;
    overflow-y: auto;
}

/* fit height for employee selection dialogs
   strange view when initially no records on table */
#employeeListDialog .ui-content {
    min-height: 300px;
}

#employeeListDialog .ui-dialog-wrapper-inner {
    min-width: 1000px;
}

.ui-dialog .ui-footer,
.ui-inline-dialog .ui-dialog-footer {
    border-top: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-bottom-left-radius: 0.6em;
    border-bottom-right-radius: 0.6em;
}

.ui-dialog .ui-header h1,
.ui-inline-dialog .ui-header h1 {
    font-size: 22px;
    text-align: center;
}

.ui-dialog .ui-without-header-footer,
.ui-inline-dialog .ui-without-header-footer {
    border-radius: 10px;
}

.dialog .ui-header {
    cursor: move;
}

.dialog-icon-maximize,
.dialog-icon-restore {
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 10px;
    right: 10px;
    text-indent: -99999px;
    cursor: pointer;
}

.dialog-icon-resize {
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    bottom: 3px;
    right: 3px;
    text-indent: -99999px;
    cursor: nw-resize;
    border-bottom-right-radius: 0.4em;
}

#updateApplicationConfirm .ui-content {
    max-height: 350px;
    overflow: auto;
}

#applicationApprovalConfirmation .ui-content {
    max-height: 350px;
    overflow: auto;
}

#substitutionRequestConfirmation .ui-content {
    max-height: 350px;
    overflow: auto;
}

/* Login Dialog
------------------------------------------------------------------*/

#logo img {
    width: 100%;
    max-width: 500px;
    max-height: 120px;
}

#footerPartnerLogo0,
#footerPartnerLogo1,
#footerPartnerLogo2 {
    width: 150px;
    height: 50px;
    background-repeat: no-repeat;
    /*background-position: 50% 50%;*/
}

.footerDescription {
    padding-top: 7px;
}

.ui-dialog .ui-footer .miditec-link {
    text-decoration: underline;
}
/* Logout Dialog
------------------------------------------------------------------*/

.logoutMsg {
    /*margin-top: 30px;*/
    /*margin: 20px 15px 15px;*/
    font-weight: bold;
    font-size: 15px;
    /* background: #C0C0C0 url(../images/icons/information.png) no-repeat 10px center; */
    padding: 10px 10px 10px 25px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /*border: 1px solid #E0E0E0;*/
}

/* Columns
------------------------------------------------------------------*/

.ui-columns {
}

.ui-columns-1-of-40 {
    float: left;
    width: 2.5%;
}

.ui-columns-1-of-20 {
    float: left;
    width: 5%;
}

.ui-columns-1-of-10,
.ui-columns-2-of-20,
.ui-columns-4-of-40 {
    float: left;
    width: 10%;
}

.ui-columns-1-of-8,
.ui-columns-one-of-eight {
    float: left;
    width: 12.5%;
}

.ui-columns-3-of-20 {
    float: left;
    width: 15%;
}

.ui-columns-1-of-5,
.ui-columns-one-of-five,
.ui-columns-4-of-20{
    float: left;
    width: 20%;
}

.ui-columns-1-of-4,
.ui-columns-one-of-four,
.ui-columns-2-of-8,
.ui-columns-two-of-eight,
.ui-columns-5-of-20{
    float: left;
    width: 25%;
}

.ui-columns-6-of-20 {
    float: left;
    width: 30%;
}

.ui-columns-1-of-3,
.ui-columns-one-of-three {
    float: left;
    width: 33.3%;
}

.ui-columns-7-of-20 {
    float: left;
    width: 35%;
}

.ui-columns-3-of-8,
.ui-columns-8-of-20,
.ui-columns-three-of-eight {
    float: left;
    width: 37.5%;
}

.ui-columns-2-of-5 {
    float: left;
    width: 40%;
}

.ui-columns-9-of-20 {
    float: left;
    width: 45%;
}

.ui-columns-1-of-2,
.ui-columns-2-of-4,
.ui-columns-4-of-8,
.ui-columns-one-of-two,
.ui-columns-two-of-four,
.ui-columns-four-of-eight,
.ui-columns-10-of-20{
    float: left;
    width: 50%;
}

.ui-columns-11-of-20 {
    float: left;
    width: 55%;
}

.ui-columns-3-of-5,
.ui-columns-12-of-20 {
    float: left;
    width: 60%;
}

.ui-columns-5-of-8,
.ui-columns-five-of-eight {
    float: left;
    width: 62.5%;
}

.ui-columns-13-of-20 {
    float: left;
    width: 65%;
}

.ui-columns-2-of-3,
.ui-columns-two-of-three {
    float: left;
    width: 66.6%;
}

.ui-columns-14-of-20 {
    float: left;
    width: 70%;
}

.ui-columns-3-of-4,
.ui-columns-three-of-four,
.ui-columns-6-of-8,
.ui-columns-six-of-eight,
.ui-columns-15-of-20{
    float: left;
    width: 75%;
}

.ui-columns-4-of-5,
.ui-columns-16-of-20 {
    float: left;
    width: 80%;
}

.ui-columns-17-of-20 {
    float: left;
    width: 85%;
}

.ui-columns-7-of-8,
.ui-columns-seven-of-eight {
    float: left;
    width: 87.5%;
}

.ui-columns-18-of-20 {
    float: left;
    width: 90%;
}

.ui-columns-19-of-20 {
    float: left;
    width: 95%;
}

.ui-columns-1-of-1,
.ui-columns-one {
    float: left;
    width: 100%;
}

.ui-columns-minimum {
    float: left;
}

.ui-fixed-column-1,
.ui-fixed-column-2,
.ui-fixed-column-3,
.ui-fixed-column-4,
.ui-full-column {
    float: left;
}

.ui-fixed-panel-1 .ui-fixed-column-1,
.ui-fixed-container-1 .ui-fixed-column-1 {
    width: 290px;
}

.ui-fixed-panel-2 .ui-fixed-column-1,
.ui-fixed-container-2 .ui-fixed-column-1 {
    width: 297px;
    padding-right: 16px;
}

.ui-fixed-panel-2 .ui-fixed-column-2 {
    width: 610px;
}

.ui-fixed-panel-3 .ui-fixed-column-1,
.ui-fixed-subpanel-3 .ui-fixed-column-1 {
    width: 298px;
    padding-right: 18px;
}

.ui-fixed-panel-3 .ui-fixed-column-2,
.ui-fixed-subpanel-3 .ui-fixed-column-2 {
    width: 614px;
    padding-right: 18px;
}

.ui-fixed-panel-3 .ui-fixed-column-3,
.ui-fixed-subpanel-3 .ui-fixed-column-3 {
    width: 930px;
}

.ui-fixed-panel-4 .ui-fixed-column-1 {
    width: 299px;
    padding-right: 18px;
}

.ui-fixed-panel-4 .ui-fixed-column-2 {
    width: 616px;
    padding-right: 18px;
}

.ui-fixed-panel-4 .ui-fixed-column-3 {
    width: 933px;
    padding-right: 18px;
}

.ui-fixed-panel-4 .ui-fixed-column-4 {
    width: 1250px;
}

.ui-fixed-panel-5 .ui-fixed-column-1 {
    width: 299px;
    padding-right: 18px;
}

.ui-fixed-panel-5 .ui-fixed-column-2 {
    width: 616px;
    padding-right: 18px;
}

.ui-fixed-panel-5 .ui-fixed-column-3 {
    width: 933px;
    padding-right: 18px;
}

.ui-fixed-panel-5 .ui-fixed-column-4 {
    width: 1250px;
    padding-right: 18px;
}

.ui-fixed-panel-5 .ui-fixed-column-5 {
    width: 1570px;
}

.ui-full-column {
    width: 100%;
}

.ui-fixed-column-1.last,
.ui-fixed-column-2.last,
.ui-fixed-column-3.last {
    padding-right: 0;
}


/*.ui-fixed-panel-1 .ui-fixed-column-1 > .ui-cellcontainer {
    padding-right: 0;
    padding-bottom: 10px;
}

.ui-fixed-panel-1 .ui-fixed-column-1 > .ui-cellcontainer.last {
    padding-bottom: 0;
}

.ui-fixed-padding-1 {
    padding-left: 315px;
}

.ui-fixed-panel-1 .ui-fixed-padding-1 {
    padding-left: 0;
}*/

/* Messages
------------------------------------------------------------------*/

.ui-page .ui-messages {
    padding-top: 81px;
}

.message {
    line-height: 19px;
    font-weight: bold;
    font-size: 16px;
    padding: 11px 45px;
    text-shadow: none;
}

.ui-page .message {
    border-bottom: 1px solid;
}

.ui-dialog .message {
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
}

.message-floating {
    position: fixed;
    left: 10px;
    right: 10px;
    top: 0px;
    z-index: 1200;
}

.message-floating table {
    position: relative;
    margin: 0 auto;
    padding: 15px;
    z-index: 1200;
    box-shadow: 0px 0px 8px black;
    min-height: 22px;
    padding: 15px 10px 15px 42px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: 2px solid;
    line-height: 19px;
    font-weight: bold;
    font-size: 16px;
}

.ui-page .message-floating {
    top: 50px;
}

.ui-dialog .message-floating {
    top: 130px;
}

.ui-page .message-floating table {
    width: 500px;
}

.ui-dialog .message-floating table {
    width: 400px;
}

.information {
    background-position: 10px center;
    background-repeat: no-repeat;
}

.warning {
    background-position: 10px center;
    background-repeat: no-repeat;
}

.error {
    background-position: 10px center;
    background-repeat: no-repeat;
}

.fatal {
    background-position: 10px center;
    background-repeat: no-repeat;
}

.button.hideMessage {
    font-weight: normal;
    width: 60px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
}

.ui-dialog .button.hideMessage {
}

/* IN DIALOG MESSAGES */

.indialog-messages,
.ui-indialog-messages {
    margin-top: 20px;
    padding: 2px;
}

.indialog-messages.message-top,
.ui-indialog-messages.message-top {
    margin-top: 0;
}


.indialog-messages .indialog-message,
.ui-indialog-messages .indialog-message {
    padding: 12px;
    border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 10px 10px;
    -webkit-border-radius: 0 0 10px 10px;
    width: 100%;
}

.indialog-messages .indialog-message p,
.ui-indialog-messages .indialog-message p {
    font-weight: bold;
    padding-left: 45px;
    padding-top: 7px;
}

.indialog-messages .indialog-message,
.ui-indialog-messages .indialog-message {
    line-height: 19px;
    font-size: 16px;
    padding: 11px;
    text-shadow: none;
}

.inline-button.indialog-message-button {
    height: 24px;
    line-height: 24px;
    padding: 0 10px;
    width: 60px;
}

/* Side menu
------------------------------------------------------------------*/

.ui-menu {
    box-shadow: 4px 4px 4px #666666;
}

.ui-menu a {
    display: block;
    height: 40px;
    line-height: 40px;
    text-indent: 10px;
    border-top: 1px solid;
    /*    border-right: 1px solid;
        border-bottom: 1px solid;
        border-left: 1px solid;*/
    text-indent: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 18px;
}

.menu-collapsed ul {
    display: none;
}

.menu-collapsible ul a {
    text-indent: 35px;
}

.menu-selected {
    font-weight: bold;
}

.ui-primary-content {
    text-shadow: none;
}

.ui-menu,
.ui-menu li:last-child,
.ui-menu li:last-child a.rootMenuLink,
.ui-menu li.menu-collapsed:last-child > a,
.ui-menu li:last-child ul,
.ui-menu li:last-child ul li:last-child,
.ui-menu li:last-child ul li:last-child a {
    border-radius: 0 0 4px 4px;
}

/*.ui-menu li.menu-collapsed:last-child > a,
.ui-menu li:last-child ul li:last-child a {
    border-bottom: 2px solid;
}*/

.ui-menu a:focus {
    outline: 2px solid !important;
    outline-offset: -2px;
}

.icon-PDABeginBooking,
.icon-PDAInterruptionBooking,
.icon-PDAEndBooking,
.icon-PDAInfoFinish,
.icon-PDAInfoInterrupted,
.icon-PDAInfoDelayed,
.icon-PDAInfoInProgress,
.icon-PDAInfoGood,
.icon-PDAInfoBad,
.icon-PDAMechanicGroupChange {
    border-radius: 7px;
    display: inline-block;
    height: 30px;
    margin: 5px;
    width: 45px;
}

#time-menu li a.time-favourite-menu,
#pda-menu-booking li a,
#pda-menu-infoBooking li a,
#favourites-menu li a.rootMenuLink {
    line-height: 30px;
    text-indent: 15px;
}

.icon-time-favourite-on {
    display: inline-block;
    height: 30px;
    margin: 5px;
    width: 30px;
}

/* Datatables
------------------------------------------------------------------*/

.dataTables_scrollBody {
    overflow-x: hidden;
    overflow-y: auto;
}

.tableSpan {
    padding: 15px;
    width: 290px;
}

.tableList {
    font-size: 14px;
    width: 100%;
    padding: 2px;
    border-collapse: collapse;
    border-spacing: 0;
}

.ui-small .tableList {
    font-size: 12px;
}

.tableList thead tr th {
    cursor: pointer;
    padding: 3px 15px 3px;
    background-position: right center;
    background-repeat: no-repeat;
    border: 1px solid;
}

.tableList thead tr th.leftSorting {
    background-position: left center;
}

.tableList thead tr th.time-scale {
    cursor: pointer;
    padding: 3px;
    text-align: left;
    background: none;
    border: none;
    border-left: 2px solid;
    border-bottom: 2px solid;
    vertical-align: bottom;
}

.tableList thead tr th.time-scale.last {
    border-right: 2px solid;
}

.tableList thead tr th.table-sorting-disabled,
.tableList thead tr th.sort-disabled {
    cursor: default;
}

.tableList td {
    padding: 2px;
    cursor: pointer;
    border: 1px solid;
}

.tableList th.bookingsedition, .tableList td.bookingsedition {
    padding: 0px;
    cursor: pointer;
    border: 1px solid;
    min-width: 50px;
}

.tableList tr.focus {
    outline: 2px solid !important;
    outline-offset: -2px;
}

.tableList td em {
    cursor: default;
}

.tableList tbody td.time-scale {
    padding: 2px 0;
}

.tableList a,
.tableList a:visited {
    text-decoration: none;
}

.tableList-scroll {
    height: 205px;
    overflow-y: auto;
}

.table-header-wrapper {
    overflow: hidden;
}

.tableList.table-header {
    width: auto;
}

.table-body-wrapper .tableList,
.table-footer-wrapper .tableList {
    /*border-top: 0;*/
}

.tableList .italic,
.tableList .italic button {
    font-style: italic;
}

.tableList .selection-checkfield-cell {
    text-align: center;
}

.tableList thead.table-scroll-header tr th,
.tableList tfoot.table-scroll-footer tr td {
    visibility: hidden;
}

.tableList tfoot:not(.table-scroll-footer) tr:first-child td {
    border-top: 1px solid #DDD;
    background-color: #FFF;
}

.tableList tfoot.table-scroll-footer tr td {
    border-color: transparent;
}

.tablelist .tabledata-all-checkbox {
    padding: 3px 7px;
}

/* Calculation Table
------------------------------------------------------------------*/

.calculation-table {
    width: 100%;
}

.calculation-table .header-cell {
    padding: 2px;
    font-weight: bold;
}

.calculation-table .sign-cell {
    padding: 2px;
    text-align: right;
    width: 10px;
}

.calculation-table .value-cell {
    padding: 2px;
    text-align: right;
    width: 55px;
}

.calculation-table hr {
    margin: 10px 0;
    border: none;
    /*border-top: 1px solid black; */
    border-top: 1px solid;

}


.calculation-table .red-cell {
    font-weight: bold !important;
}


/* Form Fields
------------------------------------------------------------------*/

label.fieldlabel {
    display: block;
    font-weight: bold;
    line-height: 27px;
}

label.inset-fieldlabel {
    display: block;
    font-weight: bold;
    line-height: 15px;
    padding-left: 2px;
}

label.inline-fieldlabel {
    display: inline-block;
    font-weight: bold;
    padding-top: 5px;
}

label.checkboxlabel {
    font-weight: bold;
}

select {
    width: 100%;
}

select:focus,
select.focus {
    border: 1px solid;
}

.radiobutton-wrapper,
.checkfield-wrapper {
    position: relative;
    /*top: -2px;*/
    display: inline-block;
}

.radiobutton-wrapper {
    top: -2px;
}

.checkfield-wrapper {
    top: 0;
}

td div.radiobutton-wrapper,
td div.checkfield-wrapper {
    position: relative;
    display: inline-block;
    top: auto !important;
}

.radiobutton-label,
.checkfield-label {
    cursor: pointer;
    /*line-height: 30px;*/
    font-weight: bold;
}

.radiobutton-label {
    line-height: 24px;
}
.radiobutton-label.terminal-label {
    line-height: 46px;
}


.radiobutton-label.disabled-label,
.radiobutton-hover .radiobutton-label.disabled-label,
.checkfield-label.disabled-label,
.checkfield-hover .checkfield-label.disabled-label
{
    cursor: default;
}

.checkfield-label {
    line-height: 24px;
}
.checkfield-label.terminal-label {
    line-height: 46px;
}

.checkfield-fakecheckbox {
    display: block;
    float: left;
    background-repeat: no-repeat;
    background-position: center 0px;
    width: 28px;
    height: 28px;
}

.checkfield-fakecheckbox48 {
    display: block;
    float: left;
    background-repeat: no-repeat;
    background-position: center 0px;
    width: 48px;
    height: 48px;
}

.checkfield-focus .checkfield-fakecheckbox,
.checkfield-focus .checkfield-fakecheckbox48 {
    background-repeat: no-repeat;
    background-position: center 0px;
}


.checkfield-checked .checkfield-fakecheckbox,
.checkfield-checked .checkfield-fakecheckbox48 {
    background-repeat: no-repeat;
    background-position: center 0px;
}


.checkfield-checked.checkfield-focus .checkfield-fakecheckbox,
.checkfield-checked.checkfield-focus .checkfield-fakecheckbox48 {
    background-repeat: no-repeat;
    background-position: center 0px;
}


.checkfield-checked .checkfield-fakecheckbox.checkbox-disabled,
.checkfield-fakecheckbox.checkbox-disabled,
.checkfield-checked.checkfield-focus .checkbox-disabled,
.checkfield-checked .checkfield-fakecheckbox48.checkbox-disabled,
.checkfield-fakecheckbox48.checkbox-disabled {
    background-repeat: no-repeat;
    background-position: center 0px;
    cursor: default;
}

.radiobutton-fakeradio {
    display: block;
    float: left;
    background-repeat: no-repeat;
    background-position: center 6px;
    width: 28px;
    height: 28px;
}

.radiobutton-fakeradio48 {
    display: block;
    float: left;
    background-repeat: no-repeat;
    background-position: center 6px;
    width: 48px;
    height: 48px;
}

.radiobutton-focus .radiobutton-fakeradio.radiobutton-disabled,
.radiobutton-checked .radiobutton-fakeradio.radiobutton-disabled,
.radiobutton-fakeradio.radiobutton-disabled,
.radiobutton-focus .radiobutton-fakeradio48.radiobutton-disabled,
.radiobutton-checked .radiobutton-fakeradio48.radiobutton-disabled,
.radiobutton-fakeradio48.radiobutton-disabled {
    background-repeat: no-repeat;
    background-position: center 6px;
    cursor: default;
}

.radiobutton-focus .radiobutton-fakeradio,
.radiobutton-focus .radiobutton-fakeradio48 {
    background-repeat: no-repeat;
    background-position: center 6px;
}

.radiobutton-checked .radiobutton-fakeradio,
.radiobutton-checked .radiobutton-fakeradio48 {
    background-repeat: no-repeat;
    background-position: center 6px;
}

.radiobutton-checked.radiobutton-focus .radiobutton-fakeradio,
.radiobutton-checked.radiobutton-focus .radiobutton-fakeradio48 {
    background-repeat: no-repeat;
    background-position: center 6px;
}

.formfield,
.textfield,
.datefield,
.integerfield,
.floatfield,
.selectionfield,
.dataTables_filter input,
.table-filter {
    height: 34px;
    width: 100%;
    padding-left: 8px;
    font: 16px Arial, sans-serif;
    box-shadow: 0 0px 3px #707070 inset;
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    border: 1px solid;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
}

.weekdayfield {
    border-right: 0 none;
    width: 20%;
    float: left;
    border-radius: 0.6em 0 0 0.6em;
    padding-left: 8px;
    box-shadow: 0 0 3px #707070 inset; /*, 4px 0 0 white*/
}

.weekdayfield:hover {
    cursor:pointer;
}

.ui-datefield .datefield,
.fake-datefield {
    float: left;
    border-radius: 0.6em;
    padding-left: 5px;
    box-shadow: 0 0 3px #707070 inset;
    padding-left: 20%;
}

.radiofield,
.spanfield {
    display: block;
    height: 34px;
    width: 100%;
}

selection.formfield,
selection.textfield {
    display: block;
    height: 34px;
    padding: 5px;
}

.dataTables_filter input {
    margin: 5px 0;
}

.formfield:focus,
.textfield:focus,
.datefield:focus,
.integerfield:focus,
.floatfield:focus,
.selectionfield:focus,
.dataTables_filter input:focus,
.table-filter:focus {
    border: 1px solid;
    box-shadow: none;
}

.weekdayfield.focus {
    box-shadow: none;
}

.ui-small .formfield,
.ui-small .textfield,
.ui-small .datefield,
.ui-small .timefield,
.ui-small .integerfield,
.ui-small .floatfield,
.ui-small .dataTables_filter input,
.ui-small .table-filter {
    font-size: 12px;
    height: 27px;
}

/*.ui-small .weekdayfield {
    width: 15%;
}

.ui-small .datefield,
.ui-small .fake-datefield {
    width: 85%;
}*/

.ui-datefield,
.ui-timefield {
    position: relative;
}

.ui-timefield {
    min-width: 43px;
}

.ui-datefield span.datefield-weekday {
    position: absolute;
    left: 2%;
    top: 1px;
    line-height: 30px;
    border-right: 1px solid #C0C0C0;
    width: 17%;
}

.ui-datefield span.datefield-button {
    display: block;
    position: absolute;
    right: 1px;
    top: 1px;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
}

.ui-small .ui-datefield span.datefield-button {
    height: 24px;
    width: 24px;
}

.ui-small .ui-datefield span.datefield-weekday {
    line-height: 24px;
}



.ui-timefield span {
    display: block;
    position: absolute;
    right: 1px;
    top: 1px;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
}

.ui-small .ui-timefield span {
    height: 24px;
    width: 24px;
}

.suggestion-field,
.ui-small .suggestion-field,
.personal-field,
.ui-small .personal-field {
    float: left;
    width: 80%;
    margin-right: 1%;
}

button.button.suggestion-button,
.ui-small button.button.suggestion-button,
.personal-button,
.ui-small .personal-button {
    float: left;
    width: 18%;
}

input.multipersonal-field[readonly],
input.multipersonal-field[readonly="readonly"],
.ui-small input.multipersonal-field[readonly],
.ui-small input.multipersonal-field[readonly="readonly"],
input.multiselection-field[readonly],
input.multiselection-field[readonly="readonly"],
.ui-small input.multiselection-field[readonly],
.ui-small input.multiselection-field[readonly="readonly"] {
    float: left;
    width: 70%;
    margin-right: 1%;
    background-color: white;
}

input.multipersonal-field.readonly[readonly],
input.multipersonal-field.readonly[readonly="readonly"],
.ui-small input.multipersonal-field.readonly[readonly],
.ui-small input.multipersonal-field.readonly[readonly="readonly"],
input.multiselection-field.readonly[readonly],
input.multiselection-field.readonly[readonly="readonly"],
.ui-small input.multiselection-field.readonly[readonly],
.ui-small input.multiselection-field.readonly[readonly="readonly"] {
    background-color: lightgray;
}

button.button.multipersonal-button,
.ui-small button.button.multipersonal-button,
button.button.multiselection-button,
.ui-small button.button.multiselection-button {
    float: left;
    width: 28%;
}

.multiselectionfield,
.ui-small .multiselectionfield {
    height: 90px;
}

.timefieldplus,
.ui-small .timefieldplus {
    border-radius: 0.6em 0 0 0.6em;
    border-right-color: #B0B0B0;
    float: left;
    width: 70%;
}

.timefieldplus-plus,
.ui-small .timefieldplus-plus {
    border-left: 0 none;
    border-radius: 0 0.6em 0.6em 0;
    float: left;
    width: 30%;
}

.timefieldplus-wrapper {
    float: left;
    width: 60%;
}

.timefieldplus-wrapper .timefieldplus {
    border-right-color: #a0a0a0;
    width: 100%;
}

.timefieldplus-wrapper .timefieldplus:focus,
.timefieldplus-wrapper .timefieldplus.focus {
    border-color: rgb(244,236,105);
    box-shadow: none;
}

.timefieldplus-plus-wrapper {
    float: left;
    width: 40%;
}

.timefieldplus-plus-wrapper .timefieldplus-plus {
    width: 100%;
}

.timefieldplus-plus-wrapper .timefieldplus-plus:focus,
.timefieldplus-plus-wrapper .timefieldplus-plus.focus {
    border-color: rgb(244,236,105);
    box-shadow: none;
}

.inFormError {
    font-style:italic;
    /*font-size:10px;*/
    color: gray;
}

/* Buttons
------------------------------------------------------------------*/

.button,
.inline-button {
    cursor: pointer;
    border: 1px solid;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 2px 2px 2px #666666;
    height: 34px;
    font-size: 20px;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px 0 #B4B9BE;
}

.button {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.link {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: medium none;
    cursor: pointer;
    text-align: left;
}

.inline-button {
    display: inline-block;
    height: 34px;
    line-height: 34px;
    padding: 0 18px;
}

button.button,
input.button {
    width: 100%;
    margin: 1px;
}

.button-disabled,
.inline-button:disabled,
.inline-button.aDisabled,
.inline-button.aDisabled:hover,
.button.aDisabled,
.button.aDisabled:hover {
    cursor: default;
    box-shadow: 2px 2px 2px #666666;
}

.button:disabled:active,
.inline-button:disabled:active,
.inline-button.aDisabled:active,
.button.aDisabled:active {
    cursor: default;
    box-shadow: 2px 2px 2px #666666;
}

a.button {
    height: 32px;
    display: block;
    line-height: 32px;
}

a.inline-button {
    height: 32px;
    line-height: 31px;
}

.button-down,
.button-up,
.button-down-disabled,
.button-up-disabled {
    padding: 0;
    margin: 0;
    font-size: 11px;
    text-indent:-99999px;
    background:none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    display: inline-block;
    height: 26px;
    width: 26px;
}

/*TODO Look for possible errors, enabled was added to not apply :active style to disabled elements*/
.button:enabled:active,
.inline-button:enabled:active {
    box-shadow: 1px 2px 2px #666666 inset;
}

.inline-button {
    margin-right: 10px;
}

.inline-button.last {
    margin-right: 0;
}

.ui-small .button,
.ui-small .inline-button {
    font-size: 16px;
    height: 26px;
    line-height: 26px;
}

.ui-small .inline-button {
    margin-right: 7px;
}

.ui-small a.button {
    height: 24px;
    line-height: 24px;
}

.ui-small a.inline-button {
    height: 24px;
    line-height: 22px;
}

.button.multiselectionfield {
    height: 90px;
}

.ui-small .button.multiselectionfield {
    height: 90px;
}

.button-down.hover {
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.button-down:focus {
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.button-up.hover {
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.button-up:focus {
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.bigButton {
    height: 45px;
}

/* Item list
------------------------------------------------------------------*/

.list-item {
    display: block;
    padding: 10px 15px;
    width: 100%;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    font-size: 16px;
    line-height: 19px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.list-item:focus {
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border: 3px solid;
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    padding: 7px 12px;
    width: 100%;
}

.list-controls {
    text-align: center;
}

.list-controls a.previous,
.list-controls a.next,
.list-controls a.previousDisabled,
.list-controls a.nextDisabled {
    width: 32px;
    height: 32px;
    display:block;
    text-indent:-99999px;
}

.list-controls a.previous {
    background-repeat: no-repeat;
    background-position: center 0px;
    float: left;
}

.list-controls a.next {
    background-repeat: no-repeat;
    background-position: center 0px;
    float: right;
}

.list-controls a.previous.hover{
    background-repeat: no-repeat;
    background-position: center 0px;
}

.list-controls a.previous:focus {
    background-repeat: no-repeat;
    background-position: center 0px;
}

.list-controls a.next.hover {
    background-repeat: no-repeat;
    background-position: center 0px;
}

.list-controls a.next:focus {
    background-repeat: no-repeat;
    background-position: center 0px;
}

.list-controls a.previousDisabled {
    background-repeat: no-repeat;
    background-position: center 0px;
    float: left;
    cursor: default;
}

.list-controls a.nextDisabled {
    background-repeat: no-repeat;
    background-position: center 0px;
    float: right;
    cursor: default;
}

.list-controls a.date {
    font-size: 22px;
    text-align: center;
    text-decoration: none;
    line-height: 38px;
    font-weight: bold;
    /* border: 5px solid transparent;*/
}

.list-controls a.date:focus {
    border: 3px solid;
    border-radius: 0.4em;
    padding: 5px 5px;
}

/* Time bookings list
------------------------------------------------------------------*/

#time-bookings-list li.inRed a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.inYellow a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.inGreen a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.inNormal a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.outRed a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.outYellow a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.outGreen a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li.outNormal a {
    background-repeat: no-repeat;
    background-position: 15px 4px;
}

#time-bookings-list li {
    position: relative;
}

#time-bookings-list li a {
    padding-left: 50px;
}

#time-bookings-list li a:focus {
    background-position: 12px 1px;
    padding-left: 47px;
}

#time-bookings-list .list-item {
    padding-right: 30px;
}

#time-bookings-list .correctionMark {
    position: absolute;
    right: 15px;
    top: 9px;
}

/* PDA bookings list
------------------------------------------------------------------*/

#pda-bookings-list li.PDABeginBooking a,
span.Begin,
span.PDABeginBooking {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAEndBooking a,
span.End,
span.PDAEndBooking {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInterruptionBooking a,
span.Interruption,
span.PDAInterruptionBooking {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDACollective a {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoFinish a,
span.Info-ready,
span.PDAInfoFinish {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoInterrupted a,
span.Info-interrupted,
span.PDAInfoInterrupted {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoRejects a {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoDelayed a,
span.Info-delayed,
span.PDAInfoDelayed {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoInProgress a,
span.Info-inprogress,
span.PDAInfoInProgress {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoGood a,
span.Info-goodquantity,
span.PDAInfoGood {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAInfoBad a,
span.Info-rejects,
span.PDAInfoBad {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li.PDAMechanicGroupChange a,
span.PDAMechanicGroupChange,
span.PDAMechanicGroupChange {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#favourites-bookings-list li a.list-item {
    background-repeat: no-repeat;
    background-position: 6px 4px;
}

#pda-bookings-list li {
    position: relative;
}

#pda-bookings-list li a {
    padding-left: 70px;
}

#pda-bookings-list li a:focus {
    background-position: 3px 1px;
    padding-left: 67px;
}

#pda-bookings-list .item-text {
    overflow: hidden;
    white-space: nowrap;
}

#pda-bookings-list .correctionMark {
    position: absolute;
    right: 15px;
    top: 9px;
}

/* Pda Form
------------------------------------------------------------------*/

span.pdaBookingForm-type {
    padding: 6px 0 10px 80px;
}



.clock-on {
    font-size: 28px;
    text-align: center;
}

/* Favourites List Items
------------------------------------------------------------------*/

#favourites-bookings-list a.list-item {
    padding-left: 70px;
    padding-right: 65px;
}

#favourites-bookings-list a.list-item:focus {
    padding-left: 67px;
    background-position: 3px 1px !important;
}

#favourites-bookings-list a.list-item.Begin {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.End {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Interruption {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Collective {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-finished {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-interrupted {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-rejects {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-delayed {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-inprogress {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-good-quantity {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list a.list-item.Info-bad-quantity {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 6px 4px;
}

#favourites-bookings-list li {
    position: relative;
}

#favourites-bookings-list .up-down-buttons {
    position: absolute;
    top: 6px;
    right: 8px;
}


/* Matrix Tableau
------------------------------------------------------------------*/

#intranetTableau {
    padding-top: 15px;
}

.matrix-tableau {
    width: 100%;
    border-spacing: 5px;
    white-space: nowrap;
    table-layout: fixed;
}

.matrix-tableau .employee,
.matrix-tableau .empty {
    min-width: 250px;
    max-width: 250px;
}

.matrix-tableau .header {
    border: 1px solid;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    padding: 5px;
    min-height: 80px;
}

.matrix-tableau .overlay-wrapper {
    position: relative;
}

.matrix-tableau .collapsed .overlay {
    display: none;
}

.matrix-tableau .expanded .overlay {
    position: absolute;
    width: 100%;
    height: 80px;
    display: table;
    border-spacing: 0;
}

.matrix-tableau .extra {
    position: relative;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border: 1px solid;
    border-top: none;
    border-radius: 0 0 0.6em 0.6em;
    padding: 5px;
}

.matrix-tableau .header table {
    width: 100%;
    table-layout: fixed;
}

.matrix-tableau .overlay .header table {
    width: auto;
    table-layout: auto;
}

.matrix-tableau .overlay .header table,
.matrix-tableau .overlay .extra table {
    width: 100%;
}

.matrix-tableau .header td,
.matrix-tableau .extra td {
    min-width: auto;
    font-size: 12px;
}

.matrix-tableau button.more-link {
    width: 100%;
}

.matrix-tableau a.more-link,
.matrix-tableau button.more-link,
.matrix-tableau .header td {
    overflow: hidden;
    text-overflow: ellipsis;
}

.matrix-tableau .overlay button.more-link {
    width: auto;
}

.matrix-tableau .overlay a.more-link,
.matrix-tableau .overlay button.more-link,
.matrix-tableau .overlay .header td {
    overflow: auto;
    text-overflow: none;
}

.matrix-tableau a.more-link,
.matrix-tableau button.more-link,
.matrix-tableau span.false-link {
    display: block;
    font-weight: bold;
    padding: 5px 5px 0;
}

.matrix-tableau a.email {
    margin: 5px;
}

.matrix-tableau .expanded .header {
    border-radius: 0.6em 0.6em 0 0;
    border-bottom: 1px dotted !important;
}

.matrix-tableau .expanded.invert .overlay {
    position: absolute;
}

.matrix-tableau .expanded.invert .overlay .header {
    position: relative;
    width: 100%;
    border-radius: 0 0 0.6em 0.6em;
    border-bottom: 1px solid !important;
    border-top: 1px dotted !important;
}

.matrix-tableau .expanded.invert .overlay .extra {
    position: relative;
}

.matrix-tableau .expanded.invert .header {
    border-radius: 0 0 0.6em 0.6em;
    border-bottom: 1px solid !important;
    border-top: 1px dotted !important;
}

.matrix-tableau .expanded.invert .extra {
    bottom: 0px;
    border: 1px solid;
    border-bottom: none;
    border-radius: 0.6em 0.6em 0 0;
}

.matrix-tableau .focus .header {
    border: 3px solid;
    padding: 3px;
}

.matrix-tableau .focus.expanded .header {
    border-bottom: 1px dotted !important;
    padding: 3px 3px 5px;
}

.matrix-tableau .focus.expanded .extra {
    border: 3px solid;
    border-top: none;
    padding: 5px 3px 3px;
}

.matrix-tableau .focus.expanded.invert .header {
    border: 3px solid;
    border-top: 1px dotted !important;
    border-bottom: 3px solid !important;
    padding: 5px 3px 3px;
}

.matrix-tableau .focus.expanded.invert .extra {
    border: 3px solid;
    border-bottom: none;
    padding: 3px 3px 5px;
}

.matrix-tableau .header.hover {
    cursor: pointer;
}

.matrix-tableau-legend {
    width: 100%;
    border-spacing: 5px;
    white-space: nowrap;
    table-layout: fixed;
}

.matrix-tableau-legend .header,
.matrix-tableau-legend .count {
    text-align: center;
    border: 1px solid;
    min-width: 60px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    padding: 5px;
    min-height: 15px;
}

.matrix-tableau-legend .header {
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ui-desktop.ui-page .ui-primary-content.full-screen-tableau {
    padding-left: 0;
    
}

/* List Tableau
------------------------------------------------------------------*/

.list-tableau {
    white-space: nowrap;
}

.list-tableau li {
    margin: 5px 0;
}

.list-tableau .header {
    border: 1px solid;
    min-width: 250px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    padding: 5px;
}

.list-tableau .collapsed .extra {
    display: none;
}

.list-tableau .expanded .extra {
    min-width: 250px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border: 1px solid;
    border-top: none;
    border-radius: 0 0 0.6em 0.6em;
    padding: 5px;
}

.list-tableau .header table,
.list-tableau .extra table {
    width: 100%;
}

.list-tableau a.more-link,
.list-tableau button.more-link {
    display: block;
    font-weight: bold;
    padding: 5px 5px 0;
}

.list-tableau .expanded .header {
    border-radius: 0.6em 0.6em 0 0;
    border-bottom: 1px dotted !important;
}

.list-tableau .focus .header {
    border: 3px solid;
    padding: 3px;
}

.list-tableau .focus.expanded .header {
    border-bottom: 1px dotted !important;
    padding: 3px 3px 5px;
}

.list-tableau .focus.expanded .extra {
    border: 3px solid;
    border-top: none;
    padding: 5px 3px 3px;
}

.list-tableau .header.hover {
    cursor: pointer;
}

.list-tableau-legend li {
    border: 1px solid;
    min-width: 250px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    padding: 5px;
    margin-bottom: 5px;
}

.list-tableau-legend li .header {
    float: left;
}

.list-tableau-legend li .count {
    text-align: right;
    padding-right: 5px;
}

/* Datepicker
------------------------------------------------------------------*/

.ui-datepicker-wrapper {
    position: relative;
}

.ui-datepicker {
    position: absolute;
    margin-top: 5px;
    width: 100%;
    z-index: 201;
    min-width: 270px;
}

.ui-datepicker-title {
    padding: 5px;
    font-size: 15px;
    text-align: center;
    border-top-left-radius: 0.4em;
    border-top-right-radius: 0.4em;
    border-top: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
}
.ui-datepicker-view {
    padding: 5px;
    text-align: center;
    border-left: 1px solid;
    border-right: 1px solid;
}

.ui-datepicker-footer {
    padding: 5px;
    text-align: center;
    border-bottom-left-radius: 0.4em;
    border-bottom-right-radius: 0.4em;
    border-bottom: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
}

.ui-datepicker-prev-nav {
    position: absolute;
    top: 5px;
    left: 10px;
}

.ui-datepicker-next-nav {
    position: absolute;
    top: 5px;
    right: 10px;
}

.ui-datepicker-view table {
    width: 100%;
    border-spacing: 1px;
}

.ui-datepicker table tr td {
    border: none;
    padding: 0;
}

.ui-datepicker-view td.today a,
.ui-datepicker-view td.weekend a,
.ui-datepicker-view td.day a,
.ui-datepicker-view td.selected a {
    display: block;
    height: 25px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /* Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    border: 2px solid;
}

.ui-inline-datepicker-wrapper {
    margin: -15px;
}

.ui-inline-datepicker-wrapper .ui-datepicker {
    position: relative;
    margin: 0;
}

.ui-inline-datepicker-wrapper .ui-datepicker-title,
.ui-inline-datepicker-wrapper .ui-datepicker-view,
.ui-inline-datepicker-wrapper .ui-datepicker-footer {
    border-radius: 0;
    border: none;
}

.ui-inline-datepicker-wrapper .ui-datepicker-title {
    font-size: 20px;
}

.ui-datepicker-clear {
    position: absolute;
    right: 10px;
}

/* Suggestion / Combobox
------------------------------------------------------------------*/

.ui-suggestion-wrapper,
.ui-combobox-wrapper {
    position: relative;
}

.ui-suggestion-list,
.ui-combobox-list {
    position: absolute;
    margin-top: 5px;
    min-width: 100%;
    border-radius: 0.4em 0.4em 0.4em 0.4em;
    border: 1px solid;
    max-height: 205px;
    overflow-x: visible;
    overflow-y: auto;
    z-index: 201;
}

.ui-suggestion-list table,
.ui-combobox-list table {
    width: 100%;
    border-spacing: 1px;
}

.ui-suggestion-list td,
.ui-combobox-list td {
    border: none;
    cursor: pointer;
}

.ui-suggestion-list td em,
.ui-suggestion-list td em a,
.ui-combobox-list td em,
.ui-combobox-list td em a {
    cursor: default;
}

.ui-combobox,
.ui-suggestion,
.ui-fakefield {
    position: relative;
}

.ui-combobox input,
.ui-suggestion input {
    cursor: pointer;
    padding-right: 32px;
}

.ui-combobox span,
.ui-suggestion span,
.ui-fakefield span {
    display: block;
    position: absolute;
    right: 1px;
    top: 1px;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
}

.ui-small .ui-combobox span,
.ui-small .ui-suggestion span,
.ui-small .ui-fakefield span {
    height: 24px;
    width: 24px;
}

.ui-suggestion-list .option-list-number,
.ui-combobox-list .option-list-number {
    text-align: right;
    padding-right: 6px;
}

.ui-suggestion-list .option-list-name,
.ui-combobox-list .option-list-name {
    text-align: left;
    padding-left: 6px;
}

.ui-suggestion-list .option-list-abbrev,
.ui-combobox-list .option-list-abbrev {
    text-align: left;
    padding-left: 6px;
}

/* Info Panels
------------------------------------------------------------------*/

.infoPanel {
    /*margin-bottom: 10px;*/
}

.baseDataPanel {
    padding: 10px 15px 15px;
    border-radius: 0 0 4px 4px;
    width: 320px;
    box-shadow: none;
}

.timeOverviewPanel, .pdaOverviewPanel {
    padding: 10px 15px 40px;
    border-radius: 4px;
    width: 320px;
    box-shadow: none;
}

.pdaOverviewPanel, .timeOverviewPanel {
    margin-top: 10px;
}

.infoOverview table {
    width: 100%;
}

.infoDetail {
    min-width: 700px;
    border-radius: 0 0 4px 4px;
    padding: 5px 15px 40px;
}

.moreInfo {
    text-decoration: none;
    padding: 10px;
}

.detailsTitle {
    text-align: center;
    font-weight: bold;
    padding: 15px 0;
}

.detailHeadline {
    font-weight: bold;
    padding: 5px;
}

.pdaDetail1, .pdaDetail2 {
    overflow: auto;
}

.pdaDetail2 {
    margin-top: 20px;
}

.infoOverview-focus {
    box-sizing:border-box;
    border: 3px solid;
    padding: 7px 12px 37px;
}

.moreInfo-focus {
    border-radius: 4px;
    box-sizing:border-box;
    border: 3px solid;
    padding: 7px;

}

.detailSelected {
    border-width: 3px;
    border-style: solid;
}

/*
.infoDetail {
    display: table;
}*/

.infoDetail table td,
.infoOverview table td,
.infoDetail table th,
.infoOverview table th,
#management-pdaInfo table td,
#management-pdaInfo table th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

.holidayCalculationDetails{
    margin-top: 15px;
    border: 1px solid;
}

#info-timeInfoDetail-timeInfoDetailTable2,
#management-timeInfoDetails-timeInfoDetailTable2 {
    border:none !important;
}

.holidayCalculationTitle {
    margin: 2px;
    text-align:center;
    height:20px;
    line-height: 20px;
    font-size: 14px;
    font-weight: bold;
}

.marginFocus{
    margin-top:18px;
}

.specialLeaveName {
    min-width: 100px;
}

/* Calendar Legend
------------------------------------------------------------------*/

.calendar-legend {
    width: 100%;
    border-spacing: 5px;
    white-space: nowrap;
    table-layout: fixed;
    /*min-width: 1150px;*/
}

.calendar-legend .header {
    text-align: center;
    border: 1px solid;
    box-sizing:border-box;
    -moz-box-sizing:border-box;   /*Firefox */
    -webkit-box-sizing:border-box; /*  Safari */
    width: 35px;
    height: 26px;
    font-size: 12px;
    line-height: 24px;
}

.calendar-legend .header.fsize3 {
    font-size: 9px;
}

.calendar-legend .header.fsize4 {
    font-size: 7px;
}

.legend-abbrev-td {
    width:35px;
    float:left;
}

.legend-abbrev-td .moreDetails img{
    position: relative;
    bottom: 10px;
    left: 13px;
}

.legend-name-td {
    text-overflow: ellipsis;
    overflow: hidden;
    float: left;
    line-height: 25px;
    margin-left: 5px;
    width: 110px;
}

.calendar-legend div.dottedBorder {
    border: 2px dotted;
}

.calendar-legend div.boldBorder,
.calendar-legend div.inSubstitution,
.calendar-legend div.isAlternativeWP,
.calendar-legend div.today,
.calendar-legend div.applicant,
.calendar-legend div.applicantion,
.calendar-legend div.selected-employees {
    border: 2px solid;
}

.calendar-legend div.selected-employees {
    border-color: darkblue;
}

.legend-element {
    /*    min-width: 150px;
        max-width: 250px;*/
    width: 150px;
    float: left;
    display: inline-block;
    margin-bottom: 10px;
    margin-right: 5px;
}

.calendar-legend-settings-body {
    display: flex;
    flex-direction: column;
    overflow: auto;
    height: 300px;
    border: 2px solid white;
}

.calendar-legend-settings-header {
    height: fit-content;
}

.legend-element-configurable-wrapper {
    display: flex;
    flex-direction: row;
    padding: 10px;
    align-items: center;
}

.legend-element-configurable-checkbox {
    margin-right: 10px;
}

.legend-element-configurable-name {
    margin-right: 10px;
}

.legend-element-configurable-miniature {
    max-width: 35px;
    max-height: 26px;
    height: 26px;
    width: 35px;
    border: 2px solid black;
    display: flex;
    justify-content: center;
    align-items: center;
}

.legend-element-configurable-wrapper-odd {
    background-color: white;
}

.configuration-list-title {
    background-color: #042d69;
    color: white;
    border: 2px solid white;
    font-family: 'Tahoma','Helvetica','Verdana','Arial Black','Arial';
}

.hide-legend-element-settings-title {
    display: flex;
    /*justify-content: center;
    align-items: center;*/
    font-size: 18px;
    padding: 10px;
}

.hide-legend-element-settings-title .dialog-title {
    margin-left: 110px;
}

#calendarLegendSettingsFilter:focus {
    color: black;
}

.legend-element-configurable-miniature .dogEar {
    left: 14px;
    top: -9px;
    position: relative;
    width: 8px;
}

.legend-element-configurable-miniature.inSubstitution {
    border: 2px solid red;
}

/* Toolbar
------------------------------------------------------------------*/

button.icon-print {
    border: none;
    cursor: pointer;
}

button.icon-print:focus,
input.icon-time-favourite:focus,
input.icon-time-favourite-on:focus,
button.icon-help:focus {
    height: 30px;
    width: 30px;
}

.icon-print,
.icon-settings,
.icon-legend,
.icon-calendar,
.icon-employees-info,
.icon-time-favourite,
.icon-time-favourite-on,
.icon-full-screen,
.icon-restore-full-screen
{
    display: inline-block;
    width: 24px;
    height: 24px;
    text-indent: -99999px;
    margin-right: 6px;
    margin-top: 3px;
}

.icon-print:focus,
.icon-employees-info:focus,
.icon-settings:focus,
.icon-legend:focus,
.icon-calendar:focus,
.icon-time-favourite:focus,
.icon-time-favourite-on:focus {
    border-width: 3px;
    border-style: solid;
    margin-right: 3px;
    margin-top:0;
    margin-left: -3px;
    margin-bottom: -3px;
}

.icon-checkLike-off,
.icon-checkLike-on,
.icon-checkLike-off:focus,
.icon-checkLike-on:focus
{
    display: inline-block;
    width: 24px;
    height: 24px;
    text-indent: -99999px;
    margin-right: 6px;
    margin-top: 3px;
}

.ui-toolbar {
    float: right;
    padding: 15px 15px 0 0;
}

.ui-toolbar-nopadding {
    float: right;
    padding: 0;
    margin: -64px 30px 0 0;
}

div.infoOverview .ui-toolbar {
    margin-bottom: 5px;
}

.ui-toolbar input {
    background-color: transparent;
    border: none;
}

.ui-toolbar input:hover {
    cursor: pointer;
}

/* Settings button
------------------------------------------------------------------*/

.settings {
    display: block;
    float: right;
    text-indent: -99999px;
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

div.infoOverview .settins {
    margin-bottom: 5px;
}

/* Calendar Table
------------------------------------------------------------------*/

#calendar-personalcalendar {
    min-height: 360px;
    min-width: 1148px;
}

.dateButton {
    background-color: transparent;
    border: medium none;
    cursor: pointer;
}

#calendar-personalcalendar,
#calendar-groupcalendar,
#management-employeeInformation {
    margin: 0 20px;
    border-radius: 0 4px 4px 4px;
    min-height: 100px;
}

#calendar-personalcalendar-logic,
#calendar-groupcalendar-logic,
#management-employeeInformation-logic {
    padding-bottom: 20px;
}

.divCalendarTable {
    position: relative;
}

.calendarTable {
    border-collapse: collapse;
    padding: 10px;
    table-layout: fixed;
}

.calendarTable.personal {
    /*table-layout: fixed;*/
    min-width: 1140px;
}

#calendar-personalcalendar_currentYear,
#calendar-personalcalendar_currentMonth {
    font-size: 14px;
}

.calendarTable.group tr td button.monthHeader,
.calendarTable.group tr td button.weekHeader {
    font-weight: bold;
}

.group td {
    white-space: nowrap;
    /* overflow: hidden; */
    text-overflow: ellipsis;
}

.calendarTable.personal .days-row,
.calendarTable.group thead,
.calendarTable.group thead {
    background-color: #030469;
    background-image: linear-gradient(to bottom,#030469,#224D7E 72px);
}

.calendarTable tr.buttons-row th {
    padding: 2px;
}

.calendarTable tr.days-row th {
    background-color: #030469;
    color: white;
    border: 1px solid #fff;
    min-width: 29px;
    min-height: 23px;
    font-size: 12px;
}

.calendarTable th.thYearUp,
.calendarTable th.thYearDown,
.calendarTable th.thMonthUp,
.calendarTable th.thMonthDown {
    border-top: 3px solid;
    border-right:none;
}

.calendarTable th.thYearUp,
.calendarTable th.thYearDown {
    min-width: 31px;
}

.calendarTable th.thMonthUp,
.calendarTable th.thMonthDown {
    min-width: 31px;
}

.calendarTable tr.days-row th.thYearDown,
.calendarTable tr.days-row th.thMonthUp,
.calendarTable tr.days-row th.thMonthDown {
    border-left: none;
}

.calendarTable tr.days-row th.thYearUp,
.calendarTable tr.days-row th.thYearDown,
.calendarTable tr.days-row th.thMonthUp {
    border-right: none;
}

.calendarTable th.thYearUp {
    border-left: 3px solid;
}

#calendar-personalcalendar_yearUp,
#calendar-personalcalendar_yearDown,
#calendar-personalcalendar_monthUp,
#calendar-personalcalendar_monthDown {
    border: none;
}

.calendarTable tr.normalBorder {
    border: 1px solid;
}

.calendarTable tr td {
    text-align: center;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.calendarTable tr td.normalBorder button,
.calendarTable tr td.boldBorder button,
.calendarTable tr td.dottedBorder button,
.calendarTable tr td.dottedBorderPDF button,
.calendarTable tr td.normalBorder a,
.calendarTable tr td.boldBorder a,
.calendarTable tr td.dottedBorder a,
.calendarTable tr td.dottedBorderPDF a {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 13px;
    line-height: 21px;
}

.calendarTable tr.group-row {
}

.calendarTable tr.group-row td.group-cell {
    height: 23px;
    text-align: left;
    background-color: #888;
    background-image: linear-gradient(to bottom, #BBB 0%, #888 100%);
}

.calendarTable tr.group-row td .group-label {
    padding: 0 5px;
    line-height: 21px;
    font-weight: bold;
    font-size: 13px;
    text-align: left;
    color: #FFFFFF;
}

.calendarTable tr.group-row td.selection-overlay-cell .selection-overlay-wrapper .group-label,
.calendarTable tr.group-row td.group-cell .selection-overlay-wrapper .group-label {
    position: absolute;
    height: 22px;
    top: 0;
    left: 0;
    /*z-index: 1;*/
    cursor: pointer;
    background-color: #999;
    background-image: linear-gradient(to bottom, #BBB 0%, #999 100%);
}

.calendarTable tr.group-row td.group-cell {
}

.calendarTable tr td.employee-cell .employee-background-wrapper {
    position: relative;
}

.calendarTable tr td.empInfo-cell .overlay-wrapper,
.calendarTable tr td.employee-cell .overlay-wrapper {
    height: 100%;
    color: black;
}

.calendarTable tr td.empInfo-cell .overlay-wrapper span.employee-name,
.calendarTable tr td.employee-cell .overlay-wrapper span.employee-name {
    padding: 0 5px;
}

.calendarTable tr td.normalBorder {
    border: 1px solid;
}

.calendarTable tr td.boldBorder.focused
{
    border: 1px solid !important;
}

.calendarTable.employeeInfoTable td.employee-cell button:focus
{
    border: 2px solid yellow !important;
}

.calendarTable.employeeInfoTable tr td.employee-cell button:focus .info span
{
    padding-left: 2.5px;
}

.calendarTable.employeeInfoTable tr td.employee-cell.selected button:focus .info span
{
    padding-left: 2px;
}

.calendarTable.employeeInfoTable tr td.employee-cell button:focus .info
{
    line-height: 19px;
}

.calendarTable.group tr.lastSelectedEmployee + tr td.normalBorder .overlay-wrapper:focus .info {
    line-height: 17px;
}

.calendarTable.employeeInfoTable tr td.employee-cell.selected button:focus .info
{
    line-height: 17px;
}

.calendarTable.employeeInfoTable tr td.employee-cell.selected + tr td.employee-cell button:focus .info
{
    line-height: 15px;
}

.calendarTable tr td.boldBorder {
    border: 2px solid !important;
}

.calendarTable tr td.dottedBorder {
    border: 2px dotted !important;
}

.calendarTable tr td.dottedBorderPDF {
    border: 3px dotted !important;
}

.calendarTable tr td button.moreDetails {
    background-repeat: no-repeat;
    background-position: top right;
}

.calendarTable tr td.tdMonth {
    text-align: left;
    font-size: 12px;
    padding-left: 2px;
}

.calendarTable tr td.tdYear {
    vertical-align: top;
    font-size: 12px;
}

.calendarTable tr td.cellLabelMonth span,
.calendarTable tr td.cellLabelWeek span,
.calendarTable tr td.employeeInfoLabelMonth span,
.calendarTable tr td.employeeInfoLabelWeek span {
    text-align: right;
    font-weight: bold;
    font-size: 13.13px;
}

.calendar-change-date.calendar-prev {
    display: inline-block;
    /*float: left;*/
}

.calendar-change-date.calendar-next {
    display: inline-block;
    /*float: left;*/
}

.calendarTable .overlay-wrapper {
    position:relative;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
}

.calendarTable .overlay {
    display: none;
    position: absolute;
    top: 4px;
    left: 1px;
    padding: 4px;
    border-radius: 0 4px 4px 4px;
    white-space: nowrap;
}

.calendarTable tr td.overSelectedOne .overlay-wrapper,
.calendarTable tr td.focused .overlay-wrapper {
    z-index: 70;
    outline: solid 3px !important;
}

.calendarTable tr td .overlay-wrapper {
    z-index: 60;
}

.calendarTable tr td.employee-cell.both2rows .overlay-wrapper .info {
    height: 100%;
    left: 0;
    line-height: 46px;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 90;
}

.calendarTable tr td .overlay-wrapper .info {
    height: 100%;
    left: 0;
    top: 0;
    font-size: 12px;
    line-height: 23px;
    position: absolute;
    width: 100%;
    z-index: 90;
    overflow: hidden;
}

.calendarTable tr td .overlay-wrapper .info.fsize3 {
    font-size: 9px;
}

.calendarTable tr td .overlay-wrapper .info.fsize4 {
    font-size: 7px;
}

.calendarTable .overlay-wrapper .inSubstitution,
    .calendarTable .overlay-wrapper .isAlternativeWP {
    border: 2px solid;
    height: 18px;
    width: 25px;
    position: absolute;
    z-index: 5000;
    top: 0px;
    left: 0px;
}

.calendarTable td.boldBorder .overlay-wrapper .inSubstitution,
.calendarTable td.dottedBorder .overlay-wrapper .inSubstitution,
.calendarTable td.dottedBorderPDF .overlay-wrapper .inSubstitution ,
.calendarTable td.boldBorder .overlay-wrapper .isAlternativeWP,
.calendarTable td.dottedBorder .overlay-wrapper .isAlternativeWP,
.calendarTable td.dottedBorderPDF .overlay-wrapper .isAlternativeWP {
    height: 17px;
    width: 24px;
}

.calendarTable.group tr.firstSelectedEmployee td.normalBorder .overlay-wrapper .info,
.calendarTable.group tr.firstSelectedEmployee td.normalBorder .overlay-wrapper .dot {
    line-height: 21px;
}

.calendarTable.group tr.lastSelectedEmployee + tr td.normalBorder .overlay-wrapper .info,
.calendarTable.group tr.lastSelectedEmployee + tr td.normalBorder .overlay-wrapper .dot {
    line-height: 21px;
}

.calendarTable.group tr.lastSelectedEmployee + tr td.employee-cell.both2rows.normalBorder .overlay-wrapper .info,
.calendarTable.group tr.lastSelectedEmployee + tr td.employee-cell.both2rows.normalBorder .overlay-wrapper .dot {
    line-height: 44px;
}

.calendarTable.group tr.firstSelectedEmployee td.employee-cell.both2rows.normalBorder .overlay-wrapper .info,
.calendarTable.group tr.firstSelectedEmployee td.employee-cell.both2rows.normalBorder .overlay-wrapper .dot {
    line-height: 44px;
}

.calendarTable.group tr td.employee-cell .overlay-wrapper .info span {
    padding-left: 4.5px;
}

.calendarTable.group tr td.employee-cell.selected .overlay-wrapper .info span {
    padding-left: 4px;
}

.calendarTable tr td .overlay-wrapper .empSel {
    position: absolute;
    width : 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 55;
}

.calendarTable tr td .overlay-wrapper .dogEar {
    position: absolute;
    width : 7px;
    height: 7px;
    top: 0;
    right: 0;
    z-index: 50;
}

.calendarTable tr td .overlay-wrapper .cDot {
    position: absolute;
    top: 30%;
    left: 39%;
    z-index: 40;
}

.calendarTable tr td .overlay-wrapper .ncDot {
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 40;
}

.calendarTable tr td.empInfo-cell .overlay-wrapper .not-allowed,
.calendarTable tr td.empInfo-cell .overlay-wrapper .sel,
.calendarTable tr td.empInfo-cell .overlay-wrapper .bg,
.calendarTable tr td.employee-cell .overlay-wrapper .not-allowed,
.calendarTable tr td.employee-cell .overlay-wrapper .sel,
.calendarTable tr td.employee-cell .overlay-wrapper .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
}

.calendarTable tr td.employee-cell img.bg {
    position: absolute;
    display: block;
    width: 100%;
    height: 21px;
}

.calendarTable tr td.employee-cell.both2rows img.bg {
    height: 45px;
}

.calendarTable tr td.employee-cell.both2rows .divCellInfoOverlay img.bg {
    height: 21px;
}

.calendarTable tr td .overlay-wrapper .text {
    display: none;
}

/*.calendarTable tr td .overlay-wrapper .bgcolor {
    display: none;
}*/

.calendarTable tr td .overlay-wrapper .bgcolor {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -10;
}

.calendarTable tr td.empInfo-cell .overlay-wrapper .empSel,
.calendarTable tr td.employee-cell .overlay-wrapper .empSel {
    position: absolute;
    min-height: 20px;
    width : 100%;
    top: 0px;
    z-index: 55;
}

.calendarTable tr td .overlay-wrapper .not-allowed,
.calendarTable tr td .overlay-wrapper .sel,
.calendarTable tr td .overlay-wrapper .bg,
.calendarTable tr td .overlay-wrapper .wf {
    position: absolute;
    width : 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.calendarTable tr td .overlay-wrapper .sel {
    z-index: 30;
}

.calendarTable tr td .overlay-wrapper .not-allowed {
    z-index: 20;
    width: 29px;
    height: 22px;
}

.calendarTable tr td .overlay-wrapper .bg {
    z-index: -10;
}

.calendarTable tr td .overlay-wrapper .wf {
    z-index: 10;
    top: auto;
    bottom: 0;
    height: 3px;
}

.calendarTable tr td.day-column {
    width: 29px;
    height: auto;
}

.calendarTable.group tr td.day-column img {
    display: block;
}

/* Cell Info Overlay */

div.outerDivOverlay {
    position: relative;
}

div.divCellInfoOverlay {
    position: absolute;
    z-index: 150;
    border: 1px solid black;
    border-radius: 0 5px 5px;
    left: -1px;
}

button.cellInfoOverlaySelected {
    outline: 1px solid;
}

.calendarTable .cellInfoOverlay,
.calendar-applicant-overlay .cellInfoOverlay {
    position:relative;
    /*    border: 1px solid;
        border-radius: 0 5px 5px;*/
    line-height: 15px;
    font-size: 12px;
}

.calendarTable .cellInfoOverlay td,
.calendar-applicant-overlay .cellInfoOverlay td {
    position: relative;
    /*display: none;*/
    height: 0px;
    white-space: nowrap;
}

.calendarTable .cellInfoOverlay td .bg,
.calendarTable .cellInfoOverlay td .bg-first,
.calendarTable .cellInfoOverlay td .bg-last,
.calendar-applicant-overlay .cellInfoOverlay td .bg,
.calendar-applicant-overlay .cellInfoOverlay td .bg-first,
.calendar-applicant-overlay .cellInfoOverlay td .bg-last {
    z-index: -1;
}

.calendarTable .cellInfoOverlay td,
.calendar-applicant-overlay .cellInfoOverlay td {
    padding: 2px;
}

.calendarTable .cellInfoOverlay td.overlay-date,
.calendar-applicant-overlay .cellInfoOverlay td.overlay-date {
    border-bottom: 1px solid black;
}

.calendarTable .cellInfoOverlay td .bg,
.calendarTable .cellInfoOverlay td .bg-first,
.calendarTable .cellInfoOverlay td .bg-last,
.calendar-applicant-overlay .cellInfoOverlay td .bg,
.calendar-applicant-overlay .cellInfoOverlay td .bg-first,
.calendar-applicant-overlay .cellInfoOverlay td .bg-last {
    position: absolute;
    top: 0px;
    height: 19px;
    width: 100%;
    left: 0px;
}

.calendarTable .cellInfoOverlay td.italic,
.calendar-applicant-overlay .cellInfoOverlay td.italic {
    font-style: italic;
}


.calendarTable .cellInfoOverlay td:last-child .bg-first,
.calendar-applicant-overlay .cellInfoOverlay td:last-child .bg-first {
    border-radius: 0 4px 0 0;
}

.calendarTable .cellInfoOverlay td:first-child .bg-last,
.calendar-applicant-overlay .cellInfoOverlay td:first-child .bg-last {
    border-radius: 0 0 0 4px;
}

.calendarTable .cellInfoOverlay td:last-child .bg-last,
.calendar-applicant-overlay .cellInfoOverlay td:last-child .bg-last {
    border-radius: 0 0 4px 0;
}

.calendarTable .cellInfoOverlay td:last-child .bg-first.bg-last,
.calendar-applicant-overlay .cellInfoOverlay td:last-child .bg-first.bg-last {
    border-radius: 0 4px 4px 0;
}

.calendarTable .cellInfoOverlay .overlay-color-legend,
.calendar-applicant-overlay .cellInfoOverlay .overlay-color-legend {
    width: 22px;
    height: 12px;
}

.calendarTable .cellInfoOverlay .button-cellOverlay-date,
.calendar-applicant-overlay .cellInfoOverlay .button-cellOverlay-date {
    height: 15px;
    line-height: 15px;
}

.calendarTable tr td.ui-small {
    font-size: 14px;
}

.calendarTable .months-row {
    /*border-top: 1px solid;*/
}

.dateButtons {
    width: 60px;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-right: 1px;
    border-bottom: 0 none;
}

.dateButtonsMonth {
    min-width: 54px;
    width: 54px;
    border-collapse: collapse;
    border-top:1px solid;
    padding-top: 1px;
}

.dateButtonsWeek {
    min-width: 60px;
    border-collapse: collapse;
    /*border-bottom:1px solid;*/
    padding-bottom: 1px;
}

.cellLabelWeek,
.cellLabelMonth {
    border-bottom: 0 none;
}

.cellTodayButton,
.cellSelectDateButton {
    min-width:110px;
    width:110px;
    border-right: 0 none;
    border-left: 1px solid;
}

.cellTodayButton {
    border-bottom-width: 0px;
    padding: 2px 2px 1px 2px;
}

.cellSelectDateButton {
    border-top-width: 0px;
    padding: 1px 2px 2px 2px;
    height: 28px;
}

.cellTodayButton button,
.cellSelectDateButton button {
    overflow: visible;
    min-width: 105px;
    height: 23px;
    line-height: 23px;
}

.labelMonth,
.labelWeek {
    float:right;
    padding: 0 5px;
}

.selectableCell {
    min-width: 30px;
    height: 23px;
    line-height: 15px;
    cursor: pointer;
}

.calendar-down,
.calendar-up,
.calendar-next,
.calendar-prev {
    padding: 0;
    margin: 0;
    font-size: 11px;
    text-indent:-99999px;
    background:none;
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.calendar-down,
.calendar-up {
    height: 16px;
    margin: 4px;
    width: 16px;
}

.calendar-next,
.calendar-prev {
    width: 24px;
    height: 24px;
    margin-right: 5px;
}

.calendar-next {
    /*float:right;*/
}

.calendar-down.hover,
.calendar-up.hover,
.calendar-next.hover,
.calendar-prev.hover{
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.calendar-up:focus,
.calendar-down:focus,
.calendar-prev:focus,
.calendar-next:focus {
    background: none;
    background-repeat: no-repeat;
    background-position: 0px 0px;
    border:none;
}

a.groupTab,
a.personalTab,
div.personalTab{
    border: 1px solid;
    border-radius: 0 0 4px 4px;
    padding: 11px;
}

a.tabSelected,
div.tabSelected {
    font-weight: bold;
}

.calendarEmptyDayButton {
    color: transparent;
}

.calendarEmptyDayButton,
.calendarValueDayButton {
    height: 100%;
    width: 100%;
    display: block;
}

.calendarTable tr td.cellValue {
    font-size: 12px;
    line-height: 23px;
}

.calendarTable tr td.cellValue button,
.calendarTable tr td.cellValue a {
    font-size: 12px;

}

.calendarTable.employeeInfoTable tr td.empInfo-cell {
    padding-left: 3px;
    padding-right: 3px;
    font-size: 12px;
    border-color: #D3D3D3;
}

.calendarTable thead tr td.calendarHeader {
    line-height: 21px;
    font-weight: bold;
}

.calendarTable tr td.group-cell.both2rows,
.calendarTable tr td.employee-cell.both2rows {
    height: 46px;
    line-height: 45px;
}

.calendarTable tr.group-row td.selection-overlay-cell.both2rows .selection-overlay-wrapper .group-label,
.calendarTable tr.group-row td.group-cell.both2rows .selection-overlay-wrapper .group-label {
    height: 45px;
    line-height: 44px;
}

.calendarTable thead tr td.employeeInfoCellSelectDate {
    border-bottom: 1px solid;
}

.groupCell {
    width: 30px;
}

.calendarTable thead tr.days-of-week-row td.normalBorder button {
    width: 29px;
}

.calendarTable tr td.personnelSelectionButton {
    /*border-top: 1px solid;*/
    border-left: 1px solid;
    border-right: 0px;
    font-size: 10px;
    padding: 3px;
    vertical-align: middle;
    min-width: 215px;
    padding: 10px;
    padding-right : 8px !important;
}

.calendarTable tr td.todayHeader {
    border-top: 2px solid !important;
    border-left: 2px solid !important;
    border-right: 2px solid !important;
}

.calendarTable tr td.today
{
    border-left: 2px solid !important;
    border-right: 2px solid !important;
}

.calendarTable tr td.todayLast,
.calendarTable tbody tr:last-child td.today {
    border-bottom: 2px solid !important;
    border-left: 2px solid !important;
    border-right: 2px solid !important;
}

.calendarTable.group tr td.filled button,
.calendarTable.group tr td.filled a {
    font-weight: normal;
}


.calendarTable.group tr td button.present,
.calendarTable.group tr td a.present {
    font-weight: bold;
    text-align: left;
}

.calendarTable.group tr td button.nonPresent,
.calendarTable.group tr td a.nonPresent {
    font-weight: normal;
    text-align: left;
}

.calendarTable.group tr td button.present.presence-color-on,
.calendarTable.group tr td a.present.presence-color-on {
    font-weight: normal;
}

.calendarTable tr td
{
    height: 23px;
}

.calendarTable tr td.selected
{
    min-height: 23px;
}

.calendarTable.group tr.firstSelectedEmployee {
    border-top: 2px solid;
    border-left: 2px solid;
    border-right: 2px solid;
}

.calendarTable.group tr.midSelectedEmployee {
    border-left: 2px solid;
    border-right: 2px solid;
}

.calendarTable.group tr.lastSelectedEmployee,
.calendarTable.group tr.employee-row.lastSelectedEmployee {
    border-bottom: 2px solid;
    border-left: 2px solid;
    border-right: 2px solid;
}

.calendarTable.group #calendar-groupCalendar-today,
.calendarTable.group #calendar-groupCalendar-selectDate {
    font-size: 12px;
    margin: 4px;
}

.calendarTable.group div.selection-overlay-wrapper {
    position: relative;
}

.calendarTable.group div.employee-selection-overlay,
.calendar-applicant-overlay div.applicant-employee-selection-overlay {
    position: absolute;
    height: 24px;
    top: -1px;
    left: 0px;
    z-index: 2;
    cursor: pointer;
}

.calendarTable.group td.selection-overlay-cell.both2rows,
.calendarTable.group .both2rows div.employee-selection-overlay,
.calendar-applicant-overlay .both2rows div.applicant-employee-selection-overlay {
    height: 46px;
}

.calendarTable.group img.selection-overlay,
.calendar-applicant-overlay img.applicant-selection-overlay {
    position: absolute;
    height: 0;
    width: 0;
    top: 0;
    left: 0;
    z-index: 1;
    cursor: pointer;
}

.calendarTable.group div.selection-highlight-overlay,
.calendar-applicant-overlay div.applicant-selection-highlight {
    position: absolute;
    width: 0;
    height: 0;
    z-index: 3;
    cursor: pointer;
}

.calendarTable.group div.detail-overlay,
.calendar-applicant-overlay div.detail-overlay {
    position: absolute;
    width: 0;
    height: 0;
    z-index: 4;
    cursor: pointer;
}

.calendarTable.group div.detail-border,
.calendar-applicant-overlay div.detail-border {
    border: 1px solid black;
    width: 29px;
    height: 22px;
    z-index: 2;
    cursor: pointer;
    margin-left: -1px;
    margin-bottom: -1px;
}

.calendarTable.group .both2rows div.detail-border
.calendar-applicant-overlay .both2rows div.detail-border {
    height: 45px;
}

.calendarTable.group div.tooltip-overlay,
.calendar-applicant-overlay div.tooltip-overlay {
    position: absolute;
    width: 0;
    height: 0;
    z-index: 4;
    cursor: pointer;
}

.calendar-applicant-overlay tr td {
    text-align: center;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.calendarTable.group a.focus-overlay {
    position: absolute;
    width: 29px;
    height: 22px;
    z-index: 3;
    cursor: pointer;
}

.calendarTable.group .both2rows a.focus-overlay {
    height: 45px;
}

.calendarTable.group a.focus-overlay:focus {
    outline: 3px solid yellow !important;
}

.calendarTable.group div.midSelectedEmployee {
    border-left: 2px solid darkblue;
    border-right: 2px solid darkblue;
    height: 23px;
}

.calendarTable.group div.firstSelectedEmployee {
    border-top: 2px solid darkblue;
    height: 21px;
}

.calendarTable.group div.lastSelectedEmployee {
    border-bottom: 2px solid darkblue;
    height: 22px;
}

.calendarTable.group div.firstSelectedEmployee.lastSelectedEmployee {
    border-bottom: 2px solid darkblue;
    height: 20px;
}

.calendarTable.group .both2rows div.midSelectedEmployee {
    height: 46px;
}

.calendarTable.group .both2rows div.firstSelectedEmployee {
    height: 44px;
}

.calendarTable.group .both2rows div.lastSelectedEmployee {
    height: 45px;
}

.calendarTable.group .both2rows div.firstSelectedEmployee.lastSelectedEmployee {
    height: 43px;
}

.calendarTable.group .applicant div.firstSelectedEmployee,
.calendarTable.group .applicant div.midSelectedEmployee,
.calendarTable.group .applicant div.lastSelectedEmployee,
.calendar-applicant-overlay div.applicant-employee-selection-overlay {
    border: 2px solid purple;
    height: 21px;
}

.calendarTable.group tbody tr.applicant-row {
    border: 2px solid purple !important;
    height: 21px;
}

.calendar-applicant-overlay div.applicant-employee-selection-overlay {
    top: -2px;
    cursor: pointer;
}

.calendar-applicant-overlay {
    display: none;
    background-color: white;
    position: absolute;
    left: 1px;
    top: 0;
    height: 22px;
    z-index: 100;
    -webkit-box-shadow: 0px -20px 7px 6px #F1F5F7, 0px 20px 7px 6px #F1F5F7;
    -moz-box-shadow: 0px -20px 7px 6px #F1F5F7, 0px 20px 7px 6px #F1F5F7;
    box-shadow: 0px -20px 7px 6px #F1F5F7, 0px 20px 7px 6px #F1F5F7;
}


.calendar-applicant-employee {
    float: left;
    width: 222px;
    font-family: "Tahoma","Helvetica","Verdana","Arial Black","Arial";
    font-size: 13px;
    font-weight: 400;
    height: 22px;
    line-height: 21px;
    border-right: 1px solid white;
}

.calendar-applicant-employee-present {
    font-weight: bold;
}


.calendar-applicant-employee-present {
    font-weight: bold;
}

#calendarTable.group .today-overlay {
    cursor: pointer;
}

.applicant-today-overlay {
    position: absolute;
    top: 0;
    border-left: 2px solid #fc8d8d;
    border-right: 2px solid #fc8d8d;
    width: 27px;
    z-index: 1;
    height: 21px;
    cursor: pointer;
}

.calendarTable.group .applicant .both2rows div.firstSelectedEmployee,
.calendarTable.group .applicant .both2rows div.midSelectedEmployee,
.calendarTable.group .applicant .both2rows div.lastSelectedEmployee,
.calendar-applicant-overlay.calendar-applicant-both2rows,
.calendar-applicant-overlay.calendar-applicant-both2rows div.calendar-applicant-employee,
.calendar-applicant-overlay.calendar-applicant-both2rows div.applicant-today-overlay,
.calendar-applicant-overlay.calendar-applicant-both2rows div.applicant-employee-selection-overlay {
    height: 44px;
}

.calendarTable.group div.application-overlay,
.calendar-applicant-overlay div.application-overlay {
    position: absolute;
    border: 2px solid #00FF00;
    z-index: 4;
    height: 21px;
    cursor: pointer;
}

.calendarTable.group .both2rows div.application-overlay,
.calendar-applicant-overlay.calendar-applicant-both2rows div.application-overlay {
    height: 44px;
}

.calendar-show-scrollbar {
    position: fixed;
    top: 81px;
}

#calendar-groupcalendar_pagination2-wrapper,
#management-employeeInformation_pagination2-wrapper {
    position: relative;
    z-index: 100;
}

#calendar-legendWrapper
{
    overflow: auto;
}

/* Management - Employee information table
------------------------------------------------------------------*/

.calendarTable.employeeInfoTable tr td.ui-small {
    font-size: 12px;
}

#divEmployeeInfoTable {
    padding: 20px;
    border-radius: 0 4px 4px 4px;
}

#divEmployeeInfoTable .currentDateButton {
    margin: 3px;
}

.employeeInformation-header {
    cursor: pointer;
    background-position: right center;
    background-repeat: no-repeat;
    padding-left: 5px;
    padding-right: 5px;
}

.group td.employeeInformation-header {
    white-space: normal;
}

.calendarTable.employeeInfoTable tr td.employeeHeader {
    /*font-weight: bold;*/
    font-size: 13.33px;
    min-width: 190px; /*FF*/
}

.calendarTable.employeeInfoTable tr td button.monthHeader,
.calendarTable.employeeInfoTable tr td button.weekHeader,
.calendarTable.employeeInfoTable tr td.employeeInformation-header {
    font-weight: bold;
}

.calendarTable.employeeInfoTable {
    border: 0px;
    border-collapse: collapse;
    padding: 10px;
    table-layout: fixed;
}

.calendarTable.employeeInfoTable tr td.borderTopLeft {
    border-top:  1px solid;
    border-left: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderBottomLeft {
    border-bottom: 1px solid;
    border-left: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderBottomRight {
    border-bottom:  1px solid;
    border-right: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderTopRight {
    border-top: 1px solid;
    border-right: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderTop {
    border-top: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderLeft {
    border-left: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderBottom {
    border-bottom: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderRight {
    border-right: 1px solid;
}

.calendarTable.employeeInfoTable tr td.borderTopLeftBlank {
    border-top: 0px none;
    border-left: 0px none;
}

.calendarTable.employeeInfoTable tr td.borderBottomLeftBlank{
    border-top:  0px none;
    border-left: 0px none;
}

.calendarTable.employeeInfoTable tr td.borderWeekLeftBlank {
    border-left: 0px none;
}

.calendarTable.employeeInfoTable tr td.borderWeekBottomWhite {
    border-bottom: 1px solid white;
}

.calendarTable.employeeInfoTable tr td.borderMonthDayLeftBlank {
    border-left: 0px none;
}

.calendarTable.employeeInfoTable tr.lastSelectedEmployee + tr td.empInfo-cell.normalBorder .overlay-wrapper .info {
    line-height: 20.5px;
}

.calendarTable.employeeInfoTable tr.lastSelectedEmployee + tr td.empInfo-cell.both2rows.normalBorder .overlay-wrapper .info {
    line-height: 42.5px;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell .overlay-wrapper .info,
.calendarTable.employeeInfoTable tr td.empInfo-cell.selected .overlay-wrapper .info,
.calendarTable.employeeInfoTable tr td.empInfo-cell.both2rows .overlay-wrapper .info,
.calendarTable.employeeInfoTable tr td.empInfo-cell.both2rows.selected .overlay-wrapper .info {
    position: relative;
    width: auto;
    height: 100%;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell .overlay-wrapper .info {
    line-height: 21.5px;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell.selected .overlay-wrapper .info {
    line-height: 20px;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell.both2rows .overlay-wrapper .info {
    line-height: 44.5px;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell.both2rows.selected .overlay-wrapper .info {
    line-height: 41.5px;
    position: relative;
    width: auto;
    height: 100%;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell.both2rows .info {
    line-height: 43px;
    height: 100%;
}

.calendarTable.employeeInfoTable tr td.sumCell {
    padding-left: 10px;
    padding-right: 3px;
    font-weight: bold;
}

.calendarTable.employeeInfoTable tr td.empInfo-cell.both2rows,
.calendarTable.employeeInfoTable tr td.employee-cell.both2rows
{
    height: 46px;
}

tr.firstSelectedEmployee td.empInfo-cell.both2rows.normalBorder .overlay-wrapper .info {
    line-height: 44px;
}


.calendarTable.employeeInfoTable thead tr td button.openSelectEmployee {
    /*    height: 15px;
        line-height: 15px;*/
    border: 1px solid;
}

/*.calendarTable.employeeInfoTable thead tr td button.openSelectEmployee:focus {
    border:1px solid;
}*/

.employeeInfoLabelMonth {
    text-align: center;
    border-left: solid 1px;
    border-top: solid 1px;
}

.employeeInfoLabelWeek {
    text-align: center;
    border-left: solid 1px;
    border-bottom: solid 1px;
}

#calendarTable tr.group-row > td:first-child {
    height: 36px;
    background-color: #F0F0ED;
    border: 1px solid #FFF;
}

#calendarTable tr.group-row > td:first-child .group-label {
    font-size: 12px;
    line-height: 35px;
    font-weight: bold;
    text-align: left;
    padding-left: 10px;
}

.calendarTable.employeeInfoTable.table1,
.calendarTable.employeeInfoTable.table3 {
    /*table-layout: auto;*/
}

.calendarTable.employeeInfoTable.table1 thead,
.calendarTable.employeeInfoTable.table3 tbody {
    z-index: 100;
}

.calendarTable.employeeInfoTable.table1 tbody {
    visibility: hidden;
}

.calendarTable.employeeInfoTable.table3 thead {
    visibility: hidden;
}

td.selection-overlay-cell {
    vertical-align: top;
}

.calendarTable.group.table3:not(.employeeInfoTable) div.firstSelectedEmployee,
.calendarTable.group.table3:not(.employeeInfoTable) div.midSelectedEmployee,
.calendarTable.group.table3:not(.employeeInfoTable) div.lastSelectedEmployee {
    border-right: none;
}

.calendarTable.group.table4 div.firstSelectedEmployee,
.calendarTable.group.table4 div.midSelectedEmployee,
.calendarTable.group.table4 div.lastSelectedEmployee {
    border-left: none;
}

.calendarTable.group.table2 div.today-overlay {
    border-bottom: none !important;
}

.calendarTable.group.table4 div.today-overlay {
    border-top: none !important;
}


/* Select Employees Subdialog
------------------------------------------------------------------*/
/*.selectEmployeeTable {
    height: 200px;
    overflow-y: auto;
}*/

/*disable text selection on select employee table*/
/*#employeeTable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}*/

#employeeTable tbody {
    overflow-y: auto;
}

#employeeTable thead tr th {
    cursor: pointer;
}

.hide {
    visibility: hidden;
}

td.orderUp,
td.orderDown {
    text-align: center;
}

tbody tr td.orderUp a.hidden,
tbody tr td.orderDown a.hidden {
    visibility: hidden;
}

input.searchStyle,
input.fake-filter-empty,
.table-filter-empty,
.format-hint{
    font-style: italic;
}

/* Pdf form button
------------------------------------------------------------------*/

.pdf-button {
    float: left;
}

.pdf-button-next-line {
    margin-top: 15px;
}

/* List Application Tile
------------------------------------------------------------------*/

.ListApplicationButton {
    display: inline-block;
    font-size: 0;
    overflow: hidden;
    width: 16px;
    height: 16px;
    border: 1px solid;
    border-radius: 3px;
    cursor: pointer;
    margin-right: 3px;
}

button.ListApplicationButton {
    height: 18px;
    width: 18px;
}

.ListApplicationButton:active {
    border: 1px solid;
}

.timeHint {
    text-indent: -99999px;
    display: inline-block;
    height: 16px;
    width: 16px;
}

/*#filterList {
    border: 1px solid #DDD;
    margin: 10px;
}*/

/*#filterList #time {
    width: 70px;
}

#filterList .inline-button {
    padding: 0 20px;
    margin-right: 0px;
}*/

#workflowListTable,
#workflowListTable td {
    cursor: default;
}

.radioFilter {
    float: left;
    margin-top: 6px;
}

.dateFilter {
    float: right;
}

.tableList tr.ToRead td,
.tableList tr.approvedToRead td,
.tableList tr.deniedToRead td,
.tableList tr.ToRead td button,
.tableList tr.approvedToRead td button,
.tableList tr.deniedToRead td button,
.ui-listcontainer.ToRead,
.ui-listcontainer.approvedToRead,
.ui-listcontainer.deniedToRead,
.ui-listcontainer.ToRead button,
.ui-listcontainer.approvedToRead button,
.ui-listcontainer.deniedToRead button {
    font-weight: bold;
}

.tableList .actions {
    white-space: nowrap;
    text-align: right;
}

/* Time News List
------------------------------------------------------------------*/

.ui-fieldcontainer.time-news-list {
    padding-top: 5px;
}

.ui-fieldcontainer.time-news-list.extra-space {
    padding-top: 20px;
}

.time-news-list .terminal-message {
    padding-bottom: 10px;
}

.time-news-list .time-news-label,
.time-news-list .time-news-value {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.time-news-list .fieldlabel.fieldtitle {
    padding-top: 15px;
}

.time-news-list .time-news-label {
    padding: 5px 10px 0 65px;
    line-height: 31px;
}

.time-news-list .time-news-messageLabel1,
.time-news-list .time-news-messageLabel2 {
    padding: 5px 10px 0 65px;
    line-height: 20px;
}

.time-news-list .time-news-value,
.time-news-list .time-news-button {
    padding: 5px 10px;
}

.time-news-list .time-news-button .inline-button {
    width: 30px;
    text-align: center;
}

.time-news-list .time-news-button.GOOD .inline-button,
.time-news-list .time-news-button.WARN .inline-button,
.time-news-list .time-news-button.BAD .inline-button,
.time-news-list .time-news-button.DEFAULT .inline-button,
.time-news-list .time-news-button.detail .inline-button {
    width: auto;
    min-width: 30px;
}

.time-news-list .time-news-value {
    line-height: 31px;
}

.time-news-list table tr td.field {
    padding-left: 80px;
}

.application-next,
.application-prev,
.application-next-disabled,
.application-prev-disabled {
    display: inline-block;
    height: 24px;
    margin-right: 6px;
    margin-top: 3px;
    text-indent: -99999px;
    width: 16px;
    border: none;
    cursor: pointer;
}

.application-next-disabled {
    cursor: default;
}

.application-prev-disabled {
    cursor: default;
}

span.icon-checkedbox,
span.icon-uncheckedbox
{
    display: inline-block;
    padding-right: 6px;
    padding-left:30px;
    line-height: 30px;
    min-width: 30px;
    height: 30px;
}

span.icon-uncheckedbox {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: left center;
}

span.icon-checkedbox {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: left center;
}

span.icon-checkedradio,
span.icon-uncheckedradio
{
    display: inline-block;
    padding-right: 6px;
    padding-left:30px;
    line-height: 30px;
    min-width: 30px;
    height: 30px;
}

span.icon-uncheckedradio {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: left center;
}

span.icon-checkedradio {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: left center;
}

/* DailyLedger
------------------------------------------------------------------*/
#management-dailyLedgerPanel label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

a.ledgerTab,
span.ledgerTab {
    border: 1px solid;
    padding: 11px;
    border-radius: 0 0 0 4px;
}

a.ledgerSecondTab,
span.ledgerSecondTab {
    border: 1px solid;
    padding: 11px;
    border-radius: 0 0 0 4px;
    cursor: default;
}

a.ledgerTab.shownAsSecond,
a.ledgerTab.tabSelected,
span.ledgerTab.tabSelected {
    border-radius: 0 0 4px 4px;
}

a.ledgerTab.tabSelected,
span.ledgerTab.tabSelected {
    cursor: default;
}

a.ledgerTab.shownAsSecond {
    border-radius: 0 0 0 4px;
}

a.ledgerTab.secondTab {
    border-radius: 0 0 4px 0;
}

a.ledgerTab.secondTab.open-tab-link {
    font-size: 19px;
    color: blue;
    font-weight: bold;
    padding: 7px;
}

a.ledgerTab.secondTab.close-tab-link {
    font-size: 14px;
    color: rgb(252,141,141);
    font-weight: bold;
    padding:10px;
}

.geoicon:focus {
    border: 1px solid;
}

div.controlButtons {
    padding-top: 25px;
}

div.controlButtons.load {
    /*padding-left: 54px;*/

}

.ledgerTabBorder {
    border:1px solid;
}

.boxBorder {
    border: 1px solid;
}

.formRow {
    padding: 2px 0;
}

div.bottomItem {
    padding-bottom: 10px;
}

/* Control Area
------------------------------------------------------------------*/
.controlArea {
    min-width: 890px;
    max-width: 1200px;
}

/*.ui-small .ui-fieldcontainer.controlAreaTop {
    padding-top: 35px;
}*/

#dailyledger-controlArea-previousDay,
#dailyledger-controlArea-previousEmployee {
    margin: 28px 0 0 9px;
}

#dailyledger-controlArea-nextDay,
#dailyledger-controlArea-nextEmployee {
    margin: 28px 0 0 10px;
}

#dailyledger-controlArea-bankHolidayName {
    color: red;
    font-size: 15px;
    margin-left: -10px;
    padding-top: 28px;
}

/* Results tab
------------------------------------------------------------------*/
.resultsTab {
    /*width: 890px;*/
}

.resultsTab table {
    width:100%;
}

#tableResultsRightArea {
    table-layout: fixed;
}

#tableResultsRightArea th {
    border: 1px solid;
}

#dailyledger-tableAbsenceReasonActual,
#dailyledger-tableBonuses,
#dailyledger-tableCreditAccount,
#dailyledger-tableAccountStatement{
    border: 1px solid;
}

#tableResultsRightArea tr {
    text-align: center;
    height: 29px;
}

#tableResultsRightArea td {
    width: 16.6%;
    padding: 0 3px;
    border: 1px solid;
}

#tableResultsRightArea tr.inputTr td {
    border: none;
}

#tableResultsRightArea tr.inputTr td input.textfield {
    text-align: right;
    padding-right: 5px;
}

td.balance {
    min-width: 55px;
}

/* Daily Ledger - Exceptions tab
------------------------------------------------------------------*/
.exceptionsTab {
    width: 960px;
}

.exceptionsTab .check {
    height: 25px;
    line-height: 25px;
}

.centerBox {
    height: 100px;
}

/*.ExceptionsTab ui-suggestion span {
    width:18px;
    background-position: -4px 1px;
}

.ExceptionsTab .formfield {
    padding-left: 3px;
}*/

/* Daily Ledger - Bookings tab
------------------------------------------------------------------*/

.bookingsTab {
    min-width: 900px;
}

.bookings-tableformat {
    min-width: 730px;
}

#bookings-table tr.edited {
    font-weight: bold;
}

#bookings-table td.edited {
    font-weight: bold;
}

#dailyledger-bookingsForm-form {
    min-width: 500px;
}

/* Daily Ledger - intervals tab
------------------------------------------------------------------*/

.intervalsTab {
    min-width: 800px;
}

/* Daily Ledger - Bonus intervals tab
------------------------------------------------------------------*/

.bonusIntervalsTab {
    width: 800px;
}

/* Daily Ledger - On Call Duty tab
------------------------------------------------------------------*/

/*.onCallDutyTab {
    min-width: 400px;
}*/

.summarizedResultsTab,
.bonusesTab,
.accountsTab {
    min-width: 800px;
}

/* Generic table's element rules
------------------------------------------------------------------*/

table tr td.text {
    text-align: left !important;
}

table tr td.number {
    text-align: right !important;
    white-space: nowrap;
}

table tr td.numberInfo {
    /*    text-align: right !important;    */
    white-space: nowrap;
}

table tr td.boolean {
    text-align: center !important;
}

table tr td.time {
    text-align: right !important;
    white-space: nowrap;
}

table tr td.dateAndOrTime {
    text-align: right !important;
    white-space: nowrap;
}

table tr td.dateAndOrTimeInfo {
    /*text-align: right !important;*/
    white-space: nowrap;
}

table tr td.email {
    text-align: left !important;
    white-space: nowrap;
}

td.orderUp a.arrow-up,
td.orderDown a.arrow-down,
td.orderUp button.arrow-up,
td.orderDown button.arrow-down {
    cursor: pointer;
    border: none;
    padding: 0;
    margin: 0;
    text-indent:-99999px;
    background:none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    display: inline-block;
    height: 17px;
    width: 17px;
    text-align: center;
    vertical-align: middle;
}

td.orderUp a.arrow-down.hover,
td.orderUp a.arrow-up.hover,
td.orderUp a.arrow-down.focus,
td.orderUp a.arrow-up.focus,
td.orderUp button.arrow-down.hover,
td.orderUp button.arrow-up.hover,
td.orderUp button.arrow-down.focus,
td.orderUp button.arrow-up.focus {
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.currentYearHeader,
.currentMonthHeader,
.datesHeader{
    border-left-width: 1px !important;
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 0px !important;
    border-color: transparent !important;

    line-height: 34px;
}

.currentYearHeader {
    min-width: 90px !important;
}

.currentMonthHeader {
    min-width: 120px !important;
}

.buttonLink {
    background-color: transparent;
    border: medium none;
    cursor: pointer;
}

/* Defining style of geographic map.
------------------------------------------------------------------*/

.geographicmap {
    width: 250px;
    height: 210px;
    margin: 20px 0 0;
    padding: .5em;
    border: 1px solid;
}

button.geoicon,
a.geoicon {
    text-indent: -99999px;
    display: inline-block;
    height: 55px;
    width: 55px;
    border: 2px solid;
}

.olControlAttribution {
    bottom: 0.5em !important;
    right: 0.5em !important;
}

/* Monthly Ledger style
------------------------------------------------------------------*/

#personalMonthlyledger-controlArea .application-next,
#personalMonthlyledger-controlArea .application-prev,
#supervisorMonthlyledger-controlArea .application-next,
#supervisorMonthlyledger-controlArea .application-prev {
    margin: 3px 10px 0;
}

/* Summarized Times Tab style
------------------------------------------------------------------*/

#personalMonthlyledger-timesTab .infoTable,
#supervisorMonthlyledger-timesTab .infoTable {
    border-collapse: collapse;
}

#personalMonthlyledger-timesTab .preheader,
#supervisorMonthlyledger-timesTab .preheader {
    border: none;
    padding: 0;
}

#personalMonthlyledger-timesTab .preheader td,
#supervisorMonthlyledger-timesTab .preheader td {
    height: auto;
    padding: 0;
}

#personalMonthlyledger-timesTab .infoTable td,
#supervisorMonthlyledger-timesTab .infoTable td {
    border: none;
    padding-bottom: 3px;
}

#personalMonthlyledger-timesTab .infoTable td div,
#supervisorMonthlyledger-timesTab .infoTable td div {
    margin-left: 4px;
    margin-right: 0;
}

/* Summarized Results Tab style
------------------------------------------------------------------*/

#personalMonthlyledger-summarizedResultsTab .summarizedResultsTab,
#supervisorMonthlyledger-summarizedResultsTab .summarizedResultsTab {
    width: 900px;
}

.infoTable {
    width: 100%;
}

.infoTable thead th {
    padding: 3px;
}

.infoTable tbody td {
    padding: 1px;
}

.infoTable .padded {
    padding-left: 20px;
}

.infoTable .valueField-1 {
    width: 70px;
}

.infoTable .valueField-2 {
    width: 110px;
}

.infoTable .valueField-1 div,
.infoTable .valueField-2 div {
    margin: 0 2px;
    padding: 3px;
    height: 16px;
    line-height: 16px;
}

/* Bonuses Tab style
------------------------------------------------------------------*/

/* Account Statements Tab Style
------------------------------------------------------------------*/

/*  Times Tab
----------------------------------------------------------------*/

.absenceIntervalsTabListWrapper {
    width: 550px;
}

.absenceIntervalsTabList {
    min-width: 550px;
}

.timesTabList {
    min-width: 1200px;
    width: 100%;
}

.absenceIntervalsTabList,
.timesTabList {
    font-size: 14px;
    border-spacing: 0;
    padding: 1px;
    border-collapse: collapse;
}

.ui-small .absenceIntervalsTabList,
.ui-small .absenceIntervalsTabList button,
.ui-small .timesTabList,
.ui-small .timesTabList button {
    font-size: 12px;
}

.absenceIntervalsTabList > thead > tr > th,
.timesTabList > thead > tr > th {
    cursor: pointer;
    padding: 0 3px;
    height: 31px;
    background-position: right center;
    background-repeat: no-repeat;
    border: 1px solid;
}

.absenceIntervalsTabList > thead > tr > th.table-sorting-disabled,
.timesTabList > thead > tr > th.table-sorting-disabled {
    cursor: default;
}

.absenceIntervalsTabList > tbody > tr > td,
.timesTabList > tbody > tr > td {
    padding: 0 3px;
    cursor: pointer;
    border: 1px solid;
}

.absenceIntervalsTabList > tfoot > tr > td,
.timesTabList > tfoot > tr > td {
    padding: 0 3px;
    cursor: default;
    border: none;
}

/*.timesTabList th.bookingsedition, .tableList td.bookingsedition {
    padding: 0px;
    cursor: pointer;
    border: 1px solid #FFFFFF;
    min-width: 50px;
}*/

.absenceIntervalsTabList td em,
.timesTabList td em {
    cursor: default;
}

.absenceIntervalsTabList a,
.absenceIntervalsTabList a:visited,
.timesTabList a,
.timesTabList a:visited {
    text-decoration: none;
}

.table-body-wrapper .absenceIntervalsTabList,
.table-footer-wrapper .absenceIntervalsTabList,
.table-body-wrapper .timesTabList,
.table-footer-wrapper .timesTabList {
    border-top: 0;
}

.absenceIntervalsTabList .ui-suggestion-list,
.timesTabList .ui-suggestion-list {
    min-width: 200px;
}

.tableList td.edited > a,
.tableList td.edited > span,
.tableList td.edited > button,
.tableList tr.edited > td > a,
.tableList tr.edited > td > span,
.tableList tr.edited > td > button,
.tableList tr.edited > td > button,
.absenceIntervalsTabList td.edited > button,
.timesTabList td.edited > button,
#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable td.edited > a,
#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable td.edited > span,
#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr.edited > td > a,
#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr.edited > td > span,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable td.edited > a,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable td.edited > span,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr.edited > td > a,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr.edited > td > span,
#personalMonthlyledger-timesTab-timesTable td.edited > a,
#personalMonthlyledger-timesTab-timesTable td.edited > span,
#personalMonthlyledger-timesTab-timesTable tr.edited > td > a,
#personalMonthlyledger-timesTab-timesTable tr.edited > td > span,
#supervisorMonthlyledger-timesTab-timesTable td.edited > a,
#supervisorMonthlyledger-timesTab-timesTable td.edited > span,
#supervisorMonthlyledger-timesTab-timesTable tr.edited > td > a,
#supervisorMonthlyledger-timesTab-timesTable tr.edited > td > span {
    font-weight: bold;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table > tbody > tr > td,
#personalMonthlyledger-timesTab-timesTable_table > tbody > tr > td {
    border-top: 0px;
    border-bottom: 0px;
    height: 24px;
}

#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table > tbody > tr > td,
#supervisorMonthlyledger-timesTab-timesTable_table > tbody > tr > td {
    border-top: 0px;
    border-bottom: 0px;
    height: 31px;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr td.firstBorder,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr td.firstBorder,
#personalMonthlyledger-timesTab-timesTable tr td.firstBorder,
#supervisorMonthlyledger-timesTab-timesTable tr td.firstBorder {
    border-right: 0px;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr td.lastBorder,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr td.lastBorder,
#personalMonthlyledger-timesTab-timesTable tr td.lastBorder,
#supervisorMonthlyledger-timesTab-timesTable tr td.lastBorder {
    border-left: 0px;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr td.middleNoBorder,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tr td.middleNoBorder,
#personalMonthlyledger-timesTab-timesTable tr td.middleNoBorder,
#supervisorMonthlyledger-timesTab-timesTable tr td.middleNoBorder {
    border-left: 0px;
    border-right: 0px;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tbody tr,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable tbody tr,
#personalMonthlyledger-timesTab-timesTable tbody tr,
#supervisorMonthlyledger-timesTab-timesTable tbody tr {
    height: 24px;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table > tbody tr:last-child td,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table > tbody tr:last-child td,
#personalMonthlyledger-timesTab-timesTable_table > tbody tr:last-child td,
#supervisorMonthlyledger-timesTab-timesTable_table > tbody tr:last-child td {
    border-bottom: 1px solid;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table.absenceIntervalsTabList tr td.sumCell,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table.absenceIntervalsTabList tr td.sumCell,
#personalMonthlyledger-timesTab-timesTable_table.timesTabList tr td.sumCell,
#supervisorMonthlyledger-timesTab-timesTable_table.timesTabList tr td.sumCell {
    font-weight: bold;
    border: 1px solid;
}

#personalMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table.absenceIntervalsTabList .checkfield-fakecheckbox,
#supervisorMonthlyledger-absenceIntervalsTab-absenceIntervalsTable_table.absenceIntervalsTabList .checkfield-fakecheckbox,
#personalMonthlyledger-timesTab-timesTable_table.timesTabList .checkfield-fakecheckbox,
#supervisorMonthlyledger-timesTab-timesTable_table.timesTabList .checkfield-fakecheckbox {
    height: 24px;
    width: 24px;
}

/* Timepicker
------------------------------------------------------------------*/

.ui-timepicker-wrapper {
    position: relative;
}

.ui-timepicker {
    position: absolute;
    margin-top: 5px;
    width: 100%;
    z-index: 201;
    min-width: 212px;
}

.ui-timepicker h2 {
    text-align: left;
    font-size: 12px;
}

.ui-timepicker-title {
    padding: 5px;
    font-size: 15px;
    text-align: center;
    border-top-left-radius: 0.4em;
    border-top-right-radius: 0.4em;
    border-top: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
}
.ui-timepicker-view {
    padding: 5px;
    text-align: center;
    border-left: 1px solid;
    border-right: 1px solid;
}

.ui-timepicker-footer {
    padding: 5px;
    text-align: center;
    border-bottom-left-radius: 0.4em;
    border-bottom-right-radius: 0.4em;
    border-bottom: 1px solid;
    border-left: 1px solid;
    border-right: 1px solid;
}

.ui-timepicker-footer-top {
    padding: 0 0 5px;
}

.ui-timepicker-footer a.inline-button {
    width: 45px;
    font-size: 12px;
}

/* To set analog clock image background (127px):
   background-image:url(../images/background/clock-background.png);
*/
#ui-timepicker-canvas {
    background-repeat:no-repeat;
    background-position:center;
}

.timepicker a.inline-button {
    width: 45px;
}

.ui-timepicker-time {
    width: 55px;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 2px;
}

.ui-timepicker-up,
.ui-timepicker-down {
    padding: 0;
    margin: 0;
    text-indent:-99999px;
    background:none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    display: inline-block;
    height: 17px;
    width: 17px;
    text-align: center;
    vertical-align: middle;
}

.ui-timepicker-down.hover,
.ui-timepicker-up.hover,
.ui-timepicker-down.focus,
.ui-timepicker-up.focus {
    background: none;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    border:none;
}

.ui-timepicker .field, .ui-timepicker .buttons {
    display: inline-block !important;
    vertical-align: top;
    word-spacing: normal;
}

/* Monthly ledger
------------------------------------------------------------------*/

/* Control area */

/* Label inside a datefield - I */
#supervisorMonthlyledger-controlArea .settlement-period .inner-label,
#personalMonthlyledger-controlArea .settlement-period .inner-label {
    position:absolute;
    margin-top: 5px;
    margin-left: 4px;
    margin-right: 0px;
    z-index: 201;
}

#supervisorMonthlyledger-controlArea .settlement-period .inner-label label,
#personalMonthlyledger-controlArea .settlement-period .inner-label label {
    float: left;
}

/*#supervisorMonthlyledger-controlArea .settlement-period .ui-datefield .textfield,
#personalMonthlyledger-controlArea .settlement-period .ui-datefield .textfield {
    padding-left: 37px;
}

#supervisorMonthlyledger-controlArea .settlement-period input.padded,
#personalMonthlyledger-controlArea .settlement-period input.padded {
    padding-left: 37px;
}*/

/* Label inside a datefield - F */

#monthlyledger-controlArea-form .label-employee {
    margin-right: 5px;
}

#monthlyledger-controlArea-form .buttons-area .button {
    width: 100px;
}

#monthlyledger-controlArea-form .content-area label {
    margin-right: 5px;
}

#monthlyledger-controlArea-form .content-area .ui-datefield {
    width: 130px;
}

/* Previous and Next buttons */
span.icon-prev, span.icon-next {
    margin-top: 0px;
}

.icon-next,
.icon-prev,
.icon-prev-disabled,
.icon-next-disabled {
    display: inline-block;
    height: 25px;
    text-indent: -99999px;
    width: 17px;
}

/* DIV Pencil Pointer Style */

.pencil-pointer {
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
}

/* TABS */


.ui-tabs-group {
    border: 1px solid;
    margin: 10px;
    padding-bottom: 20px;
}

.ui-tab {
    font-size: 17px;
    float: left;
    padding: 11px;
    border-radius: 0 0 4px 4px;
    border: 1px solid;
    background-image: none;
    cursor: pointer;
}

.ui-tab:hover {
    border: 1px solid;
}

.ui-tab-active {
    font-size: 17px;
    float: left;
    font-weight: bold;
    padding: 11px;
    border-radius: 0 0 4px 4px;
    border: 1px solid;
}

.ui-tabs {
    clear: both;
}

/* WRAPPING TABS */

.ui-wrapping-tab-primary {
    margin-top: -1px;
    float: left;
    font-weight: bold;
    padding: 11px;
    border-radius: 0 0 4px 4px;
    border: 1px solid;
    font-size: 13px;
}

.ui-wrapping-tab,
.ui-wrapping-tab-secondary-open {
    margin-top: -1px;
    float: left;
    padding: 11px;
    border-radius: 0 0 0 4px;
    border: 1px solid;
    background-image: none;
    cursor: pointer;
    font-size: 13px;
}

.ui-wrapping-tab:hover {
    border: 1px solid;
}

.ui-wrapping-tab-secondary-open {
    cursor: default;
}

.ui-wrapping-tab-open,
.ui-wrapping-tab-close {
    margin-top: -1px;
    float: left;
    padding: 11px;
    border-radius: 0 0 4px 0;
    border: 1px solid;
    cursor: pointer;
    width: 40px;
}

.ui-wrapping-tab-open:hover,
.ui-wrapping-tab-close:hover {
    border: 1px solid;
}


.ui-wrapping-tab-open {
    font-size: 18px;
    font-weight: bold;
    padding: 8px 11px;
}
.ui-wrapping-tab-close {
    font-size: 13px;
    font-weight: bold;
}

.ui-wrapping-tab-secondary {
    margin-top: -1px;
    float: left;
    font-weight: bold;
    padding: 11px;
    border-radius: 0 0 0 4px;
    border: 1px solid;
    font-size: 13px;
}

.ui-wrapping-tabs {
    clear: both;
}


/* SELECTION COMPONENT */

.ui-selection-component {
    width: 300px;
}

.ui-selection-toolbar {
    float: left;
    width: 40px;
    margin-right: 3px;
}

.ui-selection-table {
}

.ui-selection-cell-1 {
}

.ui-selection-cell-2 {
    width: 200px;
}

.ui-selection-cell-3 {
    width: 50px;
}

.ui-selection-cell-3.format-right input {
    text-align:right;
    padding-right: 4px;
}

.ui-selection-remaining {
    float: right;
    width: 50px;
}

/* SORTING COMPONENT */

.ui-sorting-component {
    min-width: 400px;
}

.ui-sorting-toolbar {
    float: left;
    width: 40px;
    margin-right: 3px;
}

.ui-sorting-table {
    /* border: 2px solid #E0E0E0;*/
}


/* CHECKBOXLIST COMPONENT */

.ui-checkboxlist-component {
    min-width: 220px;
}

.ui-checkboxlist-table {
    border: 2px solid;
    border-collapse: collapse;
}

.ui-checkboxlist-cell-1 {
    width: 30px;
    text-align: center;
    border-right: 2px solid;
}

.ui-checkboxlist-cell-2 {
    padding: 0 5px;
    min-width: 100px;
    text-align: left;
}

.ui-checkboxlist-component td.checkboxlistlabel {
    text-align: center !important;
    padding: 2px 0;
}

/* F3Table component */

.ui-f3Table {
    max-height: 250px;
    overflow: auto;
}

/* ICONS */

.icon-plus,
.icon-minus,
.icon-first,
.icon-up,
.icon-down,
.icon-last,
.icon-refresh,
.icon-az-sort,
.icon-za-sort {
    display: inline-block;
    height: 16px;
    width: 16px;
    text-indent: -99999px;
}

textarea {
    width: 100%;
    height: 200px !important;
    resize: none;
}

.componentBorder {
    border: 1px solid;
    padding: 5px;
}

.nowrap {
    white-space: nowrap;
}

#calendar-newTimeApplicationListForm-table_table td.edited > button {
    font-weight: bold;
}


/* HELP */

div#helpButton a .help-icon {
    background-size: 48px !important;
}

div#helpButton,
div.help-icon {
    position: fixed;
    bottom: 5px;
    width: 48px;
    height: 48px;
    cursor: pointer;
    z-index: 201;
}

div.help-icon.help-right {
    right: 5px;
}

div.help-icon.help-left {
    left: 5px;
}

div#helpDialog {
    border-top-left-radius: 0.6em;
    border-top-right-radius: 0.6em;
    border-bottom-left-radius: 0.6em;
    border-bottom-right-radius: 0.6em;
    position: fixed;
    z-index: 1100;
    border:1px solid #808080;
    padding:6px;
    width: 80%;
    height: 60%;
    min-width: 320px;
    min-height: 240px;
}

div#helpDialog div.title {
    cursor: move;
    position: absolute;
    height: 24px;
    font-size: 14px;
    font-weight: bold;
    z-index: 1100;
    background-color: transparent;
}

div#helpDialog div.resizeArea{
    position: absolute;
    width : 24px;
    height: 15px;
    background-color: transparent;
    bottom: 1px;
    right : 1px;
    cursor: nw-resize;
    text-indent: -99999px;
}

div#helpDialog div.closeDiv,
div#helpDialog div.maximizeDiv {
    position: relative;
    width : 36px;
    height: 36px;
    background-color: transparent;
    bottom: 5px;
    right : -7px;
    /*cursor: default;*/
    text-indent: -99999px;
}

div#helpDialog div.close-icon,
div#helpDialog div.maximize-icon,
div#helpDialog div.restore-icon {
    width: 24px;
    height: 24px;
    cursor: pointer;
}

div#helpDialog div.maximize-icon,
div#helpDialog div.restore-icon {
    background-position: 4px 4px;
}

#info-infoOverView-pdaInfoOverviewTable, #info-infoOverView-infoBaseDataTable,
#info-pdaInfoDetail-pdaInfoOverviewTable, #info-pdaInfoDetail-infoBaseDataTable,
#info-timeInfoDetail-pdaInfoOverviewTable, #info-timeInfoDetail-infoBaseDataTable,
#management-pdaInfo-pdaInfoOverviewTable, #management-pdaInfo-infoBaseDataTable,
#management-pdaInfoDetails-pdaInfoOverviewTable, #management-pdaInfoDetails-infoBaseDataTable,
#management-timeInfoDetails-pdaInfoOverviewTable, #management-timeInfoDetails-infoBaseDataTable {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:normal;
}

/*.currentDateButton {
    font-size: 12px;
    width: 90%;
    margin: 0px auto;
    border: 0px !important;
    border-color: transparent;
    text-overflow: ellipsis;
}*/

/* Printing info - Printed by ... */

#printing-info {
    display: none;
}

/* AJAX LOADIG ICON */
/*.loading-icon {
    border: solid 1px;
    position: absolute;
    width: 50px;
    height: 50px;
    text-align: center;
    z-index: 2001;

    top: 50%;
    left: 50%;
    margin-left: -35px;
    margin-top: -35px;

    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.loading-icon .loading-animation {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -25px;
    margin-top: -25px;
}*/

/* Openlayer 3 */

.ui-small .ol-attribution.ol-uncollapsible img {
    margin-top: 2px;
    max-height: 10px;
}

/*
-- GEOLOCATION  --------------------------------------------------------*/

.geolocation-dock label {
    float: left;
}

.geolocation-dock span {
    font-weight: bold;
    margin-left: 10px;
    line-height: 27px;
}

.geolocation-no {
    padding: 2px 7px;
    border-radius: 6px;
}

/* Tile.
------------------------------------------------------------------*/

.tile-collapsed {
    width: 13px;
    overflow: hidden;
    display: block;
}

.tile-spliter {
    position: relative;
}

.tile-spliter-button {
    position: absolute;
    right: 0px;
    top: 50px;
    z-index: 1;
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-left: 1px solid;
    width: 10px;
    height: 40px;
    border-radius: 4px 0 0 4px;
}

.tile-icon-collapse,
.tile-icon-expand {
    display: block;
    position: absolute;
    left: -5px;
    top: 0px;
    width: 20px;
    height: 40px;
    cursor: pointer;
}

/* Scrollbar buttons
------------------------------------------------------------------*/

#ui-scroll {
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 9998;
    height: 48px;
    background-color: #F6F6F6;
    border-top: 1px solid #C8C9CB;
    border-left: 1px solid #C8C9CB;
    border-radius: 5px 0 0 0;
    background: -webkit-gradient(linear, center top, center bottom, from(#F6F6F6), to(#C8C9CB) );
}

#ui-scroll .ui-scroll-first,
#ui-scroll .ui-scroll-previous,
#ui-scroll .ui-scroll-next,
#ui-scroll .ui-scroll-last {
    display: inline-block;
    padding: 0 5px;
    height: 48px;
    min-width: 56px;
    font-size: 20px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #B4B9BE;
    text-align: center;
    line-height: 48px;
    color: #030469;
    cursor: pointer;
}

#ui-scroll .ui-scroll-first,
#ui-scroll .ui-scroll-previous,
#ui-scroll .ui-scroll-next {
    border-right: 1px solid #C8C9CB;
}

#ui-scroll .ui-scroll-previous {
    background: url(../images/icons/scroll-up.png) no-repeat scroll center center;
}

#ui-scroll .ui-scroll-next {
    background: url(../images/icons/scroll-down.png) no-repeat scroll center center;
}

body.ui-scroll-visible .ui-page {
    padding-bottom: 48px;
}

body.ui-scroll-visible .ui-dialog-wrapper-inner .ui-footer {
    padding-bottom: 56px;
}

#ui-scroll .ui-scroll-bar {
    position: fixed;
    top: 0;
    right: 2px;
    width: 6px;
    height: 0;
    background-color: #aaa;
    box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
    border-radius: 3px;
}

/* Pagination buttons
------------------------------------------------------------------*/

.table-pagination {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9998;
    height: 48px;
    background-color: #F6F6F6;
    border-top: 1px solid #C8C9CB;
    border-right: 1px solid #C8C9CB;
    border-radius: 0 5px 0 0;
    background: -webkit-gradient(linear, center top, center bottom, from(#F6F6F6), to(#C8C9CB) );
}

.table-pagination span {
    display: inline-block;
    padding: 0 5px;
    height: 48px;
    min-width: 56px;
    font-size: 20px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #B4B9BE;
    text-align: center;
    line-height: 48px;
    color: #030469;
    cursor: pointer;
    border-right: 1px solid #C8C9CB;
}

.table-pagination .table-pagination-next {
    border-right: none;
}

.table-pagination span.table-pagination-disabled {
    color: #C0C0C0;
}


/* Screen Keyboard.
------------------------------------------------------------------*/

.ui-keyboard {
    position: fixed;
    display: block;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #222;
    padding: 1px;
    min-height: 32px;
    z-index: 9999;
}

.ui-keyboard-ar {
    direction: ltr;
}

.ui-keyboard-line {
    display: block;
    text-align: center;
    white-space: nowrap;
}

.ui-keyboard-key {
    display: inline-block;
    width: 56px;
    height: 42px;
    background-color: #555;
    margin: 2px;
    line-height: 42px;
    font-weight: bold;
    font-size: 24px;
    border-radius: 5px;
    color: white;
    box-shadow: 0 -1px #777;
    cursor: pointer;
}

.ui-keyboard-key-pressed {
    color: #333;
    background-color: #CCC;
}

.ui-keyboard-key span {
    width: 56px;
    height: 42px;
    display: inline-block;
    box-shadow: inset 0 -1px 1px #444;
    border-radius: 5px;
}

.ui-keyboard-secondary {
    position: absolute;
    background-color: #111;
    padding: 5px;
    top: 0px;
    left: 0px;
    width: 100%;
    display: table;
}


.ui-keyboard-shift span {
    background: url(../images/icons/keyboard-shift.png) no-repeat scroll center center;
}

.ui-keyboard-shift span.ui-keyboard-key-pressed {
    background: url(../images/icons/keyboard-shift-pressed.png) no-repeat scroll center center #CCC;
}

.ui-keyboard-del span {
    background: url(../images/icons/keyboard-backspace.png) no-repeat scroll center center;
}

.ui-keyboard-del span.ui-keyboard-key-pressed {
    background: url(../images/icons/keyboard-backspace-pressed.png) no-repeat scroll center center #CCC;
}

.ui-keyboard-intro span.icon {
    background: url(../images/icons/keyboard-enter.png) no-repeat scroll center center;
    width: 20px;
    height: 50px;
    margin-right: 2px;
    box-shadow: none;
}

.ui-keyboard-intro span.text {
    font-size: 14px;
    width: 20px;
    box-shadow: none;
}

.ui-keyboard-intro span.ui-keyboard-key-pressed {
    background: url(../images/icons/keyboard-enter-pressed.png) no-repeat scroll center center #CCC;
}

.ui-keyboard-space span {
    background: url(../images/icons/keyboard-space.png) no-repeat scroll center center;
}

.ui-keyboard-space span.ui-keyboard-key-pressed {
    background: url(../images/icons/keyboard-space-pressed.png) no-repeat scroll center center #CCC;
}

.ui-keyboard-del {

}

.ui-keyboard-sym {

}

.ui-keyboard-space,
.ui-keyboard-space span {
    width: 220px;
}

.ui-keyboard-intro {

}

.ui-keyboard-shift.ui-keyboard-uppercase {
    background-color: #333;
    box-shadow: 0px -1px #222;
}

.ui-keyboard-shift.ui-keyboard-uppercase span {
    box-shadow: 0px -1px 1px #666 inset;
}

.ui-keyboard-bar {
    right: 0px;
    top: 0px;
}

.ui-keyboard-text {
    display: block;
    width: calc(100% - 74px);
    background-color: rgb(255, 255, 255);
    padding-left: 8px;
    box-shadow: 0px 0px 3px #707070 inset;
    height: 32px;
    line-height: 32px;
    margin: 1px;
}

.ui-keyboard-minimize {
    position: absolute;
    right: 32px;
    top: 0;
    background: url(../images/icons/keyboard-minimize.png) no-repeat scroll center center;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.ui-keyboard-minimize.ui-keyboard-maximize {
    background: url(../images/icons/keyboard-maximize.png) no-repeat scroll center center;
}

.ui-keyboard-close {
    position: absolute;
    right: 0;
    top: 0;
    background: url(../images/icons/keyboard-close.png) no-repeat scroll center center;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

body.ui-keyboard-expanded .ui-page {
    padding-bottom: 264px;
}

body.ui-keyboard-collapsed .ui-page {
    padding-bottom: 32px;
}

body.ui-keyboard-expanded .ui-dialog-wrapper-inner .ui-footer {
    margin-bottom: 264px;
}

body.ui-keyboard-collapsed .ui-dialog-wrapper-inner .ui-footer {
    margin-bottom: 32px;
}

/* Textfield / Screen Keyboard
------------------------------------------------------------------*/

.ui-textfield,
.ui-integerfield,
.ui-floatfield,
.ui-ammountoftimefield-keyboard {
    position: relative;
}

.ui-textfield input,
.ui-integerfield input,
.ui-floatfield input,
.ui-ammountoftimefield-keyboard input {
    padding-right: 32px !important;
}

.ui-textfield span,
.ui-integerfield span,
.ui-floatfield span,
.ui-ammountoftimefield-keyboard span {
    display: block;
    position: absolute;
    right: 1px;
    top: 1px;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
}

.ui-small .ui-textfield span,
.ui-small .ui-integerfield span,
.ui-small .ui-floatfield span,
.ui-small .ui-ammountoftimefield-keyboard span {
    height: 24px;
    width: 24px;
}

.ui-textfield span,
.ui-integerfield span,
.ui-floatfield span,
.ui-ammountoftimefield-keyboard span {
    background: url(../images/icons/keyboard-icon-32.png) no-repeat scroll center center;
}

.ui-small .ui-textfield span,
.ui-small .ui-integerfield span,
.ui-small .ui-floatfield span,
.ui-small .ui-ammountoftimefield-keyboard span {
    background: url(../images/icons/keyboard-icon-24.png) no-repeat scroll center center;
}

/* Mobile table data
------------------------------------------------------------------*/

button.ListApplicationButton.mobileActionButton {
    height: 46px;
    width: 46px;
    background-repeat: no-repeat;
    background-position: center;
    border-color: #C8C9CB;
}

.actions.mobileActions {
    padding-top: 5px;
}

.ui-listcontainer-label,
.ui-listcontainer-value {
    display: inline-block;
    width: 50%;
}

.ui-listcontainer-label {
    font-weight: bold;
    vertical-align: top;
}

/* BOOKING LEDGER
------------------------------------------------------------------*/

#management-bookingLedger-bookingFilter > div:first-of-type,
#management-bookingLedger-bookingTypeFilter > div:first-of-type {
    width:66%;
}

#management-bookingLedger-deviceGroupFilter > div,
#management-bookingLedger-absenceReasonGroupFilter > div {
    width:33%;
}

#management-bookingLedger-bookingLedgerTable .tableList tr td button {
    white-space: nowrap;
}

/* MESSAGE DIALOG
------------------------------------------------------------------*/

.user-message-dalog {

}

.user-message-dalog .ui-dialog-wrapper-inner {
    width:650px;
}

.user-message-dalog .ui-dialog-header h1 {
    font-size: 20px;
}

.user-message-dalog .ui-dialog-content {
    color: black;
}

.user-message-dalog .user-message-header {
    font-size: 15px;
    font-weight: normal;
}

.user-message-dalog .user-message-content {
    padding-bottom: 10px;
}

/* Tile component
------------------------------------------------------------------*/

.ui-tile {
    display: table;
    margin: 0 6px 6px 0;
    border-radius: 0 0 4px 4px;
    box-shadow: 4px 4px 4px #666666;
    background-color: #EBEFF1;
    background-image: linear-gradient(to right, #EBEFF1 0%, #FFFFFF 10%, #FFFFFF 90%, #EBEFF1 100%);
}

/* Panel component
------------------------------------------------------------------*/

.ui-panel-width-1 {
    width: 320px;
}

.ui-panel-width-2 {
    width: 640px;
}

.ui-panel-width-3 {
    width: 960px;
}

.ui-panel-width-4 {
    width: 1280px;
}

.ui-cell-spacing {
    box-sizing: border-box;
    padding: 3px;
}

.ui-cell-spacing-2 {
    box-sizing: border-box;
    padding: 6px;
}

.ui-cell-spacing-3 {
    box-sizing: border-box;
    padding: 10px;
}

.ui-vertical-layout > * {
    clear: both;
}

.ui-horizontal-layout > * {
    display: inline-block !important;
    margin-right: 10px;
}

/* Panel component
------------------------------------------------------------------*/

.form-selection-list {
    width: 100%;
    border: 1px solid #CCC;
}

.form-selection-list button {
    text-align: left;
    display: block;
    width: 100%;
    border: none;
    background-color: transparent;
    cursor: pointer;
}

.form-selection-list button.form-selection-list-selected {
    background-color: #7690b4;
}

.form-selection-list button:focus,
.form-selection-list button.form-selection-list-selected:focus {
    background-color: yellow;
}

/* Info cells
------------------------------------------------------------------*/

.info-cells-container {
    float: left;
    padding: 15px;
}

.info-cells .label-cell {
    min-width: 150px;
    padding-right: 10px;
}

.info-cells .value-cell {
    min-width: 300px;
}

.info-cells .label-cell span,
.info-cells .value-cell span {
    height: 27px;
    line-height: 27px;
    white-space: nowrap;
}

.info-cells .label-cell span {
    font-weight: bold;
}

.info-cells .value-cell span {
    display: block;
    border: 1px solid #707070;
    padding: 0 8px;
    background-color: lightgray;
    box-shadow: 0 0px 3px #707070 inset;
    border-radius: 0.6em 0.6em 0.6em 0.6em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/* Pagination 2
------------------------------------------------------------------*/

.table-pagination2 {
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
    font-family: Arial, sans-serif;
    white-space: nowrap;
}

.table-pagination2 span.table-pagination2-first,
.table-pagination2 span.table-pagination2-previous,
.table-pagination2 span.table-pagination2-next,
.table-pagination2 span.table-pagination2-last,
.table-pagination2 button {
    display: inline-block;
    margin: 5px 5px 5px 0;
    width: 32px;
    height: 32px;
    line-height: 30px;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px 0 #B4B9BE;
    cursor: pointer;
    border: 1px solid #C8C9CB;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 2px 2px 2px #666666;
    font-size: 14px;
}

.table-pagination2 span.table-pagination2-first,
.table-pagination2 span.table-pagination2-previous,
.table-pagination2 span.table-pagination2-next,
.table-pagination2 span.table-pagination2-last {
    color: #666;
    background-image: none;
    background-color: lightgray;
    width: 30px;
    height: 30px;
    line-height: 32px;
    vertical-align: top;
}

.table-pagination2 button {
    color: #030469;
    background-image: linear-gradient(to bottom, #F6F6F6 0%, #C8C9CB 100%);
    background-color: #F6F6F6;
}

.table-pagination2 button:focus {
    border-color: yellow;
}

.table-pagination2 div.integerfield-wrapper {
    display: inline-block;
    width: 32px;
    height: 32px;
    vertical-align: top;
    margin: 5px 5px 5px 1px;
}

.table-pagination2 input.textfield {
    display: inline-block;
    width: 32px;
    height: 32px;
    text-align: center;
    padding: 0;
}

.table-pagination2 span.table-pagination2-total {
    display: inline-block;
    margin: 5px 5px 5px 0;
    height: 32px;
    line-height: 32px;
    font-size: 12px;
    vertical-align: top;
}

.table-pagination2-info {
    float: right;
    padding: 5px 0;
    font-size: 12px;
}

/* Orders overview
------------------------------------------------------------------*/

.orderOverviewTable tbody.selected {
    outline: 2px solid #7690b4;
}

.orderOverviewTable tbody.focus {
    outline: 3px solid yellow;
}

.orderOverviewTable tbody.ui-table-odd td {
    color: #000000;
    background-color: #DCE1E7;
    border-color: #F0F0F0;
}

.orderOverviewTable tr td {
    border: none;
    border-bottom: 1px dashed #EEE;
    border-left: 1px solid #EEE;
    border-right: 1px solid #EEE;
}

.orderOverviewTable tr td:first-child {
    border-left: 1px solid #FFF;
}

.orderOverviewTable tr td:last-child {
    border-right: 1px solid #FFF;
}

.orderOverviewTable tr:first-child td {
    border-bottom: 1px solid #DDD;
    border-top: 2px solid #BBB;
}

.orderOverviewTable tr:last-child td {
    border-bottom: 2px solid #BBB;
}

.orderOverviewTable .tableList tfoot:not(.table-scroll-footer) tr:first-child td {
    border-top: 2px solid #BBB;
}

#pdaInfoDetailsTile_controlPanel .boxMargin,
#pdaInfoDetailsTile4Supervisor .boxMargin {
    margin-top: 10px;
    margin-left: 16px;
}

#pdaInfoDetailsTile_controlPanel .boxMarginTop,
#pdaInfoDetailsTile4Supervisor .boxMarginTop {
    margin-top: 10px;
}

#pdaInfoDetailsTile_controlPanel .boxMarginLeft,
#pdaInfoDetailsTile_controlPanel .boxMarginLeft {
    margin-left: 16px;
}

.selection-table-component.tableList-scroll {
    height: 400px;
}

.button.employee-field-button-selected,
.button.multiselection-field-button-selected {
    background-color: yellow;
    background-image: none;
}

.employee-selection-list-text[readonly],
.multiselection-field-text[readonly] {
    background-color: #FFF;
}

/* Settings button
------------------------------------------------------------------*/

button.icon-settings,
button.icon-legend {
    border: none;
    cursor: pointer;
}

button.icon-settings:focus,
button.icon-legend:focus {
    height: 30px;
    width: 30px;
}

/*
************* Fixed width for some columns PDA Info dialogs *******************/

#DAY {
    min-width: 70px;
}

#TIME {
    min-width: 50px;
}

#COMPANY_NR,
#COMPANY_NAME {
    min-width: 150px;
}

#EMPLOYEE_NO {
    min-width: 90px;
}

#EMPLOYEE_NAME {
    min-width: 200px;
}

#BASIC_COSTCENTRE_NR,
#COSTCENTRE_NR,
#BASIC_COSTCENTRE_NAME,
#COSTCENTRE_NAME {
    min-width: 160px;
}

#ORDER_NR,
#ORDER_NAME {
    min-width: 160px;
}

/**** PDA Bookings ****/

#KENNUNG {
    min-width: 150px;
}

#PDA_MESSAGE {
    min-width: 150px;
}

/**** PDA Net times ****/

#NET_TIME,
#TOTAL_TIME {
    min-width: 125px;
}

#LAST_PDA_BOOKING {
    min-width: 120px;
}

#LAST_PDA_BOOKING_4_ORDER {
    min-width: 140px;
}

#TOTAL_TIME_4_ORDER,
#TARGET_TIME_4_ORDER,
#NET_TIME_4_ORDER {
    min-width: 130px;
}

/**** PDA Details ****/

#SUBSTITUTE_TIME,
#TOTAL_TIME_4_DETAILS {
    min-width: 125px;
}

#NET_TIME_WU,
#SUBSTITUTE_ TIME_WU,
#TOTAL_TIME_WU {
    min-width: 150px;
}

/**** PDA Order overview ****/

#STATUS_MESSAGE {
    min-width: 150px;
}

#TARGET_TIME,
#ACTUAL_TIME {
    min-width: 100px;
}

#TARGET_TIME_WU,
#ACTUAL_TIME_WU {
    min-width: 120px;
}

#DUE_DATE,
#TAGE {
    min-width: 150px;
}

#orderOverviewTile_orderOverviewTable .tableList th {
    min-width: 0 !important;
}

/********** Booking Ledger *********/

#BOOKING_OK {
    min-width: 80px;
}

#ABSENCE_REASON_NAME,
#ABSENCE_REASON_NR {
    min-width: 100px;
}

#pdaInfoBookingsTile4Supervisor_pdaInfoBookingsTable_table td:not(.comment) button,
#pdaInfoNetTimesTile4Supervisor_pdaInfoNetTimesTable_table td:not(.comment) button,
#pdaInfoDetailsTile4Supervisor_pdaInfoDetailsTable_table td:not(.comment) button,
#pdaInfoOrderOverviewBookingsTile_pdaInfoBookings4OrderTable_table td:not(.comment) button,
#orderOverviewTile_orderOverviewTable_table  td:not(.comment) button {
    white-space: nowrap;
}

/* Grouping
------------------------------------------------------------------*/

.tableList tr.table-group td {
    height: 31px;
    line-height: 31px;
    font-weight: bold;
    font-size: 15px;
}

/* Expanded table
------------------------------------------------------------------*/

.ui-expanded-table .FEHLGRD {
    min-width: 220px;
}

.ui-expanded-table .FROM_DAY,
.ui-expanded-table .TO_DAY {
    width: 150px;
}

.ui-expanded-table .FROM_CLOCK,
.ui-expanded-table .TO_CLOCK {
    width: 100px;
}

.ui-expanded-table .COMMENT {
}

.ui-expanded-table .ui-suggestion-list td {
    border: none;
}

#calendar-applicationPanel-expanded_table > tbody > tr > td.focus {
    outline: 2px solid rgb(244,236,105) !important;
}

#calendar-applicationPanel-expanded_table > tbody > tr > td.error {
    background-color: rgb(244,236,105) !important;
    background-image: none !important;
}

/* Pda Hours
------------------------------------------------*/

#pda-editPdaIntervalGrid-input_table > tbody > tr > td.focus {
    background-color: rgb(244,236,105) !important;
    background-image: none !important;
}

/* Time Correction
------------------------------------------------*/

#calendar-newTimeApplicationGrid-table_table {
    width: auto;
}

#calendar-newTimeApplicationGrid-table_table.tableList td.editing {
    padding: 0;
    position: relative;
}

#calendar-newTimeApplicationGrid-table_table.tableList td.editing > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

#calendar-newTimeApplicationGrid-table_table.tableList td.editing .ui-timefield > input,
#calendar-newTimeApplicationGrid-table_table.tableList td.editing .ui-suggestion > input,
#calendar-newTimeApplicationGrid-table_table.tableList td.editing input.textfield {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    outline: 1px solid yellow;
}

#calendar-newTimeApplicationGrid-table_table.tableList td.editing .ui-timefield > input:focus,
#calendar-newTimeApplicationGrid-table_table.tableList td.editing .ui-suggestion > input:focus,
#calendar-newTimeApplicationGrid-table_table.tableList td.editing input.textfield:focus {
    outline: 1px solid yellow !important;
}

#calendar-newTimeApplicationGrid-table_table #DAY_AND_LNR {
    min-width: 115px;
}

#calendar-newTimeApplicationGrid-table_table #COME_CLOCK,
#calendar-newTimeApplicationGrid-table_table #GO_CLOCK {
    width: 75px;
}

#calendar-newTimeApplicationGrid-table_table #COME_FG,
#calendar-newTimeApplicationGrid-table_table #GO_FG,
#calendar-newTimeApplicationGrid-table_table #ABSENCEREASON_SOLL_NR {
    width: 150px;
}

#calendar-newTimeApplicationGrid-table_table .COME_FG_cell,
#calendar-newTimeApplicationGrid-table_table .GO_FG_cell,
#calendar-newTimeApplicationGrid-table_table .ABSENCEREASON_SOLL_NR_cell {
    max-width: 150px;
}

#calendar-newTimeApplicationGrid-table_table .COME_FG_cell a,
#calendar-newTimeApplicationGrid-table_table .GO_FG_cell a,
#calendar-newTimeApplicationGrid-table_table .ABSENCEREASON_SOLL_NR_cell a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#calendar-newTimeApplicationGrid-table_table .COME_FG_cell span,
#calendar-newTimeApplicationGrid-table_table .GO_FG_cell span,
#calendar-newTimeApplicationGrid-table_table .ABSENCEREASON_SOLL_NR_cell span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#calendar-newTimeApplicationGrid-table_table #COME_KOMMENTAR,
#calendar-newTimeApplicationGrid-table_table #GO_KOMMENTAR {
    min-width: 100px;
}


#calendar-infoTimeApplication-original_table,
#calendar-infoTimeApplication-corrected_table,
#calendar-viewTimeApplication-original_table,
#calendar-viewTimeApplication-corrected_table,
#calendar-timeCorrectionApproval-original_table,
#calendar-timeCorrectionApproval-corrected_table {
    width: auto;
}

#calendar-infoTimeApplication-original_table #DAY,
#calendar-infoTimeApplication-corrected_table #DAY,
#calendar-viewTimeApplication-original_table #DAY,
#calendar-viewTimeApplication-corrected_table #DAY,
#calendar-timeCorrectionApproval-original_table #DAY,
#calendar-timeCorrectionApproval-corrected_table #DAY {
    min-width: 100px;
}

#calendar-infoTimeApplication-original_table #TIME_FROM_TO,
#calendar-infoTimeApplication-corrected_table #TIME_FROM_TO,
#calendar-viewTimeApplication-original_table #TIME_FROM_TO,
#calendar-viewTimeApplication-corrected_table #TIME_FROM_TO,
#calendar-timeCorrectionApproval-original_table #TIME_FROM_TO,
#calendar-timeCorrectionApproval-corrected_table #TIME_FROM_TO {
    min-width: 50px;
}

#calendar-infoTimeApplication-original_table #ABSENCEREASON_NR,
#calendar-infoTimeApplication-original_table #ABSENCEREASON_NAME,
#calendar-infoTimeApplication-original_table #FEHLGRD,
#calendar-infoTimeApplication-corrected_table #ABSENCEREASON_NR,
#calendar-infoTimeApplication-corrected_table #ABSENCEREASON_NAME,
#calendar-infoTimeApplication-corrected_table #FEHLGRD,
#calendar-viewTimeApplication-original_table #ABSENCEREASON_NR,
#calendar-viewTimeApplication-original_table #ABSENCEREASON_NAME,
#calendar-viewTimeApplication-original_table #FEHLGRD,
#calendar-viewTimeApplication-corrected_table #ABSENCEREASON_NR,
#calendar-viewTimeApplication-corrected_table #ABSENCEREASON_NAME,
#calendar-viewTimeApplication-corrected_table #FEHLGRD,
#calendar-timeCorrectionApproval-original_table #ABSENCEREASON_NR,
#calendar-timeCorrectionApproval-original_table #ABSENCEREASON_NAME,
#calendar-timeCorrectionApproval-original_table #FEHLGRD,
#calendar-timeCorrectionApproval-corrected_table #ABSENCEREASON_NR,
#calendar-timeCorrectionApproval-corrected_table #ABSENCEREASON_NAME,
#calendar-timeCorrectionApproval-corrected_table #FEHLGRD {
    min-width: 150px;
}

#calendar-infoTimeApplication-original_table .ABSENCEREASON_NAME_cell,
#calendar-infoTimeApplication-corrected_table .ABSENCEREASON_NAME_cell,
#calendar-viewTimeApplication-original_table .ABSENCEREASON_NAME_cell,
#calendar-viewTimeApplication-corrected_table .ABSENCEREASON_NAME_cell,
#calendar-timeCorrectionApproval-original_table .ABSENCEREASON_NAME_cell,
#calendar-timeCorrectionApproval-corrected_table .ABSENCEREASON_NAME_cell {
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#calendar-infoTimeApplication-original_table #COMMENT,
#calendar-infoTimeApplication-corrected_table #COMMENT,
#calendar-viewTimeApplication-original_table #COMMENT,
#calendar-viewTimeApplication-corrected_table #COMMENT,
#calendar-timeCorrectionApproval-original_table #COMMENT,
#calendar-timeCorrectionApproval-corrected_table #COMMENT {
    min-width: 100px;
}

#calendar-infoTimeApplication-original_table .ABSENCEREASON_NR_cell,
#calendar-infoTimeApplication-corrected_table .ABSENCEREASON_NR_cell,
#calendar-viewTimeApplication-original_table .ABSENCEREASON_NR_cell,
#calendar-viewTimeApplication-corrected_table .ABSENCEREASON_NR_cell,
#calendar-timeCorrectionApproval-original_table .ABSENCEREASON_NR_cell,
#calendar-timeCorrectionApproval-corrected_table .ABSENCEREASON_NR_cell,
#calendar-infoTimeApplication-original_table .ABSENCEREASON_SOLL_NR_cell,
#calendar-infoTimeApplication-corrected_table .ABSENCEREASON_SOLL_NR_cell,
#calendar-viewTimeApplication-original_table .ABSENCEREASON_SOLL_NR_cell,
#calendar-viewTimeApplication-corrected_table .ABSENCEREASON_SOLL_NR_cell,
#calendar-timeCorrectionApproval-original_table .ABSENCEREASON_SOLL_NR_cell,
#calendar-timeCorrectionApproval-corrected_table .ABSENCEREASON_SOLL_NR_cell {
    width: 45px;
}

.colorfield {
    float: left;
    height: 30px;
}

.textfield-small {
    float: left;
    max-width: 5%;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 2px;
}

/* Report settings
---------------------------------------------------------------------- */

#report-reportSettingsForm .ui-group-horizontal {
    word-spacing: 0;
}

/* Matrix tableau pagination
-----------------------------------------------------------------------*/
.pagination-container
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.pagination-button
{
    height: 90%;
    width: 20% !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-left: 10px !important;
    margin-right: 10px !important;
}

.pagination-button svg
{
    margin: auto;
}

.pagination-label
{
    font-weight: bold;
    font-size: 18px;
}

#paginated-tableau-page-number 
{
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
}