body {
    background: #F3F3F3;
    margin: 0;
    text-align: center;
    color: #3A3A3A;
    font-family: Source Sans Pro, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 1.0em;
    text-decoration: none;
}

a:link {
    color: #688092;
    font-weight: bolder;
    text-decoration: none;
}

a:visited {
    color: #688092;
    font-weight: bolder;
    text-decoration: none;
}

a:hover {
    color: #688092;
    font-weight: bolder;
    background: #E0E5E9;
    text-decoration: underline;
}

p {
    color: #3A3A3A;
    font-family: Source Sans Pro, Helvetica Neue, Helvetica, Arial, sans-serif;
    text-decoration: none;
}

h3 {
    font-weight: bold;
}

h1 {
    font-size: 1.6em;
    font-weight: bolder;
    text-align: left;
    vertical-align: middle;
    padding: 0% 0% 2% 0%;
}

h2 {
    font-weight: bold;
}

.oneColLiqCtrHdr #container {
    width: 100%;
    background: #F3F3F3;
    margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
    text-align: left; /* esto anula text-align: center en el elemento body. */
}

.oneColLiqCtrHdr #pre-header {
    background: #cb0017;
    padding: 1% 1% 1% 1%;
}

.oneColLiqCtrHdr #header {
    background: white;
    padding: 1% 1% 1% 1%;
}

.oneColLiqCtrHdr #mainContent {
    padding: 2% 3% 2% 3%; /* recuerde que el relleno es el espacio situado dentro del cuadro div y que el margen es el espacio situado fuera del cuadro div */
    background: #FFFFFF;
}

.oneColLiqCtrHdr #contenedor {
    padding: 2% 8% 2% 8%;
    background: #F3F3F3;
}

.oneColLiqCtrHdr #footer {
    padding: 0 2%; /* este relleno coincide con la alineación izquierda de los elementos de los divs que aparecen por encima de él. */
    background: #F3F3F3;
    font: 95% Arial, Verdana, sans-serif;
    font-weight: bold;
}

.oneColLiqCtrHdr #footer p {
    margin: 0; /* el ajuste en cero de los márgenes del primer elemento del pie evitará que puedan contraerse los márgenes (un espacio entre divs) */
    padding: 1%; /* el relleno de este elemento creará espacio, de la misma forma que lo haría el margen, sin el problema de la contracción de márgenes */
}

.selecciona {
    display: inline;
}

.aviso {
	/*font: Arial, Verdana, sans-serif;*/
    font-size: 90%;
}

.zona {
    font-weight: bold;
}

.cajetin {
 	/* font: Source Sans Pro, Helvetica Neue, Helvetica, Arial, sans-serif; */
    color: #CB0017;
    font-size: 0.8em;
}

.curso {
    background: #006698;
    color: #FFFFFF;
    font-weight: bolder;
    text-decoration: none;
}

.bot {
    text-align: center;
    margin: 2%;
}

.boton {
    font-size: 100%;
}

#redessociales {
    margin-top: 0.2%;
    margin-bottom: 0.5%;
    text-align: center;
    display: block;
}

#redessociales a {
    color: #CB0017;
}

@media only screen and (max-width: 500px) and (max-height: 749px) {
    img {
        width: 55%;
        text-align: left;
        height: auto;
        display: block;
        margin: 0.5% 0.5% 0.5% 0.5%;
    }

    #redes {
        width: 30%;
        height: auto;
        text-align: center;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    body {
        font-size: 0.8em;;
        background: #FFFFFF;
    }

    .cajetin {
        font-size: 0.7em;
    }

    .oneColLiqCtrHdr #contenedor, .oneColLiqCtrHdr #container, .oneColLiqCtrHdr #footer, .oneColLiqCtrHdr #contenedor {
        background: #FFFFFF;
    }

    .oneColLiqCtrHdr #header {
        padding: 2% 5% 2% 5%;
    }

    .selecciona {
        display: block;
    }
}

@media only screen and (max-width: 500px) and (min-height: 750px) {
    img {
        width: 55%;
        text-align: left;
        height: auto;
        display: block;
        margin-left: 0.5%;
    }

    #redes {
        width: 30%;
        height: auto;
        text-align: center;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    body {
        font-size: 0.85em;;
        background: #FFFFFF;
    }

    .cajetin {
        font-size: 0.7em;
    }

    h1 {

    }

    .oneColLiqCtrHdr #contenedor, .oneColLiqCtrHdr #container, .oneColLiqCtrHdr #footer, .oneColLiqCtrHdr #contenedor {
        background: #FFFFFF;
    }

    .oneColLiqCtrHdr #header {
        padding: 2% 7% 2% 7%;
    }
}

.selecciona {
    display: block;
}

/**********************************/
.select2-container {
    width: 75% !important; /* Para que ocupe todo el ancho disponible */
    text-align: left;
}

.select2-selection {
    height: 30px !important; /* Ajusta la altura según tus necesidades */
    font-size: 14px; /* Ajustar el tamaño de la fuente */
    text-align: left;
}