/* Add this to your CSS or style section */
.map-title {
  position: absolute;
  top: 10px;
  left: 0;
  width:700px;
  background-color: rgba(255, 255, 255, 0.9);
  padding: 20px;
  border: 0;
  border-radius: 4px;
  font-size: 28px;
  line-height: 1.3;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  z-index: 1;
}

#sidebar {
  display: none;
  position: absolute;
}


.layer-control {
  display: none;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 10px;
  position: absolute;
  top: 130px;
  left: 10px;
  z-index: 1001; /* Set z-index higher for layer control to appear above the button */
}
.expand-button {
  cursor: pointer;
  background-color: white;
  color: grey;
  padding: 5px 10px;
  border: 1px solid;
  border-radius: 5px;
  position: absolute;
  top: 130px;
  left: 10px;
  z-index: 1000; /* Set z-index lower for the button */
}
#resetButton {
  background-color: #e50024;
  color: #fff;
  border: none;
  padding: 5px 10px;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s;
}

#resetButton:hover {
  background-color: #d76b7b;
}
.footer-stripe {
  background-color: #e50024; /* Red color */
  height: 30px; /* Set the desired height */
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999; /* Adjust the z-index as needed */
}


.logo-container {
  display: flex; /* Display logos side by side */
  justify-content: center; /* Center align the logos horizontally */
  align-items: center; /* Center align the logos vertically */
}

.logo {
  width: 60px; /* Adjust the width as needed */
  height: 20px; /* Maintain aspect ratio */
  margin: 5px; /* Adjust the margin as needed */
  top:200px;
}
.zoom-container {
  position: absolute;
  top: 10px; /* Adjust the top value as needed */
  left: 10px; /* Adjust the left value as needed */
  z-index: 1; /* Ensure it's above the map */
}

.zoom-button {
  background: #fff; /* Background color for the buttons */
  border: 1px solid #ccc; /* Border for the buttons */
  border-radius: 50%; /* Make the buttons circular */
  padding: 10px; /* Adjust padding as needed */
  margin: 5px; /* Adjust margin as needed */
  cursor: pointer;
}

.zoom-button i {
  font-size: 20px; /* Adjust the icon size as needed */
}