#formAdd {
    margin: auto;
    width: 98%;
}

    #formAdd > div {
        display: flex;
        flex-direction: column;
        grid-gap: .5em;
    }

        #formAdd > div:last-child {
            margin: auto;
            width: 96%;
        }

    #formAdd li.select2-search.select2-search--inline {
        margin-bottom: 4px;
        height: 38px;
    }

/*.recorderForm {
    padding: 0 .5em;
}

    .recorderForm > span {
        width: -webkit-fill-available !important;
    }
*/
span.selection > span {
    padding: 0 !important;
}

#divGrdMeterRecorder div.meterAddUpdate > div {
    width: 97%;
    margin: auto;
}

.detailLine {
    width: 98%;
    height: .2em !important;
    opacity: .8;
    color: var(--darker-blue);
    margin-bottom: 1em !important;
}

#formAdd div > button, #buttonGenerateMeterRecorder, #addMeterRecorder, #buttonFromPrev {
    text-transform: uppercase;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px, 2px 2px 5px 1px rgba(255, 255, 255, 0.25) inset;
}

    #formAdd div > button:hover, #buttonGenerateMeterRecorder:hover, #addMeterRecorder:hover, #buttonFromPrev:hover {
        background-image: linear-gradient(rgb(0 0 0 / 10%) 0 0);
    }

.swal2-close:focus {
    box-shadow: none !important;
}

/*For New Styling Button Action*/
/*#no-more-tables.listMeterRecorder td:nth-child(2):before {
    content: none !important;
}*/

#no-more-tables.listMeterRecorder td:nth-child(1) {
    padding-left: 1.5em !important;
    text-align: center !important;
}

#no-more-tables.listMeterRecorder td:first-child:before {
    content: none !important;
}

@media only screen and (max-width: 800px) {
    #no-more-tables.listMeterRecorder td:last-child:before {
        content: attr(data-title);
    }

    #no-more-tables.listMeterRecorder td:last-child {
        padding-left: 2.5em !important;
    }
}

.listMeterRecorder tr.bootstrapTable-tr.meterRecord th:nth-of-type(4) {
    min-width: 10em !important;
    width: 10em !important;
}
.listMeterRecorder tr.bootstrapTable-tr.meterRecord th:nth-of-type(8) {
    min-width: 15em !important;
    width: 15em !important;
}

/*End For New Styling Button Action*/

@media only screen and (max-width: 800px) {
    #tableMeterListPrev td:last-child:before {
        content: attr(data-title);
    }
}



