body, html {
    margin: 0;
    padding: 0;
    background-color: #FFFFFF; /* Fondo blanco */
    font-family: Arial, sans-serif;
}

.contenedor {
    text-align: center; /* Centra el contenido */
    padding: 20px;
}

.imagen-centrada {
    max-width: 90vw; /* Máximo 90% del ancho de la ventana de visualización */
    max-height: 80vh; /* 80% de la altura de la ventana de visualización */
    width: auto; /* Ajusta automáticamente el ancho para mantener la proporción de la imagen */
    margin: 0 auto; /* Centra la imagen horizontalmente */
    display: block; /* Asegura que la imagen no esté inline */
    object-fit: contain; /* Mantiene las proporciones de la imagen sin recortarla */
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); /* Añade sombra a la imagen */
    margin-bottom: 50px; 

}

.logo-centrado {
    width: auto; 
    height: 15vh;
    padding-bottom: 30px;
    margin: 0 auto; /* Centra la imagen horizontalmente */
    display: block; /* Asegura que la imagen no esté inline */
}

p {
    margin-top: 20px; /* Espacio entre la imagen y el texto */
}
/* Estilo del contenedor del menú */


.menu-icon {
    font-size: 60px;
    cursor: pointer;
    position: fixed; /* Se posiciona fijo en la pantalla */
    top: 0; /* Arriba del todo */
    right: 0; /* A la derecha del todo */
    padding: 20px; /* Espaciado para no estar pegado a la esquina */
    user-select: none;
    z-index: 1000; /* Asegura que el ícono esté sobre otros elementos */
}

.menu-content {
    display: none;
    position: fixed; /* Se posiciona fijo en la pantalla */
    top: 0; /* Arriba del todo */
    right: 0; /* A la derecha del todo */
    width: 200px; /* Ancho del menú */
    background-color: #f3f3f3;
    margin-top: 60px; /* Se ajusta para no superponerse con el ícono */
    box-shadow: -4px 0 5px -2px rgba(0,0,0,0.5); /* Sombra para dar profundidad */
}

.menu-content ul {
    list-style-type: none;
    padding: 0;
    margin: 0; /* Elimina margen por defecto */
}

.menu-content ul li a {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: #333;
    border-bottom: 1px solid #ddd;
}

.menu-content ul li a:hover {
    background-color: #ddd;
}

#check-menu {
    display: none; /* Oculta el checkbox visualmente */
}

/* Estilo para mostrar el menú cuando el checkbox esté activo */
#check-menu:checked ~ .menu-content {
    display: block;
}
.descargar-btn {
    display: inline-block; /* Permite la aplicación de dimensiones y alineación */
    padding: 10px 20px; /* Espacio interno alrededor del texto */
    background-color: orange; /* Color de fondo */
    color: white; /* Color del texto */
    border: 2px solid white; /* Borde blanco */
    text-decoration: none; /* Elimina el subrayado del enlace */
    font-weight: bold; /* Negrita para el texto */
    margin-top: 20px; /* Espacio por encima del botón */
    /* Removido position: fixed; */
    transform: translateX(-50%); /* Centra el botón respecto a su posición actual */
    left: 50%; /* Combinado con transform, centra el botón */
}

.descargar-btn:hover {
    background-color: #e69500; /* Color al pasar el mouse */
}
.texto-aviso {
    font-size: 30px; /* Tamaño de la letra */
    font-family: 'Raleway', sans-serif; /* Fuente Raleway */
    text-align: left; /* Centra el texto */
    width: 60%; /* Ocupa el 60% de la pantalla */
    margin: 0 auto; /* Centrado horizontal */
    padding: 20px 0; /* Espaciado superior e inferior para no pegar al texto o elementos adyacentes */
    line-height: 1,8; /* Aumenta el interlineado a 2 */
}

