/* Estilos para evitar doble scroll y agregar footer */
html, body {
  height: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  background-color: #F6E0C8;
  /* overflow: hidden; */
  /* background-color: #0D6B49; */
}

header {
  /* background-color: #FDE5CC; */
  text-align: center;
  padding: 10px 0;
  font-size: 18px;
  font-weight: bold;
}

/* header img {
  width: 30%; 
  float: left;
}
 */
#cont {
  flex: 1; /* Permite que el contenedor del iframe ocupe todo el espacio disponible */
  position: relative;
}

iframe {
  width: 100%;
  height: 100%;
  border: none;
  /* background-color: #0D6B49; */
}

footer {
  background-color: #FDE5CC;
  text-align: center;
  padding: 10px 0;
  border-top: 1px solid #ddd;
  display: none; /* Oculto hasta que se cargue el iframe */
}

.img-container {
  aspect-ratio: 16 / 9; /* Relación de aspecto fija */
  overflow: hidden; /* Oculta cualquier contenido extra */
  max-width: 360px;
}

.img-container img {
  width: 100%; /* Escala la imagen */
  height: 100%; /* Rellena el contenedor */
  object-fit: cover; /* Mantiene la proporción */
}

footer p {
  margin: 0;
  font-size: 14px;
  color: #333;
  display: inline-block;
  vertical-align: middle;
}