body {
    background-image: url('../img/main_background_2025.jpg');
    background-size: cover;
	background-repeat: no-repeat; /* Evita que la imagen se repita */
    background-position: center;
    color: white;
    overflow-x: hidden;
}

.page-container {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.main-content {
  flex: 1; /* Esto hace que el contenido principal ocupe el espacio disponible */
}

footer p {
	font-size: 1.6rem; /* Ajusta el tamanyo de fuente segun sea necesario  */
	color: white;
	margin: 0;
	padding: 1rem 0;
}
		

footer {
	/* background-color: #000; */
	padding: 20px 0;
	position: relative;
	bottom: 0;
	width: 100%;
	text-align: center;
}

.content {
    position: relative;
    z-index: 2;
    padding: 20px;
}

.logo {
	content: url('../img/logocabecera_2025.png');
    width: 100%;
    height: auto;
    object-fit: contain;
}

a,
a:visited {
    color: white;
    text-decoration: none;
}

a:hover,
a:active {
    color: white;
    text-decoration: none;
}

.section-title {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    margin-top: 40px;
    margin-bottom: 20px;
}

table {
    margin: auto;
    color: white;
}

td {
    color: white;
}

/* Sobrescribiendo estilos de Bootstrap para la clase bg-warning */
.bg-warning {
    background-color: #ffcc00 !important;
    color: black !important; /* Texto en negro */
}
.bg-warning td {
    color: black !important; /* Texto en negro */
}

.bg-warning a,
.bg-warning a:visited {
    color: black !important; /* Enlaces en negro */
}

.bg-warning a:hover,
.bg-warning a:active {
    color: black !important; /* Enlaces en negro al interactuar */
}

.textS {
 	font-size: 0.8rem;
}

.textM {
 	font-size: 1rem;
}

.textL {
 	font-size: 1.5rem;
}

.textXL {
 	font-size: 2rem;
}
	
.textXXL {
 	font-size: 2.1rem; /* Se utiliza en los botones */
}

.textXXXL {
 	font-size: 2.5rem; /* Se utiliza en los botones */
}

.text4XL {
 	font-size: 3rem; /* Se utiliz<a en map */
}
	
.text5XL {
 	font-size: 4rem; /* Se setmatchSU */
}

.justify-text {
	display: block; /* Cambia el span a elemento de bloque */
	text-align: justify; /* Justifica el texto */
	width: 360px; /* Define un ancho para el texto justificado */
	margin: 0 auto; /* Centra el span en su contenedor, opcional */
 }