/*esta es la hoja de estilos de la página Las Primicias*/
h1 {
  font-family: monserrat;
  font-size: 40px;
  color: #0000FF;
  font-weight: 900;
  margin: 0; /* Quita márgenes por defecto para un mejor ajuste */
  text-align: center;
  height: 80px;
}

.contenedor-titulo {
  display: flex; /* Activa el modo flexible */
  align-items: center; /* Centra la imagen verticalmente con el texto */
  gap: 15px; /* Añade espacio entre el texto y la imagen */
  background-color: #e7eded;
  padding: 10px;
  width: 100%;
  height: 50%;
  margin-top: 0;
}

img {
  width: 170px; /* Ajusta el tamaño de tu imagen según necesites */
  height: auto;
  background-image: none;
}

body {
  background-image:; /* Ruta de tu GIF */
  background-size: cover; /* Ajusta el tamaño al fondo */
  background-position: center; /* Centra la imagen */
  background-repeat: no-repeat; /* No repetir el GIF */
   /* Opcional: fija el fondo */
  height: 90vh;
  background-position-y: 100px; /* Asegura altura completa */
 }

h2 {
  color: #FF0033;
  font-family:"Verdana, sans-serif";
  font-size: 30px;
  text-align: center;
  background-color: #FFE4B5;
  padding: 10px;
  margin: 0;
  

}

.contenedor-fondo {
  background-image: url("cascada 4.gif");
  background-size: cover;
  background-position: center;
  position: relative; /* Necesario para posicionar el overlay */
  width: 100%;
  height: 90%; /* Altura total de la pantalla */
}

/* Esta es la capa que permite ver el texto */
.contenedor-fondo::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Negro con 50% transparencia */
  z-index: 1; /* Por encima del fondo, por debajo del texto */
}

.contenido {
  position: relative;
  z-index: 2; /* Asegura que el texto esté encima de la capa */
  color: white; /* Color de texto claro para contraste */
  text-align: center;
  padding-top: 3px;
}

p1 {
   color: #00CED1;
   font-family: 'trebuchet';
   font-size: 22px;
   text-align: center;
   text-justify: distribute-all-lines;
}
p2{
   font-family: Georgia, 'Times New Roman', Times, serif;
   text-align: justify;
   font-size: 20px;
   color: #FFFF00;
   text-align: center;
}
span {
   color: rgba(248, 246, 248, 0.977);
   font-size: 24px;
   text-decoration: underline;
}
a {
    font-family: tahoma;
    color: coral;
    font-size: 35px;
    text-decoration: none;
}
p3 {
   font-size: 22px;
   color: ghostwhite;
} 
header {
  background:linear-gradient(to right,#FFDEAD, #FFE4B5);
  width: 100%;
  height: 250px;
}
.bolsilibros {
  background-color: #DAA520;
  width: 160px;
  height: 40px;
  font-size: 20px;
  font-family: Georgia;
  font-style: oblique;
  font-weight: 900;
  margin: 10px;
  padding: 5px;
  border: 5px;
  border-radius: 10px;
  border-color: #DAA520;
  text-align: center;
  color: #0000FF;
  cursor: pointer;
  }
  .bolsilibros:hover {
    background-color: #c8ee8b;
  }
  .libros {
  background-color: #00BFFF;
  width: 160px;
  height: 40px;
  font-size: 20px;
  font-family: Georgia;
  font-style: oblique;
  margin: 10px;
  border: 5px;
  border-radius: 10px;
  border-color: #DAA520;
  text-align: center;
  color: #F0FFFF;
  cursor: pointer;
  }
  .libros:hover {
    background-color: #c8ee8b;
  }
  
  .entremeses {
  background-color: #e9ec26;
  width: 160px;
  height: 40px;
  font-size: 20px;
  font-family: Georgia;
  font-style: oblique;
  font-weight: 900;
  margin: 10px;
  border: 5px;
  border-radius: 10px;
  border-color: #DAA520;
  text-align: center;
  color: #a908a1;
  cursor: pointer;
  }
  .entremeses:hover {
    background-color: #c8ee8b;
  }
  .contacto {
  background-color: #08ca15;
  width: 160px;
  height: 40px;
  font-size: 20px;
  font-weight: 900;
  font-family: Georgia;
  font-style: oblique;
  margin: 10px;
  border: 5px;
  border-radius: 10px;
  border-color: #DAA520;
  text-align: center;
  color: #7b6b03;
  cursor: pointer;
  }

  .contacto:hover {
    background-color: #c8ee8b;
  }

  footer{
    color: #1d034f;
    text-align: justify;
    font-size:16px;
    font-family: 'Times New Roman', Times, serif;
    font-weight: 400;   
  }

  .pie {
    background-color: #cbf2f3;
    padding: 0 10px 8px 10px;
  }