/* Estilo para el contenedor principal */
.container {
    max-width: 900px; /* Limita el ancho del contenido */
    margin: 0 auto; /* Centra el contenido horizontalmente */
    padding: 20px; /* Añade un espacio interior */
    text-align: center; /* Alinea el contenido al centro */
    animation: changeColor 30s infinite; /* Cambia los colores cada 30 segundos */
    background-color: #C0C0C0; /* Fondo de un gris muy claro */
    border: 1px solid #DDD; /* Borde sutil */
    transition: background-color 0.5s ease-in-out; /* Transición suave del color de fondo */
}

@keyframes changeColor {
    0%, 100% {
        background-color: #C0C0C0; /* Gris muy claro */
    }
    50% {
        background-color: #ADD8E6; /* Azul pastel */
    }
}



/* Estilos para la imagen de encabezado */
.header-image {
    width: 100%;
    height: 800px;
    background-image: url('XxAlitokerxX-imagen.jpg');
    background-size: cover;
    background-position: top center; /* Ajusta la posición a la parte superior */
    background-repeat: no-repeat;

}

/* Estilos para la imagen de encabezado articulo rollercoin */
.header-image {
    width: 100%;
    height: 800px;
    background-image: url('articulos/rollercoin.jpeg');
    background-size: cover;
    background-position: top center; /* Ajusta la posición a la parte superior */
    background-repeat: no-repeat;

}

/* Estilos para la imagen de encabezado articulo rollercoin */
.header-image {
    width: 100%;
    height: 800px;
    background-image: url('XxAlitokerxX-imagen1.jpg');
    background-size: cover;
    background-position: top center; /* Ajusta la posición a la parte superior */
    background-repeat: no-repeat;

}