body {
   margin: 0;
   padding: 0;
   background-color: #C8C2BC;
   min-height: 100vh; /* Asegura que el cuerpo de la página ocupe al menos la altura completa del viewport. */
   display: flex;
   flex-direction: column;
}
.barra{
   font-size: 24px;
}
.content{
   flex: 1;
}
.juan{
   font-size: 50px;
   margin-right: 15px;
}

footer{
   height: 70px;
}
.counter{
   margin-top: 100px;
}
.blanco{
   color: whitesmoke;
}
   
.gallery {
   display: flex;
   flex-wrap: wrap;
   max-width: 800px; /* Cambia el ancho máximo según tu diseño */
   margin: 0 auto;
}

.column {
   flex: 33.33%; /* Crea tres columnas */
   padding: 5px;
   box-sizing: border-box;
}

img {
   max-width: 100%;
   height: auto;
   display: block;
   margin: 0 auto;
}

a{
   color: black;
   text-decoration: none;
}
.link:hover{
   font-size: larger;
}

.gallery {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-around;
}

.image-container {
   width: 200px; /* Ancho fijo para cada imagen */
   height: 200px; /* Alto fijo para cada imagen */
   margin: 10px; /* Espacio entre imágenes */
}

.image-container img {
   max-width: 100%; /* Asegura que las imágenes no se desborden del contenedor */
   max-height: 100%;
}

/* ----------------------------------------------------------------------------------- */
.poem {
   text-align: center; /* Centra el poema en la página */
   font-style: italic; /* Usa cursiva para el texto */
   line-height: 1.5; /* Espaciado entre líneas para facilitar la lectura */
}

.stanza {
   margin-bottom: 20px; /* Espacio entre estrofas */
}

.line {
   font-size: 1.2em; /* Tamaño de fuente para las líneas del poema */
}

.author {
   text-align: right; /* Alinea el autor a la derecha */
}

.obras{
   font-family: 'Bebueas Neue';
}
.pinturas{
   font-family: 'Black Ops One';
}
.figu{
   font-family: 'Michroma';
}
.grecia{
   font-family: 'Martian Mono';
}
.memo{
   font-family: 'Romanesco';
   font-size: larger;
}
.nudo{
   font-family: 'Browse Fonts';
}
.tramas{
   font-family: 'Gabarito';
}
.caos{
   font-family: 'Open Sans';
}
.columna{
   font-family: 'Mohave';
}
.yunques{
   font-family: 'Dancing Script';
}
.don{
   font-family: 'Fjalla One';
}
.siglo{
   font-family: 'Cinzel';
}
.estudios{
   font-family: 'Inclusive Sans';
}
.desbaratados{
   font-family: 'Cormorant';
}
.interiores{
   font-family: 'Paytone One';
}
.jardin{
   font-family: 'Changa';
}
.carmina{
   font-family: 'Kaushan Script';
}
.libros{
   font-family: 'Macondo';
}
h3{
   color: #0802A3;
}
.footer {
   background-color: #333; /* Estilo de fondo del footer */
   color: #fff; /* Color del texto en el footer */
   padding: 10px; /* Espacio interno del footer */
   text-align: center;
   margin-top: 150px;
}