div.load {
       position: absolute;
       left: 50%;
       margin-left: -25px;
       margin-top: -25px;
       top: 50%;
     }
     circle {
       fill: none;
       stroke: #ED6E76;
       animation: loading 1.5s ease-in-out infinite;
       animation-direction: alternate;
       stroke-dasharray: 157.07963267948966; 
       stroke-dashoffset: 157.07963267948966; 
     }
     @keyframes loading { 
       from { stroke-dashoffset: 157.07963267948966; } 
       to {stroke-dashoffset: 0; } 
     }
.custom-login-form {
    /* Add your positioning styles here */
    position: relative;
    top: 50px;
    left: 50px;
}
.link {
	width:100%;
}
#rangediv {
	width:500px;
	max-width:100%;
}
.min-width-cell {
    min-width: 50px; /* Adjust the minimum width as needed */
  }
  .table-container {
      overflow-x: auto;
	  position: relative; 
      border-collapse: collapse;
	  width:100%;
  }
	  .fixTableHead { 
	        overflow-y: auto;
	        height: 1080px !important; 
			margin-top:20px;
			position:relative;
			
	      } 
	      th, 
	      table#my-table td { 
	        padding: 2px 15px; 
			border-bottom: 2px solid #b3b19e;
	        
	      } 
		  table#my-table {
		  	transform-origin: 0 0;
			background-color:#ffffff;
		  }
		  td.min-width-cell {
		    min-width: 50px; /* Adjust the minimum width as needed */
		  }
	       .fixTableHead thead th { 
  	        position: sticky; 
  	        top: 0; 
			flex-grow: 1;
			      flex-basis: auto;
			      min-width: max-content;
			      background-color: #ccc;
			      padding: 8px;
				  border:0 !important;
			      white-space: nowrap;
	      } 
#logout {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #f1f1f1;
    padding: 10px; /* Adjust padding as needed */
    text-align: center;
	border-top:1px solid #ED6E76;
	z-index:3;
}
#BtnBlack {
	display: flex;
	border:0px !important;
	height: 46px;
	justify-content: center;
	align-items: flex-start;
	gap: 10px;
	flex-shrink: 0;
	padding: 8px 12px;
	font-size: 14px;
	font-style: normal;
	font-weight: bold !important;
	text-transform: uppercase;
	transition: all 0.3s ease;
	background: var(--Accent, #ED6E76);
	color: var(--gray-1600, #ffffff);
	cursor: pointer; /* Change cursor on hover */
}
#BtnBlack:hover {
	text-decoration: none; transform: scale(1.05);
}
#rapport {
	text-decoration: none;
	border:0px !important;
	height: 46px;
	justify-content: center;
	align-items: flex-start;
	gap: 10px;
	flex-shrink: 0;
	padding: 8px 12px;
	font-size: 14px;
	font-style: normal;
	font-weight: bold !important;
	text-transform: uppercase;
	transition: all 0.3s ease;
	background: var(--Accent, #b3b19e);
	color: var(--gray-1600, #ffffff);
	cursor: pointer; /* Change cursor on hover */
}
#rapport:hover {
	text-decoration: none; transform: scale(1.05);
	}
#Housekeeping {
	text-decoration: none;
	border:0px !important;
	height: 46px;
	justify-content: center;
	align-items: flex-start;
	gap: 10px;
	flex-shrink: 0;
	padding: 8px 12px;
	font-size: 14px;
	font-style: normal;
	font-weight: bold !important;
	text-transform: uppercase;
	transition: all 0.3s ease;
	background: var(--Accent, #b3b19e);
	color: var(--gray-1600, #ffffff);
	cursor: pointer; /* Change cursor on hover */
}
#Housekeeping:hover {
	text-decoration: none; transform: scale(1.05);
	}
#Download {
		text-decoration: none;
		border:0px !important;
		height: 46px;
		justify-content: center;
		align-items: flex-start;
		gap: 10px;
		flex-shrink: 0;
		padding: 8px 12px;
		font-size: 14px;
		font-style: normal;
		font-weight: bold !important;
		text-transform: uppercase;
		transition: all 0.3s ease;
		background: var(--Accent, #b3b19e);
		color: var(--gray-1600, #ffffff);
		cursor: pointer; /* Change cursor on hover */
	}
#Download:hover {
		text-decoration: none; transform: scale(1.05);
	}
#HousekeepingDownload {
		text-decoration: none;
		border:0px !important;
		height: 46px;
		justify-content: center;
		align-items: flex-start;
		gap: 10px;
		flex-shrink: 0;
		padding: 8px 12px;
		font-size: 14px;
		font-style: normal;
		font-weight: bold !important;
		text-transform: uppercase;
		transition: all 0.3s ease;
		background: var(--Accent, #b3b19e);
		color: var(--gray-1600, #ffffff);
		cursor: pointer; /* Change cursor on hover */
	}
#HousekeepingDownloadDownload:hover {
		text-decoration: none; transform: scale(1.05);
	}
.button-container {
    display: inline-block; /* Ensures the container does not occupy the full width */
}

.button-container button,
.button-container a {
    margin-right: 10px; /* Adds some spacing between buttons and anchor elements */
}
input[type='text'] {
	padding:15px 15px 15px 25px;
	border:#cccccc 1px solid !important;
	border-radius:10px;
	font-size:110%;
	width:100%;
	box-sizing: border-box; /* Include padding and border in the total width */
}
.form-group {
    display: block;
    margin-bottom: 10px; /* Adjust the margin as needed */
	width: 100%;
}
.single-field {
    width: 100%;
    box-sizing: border-box;
    padding: 10px; /* Adjust padding as needed */
}
.form-container {
    width: 100%; /* Set the width of the container */
    display: flex;
    justify-content: center; /* Center the form horizontally */
}

#loginform {
    border: 1px solid #ED6E76;
    border-radius: 10px;
    padding: 25px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    max-width: 480px;
}

form#loginform .field-pair,
.single-field {
    display: block; /* Change display to block for better spacing */
    margin-bottom: 20px; /* Adjust the spacing between pairs */
}

.single-field:last-child {
    margin-bottom: 0; /* No margin on the last field */
}
form#loginform input[type='text'], form#loginform input[type='password']{
	padding:15px 15px 15px 25px;
	border:#cccccc 1px solid !important;
	border-radius:10px;
	font-size:110%;
	width:100%;
	box-sizing: border-box; /* Include padding and border in the total width */
}
form#loginform .full-width-label {
    display: block;
	font-weight:bold;
	font-size:110%;
    width: 100%; /* Make the label take up 100% width */
    margin-bottom: 5px; /* Add margin as needed */
}
#loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7); /* semi-transparent white background */
    display: none; /* Initially hidden */
    z-index: 9999; /* Ensure it's on top of other content */
}

#loading p {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/* Styles for the range input */
input[type=range] {
  -webkit-appearance: none; /* Remove default styling for WebKit browsers */
  appearance: none; /* Remove default styling for other browsers */
  width: 100%; /* Set width to fill its container */
  height: 5px; /* Set height of the slider */
  background-color: #b3b19e; /* Set background color */
  border-radius: 5px; /* Set border radius */
  outline: none; /* Remove outline */
  margin: 10px 0; /* Add margin for spacing */
}

/* Styling for the slider thumb */
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; /* Remove default styling for WebKit browsers */
  appearance: none; /* Remove default styling for other browsers */
  width: 20px; /* Set width of the thumb */
  height: 20px; /* Set height of the thumb */
  background-color: #ED6E76; /* Set background color */
  border-radius: 50%; /* Set border radius to make it round */
  cursor: pointer; /* Change cursor to pointer */
}

/* Styling for the slider thumb in Firefox */
input[type=range]::-moz-range-thumb {
  width: 20px; /* Set width of the thumb */
  height: 20px; /* Set height of the thumb */
  background-color: #ED6E76; /* Set background color */
  border-radius: 50%; /* Set border radius to make it round */
  cursor: pointer; /* Change cursor to pointer */
}

.excel-table {
    display: table;
    width: 100%;
    border-collapse: collapse;
	margin-top:25px;
	margin-bottom:25px;
}

.excel-row {
    display: table-row;
}

.excel-cell {
    display: table-cell;
    padding: 8px;
    border: 1px solid #ddd;
}
.excel-cell.single-line {
    min-width: 50px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}
.excel-row.static {
    background-color: #ED6E76;
    font-weight: bold;
}
/* Left-aligned text */
.excel-cell.left {
    text-align: left;
}
span.mobile {
	display:none;
}
.desktop {
	
}
/* Right-aligned text */
.excel-cell.right {
    text-align: right;
}
/* Make it responsive for smaller screens */
@media (max-width: 768px) {
	span.mobile {
		display:block;
	}
	.excel-row.static.desktop {
		display:none;
	}
    .excel-table {
        display: block;
        width: 100%;
        overflow-x: auto; /* Allow horizontal scrolling on small screens */
    }

    .excel-row {
        display: block;
        border: 1px solid #ddd;
        margin-bottom: 10px;
    }

    .excel-cell {
        display: block;
        padding: 5px;
        border-bottom: 1px solid #ddd;
    }
	.excel-cell.right {
	    text-align: left;
	}
    .excel-row.static {
        background-color: #ED6E76;
        font-weight: bold;
    }
}
@media print {

	.excel-table {
	    display: block !important; /* Show the excel-table */
	}

	.excel-row.static.desktop {
	    display: block !important; /* Show the excel-row static desktop */
	}

	.hide-on-print {
	    display: none !important; /* Hide elements with this class on print */
	}
}