@charset "utf-8";

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-Regular.ttf') format('embedded-opentype');
}

@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Regular.ttf') format('embedded-opentype');
}

/*Use in_style.css*/
/*body, html {*/
/*background: #b6b7bc;*/
/*font-size: .85em;
    font-family: "Open Sans", "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    margin: 0;
    padding: 0;*/
/*height: 100%;*/
/*background-color: #d6d8d6;*/
/*scroll-behavior: smooth;
}*/

/*div a {
    color: #004efc;
    text-decoration: none;
}*/

.tblHead {
    height: 32px;
    padding: 3px;
    font-weight: bold;
}

/*.btn {
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 3px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid #c2c2c2;
    border-radius: 3px;
}*/

    .btn:focus,
    .btn:active:focus,
    .btn.active:focus,
    .btn.focus,
    .btn:active.focus,
    .btn.active.focus {
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

    .btn:hover,
    .btn:focus,
    .btn.focus {
        color: #333;
        text-decoration: none;
    }

    .btn:active,
    .btn.active {
        background-image: none;
        outline: 0;
        -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
        box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    }

.mobile .btn {
    font-size: 12px !important;
}

.btn-w80 {
    width: 80px;
}

/*.btnxs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}*/

/*img {
    max-width: 100%;
    height: auto;
}*/

/* HEADINGS
----------------------------------------------------------*/
.coyTitle {
    /*float: left;*/
    color: white;
    font-family: "Open Sans", Lucida Sans, Lucida Bright, Verdana, Georgia, Arial;
    font-size: 1.25em;
    font-weight: 600;
    padding-left: 10px;
}

.coyRptHdr {
    font-size: 1.2em;
    font-weight: bold;
    font-family: "Open Sans", Verdana, Georgia, Arial;
    /*padding: 10px;*/
}

.coyRptLbl {
    font-size: 9pt;
    font-weight: bold;
    font-family: "Open Sans", Verdana, Georgia, Arial;
    text-transform: uppercase;
}

.coyLogoSmall {
    background-image: url(../images/coylogosmall36.png?d=1);
    background-repeat: no-repeat;
    width: 48px;
    height: 48px;
    vertical-align: middle;
    padding-right: 4px;
}

/*
h1, h2, h4, h5, h6
{
	font-size: 1.5em;
	color: #666666;
	font-variant: small-caps;
	text-transform: none;
	font-weight: bold;
	margin-bottom: 0;
}*/

.fontTitle {
    font-size: 1.1em;
    font-weight: bold;
}

.fontTitle2 {
    font-size: 1.1em;
    font-weight: bold;
    color: hsl(34, 97%, 51%);
}

.fontTitle3 {
    font-size: 0.9em;
    font-weight: bold;
}

/*.fontCancel {
    color: #dc143c;
    font-style: italic;
}*/

.unlabel {
    font-weight: normal;
}

/* this rule styles <h1> and <h2> tags that are the
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2 {
    margin-top: 0;
}


/* PRIMARY LAYOUT ELEMENTS
----------------------------------------------------------*/
/*.page {*/
/* Footer down */
/*min-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}*/

.userId {
    font-size: 0.70em;
}

.contentDiv {
    /* footer height */
    position: relative;
}

/*.pageb4 {
    page-break-before: always;
}*/

.main {
    padding: 0 12px;
    margin: 12px 8px 8px 8px;
    min-height: 420px;
}

.footer {
    color: #4e5766;
    padding: 8px 0 0 0;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
    line-height: normal;
    /* height: 30px; This will cause the vertical scroll bar to appear */
    /* for fixed footer
	position: absolute; */
    bottom: 0;
    width: 100%;
    z-index: 99999;
}

/* TAB MENU
----------------------------------------------------------*/
/*
div.hideSkiplink
{
	background-color:#3a4f63;
	width:100%;
	height: 25px;
}*/

.omenu {
    float: right;
    /*position: absolute;
	top:20px;
	right:0px;
	margin: 10px;*/
    /*padding: 4px 0 4px 8px;*/
    /*overflow:visible;
	z-index: 2;*/
    padding: 10px 0 10px 0;
    font-size: 1.2em;
    font-weight: bold;
}

div.menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: auto;
}

    div.menu ul li a, div.menu ul li a:visited {
        background-color: #465c71;
        border: 1px #4e667d solid;
        color: #dde4ec;
        display: block;
        line-height: 1.35em;
        padding: 4px 20px;
        text-decoration: none;
        white-space: nowrap;
    }

        div.menu ul li a:hover {
            background-color: #bfcbd6;
            color: #465c71;
            text-decoration: none;
        }

        div.menu ul li a:active {
            background-color: #465c71;
            color: #cfdbe6;
            text-decoration: none;
        }

#selectList {
    position: relative;
    padding: 0;
    margin: 5px 0 auto 0;
}

/* FORM ELEMENTS
----------------------------------------------------------*/
/*
fieldset
{
	margin: 1em 0;
	padding: 1em;
	border: 1px solid hsl(0, 0%, 67%);
}*/

fieldset p {
    margin: 2px 12px 10px 10px;
}

.login label, .register label, .changePassword label {
    display: block;
}

fieldset label.inline {
    display: inline;
}

legend {
    /*font-size: 1.1em;
	font-weight: 600;
	padding: 2px 4px 8px 4px;*/
    font-size: 13px !important;
    font-weight: 500;
}

.textEntry {
    width: 320px;
    border: 1px solid #38d8f2;
}

.passwordEntry {
    width: 320px;
    border: 1px solid #38d8f2;
}

/* MISC
----------------------------------------------------------*/

.clear {
    clear: both;
}

.title {
    display: block;
    float: left;
    text-align: left;
    width: auto;
}

.loginDisplay {
    font-size: 1.1em;
    display: block;
    text-align: right;
    padding: 10px;
    color: White;
}

    .loginDisplay a:link {
        color: white;
    }

    .loginDisplay a:visited {
        color: white;
    }

    .loginDisplay a:hover {
        color: white;
    }

/*.loginStd {
    width: 100%;
    background-color: #200c00;
}*/

.loginTopBanner {
    height: 100px;
    position: fixed;
    top: 0;
}

.loginBtmBanner {
    height: 60px;
    position: fixed;
    bottom: 0;
}

.loginCopyRight {
    position: relative;
    width: 50%;
    margin: auto;
    color: olive;
    /*text-shadow: 1px 1px 1px #BBBBBB;*/
    text-align: center;
    bottom: -20px;
    font-family: "Open Sans", Tahoma, Verdana, Geneva, Tahoma, sans-serif, Serif;
}

.loginText {
    color: #666666;
    font-size: 16px;
    font-weight: bold;
    /*text-shadow: 1px 1px 1px #BBBBBB;*/
    line-height: 1;
    vertical-align: middle;
}

.loginTitle {
    position: relative;
    color: olive;
    /*text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;*/
    font-weight: bold;
    font-size: 3em;
    font-family: "Open Sans", Georgia, Serif;
    font-style: italic;
    top: 20px;
    left: 20px;
}

.loginSplash {
    background: url(../images/login6/splash.jpg) no-repeat center center fixed;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.failureNotification {
    font-size: 1.2em;
    color: #cd041c;
}

.bold {
    font-weight: bold;
}

.submitButton {
    text-align: right;
    padding-right: 10px;
}

/* ORES
----------------------------------------------------------*/
/*.norec {
    text-align: center;
}

.error {
    font-size: 1.2em;
    color: #cd041c;
}

.subHeader2 {
    font-weight: bold;
    white-space: nowrap;
    font-size: 1.5em;
    height: 2em;
}

.subHdrNote {
    font-family: "Open Sans", Arial;
    font-size: 11pt;
    font-style: italic;*/
/*color:gray;*/
/*white-space: nowrap;
}*/

/* Confirm booking  */
/* ================ */
/* iss6 */

/*.btnsmall, .btnsmallx {
    color: black;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    width: 150px;
    height: 30px;
    font: 12pt "Open Sans", Arial, Helvetica, sans-serif;
    font-weight: bold;
}*/

.btnMoveItem {
    height: 25px;
    width: 60px;
}

/*.divCentre {
    width: 50%;
    margin: 0 auto;
}*/

.divCentre {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.centre_text2 {
    text-align: center !important;
    font-size: 10pt;
}

/*.banner_coy {
    color: #addaff;
    font-weight: 600;
    padding-left: 5px;
}

.banner_title {
    color: #fff;
    font-size: 12pt;
    font-weight: 600;
    text-align: center;
}

.banner_module {
    color: #56adf3;
    font-weight: 600;
    padding-left: 5px;
}

.banner_timestamp {
    color: #a7b1c2;
    font-size: 9pt;
    font-weight: 600;
    padding-left: 5px;
}*/

.banner_subtitle {
    color: #a7b1c2;
    font-size: 7pt;
    font-weight: 600;
    padding-left: 5px;
}

.banner_menu {
    font-size: 9pt;
    color: #fff;
}

.printBook .p {
    font-family: "Open Sans", Arial;
    font-size: 12pt;
}

.vertBar {
    color: gray;
}

.minimalize-styl-3 {
    padding: 4px 12px;
    margin: 0 0 5px 5px;
    font-size: 14px;
    float: left;
}

/*
.mandatoryFld
{
	 Use when using * as the reminder
	color#2a8ff5;
	font-weight:bolder;
	float: right;
	left:10px;
	border: 0;
}

.manfld
{
	white-space: nowrap;
}*/

.selectClass {
    color: #0066FF;
    font-family: "Open Sans", Verdana;
    font-size: 12pt;
    font-weight: bold;
}

.emailSubjHdr {
    text-decoration: underline;
    font-weight: bold;
}

/* Added by csl on 28 Sep 2020 */
/*.tooltip.fade {
    max-width:320px;
    min-width:50px;
}*/

/*.tooltip
{
	color: #666666;
	margin: 8px;
	padding: 8px;
	border: 1px solid #666666;
	background-color: #eff0ef;
	position: absolute;
	z-index: 2;
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 12pt;
}*/

.tooltip-inner {
    border-radius: 3px !important;
}

/*.ui-tooltip, .arrow:after {
	border: 4px solid black;
  }*/
/*.ui-tooltip {
	//padding: 10px 20px;
	//border-radius: 20px !important;
	border: 3px solid hsla(0, 0%, 0%, 0.65) !important;
	//color: white;
	//font: 12px "Helvetica Neue", Sans-Serif;
	//text-transform: uppercase;
	//box-shadow: 0 0 7px black !important;
	background-color: hsl(202, 85%, 95%) !important;
  }
  .ui-tooltip-content {
	//background-color: rgba(255, 255, 0, 1.00);
	color: hsl(217, 90%, 34%);
	font-family:"Open Sans", sans-serif;
	font-size: 11pt;
  }*/

/*.arrow {
	width: 70px;
	height: 20px;
	overflow: hidden;
	position: absolute;
	left: 50%;
	margin-left: -35px;
	bottom: -20px;
  }
  .arrow.top {
	top: -16px;
	bottom: auto;
  }
  .arrow.left {
	left: 20%;
  }
  .arrow:after {
	content: "";
	position: absolute;
	left: 20px;
	top: -20px;
	width: 25px;
	height: 25px;
	box-shadow: 6px 5px 9px -9px black;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
  }
  .arrow.top:after {
	bottom: -20px;
	top: auto;
  }*/

/* Admin - Settings  */
/* ================ */

.divNotify {
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border: 1px solid #cd041c;
    height: 30px;
}

mnuCoy {
    width: 180px;
    background-color: #cd041c;
    color: White;
    font-size: 10pt;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-weight: bolder;
    border-radius: 15px;
    behavior: url('../Scripts/border-radius.htc');
    position: relative;
    top: 0;
    text-align: center;
    vertical-align: middle;
}

.appheader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    background-color: #0A2D66;
    border-top: solid 6px hsl(201, 42%, 13%);
    border-bottom: solid 6px hsl(201, 42%, 13%);
}

/*.banner, .css_left
{
	float: left;
}*/

.divCircle {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    /*border: 1px solid #000000;*/
    height: 20px;
    width: 20px;
    /*color:White;*/
    font-size: 18pt;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-weight: bolder;
    border-radius: 10px;
    position: relative;
    margin: 5px;
}

.dteFldSize {
    width: 80px;
    text-align: center;
}

.txtCircle {
    position: relative;
    top: -6px;
    left: 3px;
    /*text-shadow: 0 1px 0 #fff;*/
}

.txtCircleRed {
    position: relative;
    top: -6px;
    left: 3px;
    /*text-shadow: 0 1px 0 #fff;*/
    color: #dc143c;
}

.txtCircleIE {
    position: relative;
    top: -3px;
    left: 3px;
    /*text-shadow: 0 1px 0 #fff;*/
}

.txtCircleIERed {
    position: relative;
    top: -3px;
    left: 3px;
    /*text-shadow: 0 1px 0 #fff;*/
    color: #dc143c;
}

.addDivRight {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    height: 20px;
    width: 40px;
    /*color:White;*/
    font-size: 18pt;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-weight: bold;
    border-radius: 3px;
    position: relative;
    margin: 2px;
    float: right;
}

/*.btnDtAdd {
    background: #d6d6d6;
    background-image: -webkit-linear-gradient(top, #d6d6d6, #8c8c8c);
    background-image: -moz-linear-gradient(top, #d6d6d6, #8c8c8c);
    background-image: -ms-linear-gradient(top, #d6d6d6, #8c8c8c);
    background-image: -o-linear-gradient(top, #d6d6d6, #8c8c8c);
    background-image: linear-gradient(to bottom, #d6d6d6, #8c8c8c);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;*/
/*text-shadow: 2px 2px 2px #666666;*/
/*font-family: "Open Sans", Arial;
    color: #000000;
    font-size: 14px;
    padding: 5px 20px 5px 20px;
    border: solid #a3a3a3 2px;
    text-decoration: none;
}

    .btnDtAdd:hover {
        background: #a6d7f5;
        background-image: -webkit-linear-gradient(top, #a6d7f5, #78b3db);
        background-image: -moz-linear-gradient(top, #a6d7f5, #78b3db);
        background-image: -ms-linear-gradient(top, #a6d7f5, #78b3db);
        background-image: -o-linear-gradient(top, #a6d7f5, #78b3db);
        background-image: linear-gradient(to bottom, #a6d7f5, #78b3db);
        text-decoration: none;
    }*/

.mainContent {
    width: 100%;
    margin-top: 110px;
}

.separator {
    clear: both;
}

.subHeader {
    font-weight: 500;
    white-space: nowrap;
    font-size: 1.1em;
}

#modalShade {
    display: none;
    background: #000000;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

.loginHeader {
    font-size: 16pt;
    font-family: "Open Sans", Arial;
    font-weight: bold;
}

.centre_text {
    text-align: center !important;
    vertical-align: middle;
}


.errHighlite {
    border: 1px solid #cd041c !important;
    background-color: #ffe4a475 !important;
}

.css_right {
    float: right;
}

.NumBox {
    width: 80px;
    text-align: right;
}

.ouModal {
    height: 300px;
    width: 600px;
}

.mod250x500 {
    height: 250px;
    width: 500px;
}

.mod350x500 {
    height: 350px;
    width: 500px;
}

.lvModal, .mod600x700 {
    height: 600px;
    width: 700px;
}

.scModal, .mod500x500 {
    height: 500px;
    width: 500px;
}

.mod400x500 {
    height: 400px;
    width: 500px;
}

.mod500x600 {
    height: 500px;
    width: 600px;
}

.mod400x700 {
    height: 400px;
    width: 700px;
}

.mod500x1200 {
    height: 500px;
    width: 1200px;
}

.mod550x1200 {
    height: 550px;
    width: 1200px;
}

.eeModal {
    position: relative;
    display: block;
    margin: auto;
    width: 90%;
    height: 70%;
    z-index: 200;
}

.schModal {
    display: none;
    color: #000000;
    padding: 0;
    /*border: 10px solid #c3c3f3;*/
    /*font-size: 10pt;*/
    /*background-color: #e6e6fa;*/
    float: left;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 200;
}

.rndModal {
    display: block;
    margin: auto;
    width: 600px;
    height: 600px;
    z-index: 200;
}

.outTR {
    cursor: pointer;
    position: relative;
}

.outTRx {
    cursor: pointer;
    position: relative;
    font-style: italic;
    color: #ca0909;
}

.errExclaim {
    font-weight: bold;
    font-size: 14px;
    font-family: "Open Sans", Georgia;
}

.errText {
    font-style: italic;
    color: #ca0909;
}

.intNumBox50, .dblNumBox50, .intYear50 {
    width: 50px !important;
    text-align: right !important;
}

.intNumBox30, .dblNumBox30 {
    width: 30px !important;
    text-align: right !important;
}

.intNumBox60 {
    width: 60px !important;
    text-align: right !important;
}
/* iss6 */
.TxtBox800 {
    width: 800px !important;
}

.TxtBox400 {
    width: 400px !important;
}

.TxtBox300 {
    width: 300px !important;
}

.TxtBox200 {
    width: 200px !important;
}

.TxtBox100 {
    width: 100px !important;
}

.TxtBox50 {
    width: 50px !important;
}

.TxtBox25 {
    width: 25px !important;
}

/* iss6 */
.numFld,
.stayRight {
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.stayCentre {
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.textTop {
    vertical-align: top;
}

.textMid {
    vertical-align: middle;
}

/* iss6 */
.settingBtnClose {
    float: right;
    /*margin: -40px -30px 0 0;*/
    margin: -10px 3px 0 0;
    border: none;
}

/* iss6 */
#settingShade {
    display: none;
    background: hsl(0, 0%, 40%);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

/* iss6 */
#settingShade2 {
    display: none;
    background: hsl(0, 0%, 40%);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

.settingModal {
    display: none;
    -moz-border-top-left-radius: 15px;
    -moz-border-top-right-radius: 15px;
    -webkit-border-top-left-radius: 15px;
    -webkit-border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-radius: 15px;
    color: #000000;
    padding: 5px;
    border: 10px solid #4890e7;
    font-size: 10pt;
    background-color: White;
    float: left;
    position: fixed;
    height: 500px;
    width: 800px;
    top: 50%;
    left: 50%;
    z-index: 200;
}

.settingTbl {
    position: relative;
    margin: 10px auto 10px auto;
    font-size: 1em;
    font-family: "Open Sans", Arial;
    vertical-align: top;
    padding: 2px;
}

.settingTDiv {
    height: 50px;
}

.tRow td {
    margin: 0;
    padding: 4px;
    border-width: 1px 1px 0 0;
    border-style: solid;
}

td.tdPad {
    margin: 0 !important;
    padding: 3px !important;
}

.grooveBorder {
    border: 2px groove;
    border-collapse: collapse;
}

.navpath {
    font-size: 1.0em;
    font-weight: 600;
    padding-left: 10px;
    /*height: 30px;*/
}

.rowHighlight {
    background-color: #c3ff00;
}

.helptip {
    overflow: auto;
    background-color: #fff;
    padding: 10px;
    width: 250px;
    box-shadow: 0 0 5px #888888;
}

.outTR .nowrap {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nowrap {
    white-space: nowrap;
    overflow: hidden;
}

@media (max-width: 768px) {
    .logTR.nowrap {
        white-space: nowrap;
        overflow: hidden;
        max-width: 200px;
        text-overflow: ellipsis;
        word-break: break-all;
    }
}

@media (min-width: 769px) {
    .logTR.nowrap {
        white-space: nowrap;
        overflow: hidden;
        max-width: 250px;
        text-overflow: ellipsis;
        word-break: break-all;
    }
}

.fixedLayout {
    table-layout: fixed;
}

.boldCentre {
    font-weight: bold;
    text-align: center;
}

#buttons {
    clear: right;
    float: right;
    position: relative;
    right: 86px;
}

    #buttons input {
        height: 28px;
        width: 60px;
    }

.imgCenter {
    float: left;
    padding: 2px;
    margin-left: auto;
    margin-right: auto;
}

.inputID {
    width: 100px;
}

.inputDesc {
    width: 200px;
}

/* ISS Icons
--------------------*/
.iss-icon {
    display: inline-block;
    vertical-align: top;
    text-indent: -99999px;
    margin: auto;
    overflow: hidden;
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    background-image: url('../images/iss_icons.png');
}

.iss-icon-cbox {
    background-position: 0 0;
}

.iss-icon-cbox-ok {
    background-position: -16px 0;
}

.iss-icon-trash {
    background-position: -32px 0;
}

.iss-icon-disk {
    background-position: -48px 0;
}

.iss-icon-circled-tick {
    background-position: -64px 0;
}

.iss-icon-green-tick {
    background-position: -80px 0;
}

.iss-icon-circled-cross {
    background-position: -96px 0;
}

.iss-icon-radio {
    background-position: -112px 0;
}

.iss-icon-radio-checked {
    background-position: -128px 0;
}

.iss-icon-calendar {
    background-position: -144px 0;
}

.iss-icon-close-gray {
    background-position: -160px 0;
}

/* ISS Calendar
--------------------*/
.iss-calendar {
    margin: auto;
    overflow: hidden;
    background-repeat: no-repeat !important;
    max-height: 100%;
    max-width: 100%;
    background-image: url('images/iss_calendar.png') !important;
}

.iss-calendar-greenPM {
    background-position: 0 0 !important;
}

.iss-calendar-greenFULL {
    background-position: -32px 0 !important;
}

.iss-calendar-greenAM {
    background-position: -64px 0 !important;
}

.iss-highlight {
    background-color: yellow;
}

.iss-nav {
    font-weight: bold;
    font-size: 1.2em;
    cursor: pointer;
}

.iss-active {
    -moz-border-top-left-radius: 10px;
    -moz-border-top-right-radius: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-radius: 10px;
    border: 1px solid #cacaca;
    background-color: #eff0ef;
    padding: 15px;
}

.iss-inactive {
    border: none;
    background-color: #eff0ef;
}

.issTable {
    display: table;
    margin: 0 auto;
}

.issTableBorder {
    -moz-border-top-left-radius: 10px;
    -moz-border-top-right-radius: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-radius: 10px;
    border: 7px solid #13252f;
}

.issTableLeft {
    display: table;
}

.issTableTitle {
    font-size: 16px;
    font-weight: bold;
    color: #f6f5f5;
    /*text-shadow: 0 -1px 0 rgba(0,0,0,.25);*/
    background: #444;
    padding: 12px 15px;
    line-height: 1;
    vertical-align: middle;
}

/* ISS Dialog*/
.iss-dialog {
    display: none; /* Hidden by default. But due to printing issue, we have to manually add this style in aspx & js. */
    /*position: fixed;*/ /* Stay in place */
    z-index: 1058; /* Sit on top. SweetAlert has an index of 1060 */
    left: 0;
    top: 0px;
    padding-top: 10px;
    /*padding-bottom: 100px; 2022051301 */
    padding-bottom: 20px;
    width: 100%; /* Full width */
    height: 100%;
    overflow: auto; /* Enable scroll if needed */
    /*background-color: rgb(0,0,0);*/ /* Fallback color */
    /*background-color: rgba(0,0,0,0.6);*/ /* Black w/ opacity */
}

.KIVmotherwrapper {
    height: inherit;
    padding-bottom: 50px;
    /*overflow-x: auto;*/
}

.fullWidth {
    width: 100%;
}

.issRow {
    display: table-row;
}

.issCell {
    display: table-cell;
    padding: 0.3em;
    white-space: nowrap;
    vertical-align: middle;
}

.issCellMnu {
    display: block;
    padding-left: 5px;
    white-space: nowrap;
    vertical-align: middle;
}

.mnuParent {
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    width: 100%;
}

.mnuChild {
    width: 220px;
    height: 660px;
    display: inline-block;
    text-align: left;
    border: solid 6px #0D0C11;
    -moz-border-top-left-radius: .5em;
    -moz-border-top-right-radius: .5em;
    -webkit-border-top-left-radius: .5em;
    -webkit-border-top-right-radius: .5em;
    border-top-left-radius: .5em;
    border-top-right-radius: .5em;
    border-radius: .5em;
    background-color: #ACD9EC;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
}

.mnuSettings {
    position: fixed;
    right: 2px;
    top: 45px;
    width: 220px;
    display: inline-block;
    text-align: left;
    border: solid 6px #0067C7;
    -moz-border-top-left-radius: .5em;
    -moz-border-top-right-radius: .5em;
    -webkit-border-top-left-radius: .5em;
    -webkit-border-top-right-radius: .5em;
    border-top-left-radius: .5em;
    border-top-right-radius: .5em;
    border-radius: .5em;
    background-color: #ACD9EC;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
}


.mnuTitle {
    display: inline-block;
    width: 211px;
    height: 30px;
    text-align: center;
    font-size: 1.2em;
    font-weight: bold;
    /*text-shadow: 1px 1px 1px  rgba(150, 150, 150, 1) !important;*/
}

.mnuBackground {
    background-image: url("../imagesV6/menu_background.jpg");
    background-size: cover;
    background-position: top center !important;
    background-repeat: no-repeat !important;
    -moz-background-size: cover;
    -webkit-background-size: cover;
}

.mnuCoyTitle {
    position: fixed;
    top: 10px;
    left: 10px;
    font-size: 2em;
    font-family: "Open Sans", Arial;
    font-weight: 700;
    color: #FFD700;
    text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);
}

.mnuOptions {
    position: relative;
    top: 8px;
    right: -10px;
    /*color:#FFFFFF; */
    font-size: 10pt;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-weight: bolder;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
    /*text-shadow: 0 0 1px rgba(51,51,51,0.2);*/
    text-align: center;
}

.mnuOptionsImg {
    position: relative;
    top: 4px;
    /*right: -4px;*/
    text-shadow: 0 0 1px rgba(51,51,51,0.2);
}

.mnuCircle {
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    /*border: 1px solid #000000;*/
    height: 40px;
    width: 40px;
    border-radius: 20px;
    border-style: solid;
    border-width: 2px;
    position: relative;
    top: 2px;
    margin: 1px;
    text-shadow: 0 0 1px rgba(51,51,51,0.2);
    cursor: pointer;
}

.mnuProdNm {
    color: #2c77ba;
    font-size: 2em;
    font-weight: bold;
    padding: 8px 0 0 0;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
    line-height: normal;
    position: fixed;
    bottom: 40px;
    width: 100%;
    /*text-shadow: hsl(185, 100%, 50%) 0 0 5px;*/ /* glow effect */
}

.mnuUsrNm {
    color: #fff;
    font-size: 1em;
    font-weight: bold;
    padding: 8px 0 0 0;
    line-height: normal;
    position: fixed;
    left: 0;
    bottom: 0;
    /*text-shadow: 0 0 1px rgba(51,51,51,0.2);*/
}

.mnuListStyle {
    position: relative;
    left: -35px; /* Shift li to the left */
    list-style-type: none;
    list-style-position: outside;
    margin: 0; /*To reduce the gap between ul and li*/
}

.mnuPlusIcon {
    background-image: url("../images/box_plus.gif") !important;
    height: 11px;
    width: 9px;
    display: inline-block;
}

.mnuMinusIcon {
    background-image: url("../images/box_minus.gif") !important;
    height: 11px;
    width: 9px;
    display: inline-block;
}

.mnuItem {
    margin-top: 50px;
}

#modName {
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: white;
    font-weight: bold;
    font-size: 1.5em;
    /*text-shadow: 0 0 1px rgba(51,51,51,0.2);*/
}

.siteForm {
    background-image: url("../imagesV6/site-background.jpg");
    background-size: cover;
    background-position: top center !important;
    background-repeat: no-repeat !important;
    -moz-background-size: cover;
    -webkit-background-size: cover;
}

.siteClose {
    font-size: 1.2em;
    font-weight: bold;
    width: 10px;
    height: 10px;
    color: #dc143c;
    margin: 2px 2px 0 0;
}

.siteCoyTitle {
    position: relative;
    float: left;
    top: 10px;
    left: 10px;
    font-size: 1.5em;
    font-family: "Open Sans", Arial;
    font-weight: 700;
    color: #75e9ea;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
    width: 33%;
}

.sitePgmNm {
    position: relative;
    float: left;
    top: 10px;
    font-size: 1.5em;
    font-family: "Open Sans", Arial;
    font-weight: 700;
    color: #FFFFFF;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
    width: 34%;
    text-align: center;
}

.siteModNm {
    position: relative;
    float: left;
    left: 10px;
    top: -10px;
    font-size: 1.5em;
    font-family: Arial;
    font-weight: 700;
    color: #FFFFFF;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
    width: 25%;
}

.siteBack {
    position: relative;
    float: right;
    top: 10px;
    font-size: 1.5em !important;
    color: #FFFFFF;
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
    text-align: right;
}

.siteUser {
    position: relative;
    left: 10px;
    top: -15px;
    float: right;
    width: 33%;
    text-align: right;
    padding-right: 10px;
}

.siteLogonUser {
    font-size: 1.1em;
    font-family: "Open Sans", Arial;
    color: hsl(174, 29%, 72%);
    /*text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);*/
    vertical-align: top;
}

.siteDtTime {
    position: relative;
    right: 46px;
    top: -10px;
    font-size: 1.1em;
    font-family: "Open Sans", Arial;
    color: hsl(174, 29%, 72%);
    text-shadow: 1px 1px 1px rgba(150, 150, 150, 1);
    vertical-align: top;
}

.issCellMnu a:hover {
    text-shadow: hsl(179, 100%, 50%) 0 0 5px; /* glow effect */
}

.iss-ptr2,
.iss-ptr {
    cursor: pointer;
}

/* Test using images for calendar */
.halfDayAM {
    background-image: url('images/halfgreenAM.png') !important;
    background-repeat: no-repeat !important;
    max-height: 100%;
    max-width: 100%;
}

.halfDayPM {
    background-image: url('images/halfgreenPM.png') !important;
    background-repeat: no-repeat !important;
    max-height: 100%;
    max-width: 100%;
}

.fullDay {
    background-image: url('images/fulldaygreen.png') !important;
    background-repeat: no-repeat !important;
    max-height: 100%;
    max-width: 100%;
}

.tblSetup, .centre_div {
    margin-left: auto;
    margin-right: auto;
    border-spacing: 0;
}

.manInd {
    height: 1em;
    width: 1em;
    -moz-border-top-left-radius: .5em;
    -moz-border-top-right-radius: .5em;
    -webkit-border-top-left-radius: .5em;
    -webkit-border-top-right-radius: .5em;
    border-top-left-radius: .5em;
    border-top-right-radius: .5em;
    border-radius: .5em;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    display: table;
    background-color: #cd041c;
}

/* Found in ihrms_ss2.css. Will stop using stylesheets starting with ihrms */
.floatLeft {
    position: relative;
    float: left;
}

/*.floatRight {
    position: relative;
    float: right;
}*/

.tabHdr {
    margin-left: 2em;
}

.bluTxt {
    color: #176ee1;
}

.borderTLB {
    border-collapse: collapse;
    border-top: 1px solid #acaeae;
    border-left: 1px solid #acaeae;
    border-bottom: 1px solid #acaeae;
}

.borderBL {
    border-collapse: collapse;
    border-bottom: 1px solid #acaeae;
    border-left: 1px solid #acaeae;
}

.borderTB {
    border-collapse: collapse;
    border-bottom: 1px solid #acaeae;
    border-top: 1px solid #acaeae;
}

.borderTB2 {
    border-collapse: collapse;
    border-bottom: 2px double #acaeae;
    border-top: 1px solid #acaeae;
}

.borderL {
    border-collapse: collapse;
    border-left: 1px solid #acaeae;
}

.borderT {
    border-collapse: collapse;
    border-top: 1px solid #acaeae;
}

.borderR {
    border-collapse: collapse;
    border-right: 1px solid #acaeae;
}

.borderB {
    border-collapse: collapse;
    border-bottom: 1px solid #acaeae;
}

.borderAll {
    border-collapse: collapse;
    border: solid 1px #acaeae;
}

.bborderTLB {
    border-collapse: collapse;
    border-top: 1px solid #666;
    border-left: 1px solid #666;
    border-bottom: 1px solid #666;
}

.bborderBL {
    border-collapse: collapse;
    border-bottom: 1px solid #666;
    border-left: 1px solid #666;
}

.bborderTB {
    border-collapse: collapse;
    border-bottom: 1px solid #666;
    border-top: 1px solid #666;
}

.bborderL {
    border-collapse: collapse;
    border-left: 1px solid #666;
}

.bborderT {
    border-collapse: collapse;
    border-top: 1px solid #666;
}

.bborderR {
    border-collapse: collapse;
    border-right: 1px solid #666;
}

.bborderB {
    border-collapse: collapse;
    border-bottom: 1px solid #666;
}

.bborderAll {
    border-collapse: collapse;
    border: solid 1px #666;
}

.cellBGH {
    background-color: hsl(0, 0%, 95%);
    font-weight: bold;
}

.select-wrapper select, .select-wrapper2 select, .select-wrapper3 select, .select-wrapper4 select {
    margin: 0;
    position: absolute;
    z-index: 2;
    cursor: pointer;
    outline: none;
    opacity: 0;
    /* CSS hacks for older browsers */
    /*_noFocusLine: expression(this.hideFocus=true);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	-khtml-opacity: 0;
	-moz-opacity: 0;*/
}

.timFldHH, .timFldMM {
    width: 40px;
    height: 24px;
}

.noBorder {
    border: none;
}

.bgcol0 {
    border-collapse: collapse;
    background-color: #f9d2e6;
    border: 1px solid #acaeae;
}

.bgcol1, .bgcol2, .bgcol3, .bgcol4, .bgcol5 {
    border-collapse: collapse;
    background-color: #f4fdd7;
    border: 1px solid #acaeae;
}

.bgcol6 {
    border-collapse: collapse;
    background-color: #c2ebfd;
    border: 1px solid #acaeae;
}

.shiftTd {
    height: 20px;
    width: 33px;
    text-align: center;
    padding: 0 !important;
}

.shiftSel {
    box-shadow: 0 0 10px #73c2f2;
    -webkit-box-shadow: 0 0 10px #73c2f2;
    -moz-box-shadow: 0 0 10px #73c2f2;
    border: groove 2px #2a8ff5;
}

.navBack {
    text-align: right;
    padding-right: 5px;
    padding-top: 20px;
}

.bold500 {
    font-weight: 600;
}

/* Daidan */
.colWidth01 {
    width: 100px !important;
}

.colWidth02 {
    width: 300px !important;
}

.colWidth03, .longTxtBox {
    width: 400px !important;
}

.colWidth04 {
    width: 50px !important;
}

.wmDtlTbl {
    width: 1300px;
}

.specialHilite {
    font-size: 1.2em;
    font-weight: bold;
    color: #317ce1;
}

#wmProjDiv {
    margin: 40px 0 0 50px;
}

#wmDtlDiv {
    margin: 40px 50px 0 0;
}

.wmNavCurr {
    color: #dc143c;
    font-weight: 600;
}

.wmNavDay, .wmNavPrv, .wmNavNxt {
    cursor: pointer;
}

.wmNavDisabled {
    font-weight: 100;
    font-style: italic;
}

/*
#wmNavDiv
{
	position: absolute;
	bottom: 100px;
	width: 100%;
}
*/

.wmTextArea {
    width: 600px !important;
    height: 100px !important;
    font-size: 14px;
}

#lvBalDiv {
    position: absolute;
    z-index: 10;
    background-color: #f6f2f2;
    border: 1px solid hsl(0, 0%, 67%);
}

.wmRosterRow {
    width: 24px !important;
    text-align: center !important;
    font-size: 12px !important;
    padding: 0 !important;
}

.wmRosterHdr {
    font-weight: 600 !important;
}

.wmColStsY {
    background-color: #ccffcc;
}

.wmColStsY2 {
    background-color: #9eed9e;
}

.wmColStsX, .wmColStsZ {
    background-color: #cccccc !important;
}

.ArialNarrow4 {
    font-family: Arial Narrow !important;
    font-size: 4.5pt !important;
}

.ArialNarrow7 {
    font-family: Arial Narrow !important;
    font-size: 7pt !important;
}

.Arial7 {
    font-family: Arial !important;
    font-size: 7pt !important;
}

.Arial8 {
    font-family: Arial !important;
    font-size: 8pt !important;
}

.Arial9 {
    font-family: Arial !important;
    font-size: 9pt !important;
}

.Arial10 {
    font-family: Arial !important;
    font-size: 10pt !important;
}

.fontSize {
    font-size: 12pt;
    font-weight: bold;
}

/* This is the CSS for iss.selectBox widget (jQuery.iss.js) */
.iss-selectbox {
    margin: 0;
    padding: 0;
    /*width: auto;*/
    background: white;
    background-color: inherit;
    border: none;
    position: relative;
}

.iss-input {
    /*border: 1px solid #79b;
	border-right: none;
	background-color: white;*/
    display: block !important;
    font-size: 1em;
    padding: 4px;
    margin: 0;
    /*width: 320px;*/
    float: left;
    /*border-radius: 4px 0 0 4px;
	-moz-box-shadow:    1px 1px 1px rgba(0,0,0,0.2) inset;
	-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.2) inset;
	box-shadow:         1px 1px 1px rgba(0,0,0,0.2) inset;*/
}

/*.iss-input-text {
    border: 1px solid #79b;
    background-color: white;
    display: block !important;
    font-size: 14px;
    padding: 4px;
    margin: 0;
    width: 332px;
    float: left;
    border-radius: 4px;
    -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.2) inset;
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.2) inset;
    box-shadow: 1px 1px 1px rgba(0,0,0,0.2) inset;
}*/

/**
 * "Get all" button
 */
/*.iss-button {
	border: 1px solid #e5e6e7  ;
	width: 32px;
	text-align: center;
	position: relative;
	cursor: pointer;
	float: left !important;
	clear: none !important;
	padding: 0 !important;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
    margin-left: -2px;
}*/

/*.iss-button img {
    position: absolute;
    height: 16px;
    width: 16px;
}

.iss-btn-out {
    background: #e5e6e7 !important;
}

.iss-btn-on {
    background: #dee !important;
}*/

/**
 * Results
 */
.iss-result-area {
    /*background-color: transparent;*/
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    z-index: 100;
    display: none;
    border: 1px solid #E5E6E7;
    border-top: 0;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.4) inset;
    -moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.4) inset;
    -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.4) inset;
}

.iss-results {
    background-color: white;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    overflow-y: auto;
    max-height: 300px;
}

    .iss-results li {
        margin: 0;
        height: auto !important;
        min-height: 18px !important;
        padding: 3px 5px;
        white-space: nowrap;
        color: #000;
        text-align: left;
        overflow: hidden;
        font-size: inherit;
        line-height: 1;
        position: relative;
    }

/*.iss-selected { Commented off on 2023-02-02
    background-color: #ffe0b2;
    font-weight: 600;
}*/

li.clickable {
    cursor: pointer;
}

    li.clickable:hover {
        /*background-color: #ffe48e;*/
        background-color: #337ab7;
        color: #fff;
    }

.iss-over {
    cursor: pointer;
    background-color: #337ab7;
    color: #fff !important;
}

/*
 * 20150408 For v6.0 dialogs styling
*/
.IssDialog *,
.IssDialog *:after,
.IssDialog *:before {
    -moz-box-sizing: content-box !important;
    -webkit-box-sizing: content-box !important;
    box-sizing: content-box !important;
}

.IssDialog,
.IssDialog .IssDialog_Title,
.IssDialog .IssDialog_Body,
.IssDialog .IssDialog_Buttons a {
    margin: 0;
    padding: 0;
    /* font-family: Helvetica, Tahoma, Arial, sans-serif;
	font-size: 14px;
	text-align: left;*/
}

    .IssDialog .IssDialog_Title,
    .IssDialog .IssDialog_BodyOuter,
    .IssDialog .IssDialog_BottomOuter,
    .IssDialog .IssDialog_ButtonsOuter {
        border-color: #13252F;
        border-width: 7px;
    }

    .IssDialog .IssDialog_Title {
        font-size: 16px;
        font-weight: bold;
        color: #F6F5F5;
        /*text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
        background: #444444;
        padding: 12px 15px;
        line-height: 1;
        vertical-align: middle;
    }

    /*  set background color here and not on IssDialog_Body, or you'll eventually run into problems with rounded corners
	when using smaller widths for border! */
    .IssDialog .IssDialog_BodyOuter {
        background: #E7EDEF;
    }

    .IssDialog .IssDialog_Body {
        color: #44484A;
        padding: 20px;
        border-top-color: #000;
        border-bottom-color: #FFF;
    }

    .IssDialog .IssDialog_ButtonsOuter {
        background: #E7EDEF;
        padding: 10px 5px 10px 10px;
    }

    .IssDialog .IssDialog_Buttons:before,
    .IssDialog .IssDialog_Buttons:after {
        content: "\0020";
        display: block;
        height: 0;
        visibility: hidden;
        font-size: 0;
    }

    .IssDialog .IssDialog_Buttons:after {
        clear: both;
    }

    .IssDialog .IssDialog_Buttons {
        *zoom: 1;
    }
        /* for IE only */

        .IssDialog .IssDialog_Buttons a {
            font-weight: bold;
            color: #FFF;
            /*text-shadow: 1px 0 2px #222;*/
            padding: 10px 15px;
        }

            .IssDialog .IssDialog_Buttons a:hover {
                background: #224467;
                color: #FFF;
            }

    .IssDialog a.IssDialog_Close {
        position: absolute;
        right: 15px;
        top: 10px;
        text-decoration: none;
        font-family: arial, sans-serif;
        font-weight: bold;
        font-size: 21px;
        color: #666;
    }

        .IssDialog a.IssDialog_Close:hover {
            color: #bde;
            /*text-shadow: 0 0 0.2em #bde;*/
        }

    .IssDialog .IssDialog_Title a.IssDialog_Close {
        color: #E7EDEF;
    }

        .IssDialog .IssDialog_Title a.IssDialog_Close:hover {
            color: #bde;
            /*text-shadow: 0 0 0.2em #bde;*/
        }

    .IssDialog a.IssDialog_Close2 {
        position: absolute;
        right: 15px;
        top: 10px;
        text-decoration: none;
        font-family: arial, sans-serif;
        font-weight: bold;
        font-size: 21px;
        color: #666;
    }

        .IssDialog a.IssDialog_Close2:hover {
            color: #bde;
            /*text-shadow: 0 0 0.2em #bde;*/
        }

    .IssDialog .IssDialog_Title a.IssDialog_Close2 {
        color: #E7EDEF;
    }

        .IssDialog .IssDialog_Title a.IssDialog_Close2:hover {
            color: #bde;
            /*text-shadow: 0 0 0.2em #bde;*/
        }

.IssDialogOverlay {
    background: #666;
    z-index: 9999;
    width: 100%;
    height: 100%;
}

.IssDialogOverlay3 {
    background: rgba(102, 102, 102, 0.70);
    z-index: 1000;
    width: 100%;
    height: 100%;
}

.IssDialogBox {
    border-style: solid;
    border-width: 7px;
    border-radius: 10px 10px 10px 10px;
    border-color: hsl(201, 42%,13%);
    background: hsl(195, 20%,92%);
}

/* = YOU SHOULD NOT CHANGE ANYTHING FROM THIS POINT ON
---------------------------------------------------------------------------------------------------------------------*/
.IssDialog {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    position: relative;
}

    .IssDialog .IssDialog_Title {
        border-left-style: solid;
        border-top-style: solid;
        border-right-style: solid;
        -webkit-border-radius: 10px 10px 0 0;
        -moz-border-radius: 10px 10px 0 0;
        border-radius: 10px 10px 0 0;
    }

    .IssDialog .IssDialog_BodyOuter {
        border-left-style: solid;
        border-right-style: solid;
    }

    .IssDialog .IssDialog_NoTitle {
        border-top-style: solid;
        -webkit-border-top-left-radius: 10px;
        -moz-border-top-left-radius: 10px;
        border-top-left-radius: 10px;
        -webkit-border-top-right-radius: 10px;
        -moz-border-top-right-radius: 10px;
        border-top-right-radius: 10px;
    }

    .IssDialog .IssDialog_NoButtons {
        border-bottom-style: solid;
        -webkit-border-bottom-left-radius: 10px;
        -moz-border-bottom-left-radius: 10px;
        border-bottom-left-radius: 10px;
        -webkit-border-bottom-right-radius: 10px;
        -moz-border-bottom-right-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .IssDialog .IssDialog_Body {
        border-top-width: 1px;
        border-top-style: solid;
        border-bottom-width: 2px;
        border-bottom-style: groove;
        /*overflow: auto;*/
    }

    .IssDialog .IssDialog_NoTitle .IssDialog_Body {
        border-top: none;
    }

    .IssDialog .IssDialog_NoButtons .IssDialog_Body {
        border-bottom: none;
    }

    .IssDialog .IssDialog_Icon {
        background-repeat: no-repeat;
        background-position: 20px 20px;
        padding-left: 88px;
        min-height: 48px;
        _height: 85px;
    }

    .IssDialog .IssDialog_Confirmation {
        background-image: url('../images/zebra/confirmation.png');
    }

    .IssDialog .IssDialog_Error {
        background-image: url('../images/zebra/error.png');
    }

    .IssDialog .IssDialog_Information {
        background-image: url('../images/zebra/information.png');
    }

    .IssDialog .IssDialog_Question {
        background-image: url('../images/zebra/question.png');
    }

    .IssDialog .IssDialog_Warning {
        background-image: url('../images/zebra/warning.png');
    }

    .IssDialog .IssDialog_ButtonsOuter {
        background: #E7EDEF;
        padding: 10px 5px 10px 10px;
        border-left-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        -webkit-border-radius: 0 0 10px 10px;
        -moz-border-radius: 0 0 10px 10px;
        border-radius: 0 0 10px 10px;
    }

    .IssDialog .IssDialog_BottomOuter {
        border-left-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        -webkit-border-radius: 0 0 10px 10px;
        -moz-border-radius: 0 0 10px 10px;
        border-radius: 0 0 10px 10px;
        position: relative;
        top: -3px;
    }

    .IssDialog .IssDialog_Buttons a {
        white-space: nowrap;
        text-align: center;
        text-decoration: none;
        /*text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
        /*display: inline-block;*/
        margin-right: 5px;
        min-width: 60px;
        float: right;
        width: 100px;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        /* taken from Twitter Bootstrap */
        background-color: #006DCC;
        *background-color: #0044CC;
        background-repeat: repeat-x;
        background-image: linear-gradient(to bottom, #0088CC, #0044CC);
        border-left-color: #0044CC;
        border-right-color: #0044CC;
        border-top-color: #0044CC;
        border-bottom-color: #002A80;
    }

    .IssDialog_Buttons_Centered,
    .IssDialog .IssDialog_Buttons_Centered .IssDialog_Buttons {
        display: table;
        margin: 0 auto;
        text-align: center;
    }

    .IssDialog .IssDialog_Buttons_Centered a {
        /*zoom: 1;*/
        transform: scale(1);
        transform-origin: 0 0;
        display: inline;
    }

.IssDspErrMsg {
    position: relative;
    height: 40px;
    font-size: 18px;
    font-weight: bold;
    color: #ecbcbc;
    text-shadow: 0 0 0.2em #ecbcbc;
    /*text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
    background: #444444;
    padding: 12px 15px;
    line-height: 1;
    vertical-align: middle;
    border-color: #13252F;
    border-width: 7px;
    border-style: solid;
    -webkit-border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
}

.IssCentreDiv {
    margin-left: auto;
    margin-right: auto;
    /*z-index: 999;*/
}

/*.IssSelToTxt {
    line-height: 34px;
}*/

.IssThickBorder {
    border: 7px solid #13252F !important;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important;
}

.IssAddBtn {
    position: absolute;
    top: 10px;
    right: 10px;
}

.rptRowHeight {
    height: 34px;
}

/*.progressGrp {
    position: fixed;
    width: 300px;
    height: 300px;
    top: 50%;
    left: 50%;
    margin-top: -150px;
    margin-left: -150px;
}*/

/*.progressGrp {
    position: fixed;
    width: 100%;
    top: 50%;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}*/

#divProgress {
    position: relative;
    width: 100px;
    height: 100px;
    top: 40%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
}

/*.divbtnStop {
    position: relative;
    top: 50%;
    width: 100%;
    left: 50%;
    margin-top: 10px;
    margin-left: -30px;
}*/

/*.progressText {
    position: absolute;
    top: 50%;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    font-size: larger;
    font-weight: bold;
    color: gray;
}*/

.circle strong {
    position: absolute;
    top: 30px;
    left: 25px;
    margin-left: auto;
    margin-right: auto;
    font-size: 25px;
}

.rpt-bg {
    background-image: url(../images/rpt-bg.jpg);
    height: 100%;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Accordion
   http://www.hongkiat.com/blog/theming-jquery-ui-accordion/
*/
/*2024021301*/
/*#mainaccordion .ui-accordion-content {*/
    /*background-color: #f3f3f3;*/
    /*color: #444;
    font-size: 12pt;
    line-height: 16pt;
    box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, .2), inset 0 0 0 0 rgba(0, 0, 0, .5);
}

    #mainaccordion .ui-accordion-content > * {
        margin: 0;
        padding: 20px;
    }

    #mainaccordion .ui-accordion-content a {
        color: #777;
    }*/

#mainaccordion .ui-accordion-header {
    /*background-color: #ccc;*/
    margin: 0;
    background-color: #337ab7;   /*2024021301*/
    /*2024021301
    background-color: #389abe;
    background-image: -moz-linear-gradient(top, #389abe 0, #2a7b99 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0,#389abe), color-stop(100%,#2a7b99));
    background-image: -webkit-linear-gradient(top, #389abe 0,#2a7b99 100%);
    background-image: -o-linear-gradient(top, #389abe 0,#2a7b99 100%);
    background-image: -ms-linear-gradient(top, #389abe 0,#2a7b99 100%);
    background-image: linear-gradient(to bottom, #389abe 0,#2a7b99 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#389abe', endColorstr='#2a7b99',GradientType=0 );*/
}

    #mainaccordion .ui-accordion-header a {
        width: 100%;
        color: #fff;
        font-size: 12pt;
        line-height: 36px;
        display: block;
        text-indent: 10px;
    }

#viewlog {
    position: relative;
    width: 1280px;
    margin-left: auto;
    margin-right: auto;
    top: 40px;
    background-color: #fff;
    /*overflow:auto;*/
    z-index: 1000;
}

/*Leave Calendar*/
.lvcal .weekDay {
    width: 180px;
    height: 30px;
    border: solid 1px black;
    text-align: center;
}

.lvcal .dayMth {
    width: 180px;
    height: 96px;
    border: solid 1px black;
    text-align: right;
}

.dayHdr {
    margin-right: 1px;
    font-weight: bold;
}

.dayNorm {
    height: 18px;
}

.dayToday {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*border: 1px solid #000000;*/
    height: 18px;
    width: 18px;
    color: white;
    background-color: #175b02;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    /*font-weight: bolder;*/
    border-radius: 4px;
    position: relative;
    margin-top: 1px;
    margin-right: 1px;
    text-align: center;
}

.dayTodayWrapper {
    background-color: #caffde;
}

/*.dayNbr{
	position: relative;
	margin: 2px 0 0 4px;
}*/

.dayHol {
    font-size: 11px;
    font-weight: bold;
    color: #f398aa;
    padding-left: 2px;
}

.dayHoli {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*border: 1px solid #000000;*/
    height: 18px;
    width: 18px;
    color: white;
    background-color: #f398aa;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    /*font-weight: bolder;*/
    border-radius: 4px;
    position: relative;
    margin-top: 1px;
    margin-right: 1px;
    text-align: center;
}

.dayNone {
    background-color: beige;
}

.dayItm {
    float: left;
    clear: both;
    font-size: 10px;
    font-weight: 500;
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
}

.lvDtls {
    width: 178px;
    height: 77px;
    overflow-y: scroll;
    padding-left: 2px;
}

.LeaveSts {
    position: absolute;
    right: 40px;
    top: 15px;
}

.goToday {
    position: relative;
    right: 50px;
}

.goTodayLater {
    position: relative;
    right: 50px;
    color: GrayText;
}

#listDivMain {
    position: absolute;
    top: 100px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 500px;
    height: 600px;
    z-index: 200;
}

.naviPeriod {
    position: absolute;
    top: 15px;
    left: 610px;
}

.textDel {
    text-decoration: line-through;
    color: #dc143c;
}

.listBx {
    overflow-y: scroll;
    overflow-x: hidden;
    text-overflow: ellipsis;
    border: 1px solid hsl(210, 33%, 60%);
    height: 260px;
    min-width: 250px;
    background-color: white;
}

.moveBtn {
    color: #000;
    width: 40px;
    font-weight: bold;
}

.li-selected {
    background-color: #f8bb35;
}

#viewlogDtl {
    top: 50%;
    left: 50%;
    width: 36em;
    height: 18em;
    margin-top: -9em;
    margin-left: -18em;
    position: fixed;
}

/*.refNoTxt {
    color: royalblue;
}*/

.ui-datepicker-trigger {
    cursor: pointer;
}

.datepicker {
    z-index: 9999 !important;
}

.pinIt {
    position: absolute;
    background: url(../images/pin_red32x32.png) no-repeat;
    top: -9px;
    right: 15px;
    width: 32px;
    height: 32px;
}

.rollDays {
    height: 18px !important;
}

/*#listSchemeRpt{
	top: 50%;
	left: 50%;
	width: 36em;
	height: 24em;
	margin-top: -12em;
	margin-left: -18em;
	position: fixed;
	overflow-y:scroll;
	overflow-x:hidden;
}*/

/*.fillBG1{
	background-image: url("../images/dark_embroidery.png");
	background-repeat:repeat;
}*/

/* For employee work calendar with leave taken */
/* =========================================== */
td.dtCustom .ui-state-default {
    opacity: 1 !important;
    /*width: 36px;*/
}

td.dtHoliday .ui-state-default {
    background: #fcd8d5 !important;
}

td.dtBlock .ui-state-default {
    background: #f0c4fe !important;
}

td.dtBlockAM .ui-state-default {
    /*background: #f0c4fe !important;*/
    background: -moz-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%, rgba(204,250,184,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #f0c4fe), color-stop(0%, #f0c4fe), color-stop(50%, #f0c4fe), color-stop(50%, rgba(204,250,184,0))) !important;
    background: -webkit-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%, rgba(204,250,184,0) 50%) !important;
    background: -o-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%, rgba(204,250,184,0) 50%) !important;
    background: -ms-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%, rgba(204,250,184,0) 50%) !important;
    background: linear-gradient(to right, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%, rgba(204,250,184,0) 50%) !important;
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;*/
}

td.dtBlockPM .ui-state-default {
    background: rgba(0,0,0,0) !important;
    background: -moz-linear-gradient(left, rgba(77,230,8,0) 50%,#f0c4fe 50%, #f0c4fe 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(77,230,8,0)), color-stop(50%, #f0c4fe), color-stop(100%, #f0c4fe)) !important;
    background: -webkit-linear-gradient(left, rgba(77,230,8,0) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    background: -o-linear-gradient(left, rgba(77,230,8,0) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    background: -ms-linear-gradient(left, rgba(77,230,8,0) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    background: linear-gradient(to right, rgba(77,230,8,0) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtBlockL2 .ui-state-default {
    /*background: #f0c4fe !important;*/
    background: -moz-linear-gradient(left, #CCCCCC 0%, #f0c4fe 0%, #f0c4fe 50%,rgb(215, 244, 183) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #f0c4fe), color-stop(0%, #f0c4fe), color-stop(50%, #f0c4fe), color-stop(50%,rgb(215, 244, 183))) !important;
    background: -webkit-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%,rgb(215, 244, 183) 50%) !important;
    background: -o-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%,rgb(215, 244, 183) 50%) !important;
    background: -ms-linear-gradient(left, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%,rgb(215, 244, 183) 50%) !important;
    background: linear-gradient(to right, #f0c4fe 0%, #f0c4fe 0%, #f0c4fe 50%,rgb(215, 244, 183) 50%) !important;
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;*/
}

td.dtBlockL1 .ui-state-default {
    background: rgba(0,0,0,0) !important;
    background: -moz-linear-gradient(left, rgba(204,250,184,1) 50%,#f0c4fe 50%, #f0c4fe 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(204,250,184,1)), color-stop(50%, #f0c4fe), color-stop(100%, #f0c4fe)) !important;
    background: -webkit-linear-gradient(left, rgba(204,250,184,1) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    background: -o-linear-gradient(left, rgba(204,250,184,1) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    background: -ms-linear-gradient(left, rgba(204,250,184,1) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    background: linear-gradient(to right, rgba(204,250,184,1) 50%, #f0c4fe 50%, #f0c4fe 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtLeave .ui-state-default {
    background: #ccfab8 !important;
}

td.dtLeaveAM .ui-state-default {
    /*background: rgba(204,250,184,1) !important;*/
    background: -moz-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(204,250,184,1)), color-stop(0%, rgba(204,250,184,1)), color-stop(50%, rgba(204,250,184,1)), color-stop(50%, rgba(204,250,184,0))) !important;
    background: -webkit-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: -o-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: -ms-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: linear-gradient(to right, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;*/
}

td.dtLeavePM .ui-state-default {
    background: rgba(0,0,0,0) !important;
    background: -moz-linear-gradient(left, rgba(77,230,8,0) 50%, rgb(215, 244, 183) 50%, rgba(190,227,156,1) 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(77,230,8,0)), color-stop(50%, rgba(190,227,156,1)), color-stop(100%, rgba(190,227,156,1))) !important;
    background: -webkit-linear-gradient(left, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;
    background: -o-linear-gradient(left, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;
    background: -ms-linear-gradient(left, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;
    background: linear-gradient(to right, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtLeaveAP .ui-state-default {
    background: rgb(204,250,184) !important;
    background: -moz-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(190,227,156,1) 51%, rgba(190,227,156,1) 100%) !important;
    background: -webkit-linear-gradient(left, rgba(204,250,184,1) 0%,rgba(204,250,184,1) 50%,rgba(190,227,156,1) 51%,rgba(190,227,156,1) 100%) !important;
    background: linear-gradient(to right, rgba(204,250,184,1) 0%,rgba(204,250,184,1) 50%,rgba(190,227,156,1) 51%,rgba(190,227,156,1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#aceb00',GradientType=1 ) !important;
}

/* Pending Leave */
td.dtLeaveP .ui-state-default {
    background: #fff393 !important;
}

td.dtLeaveAMP .ui-state-default {
    background: #fff393 !important;
    background: -moz-linear-gradient(left, #fff393 0%, #fff393 0%, #fff393 50%, rgba(77,230,8,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #fff393), color-stop(0%, #fff393), color-stop(50%, #fff393), color-stop(50%, rgba(77,230,8,0))) !important;
    background: -webkit-linear-gradient(left, #fff393 0%, #fff393 0%, #fff393 50%, rgba(77,230,8,0) 50%) !important;
    background: -o-linear-gradient(left, #fff393 0%, #fff393 0%, #fff393 50%, rgba(77,230,8,0) 50%) !important;
    background: -ms-linear-gradient(left, #fff393 0%, #fff393 0%, #fff393 50%, rgba(77,230,8,0) 50%) !important;
    background: linear-gradient(to right, #fff393 0%, #fff393 0%, #fff393 50%, rgba(77,230,8,0) 50%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtLeavePMP .ui-state-default {
    background: rgba(77,230,8,0) !important;
    background: -moz-linear-gradient(left, rgba(77,230,8,0) 50%, #f7e556 50%, #f7e556 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(77,230,8,0)), color-stop(50%, #f7e556), color-stop(100%, #f7e556)) !important;
    background: -webkit-linear-gradient(left, rgba(77,230,8,0) 50%, #f7e556 50%, #f7e556 100%) !important;
    background: -o-linear-gradient(left, rgba(77,230,8,0) 50%, #f7e556 50%, #f7e556 100%) !important;
    background: -ms-linear-gradient(left, rgba(77,230,8,0) 50%, #f7e556 50%, #f7e556 100%) !important;
    background: linear-gradient(to right, rgba(77,230,8,0) 50%, #f7e556 50%, #f7e556 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtLeaveAPP .ui-state-default {
    background: #fff393 !important;
    background: -moz-linear-gradient(left, #fff393 0%, #fff393 50%, #f7e556 50%, #f7e556 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #fff393), color-stop(50%, #fff393), color-stop(50%, #f7e556), color-stop(100%, #f7e556)) !important;
    background: -webkit-linear-gradient(left, #fff393 0%, #fff393 50%, #f7e556 50%, #f7e556 100%) !important;
    background: -o-linear-gradient(left, #fff393 0%, #fff393 50%, #f7e556 50%, #f7e556 100%) !important;
    background: -ms-linear-gradient(left, #fff393 0%, #fff393 50%, #f7e556 50%, #f7e556 100%) !important;
    background: linear-gradient(to right, #fff393 0%, #fff393 50%, #f7e556 50%, #f7e556 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#aceb00', GradientType=1 );
}

/* Draft Leave */
td.dtLeaveD .ui-state-default {
    background: #bedcef !important;
}

td.dtLeaveAMD .ui-state-default {
    background: #bedcef !important;
    background: -moz-linear-gradient(left, #bedcef 0%, #bedcef 0%, #bedcef 50%, rgba(77,230,8,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #bedcef), color-stop(0%, #bedcef), color-stop(50%, #bedcef), color-stop(50%, rgba(77,230,8,0))) !important;
    background: -webkit-linear-gradient(left, #bedcef 0%, #bedcef 0%, #bedcef 50%, rgba(77,230,8,0) 50%) !important;
    background: -o-linear-gradient(left, #bedcef 0%, #bedcef 0%, #bedcef 50%, rgba(77,230,8,0) 50%) !important;
    background: -ms-linear-gradient(left, #bedcef 0%, #bedcef 0%, #bedcef 50%, rgba(77,230,8,0) 50%) !important;
    background: linear-gradient(to right, #bedcef 0%, #bedcef 0%, #bedcef 50%, rgba(77,230,8,0) 50%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtLeavePMD .ui-state-default {
    background: rgba(77,230,8,0) !important;
    background: -moz-linear-gradient(left, rgba(77,230,8,0) 50%, #81ccff 50%, #81ccff 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(77,230,8,0)), color-stop(50%, #81ccff), color-stop(100%, #81ccff)) !important;
    background: -webkit-linear-gradient(left, rgba(77,230,8,0) 50%, #81ccff 50%, #81ccff 100%) !important;
    background: -o-linear-gradient(left, rgba(77,230,8,0) 50%, #81ccff 50%, #81ccff 100%) !important;
    background: -ms-linear-gradient(left, rgba(77,230,8,0) 50%, #81ccff 50%, #81ccff 100%) !important;
    background: linear-gradient(to right, rgba(77,230,8,0) 50%, #81ccff 50%, #81ccff 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;
}

td.dtLeaveAPD .ui-state-default {
    background: #bedcef;
    background: -moz-linear-gradient(left, #bedcef 0%, #bedcef 50%, #81ccff 50%, #81ccff 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, #bedcef), color-stop(50%, #bedcef), color-stop(50%, #81ccff), color-stop(100%, #81ccff));
    background: -webkit-linear-gradient(left, #bedcef 0%, #bedcef 50%, #81ccff 50%, #81ccff 100%);
    background: -o-linear-gradient(left, #bedcef 0%, #bedcef 50%, #81ccff 50%, #81ccff 100%);
    background: -ms-linear-gradient(left, #bedcef 0%, #bedcef 50%, #81ccff 50%, #81ccff 100%);
    background: linear-gradient(to right, #bedcef 0%, #bedcef 50%, #81ccff 50%, #81ccff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#aceb00', GradientType=1 );
}

/*Rest day*/
td.dtWorkOff .ui-state-default {
    background: #efefef !important;
}

/*2nd half day*/
td.dtWorkPM .ui-state-default {
    background: #efefef !important;
    background: rgba(255,255,255,0) !important;
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 50%, #efefef 50%, #efefef 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(255,255,255,0)), color-stop(50%, #efefef), color-stop(100%, #efefef)) !important;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 50%, #efefef 50%, #efefef 100%) !important;
    background: -o-linear-gradient(left, rgba(255,255,255,0) 50%, #efefef 50%, #efefef 100%) !important;
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 50%, #efefef 50%, #efefef 100%) !important;
    background: linear-gradient(to right, rgba(255,255,255,0) 50%, #efefef 50%, #efefef 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=1 ) !important;
}

/*1st half day*/
td.dtWorkAM .ui-state-default {
    background: rgba(77,230,8,0) !important;
    background: -moz-linear-gradient(left, #efefef 0%, #efefef 0%, #efefef 50%, rgba(255,255,255,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #efefef), color-stop(0%, #efefef), color-stop(50%, #efefef), color-stop(50%, rgba(255,255,255,0))) !important;
    background: -webkit-linear-gradient(left, #efefef 0%, #efefef 0%, #efefef 50%, rgba(255,255,255,0) 50%) !important;
    background: -o-linear-gradient(left, #efefef 0%, #efefef 0%, #efefef 50%, rgba(255,255,255,0) 50%) !important;
    background: -ms-linear-gradient(left, #efefef 0%, #efefef 0%, #efefef 50%, rgba(255,255,255,0) 50%) !important;
    background: linear-gradient(to right, #efefef 0%, #efefef 0%, #efefef 50%, rgba(255,255,255,0) 50%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#ffffff', GradientType=1 ) !important;
}
/* =========================================== */

.issImgCircle {
    height: 40px;
    width: 40px;
    border-radius: 50%;
    display: block;
    overflow: hidden;
    margin-top: 5px;
}

.fixed-ratio-resize {
    max-width: 100%;
    height: auto;
    width: auto/9; /*IE8*/
}

.issTitle {
    display: block;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: white;
    /*display: none;*/
    padding-top: 4px;
}

.issSubHdr {
    font-weight: 600;
    padding-left: 4px;
}

/*.iss-auto-width {
    width: auto;
}*/

/*  KIV
 *  Usage: Needs CSS3
 *
 *    <div class="sk-spinner sk-spinner-wave">
 *      <div class="sk-rect1"></div>
 *      <div class="sk-rect2"></div>
 *      <div class="sk-rect3"></div>
 *      <div class="sk-rect4"></div>
 *      <div class="sk-rect5"></div>
 *    </div>
 *
 */
.sk-spinner-wave.sk-spinner {
    margin: 0 auto;
    width: 50px;
    height: 30px;
    text-align: center;
    font-size: 10px;
}

.sk-spinner-wave div {
    background-color: #1ab394;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
}

.sk-spinner-wave .sk-rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.sk-spinner-wave .sk-rect3 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.sk-spinner-wave .sk-rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.sk-spinner-wave .sk-rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

@keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

/*.manFld,
:required {
   border: 1px solid #dc143c !important;
}
    :required:disabled {
        background-color: #eee !important;
        opacity: 1 !important;
    }*/

/*!
 * Start Bootstrap - Simple Sidebar HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

/* Toggle Styles */
.wrapper {
    height: 100%;
    position: fixed;
    top: 10px;
    left: 0;
    right: 0;
    overflow: hidden;
}

#wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    left: 250px !important;
    width: 0;
    height: 100%;
    margin-left: -250px !important;
    overflow-y: auto;
    background: #000;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.sbContainer {
    display: flex;
    flex-direction: row-reverse;
}

.sbClose {
    position: fixed;
    padding: 2px 2px 0 2px;
}

.sbStickyHdr {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}

.sbNonStick {
    margin-top: 45px;
}

#sbMnuitms {
    position: fixed;
    top: 50px;
    left: 50px;
    padding-bottom: 80px; /* To make up for the 'top'*/
    background-color: #000;
    height: 100%;
    overflow: auto;
}

    #sbMnuitms.toggled {
        display: none;
    }

    #sbMnuitms .sbItmlist {
        overflow: auto;
        position: relative;
    }

        #sbMnuitms .sbItmlist ul {
            padding: 5px;
            margin-right: 10px;
            list-style-type: none;
        }

            #sbMnuitms .sbItmlist ul li {
                font-size: .95em;
                color: #9ccffd;
                /*list-style-type: none;*/
            }

                #sbMnuitms .sbItmlist ul li ul {
                    padding: 0 0 0 10px;
                }

                    #sbMnuitms .sbItmlist ul li ul li {
                        padding-bottom: 5px;
                    }

                        #sbMnuitms .sbItmlist ul li ul li a.getpgm {
                            font-size: .92em;
                            color: #f7f5f5;
                        }

#sidebar-wrapper.toggled {
    width: 250px !important;
}

#page-content-wrapper {
    width: 100%;
    position: absolute;
    padding: 15px;
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -50px;
}

/* Sidebar Styles */
.sidebar-nav {
    position: absolute;
    top: 0;
    width: 50px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .sidebar-nav li a {
        display: block;
        text-decoration: none;
        color: #fbfbfb;
    }

        .sidebar-nav li a:hover {
            text-decoration: none;
            color: #fff;
            background: rgba(255,255,255,0.2);
        }

        .sidebar-nav li a:active,
        .sidebar-nav li a:focus {
            text-decoration: none;
        }

    .sidebar-nav > .sidebar-brand {
        height: 65px;
        font-size: 18px;
        line-height: 60px;
    }

        .sidebar-nav > .sidebar-brand a {
            color: #999999;
        }

            .sidebar-nav > .sidebar-brand a:hover {
                color: #fff;
                background: none;
            }

.mini-navbar .nav-second-level {
    left: 50px !important;
}

.nav-second-level li {
    font-size: 0.9em;
    font-weight: bold;
    padding-bottom: 3px !important;
}

    .nav-second-level li a {
        padding: 0 !important;
        font-size: 0.88em;
    }

.mobile-size {
    font-size: 0.8em;
}

.mobile-size-pic {
    width: 30px !important;
    height: 30px !important;
    margin-top: 10px !important;
}

@media(min-width:768px) {
    #wrapper {
        padding-left: 0px !important;
    }

    #sidebar-wrapper {
        width: 0px;
    }

    /* Go To Top */
    #goTopBtn {
        display: none;
        position: fixed;
        bottom: 90px;
        right: 25px;
        line-height: 1.5em;
    }
}

@media(max-width:768px) {
    .body-small #page-wrapper {
        font-size: 0.91em !important;
    }

    #wrapper {
        padding-left: 50px !important;
    }

        #wrapper.toggled {
            padding-left: 0px !important;
        }

    #sidebar-wrapper {
        width: 50px;
    }

    /*Calendar*/
    .fc-toolbar .fc-center h2 {
        font-size: 12px;
    }

    /* Go To Top */
    #goTopBtn {
        display: none;
        position: fixed;
        bottom: 50px;
        right: 20px;
        width: 30px;
        padding: 0;
        margin: 0;
        line-height: 1.5em;
    }
}

#wrapper.toggled #sidebar-wrapper {
    width: 0px;
}

@media(max-width:368px) {
    #picme {
        position: relative;
        margin-right: 0;
    }
}

/*@media(min-width:369px) {
    #picme {*/
/* position: absolute; */
/* margin-right: 0; */
/*}
}*/

.issLogAdj {
    margin-top: -10px;
}

.iss-img-fixed {
    width: 160px !important;
    height: 180px !important;
    overflow-y: hidden;
}

.iss-no-border td {
    border: 0 !important;
}

.findButton {
    top: 0px;
    right: 0px;
    overflow: auto;
    padding-top: 20px;
}

/* Sortable list for drag & drop between divs */
.sortable {
    border: 1px solid #999999;
    overflow-y: scroll;
    overflow-x: hidden;
    text-overflow: ellipsis;
}

.sortable-width {
    border: 1px solid hsl(210, 33%, 60%);
    height: 260px;
    min-width: 250px;
    /*background-color: white;*/
    margin: 0;
    padding: 3px 0 0 0;
    margin-right: 10px;
}

.sortable li {
    list-style-type: none;
    margin: 0 3px 3px 3px;
    /*padding: 5px;
    font-size: 1.2em;*/
    /*width: 120px;*/
}

.sortable-btn {
    margin-top: 70px;
}

/*Preloader*/
.loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3000;
    background-color: rgba(153, 153, 153, 0.4);
}

/*.loader-wrapper .loader-img, .loader-wrapper2 .loader-img {
        display: block;
        position: relative;
        left: 46%;
        top: 50%;
        width: 36px;
        height: 36px;
        margin: -70px 0 0 0;*/
/*background-image: url("../images/coylogosmall36.png");
        background-position: center;
        background-repeat: no-repeat;*/
/*z-index: 3001;
    }*/

#loader {
    display: block;
    position: relative;
    left: 46%;
    top: 50%;
    width: 100px;
    height: 100px;
    margin: -75px 0 0 -33px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #283ef7;
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
    z-index: 3000;
}

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #e7443c;
        -webkit-animation: spin 2s linear infinite;
        animation: spin 2s linear infinite;
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #f8b54f;
        -webkit-animation: spin 1.5s linear infinite;
        animation: spin 1.5s linear infinite;
    }

.loaded .loader-wrapper {
    visibility: hidden;
}

/* 2022051301 CSL */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ -ms-transform: rotate(0deg);
        IE 9 transform: rotate(0deg);
        Firefox 16+, IE 10+, Opera*/
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        /*Chrome, Opera 15+, Safari 3.1+ -ms-transform: rotate(360deg);
        IE 9 transform: rotate(360deg);
        Firefox 16+, IE 10+, Opera*/
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        /* Chrome, Opera 15+, Safari 3.1+ -ms-transform: rotate(0deg);
        IE 9 transform: rotate(0deg);
        Firefox 16+, IE 10+, Opera*/
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        /*Chrome, Opera 15+, Safari 3.1+ -ms-transform: rotate(360deg);
        IE 9 transform: rotate(360deg);
        Firefox 16+, IE 10+, Opera*/
    }
}

/* Blinking text */
.blinkingRedTxt {
    animation: blinkingText 1.2s infinite;
}

@keyframes blinkingText {
    0% {
        color: #dc143c;
    }

    49% {
        color: #dc143c;
    }

    60% {
        color: transparent;
    }

    99% {
        color: transparent;
    }

    100% {
        color: #dc143c;
    }
}
/* End */

.issBorderTotal {
    border-top: solid 1px #000;
    border-bottom: solid 1px #000;
}

.issBorderGrandTotal {
    border-top: solid 1px #000;
    border-bottom: double 3px #000;
}

.issFont8 {
    font-size: 8pt;
}

.issFontU {
    text-decoration: underline;
}

.issFontI {
    font-style: italic;
}

.issFontVerdana {
    font-family: Verdana;
}

.issFontRed {
    color: #dc143c;
}

.issFontGreen {
    color: #07e608;
}

.iss-bg-danger {
    background-color: #f2dede !important;
}

/* Print styling */
@media print {

    [class*="col-sm-"] {
        float: left;
    }

    [class*="col-xs-"] {
        float: left;
    }

    .col-sm-12, .col-xs-12 {
        width: 100% !important;
    }

    .col-sm-11, .col-xs-11 {
        width: 91.66666667% !important;
    }

    .col-sm-10, .col-xs-10 {
        width: 83.33333333% !important;
    }

    .col-sm-9, .col-xs-9 {
        width: 75% !important;
    }

    .col-sm-8, .col-xs-8 {
        width: 66.66666667% !important;
    }

    .col-sm-7, .col-xs-7 {
        width: 58.33333333% !important;
    }

    .col-sm-6, .col-xs-6 {
        width: 50% !important;
    }

    .col-sm-5, .col-xs-5 {
        width: 41.66666667% !important;
    }

    .col-sm-4, .col-xs-4 {
        width: 33.33333333% !important;
    }

    .col-sm-3, .col-xs-3 {
        width: 25% !important;
    }

    .col-sm-2, .col-xs-2 {
        width: 16.66666667% !important;
    }

    .col-sm-1, .col-xs-1 {
        width: 8.33333333% !important;
    }

    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-xs-1,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12 {
        float: left !important;
    }

    body {
        margin: 0;
        padding: 0 !important;
        min-width: 768px;
    }

    .container {
        width: auto;
        min-width: 750px;
    }

    body {
        font-size: 10px;
    }

    a[href]:after {
        content: none;
    }

    .noprint,
    .btn,
    .footer {
        display: none !important;
    }

    .pyStsE {
        background-color: #fac4c4 !important;
    }

    .pyStsP {
        background-color: #e5f9be;
    }
}
/* Print styling */

/* ReportWriter */
.rwLRB {
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: gray;
}

.rwRB {
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: gray;
}

.rwLTRB {
    border-left: 1px solid;
    border-top: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: gray;
}

.rwB2 {
    border-bottom: 1px solid;
    border-color: gray;
}

.rwLT2B2 {
    border-left: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-color: gray;
}

.rwTRB, .rwT2RB2 {
    border-top: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: gray;
}

.rwHdr {
    height: 60px;
    margin: 20px 0 20px 0;
    background-color: #bdd7f8;
    border: solid 1px gray;
    padding: 3px;
}

.rwInnerHdr {
    height: 100%;
    float: left;
    padding-top: 15px;
}

.rwInnerHdrLeft {
    width: 33%;
    text-align: left;
}

.rwInnerHdrCentre {
    width: 33%;
    text-align: center;
}

.rwInnerHdrRight {
    width: 34%;
    text-align: right;
}

/* Rotate headers to 45 degress angle */
/* .rotate {
    height: 160px;
    width: 40px;
    white-space: nowrap;
}

    .rotate > div {
        transform: translate(0px, 130px) rotate(-90deg);
        width: 20px;
    }

        .rotate > div > span {
            padding: 5px 10px;
        } */
/*.rotateText{
     vertical-align: bottom;
     padding-bottom: 5px;
 }*/
.vertText {
    writing-mode: vertical-lr;
    text-orientation: mixed;
}

.rotateTr {
    border-bottom: solid 1px #ccc;
}

.slTable > thead > tr > th,
.slTable > tbody > tr > th,
.slTable > tfoot > tr > th,
.slTable > thead > tr > td,
.slTable > tbody > tr > td,
.slTable > tfoot > tr > td {
    border-top: 1px solid #e7eaec;
    line-height: 1.42857;
    padding-right: 8px !important;
    vertical-align: top;
}

.slpadding td {
    padding: 2px !important;
}

.hiliteText {
    color: #6dc219;
    font-weight: bold;
}

/*.table.table-sm.table-condensed {
    font-size: 1em;
    width: 100%;
    max-width: 100%;*/
    /*margin-bottom: 10px;*/
    /*padding: 2px;
}*/

    /*.table.table-sm.table-condensed tbody tr td {
        padding: 3px;
    }*/

.fixedTopScreen {
    position: fixed;
    top: 0;
    width: 100%;
    height: 10px;
    z-index: 99999;
}

.fixedBottomScreen {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 20px;
    z-index: 99999;
}

.col-centred {
    float: none;
    margin: 0 auto;
}
/*To override the css found in bootstrap.css*/
.table .table {
    background-color: transparent !important;
}

.formWrapper {
    font-size: 9pt !important;
    line-height: 138%;
}

.landscape {
    transform: rotate(-90deg) translate(-100%,0);
    transform-origin: left top;
    width: 100vh;
    overflow-x: hidden;
    /*position: absolute;
    top: 100%;
    left: 0;*/
}

.vertAlignTop {
    vertical-align: top;
}

.flexCell {
    display: flex;
    align-items: center;
    border: none;
}

.mnucls {
    position: absolute;
    top: 60px;
    width: 100%;
    z-index: 100;
}

.mnuOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
    background-color: rgba(172, 174, 174, 0.7);
}

/* Use @media to determine width of text before showing ellipsis */
.ellipse100 {
    white-space: nowrap;
    width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Extra small devices (portrait phones, less than 576px) */
/*@media (max-width: 575.98px) {
    .hasEllipsis {
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 60px;
    }
}*/

/* Small devices (landscape phones, 576px and up) */
/*@media (min-width: 576px) and (max-width: 767.98px) {
    .hasEllipsis {
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 150px;
    }
}*/

/* Medium devices (tablets, 768px and up) */
/*@media (min-width: 768px) and (max-width: 991.98px) {
    .hasEllipsis {
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 200px;
    }
}*/

/* Large devices (desktops, 992px and up) */
/*@media (min-width: 992px) and (max-width: 1199.98px) {
    .hasEllipsis {
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 300px;
    }
}*/

/* Extra large devices (large desktops, 1200px and up) */
/*@media (min-width: 1200px) {
    .hasEllipsis.ellipse {
        width: 350px;
    }
}*/

.labelTitle {
    color: #6db8ee;
}

.issMustFill {
    color: #dc143c;
}

.modal {
    background-color: rgb(174 174 174 / 50%);
}

.footnoteItalics {
    font-family: system-ui;
    font-size: 0.9em;
    font-style: italic;
}

/* Go top button */
/*#goTopBtn {
    display: none;
    position: fixed;
    bottom: 90px;
    right: 25px;
}*/

/* For iss-selectbox padding */
.iss-selectbox input[type=text] {
    padding: 6px 12px;
}

/* Show Help icon after each element in wrapper div if there is any help text */
/*.wrapper label[title]:not(.nohelpimg):not(.clearSearch):not(.ellipsis):not(.radio-inline):not(.checkbox-inline):not(.gotradio)::before,
.wrapper label[for]:not(.nohelpimg):not(.clearSearch):not(.ellipsis):not(.radio-inline):not(.checkbox-inline):not(.gotradio)::before,
.wrapper span[title]:not(.nohelpimg):not(.clearSearch):not(.ellipsis):not(.radio-inline):not(.checkbox-inline):not(.gotradio)::before,
.wrapper span[for]:not(.nohelpimg):not(.clearSearch):not(.ellipsis):not(.radio-inline):not(.checkbox-inline):not(.gotradio)::before {
    content: "\f05a";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    color: #03a9f4;
    padding-right: 2px;
}*/

/* Show Help icon after each element in wrapper div if there is any help text */
/*.wrapper label[title].radio-inline::after,
.wrapper label[for].radio-inline::after,
.wrapper span[title].radio-inline::after,
.wrapper span[for].radio-inline::after {*/
/*.wrapper label[title][class*='gotradio']::after,
.wrapper span[title][class*='gotradio']::after,
.wrapper label[for][class*='gotradio']::after,
.wrapper span[for][class*='gotradio']::after,
.wrapper label[title][class*='radio']::after,
.wrapper label[for][class*='radio']::after,
.wrapper span[title][class*='radio']::after,
.wrapper span[for][class*='radio']::after,
.wrapper label[title][class*='checkbox']::after,
.wrapper label[for][class*='checkbox']::after,
.wrapper span[title][class*='checkbox']::after,
.wrapper span[for][class*='checkbox']::after {
    content: "\f05a";
    font-family: 'Line Awesome Free';
    font-weight: 900;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    color: #03a9f4;
    padding-left: 2px;
}*/

/* To override the dataTables icons when column overflows */
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child:before {
    top: 9px;
    left: 4px;
    height: 12px;
    width: 12px;
    display: block;
    position: absolute;
    color: white;
    border: 1px solid white;
    border-radius: 10px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    /*font-family: 'Courier New', Courier, monospace;*/
    line-height: 10px;
    content: '+';
    background-color: #337ab7;
}

/*table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    content: '-';
    line-height: 10px;
    background-color: #e91e63;
}*/

/* Line Awesome - colours */
.la-icon-primary {
    color: #1ab394;
}

.la-icon-success {
    color: #1c84c6;
}

.la-icon-info {
    color: #23c6c8;
}

.la-icon-warning {
    color: #f8ac59;
}

.la-icon-danger {
    color: #ed5565;
}

.la-icon-default {
    color: inherit;
}

/*#printHdrLeft,
#printHdrRight{
    display: none;
}*/

.ibox.mnu .ibox-content a:hover::after {
    content: "  \f0a5";
    font-family: 'Line Awesome Free';
    font-weight: 600;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    color: deeppink;
    padding-right: 2px;
}

/*.iss-notis .iss-badge {
    position: relative;
    z-index: 1000;
}*/

.iss-badge {
    position: relative;
    /*top: -5px;*/
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    line-height: 1;
    background-color: #f99930;
    color: #fff;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    margin-left: 2px;
    text-shadow: none;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    border-radius: 10px;
    z-index: 1000;
}

.nobadge.iss-badge {
    display: none;
}

/* For Kridens' horizontal stcked bar chart */
@keyframes expand {
    from {
        width: 0%;
    }

    to {
        width: 100%;
    }
}
/* 2022051301 CSL */
/*@media screen and (min-width: 768px) {
    @keyframes expand {
        from {
            width: 0%;
        }
        to {
            width: calc(100% - 75px);
        }
    }
}*/

.hbChart {
    overflow: hidden;
    width: 0%;
    animation: expand 1.5s ease forwards;
}

.row + .row .hbChart {
    animation-delay: .2s;
}

.row + .row + .row .hbChart {
    animation-delay: .4s;
}

.hbBlock {
    display: block;
    height: 14px;
    color: #fff;
    font-size: .75em;
    float: left;
    background-color: #81ccff;
    position: relative;
    overflow: hidden;
    opacity: 1;
    transition: opacity, .3s ease;
    cursor: pointer;
    text-shadow: 1px 1px #333;
}

.hbLegend li:nth-of-type(1):before {
    background-color: #81ccff;
}

.hbBlock:nth-of-type(2),
.hbLegend li:nth-of-type(2):before {
    background-color: #45B29D;
}

.hbBlock:nth-of-type(3),
.hbLegend li:nth-of-type(3):before {
    background-color: #EFC94C;
}

.hbBlock:nth-of-type(4),
.hbLegend li:nth-of-type(4):before {
    background-color: #E27A3F;
}

.hbBlock:nth-of-type(5),
.hbLegend li:nth-of-type(5):before {
    background-color: #DF5A49;
}

.hbBlock:nth-of-type(6),
.hbLegend li:nth-of-type(6):before {
    background-color: #962D3E;
}

.hbBlock:nth-of-type(7),
.hbLegend li:nth-of-type(7):before {
    background-color: #cd041c;
}

.hbBlock:nth-of-type(8),
.hbLegend li:nth-of-type(8):before {
    background-color: #dc143c;
}

.hbBlock:hover {
    opacity: .65;
}

.hbValue {
    display: block;
    line-height: 0.5em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%);
}

.hb-x-axis {
    text-align: center;
    padding: .5em 0 2em;
}

.hb-y-axis {
    height: 20px;
    transform: translate(-32px,170px) rotate(270deg);
    position: absolute;
    left: 0;
}

.hbLegend {
    margin: 0 auto;
    padding: 0;
    font-size: .9em;
}

    .hbLegend li {
        display: inline-block;
        padding: .25em 1em;
        line-height: 1em;
    }

        .hbLegend li:before {
            content: "";
            margin-right: .5em;
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #334D5C;
        }

@media screen and (min-width: 768px) {
    /* h6 {
        padding: 0;
        width: 75px;
        float: left;
        line-height: 100px;
    }*/

    .hbBlock {
        font-size: 1em;
    }

    .hbLegend {
        width: 50%;
    }
}
/* End of horizontal bar chart */

.nosorticon thead .sorting,
.nosorticon thead .sorting_asc,
.nosorticon thead .sorting_desc {
    background: none;
}

#btnGo {
    height: 28px;
}

.navlist {
    position: absolute;
    top: 0;
    background-color: #273a4a;
    width: 200px;
    z-index: 1000;
    transition: all 0.4s;
}

    .navlist a:hover {
        color: aquamarine;
        text-decoration: none;
    }

.nav_sidebar_opened {
    position: relative;
    margin: 0 0 0 200px;
    transition: all 0.4s;
}

.sidebar_separator {
    height: 5px;
}

.sidebar_header {
    background-color: #1b5789;
    padding: 3px 0;
}

table tr td a:hover {
    color: #c105fc;
}

.menuWrapper {
    min-height: calc(100vh);
}

.hdrWrapper {
    padding: 0 10px 30px 10px;
}

.pageHdr {
    padding: 0 6px 0 6px;
}

/*
.page1 {
    overflow-y: auto;
}*/

.pageb4 {
    page-break-before: always;
    padding: 0 6px 0 6px;
    /* overflow-y: auto;*/
}

.trbg {
    background-color: #e0e0e0;
    height: 26px;
}

.trbg2 {
    background-color: #e1e1e1;
    height: 26px;
}

.trbg3 {
    background-color: #e0effc;
}

.tblDsp2 select:not([multiple]),
.tblDsp2 input[type=text],
.tblDsp2 input[type=status],
.tblDsp2 input[type=ex_dt],
.tblDsp select:not([multiple]),
.tblDsp input[type=text],
.tblDsp input[type=status],
.tblDsp input[type=password],
.tblDsp input[type=ex_dt] {
    height: 26px !important;
    font-size: 12px !important;
    border-collapse: collapse;
    box-sizing: border-box;
    /*border: 1px solid gray;*/
}

.tblDsp2 tr,
.tblDsp tr {
    height: 26px !important;
    font-size: 12px !important;
    border-collapse: collapse;
    box-sizing: border-box;
}

    .tblDsp2 tr th,
    .tblDsp2 tr td {
        border-collapse: collapse;
        box-sizing: border-box;
    }

    .tblDsp tr th,
    .tblDsp tr td {
        border-collapse: collapse;
        box-sizing: border-box;
        padding: 1px 2px;
    }

.tblDsp2 textarea,
.tblDsp textarea {
    font-family: "Roboto", "Open Sans", "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif !important;
    font-size: 12px !important;
}

.tblDsp2 input[type=file],
.tblDsp2 input[type=submit],
.tblDsp2 input[type=button],
.tblDsp input[type=file],
.tblDsp input[type=submit],
.tblDsp input[type=button] {
    height: 26px;
}

.btmlines > tr > th,
.btmlines > thead > tr > th,
.btmlines > tr > td,
.btmlines > tbody > tr > td {
    border-bottom: 1px solid gray;
}

/* Draw table lines */
/* ================= */
.tblGrid > tr > th,
.tblGrid > thead > tr > th,
.tblGrid > tr > td,
.tblGrid > tbody > tr > td {
    border-bottom: 1px solid gray;
    border-left: 1px solid gray;
    padding: 2px;
}

    /* Get the last cell in table row */
    .tblGrid > tr > th:nth-last-child(-n+1),
    .tblGrid > thead > tr > th:nth-last-child(-n+1),
    .tblGrid > tr > td:nth-last-child(-n+1),
    .tblGrid > tbody > tr > td:nth-last-child(-n+1) {
        border-right: 1px solid gray;
    }

/* Get the first table row */
.btmlines > tr:first-child > th,
.btmlines > thead > tr:first-child > th,
.tblGrid > tr:first-child > th,
.tblGrid > thead > tr:first-child > th,
.btmlines > tr:first-child > td,
.btmlines > tbody > tr:first-child > td,
.tblGrid > tr:first-child > td,
.tblGrid > tbody > tr:first-child > td {
    border-top: 1px solid gray;
}
/* ================= */

#ddlFNm,
#ddlOperator,
#txtkword,
#Search,
#NoRecs {
    height: 28px;
}

#NoRecs {
    width: 40px !important;
}

#btnJump {
    width: 50px;
}

table #radiobtn th,
table #radiobtn td {
    border: none !important;
}

.empTxt {
    color: #024aea;
    font-weight: bold;
}

/*.totalBorder {
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
}*/

/* Custom scrollbar. Added 2021-07-30 */
/* width */
.customscrollbar::-webkit-scrollbar {
    width: 5px;
}

/* Track */
.customscrollbar::-webkit-scrollbar-track {
    background: #e1e1e1;
}

/* Handle */
.customscrollbar::-webkit-scrollbar-thumb {
    background: #81c6db;
}

    /* Handle on hover */
    .customscrollbar::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

/* Used in programs with 2 div boxes for dragging items from left to right */
DIV.c1 {
    POSITION: relative;
    OVERFLOW: hidden;
    TOP: 0px;
    LEFT: 0px;
}

DIV.c2 {
    Z-INDEX: 1;
    POSITION: relative;
    WIDTH: 100px;
    HEIGHT: 300px;
    OVERFLOW: auto;
    TOP: 0px;
    LEFT: 0px;
}

DIV.c3 {
    HEIGHT: 280px;
    OVERFLOW: hidden;
}

/* For employee work calendar with leave taken */
/* =========================================== */
.dtCustom {
    opacity: 1 !important;
    /*width: 36px;*/
}

/* Declared holiday */
.dtHolidayFD, .dtHolidayFD span, .dtHolidayFD a {
    background-color: #f398aa !important;
}

/* Holiday 1st half leave - AM on a full work day */
.dtHolidayH1, .dtHolidayH1 span, .dtHolidayH1 a {
    background: linear-gradient(to bottom right, #f398aa 50%, #ededed 50%) !important;
}

/* Holiday 2nd half leave - H2 on a full work day */
.dtHolidayH2, .dtHolidayH2 span, .dtHolidayH2 a {
    background: linear-gradient(to bottom right, #ededed 50%, #f398aa 50%) !important;
}

/* Holiday 1st half leave - AM on a half work day */
.dtHolidayH110, .dtHolidayH110 span, .dtHolidayH110 a {
    background: linear-gradient(to bottom right, #f398aa 50%, transparent 50%) !important;
}

/* Holiday 2nd half leave - H2 on a half work day */
.dtHolidayH201, .dtHolidayH201 span, .dtHolidayH201 a {
    background: linear-gradient(to bottom right, transparent 50%, #f398aa 50%) !important;
}

/* Blocked date */
.dtBlockFD, .dtBlockFD span, .dtBlockFD a {
    background-color: #cacaca !important;
}

/* Holiday 1st half leave - H1 on a full work day */
.dtBlockH1, .dtBlockH1 span, .dtBlockH1 a {
    background: linear-gradient(to bottom right, #cacaca 50%, #ededed 50%) !important;
}

/* Holiday 2nd half leave - H2 on a full work day */
.dtBlockH2, .dtBlockH2 span, .dtBlockH2 a {
    background: linear-gradient(to bottom right, #ededed 50%, #cacaca 50%) !important;
}

/* Holiday 1st half leave - H1 on a half work day */
.dtBlockH110, .dtBlockH110 span, .dtBlockH110 a {
    background: linear-gradient(to bottom right, #cacaca 50%, transparent 50%) !important;
}

/* Holiday 2nd half leave - H2 on a half work day */
.dtBlockH201, .dtBlockH201 span, .dtBlockH201 a {
    background: linear-gradient(to bottom right, transparent 50%, #cacaca 50%) !important;
}

/* Approved leave - full day */
.dtAprLeave, .dtAprLeave span, .dtAprLeave a {
    background: #86cd67 !important;
}

/* Approved leave - AM */
.dtAprLeaveAM, .dtAprLeaveAM span, .dtAprLeaveAM a {
    /*background: rgba(204,250,184,1) !important;*/
    /*background: -moz-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(204,250,184,1)), color-stop(0%, rgba(204,250,184,1)), color-stop(50%, rgba(204,250,184,1)), color-stop(50%, rgba(204,250,184,0))) !important;
    background: -webkit-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: -o-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: -ms-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;
    background: linear-gradient(to bottom right, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(204,250,184,0) 50%) !important;*/
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;*/
    background: linear-gradient(to bottom right, #86cd67 50%, #ededed 50%) !important;
}

/* Approved leave - PM */
.dtAprLeavePM, .dtAprLeavePM span, .dtAprLeavePM a {
    /*background: rgba(0,0,0,0) !important;
    background: -moz-linear-gradient(left, rgba(77,230,8,0) 50%, rgb(215, 244, 183) 50%, rgba(190,227,156,1) 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(77,230,8,0)), color-stop(50%, rgba(190,227,156,1)), color-stop(100%, rgba(190,227,156,1))) !important;
    background: -webkit-linear-gradient(left, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;
    background: -o-linear-gradient(left, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;
    background: -ms-linear-gradient(left, rgba(77,230,8,0) 50%, rgba(190,227,156,1) 50%, rgba(190,227,156,1) 100%) !important;*/
    background: linear-gradient(to bottom right, #ededed 50%, #86cd67 50%) !important;
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;*/
}

/* Approved/Pending leave */
.dtAprPndLeave, .dtAprPndLeave span, .dtAprPndLeave a {
    background: rgb(204,250,184) !important;
    /*  background: -moz-linear-gradient(left, rgba(204,250,184,1) 0%, rgba(204,250,184,1) 50%, rgba(190,227,156,1) 51%, rgba(190,227,156,1) 100%) !important;
    background: -webkit-linear-gradient(left, rgba(204,250,184,1) 0%,rgba(204,250,184,1) 50%,rgba(190,227,156,1) 51%,rgba(190,227,156,1) 100%) !important;
    background: linear-gradient(to right, rgba(204,250,184,1) 0%,rgba(204,250,184,1) 50%,rgba(190,227,156,1) 51%,rgba(190,227,156,1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#aceb00',GradientType=1 ) !important;*/
}

/* Pending Leave */
.dtPndLeave, .dtPndLeave span, .dtPndLeave a {
    background: #ffbc58 !important;
}

.dtPndLeaveAM, .dtPndLeaveAM span, .dtPndLeaveAM a {
    /*background: #ffbc58 !important;
    background: -moz-linear-gradient(left, #ffbc58 0%, #ffbc58 0%, #ffbc58 50%, rgba(77,230,8,0) 50%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #ffbc58), color-stop(0%, #ffbc58), color-stop(50%, #ffbc58), color-stop(50%, rgba(77,230,8,0))) !important;
    background: -webkit-linear-gradient(left, #ffbc58 0%, #ffbc58 0%, #ffbc58 50%, rgba(77,230,8,0) 50%) !important;
    background: -o-linear-gradient(left, #ffbc58 0%, #ffbc58 0%, #ffbc58 50%, rgba(77,230,8,0) 50%) !important;
    background: -ms-linear-gradient(left, #ffbc58 0%, #ffbc58 0%, #ffbc58 50%, rgba(77,230,8,0) 50%) !important;
    background: linear-gradient(to right, #ffbc58 0%, #ffbc58 0%, #ffbc58 50%, rgba(77,230,8,0) 50%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#4de608', GradientType=1 ) !important;*/
    background: linear-gradient(to bottom right, #ffbc58 50%, #ededed 50%) !important;
}

.dtPndLeavePM, .dtPndLeavePM span, .dtPndLeavePM a {
    /* background: rgba(77,230,8,0) !important;
    background: -moz-linear-gradient(left, rgba(77,230,8,0) 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(50%, rgba(77,230,8,0)), color-stop(50%, #ffbc58), color-stop(100%, #ffbc58)) !important;
    background: -webkit-linear-gradient(left, rgba(77,230,8,0) 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: -o-linear-gradient(left, rgba(77,230,8,0) 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: -ms-linear-gradient(left, rgba(77,230,8,0) 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: linear-gradient(to right, rgba(77,230,8,0) 50%, #ffbc58 50%, #ffbc58 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#4de608', GradientType=1 ) !important;*/
    background: linear-gradient(to bottom right, #ededed 50%, #ffbc58 50%) !important;
}

/* Pending/Approved leave */
.dtPndAprLeave, .dtPndAprLeave span, .dtPndAprLeave a {
    /* background: #ffbc58 !important;
    background: -moz-linear-gradient(left, #ffbc58 0%, #ffbc58 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: -webkit-gradient(left top, right top, color-stop(0%, #ffbc58), color-stop(50%, #ffbc58), color-stop(50%, #ffbc58), color-stop(100%, #ffbc58)) !important;
    background: -webkit-linear-gradient(left, #ffbc58 0%, #ffbc58 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: -o-linear-gradient(left, #ffbc58 0%, #ffbc58 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: -ms-linear-gradient(left, #ffbc58 0%, #ffbc58 50%, #ffbc58 50%, #ffbc58 100%) !important;
    background: linear-gradient(to right, #ffbc58 0%, #ffbc58 50%, #ffbc58 50%, #ffbc58 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4de608', endColorstr='#aceb00', GradientType=1 );*/
    background: linear-gradient(to right, #ffbc58 0%, #ffbc58 50%, #ffbc58 50%, #ffbc58 100%) !important;
}

/*1st half day*/
.dtWorkH1, .dtWorkH1 span, .dtWorkH1 a {
    background: linear-gradient(to bottom right, #efefef 50%, transparent 50%) !important;
}

/*2nd half day*/
.dtWorkH2, .dtWorkH2 span, .dtWorkH2 a {
    background: linear-gradient(to right, transparent 50%, #efefef 50%) !important;
}

/*Rest day*/
.dtWorkOff {
    opacity: .35 !important;
}

.ui-state-disabled {
    pointer-events: auto !important;
}

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
    opacity: 1;
}

/*.numFld,
.stayRight {
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}*/

.bgDialog {
    background-color: #e7f4fa;
}

/* 20230215 .input-group-addon {
    background-color: #bbdefb !important;
}*/

/* For dataTable responsive display */
table.dataTable .dtr-control.gotAppr::before {
    font-family: "Line Awesome Free";
    content: "+\f249";
}

table.dataTable .dtr-control.notAppr::before {
    font-family: "Line Awesome Free";
    /*content: "+ ";*/
    content: " ";
}

/* For dataTable responsive display - approval status */
table.dataTable .dtr-control.stsD::before {
    font-family: "Line Awesome Free";
    content: "+D";
    /*content: "+\f568";*/
}

table.dataTable .dtr-control.stsA::before {
    font-family: "Line Awesome Free";
    color: #1ab394;
    content: "+\f164";
}

table.dataTable .dtr-control.stsR::before {
    font-family: "Line Awesome Free";
    color: #dc143c;
    content: "+\f165";
}

table.dataTable .dtr-control.stsC::before,
table.dataTable .dtr-control.stsX::before {
    font-family: "Line Awesome Free";
    color: #9c0000;
    content: "+\2613";
}

table.dataTable .dtr-control.sts1::before {
    font-family: "Line Awesome Free";
    content: "+\2780";
}

table.dataTable .dtr-control.sts2::before {
    font-family: "Line Awesome Free";
    content: "+\2781";
}

table.dataTable .dtr-control.sts3::before {
    font-family: "Line Awesome Free";
    content: "+\2782";
}

.breakAll {
    /*word-break: break-all;*/
    word-wrap: break-word;
}