@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400&display=swap");

body {
    font-family: "Montserrat", sans-serif;
}
.pdfview{
    width: 100%;
    aspect-ratio: 2/1;
}
:root {
    --azul: #165238;

    --azul-alt: #1b9cfc;

    --naranja: #94a44a;

    --naranja-high: #d2af6d;

    --naranja-alt: #ff7b23;

    --naranja-alt-2: #ff4800;

    --naranja-mate: rgba(255, 219, 185, 0.623);

    --azul-mate: rgba(185, 230, 255, 0.623);

    --azul-intenso: #d2af6d;

    --blanco-mate: rgb(255, 255, 255);

    --negro-mate: rgb(22, 22, 22);

    --verde: #5f27cd;

    --verde-oscuro: #15866a;

    --main-color: #94a44a;

    --child-color: #aad406;
}

.btn-primary,
.form-check-input:checked {
    background-color: #3742fa;

    border-color: #3742fa;
}

.btn-primary:hover {
    background-color: #1e3799;

    border-color: #1e3799;
}

.swal-lg {
    width: 80% !important;
}

.swal-md {
    width: 50% !important;
}

.swal-xl {
    width: 90% !important;
}

.text-primary {
    color: #2b52bb !important;
}

#logo-nav {
    width: 8vw;
    height: auto;
}

#navegacion {
    background-image: radial-gradient(
        circle farthest-corner at 32.7% 49.8%,
        rgba(28, 88, 238, 1) 0%,
        rgba(0, 39, 137, 1) 100.2%
    );

    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);

    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);

    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);

    z-index: 10;
}

.logo-pie {
    max-width: 16rem;
    height: auto;
    object-fit: contain;
}

.logo-min {
    width: 30%;
}

#navegacion .nav-link:not(.btn) {
    color: var(--blanco-mate);

    margin: 0px 8px;

    border-radius: 4px;
}

#navegacion .nav-link:not(.btn):not(.dropdown-toggle):hover {
    background-color: #f1f1f140;
}

.nav-link.dropdown-toggle::after {
    transition: all ease 80ms;
}

.nav-link.dropdown-toggle.show::after {
    transition: all ease 80ms;

    transform: rotate(-180deg);
}

#navegacion .dropdown-item {
    font-size: 14px;

    padding: 0px auto;
}

#navegacion .dropdown-item:hover {
    background-color: #e9e9e9;
}

#contenido-articulo img {
    cursor: pointer;

    transition: all ease 120ms;
}

#contenido-articulo img:hover {
    box-shadow: 0px 0px 8px 0px rgba(255, 152, 31, 0.75);

    -webkit-box-shadow: 0px 0px 8px 0px rgba(255, 152, 31, 0.75);

    -moz-box-shadow: 0px 0px 8px 0px rgba(255, 152, 31, 0.75);

    transition: all ease 120ms;
}

.dropdown-menu > li > a:hover {
    background: var(--azul-mate);

    color: var(--negro-mate);
}

.carrusel-imagen {
    /* background-color: #f2f2f2 !important; */

    width: 100%;
    aspect-ratio: 16/4;

    background-position: center !important;

    background-repeat: no-repeat !important;

    background-color: rgb(238, 238, 238) !important;
}

.carrusel-imagen.contain {
    background-size: contain !important;
}

.carrusel-imagen.cover {
    background-size: cover !important;
}

.carrusel-contenido {
    width: 100%;

    height: auto;

    color: black;
}

.carrusel-contenido > div p {
    margin-bottom: 1px;
}

#caja-registro {
    box-shadow: 6px 6px 0px 0px rgba(225, 233, 255, 0.649);
}

.btn-azul {
    background: var(--azul);

    color: #fff;
}

.btn-azul:hover {
    color: #fff;

    opacity: 0.9;
}

.btn-verde {
    background: var(--verde);

    color: #fff;
}

.btn-verde:hover {
    color: #fff;

    opacity: 0.9;
}

.btn-naranja {
    background: var(--naranja-alt);

    color: #fff;
}

.btn-naranja:hover {
    background: var(--naranja-alt-2);

    color: #fff;
}

.btn-azul-intenso {
    background: var(--azul-intenso);

    color: #fff;
}

.btn-azul-intenso:hover {
    color: #fff;

    opacity: 0.9;
}

.banda-naranja {
    background: #bbb;

    height: 6px !important;

    margin: 0 auto;

    width: 50%;
}

.sombra-verde {
    box-shadow: 4px 4px 0px 0px rgba(154, 157, 236, 0.41);
}

.sombra-azul {
    box-shadow: 4px 4px 0px 0px rgba(142, 148, 153, 0.41);

    -webkit-box-shadow: 4px 4px 0px 0px rgba(142, 148, 153, 0.41);

    -moz-box-shadow: 4px 4px 0px 0px rgba(142, 148, 153, 0.41);
}

.sombra-azul-90 {
    box-shadow: 4px 4px 0px 0px rgba(142, 148, 153, 0.41);

    -webkit-box-shadow: 4px 4px 0px 0px rgba(142, 148, 153, 0.41);

    -moz-box-shadow: 4px 4px 0px 0px rgba(142, 148, 153, 0.41);
}

.sombra-naranja {
    box-shadow: 3px 3px 0px 0px rgba(236, 183, 154, 0.41);

    -webkit-box-shadow: 3px 3px 0px 0px rgba(236, 183, 154, 0.41);

    -moz-box-shadow: 3px 3px 0px 0px rgba(236, 183, 154, 0.41);
}

.sombra-gris {
    box-shadow: 4px 4px 0px 0px rgba(143, 143, 143, 0.41);

    -webkit-box-shadow: 4px 4px 0px 0px rgba(143, 143, 143, 0.41);

    -moz-box-shadow: 4px 4px 0px 0px rgba(143, 143, 143, 0.41);
}

.btn-gris {
    background: #f1f2f6;

    color: #000;
}

.btn-gris:hover {
    background: #dfe0e4;

    color: #000;
}

#banda-panel {
    height: 16rem;

    width: 100%;

    background-color: #aa521f25;
}

#contenedor-panel {
    margin-top: -8rem;

    background-color: #fff;

    border-radius: 1rem;

    min-height: 20rem;

    margin-bottom: 5rem;
}

#navegacion-panel > .btn {
    background-color: rgb(242, 242, 242);

    padding: 5px 25px;

    margin: 2px 5px;
}

#navegacion-panel > .btn:hover {
    cursor: pointer;

    color: #fff;

    background-color: var(--azul-alt);
}

#navegacion-panel > .btn.activo {
    color: #fff;

    background-color: var(--azul-alt);
}

.contenedores-panel {
    display: none;
}

.contenedores-panel.activo {
    display: block;
}

.asistencia {
    border: 1px solid rgb(220, 220, 220);

    border-radius: 8px;

    width: 100%;

    padding: 1rem 2rem;

    margin: 0.5rem 1rem;
}

.asistencia > h2 {
    color: #313131;

    font-size: 22px;

    font-weight: 600;

    margin: 0px;
}

.asistencia > h4 {
    color: #b1b1b1;

    font-size: 16px;

    font-weight: 300;

    margin-bottom: 15px;
}

.asistencia > p {
    font-size: 12px;

    margin-bottom: 5px;

    text-align: justify;
}

.asistencia > h6 {
    color: #a0a0a0;

    font-size: 12px;

    text-align: end;

    margin: 0px;

    margin-top: 5px;
}

#banda-panel-2 {
    min-height: 8rem;

    width: 100%;

    background-color: #f8f8fa;
}

.barra-link {
    text-decoration: none;

    display: inline-block;

    padding: 12px 26px !important;

    font-size: 14px;

    color: #949494;
}

.barra-link.activo {
    background-color: #fff;

    box-shadow: 0px 4px 0px 0px rgba(0, 163, 255, 0.8);

    -webkit-box-shadow: 0px 4px 0px 0px rgba(0, 163, 255, 0.8);

    -moz-box-shadow: 0px 4px 0px 0px rgba(0, 163, 255, 0.8);

    color: #272727;
}

.barra-link:hover:not(.activo) {
    box-shadow: 0px 4px 0px 0px rgba(211, 206, 195, 0.8);

    -webkit-box-shadow: 0px 4px 0px 0px rgba(211, 206, 195, 0.8);

    -moz-box-shadow: 0px 4px 0px 0px rgba(211, 206, 195, 0.8);

    color: #272727;
}

.card-columns .card {
    margin-bottom: 0.75rem;
}

@media (min-width: 576px) {
    .card-columns {
        -webkit-column-count: 2;

        -moz-column-count: 2;

        column-count: 2;

        -webkit-column-gap: 1.25rem;

        -moz-column-gap: 1.25rem;

        column-gap: 1.25rem;

        orphans: 1;

        widows: 1;
    }

    .card-columns .card {
        display: inline-block;

        width: 100%;
    }
}

#contrasena-restablecer {
    color: rgb(155, 155, 155);

    font-weight: bold;
}

#contrasena-restablecer:hover {
    color: rgb(0, 102, 255);
}

#portada {
    height: 18rem;

    background-position: center !important;

    background-repeat: no-repeat !important;

    background-size: cover !important;

    box-shadow: 0px 6px 0px 0px rgba(255, 107, 0, 0.5);

    -webkit-box-shadow: 0px 6px 0px 0px rgba(255, 107, 0, 0.5);

    -moz-box-shadow: 0px 6px 0px 0px rgba(255, 107, 0, 0.5);
}

#contenido {
    margin-top: -4rem;
}

.img-portada {
    max-height: 20rem;

    max-width: 20rem;

    border-radius: 8px;
}

.articulo-pagina {
    margin: 18px 14px;

    display: inline-block !important;

    width: 20rem;

    border-radius: 10px;

    cursor: pointer;

    text-decoration: none;

    color: #000;

    box-shadow: 0 3px 10px rgb(0 0 0 / 8%);

    color: #222;

    transition: transform 60ms linear;
}

.articulo-portada {
    aspect-ratio: 16/4;

    object-fit: contain;

    width: 100%;

    background-position: center !important;

    background-repeat: no-repeat !important;

    background-size: contain !important;

    border-radius: 10px;

    border-bottom: 1px solid #f3f3f3bf;

    background-color: #cd84f140 !important;
}

.articulo-pagina > .articulo-titulo {
    height: 4rem;
}

.articulo-fecha {
    color: #1d1d1d;
}

.tiny-font {
    font-size: 12px;
}

.articulo-pagina:hover {
    transform: scale(1.05);

    box-shadow: 0 3px 10px rgba(7, 85, 158, 0.282);

    transition: transform 60ms linear;
}

#sitio-portada {
    width: 100%;

    aspect-ratio: 16/4;

    background-position: center !important;

    background-repeat: no-repeat !important;

    background-size: contain !important;

    background-color: #cd84f140 !important;

    border-radius: 8px;

    box-shadow: 0px 0px 8px 0px rgba(189, 189, 189, 0.5);

    -webkit-box-shadow: 0px 0px 8px 0px rgba(189, 189, 189, 0.5);

    -moz-box-shadow: 0px 0px 8px 0px rgba(189, 189, 189, 0.5);

    cursor: pointer;
}

#sitio-resumen {
    background: #f7f7f7ce;

    border-left: 6px #ffb429 solid;
}

.lateral-adorno-azul {
    border-left: #1e90ff solid 6px;

    padding-left: 10px;

    font-weight: bold;
}

.lateral-adorno-verde {
    border-left: #2ed573 solid 6px;

    padding-left: 10px;

    font-weight: bold;
}

.subpagina-portada {
    width: 4rem;

    height: 4rem;

    background-position: center !important;

    background-repeat: no-repeat !important;

    background-size: cover !important;

    border-radius: 100%;

    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.282);
}

.subpagina {
    text-decoration: none !important;

    color: #222;

    border: 1px solid rgba(237, 237, 237, 0.623);

    margin: 5px 0;

    padding: 5px 2px;

    border-radius: 6px;

    transition: 60ms linear transform;
}

.subpagina:hover {
    transition: 60ms linear transform;

    transform: translateX(25px);

    background: rgba(237, 237, 237, 0.623);
}

.articulo-articulo {
    display: inline-block !important;

    width: 100%;

    border-radius: 10px;

    cursor: pointer;

    text-decoration: none;

    color: #000;

    box-shadow: 0 3px 10px rgb(0 0 0 / 8%);

    color: #222;

    transition: transform 60ms linear;
}

.articulo-articulo:hover {
    transform: scale(1.05);

    box-shadow: 0 3px 10px rgba(7, 85, 158, 0.282);

    transition: transform 60ms linear;
}

.bread > a:not(.activo) {
    text-decoration: none;

    color: rgb(68, 68, 68);

    font-weight: bold;
}

.bread > a.activo {
    color: rgb(0, 81, 255);
}

.bread > a:not(.activo):hover {
    color: rgb(56, 112, 232);
}

#cuerpo {
    position: relative;

    min-height: 100vh;
}

.badge-help {
    color: #222;

    background: rgb(242, 242, 242);

    transition: transform 150ms ease;

    font-size: 16px;
}

.badge-help:hover {
    background: rgb(212, 232, 255);

    cursor: pointer;

    transform: scale(1.05);

    transition: transform 150ms ease;
}

.text-green {
    color: var(--verde);
}

.btn-flotante {
    position: fixed;

    left: 1rem;

    bottom: 1rem;
}

#articulo-portada {
    width: 100%;

    aspect-ratio: 16/4;

    object-fit: contain;

    background-color: #cd84f140;
}

.input-password {
    position: relative;

    display: block;

    height: 36px;
}

.input-password input {
    position: absolute;

    top: 0;

    left: 0;

    width: 80%;
}

.input-password button {
    position: absolute;

    top: 0;

    right: 0;

    width: 20%;
}

a.badge.enlace {
    text-decoration: none;

    transition: all 120ms ease-in-out;

    background-color: #fff4c0;

    color: #333;
}

a.badge.enlace:hover {
    background-color: #ffe771;

    color: #000;
}

.p-relative {
    position: relative;
}

.atencion-animacion {
    animation: atencion 1.5s ease-in-out infinite;
}

@keyframes atencion {
    50% {
        transform: scale(1.2);
    }
}

.atencion-animacion-lento {
    animation: atencion 4s linear infinite;
}

[disabled] {
    opacity: 0.2 !important;

    filter: grayscale(100%);
}

@keyframes atencion {
    50% {
        transform: scale(1.025);
    }
}
