@charset "utf-8";
/* CSS Document */
	
	body { 
		/*font-family: Arial, sans-serif; */
		margin: 2px;
	}
	
	.palomita {
		color: green;
		font-size: 20px;
	}
	.navbar {
		display: flex;
		justify-content: space-between;
		align-items: right;
		/*background-color: #333;
		color: white;*/
		padding: 1rem;
	}
	
	.nav-links {
		list-style: none;
		display: flex;
		gap: 20px;
		margin: 0;
		padding: 5px;
	}
	
	.menu-toggle { 
		display: none; 
		background: none; 
		border: none; 
		/*color: white;*/ 
		font-size: 1.5rem; 
		cursor: pointer; 
	}
	
	img { 
		max-width: 100%; height: auto; 
	}
	
	a{
		color:#000;
	}
	
	a:visited{
		color:#000;
	}
	
	.link_azul a{
		color:blue;
	}
	.link_azul a:visited{
		color:blue;
	}
	
	.pagina{
		font-family:microsoft JhengHei Ui;
		/* color:#393d42;*/
		
		background-repeat:no-repeat;
		background-position:top, center;
		margin-top:0;
		margin-bottom:0;
	}
	
	.titulo{
		font-size:18px;
		color:#000;
	}
	
	.menu{
		font-size:16px;
	}
	
	.a_menu{
		color:black;
	}
	
	.font_index{
		background-image: url(../imagenes/fondo.png);
		background-size: 75% cover;
	}
	
	.font{
		background-image:url(../imagenes/fondoopaco.jpg);
	}

	.gold{
		background-color:#b49836;
		border-color:#b49836;
	}
	
	.columna-titulo{
		background-color:#eef8fc; /*C8DBE9;*/
	}
	
	.tabla-ajustable {
		width: 100%; /* O 'auto' si prefieres */
		border-collapse: collapse;
	}
	
	.tabla-ajustable td, .tabla-ajustable th {
		border: 1px solid black;
		padding: 4px;
	}
	
	.contenedor {
		display: grid;
		grid-template-columns: 1.5fr 1fr; /* Dos columnas iguales */
		gap: 5px; /* Espacio entre columnas */
		padding: 5px;
		font-size:14px;
	}
	
	.columna {
		/*background-color: #f0f0f0; C8DBE9*/
		/*background-image: url(imagenes/fondo_columna.png);*/
		padding: 5px;
		/*border: 1px solid #ccc;*/
	}
	
	.contenedor_m {
		display: grid;
		grid-template-columns: 0.5fr 1fr; /* Dos columnas iguales */
		gap: 5px; /* Espacio entre columnas */
		padding: 5px;
		font-size:16px;
	}
	
	.columna_m {
		/*background-color: #f0f0f0; C8DBE9*/
		/*background-image: url(imagenes/fondo_columna.png);*/
		padding: 5px;
		/*border: 1px solid #ccc;*/
	}
	
	.contenedor_f {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr; /* Dos columnas iguales */
		gap: 5px; /* Espacio entre columnas */
		padding: 5px;
		font-size:12px;
	}
	
	.columna_f {
		/*background-color: #f0f0f0; C8DBE9*/
		/*background-image: url(imagenes/fondo_columna.png);*/
		padding: 5px;
		/*border: 1px solid #ccc;*/
	}
	
	/* Ajuste Responsivo (Menos de 768px) */
	@media (max-width: 768px) {
		.contenedor {
			grid-template-columns: 1fr; /* Cambia a 1 sola columna */
		}
		.contenedor_m {
			grid-template-columns: 1fr; /* Cambia a 1 sola columna */
			font-size:12px;
		}
		.contenedor_f {
			grid-template-columns: 1fr; /* Cambia a 1 sola columna */
		}
		.nav-links {
			display: none; /* Ocultar por defecto */
			flex-direction: column;
			width: 255px;
			position: absolute;
			top: 90px;
			left: 10px;
			background-color: rgba(65, 114, 207, 0.85);
			/*background-color: rgba(51, 51, 51, 0.85);*/
			
			transition: all 0.9s ease-in-out; /* Animación de 0.4s */
   			transform: translateY(10px); /* Ligero movimiento */
			border-bottom: 1px solid #444;
			border-radius: 15px; 
			
			text-align: left;
			border-color:#000;
		}
		
		.nav-links a{
			color: white;
		}
		
		.nav-links a:hover{
			color: black;
		}
		
		.nav-links a:visited{
			color:white;
		}
			
		.nav-links.active { 
			display: flex; 
		} /* Mostrar con JS */
		
		.menu-toggle { 
			display: block; 
		}
	}
	
	details {
		border: 1px solid #aaa;
		border-radius: 4px;
		padding: 0.5em;
		width: 95%;
		text-align: left;
	}
	
	summary {
		font-weight: bold;
		cursor: pointer;
		list-style: none; /* Oculta la flecha por defecto */
		position: relative;
		padding-left: 20px;
		color: blue;
	}
	
	/* Crea una flecha personalizada con pseudo-elementos */
	summary::before {
		content: '▶';
		position: absolute;
		left: 0;
		transition: transform 0.2s;
	}
	
	/* Rota la flecha cuando details está abierto */
	details[open] summary::before {
		transform: rotate(90deg);
	}
	
	.TablaPP td{
		color:white;
	}
	
	.TablaPP a{
		color:white;
	}
	
	.TablaPP a:visited{
		color:white;
	}
	
	.Error{
		color:#F00;
		font-size:14px;
	}