/* ALL CSS STYLES PAGE [Made By Jyotirmoy Saha] */

body {
    font-family: 'Roboto', sans-serif;
    height: auto;
    padding: 0px;
    margin: 0px;
}

.form_label {
    font-weight: bold;
    font-size: 14px;
}

.top_header {
    overflow: hidden;
    /* background-image: url("../images/segment-and-girder.png"), url("../images/header2.jpeg"), url("../images/header3.png"), url("../images/header4.jpeg"), url("../images/header5.jpeg");
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat; */
    background-image: url("../images/segment-and-girder.png");
    background-repeat: repeat;
    background-position: center;
}

.top_header img {
    overflow: hidden;
}

.wrapper {
    padding: 0px;
}

#content,
#table_div {
    margin-bottom: 85px;
}

.transfer-demo {
    width: 640px;
    height: 400px;
    margin: 0 auto;
}

.footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #555555 !important;
    color: white !important;
    text-align: center;
}


/* .footer_p {
    margin-top: 15px;
} */

.footer_a {
    text-decoration: none;
}

.imgcontainer {
    text-align: center;
    margin: 24px 0 12px 0;
    position: relative;
}

img.avatar {
    width: 40%;
    border-radius: 50%;
}

.sidenavbar a:link {
    text-decoration: none !important;
}

.cdata_legend,
.bill_data {
    background-color: #c3c3c3;
    text-align: left;
    font-size: 14px;
    width: auto;
    border: solid 1px #000;
    padding: 5px;
    border-radius: 10px;
}


/* .company_nm_label,
.site_nm_label {
    width: 140px;
    text-align: left;
}

.company_nm_input,
.site_name_input {
    outline: none;
    width: 270px;
}

.company_contact_div,
.site_address_div {
    display: flex;
    justify-content: space-between;
}

.company_contact_label,
.site_address_label {
    width: 230px;
    display: inline;
    text-align: left;
}

.company_contact_input,
.site_address_input {
    outline: none;
    width: 270px;
} */

.loader-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background: white;
    top: 0;
    border: 0;
    left: 0;
    right: 0;
    opacity: 0.8;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 950;
}

.sites_sidenavbar_div {
    width: 160px;
    position: absolute !important;
}

.sites_sidenavbar_a {
    background-color: grey;
}

.sites_firstcard_div,
.project_firstcard_div {
    /* width: 91%;
    margin-left: 165px; */
    color: #808080;
}

.sites_firstcardbody_div,
.project_firstcardbody_div {
    background-color: #8080801f;
}

.sites_firstcardbody_divrow,
.project_firstcardbody_divrow {
    display: flex;
    justify-content: space-between;
}

.sites_secondcard_div,
.project_secondcard_div {
    /* width: 80%; */
    margin: auto;
    margin-top: 20px;
    /* margin-right: 150px; */
    margin-bottom: 80px;
}

.siteadd_sidenavbar_div {
    width: 160px;
}

.siteadd_sidenavbar_a {
    background-color: grey;
}

.siteadd_firstcard_div,
.projectadd_firstcard_div {
    /* width: 91%; */
    /* margin-left: 165px; */
    background-color: #808080;
}


/* .siteadd_firstcardbody_div,
.projectadd_firstcardbody_div {
    background-color: #8080801f;
} */

.siteadd_firstcardbody_div2,
.projectadd_firstcardbody_div2 {
    display: flex;
    justify-content: space-between;
}

.siteadd_firstcardbody_span,
.projectadd_firstcardbody_span {
    font-size: 19px;
    font-weight: bold;
}

.siteadd_secondcard_div,
.projectadd_secondcard_div {
    /* width: 80%; */
    margin: auto;
    margin-top: 20px;
    /* margin-right: 150px; */
}

.siteadd_secondcardbody_label,
.projectadd_secondcardbody_label {
    font-weight: bold;
}

.company_sidenavbar_div,
.worker_sidenavbar_div {
    width: 160px;
    position: absolute !important;
}

.company_firstcardbody_div,
.worker_firstcardbody_div {
    background-color: #8080801f;
}

.company_firstcardbody_row,
.worker_firstcardbody_row {
    display: flex;
    justify-content: space-between;
}

.company_secondcard_div,
.worker_secondcard_div {
    /* width: 80%; */
    margin: auto;
    margin-top: 20px;
    margin-bottom: 80px;
}

.companyadd_sidenavbar_div {
    width: 160px;
}

.companyadd_sidenavbar_a {
    background-color: grey;
}

.companyadd_firstcard_div {
    /* width: 91%; */
    /* margin-left: 165px; */
    color: #808080;
}

.companyadd_firstcardbody_div {
    display: flex;
    justify-content: space-between;
}

.companyadd_secondcard_div {
    /* width: 80%; */
    margin: auto;
    margin-top: 20px;
    /* margin-right: 150px; */
}

.pf_percent {
    width: 130px;
    display: none;
}

.pf_percent:focus {
    outline: #1841E4;
}


/* projectadd_multiple_select_css */

:root {
    --text: "Select values";
}

.multiple_select,
.multiple_select_site {
    height: 24px;
    width: 90%;
    overflow: hidden;
    -webkit-appearance: menulist;
    position: relative;
}

.multiple_select:focus,
.multiple_select_site:focus {
    outline: none;
}

.multiple_select::before,
.multiple_select_site::before {
    content: var(--text);
    display: block;
    margin-left: 5px;
    margin-bottom: 2px;
}

.multiple_select_active {
    overflow: visible !important;
}

.multiple_select option,
.multiple_select_site option {
    display: none;
    height: 18px;
    background-color: white;
}

.multiple_select_active option {
    display: block;
}

.multiple_select option::before,
.multiple_select_site option::before {
    content: "\2610";
}

.multiple_select option:checked::before,
.multiple_select_site option:checked::before {
    content: "\2611";
}


/* projectadd_multiple_select_css */

#w_att_refresh:hover,
.refresh:hover {
    text-decoration: underline;
    color: #1841E4;
}

.ngstBillRemoveBtn {
    font-size: 14px;
}

.ngstBillRemoveBtn:hover {
    text-decoration: underline;
    cursor: pointer;
}

table.sortable thead {
    /* background-color: #eee;
    color: #666666; */
    font-weight: bold;
    cursor: default;
}


/* Table scroll start */

.wrapper1,
.wrapper2 {
    overflow-x: scroll;
    overflow-y: hidden;
}

.wrapper1 {
    width: 100%;
    height: 20px;
}

.div1 {
    width: 100%;
    height: 20px;
}


/* .div2 {
    width: 1000px;
    height: 200px;
    background-color: #88FF88;

overflow-x: auto;

}
*/

.table-responsive::-webkit-scrollbar {
    width: 0;
    /* Hide scrollbar for Chrome, Safari and Opera */
    display: none;
    /* Remove scrollbar space */
    background: transparent;
    /* Optional: just make scrollbar invisible */
}


/* Optional: show position indicator in red */

.table-responsive::-webkit-scrollbar-thumb {
    background: #FF0000;
}

.table-responsive {
    overflow-x: hidden;
    overflow-y: hidden;
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.sticky_thead {
    position: sticky;
    top: 0;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

table {
    position: relative;
    border-collapse: collapse;
}

th,
td {
    padding: 0.25rem;
}

th {
    position: sticky;
    top: 0;
    /* Don't forget this, required for the stickiness */
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}


/* hidding arrows from input type number start here */


/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* Firefox */

input[type=number] {
    -moz-appearance: textfield;
}


/* hidding arrows from input type number end here */