.checkbox label {
    display: flex;
    align-items: self-start;
}

.required .select2-selection,
.required .form-control {
    border: 1px solid #ef120d !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.content-area {
    min-height: 400px;
}

.report-group-item {
    font-size: 120%;
}

.report-items {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.left-menu .content-area {
    min-height: 500px;
}

.left-menu.sidebar-collapse .home-icon,
.left-menu.sidebar-collapse .dashboard-icon,
.left-menu.sidebar-collapse .reports-icon {
    display: none !important;
}

.main-icons {
}

.notification-icon i {
    font-weight: bold;
    border-radius: 6px;
    font-size: 14px;
}

.notification-badge {
    position: absolute;
    top: -8px;
    right: 0px;
    border-radius: 50% !important;
    background-color: #ff2356 !important;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
}

.main-icons .notification-icon .dropdown-menu {
    left: -100px;
}

@media (min-width:576px) {
    .main-icons {
        display: flex;
        justify-content: flex-start;
    }

    .left-menu.sidebar-collapse .main-icons {
        display: block;
    }

        .left-menu.sidebar-collapse .main-icons .notification-icon .dropdown-menu {
            left: 0;
        }
}

.mw-50px {
    min-width: 50px;
}

.mw-60px {
    min-width: 60px;
}

.mw-70px {
    min-width: 70px;
}

.mw-80px {
    min-width: 80px;
}

.mw-90px {
    min-width: 90px;
}

.mw-100px {
    min-width: 100px;
}

.mw-110px {
    min-width: 110px;
}

.mw-120px {
    min-width: 120px;
}

.no-records {
    color: #ef4b4b !important;
    font-size: 120%;
    margin: 0;
    padding: 0.5rem;
}

.btn.btn-danger {
    color: #ffffff;
    background-color: #F64E60;
    border-color: #F64E60;
}

.btn-danger:hover {
    color: #ffffff;
    background-color: #f42a3f;
    border-color: #f41d34;
}

.btn.btn-danger:hover:not(.btn-text):not(:disabled):not(.disabled), .btn.btn-danger:focus:not(.btn-text), .btn.btn-danger.focus:not(.btn-text) {
    color: #ffffff;
    background-color: #EE2D41;
    border-color: #EE2D41;
}

.nav-tabs {
    margin: 0;
    border: 0;
}

    .nav-tabs .nav-link {
        border: 1px solid #e1e1e4;
        background: #f4eef4;
    }

        .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
            border: 1px solid transparent;
            border-bottom-color: transparent;
        }

            .nav-tabs .nav-link:hover:not(.disabled) {
                color: #6b6f80;
            }

        .nav-tabs .nav-link.active:hover,
        .nav-tabs .nav-link.active:focus {
            color: #fff;
        }


.tab-content {
    border: 1px solid #e1e1e4;
}

.table th, .text-wrap table th {
    text-transform: none !important;
}

.SetiFRAME {
    width: 100% !important;
    min-height: 650px !important;
    height: 98%;
    border: 0;
}

@media (min-width: 768px) {
    .SetiFRAME {
        width: 100% !important;
        min-height: 600px !important;
    }
}

@media (min-width: 1024px) {
    .modal-dialog.modal-xl .modal-content {
        min-width: 300px;
        min-height: 300px;
    }

    .SetiFRAME {
        width: 100% !important;
        min-height: 520px !important;
    }
}

.modal-content .close-popup {
    padding: 8px 10px;
    position: absolute;
    right: -3px;
    top: -3px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    background: #f44;
    color: #fff;
    z-index: 1;
    border-radius: 25px;
    text-align: center;
    border: 0;
}

.file-upload {
    border: 1px solid #a7a7a7;
    border-radius: 3px !important;
}

    .file-upload input[type='text'] {
        border: 0;
        border-radius: 3px;
    }

    .file-upload .btn {
        height: 33px;
        border-radius: 0 3px 3px 0;
        width: 60px;
        justify-content: center
    }

    .file-upload.choosed {
        border: solid 1px #38cb89;
    }

    .file-upload .file-input,
    .file-upload .file-name {
        padding: 2px;
        border-right: 0 !important;
        line-height: 28px;
        margin: 0;
        position: relative;
        /*overflow: hidden;
        height: 39px;*/
    }

        .file-upload .file-input.disabled {
            background: #ebebeb;
        }

.file-input {
    cursor: pointer;
}

    .file-input::after {
        position: absolute;
        top: 0;
        right: -3px;
        bottom: 0;
        z-index: 3;
        display: block;
        height: 33px;
        padding: 0.375rem 0.75rem;
        line-height: 23px;
        color: #fff;
        background: #6c757d;
        font-weight: 500;
        content: "Browse";
        cursor: pointer;
        width: 80px;
        text-align: center;
    }

    .file-input:hover::after {
        background: #666e76;
    }

    .file-input.disabled:hover::after {
        background: #868e96;
    }

.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#actionbuttons .dropdown-menu button {
    width: 100%;
    text-align: left;
    margin-left: 1px !important;
}

.table thead th, .text-wrap table thead th {
    font-weight: bold;
}

.table > :not(:last-child) > :last-child > * {
    border-color: #cac9c9;
}

.table th {
    border-color: #cac9c9;
    font-weight: bold;
}

.w-30px {
    width: 30px;
}

.w-35px {
    width: 35px;
}

.w-40px {
    width: 40px;
}

.w-45px {
    width: 45px;
}

.w-100px {
    width: 100px;
}

.w-110px {
    width: 110px;
}

.w-120px {
    width: 120px;
}

.w-130px {
    width: 130px;
    min-width: 130px;
}

.w-140px {
    width: 140px;
    min-width: 140px;
}

.w-150px {
    width: 150px;
}

.freeze-pane {
    overflow-x: scroll;
    overflow-y: visible;
    padding-bottom: 0;
    border: solid 1px #cac9c9;
    max-width: 100%;
    height: 100%;
}

    .freeze-pane .table {
        margin-bottom: 0;
    }

@media (min-width: 768px) {
    .freeze-pane [data-span] {
        display: inline-block;
        cursor: text;
    }

    .freeze-pane {
        cursor: grab;
    }

        .freeze-pane:active {
            cursor: grabbing;
            cursor: -moz-grabbing;
            cursor: -webkit-grabbing;
        }

        .freeze-pane table th.top-fixed,
        .freeze-pane table td.top-fixed {
            position: -webkit-sticky;
            position: sticky;
            top: 0;
            border-top-width: 0;
            box-shadow: 1px 1px 5px #ececec;
            z-index: 2;
            background: #f7f9fc;
            white-space: nowrap;
            min-width: 100px;
        }

            .freeze-pane table th.top-fixed:first-child {
                z-index: 4;
                /*left: 0;
                top: 0;*/
                border-top-width: 0;
                border-left-width: 0;
            }

            .freeze-pane table th.top-fixed.left-auto {
                left: auto !important;
            }

        .freeze-pane table th.left-fixed, .freeze-pane table td.left-fixed {
            position: sticky;
            left: 0;
            border-left-width: 0;
            z-index: 3;
            width: 150px;
            border-right: 1px solid #e0e4e8;
            background: #f7f9fc;
        }

        .freeze-pane .table td {
            min-width: 80px;
        }
}

/*###### custom ####### */
body *::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    transition: .3s background;
}

body *::-webkit-scrollbar-thumb, body *:hover::-webkit-scrollbar-thumb {
    background: var(--color1);
}

body *::-webkit-scrollbar-track {
    background: rgba(4, 4, 7, 0.1);
}

.grid-dropdown.select2-dropdown--above,
.grid-dropdown.select2-dropdown--below {
    min-width: 120px !important;
    width: auto !important;
}

/*###### grid-scrollbar ####### */
.grid-scroll {
    max-height: 400px !important;
}

    .grid-scroll .select2-container .select2-selection--single {
        cursor: pointer !important;
    }

    .grid-scroll::-webkit-scrollbar {
        width: 16px;
        height: 16px;
    }

    .grid-scroll::-webkit-scrollbar-corner,
    .grid-scroll::-webkit-scrollbar-track {
        background-color: #f0f0f2;
        border-radius: 6px;
    }

    .grid-scroll::-webkit-scrollbar-thumb {
        background: var(--color1);
        background-clip: padding-box;
        border: solid 2px #f0f0f2;
        border-radius: 6px;
    }

        .grid-scroll::-webkit-scrollbar-thumb:hover {
            background-color: var(--color1);
        }

        .grid-scroll::-webkit-scrollbar-thumb:active {
            background-color: var(--color2);
        }

    .grid-scroll::-webkit-scrollbar-button:single-button {
        background-color: rgb(64, 64, 64);
        display: block;
        background-size: 10px;
        background-repeat: no-repeat;
        border-radius: 6px;
    }

        /*Up*/
        .grid-scroll::-webkit-scrollbar-button:single-button:vertical:decrement {
            height: 16px;
            width: 16px;
            background-position: center center;
            background-color: rgba(0, 50, 126, 0.12);
            background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(185 185 185)'><polygon points='50,00 0,50 100,50'/></svg>");
        }

            .grid-scroll::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='50,00 0,50 100,50'/></svg>");
            }

            .grid-scroll::-webkit-scrollbar-button:single-button:vertical:decrement:active {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='50,00 0,50 100,50'/></svg>");
            }

        /*Down*/
        .grid-scroll::-webkit-scrollbar-button:single-button:vertical:increment {
            height: 16px;
            width: 16px;
            background-position: center center;
            background-color: rgba(0, 50, 126, 0.12);
            background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(185 185 185)'><polygon points='0,0 100,0 50,50'/></svg>");
        }

            .grid-scroll::-webkit-scrollbar-button:single-button:vertical:increment:hover {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='0,0 100,0 50,50'/></svg>");
            }

            .grid-scroll::-webkit-scrollbar-button:single-button:vertical:increment:active {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='0,0 100,0 50,50'/></svg>");
            }

        /*Left*/
        .grid-scroll::-webkit-scrollbar-button:single-button:horizontal:decrement {
            height: 16px;
            width: 16px;
            background-position: center center;
            background-color: rgba(0, 50, 126, 0.12);
            background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(185 185 185)'><polygon points='0,50 50,100 50,0'/></svg>");
        }

            .grid-scroll::-webkit-scrollbar-button:single-button:horizontal:decrement:hover {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='0,50 50,100 50,0'/></svg>");
            }

            .grid-scroll::-webkit-scrollbar-button:single-button:horizontal:decrement:active {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='0,50 50,100 50,0'/></svg>");
            }

        /*Right*/
        .grid-scroll::-webkit-scrollbar-button:single-button:horizontal:increment {
            height: 16px;
            width: 16px;
            background-position: right;
            background-color: rgba(0, 50, 126, 0.12);
            background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(185 185 185)'><polygon points='0,0 0,100 50,50'/></svg>");
        }

            .grid-scroll::-webkit-scrollbar-button:single-button:horizontal:increment:hover {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(112, 112, 112)'><polygon points='0,0 0,100 50,50'/></svg>");
            }

            .grid-scroll::-webkit-scrollbar-button:single-button:horizontal:increment:active {
                background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='rgb(128, 128, 128)'><polygon points='0,0 0,100 50,50'/></svg>");
            }



.font-20 {
    font-size: 20px;
}

.font-25 {
    font-size: 25px;
}

.font-30 {
    font-size: 30px;
}

.font-35 {
    font-size: 35px;
}

.font-40 {
    font-size: 40px;
}

.font-45 {
    font-size: 45px;
}

.font-50 {
    font-size: 50px;
}

.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
    display: block;
}

.disabled-childs {
    position: relative;
    opacity: 0.85;
    color: #949494;
}

.overlay {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.radio label {
    padding: 3px;
    margin-bottom: 0;
    cursor: pointer;
}

    .radio label:hover {
        background: #f6f6f6;
    }

.radio .radio-label::before {
    border-radius: 50%;
}

.radio .radio-input {
    cursor: pointer;
}

.radio .overlay {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #ddd;
    opacity: 0.3;
}

@media (min-width: 992px) {
    .page-info {
        position: absolute;
        right: 0;
        top: 0;
        line-height: 30px;
    }
}

.error {
    color: #EE2D41;
}

.form-print-modal {
    max-width: 98%;
    max-height: 98%;
    margin: 6px auto;
}

.form-print-iframe {
    width: 100% !important;
    height: 98% !important;
}

#loadingbar {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10001;
}

    #loadingbar span {
        background-image: url('../images/loading.gif');
        background-repeat: no-repeat;
        display: inline-block;
        width: 45px;
        height: 45px;
        background-size: 45px;
    }

/*.entry-page-content .page-break {
    min-height: 500px;
}*/

#api-row-select {
    background: #dbfde3;
}

#modalApiSearchContent table tr:hover {
    background: #f1f1f1;
}

.signImage {
    border: solid 2px rgb(220, 220, 220);
    margin-bottom: 0.25rem;
}

.grid-header {
    background: #f7f9fc;
    display: flex;
    border: 1px solid #dee2e6 !important;
}

    .grid-header .grid-title {
        line-height: 30px;
        font-weight: bold;
        margin: 0;
        padding: 0 3px;
    }

.grid-item-head {
    text-align: right;
    padding: 0;
}

.grid-item-tools {
    padding: 0.25rem;
    position: absolute;
    left: 10px;
    bottom: 6px;
}

.grid-item-view {
    margin: 0;
    position: relative;
    border: solid 1px #ddd;
    border-color: transparent transparent #ddd transparent;
    padding: 6px 0 45px;
}

    .grid-item-view:hover {
        /*background-color: #fcfcfc;
        border: solid 1px transparent;*/
    }

    .grid-item-view span.form-control {
        background: #f7f7f7;
    }

#modalApiContent .form-control {
    min-width: 150px;
}

.section .card.box {
    margin-bottom: 0.75rem;
}

.view-buttons {
    margin-bottom: 3px;
}

#modalApiPagination {
    height: 30px;
    position: relative;
}

.arrow-right {
    height: 50px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    background: #868e96;
    color: #fff !important;
}

    .arrow-right.active {
        background: var(--header-color);
        color: var(--icon-background-color) !important;
    }

    .arrow-right::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        border-top: 25px solid transparent;
        border-bottom: 25px solid transparent;
        border-left: 25px solid #fff;
    }

    .arrow-right::after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        border-top: 25px solid #fff;
        border-bottom: 25px solid #fff;
        border-left: 25px solid transparent;
    }

.p-button-icon-only .p-button-label {
    display: none;
}


/* sys_View */
.adelete {
    padding: 0px !important;
    color: #e23903 !important;
}

.idelete {
    float: right;
    margin-top: -22px;
    margin-right: 3px !important;
    cursor: pointer;
    margin-right: 0px;
}

.view-buttons .dropdown-menu.dropdown-menu-right {
    overflow-y: scroll;
    min-height: 10px;
    max-height: 350px;
}

.underline {
    text-decoration: underline;
}

.entry-page-content {
    position: relative;
}

    .entry-page-content .overlay {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 1000;
        background: #fff;
        opacity: 0.50;
    }

.grid-container .attachment-box input[type="text"] {
    line-height: 1.2;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.grid-container .attachment-box button {
    min-width: 35px;
}

.grid-container .attachment-box *:first-child {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/*.attachment-box *:nth-child(2) {
    border-radius: 0 !important;
}*/
.grid-container .attachment-box *:last-child {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.lbl-entry {
    width: 100%;
    text-align: left;
}

.nowrap {
    white-space: nowrap;
}

.attachment-box {
    width: 100%;
}

    .attachment-box input[type='file'] {
        width: 100%;
    }

.ui-draggable-handle {
    cursor: move;
}