@media (min-width: 768px) {
	.centered-div {
		height: auto; /* Adjust height for larger screens */
		padding: 20px; /* Add some padding for larger screens */
	}
}

.custom-button {
	border-radius: 10px;
}

.centered-div {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0; /* Remove padding */
  margin: 0; /* Remove margin */
}

.card-container {
  max-width: 100%; /* Ensure it does not exceed viewport width */
  padding: 10px; /* Add minimal padding */
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.1));
}

.centered-div {
    display: flex;
    justify-content: center; /* Centers horizontally */
    align-items: center; /* Centers vertically if needed */
    height: auto; /* Adjust height as per your requirement */
}

.custom-hr {
    width: 100%; /* Ensures the HR spans the width of its container */
    height: 5vh; /* Allows the image to maintain its aspect ratio */
    max-width: 400px; /* Adjust max-width as per your design */
    background-image: url('sep1.png'); /* Replace with your image path */
    background-size: contain; /* Ensures the image fits within the HR */
    background-repeat: no-repeat; /* Prevents the image from repeating */
    background-position: center center; /* Centers the image within the HR */
    border: none; /* Removes default HR styling */
}

.mobi-mbri {
font-size: 1rem!important;
}

.dlb:hover, .dlb:focus {
    border: 2px solid #00ff00!important;
}

a, a:hover {
    color: #ffffff!important;
}

.thumb:hover {
  border: 2px solid #00ff00;
  transform: scale(1.05);
  transition: 0.2s ease-in-out;
}