* {
    font-family: Segoe UI, SegoeUILoad;
}

body {
    padding: 0px;
    margin: 0;
    height: 100%;
    max-width: 100%;
    width: 100%;
    overflow-x: hidden;
}

@font-face {
    font-family: CalibriLoad;
    src: url(fonts/Calibri/Calibri.ttf);
}

@font-face {
    font-family: "TahomaLoad";
    src: url(fonts/Tahoma/Tahoma.ttf);
}

@font-face {
    font-family: "SegoeUILoad";
    font-weight: 200;
    src: url(fonts/SegoeUI/segoeuil.ttf);
}

@font-face {
    font-family: "SegoeUILoad";
    font-weight: 300;
    src: url(fonts/SegoeUI/segoeuisl.ttf);
}

@font-face {
    font-family: "SegoeUILoad";
    font-weight: 400;
    src: url(fonts/SegoeUI/segoeui.ttf);
}

body {
    font-size: 0.85em;
}

@media (min-width: 900px) {
}


.rblContainer.required.error {
    border: 1px solid red;
}

@media (min-width: 1200px) {
    html {
        font-size: 100%;
    }

    .grdView, .grdSelected, .grdCollapsible {
    }

        .grdSelected .grdSelected {
            font-size: 1em;
        }
}

span {
    font-family: Segoe UI, SegoeUILoad !important;
    font-size: 1em;
}

fieldset {
    border: 0px;
    margin: 0;
    padding: 0;
}

label {
    color: #555;
    font-size: 10px;
}

    label.lblfactbox {
        font-weight: bold;
    }

div.divFactBox {
    background-color: #F0F0F0;
    padding: 5px;
}

@media only screen and (max-width: 1100px) {
    div.divFactBox {
        display: none;
    }
}

div.divfactboxinformationtext {
    color: #0077D6;
    margin-bottom: 10px;
    min-height: 15px;
}

div.divContainerEntryControl {
    margin-bottom: 5px;
}

input.txtCustomNumber {
    text-align: right;
}

input.number {
    text-align: right;
}

input.time, input.colorpicker, input.timesecond {
    text-align: center;
}

input, textarea {
    font-size: 0.96em;
}

    input[type="text"], input[type="password"] {
        height: 23px;
    }

.spnButton {
    padding: 5px 10px;
    width: 60px;
    text-align: center;
    display: inline-block;
}

    .spnButton[enabled="false"] { /*background-color: #EAEAEA; color: #BEBEBE;*/
        background-color: #EFEFEF;
        color: #7A7A7A;
        cursor: not-allowed;
    }

.tdTabPage {
    padding: 10px 15px 0 15px;
    border-right: 1px solid #AAA;
    background-color: white;
    cursor: pointer;
}

    .tdTabPage:hover {
        background-color: darkgray;
    }

    .tdTabPage.selected {
        background-color: orange;
    }

/* #region Drop Down Check List */
.dropdown-check-list {
    display: inline-block;
    position: relative;
    border: 1px solid #aaa;
    padding: 0;
    height: 16px;
    height: 25px;
    margin-bottom: 0;
}

    .dropdown-check-list .anchor {
        color: black;
        position: relative;
        cursor: pointer;
        height: 16px;
        display: inline-block;
        padding-top: 5px;
        font-size: 11px;
        width: 100%;
        background-image: url(../images/down-arrow2.png);
        background-position: center right;
        background-repeat: no-repeat;
        overflow-y: hidden;
    }

        .dropdown-check-list .anchor:active:after {
            right: 8px;
            top: 21%;
        }

    .dropdown-check-list ul.items {
        padding: 2px;
        display: none;
        margin: 0;
        border: 1px solid #aaa;
        border-top: none;
        position: absolute;
        top: 30px;
        background-color: white;
        width: 100%;
    }

        .dropdown-check-list ul.items li {
            list-style: none;
        }

    .dropdown-check-list .grdSelected {
        display: none
    }

    .dropdown-check-list.visible .grdSelected {
        display: block
    }

    .dropdown-check-list.visible .anchor {
        color: #0094ff;
    }

    .dropdown-check-list.visible .items {
        display: block;
    }
/* #endregion */

select {
    -webkit-appearance: button;
    -moz-appearance: button;
    -webkit-user-select: none;
    -moz-user-select: none;
    background-color: #FFF; /* fallback color if gradients are not supported */
    background-image: url(../images/down-arrow2.png); /* For Chrome and Safari */
    background-image: url(../images/down-arrow2.png); /* For old Fx (3.6 to 15) */
    background-image: url(../images/down-arrow2.png); /* For pre-releases of IE 10*/
    background-image: url(../images/down-arrow2.png); /* For old Opera (11.1 to 12.0) */
    background-image: url(../images/down-arrow2.png); /* Standard syntax; must be last */
    background-position: center right;
    background-repeat: no-repeat;
    border: 1px solid #AAA;
    font-size: 11px !important;
    /*border-radius: 2px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    color: #555;*/
    font-size: inherit;
    margin: 0;
    overflow: hidden;
    padding-top: 3px;
    padding-bottom: 3px;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: 27px;
}


/*input[type="text"], input[type="password"], textarea   {
    border-radius: 1.5em;
    border: none;
    padding: 0.2em;
    
    padding: 0.2em 10px;
    moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
     box-sizing: border-box; 
    outline: none;
    box-shadow: 0 4px 6px -5px hsl(0, 0%, 40%), inset 0px 4px 6px -5px hsl(0, 0%, 2%)
}
input[type="text"], input[type="password"]   { height: 27px;  }
input[type="button"], input[type="submit"]    {
    border-radius: 1.5em;
    border: none;
    outline: none;
    box-shadow: 0 4px 6px -5px hsl(0, 0%, 40%), inset 0px 4px 6px -5px hsl(0, 0%, 2%)
}
input[type="checkbox"]{
    width: 1.3em;
    height: 1.3em;
    background-color: white;
    border-radius: 50%;
    vertical-align: middle;
    border: 1px solid #ddd;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
}
input[type="checkbox"]:checked {
    background-color: gray;
}*/

input[type="button"], input[type="submit"] {
    cursor: pointer;
    border: 0px;
    height: 24px;
    min-width: 70px;
}

button {
    cursor: pointer;
    border: 0px;
    height: 24px;
}

input[type="button"].btnSearch {
    background-image: url('../images/Icon/search_white.png');
    background-repeat: no-repeat;
    background-position: center;
    min-width: 28px;
}

button.btnSearch {
    min-width: 28px;
}

.btnAutoCompleteEntry {
    margin-left: 2px;
}

input[type="button"][enabled="false"] { /*background-color: #EAEAEA; color: #BEBEBE;*/
    background-color: #EFEFEF;
    color: #7A7A7A;
    cursor: not-allowed;
}

input[type="button"].btnMore {
    min-width: 20px;
}

input[type="button"].btnLink {
    background-color: transparent;
    color: #5200FD;
    min-width: 10px !important;
}

    input[type="button"].btnLink:hover {
        text-decoration: underline;
    }

.btnSmall {
    min-width: 20px !important;
    margin-left: 0;
}

input[type="button"].btnMore.btnSmall {
    min-width: 15px;
}

.btnQuickSearchIcon {
    position: absolute;
    top: 1px;
    right: 5px;
    font-size: 13px;
    color: gray;
    min-width: 20px !important;
    max-width: 20px !important;
    background-color: transparent !important;
    background-image: url('../images/QuickSearchIcon.PNG');
    background-repeat: no-repeat;
    background-position: left center;
    outline: 0;
}

.badge {
    background-color: #fa3e3e;
    border-radius: 2px;
    color: white;
    padding: 1px 3px;
    font-size: 10px;
    position: absolute;
    top: 0;
    right: 0;
}

.highlightText {
    background-color: yellow;
}

.watermark {
    color: #AAA !important;
}

.borderBox {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.boxShadow {
    box-shadow: 5px 5px 10px #888888;
}

div.ui-datepicker {
    font-size: 12px;
}

input.datepicker {
    text-align: center;
}

select option {
    min-height: 1.5em;
    font-size: 12px;
}

textarea {
    resize: none;
}

.dxpcHeader td {
    font-family: Segoe UI;
}

.imgLink {
    cursor: pointer;
}

.imgDisabled {
    cursor: not-allowed;
}

.containerUlTabPage {
    width: 100%;
    height: 26px;
    border-bottom: 1px solid #E6E6E6;
}

.ulTabPage {
    margin: 0 0 0 0px;
    padding: 0;
    padding-top: 0px;
}

    .ulTabPage li {
        border: 1px solid transparent;
        color: #959595;
        font-weight: lighter;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        list-style-type: none;
        display: inline-block;
        min-width: 150px;
        padding: 0 10px;
        height: 26px;
        text-align: center;
        font-size: 18px;
    }

        .ulTabPage li:hover {
            border: 1px solid #E6E6E6;
            border-bottom: 0px;
        }

        .ulTabPage li.selected {
            height: 28px;
            color: #2B6690;
            font-weight: bold;
            background-color: White;
            border: 1px solid #E6E6E6;
            border-bottom: 0px;
        }

.containerUlTabControl {
    width: 100%;
    height: 18px;
    border-bottom: 1px solid #E6E6E6;
}

.ulTabControl {
    margin: 0 0 0 0px;
    padding: 0;
    padding-top: 0px;
}

    .ulTabControl li {
        border: 1px solid transparent;
        color: #959595;
        font-weight: lighter;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        list-style-type: none;
        display: inline-block;
        width: 150px;
        height: 18px;
        text-align: center;
        font-size: 12px;
    }

        .ulTabControl li:hover {
            border: 1px solid #E6E6E6;
            border-bottom: 0px;
        }

        .ulTabControl li.selected {
            height: 20px;
            color: #2B6690;
            font-weight: bold;
            background-color: White;
            border: 1px solid #E6E6E6;
            border-bottom: 0px;
        }

.lblEmptyText {
    color: #bebebe;
}

.lblReadOnlyText {
    color: Maroon;
}

.txtCurrency, .txtNumeric {
    text-align: right;
}

.ui-datepicker-trigger {
    margin-bottom: -5px;
}

.thCenter {
    text-align: center !important;
}

.thRight {
    text-align: right !important;
}

.navbar {
    background-color: Black;
    border: 1px solid White;
    border-top: 0px;
    position: fixed;
    top: 0;
    left: 50px;
    width: 100%;
    height: 33px;
    z-index: 20000;
    overflow: hidden;
}

.sidenav {
    cursor: pointer;
    height: 100%;
    width: 40px;
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    background-color: #333;
    overflow-x: hidden;
    padding-left: 10px;
    padding-top: 5px;
    overflow: visible;
}

    .sidenav a:hover {
        color: #f1f1f1;
    }

    .sidenav .tooltip {
        position: relative;
        display: inline-block;
        border-bottom: 1px dotted black;
    }

        .sidenav .tooltip .tooltiptext {
            visibility: hidden;
            width: 120px;
            background-color: #555;
            color: #fff;
            text-align: center;
            padding: 3px 0;
            border-radius: 6px;
            top: -5px;
            left: 105%;
            position: absolute;
            z-index: 10;
        }

        .sidenav .tooltip:hover .tooltiptext {
            visibility: visible
        }

.circlemenusidebar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 13px;
    color: #333;
    line-height: 30px;
    margin-bottom: 10px;
    text-align: center;
    background: #FFF;
}

    .circlemenusidebar:nth-child(1) {
        background-color: #72cbd1;
    }

    .circlemenusidebar:nth-child(2) {
        background-color: #ba80b9;
    }

    .circlemenusidebar:nth-child(3) {
        background-color: #f75e7a;
    }

    .circlemenusidebar:nth-child(4) {
        background-color: #40B9DE;
    }

    .circlemenusidebar:nth-child(5) {
        background-color: #d154ae;
    }

    .circlemenusidebar:nth-child(6) {
        background-color: #f03c5c;
    }

    .circlemenusidebar:nth-child(7) {
        background-color: #0ea0e3;
    }

/* Style the tab */
.tab {
    margin-left: 90px;
    overflow: hidden;
    padding-top: 3px;
    max-width: 600px;
}

    .tab .fa-close:hover {
        background-color: #AAA;
    }
    /* Style the buttons inside the tab */
    .tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        transition: 0.3s;
        font-size: 12px;
        padding: 5px 5px;
        height: 25px;
        border: 1px solid black;
        border-bottom: 0px;
        margin-right: 5px;
        background-color: #222;
        color: #FFF;
    }

        .tab button.selected {
            background-color: #fff;
            color: #000;
        }
        /* Change background color of buttons on hover */
        .tab button:hover {
            background-color: #ddd;
            color: #000;
        }
        /* Create an active/current tablink class */
        .tab button.active {
            background-color: #ccc;
            color: #000;
        }
/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}

.maincontent {
    padding-top: 1px;
    padding-left: 10px;
    margin-top: 30px;
    margin-left: 40px;
}

.sidenavfull {
    height: 100%;
    width: 250px;
    position: fixed;
    z-index: 20001;
    top: 0;
    left: 0;
    background-color: #333;
    overflow-x: visible;
    padding-top: 5px;
    color: #FFF;
}

    .sidenavfull a, .sidenavfull .dropdown-btn {
        padding: 6px 8px 6px 16px;
        text-decoration: none;
        font-size: 20px;
        color: #FFF;
        display: block;
        border: none;
        background: none;
        width: 100%;
        text-align: left;
        cursor: pointer;
        outline: none;
    }

    .sidenavfull .dropdown-container {
        display: none;
        background-color: #262626;
        padding-left: 8px;
    }

    .sidenavfull .fa-caret-down {
        float: right;
        padding-right: 8px;
    }

.leftmenu * {
    font-size: 18px;
}

.leftmenu .child2 * {
    font-size: 14px !important;
}

.leftmenu .parent {
    display: block;
    position: relative;
}

    .leftmenu .parent a {
        color: #FFFFFF;
        text-decoration: none;
    }

    .leftmenu .parent:hover > ul {
        display: block;
        position: absolute;
    }

.leftmenu .child {
    display: none;
}

    .leftmenu .child li {
        background-color: #333;
        color: white;
        line-height: 20px;
        width: 250px;
    }

.leftmenu .child2 li {
    background-color: #fff;
    color: #000;
}

.leftmenu .child li a {
    color: white;
}

.leftmenu .child2 li a {
    color: #000;
}

.leftmenu ul {
    list-style: none;
    margin: 0;
    padding: 0px;
    min-width: 10em;
}

    .leftmenu ul ul ul {
        left: 100%;
        top: 0;
        margin-left: 1px;
    }

.leftmenu li:hover {
    background-color: #EAEAEA;
    color: black;
}

    .leftmenu li:hover > a {
        color: black;
    }

.leftmenu .parent li:hover {
    background-color: #EAEAEA;
    color: black;
}

.leftmenu .expand {
    position: absolute;
    top: 3px;
    right: 10px;
    margin-right: 0px;
}


input[type="checkbox"][disabled="disabled"] {
    background-color: #FFFFFF;
    padding: 0;
}

.wordwrap {
    white-space: pre-wrap; /* CSS3 */
    white-space: -moz-pre-wrap; /* Firefox */
    white-space: -pre-wrap; /* Opera <7 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* IE */
}

.tblBannerDetailInformation * {
    font-size: 12px;
}

.tblBannerDetailInformation .tdLabel {
    padding-right: 0;
    font-style: italic;
    text-align: right;
    color: #2560E2;
}

/* #region Search Dialog */
.dxpcHeader {
    padding: 5px 10px !important;
    color: #F00 !important;
}

    .dxpcHeader td {
        color: #F00 !important;
    }

.dxpcContent {
    font-size: 13px;
}

    .dxpcContent * {
        font-size: 13px;
    }

    .dxpcContent .grdView {
        font-size: 12px;
    }
/* #endregion */

/* #region Calendar */
.specialDate a.ui-state-default {
    background: red !important;
    color: #FFF;
}

.specialDate a.ui-state-hover {
    background: red !important;
}
/* #endregion */

/* #region Left Pane */
.leftPane {
    display: none;
    background-color: White;
    border: 1px solid black;
    color: White;
    z-index: 10;
    position: fixed;
    top: 45px;
    left: 55px;
}

    .leftPane ul li {
        border: 3px solid white;
        cursor: pointer;
        margin: 0 10px 10px 0;
        text-align: center;
        width: 120px;
        display: inline-block;
        padding: 0.2em 0;
        list-style-type: none;
        font-size: 10px;
        padding: 5px;
    }

        .leftPane ul li div {
            color: #B7B7B7;
            font-size: 12px;
        }

        .leftPane ul li:hover {
            background-color: #AAA;
        }

            .leftPane ul li:hover div {
                color: #FFF;
            }
    /*.leftPane ul li.selected { background-color: #6ABE42; }*/
    .leftPane ul {
        margin: 0;
        padding: 0;
        max-width: 450px;
        margin-bottom: 10px;
        margin-left: 20px;
        margin-right: 10px;
    }

        .leftPane ul li:active {
            background-color: #939DB6;
            color: #32353D;
        }

    .leftPane h6 {
        padding: 0;
        margin: 0;
        color: #FFFFFF;
        font-size: 32px;
        font-weight: 100;
    }

.arrow-up {
    display: none;
    z-index: 10002;
    position: fixed;
    top: 35px;
    left: 60px;
}

.clear-arrow {
    display: none;
    z-index: 10003;
    position: fixed;
    top: 45px;
    left: 63px;
    height: 10px;
    width: 18px;
    background-color: White;
}

.arrow-up:after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    margin-top: 1px;
    margin-left: 2px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid white;
}

.arrow-up:before {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid black;
}
/* #endregion */

/* #region Toolbar Area Header */
.toolbarAreaHeader {
    width: 100%;
    vertical-align: middle;
}

    .toolbarAreaHeader ul {
        display: table-cell;
        list-style-type: none;
        margin: 0;
        padding: 0;
        height: 100%;
        padding: 2px;
    }

        .toolbarAreaHeader ul li {
            display: inline-block;
            padding: 0 1em;
            cursor: pointer;
            text-align: center;
            height: 100%;
        }

            .toolbarAreaHeader ul li div {
                width: 100%;
                text-align: center;
                color: White;
                font-size: 0.8em;
                margin-top: -2px;
            }

            .toolbarAreaHeader ul li:hover {
            }
/* #endregion */

/* #region Navigation Pane */
.ulNavigationPane {
    margin: 0px;
    margin-left: 0px;
}

    .ulNavigationPane li {
        font-weight: lighter;
        color: #AAA;
        margin: 0 20px;
        cursor: pointer;
        list-style-type: none;
        display: inline-block;
        text-align: center;
        font-size: 18px;
    }

        .ulNavigationPane li.selected {
            color: #000;
            font-weight: 400;
        }
/* #endregion */

/* #region Context Menu */
.context-menu {
    z-index: 30000;
    position: fixed;
    border: solid 1px #111;
    box-shadow: 5px 5px 10px #A8A8A8;
    background-color: white;
    padding: 5px 0;
    display: none;
}

    .context-menu ol {
        padding: 0;
        margin: 0;
        list-style-type: none;
        min-width: 130px;
        width: auto;
        max-width: 200px;
    }

        .context-menu ol li {
            margin: 0;
            display: block;
            list-style: none;
            zoom: 0;
            padding: 1px 5px;
        }

            .context-menu ol li:not(.disabled):hover {
                background-color: #efefef;
            }

            .context-menu ol li:not(.disabled):active {
                color: White;
                background-color: #000;
            }

        .context-menu ol .list-devider {
            padding: 0px;
            margin: 0px;
        }

            .context-menu ol .list-devider:hover { /*background-color: #efefef;*/
            }

            .context-menu ol .list-devider hr {
                margin: 2px 0px;
                border: none;
                height: 1px;
                color: blue;
                background: #A8A8A8;
            }

        .context-menu ol li a {
            color: Black;
            text-decoration: none;
            display: block;
            padding: 0px 5px;
        }

        .context-menu ol li.disabled a {
            color: #BBB;
            cursor: default;
        }

        .context-menu ol li:not(.disabled) a:active {
            color: White;
        }
/* #endregion */

/* #region Toast Panel */
.toastPanel {
    display: none;
}

    .toastPanel .tblToast {
        display: table;
        position: fixed;
        top: 0;
        left: 0;
        width: 99.9%;
        height: 100%;
        z-index: 29010;
    }

    .toastPanel .tblCellToast {
        margin: 0;
        padding: 0;
        display: table-cell;
        text-align: center;
        vertical-align: middle;
        z-index: 0;
    }

    .toastPanel .blanket {
        width: 100%;
        height: 100%;
        z-index: 29000;
        background-color: #8C8C8C;
        opacity: 0.65;
        position: fixed;
        top: 0;
        left: 0;
    }

    .toastPanel .toastBox {
        background-color: #FFF;
        width: 100%;
        min-height: 150px;
        margin: auto;
        position: relative;
    }

        .toastPanel .toastBox input[type=button], .toastPanel .toastBox input[type=submit] {
            border: 1px solid black;
        }

        .toastPanel .toastBox .btnClose {
            position: absolute;
            bottom: 20px;
            right: 130px;
            color: #000;
            background-color: #CCCCCC;
        }

        .toastPanel .toastBox .btnOK {
            position: absolute;
            bottom: 20px;
            right: 260px;
            color: #FFF;
            background-color: #14984C;
        }

        .toastPanel .toastBox .messageContainer {
            color: #000;
            text-align: left;
            padding-left: 150px;
            padding-top: 10px;
            font-size: 16px;
        }

            .toastPanel .toastBox .messageContainer h2 {
                font-size: 28px;
                padding: 0;
                margin: 0;
                font-weight: normal;
            }
/* #endregion */

/* #region Right Panel Popup */
.rightPanelPopup {
    display: none;
}

    .rightPanelPopup .tblRightPanel {
        display: none;
        background-color: #FFF;
        height: 100%;
        position: fixed;
        top: 0;
        right: 0;
    }

    .rightPanelPopup .blanket {
        width: 100%;
        height: 100%;
        z-index: 29000;
        background-color: #8C8C8C;
        opacity: 0.65;
        position: fixed;
        top: 0;
        left: 0;
    }

    .rightPanelPopup .toastBox {
        position: relative;
    }

    .rightPanelPopup .divRightPanelPopupClose {
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .rightPanelPopup .toastBox .messageContainer {
        color: #000;
        text-align: left;
        padding-left: 150px;
        padding-top: 10px;
        font-size: 16px;
    }

        .rightPanelPopup .toastBox .messageContainer h2 {
            font-size: 28px;
            padding: 0;
            margin: 0;
            font-weight: normal;
        }
/* #endregion */

/* #region Custom Popup */
.customPopup {
}

    .customPopup .tblPopup {
        z-index: 14001;
        height: 100%;
        position: absolute;
        top: 150px;
        left: 50%;
    }

    .customPopup .toastBox {
        position: relative;
        left: -50%;
        background-color: #FFF;
        padding: 10px;
        box-shadow: 0px 0px 5px 5px #888888;
    }

    .customPopup .popupBlanket {
        width: 100%;
        height: 100%;
        z-index: 14000;
        background-color: #8C8C8C;
        opacity: 0.65;
        position: fixed;
        top: 33px;
        left: 0;
    }

    .customPopup .divRightPanelPopupClose {
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .customPopup .toastBox .messageContainer {
        color: #000;
        text-align: left;
        padding-left: 150px;
        padding-top: 10px;
        font-size: 16px;
    }

        .customPopup .toastBox .messageContainer h2 {
            font-size: 28px;
            padding: 0;
            margin: 0;
            font-weight: normal;
        }
/* #endregion */

/* #region Login */
.loginBg {
    width: 100%;
    padding: 2px 20px;
    font-size: 2.5em;
    margin-bottom: 10px;
}

.loginContainerLoginInfo table td:first-child {
    text-align: right;
    padding-right: 10px;
}

.loginContainerLoginInfo table td + td {
    padding-right: 10px;
}

.loginContainerLoginInfo table td {
    font-size: 1em;
}

.loginContainerLoginInfo input[type=button] {
    padding: 1px 20px;
}

.loginContainerLoginInfo {
    opacity: 0.6;
    padding: 3px;
}

#loginUlListModule {
    padding: 0;
    margin: 0;
    width: 100%;
}

    #loginUlListModule li {
        list-style-type: none;
        display: inline-block;
        margin: 0;
        margin-bottom: 10px;
        width: 23%;
    }

        #loginUlListModule li img {
            width: 100%;
        }

        #loginUlListModule li div {
            opacity: 0.6;
            font-size: 0.35em;
            background-color: #555;
            color: #FFF;
            text-align: center;
            padding: 5px 0;
            width: 100%;
        }

            #loginUlListModule li div.enabled {
                opacity: 1;
            }

        #loginUlListModule li img {
            opacity: 0.6;
            margin: 0;
            padding: 0;
            display: block;
            margin-bottom: 4px;
            cursor: auto;
        }

            #loginUlListModule li img.enabled {
                opacity: 1;
                cursor: pointer;
            }

        #loginUlListModule li.enabled:hover {
            box-shadow: 0px 0px 10px #444;
        }

#loginFooter {
    font-size: 0.8em;
    margin-top: 0px;
    color: #666;
}

.pnlUserLoginInformation {
    font-size: 1.4em;
    height: 85px;
    padding-top: 2px;
    padding-left: 20px;
}

.lnkLogout {
    color: #FFF;
    text-decoration: none;
    font-size: 0.9em;
    cursor: pointer;
    clear: both;
}

    .lnkLogout:hover {
        text-decoration: underline;
    }
/* #endregion */

/* #region Content Page */
.hospitalName {
    font-size: 1.5em;
}

.containeruserlogininfo {
    float: right;
    margin: 0px 10px 0 0;
    font-size: 1.1em;
    padding-top: 0;
}

.tdImgModuleHome {
    height: 33px;
    text-align: center;
    padding: 0 5px;
    cursor: pointer;
}

.userlogininfo {
    cursor: pointer;
    padding: 1px 2px;
}

.userlogininfodetail {
    width: 220px;
    height: 80px;
    position: fixed;
    right: 8px;
    display: none;
    z-index: 10000;
}

.pageInformation {
    margin-bottom: 5px;
    margin-top: -5px;
    font-size: 30px;
    padding-bottom: 3px;
    color: #666666;
    font-weight: 200;
}

.breadcrumbs {
    font-weight: normal;
    margin-bottom: 17px;
    font-size: 12px;
    color: #666666;
    background-color: #F4F4F4;
    margin-top: 5px;
    padding: 7px 5px;
}

    .breadcrumbs div {
        display: inline-block;
        margin: 0 15px;
    }

        .breadcrumbs div:first-child {
            margin-left: 5px;
        }

        .breadcrumbs div.divSeparator {
            margin: 0;
        }

.containerHomeClose img {
    cursor: pointer;
}

div.pageTitle {
    padding: 3px 5px;
    font-size: 1.2em;
}

.tblContentArea {
    width: 100%;
}

    .tblContentArea > tr > td {
        vertical-align: top;
    }

h5 {
    font-weight: bold;
    font-size: 15px;
    margin: 0;
    margin-top: 4px;
    padding: 1px 2px;
    color: Blue;
}

h4 {
    font-weight: 200;
    font-size: 20px !important;
    margin: 0;
    margin-top: 4px;
    padding: 1px 2px;
}

h3 {
    font-weight: 100;
    margin: 0;
    padding: 0;
    font-size: 30px;
    margin-bottom: 0px;
}

.tblContentArea h4:not(:first-child) {
    margin-top: 30px;
}

.lblLink {
    cursor: pointer;
}

    .lblLink:hover {
        text-decoration: underline;
    }

.lblMandatory:after {
    content: " *";
    color: #F00;
}

.lblMandatory {
    margin-right: -11px;
}

.lblInvalid:after {
    content: " *";
}

.lblInvalid {
    margin-right: -11px;
    color: Red !important;
}

.lblDisabled {
}

.tdLabel {
    text-align: right;
    padding-right: 20px;
}

.tdPatientBannerLabel {
    text-align: right;
    font-style: italic;
    padding-right: 10px;
}

.tblPatientBannerInfo {
    font-size: 0.9em;
}

.tblEntryContent {
    width: 100%;
    margin-bottom: 6px;
    padding-right: 20px;
    background-color: white;
    border: 1px solid #E6E6E6;
    border-top: 2px solid #0077D6;
}

.tblEntryDetail {
    width: 100%;
    padding: 5px;
    margin-bottom: 10px;
    background-color: #DEE3E7;
}

/* #endregion */

/* #region Grid */
.pnlContainerGrid {
    background-color: #FFF;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: 456px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #EDEDED;
}

.pnlContainerGridPatientPage {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: 370px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #EDEDED;
}

.pnlContainerGrid * {
    font-size: 1em;
}

.pnlContainerGridPatientPage * {
}

td.tdExpand {
    vertical-align: middle;
    padding-top: 5px;
    text-align: center;
}

.grdTotal {
    width: 100%;
    border: 0;
}

.grdView {
    width: 100%;
    border: 0;
}

    .grdView .keyField {
        display: none;
    }

    .grdView .hiddenColumn {
        display: none;
    }

    .grdView th {
        font-weight: normal;
        padding: 5px 5px;
    }

        .grdView th.ASC:after {
            content: '      ' url('../images/up-arrow.png');
        }

        .grdView th.DESC:after {
            content: '      ' url('../images/down-arrow.png');
        }
    /*.grdView tr:not(:first-child)   { cursor: pointer; }*/
    .grdView > tbody > tr > td {
        vertical-align: top;
        padding: 5px;
    }

    .grdView:not(.notAllowSelect) tr:not(:first-child) {
        cursor: pointer;
    }

    .grdView .tdMobile {
        display: none;
    }


.grdInlineEditing th {
    font-weight: normal;
    padding: 0px 5px;
}

.grdInlineEditing > tbody > tr > td {
    vertical-align: middle;
    padding: 1px 5px;
}
/*.grdView tr:not(:first-child)   { cursor: pointer; }*/

.imgLoadingGrdView {
    background-color: White;
    border: 1px solid #AAA;
    text-align: center;
    vertical-align: middle;
    z-index: 100;
    width: 70px;
    height: 35px;
    position: absolute;
    left: 48%;
    top: 20%;
    display: none;
}

    .imgLoadingGrdView img {
        margin: auto;
    }

.grdCollapsible {
    width: 100%;
    border: 0;
    font-size: 13px;
}

    .grdCollapsible > tbody > tr > td {
        vertical-align: top;
        padding: 5px;
    }

    .grdCollapsible > tbody > tr.expanded > td {
        padding-bottom: 0px;
    }

    .grdCollapsible > tbody > tr > th {
        padding: 5px 5px;
        font-weight: normal;
    }

    .grdCollapsible > tbody > tr > td.tdExpand {
        padding-top: 10px;
        width: 15px;
    }

    .grdCollapsible > tbody > tr:nth-child(4n+1) td,
    .grdCollapsible > tbody > tr:nth-child(4n-1) td {
        padding-top: 0;
    }

    .grdCollapsible .keyField {
        display: none;
    }

    .grdCollapsible .hiddenColumn {
        display: none;
    }

    .grdCollapsible th {
        text-align: left;
        text-transform: uppercase;
        background-color: #D8D8D8;
        border: 0;
        padding: 3px 0;
    }

    .grdCollapsible:not(.notAllowSelect) > tbody > tr:not(.trDetail) {
        cursor: pointer;
    }

.divDetailEdit,
.divDetailDelete {
    cursor: pointer;
    padding: 2px;
    font-size: 12px;
    color: Blue;
}

    .divDetailEdit:hover {
        text-decoration: underline;
    }

    .divDetailDelete:hover {
        background-color: #AAA;
        color: White;
    }

    .divDetailDelete:before {
        content: "\2715 ";
    }

.grdCollapsible .divTrxDetail {
    font-size: 12px;
}

.grdCollapsible b {
    color: #FF2E12;
}

.grdSelected > tbody > tr.trHeader > td {
    font-weight: bold;
}

.grdSelected {
    width: 100%;
    border: 0;
}

    .grdSelected > tbody > tr > td {
        vertical-align: top;
        padding: 5px;
    }

        .grdSelected > tbody > tr > td.tdExpand {
            vertical-align: middle;
        }

    .grdSelected .keyField {
        display: none;
    }

    .grdSelected .hiddenColumn {
        display: none;
    }

    .grdSelected th {
        font-weight: normal;
        padding: 5px 5px;
    }

        .grdSelected th.ASC:after {
            content: '      ' url('../images/up-arrow.png');
        }

        .grdSelected th.DESC:after {
            content: '      ' url('../images/down-arrow.png');
        }
    /*.grdSelected tr:not(:first-child)   { cursor: pointer; }*/
    .grdSelected tr td a {
        color: #0066FF;
        cursor: pointer;
    }

        .grdSelected tr td a:hover {
            text-decoration: underline;
        }

    .grdSelected .tdMobile {
        display: none;
    }

.grdNormal {
    width: 100%;
    border: 0;
}

    .grdNormal td {
        vertical-align: top;
    }

    .grdNormal .keyField {
        display: none;
    }

    .grdNormal .hiddenColumn {
        display: none;
    }

    .grdNormal th {
        font-weight: normal;
        padding: 2px 0;
    }

        .grdNormal th.ASC:after {
            content: '      ' url('../images/up-arrow.png');
        }

        .grdNormal th.DESC:after {
            content: '      ' url('../images/down-arrow.png');
        }
    /*.grdSelected tr:not(:first-child)   { cursor: pointer; }*/
    .grdNormal tr td a {
        color: #0066FF;
        cursor: pointer;
    }

        .grdNormal tr td a:hover {
            text-decoration: underline;
        }

    .grdPatientPage *, .grdNormal *, .grdView *, .grdSelected * {
        font-size: 12px;
    }

.grdPatientPage {
    font-size: 0.95em;
}

    .grdPatientPage input[type="text"], .grdNormal input[type="text"],
    /*.grdView input[type="text"], .grdSelected input[type="text"]     { height: 18px; }*/
    /* #endregion */
    /* #region Drop Down Menu */
    .sf-menu, .sf-menu * {
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .sf-menu li {
            position: relative;
        }

        .sf-menu ul {
            position: absolute;
            display: none;
            top: 100%;
            left: 0;
            z-index: 99;
            width: 250px;
        }

        .sf-menu > li {
            float: left;
        }

        .sf-menu li:hover > ul, .sf-menu li.sfHover > ul {
            display: block;
        }

        .sf-menu a {
            display: block;
            font-size: 12px;
            position: relative;
            width: 230px;
        }

        .sf-menu ul ul.sf-menu ul ul, .sf-menu ul ul ul {
            top: 0;
            left: 250px;
        }

/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 1em;
    margin-top: -3px;
    height: 0;
    width: 0;
    border: 5px solid transparent;
    border-top-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
    border-top-color: rgba(255,255,255,.5);
}

.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
    border-top-color: white; /* IE8 fallback colour */
}
/* styling for right-facing arrows */
.sf-arrows ul .sf-with-ul:after {
    margin-top: -5px;
    margin-right: -3px;
    border-color: transparent;
    border-left-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
    border-left-color: rgba(255,255,255,.5);
}

.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul:after,
.sf-arrows ul .sfHover > .sf-with-ul:after {
    border-left-color: white;
}
/* adding sf-vertical class in addition to sf-menu creates a vertical menu */
/* eg. <ul class="sf-menu sf-vertical"> ... */
.sf-vertical {
    width: 12em;
    /* If you want the width of the closed menu to expand to its
  widest top-level menu item (like its "Supersubs" submenus do),
  replace the width rule above with the following two rules. */
    /*
  min-width: 12em;
  *width: 12em;
  */
}

    .sf-vertical ul {
        left: 109%;
        top: 0;
    }

    .sf-vertical > li {
        float: none;
    }

    .sf-vertical li {
        width: 230px;
    }
    /*** alter arrow directions ***/
    .sf-vertical.sf-arrows > li > .sf-with-ul:after {
        margin-top: -5px;
        margin-right: -3px;
        border-color: transparent;
        border-left-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
        border-left-color: rgba(255,255,255,.5);
    }

    .sf-vertical.sf-arrows li > .sf-with-ul:focus:after,
    .sf-vertical.sf-arrows li:hover > .sf-with-ul:after,
    .sf-vertical.sf-arrows .sfHover > .sf-with-ul:after {
        border-left-color: white;
    }

    .sf-vertical.sf-arrows .liHeader > .sf-with-ul:focus:after,
    .sf-vertical.sf-arrows .liHeader:hover > .sf-with-ul:after,
    .sf-menu li li {
        background: #FFF;
        color: #545454;
    }

        .sf-menu li li li {
            background: #FFF;
            color: #545454;
        }

.sf-menu a, .sf-menu a:visited {
    color: #545454;
}

.sf-menu li {
    background: #333;
}

.sf-menu liHeader a {
    color: white;
}

.sf-menu a:focus,
.sf-menu a:hover,
.sf-menu a:hover,
.sf-menu li:hover {
    color: #FFF;
}

.sf-menu .liHeader > a {
    color: #FFF;
}

    .sf-menu .liHeader > a:hover,
    .sf-menu .liHeader > a:focus {
        color: #545454;
        background: #FFF;
    }
/* #endregion */

/* #region Intellisense TextBox */
.containerIntellisense {
    position: relative;
    text-align: left;
    font-size: 0.8em;
}

    .containerIntellisense .contentText {
        font-size: 1em;
        margin: 0 2px;
        color: #000;
    }

    .containerIntellisense .intellisenseBox {
        font-size: 1em;
        position: absolute;
        top: 26px;
        left: 0;
        background-color: #EAEAEA;
        border: 1px solid #7C7C7C;
        background: -moz-linear-gradient(top, #FFFFFF 0%, #E8E9F2 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#E8E9F2)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #FFFFFF 0%,#E8E9F2 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #FFFFFF 0%,#E8E9F2 100%); /* Opera11.10+ */
        background: linear-gradient(top, #FFFFFF 0%,#E8E9F2 100%); /* W3C */
        display: none;
        vertical-align: middle;
        z-index: 10000;
    }

    .containerIntellisense .intellisenseContentInfo {
        float: left;
        margin-right: 10px;
        margin-left: -5px;
        vertical-align: middle;
    }

        .containerIntellisense .intellisenseContentInfo img {
            vertical-align: middle;
            margin-top: -4px;
            cursor: pointer;
        }

    .containerIntellisense .intellisenseContent {
        margin: 2px 0 0 10px;
        display: inline-block;
    }

    .containerIntellisense .intellisenseContentText {
        display: inline-block;
        margin-right: 10px;
        color: #000;
    }

        .containerIntellisense .intellisenseContentText b {
            color: #000;
        }

    .containerIntellisense .intellisenseDescription {
        margin-right: 10px;
        margin-bottom: 2px;
        font-style: italic;
        color: #000;
    }

        .containerIntellisense .intellisenseDescription b {
            color: #000;
        }

table.tblContainerTextBox {
    background-color: white;
    border: 1px #BABABA solid;
    height: 30px;
}

    table.tblContainerTextBox.error {
        border: 1px #F00 solid;
    }

input.txtIntellisense, input.txtAutoComplete {
    background-color: white;
}

table.tblContainerTextBox input.txtIntellisense {
    height: 19px;
    border: 0px;
    font-family: Segoe UI, SegoeUILoad;
    font-size: 13px;
    font-weight: 200;
    margin-left: 1px;
    margin-right: 1px;
    margin-bottom: 2px;
    color: Black;
}
/* #endregion */

/* #region QIS Search Text Box */
.containerAutoComplete {
    position: relative;
    text-align: left;
}

    .containerAutoComplete .imgLoadingAutoComplete {
        display: none;
    }

    .containerAutoComplete .containerAutoCompleteIntellisenseBox {
        display: none;
        position: absolute;
        top: 22px;
        left: 0;
        background-color: #FFFFFF;
        border: 1px solid #7C7C7C; /*display:none;*/
        z-index: 10000;
        vertical-align: middle;
        font-size: 12px;
    }

    .containerAutoComplete .autoCompleteBox {
        margin-top: 5px;
        display: none;
    }

    .containerAutoComplete .autoCompleteContent {
        max-height: 150px;
        overflow-y: auto;
        position: relative;
    }

    .containerAutoComplete .tblAutoCompleteContent {
        font-size: 0.9em;
    }

        .containerAutoComplete .tblAutoCompleteContent th {
            background-color: #9CC525;
            padding: 7px 5px;
            padding: 5px;
            border-right: 1px solid #EEEEEE;
            border-bottom: 1px solid #EEEEEE;
            cursor: default;
        }

        .containerAutoComplete .tblAutoCompleteContent tr:hover th {
            color: #000;
        }

        .containerAutoComplete .tblAutoCompleteContent th:hover {
            color: #000;
        }

        .containerAutoComplete .tblAutoCompleteContent tr {
            cursor: pointer;
        }

            .containerAutoComplete .tblAutoCompleteContent tr.selected {
                background-color: #F4921B;
                color: #FFF;
            }

            .containerAutoComplete .tblAutoCompleteContent tr:hover {
                background-color: #FFA55A;
                color: #FFF;
            }

        .containerAutoComplete .tblAutoCompleteContent td {
            padding: 5px;
            border-right: 1px solid #EEEEEE;
            border-bottom: 1px solid #EEEEEE;
            vertical-align: top;
        }

    .containerAutoComplete .containerAutoCompleteIntellisenseBox {
        font-size: 12px;
        font-family: Calibri, CalibriLoad;
        border: 1px solid #7C7C7C;
        vertical-align: middle;
        font-size: 12px;
        z-index: 10000;
    }

    .containerAutoComplete .autoCompleteIntellisenseBox {
        background-color: #F4F4F4;
        padding-bottom: 5px;
        display: none;
    }

    .containerAutoComplete .autoCompleteIntellisenseContent {
        margin: 2px 0 0 10px;
        display: inline-block;
    }

    .containerAutoComplete .autoCompleteIntellisenseContentText {
        display: inline-block;
        margin-right: 10px;
    }

    .containerAutoComplete .intellisenseDescription {
        margin-right: 10px;
        margin-bottom: 2px;
        font-style: italic;
    }

    .containerAutoComplete .autoCompleteTitle {
        padding-left: 5px;
    }
/* #endregion */

/* #region Quick Search */
.containerQuickSearch {
    position: relative;
    text-align: left;
}

    .containerQuickSearch .imgLoadingQuickSearch {
        display: none;
    }

    .containerQuickSearch .containerQuickSearchIntellisenseBox {
        display: none;
        position: absolute;
        top: 22px;
        left: 0;
        background-color: #FFFFFF;
        border: 1px solid #7C7C7C; /*display:none;*/
        z-index: 10000;
        vertical-align: middle;
        font-size: 12px;
    }

    .containerQuickSearch .autoCompleteBox {
        margin-top: 5px;
        display: none;
    }

    .containerQuickSearch .autoCompleteContent {
        max-height: 150px;
        overflow-y: auto;
        position: relative;
    }

    .containerQuickSearch .tblQuickSearchContent {
        font-size: 0.9em;
    }

        .containerQuickSearch .tblQuickSearchContent th {
            background-color: #9CC525;
            padding: 7px 5px;
            padding: 5px;
            border-right: 1px solid #EEEEEE;
            border-bottom: 1px solid #EEEEEE;
            cursor: default;
        }

        .containerQuickSearch .tblQuickSearchContent tr:hover th {
            color: #000;
        }

        .containerQuickSearch .tblQuickSearchContent th:hover {
            color: #000;
        }

        .containerQuickSearch .tblQuickSearchContent tr {
            cursor: pointer;
        }

            .containerQuickSearch .tblQuickSearchContent tr.selected {
                background-color: #F4921B;
                color: #FFF;
            }

            .containerQuickSearch .tblQuickSearchContent tr:hover {
                background-color: cornflowerblue;
                color: #FFF;
            }

        .containerQuickSearch .tblQuickSearchContent td {
            padding: 5px;
            border-right: 1px solid #EEEEEE;
            border-bottom: 1px solid #EEEEEE;
            vertical-align: top;
        }

    .containerQuickSearch .containerQuickSearchIntellisenseBox {
        font-size: 12px;
        font-family: Calibri, CalibriLoad;
        border: 1px solid #7C7C7C;
        vertical-align: middle;
        font-size: 12px;
        z-index: 10000;
    }

    .containerQuickSearch .autoCompleteIntellisenseBox {
        background-color: #F4F4F4;
        padding-bottom: 5px;
        display: none;
    }

    .containerQuickSearch .autoCompleteIntellisenseContent {
        margin: 2px 0 0 10px;
        display: inline-block;
    }

    .containerQuickSearch .autoCompleteIntellisenseContentText {
        display: inline-block;
        margin-right: 10px;
    }

    .containerQuickSearch .intellisenseDescription {
        margin-right: 10px;
        margin-bottom: 2px;
        font-style: italic;
    }

    .containerQuickSearch .autoCompleteTitle {
        padding-left: 5px;
    }
/* #endregion */

/* #region Paging */
.jPaginate {
    height: 34px;
    position: relative;
    font-size: 1em;
    width: 100%;
    font-family: Segoe UI, SegoeUILoad;
}

    .jPaginate a {
        cursor: pointer;
        line-height: 15px;
        height: 18px;
        padding: 2px 5px;
        margin: 2px;
        float: left;
    }

.jPag-control-back {
    position: absolute;
    left: 0px;
}

.jPag-control-front {
    position: absolute;
    top: 0px;
}

.jPaginate span {
    cursor: pointer;
}

ul.jPag-pages {
    float: left;
    list-style-type: none;
    margin: 0px 0px 0px 0px;
    padding: 0px;
}

    ul.jPag-pages li {
        cursor: pointer;
        display: inline-block;
        float: left;
        padding: 0px;
        margin: 0px;
        background-color: #EEEEEE;
        margin-right: 3px;
        width: 22px;
        height: 22px;
        vertical-align: top;
        position: relative;
        text-align: center;
    }

        ul.jPag-pages li:hover {
            background-color: #DDDDDD;
        }

        ul.jPag-pages li span {
            padding: 2px 5px;
            line-height: 22px;
            height: 18px;
        }

span.jPag-current {
    cursor: default;
    font-weight: normal;
    line-height: 22px;
    height: 18px;
    padding: 2px 5px;
    color: #FFF !important;
}

ul.jPag-pages li span.jPag-previous,
ul.jPag-pages li span.jPag-next,
span.jPag-sprevious,
span.jPag-snext,
ul.jPag-pages li span.jPag-previous-img,
ul.jPag-pages li span.jPag-next-img,
span.jPag-sprevious-img,
span.jPag-snext-img {
    height: 22px;
    margin: 2px;
    float: left;
    line-height: 18px;
}

ul.jPag-pages li span.jPag-previous,
ul.jPag-pages li span.jPag-previous-img {
    margin: 2px 0px 2px 2px;
    font-weight: bold;
    width: 10px;
}

ul.jPag-pages li span.jPag-next,
ul.jPag-pages li span.jPag-next-img {
    margin: 2px 2px 2px 0px;
    font-weight: bold;
    width: 10px;
}

span.jPag-sprevious,
span.jPag-sprevious-img {
    margin: 2px 0px 2px 2px;
    font-size: 18px;
    width: 15px;
    text-align: right;
}

span.jPag-snext,
span.jPag-snext-img {
    margin: 2px 2px 2px 0px;
    font-size: 18px;
    width: 15px;
    text-align: right;
}

a.jPag-first, a.jPag-last {
    background-color: #EEEEEE;
}

    a.jPag-first:hover, a.jPag-last:hover {
        background-color: #DDDDDD;
    }

.containerPaging {
    text-align: right;
    padding-top: 5px;
    height: 30px;
    display: block;
    overflow: hidden;
    padding-right: 5px;
}

    .containerPaging .divInformationNumEntries {
        float: right;
        color: #333;
    }

.wrapperPaging {
}
/* #endregion */

/* #region Color Picker */
div.colorPicker-picker {
    height: 16px;
    width: 16px;
    padding: 0 !important;
    border: 1px solid #ccc;
    background: url(../images/ColorPicker/arrow.gif) no-repeat top right;
    cursor: pointer;
    line-height: 16px;
}

div.colorPicker-palette {
    width: 110px;
    position: absolute;
    border: 1px solid #598FEF;
    background-color: #EFEFEF;
    padding: 2px;
    z-index: 9999;
}

div.colorPicker_hexWrap {
    width: 100%;
    float: left;
}

    div.colorPicker_hexWrap label {
        font-size: 95%;
        color: #2F2F2F;
        margin: 5px 2px;
        width: 25%;
    }

    div.colorPicker_hexWrap input {
        margin: 5px 2px;
        padding: 0;
        font-size: 95%;
        border: 1px solid #000;
        width: 65%;
    }

div.colorPicker-swatch {
    height: 12px;
    width: 12px;
    border: 1px solid #000;
    margin: 2px;
    float: left;
    cursor: pointer;
    line-height: 12px;
}
/* #endregion */

/* #region Scroll Image */
.ad-gallery {
    width: 95%;
}

    .ad-gallery, .ad-gallery * {
        margin: 0;
        padding: 0;
    }

        .ad-gallery .ad-image-wrapper {
            width: 300px;
            height: 300px;
            margin-right: 20px;
            border: 1px solid #9C9898;
            margin-bottom: 10px;
            position: relative;
            display: table-cell;
            z-index: 100;
        }

            .ad-gallery .ad-image-wrapper .ad-loader {
                position: absolute;
                z-index: 10;
                top: 48%;
                left: 48%;
                border: 1px solid #CCC;
            }

            .ad-gallery .ad-image-wrapper .ad-next {
                position: absolute;
                right: 0;
                top: 0;
                width: 25%;
                height: 100%;
                cursor: pointer;
                display: block;
                z-index: 200;
            }

            .ad-gallery .ad-image-wrapper .ad-prev {
                position: absolute;
                left: 0;
                top: 0;
                width: 25%;
                height: 100%;
                cursor: pointer;
                display: block;
                z-index: 200;
            }

            .ad-gallery .ad-image-wrapper .ad-prev, .ad-gallery .ad-image-wrapper .ad-next { /* Or else IE will hide it */
                background: url(../images/Scroll/trans.gif);
            }

                .ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image, .ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
                    background: url(../images/Scroll/ad_prev.png);
                    width: 30px;
                    height: 30px;
                    display: none;
                    position: absolute;
                    top: 47%;
                    left: 0;
                    z-index: 101;
                }

                .ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
                    background: url(../images/Scroll/ad_next.png);
                    width: 30px;
                    height: 30px;
                    right: 0;
                    left: auto;
                }

            .ad-gallery .ad-image-wrapper .ad-image {
                position: absolute;
                overflow: hidden;
                top: 0;
                left: 0;
                z-index: 9;
            }

                .ad-gallery .ad-image-wrapper .ad-image a img {
                    border: 0;
                }

        .ad-gallery .ad-controls {
            height: 20px;
        }

        .ad-gallery .ad-info {
            float: left;
        }

        .ad-gallery .ad-slideshow-controls {
            float: right;
        }

            .ad-gallery .ad-slideshow-controls .ad-slideshow-start, .ad-gallery .ad-slideshow-controls .ad-slideshow-stop {
                padding-left: 5px;
                cursor: pointer;
            }

            .ad-gallery .ad-slideshow-controls .ad-slideshow-countdown {
                padding-left: 5px;
                font-size: 0.9em;
            }

        .ad-gallery .ad-slideshow-running .ad-slideshow-start {
            cursor: default;
            font-style: italic;
        }

        .ad-gallery .ad-nav {
            width: 100%;
            position: relative;
        }

        .ad-gallery .ad-forward, .ad-gallery .ad-back {
            position: absolute;
            top: 0;
            height: 100%;
            z-index: 10;
        }
        /* IE 6 doesn't like height: 100% */
        * html .ad-gallery .ad-forward, .ad-gallery .ad-back {
            height: 100px;
        }

        .ad-gallery .ad-back {
            cursor: pointer;
            left: -20px;
            width: 13px;
            display: block;
            background: url(../images/Scroll/ad_scroll_back.png) 0px 40px no-repeat;
        }

        .ad-gallery .ad-forward {
            cursor: pointer;
            display: block;
            right: -20px;
            width: 13px;
            background: url(../images/Scroll/ad_scroll_forward.png) 0px 40px no-repeat;
        }

        .ad-gallery .ad-nav .ad-thumbs {
            overflow: hidden;
            width: 100%;
        }

        .ad-gallery .ad-thumbs .ad-thumb-list {
            float: left;
            width: 9000px;
            list-style: none;
        }

        .ad-gallery .ad-thumbs li {
            float: left;
            padding-right: 5px;
        }

            .ad-gallery .ad-thumbs li a {
                display: block;
            }

                .ad-gallery .ad-thumbs li a img {
                    border: 3px solid #CCC;
                    display: block;
                    height: 100px;
                }

                .ad-gallery .ad-thumbs li a.ad-active img {
                    border: 3px solid #616161;
                }
/* Can't do display none, since Opera won't load the images then */
.ad-preloads {
    position: absolute;
    left: -9000px;
    top: -9000px;
}
/* #endregion */

/* #region Accordion */
.accordion {
    margin: 0;
    width: 400px;
    font-family: Segoe Ui, SegoeUILoad;
}

    .accordion div.accordionContent {
        background-color: #fff;
        border: 1px dotted #AAA;
        margin-bottom: 5px;
    }

    .accordion select {
        font-family: Segoe Ui, SegoeUILoad;
    }

    .accordion input, .accordion textarea {
        font-family: Segoe Ui, SegoeUILoad;
    }

    .accordion a {
        font-family: Segoe Ui, SegoeUILoad;
        cursor: pointer;
        display: block;
        margin-bottom: 5px;
        text-decoration: none;
        font-size: 14px;
        color: #2EABE0;
        background-color: #F8F8F8;
        background: url('../images/add.png') no-repeat 5px 2px;
        height: 30px;
        padding-left: 40px;
    }

        .accordion a span.ui-icon {
            height: 5px;
        }

        .accordion a.selected, .accordion a.ui-state-active {
            background-color: #D9D9D9;
            background-image: url('../images/minus.png');
        }

    .accordion .ui-state-default, .accordion .ui-widget-content .accordion .ui-state-default, .accordion .ui-widget-header .accordion .ui-state-default {
        border: 0px;
        background-color: #F8F8F8;
        font-weight: normal;
    }

    .accordion .ui-corner-top {
        -moz-border-radius-topleft: 0px;
        -webkit-border-top-left-radius: 0px;
        border-top-left-radius: 0px;
        -moz-border-radius-topright: 0px;
        -webkit-border-top-right-radius: 0px;
        border-top-right-radius: 0px;
    }

    .accordion .ui-corner-bottom {
        -moz-border-radius-bottomleft: 0px;
        -webkit-border-bottom-left-radius: 0px;
        border-bottom-left-radius: 0px;
        -moz-border-radius-bottomright: 0px;
        -webkit-border-bottom-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }
/* #endregion */

/* #region ComboBox Auto Complete */
.ui-button {
    display: inline-block;
    position: relative;
    padding: 0;
    line-height: normal;
    margin-right: .1em;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    overflow: visible; /* removes extra width in IE */
}

    .ui-button,
    .ui-button:link,
    .ui-button:visited,
    .ui-button:hover,
    .ui-button:active {
        text-decoration: none;
    }
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
    width: 2.2em;
}
/* button elements seem to need a little more width */
button.ui-button-icon-only {
    width: 2.4em;
}

.ui-button-icons-only {
    width: 3.4em;
}

button.ui-button-icons-only {
    width: 3.7em;
}

/* button text element */
.ui-button .ui-button-text {
    display: block;
    line-height: normal;
}

.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
    padding: .4em;
    text-indent: -9999999px;
}

.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
    padding: .4em 1em .4em 2.1em;
}

.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
    padding: .4em 2.1em .4em 1em;
}

.ui-button-text-icons .ui-button-text {
    padding-left: 2.1em;
    padding-right: 2.1em;
}
/* no icon support for input elements, provide padding by default */
input.ui-button {
    padding: .4em 1em;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
    position: absolute;
    top: 50%;
    margin-top: -8px;
}

.ui-button-icon-only .ui-icon {
    left: 50%;
    margin-left: -8px;
}

.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
    left: .5em;
}

.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
    right: .5em;
}

/* button sets */
.ui-buttonset {
    margin-right: 7px;
}

    .ui-buttonset .ui-button {
        margin-left: 0;
        margin-right: -.3em;
    }

/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
    border: 0;
    padding: 0;
}

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    cursor: default;
}

.ui-menu {
    list-style: none;
    padding: 2px;
    margin: 0;
    display: block;
    outline: none;
}

    .ui-menu .ui-menu {
        margin-top: -3px;
        position: absolute;
    }

    .ui-menu .ui-menu-item {
        margin: 0;
        padding: 0;
        font-size: 0.8em;
        width: 100%;
    }

    .ui-menu .ui-menu-divider {
        margin: 5px -2px 5px -2px;
        height: 0;
        font-size: 0;
        line-height: 0;
        border-width: 1px 0 0 0;
    }

    .ui-menu .ui-menu-item a {
        text-decoration: none;
        display: block;
        padding: 2px .4em;
        line-height: 1.5;
        min-height: 0; /* support: IE7 */
        font-weight: normal;
    }

        .ui-menu .ui-menu-item a.ui-state-focus,
        .ui-menu .ui-menu-item a.ui-state-active {
            font-weight: normal;
            margin: -1px;
        }

    .ui-menu .ui-state-disabled {
        font-weight: normal;
        margin: .4em 0 .2em;
        line-height: 1.5;
    }

        .ui-menu .ui-state-disabled a {
            cursor: default;
        }

/* icon support */
.ui-menu-icons {
    position: relative;
}

    .ui-menu-icons .ui-menu-item a {
        position: relative;
        padding-left: 2em;
    }

/* left-aligned */
.ui-menu .ui-icon {
    position: absolute;
    top: .2em;
    left: .2em;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
    position: static;
    float: right;
}

.containercbo button.ui-state-default {
    background-image: none;
    background-color: #FFFFFF;
    color: Black;
    border: 1px solid #BABABA;
    width: 18px;
}

    .containercbo button.ui-state-default .ui-icon {
        background-image: url(MetroGreen/jquery/images/ui-icons_222222_256x240.png);
    }

.containercbo button.ui-state-hover {
    background-image: none;
    background-color: #F36100;
}

.containercbo button.ui-state-focus {
    background-image: none;
}

.ui-button {
    margin-left: -1px;
    margin-top: -3px;
    background-color: Blue
}
/*.ui-button-icon-only .ui-button-text { padding: 0.05em 0.1em; } */
.ui-button-icon-only .ui-button-text {
}

.containercbo {
    font-size: 0.96em;
    display: inline;
    vertical-align: top;
}

    .containercbo button.ui-state-default[enabled="false"] {
        background-color: #EAEAEA;
    }

    .containercbo input {
        border: 1px solid #BABABA;
    }

        .containercbo input[readonly="readonly"] {
            color: Maroon;
            background-color: #EAEAEA;
            border: 1px solid #BABABA;
        }
/*.ui-autocomplete-input { margin: 0; padding: 0.1em 0 0.47em 0.1em; }
	
.containercbo button.ui-state-default   { background-image:none; background-color: #FFFFFF; color: Black;border:1px solid #848484; width:18px; }
.containercbo button.ui-state-default .ui-icon { background-image: url(../../themes/MetroGreen/images/ui-icons_222222_256x240.png); }
.containercbo button.ui-state-hover   { background-image:none; background-color: #F36100; }
.containercbo button.ui-state-focus   { background-image:none;   }*/
/* #endregion */

/* #region Collapse Expand */
h4.h4collapsed, h4.h4expanded {
    cursor: pointer;
}

    h4.h4collapsed:before, h4.h4expanded:before {
        font-weight: lighter;
        text-align: center;
        font-size: 1.2em;
    }

    h4.h4collapsed:before {
        content: "+";
        margin: 0px 5px 0 5px;
    }

    h4.h4expanded:before {
        content: "-";
        margin: 0px 8px 0 8px;
    }

    h4.h4collapsed + div.containerTblEntryContent {
        display: none;
    }
/* #endregion */

/* #region Metro Scroll */
/* SimoBorto scrollbar */
/* Metro scrollbar 1.0 */

::-webkit-scrollbar {
    width: 17px;
    height: 17px;
    background-color: #F0F0F0;
    border: none;
}

::-webkit-scrollbar-thumb {
    background-color: #CDCDCD;
    border: 1px solid #F0F0F0;
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: #DADADA;
    }

    ::-webkit-scrollbar-thumb:active {
        background-color: #606060;
    }

    ::-webkit-scrollbar-thumb:disabled {
        background-color: #F9F9F9;
    }

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

::-webkit-scrollbar-button {
    background-color: #F0F0F0;
    background-image: url('data:image/png;base64,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');
    background-repeat: no-repeat;
}

    ::-webkit-scrollbar-button:vertical {
        height: 33px;
    }

    ::-webkit-scrollbar-button:horizontal {
        width: 33px;
    }

        ::-webkit-scrollbar-button:horizontal:increment {
            background-position: 0px -444px;
        }

        ::-webkit-scrollbar-button:horizontal:decrement {
            background-position: 12px -425px;
        }

    ::-webkit-scrollbar-button:vertical:increment {
        background-position: -1px -391px;
    }

    ::-webkit-scrollbar-button:vertical:decrement {
        background-position: -1px -358px;
    }

    ::-webkit-scrollbar-button:hover {
        background-color: #DADADA;
    }

    ::-webkit-scrollbar-button:horizontal:increment:hover {
        background-position: 0px -548px;
    }

    ::-webkit-scrollbar-button:horizontal:decrement:hover {
        background-position: 12px -529px;
    }

    ::-webkit-scrollbar-button:vertical:increment:hover {
        background-position: -1px -495px;
    }

    ::-webkit-scrollbar-button:vertical:decrement:hover {
        background-position: -1px -462px;
    }

    ::-webkit-scrollbar-button:active {
        background-color: #606060;
    }

    ::-webkit-scrollbar-button:horizontal:increment:active {
        background-position: 0px -652px;
    }

    ::-webkit-scrollbar-button:horizontal:decrement:active {
        background-position: 12px -633px;
    }

    ::-webkit-scrollbar-button:vertical:increment:active {
        background-position: -1px -599px;
    }

    ::-webkit-scrollbar-button:vertical:decrement:active {
        background-position: -1px -566px;
    }

    ::-webkit-scrollbar-button:disabled {
        background-color: #F9F9F9;
    }

    ::-webkit-scrollbar-button:horizontal:increment:disabled {
        background-position: 0px -756px;
    }

    ::-webkit-scrollbar-button:horizontal:decrement:disabled {
        background-position: 12px -737px;
    }

    ::-webkit-scrollbar-button:vertical:increment:disabled {
        background-position: -1px -703px;
    }

    ::-webkit-scrollbar-button:vertical:decrement:disabled {
        background-position: -1px -670px;
    }
/* #endregion */

/* #region Toolbar */
.toolbarArea {
    display: none;
    position: fixed;
    bottom: 0;
    height: 65px;
    z-index: 10000;
    width: 100%;
    left: 50px;
}

    .toolbarArea ul {
        margin: 0;
        padding: 0;
        float: right;
        margin-right: 50px;
    }

        .toolbarArea ul li {
            list-style-type: none;
            display: inline-block;
            font-size: 11px;
            cursor: pointer;
            color: White;
            margin: 0 5px;
            padding: 5px;
            text-align: center;
        }

            .toolbarArea ul li:hover {
            }

            .toolbarArea ul li img {
                margin: 3px 0;
                width: 35px;
                height: 35px;
            }

            .toolbarArea ul li div {
                width: 100%;
                text-align: center;
                color: White;
                font-size: 1em;
                font-weight: 400;
                margin-top: -2px;
            }

        .toolbarArea ul.quickMenu {
            float: left;
            margin-left: 20px;
        }

#openBottomBar {
    height: 6px;
    background-color: #AAA;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
/* #endregion */

/* #region Transaction Page */
.divAdd:before {
    content: "+     ";
}

.divAdd {
    cursor: pointer;
    color: #2572EB;
}

    .divAdd:hover {
        text-decoration: underline;
    }

.divTransactionEntry .entryDetailContainer {
    background-color: #AAA;
    padding: 20px;
    font-size: 14px;
}

.tblTransactionEntryResult .keyField {
    display: none;
}

.tblTransactionEntryResult {
    border: 0px;
    margin-top: 10px;
    width: 100%;
}

    .tblTransactionEntryResult .divDetailEdit,
    .tblTransactionEntryResult .divDetailDelete {
        cursor: pointer;
        padding: 2px;
        font-size: 12px;
    }

        .tblTransactionEntryResult .divDetailEdit:hover {
            text-decoration: underline;
        }

    .tblTransactionEntryResult td {
        vertical-align: top;
        border: 0px;
        padding: 3px;
        font-size: 12px;
    }
    /*.tblTransactionEntryResult th  { text-align: left; border: 0px; border-bottom: 1px solid #CCCCCC; padding: 3px 0; background-color: #F7F7F7; }*/
    .tblTransactionEntryResult th {
        text-align: left;
        border: 0px;
        padding: 3px 0;
        text-transform: uppercase;
        background-color: #D8D8D8;
        font-weight: normal;
    }

    .tblTransactionEntryResult tr {
        border: 0px;
    }
        /*.tblTransactionEntryResult tr:not(.trEmpty):hover    { background-color: #EAEAEA; }*/
        .tblTransactionEntryResult tr:not(.trEmpty):hover {
            background-color: #A7DFF4;
        }

    .tblTransactionEntryResult div.divDetailDelete:hover {
        background-color: #AAA;
        color: White;
    }

    .tblTransactionEntryResult .divDetailDelete:before {
        content: "\2715 ";
    }

    .tblTransactionEntryResult tr.trEmpty {
        cursor: default;
        height: 50px;
        vertical-align: middle;
        text-align: center;
    }

    .tblTransactionEntryResult tr.trCustom2 {
        cursor: pointer;
        background-color: #E5EAF2;
    }

    .tblTransactionEntryResult tr.trCustom1 {
        cursor: pointer;
    }

    .tblTransactionEntryResult .divTrxHeader {
        font-size: 13px;
    }

    .tblTransactionEntryResult .divTrxDetail {
        font-size: 11px;
    }

    .tblTransactionEntryResult > tbody > tr:nth-child(odd) {
        border-bottom: 1px solid #D5D5D5;
    }

    .tblTransactionEntryResult > tbody > tr:nth-child(even) {
        border-bottom: 1px solid #D5D5D5;
    }

    .tblTransactionEntryResult b {
        color: #FF2E12;
    }

    .tblTransactionEntryResult tr td a {
        color: #0066FF;
        cursor: pointer;
    }

        .tblTransactionEntryResult tr td a:hover {
            text-decoration: underline;
        }
/* #endregion */

/* #region Detail Page */
.spnBannerPreferredName {
    color: #D8C442;
    font-size: 18px !important;
    font-weight: bold;
    text-shadow: 2px 2px 4px #000000;
    text-transform: uppercase;
}

.ulTabMenuLevel1 {
    padding: 0;
    margin: 0;
    font-size: 12px;
    margin-bottom: 0px;
    margin-top: 2px;
}

    .ulTabMenuLevel1 li {
        cursor: pointer;
        display: inline-block;
        list-style-type: none;
        padding: 5px;
        margin: 0 6px;
        color: #FFF;
        height: 14px;
    }

        .ulTabMenuLevel1 li:hover {
            color: #FFF;
            border-bottom: 1px solid #EAEAEA;
        }

.ulTabMenuLevel2 {
    padding: 0;
    margin: 0;
    font-size: 12px;
}

    .ulTabMenuLevel2 li {
        cursor: pointer;
        background-color: #F66013;
        text-transform: uppercase;
        height: 15px;
        padding: 5px;
        display: inline-block;
        list-style-type: none;
        margin-right: 0px;
        color: White;
        font-weight: bolder;
        min-width: 50px;
        text-align: center;
    }

        .ulTabMenuLevel2 li:hover {
            color: #000;
        }

        .ulTabMenuLevel2 li.selected {
            color: #1564AD;
            background-color: White;
        }

.headerBannerDetail {
    display: none;
    position: absolute;
    z-index: 30002;
    background-color: White;
    border-left: 1px solid #A1A1A1;
    top: 0;
    bottom: 0;
    right: 0;
    width: 650px;
}

    .headerBannerDetail .headerBannerDetailTitle {
        background-color: #008917;
        padding: 20px 10px 10px 10px;
        color: White;
    }

        .headerBannerDetail .headerBannerDetailTitle * {
            color: White;
        }

    .headerBannerDetail .ulHeaderBannerDetailInfo {
        padding: 0;
        margin: 0;
        margin-top: 5px;
    }

        .headerBannerDetail .ulHeaderBannerDetailInfo li {
            display: inline-block;
            list-style-type: none;
            margin-right: 3px;
            border: 1px solid;
            margin-bottom: 5px;
        }

            .headerBannerDetail .ulHeaderBannerDetailInfo li div.containerTile {
                display: table-cell;
                vertical-align: middle;
                padding: 10px;
                font-size: 30px;
                height: 60px;
                text-align: center;
            }

            .headerBannerDetail .ulHeaderBannerDetailInfo li div.divEmail {
                white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
                white-space: -webkit-pre-wrap; /*Chrome & Safari */
                white-space: -pre-wrap; /* Opera 4-6 */
                white-space: -o-pre-wrap; /* Opera 7 */
                white-space: pre-wrap; /* css-3 */
                word-wrap: break-word; /* Internet Explorer 5.5+ */
                word-break: break-all;
                white-space: normal;
            }

            .headerBannerDetail .ulHeaderBannerDetailInfo li h6 {
                font-size: 14px;
                border-top: 1px solid;
                text-align: center;
                margin: 0;
            }

.circle {
    display: block;
    width: 35px;
    height: 35px;
    margin: 1em auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-border-radius: 99em;
    -moz-border-radius: 99em;
    border-radius: 99em;
    border: 1px solid #eee;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}

.circleGridLarge {
    display: block;
    width: 50px;
    height: 50px;
    margin: 1em auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-border-radius: 99em;
    -moz-border-radius: 99em;
    border-radius: 99em;
    border: 1px solid #eee;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}

.circleBanner {
    display: block;
    width: 100px;
    height: 100px;
    margin: 1em auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-border-radius: 99em;
    -moz-border-radius: 99em;
    border-radius: 99em;
    border: 1px solid #eee;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}

.floatRight {
    float: right;
    margin-top: -10px;
}
/* #endregion */

/* #region Combo Box */
.dxeDisabled {
    color: Maroon !important;
    background-color: #EAEAEA !important;
    border: 1px solid #848484;
    border-right: 1px solid #FAFAFA;
    border-bottom: 1px solid #FAFAFA;
}

.dxeButtonEdit input[type="text"] {
    max-height: 19px;
    font-family: Segoe UI, SegoeUILoad;
    font-size: 12px;
}
/* #endregion */

/* #region Chart */
.jOrgChart {
    margin: 10px;
    padding: 20px;
}

    .jOrgChart .node {
        padding: 0 2px;
        font-size: 14px;
        font-weight: bold;
        height: 70px;
        min-width: 180px;
        background-color: #01CB37;
        border-radius: 8px;
        border: 5px solid white;
        color: #FFF;
        -moz-border-radius: 8px;
    }

        .jOrgChart .node .divBomName {
            min-width: 180px;
            max-width: 250px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            -moz-binding: url('assets/xml/ellipsis.xml#ellipsis');
        }

.node p {
    font-weight: normal;
    font-size: 10px;
    padding: 0px;
    margin: 1px;
}

.jOrgChart .node.selected {
    background-color: #FF1901;
}

.jOrgChart .node.even {
    background-color: #FC7201;
}
/* #endregion */

/* #region Fixed Table Col Row */
.ft_container table {
    border-width: 0px;
    margin: 0px;
    border-collapse: collapse;
    margin: 0;
    outline-style: none;
    font-size: 0.9em;
    background-color: #fff;
}

    .ft_container table tr th {
        font-weight: bold;
    }

    .ft_container table thead {
        -moz-user-select: none;
        -webkit-user-select: none;
    }

    .ft_container table tr th,
    .ft_container table tr td {
        border-collapse: collapse;
        padding: 2px 4px;
        word-wrap: break-word;
        border: 1px solid #CCCCCC;
        border-top-width: 0px;
        border-left-width: 0px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        overflow: hidden;
        word-wrap: break-word;
    }

    .ft_container table tr:first-child td,
    .ft_container table tr:first-child th {
        border-top-width: 1px;
        border-color: #CCCCCC;
    }

    .ft_container table tr td:first-child,
    .ft_container table tr th:first-child {
        border-left-width: 1px;
        border-color: #CCCCCC;
    }

.ft_container {
    overflow: hidden;
    padding: 0px;
}

.ft_rel_container {
    position: relative;
    overflow: hidden;
    border-width: 0px;
    width: 100%;
    height: 100%;
}

.ft_r, .ft_rc {
    background-image: none;
}

.ft_rc {
    position: absolute;
    z-index: 1005;
}

.ft_r, .ft_c {
    position: relative;
}

.ft_rwrapper, .ft_cwrapper {
    overflow: hidden;
    position: absolute;
    z-index: 1001;
    border-width: 0px;
    padding: 0px;
    margin: 0px;
}
/*.ft_rwrapper { width: 100%; padding-right: 17px; }*/

.ft_scroller {
    overflow: auto;
    height: 100%;
    padding: 0px;
    margin: 0px;
}

.ft_container tbody tr.ui-widget-content, thead.ui-widget-header {
    background-image: none;
}

.ft_container table.sorttable thead tr th {
    cursor: pointer;
}

.ft_container table thead tr th.fx_sort_bg {
    background-image: url(images/bg.gif);
    background-position: right center;
    background-repeat: no-repeat;
}

.ft_container table thead tr th.fx_sort_asc {
    background-image: url(images/asc.gif);
}

.ft_container table thead tr th.fx_sort_desc {
    background-image: url(images/desc.gif);
}

.ft_container table tr th {
    background-color: #EEEEEE;
    color: Black;
}
/* #endregion */

/* #region Signature */
.kbw-signature {
    display: inline-block;
    border: 1px solid #a0a0a0;
    -ms-touch-action: none;
}

.kbw-signature-disabled {
    opacity: 0.35;
}
/* #endregion */

.divToothImage.selected {
    border: 2px solid #1670C9;
}

.tblCRUDPopup td {
    text-align: center;
    width: 60px;
    padding: 5px 0;
    font-size: 12px;
    color: white;
    border-right: 1px solid #EAEAEA;
    cursor: pointer;
}

.mplisttoolbardropdown {
    float: left;
    overflow: hidden;
}

    .mplisttoolbardropdown .dropbtn {
        font-size: 16px;
        border: none;
        outline: none;
        color: white;
        padding: 14px 16px;
        background-color: inherit;
        font-family: inherit;
        margin: 0;
    }

    .navbar a:hover, .mplisttoolbardropdown:hover .dropbtn {
        background-color: red;
    }

.mplisttoolbardropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

    .mplisttoolbardropdown-content div {
        float: none;
        color: black;
        padding: 5px 16px;
        text-decoration: none;
        display: block;
        text-align: left;
    }

        .mplisttoolbardropdown-content div:hover {
            background-color: #ddd;
        }

.mplisttoolbardropdown:hover .mplisttoolbardropdown-content {
    display: block;
}



.tblTileMedium td {
    width: 205px;
    height: 110px;
    padding: 0 5px 5px 0;
}

    .tblTileMedium td .divContainerTile {
        position: relative;
        cursor: pointer;
        width: 100%;
        height: 100%;
    }

        .tblTileMedium td .divContainerTile:hover {
            box-shadow: 1px 1px 2px black, 0 0 5px blue, 0 0 5px darkblue;
        }

.tblTileMedium .divTileCount {
    font-size: 15px;
    position: absolute;
    top: 5px;
    left: 5px;
}

.tblTileMedium .divTileCount2 {
    font-size: 15px;
    position: absolute;
    top: 25px;
    left: 5px;
}

.tblTileMedium .divTileText {
    font-size: 12px;
    position: absolute;
    bottom: 5px;
    left: 5px;
}

.tblTile td {
    width: 100px;
    height: 110px;
    padding: 0 5px 5px 0;
}

    .tblTile td .divContainerTile {
        position: relative;
        cursor: pointer;
        width: 100%;
        height: 100%;
    }

        .tblTile td .divContainerTile:hover {
            box-shadow: 1px 1px 2px black, 0 0 5px blue, 0 0 5px darkblue;
        }

.tblTile .divTileCount {
    font-size: 36px;
    position: absolute;
    top: 5px;
    left: 5px;
}

.tblTile .divTileText {
    font-size: 12px;
    position: absolute;
    bottom: 5px;
    left: 5px;
}

/* #region Entry Step */
.tblEntryStepList {
    width: 100%;
    background-color: #EAEAEA;
}

    .tblEntryStepList tr td:hover {
        padding: 5px 15px;
        background-color: white;
        cursor: pointer;
    }

    .tblEntryStepList tr td {
        padding: 5px 15px;
        height: 30px;
        background-color: #EAEAEA;
        cursor: pointer;
        font-size: 12px;
    }

    .tblEntryStepList tr.selected td {
        background-color: white;
        border-left: 2px solid #26d5d5;
    }

.tdContainerLeftFilter .divLabel {
    color: White;
    font-size: 12px !important;
}
/* #endregion */

.divContainerFavoriteMenu {
    margin-top: 40px;
}

.grdContentArea {
    width: 100%;
    display: grid;
    grid-template-columns: 50% 50%;
    grid-column-gap: 0.5em;
    box-sizing: border-box;
}


/* #region Filter Mobile Area */
.spnFilterList {
    display: none;
}

.spnAddEntry {
    display: none;
}

.filterMobileArea {
    display: none;
}

    .filterMobileArea .filterMobileContent {
        position: fixed;
        bottom: 0;
        height: 70%;
        z-index: 29001;
        width: 100%;
        left: 0px;
        background-color: white;
        padding: 10px 30px;
        border-top-left-radius: 25px;
        border-top-right-radius: 25px;
        box-sizing: border-box;
    }

    .filterMobileArea .blanket {
        width: 100%;
        height: 100%;
        z-index: 29000;
        background-color: #8C8C8C;
        opacity: 0.65;
        position: fixed;
        top: 0;
        left: 0;
    }

    .filterMobileArea .divTopFilterClose {
        border: 3px solid #888;
        width: 100px;
        height: 0px;
        margin-top: 10px;
    }

    .filterMobileArea h3 {
        font-size: 18px;
        font-weight: bold;
        margin: 30px 0 20px 0;
    }
/* #endregion */


/* #region Entry Step */
.tblEntryStep {
    width: 100%;
}

    .tblEntryStep tr td:hover {
        background-color: #EAEAEA;
    }

    .tblEntryStep tr td {
        padding: 5px 15px;
        background-color: white;
        cursor: pointer;
    }

    .tblEntryStep tr.selected td {
        background-color: #EAEAEA;
        border-left: 2px solid #26d5d5;
    }
/* #endregion */


/* #region Filter Mobile Area */
.menuMobileArea {
    display: none;
}

    .menuMobileArea .menuMobileContent {
        position: fixed;
        bottom: 130px;
        height: 50%;
        z-index: 29001;
        width: 50%;
        left: 0px;
        background-color: white;
        padding: 10px 0px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 25px;
        box-sizing: border-box;
        overflow-y: auto;
    }

    .menuMobileArea .blanket {
        width: 100%;
        height: 100%;
        z-index: 29000;
        background-color: #8C8C8C;
        opacity: 0.65;
        position: fixed;
        top: 0;
        left: 0;
    }

.menuMobileAreaOpenMenu {
    display: none;
}

.menuMobileAreaTmp {
    display: none;
}
/* #endregion */


div.multicolumn {
    -moz-column-count: 2;
    -moz-column-gap: 10px;
    -webkit-column-count: 2;
    -webkit-column-gap: 10px;
    column-count: 2;
    column-gap: 10px;
}

.divContainerPopupBody {
    overflow-x: auto;
}
/* @media screen and (max-width: 800px),(pointer:none), (pointer:coarse) { */
@media screen and (max-width: 700px) {
    .sidenav {
        width: 100%;
        height: auto;
        position: relative;
    }

        .sidenav a {
        }

    div.content {
        margin-left: 0;
        margin-top: 0;
    }

    .divContainerFavoriteMenu {
        margin-top: 0px;
        padding-left: 20px;
    }

    .imgIcon {
        float: left;
        margin-right: 10px;
    }

    .pageInformation {
        margin-bottom: 2px;
        margin-top: 5px;
    }

    .navbar {
        display: none;
    }

    .breadcrumbs {
        display: none;
    }

    .spnFilterList {
        display: inline;
    }

    .spnAddEntry {
        display: inline;
    }

    .list-grid-container {
        grid-template-columns: auto;
    }

    .divContainerLeftFilter {
        display: none;
    }

    .divContainerFilterStatus {
        display: none;
    }

    .grdSelected:not(.grdInlineEditing) td:not(.tdMobile), .grdSelected:not(.grdInlineEditing) th:not(.tdMobile) /*, .grdView td:not(.tdMobile), .grdView th:not(.tdMobile) */ {
        display: none;
    }

    .grdSelected:not(.grdInlineEditing) td:not(.tdMobile), .grdSelected:not(.grdInlineEditing) th:not(.tdMobile), .grdView:not(.grdInlineEditing) td:not(.tdMobile), .grdView:not(.grdInlineEditing) th:not(.tdMobile) {
        display: none
    }

    .grdSelected .tdMobile, .grdView .tdMobile {
        display: table-cell;
        padding: 20px 5px;
    }
    /*.pnlInlineEditing .grdSelected td, .pnlInlineEditing .grdSelected th {
        display: table-cell !important; background-color:red;
    }*/
    .pnlInlineEditing {
        max-width: 80vw;
        overflow-x: scroll;
    }

    .grdSelected .tdMobile *, .grdView .tdMobile * {
        font-size: 20px;
    }

    .imgIconBottom {
        display: none;
    }

    .divMenuMore {
        display: none !important;
    }

    .sidenav .tooltip {
        margin-right: 8px;
    }

    .tdContainerLeftFilter, .tdContainerLeftTile, .tdContainerFilterStatus {
        display: none;
    }


    .maincontent {
        margin-top: 0px;
        margin-left: 0px;
        padding-left: 0;
    }

    .sidenav .tooltip:hover .tooltiptext {
        visibility: hidden
    }

    .tdEntryStepContainer {
        display: none;
    }

    #btnLeftFilterSearch {
        margin-bottom: 50px;
    }

    .grdContentArea {
        grid-template-columns: 100%;
    }

    /* #region Filter Mobile Area */
    .menuMobileAreaOpenMenu {
        display: none;
        position: fixed;
        z-index: 29002;
        bottom: 95px;
        height: 25px;
        width: 80px;
        background-color: red;
        left: 50%;
        font-size: 12px;
        padding-top: 5px;
        transform: translateX(-50%);
        border-radius: 25px;
        box-sizing: border-box;
        text-align: center;
        color: white;
    }

        .menuMobileAreaOpenMenu .spnClose {
            display: none;
        }

    .menuMobileAreaTmp {
        display: block;
    }
    /* #endregion */

    div.multicolumn {
        -moz-column-count: 1;
        -moz-column-gap: 10px;
        -webkit-column-count: 1;
        -webkit-column-gap: 10px;
        column-count: 1;
        column-gap: 10px;
    }



    .tblEntryStep tr td {
        padding: 10px 15px;
        border-bottom: 1px solid #EAEAEA;
        cursor: pointer;
    }

    .divContainerPopupBody {
        overflow-x: hidden;
    }

    #openBottomBar {
        display: none;
    }

    #txtUserName, #txtPassword {
        width: 300px;
        height: 35px !important;
        padding-left: 7px;
    }

    #btnLogin {
        height: 30px !important;
        min-width: 90px !important;
        font-size: 15px !important;
    }
}


/* #region Tags Input */
.tags-input-wrapper {
    background: transparent;
    padding: 10px;
    border-radius: 4px;
    max-width: 400px;
    border: 1px solid #ccc
}

    .tags-input-wrapper input {
        border: none;
        background: transparent;
        outline: none;
        width: 140px;
        margin-left: 8px;
    }

    .tags-input-wrapper .tag {
        display: inline-block;
        background-color: #fa0e7e;
        color: white;
        border-radius: 40px;
        padding: 0px 3px 0px 7px;
        margin-right: 5px;
        margin-bottom: 5px;
        box-shadow: 0 5px 15px -2px rgba(250, 14, 126, .7)
    }

        .tags-input-wrapper .tag a {
            margin: 0 7px 3px;
            display: inline-block;
            cursor: pointer;
        }
/* #endregion */