@charset "UTF-8";

@media all
{
    .width-100{
        width: 100%;
    }
    .width-90{
        width: 90%;
    }
    .width-80{
        width: 80%;
    }
    .width-70{
        width: 70%;
    }
    .width-60{
        width: 60%;
    }
    .width-50{
        width: 50%;
    }
    .width-40{
        width: 40%;
    }
    .width-30{
        width: 30%;
    }
    .width-20{
        width: 20%;
    }
    .width-10{
        width: 10%;
    }
    .width-0{
        width: 0%;
    }
    .bg-outline-success {
        --bs-bg-opacity: 1;
        border: 1px solid rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
        background-color: #FFF !important;
        color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity));
    }
    .bg-outline-warning {
        --bs-bg-opacity: 1;
        border: 1px solid rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
        background-color: #FFF !important;
        color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity));
    }
    .bg-outline-danger {
        --bs-bg-opacity: 1;
        border: 1px solid rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
        background-color: #FFF !important;
        color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity));
    }
    .bg-red {
        background-color: #F44336 !important;
        color: #FFF;
    }
    .bg-outline-red {
        border: 1px solid #F44336;
        background-color: #FFF !important;
        color: #F44336;
    }
    .bg-pink {
        background-color: #E91E63 !important;
        color: #FFF;
    }
    .bg-outline-pink {
        border: 1px solid #E91E63;
        background-color: #FFF !important;
        color: #E91E63;
    }
    .bg-purple {
        background-color: #9C27B0 !important;
        color: #FFF;
    }
    .bg-outline-purple {
        border: 1px solid #9C27B0;
        background-color: #FFF !important;
        color: #9C27B0;
    }
    .bg-deep-purple {
        background-color: #673AB7 !important;
        color: #FFF;
    }
    .bg-outline-deep-purple {
        border: 1px solid #673AB7;
        background-color: #FFF !important;
        color: #673AB7;
    }
    .bg-indigo {
        background-color: #3F51B5 !important;
        color: #FFF;
    }
    .bg-outline-indigo {
        border: 1px solid #3F51B5;
        background-color: #FFF !important;
        color: #3F51B5;
    }
    .bg-blue {
        background-color: #2196F3 !important;
        color: #FFF;
    }
    .bg-outline-blue {
        border: 1px solid #2196F3;
        background-color: #FFF !important;
        color: #2196F3;
    }
    .bg-light-blue {
        background-color: #03A9F4 !important;
        color: #FFF;
    }
    .bg-outline-light-blue {
        border: 1px solid #03A9F4;
        background-color: #FFF !important;
        color: #03A9F4;
    }
    .bg-cyan {
        background-color: #00BCD4 !important;
        color: #FFF;
    }
    .bg-outline-cyan {
        border: 1px solid #00BCD4;
        background-color: #FFF !important;
        color: #00BCD4;
    }
    .bg-teal {
        background-color: #009688 !important;
        color: #FFF;
    }
    .bg-outline-teal {
        border: 1px solid #009688;
        background-color: #FFF !important;
        color: #009688;
    }
    .bg-green {
        background-color: #4CAF50 !important;
        color: #FFF;
    }
    .bg-outline-green {
        border: 1px solid #4CAF50;
        background-color: #FFF !important;
        color: #4CAF50;
    }
    .bg-light-green {
        background-color: #8BC34A !important;
        color: #FFF;
    }
    .bg-outline-light-green {
        border: 1px solid #8BC34A;
        background-color: #FFF !important;
        color: #8BC34A;
    }
    .bg-lime {
        background-color: #CDDC39 !important;
        color: #FFF;
    }
    .bg-outline-lime {
        border: 1px solid #CDDC39;
        background-color: #FFF !important;
        color: #CDDC39;
    }
    .bg-yellow {
        background-color: #FFE821 !important;
        color: #FFF;
    }
    .bg-outline-yellow {
        border: 1px solid #FFE821;
        background-color: #FFF !important;
        color: #FFE821;
    }
    .bg-amber {
        background-color: #FFC107 !important;
        color: #FFF;
    }
    .bg-outline-amber {
        border: 1px solid #FFC107;
        background-color: #FFF !important;
        color: #FFC107;
    }
    .bg-orange {
        background-color: #FF9800 !important;
        color: #FFF;
    }
    .bg-outline-orange {
        border: 1px solid #FF9800;
        background-color: #FFF !important;
        color: #FF9800;
    }
    .bg-deep-orange {
        background-color: #FF5722 !important;
        color: #FFF;
    }
    .bg-outline-deep-orange {
        border: 1px solid #FF5722;
        background-color: #FFF !important;
        color: #FF5722;
    }
    .bg-brown {
        background-color: #795548 !important;
        color: #FFF;
    }
    .bg-outline-brown {
        border: 1px solid #795548;
        background-color: #FFF !important;
        color: #795548;
    }
    .bg-grey {
        background-color: #9E9E9E !important;
        color: #FFF;
    }
    .bg-outline-grey {
        border: 1px solid #9E9E9E;
        background-color: #FFF !important;
        color: #9E9E9E;
    }
    .bg-blue-grey {
        background-color: #607D8B !important;
        color: #FFF;
    }
    .bg-outline-blue-grey {
        border: 1px solid #607D8B;
        background-color: #FFF !important;
        color: #607D8B;
    }
    .bg-black {
        background-color: #000000 !important;
        color: #FFF;
    }
    .bg-outline-black {
        border: 1px solid #000000;
        background-color: #FFF !important;
        color: #000000;
    }
    .bg-white {
        background-color: #FFFFFF !important;
        color: #000;
    }
    .bg-outline-white {
        border: 1px solid #FFFFFF;
        background-color: #000 !important;
        color: #FFF;
    }
    .bg-disabled {
        border: 1px solid #e9ecef;
        border-radius: 0.25rem;
        background-color: #e9ecef !important;
    }
    .border-round {
        border: 1px solid #e9ecef;
        border-radius: 0.25rem;
    }

    #popup {
        margin: 2% auto;
    }

    #popup .modal-dialog {
        width: 90%;
        max-width: 90%;
    }

    #popup .modal-header {
        text-align: center;
    }

    #popup-info {
        margin: 2% auto;
    }

    #popup-info .modal-dialog {
        width: 80%;
        max-width: 80%;
    }

    #popup-action {
        margin: 2% auto;
        z-index: 2000;
    }

    #popup-action .modal-dialog {
        width: 50%;
        max-width: 50%;
    }

    body.modal-open {
        height: 100vh;
        overflow-y: hidden;
    }

    .page-break {
        border: 1px dashed #999;
    }

    .text-center {
        text-align: center;
    }

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

    #data-table {
        display: block;
    }

    #data-list {
        display: none;
    }

    .box {
        padding: 10px;
        border: 2px solid #e9ecef;
    }

    pre {
        white-space: pre-wrap;       /* Since CSS 2.1 */
        white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
        white-space: -pre-wrap;      /* Opera 4-6 */
        white-space: -o-pre-wrap;    /* Opera 7 */
        word-wrap: break-word;       /* Internet Explorer 5.5+ */
    }
    
    .note-group-select-from-files {
      display: none;
    }
    
    #floating {
        position: fixed;
        width: 60px;
        height: 60px;
        bottom: 40px;
        right: 40px;
        background-color: #fff;
        color: #000;
        border-radius: 50px;
        text-align: center;
        box-shadow: 2px 2px 3px #999;
        font-size: 8px;
        text-align: center;
    }
    
    #floating img {
        width: 30px;
        margin-top: 15px;
    }
}

@media screen and (max-width: 769px)
{
    #data-table {
        display: none;
    }

    #data-list {
        display: block;
    }

    #popup-action .modal-dialog {
        width: 90%;
        max-width: 90%;
    }
}

@media screen and (min-width: 770px)
{
    #data-table {
        display: block;
    }

    #data-list {
        display: none;
    }
}