#searchHelplinesBtn {
  background-color: #fff; /* White background */
  color: black; /* Black text */
  font-weight: bold; /* Bold text */
  font-family: Arial, sans-serif; /* Sans-serif font. You can change this to any sans-serif font you prefer */
  border: 2px solid black; /* Black border */
  margin: 20px 0; /* Adjusted margin */
  padding: 10px 20px; /* Padding inside the button, adjust as needed */
  border-radius: 10px; /* Rounded corners */
  cursor: pointer; /* Changes the cursor to a pointer to indicate it's clickable */
  text-decoration: none; /* Ensures text isn't underlined */
  transition: background-color 0.2s, color 0.2s; /* Smooth transition for hover effects */
}

#searchHelplinesBtn:hover {
  background-color: black; /* Changes background to black on hover */
  color: #fff; /* Changes text color to white on hover */
}

.search-helplines-box-container {
  display: flex;
  flex-direction: column; /* Stacks children vertically */
  justify-content: center; /* Centers children vertically in the container */
  align-items: center; /* Centers children horizontally in the container */
  text-align: center; /* Centers text for any text inside the container, if needed */
  height: 100vh; /* Adjust the height as needed, vh units will make it take up the full viewport height */
  width: 100%; /* Adjust the width as needed, 100% for full width */
}

/* Adjusting form layout */
#searchForm {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: fit-content; /* Makes the form only as wide as its contents */
  margin: auto; /* Centers the form in the container */
}

#searchForm label,
#searchForm select,
#searchForm input[type="text"],
#searchForm input[type="checkbox"] + label {
  margin: 10px 0; /* Adds some space between elements */
  display: block; /* Ensures elements are treated as block-level for correct alignment */
}

#searchForm select {
  padding: 10px;
  font-size: 1.2em;
  font-family: 'Open Sans', sans-serif;
  border-radius: 5px;
  margin: 5px;
  color: #508d24; /* Text color */
  font-weight: 700; /* Bold font */
  border: 1px solid #ccc; /* Border color */
}

#searchForm input[type="text"] {
  padding: 10px;
  font-size: 1.2em;
  font-family: 'Open Sans', sans-serif;
  border-radius: 5px;
  margin: 5px;
  border: 1px solid #ccc; /* Border color */
}

#searchForm input[type="checkbox"] {
  margin-right: 5px;
}

.helpline-entry-container {
  display: flex;          /* Use flexbox to layout items in a row */
  flex-wrap: wrap;        /* Allows items to wrap to next row if there isn't enough space */
  gap: 20px;              /* Gap between items */
  justify-content: center; /* Centers the items horizontally */
  text-align: center;
}

.helpline-entry {
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* A subtle shadow at the bottom */
  padding: 16px;         /* Padding inside each box */
  background-color: #ffffff;  /* Background color of the box */
  border-radius: 8px;    /* Rounded corners for each box */
  transition: transform 0.2s, box-shadow 0.2s; /* Transition for hover effect */
}

/* Optional: Adding a hover effect for a slight "lift" effect */
.helpline-entry:hover {
  transform: translateY(-5px);   /* Lifts the box slightly on hover */
  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.1); /* Slightly larger shadow on hover */
}
#searchForm label[for="name"] {
  position: absolute; /* Position the label */
  left: -9999px; /* Move the label off-screen */
}
#searchForm label[for="keyword"] {
  position: absolute; /* Position the label */
  left: -9999px; /* Move the label off-screen */
}
.search-helplines-box-container {
  display: flex;
  flex-direction: column; /* Stacks children vertically */
  justify-content: center; /* Centers children vertically in the container */
  align-items: center; /* Centers children horizontally in the container */
  text-align: center; /* Centers text for any text inside the container, if needed */
  height: 100vh; /* Adjust the height as needed, vh units will make it take up the full viewport height */
  width: 100%; /* Adjust the width as needed, 100% for full width */
  border: 2px solid black; /* Border around the container */
  padding: 20px; /* Add padding inside the border */
  border-radius: 10px; /* Rounded corners for the border */
}

.search-helplines-box-container h2,
.search-helplines-box-container p {
  margin-top: 0; /* Remove default margin */
}
.show-more-btn {
  display: block;
  margin: 15px auto;
  padding: 10px 20px;
  background-color: #005eb8;
  color: white;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.3s ease;
}

.show-more-btn:hover {
  background-color: #004a94;
}
