.navbar{
  top: 0; 
  z-index: 50;
  background: rgb(255, 174, 0);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgb(255, 174, 0);
}

.sub-map{
  font-size: 20px;
  font-weight: bolder;
  text-align: center;
  margin: 2px 2px 10px 2px;
}

.list {
  list-style: none;   
  padding: 5px;      
  margin: 5px;     
}

.div-container {
  display: flex;
  gap: 25px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.mapa-img {
  width: 500px;
  height: 400px;
}

.formulario {
  max-width: 800px;
}

.formulario form {
  display: flex;
  flex-direction: column;
}

.formulario label {
  font-size: 14px;
  font-weight: bolder;
  margin-top: 10px;
}

.formulario input,
.formulario textarea {
  border: none;
  border-bottom: 2px solid #ccc;
  padding: 10px 4px;
  font-size: 15px;
  margin-bottom: 20px;
  background: transparent;
  transition: border-color 0.3s;
  width: 500px;
}

.formulario input:focus,
.formulario textarea:focus {
  border-bottom: 2px solid rgb(255, 174, 0);
  outline: none;
}

.formulario textarea{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; 
  resize: none;
  height: 150px;
}

.formulario button {
  margin-top: 15px;
  padding: 10px;
  background-color: rgb(7, 66, 175);
  color: white;
  font-size: 16px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.formulario button:hover {
  background-color: rgb(255, 174, 0);
  color: black;
}

@media (max-width: 480px) {
  .mapa-img {
    width: 300px;
    height: 200px;
  }

  .formulario {
    max-width: 380px;
  }

  .formulario input,
  .formulario textarea {
    width: 380px;
  }
}