body{
    background-color: hsl(0, 0%, 96%);
}
#MainLoader{
    z-index: 900; 
    position: absolute; 
    left: 0; 
    top: 0; 
    height:100% !important; 
    width: 100% !important; 
    background: white;
}
.select-wrapper, .form-outline {
    background-color: white;
}
.statCardClicker{
   cursor: pointer;
}
.statCardClicker:hover{
    background-color: #2125290f;
}
#main-navbar{
    z-index: 2000;
}
.modal-backdrop {
    z-index: 2050;
}
.modal {
    z-index: 2055;
}
.autocomplete-dropdown-container,
.select-dropdown-container{
    z-index: 2065;
}
.toast-fixed {
    position: fixed;
    z-index: 3010;
}
.popconfirm-backdrop {
    z-index: 2070;
}
.file-upload {
    height: 150px;
}
.lightbox-gallery{
    z-index: 2100;
}
.initialsBox{
    width: 25px;
    height: 25px;
    text-align: center;
    padding-top: 2px;
}
.file-remove-button{
    background-size: 50%;
}
h6.filename {
    word-break: break-all;
} 
#QuotesDataTableWidget table td, 
#QuotesDataTableWidget table th {
    padding: 0.5rem 0.4rem 0.5rem 1.2rem;
}
.datatable.datatable-sm td, .datatable.datatable-sm th {
    padding: 0.5rem 0.7rem;
}
.InquiriesTable.datatable.datatable-sm th:nth-child(1){
    padding-left: 25px !important;
}
#QuotesDataTableWidget table th:nth-child(1),
#QuotesDataTableWidget table td:nth-child(1){
    display: none;
}
#QuotesDataTableWidget table th:nth-child(5),
#InquiriesTable table th:nth-child(1){
    padding-left: 25px !important;
}
.InquiriesTable table th:nth-child(8){
    
}
.InquiriesTable table th:nth-child(3),
.InquiriesTable table td:nth-child(3){
    display:none;
}
#QuotesDataTableWidget table{
    margin-bottom: 20px;
}
#QuotesDataTableWidget div.datatable-pagination {
    padding: 1.2rem 0 0.2rem 0;
}
.datatable.datatable-sm tbody tr:last-child {
    border-bottom: transparent;
    height: 40px;
}
#getEmployeesByNameField.disabled,
#getCustomerByNameField.disabled{
    background-color: #e9ecef;
}
.selectedCustomerContainer,
.selectedEmployeeContainer
{
    margin-left: 6px;
    float: left;
    background: grey;
    padding: 0px 5px;
    margin-top: 10px;
    color: white;
    border-radius: 4px;
}
.selectedCustomerContainer .btn-close,
.selectedEmployeeContainer .btn-close
{
    background-size: 10px;
    background-position-y: 8px;
    padding: 1px 2px;
    display: inline-block;
    cursor: pointer;
}
.customerAutoCompleteArea .form-outline .form-control~.form-label, 
.employeesAutoCompleteArea .form-outline .form-control~.form-label {
    transform: translateY(-1rem) translateY(0.1rem) scale(.8);
}
.customerAutoCompleteArea .form-outline .form-control,
.employeesAutoCompleteArea .form-outline .form-control {
    box-shadow: none!important;
}
.customerAutoCompleteArea .form-outline .form-control~.form-notch .form-notch-middle, 
.employeesAutoCompleteArea .form-outline .form-control~.form-notch .form-notch-middle {
    border-top: none;
}
.addNewUserButton .spinner-grow {
    vertical-align: -0.275em !important;
    margin-left: 7px;
}
.plusIcon{
    margin-left:10px;
}
/* Hide first column */
#districtsTable tr td:nth-child(5), 
#districtsTable th:nth-child(5),
#salespersonsTable tr td:nth-child(5), 
#salespersonsTable th:nth-child(5){
    display: none;
}
#EditTodoFileUpload .file-upload-preview{
    padding:10px;
}
.file-upload-preview-img {
    width: 100%;
    height: 100%;
    -o-object-fit: scale-down !important;
    object-fit: scale-down !important;
}
.rotate {
  animation: rotation 1s infinite linear;
}
#AvatarThumbnail{
    max-height: 200px;
}
.leftbordered{
    border-top-left-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
}
.rightbordered{
    border-top-right-radius: 16px !important;
    border-bottom-right-radius: 16px !important;
}
#ToogleMap{
    width: max-content;display: flex;
    justify-content: space-between;
    align-items: center;
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(0,0,0,.6);
    cursor: pointer;
    background-color: #eceff1;
    border-radius: 16px;
    transition: opacity .3s linear;
    word-wrap: break-word;
    text-transform: none;
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
@media only screen and (max-width: 500px) {
    .datepicker-toggle-button{
        padding:6px !important;
    } 
}