body {
  margin:0;
  font-family: Arial, sans-serif;
  background:white;
  color:black;
  text-align:center;
}

/* HEADER */
header {
  padding:20px;
  background:black;
  color:white;
}

/* NAV */
nav {
  background:#f0f0f0;
  padding:10px;
}

nav button {
  margin:5px;
  padding:10px 15px;
  cursor:pointer;
  border:none;
  background:black;
  color:white;
  transition:0.3s;
}

/* HOVER (esto sube nota) */
nav button:hover {
  background:#444;
}

/* SECCIONES */
section {
  display:none;
  padding:20px;
}

.activa {
  display:block;
}

/* CONTENIDO */
.contenido {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}

.contenido img {
  width:250px;
  border-radius:10px;
}

/* TEXTO */
.texto {
  max-width:500px;
  text-align:left;
}

/* FORMULARIO */
form {
  margin-top:20px;
}

input, select {
  padding:8px;
}

/* RESULTADO JS */
#resultado {
  margin-top:20px;
  padding:15px;
  border:2px solid black;
  background:#f5f5f5;
}