/* Variables globales personalizadas para curso math*/
:root{
    /* Colores pinsa */
    --pinsa-primary--color: #7648E0;
    /* Colores time university */
    --time-primary-color: #2d2c38;

}
/******************** ESTILOS GENERALES ********************/
/* Tamaño correcto de los svg/iconos */
.svg-size-xxx{
    width: 12.5em;
}
.svg-size-xxl{
    width: 7.5em;
}
.svg-size-xl{
    width: 5em;
}
.svg-size-lg{
    width: 2.5em;
}
.svg-size-m{
    width: 2em;
}
.svg-size-s{
    width: 1.5em;
}

/******************** ESTILOS DE PINSA ********************/
/* Colores de fondo */
.bg-pinsa-primary {
    background-color: var(--pinsa-primary--color)
}
/* Colores de texto */
.text-pinsa-primary {
    color: var(--pinsa-primary--color)
}

input {
    &:focus, &:focus:placeholder-shown {
        border: thin solid #ced4da !important;
    }
    &:focus:invalid {
        border: medium solid red !important;
    }
    &:valid {
        border: thin solid rgb(25, 135, 84)
    }
}
body {
    height: 100dvh;
    display: flex;
    flex-direction: column;
}
main {
    margin-top: 6rem;
    margin-bottom: 1rem;
}
.container-ch-100 {
    width: clamp(300px, 100ch, 90%);
    height: auto;
    margin-inline: auto;
}
.container-ch-800 {
    width: clamp(300px, 100ch, 90%);
    height: auto;
    margin-inline: auto;
}


.hero-image {
    height: 50dvh;
    background-image: url("../img/JLU/banner.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-origin: border-box;
    background-attachment: fixed;
}

#imgPregunta {
    width: clamp(300px, 40ch, 50%);
}


/* Estilos de time university */
.bg-time-primary {
    background-color: var(--time-primary-color);
}