@import url(https://fonts.googleapis.com/css2?family=Luxurious+Roman&display=swap);


.blog-contenido {
    width: 100%;
    text-align: center;
}
/* Contenedor general del contenido del blog */

.blog-tarjeta {
    width: 230px;
    height: 100%;
    background-color: #D4B89B;
    border: 2px solid #c1ac8b;
    border-radius: 12px;
    overflow: hidden;
    color: black;
    display: flex;
    flex-direction: column;
}
/* Estilos de cada tarjeta del blog */

.blog-tarjeta:hover {
    transform: scale(1.03);
}
/* Efecto de ampliación al pasar el ratón sobre la tarjeta */

.blog-tarjeta img {
    width: 100%;
    height: 130px;
    object-fit: cover;
    display: block;
}
/* Estilos de la imagen principal de la tarjeta */

.tarjeta-texto {
    padding: 15px;
    flex-grow: 1;
}
/* Contenedor del texto de la tarjeta */

.tarjeta-texto h3 {
    font-size: 15px;
    margin-bottom: 8px;
}
/* Estilos del título de la tarjeta */

.tarjeta-texto p {
    font-size: 11px;
}
/* Estilos del texto descriptivo de la tarjeta */

.blog-footer {
    border-top: 2px solid #c1ac8b;
    padding: 10px;
    font-size: 11px;
    color: #5a4a3a;
    overflow: hidden;
}
/* Pie de la tarjeta del blog */

.blog-footer .fecha {
    float: left;
    position: relative;
    top: 5px;
}
/* Posición de la fecha dentro del pie de la tarjeta */

.blog-footer .flecha {
    float: right;
    font-size: 18px;
}
/* Estilo del icono de flecha del pie */

.blog-grid {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    justify-items: center;
}
/* Disposición en cuadrícula de las tarjetas del blog */

.blog-grid a {
    text-decoration: none;
    color: inherit;
    border: none;
}
/* Estilos de los enlaces de las tarjetas */

.blog-grid a:hover {
    text-decoration: none;
    border: none;
}
/* Mantiene el estilo del enlace al pasar el ratón */

.rojop {
    width: 40%;
    height: auto;
    border-radius: 10px;
    border: 2px solid #c1ac8b;
    margin-bottom: 10px;
}
/* Estilos de la imagen destacada roja */

.enlacesr a {
    color: black;
    font-size: 20px;
    font-style: normal;
    text-decoration: none;
}
/* Estilos de los enlaces relacionados */

.flecha-volver {
    display: inline-block;
    margin-top: 10px;
    font-size: 14px;
    text-decoration: none;
    padding: 2px 5px;
    color: black;
}
/* Estilo del enlace para volver atrás */

.vista-coliseo {
    width: 100%;
    height: auto;
    border-radius: 10px;
    border: 2px solid #c1ac8b;
    margin-bottom: 10px;
}
/* Estilos de la imagen del Coliseo */

.pompeya4 {
    width: 50%;
    height: auto;
    border-radius: 10px;
    border: 2px solid #c1ac8b;
    margin-bottom: 10px;
}
/* Estilos de la imagen principal de Pompeya */

.imagenes-pompeya img {
    width: 30%;
    height: auto;
    border-radius: 10px;
    border: 2px solid #c1ac8b;
    margin-bottom: 10px;
}
/* Estilos de las imágenes de la galería de Pompeya */

