body > .ui-select-bootstrap.open input[type=search] { /*to prevent search textbox width extend overflow*/
    width:100% !important; 
}

.lookup-pop-up {
    position: absolute;
    margin: auto;
    z-index: 110;
}

.ppl-picker-item {
    display: inline-block;
    margin-right: 2px;
    margin-top: 2px;
    padding: 4px 8px 2px 8px;
}

    .ppl-picker-item:hover {
        background: #ccc;
    }

.ppl-picker-item-remove {
    padding: 2px 2px 2px 5px;
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    font-size: 18px;
}

.line {
    top: 0px;
    margin: 0px;
    padding: 0px 2px 2px 3px;
    border-width: 2px;
    border-bottom-width: 2px;
    border-bottom-color: grey;
    border-bottom-style: solid;
    width: 100%;
}

.submissionblock {
    position: fixed;
    background-color: #000;
    opacity: 0.3;
    z-index: 1000;
    width: 100%;
    height: 100%;
}

.submessage {
    z-index: 1100;
}

.overflow-wrap {
    word-break: break-word;
}

/*.form-group.has-error label {
    color: #333 !important;
}*/


.lookup-panel-body label {
    color: #333 !important;
}

.lookup-panel-body input, .lookup-panel-body select {
    border-color: #ccc !important;
}

@media print {
    body * {
        visibility: hidden;
    }

    .section-to-print, .section-to-print * {
        visibility: visible;
    }

    .workflow-print {
        page-break-after: always;
        page-break-inside: avoid;
    }

    @page {
        margin: 1px;
    }

    .hide-print {
        display: none;
    }

    .panel-default > .panel-heading {
        background-color: none;
        border-color: none;
    }

    a[href]::after {
        content: " (" attr(href) ")"
    }

    .col-print-3 {
        width: 25%;
    }

    .col-print-4 {
        width: 33.33333333333333%;
    }

    .col-print-6 {
        width: 50%;
    }
}

.custom-pull-left {
    float: left;
}

.custom-pull-right {
    float: right;
}

#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 101;
    cursor: no-drop;
    overflow: hidden;
}

@media (max-width : 640px) {

    .custom-pull-right {
        float: none;
    }

    .btn-mobile .btn {
        margin-right: 5px !important;
        margin-top: 5px !important;
    }
}

.form-group.has-error .help-block {
    display: block;
}

.has-error .input-group-btn > .btn {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #b94a48;
}

.nav, .pagination, .carousel, .panel-title a {
    cursor: pointer;
}

hr {
    margin-bottom: 5px !important;
    margin-top: 3px !important;
}

h4 {
    margin-bottom: 5px !important;
}

.form-group-no-margin {
    margin-bottom: 0px;
    margin-left: 0px !important;
}

.from-group-leftmargin {
    margin-left: 0px !important;
}

.form-horizontal .control-label {
    padding-top: 0px !important;
    text-align: left !important;
}

/*Remove 'No file chosen text in filepicker*/
input[type=file] {
    color: transparent;
}

.upload-file-table-container {
    margin-top: 15px;
    overflow-x: auto;
}

.upload-file-table {
    table-layout: fixed !important;
    word-break: break-all;
    width: 0;
}

.div-field {
    border-radius: 0;
    box-shadow: none;
    display: block;
    width: 100%;
    min-height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #f0f0f0;
    background-image: none;
    border: 1px solid #ccc;
}

.div-field:empty:before {
    content: attr(placeholder);
    color: grey;
}

.hyperlink {
    float: left;
    margin-top: 6px;
    margin-bottom: 6px;
}

.hidden-form-group {
    margin-bottom: 0px !important;
}

.multipleOptSubLink span.ui-select-match-item.btn.btn-default.btn-xs.btn-primary {
    background-color: #f4f4f4 !important;
}

.ui-select-placeholder, .ui-select-match-text, .ui-select-match-item {
    max-width: 98%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
}

/* Fix width updating to 10px and causing flicker effect on ft13.html inside table */
td .ui-select-multiple.ui-select-bootstrap input.ui-select-search {
    width: 100% !important;
}

@media screen and (max-width: 480px) {
    .headerRemovePadding {
        padding-left: 0;
    }
}

.peoplepicker-padding {
    padding-left: 0px;
    padding-right: 0px;
}

.hide-mobiletd:before {
    display: none;
}

.hide-mobiletd > .form-group {
    margin-top: 0px;
}

.tableadvancesearch {
    position: absolute;
    left: 50px;
    top: 20px;
    width: 90%;
    z-index: 110;
}

.tableadvancesearch-PplPicker {
    position: absolute;
    width: 100%;
    z-index: 102;
    left: 160px
}

.tableadvancesearch-PplPicker-intable {
    position: absolute;
    width: 80%;
    z-index: 102;
    left: 160px
}

.tableadvancesearch-PplPicker-inzone-left {
    position: absolute;
    width: 200%;
    z-index: 102;
    left: 40%;
}

.tableadvancesearch-PplPicker-inzone-right {
    position: absolute;
    width: 200%;
    z-index: 102;
    right: 15px;
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .tableadvancesearch {
        position: fixed;
        left: 0px;
        top: 30px;
        max-height: 90%;
        width: 100%;
        overflow: scroll;
    }

    .tableadvancesearch-PplPicker {
        position: fixed;
        width: 100%;
        z-index: 102;
        left: 0px;
        max-height: 90%;
        overflow: scroll;
        top: 15px;
    }

    .tableadvancesearch-PplPicker-intable {
        position: fixed;
        width: 100%;
        z-index: 102;
        left: 0px;
        overflow: scroll;
        max-height: 90%;
        top: 15px;
        max-width: inherit;
    }

    .tableadvancesearch-PplPicker-inzone-left {
        position: fixed;
        width: 100%;
        z-index: 102;
        left: 0px;
        overflow: scroll;
        max-height: 90%;
        top: 15px;
        max-width: inherit;
    }

    .tableadvancesearch-PplPicker-inzone-right {
        position: fixed;
        width: 100%;
        z-index: 102;
        left: 0px;
        overflow: scroll;
        max-height: 90%;
        top: 15px;
        max-width: inherit;
    }

    .peoplepicker-padding {
        padding-left: 15px;
    }
}

@media screen and (max-width: 767px) {

    .tableadvancesearch-dt .table tbody tr td {
        white-space: inherit !important;
    }
}

@media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px) {

    .tableadvancesearch-dt tbody {
        display: table-row-group
    }

    .tableadvancesearch-dt thead {
        display: table-header-group
    }

    .tableadvancesearch-dt th {
        display: table-cell;
    }

    .tableadvancesearch-dt tr {
        display: table-row;
        position: inherit;
    }

    .tableadvancesearch-dt td {
        display: table-cell
    }

        .tableadvancesearch-dt td:before {
            padding-right: 0px;
        }

    .tableadvancesearch-dt .table-condensed > thead > tr > th {
        padding: 10px;
    }

    .overridepullright .pull-right {
        float: right !important
    }

    .overridepullleft .pull-right {
        float: left !important
    }
}


/*!
 * KubeSignaturePad v0.2 (20200331)
 * Supports: KUBE Workflow Version 3.0.0.5
 */
.kube-sig {
    display: inline-block;
    padding-bottom: 4px;
    background: #f5f5f5;
    border: solid 1px #d2d6de;
    border-radius: 4px;
    text-align: center;
}

.kube-sig-body {
    position: relative;
    user-select: none;
}

.kube-sig-canvas {
    border-radius: 4px;
}

img.kube-sig-canvas {
    display: block;
    height: 100%;
    width: 100%;
}

.kube-sig-body i {
    position: absolute;
    bottom: 5px;
    left: 5px;
}

.kube-sig-footer {
    padding: 0 4px;
    border-top: solid 1px #333;
    max-width:300px;
}

.kube-sig-footer .btn {
        width: 80px
    }

.kube-sig-active .kube-sig-canvas {
    background: #fff;
}