:root {
    --fuentePrincipal: 'Visby', sans-serif;
    --primario: #0095c8;
    --primrioOscuro: #003a5d;
    --secunario: #f48024;
    --AzulVerdoso: #00b1b0;
    --blanco: #FFFFFF;
    --negro: #000000;
    --gris: #C0C0C0;
    --ligthgray: #F5F3F3;
    --gray: #F1F0EF;
    --oscuro: #838281;
    --claro: #C4C4C4;
    --verde: #b3cc25;
    --azul: #2F328A;
    --rojo: #ff0000;
}

html {
    box-sizing: border-box;
    font-size: 62.5%;
}

*, *:before, *:after {
    box-sizing: inherit;
}

.construccion {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    margin: 10rem auto 0;
}

.img-construccion {
    width: 75%;
}

/** Globales **/

body {
    font-size: 1.6rem;
    line-height: 1.5;
}

.block{
    display: none;
}

.contenedor {
    max-width: 120rem;
    margin: 0 auto;
    padding: 0 5%;
}

h1{
    font-size: 4rem;
    text-align: center;
}

a{
    text-decoration: none !important;
}

.uppertext {
    text-transform: uppercase;
}

.centertext {
    text-align: center;
}

.botones_reotpu {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    justify-content: center;
}

.boton_reotpu {
    background-color: var(--azul); 
    color: #fff;
    padding: 1rem 1rem;
    margin-top: 1rem;
    font-size: 1rem;
    text-decoration: none;
    font-weight: bold;
    border-radius: .7rem;
    text-align: center;
    border: none;
    max-width: 20%;
}

.boton_regresar {
    border-radius: .7rem;
    width: 20%;
}

.btn-flotante {
    position: fixed;
    right: 5%;
    transition: all 300ms ease 0ms;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    z-index: 99;
}

.btn-flotante {
    top: 85%;
}

.btn-flotante:hover {
    background-color: #2c2fa5; /* Color de fondo al pasar el cursor */
    box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.3);
    transform: translateY(-0.5rem);
    color: var(--blanco);
}

.centrar_item_prog,
.centrar_item {
    display: inline-grid;
    justify-content: center;
    font-size: .75rem;
}

.alinear_derecha_grid {
    display: inline-grid;
    justify-content: end;
    padding-right: 2rem;
}

.centrar_img {
    object-fit: contain;
    width: auto;
    height: auto;
}

.centrar_poe {
    object-fit: contain;
    width: 70%;
    height: 70%;
}

/**PRINCIPAL**/

.ventana {
    background-image: url('../img/portada-reotpu.png');
    width: 100%;
    height: 10%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;    
    position: absolute;
    top: 5%;
    left: auto;    
    z-index: 150;
}

/*
.fondo {
    width: 100%;
    height: 100%;
    background: rgba(131, 130, 129, 0.5);
    position: absolute;
    z-index: 99;
}
*/

.portada{
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
}

.fondoportada {
    width: 87% !important;
    height: 90% !important;
}

.fondobanner {
    width: 105.5% !important;
    height: 100% !important;
}

.cerrar {
    position: absolute;
    width:  2rem;
    height: 2rem;
    top: 10%;
    left: 4%;
}

.header {
    background-image: url(../img/encabezado-reotpu.png);
    height: 3.5rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: var(--blanco);
    margin-bottom: 4rem;
}

img.top:hover {
    opacity: 0;
}

.img__intr {
    max-width: 50%;
}

.img__intr:hover {
    transform: scale(1.25);
    border: 2px solid var(--gray);
    border-radius: 2rem;
    box-shadow: 2px 1px 1px var(--oscuro);
}

.vigente {
    max-width: 50%;
    margin: 0;
}

.vigente:hover {
    transform: scale(1.25);
    border-width: 0.1rem 0.1rem 0;
    border-style: solid;
    border-color: var(--gray);
    border-radius: 2rem;    
}

.img__proc {
    max-width: 100%;
    margin: 0 0 5rem;
}

.prog-est {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 1rem;
    line-height: normal;
    text-align: center;
    margin-bottom: 1.5rem;
}

.prog-est img {
    margin-bottom: 5rem;
}

.subtit-prog,
.desc_prog {
    font-family: var(--fuentePrincipal);    
}

.subtit-prog {
    font-size: 1.75rem;
    font-weight: 900;
}

.desc_prog {
    font-size: 1.25rem;
}

.registro {
    margin-top: 5rem;
    margin-left: 2.5rem;
}

.registro img {
    width: 45%;
    height: 45%;
}

.img__reg:hover {
    transform: scale(1.15);
    border: 2px solid var(--gray);
    border-radius: 2rem;
    box-shadow: 2px 1px 1px var(--oscuro);
}

.grid,
.grid-tres {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
}

.grid_opc,
.grid_opc_banner {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    row-gap: 0;
    margin: 0 auto 2.5rem;
    max-width: 120rem;
}

.opciones {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    line-height: normal;
    text-align: center;
    margin-bottom: .5rem;
}

/**ANTECEDENTES**/
.contenedor_progs,
.contenedor_ant,
.contenedor_otros,
.contenedor_mod {
    max-width: 120rem;
    margin: 0 auto;
}

.contenedor_ant{
    margin-bottom: 5rem;
}

.titulo_ant {
    display: grid;
    max-width: 100rem;
    height: 2.5rem;
    align-content: center;
    font-weight: bold;
    font-size: 1.25rem;
    margin-left: 2rem;
    color: var(--primario);
}

.titulo_ant {
    grid-template-columns: 95%;
    column-gap: 1.5rem;
    margin-top: 1rem;
}

.titulo_doc_ant,
.titulo_doc,
.padding_doc {
    display: grid;
    max-width: 120rem;
    justify-content: end;
    font-weight: bold;
    text-transform: uppercase;
}

.titulo_doc_ant,
.titulo_doc {
    font-size: 1rem;
}

.titulo_doc_ant {
    padding-right: 4%;
}

.padding_doc {
    padding-right: 3rem;
}

.ambitoout {
    display:none;
}

.wrapper_ant {
    display: grid;
    grid-template-columns: 80% 12.5%;
    grid-auto-rows: auto;
    grid-gap: 1.25rem;
    margin-left: 2rem;
}

.desc_ant,
.desc_mod {
    font-family: var(--fuentePrincipal);
    font-size: 1.25rem;
    margin-top: 2rem;
    border-bottom: solid var(--ligthgray);
}

.logo_ant {
    display: grid;
    grid-template-columns: 100%;
    justify-content: center;
    align-content: center;
    border-bottom: solid var(--ligthgray);
}

.accordion-item {
    border: none !important;
}

.accordion-button {
    font-weight: bold !important;
    font-size: 2rem !important;
    color: #007aff !important;
}

.accordion-button:hover {
    color: #E6007E !important;
}

/**OTROS**/
.encabezado_progs,
.wrapper_progs,
.encabezado_otros,
.wrapper_otros {
    display: grid;
    max-width: 100rem;
}

.encabezado_otros {
    grid-template-columns: 57% 17% 12% 7% 10%;
    column-gap: 0.5rem;
    justify-content: start;    
    font-weight: bold;
    text-transform: uppercase;
    padding-right: 3rem;
}

.titulo_mod,
.titulo_otros {
    background-color: var(--claro);
    height: 2.25rem;
    padding: 0.1rem 0 0 2rem;
    margin-top: 0;    
}

.wrapper_otros {
    grid-template-columns: 50% 7% 7% 6% 6%;
    column-gap: 1.5rem;
    margin-left: 2rem;
}

.desc_otros {
    font-family: var(--fuentePrincipal);
    font-size: 1.25rem;
    margin-top: 2rem;
    border-bottom: solid var(--ligthgray);
}

.contenedor_mod{
    margin-bottom: 5rem;
}

.logos_mod {
    display: flex;
    grid-template-columns: 100%;
    justify-content: center;
    align-content: center;
    border-bottom: solid var(--ligthgray);
}

.logo_ant img,
.logos_mod img {
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.wrapper_mod {
    display: grid;
    grid-template-columns: 80% 10%;
    grid-auto-rows: auto;
    grid-gap: 1.25rem;
    margin-left: 2rem;
}

/**PROGRAMAS**/

.encabezado_progs {
    grid-template-columns: 40% 8% 13% 10% 10% 7% 7%;
    column-gap: 0.5rem;
    justify-content: start;
    align-items: center;
    font-size: .75rem;
    font-weight: bold;
    padding-right: 1rem;
}

.wrapper_progs {
    grid-template-columns: 40% 8% 8% 8% 8% 8% 8%;
    column-gap: 1rem;
    margin-left: 1rem;
    padding-left: 1rem;
    margin-bottom: 5rem;
}

.titulo_progs,
.titulo_proc,
.titulo_proc_min {
    display: flex;
    font-family: var(--fuentePrincipal);
    font-size: 1.4rem;
    font-weight: bold;
    color: var(--primario);    
    padding-left: 2rem;
}

.titulo_progs,
.titulo_proc {
    text-transform: uppercase;
}

.titulo_progs {
    margin-top: 3rem;
    margin-bottom: 2rem;
    text-overflow: ellipsis;
    align-items: center;
    justify-content: center;
}

.titulo_proc,
.titulo_proc_min {
    align-items: flex-start;
    justify-content: flex-start;
}

.titulo_prog {
    display: grid;
    max-width: 110rem;
    height: 2.5rem;
    align-content: center;
    font-size: 1.25rem;
    margin-left: 2rem;
    background-color: var(--claro);
    margin-top: 3rem;
    margin-left: 1rem;
    padding-left: 1rem;
}

.titulo_proc {
    margin : 0rem;
}

.titulo_proc p{
    margin: 0px;
}

.desc_progs,
.desc_iniciovig,
.desc_actualiazacion {
    font-family: var(--fuentePrincipal);
    font-size: 1.25rem;
    margin-top: 2rem;
    /*border-bottom:solid var(--ligthgray);*/
}

desc_progsultimo {
    border-bottom: none;
}

.desc_iniciovig,
.desc_actualiazacion {
    font-weight: bold;
    margin-top: .5rem;
    border-bottom: solid var(--ligthgray);
}

.desc_actualiazacion {
    color: var(--rojo);
}

.contenedor-actualizaciones
{    
    display:grid;
    grid-template-columns: 40% 2% 10%; 
}

.listaactualizacion {
    font-family: var(--fuentePrincipal);
    font-size: 1.25rem;
    font-weight: bold;
    margin-top: .5rem;
    border-bottom: solid var(--ligthgray);
}

.logos1 {
    display: grid;
    grid-template-columns: 88% 2% 5% 5% 5%;
    max-width: 100rem;
    justify-content: center;
    align-content: center;
    padding-right: 0.5rem;
    /*border-bottom: solid var(--ligthgray);*/
}

.logos {
    margin-top: 1rem;
    width: 100%;
    padding-right: 0.5rem;
}

.logos img {
    object-fit: contain;
    width: 200%;
    height: 200%;
}

.margin_progs{
    margin-bottom: 2rem;
}

.nota {
    font-family: var(--fuentePrincipal);
    font-size: 1.1rem;
    font-weight: 500;
}

.btn-flotante_progs {
    position: fixed;
    top: 47.5%;
    right: 0;
    transition: all 300ms ease 0ms;
    z-index: 99;
}

/**Actualizaciones y o modificaciones**/
.actualizaciones {
    margin-top: 5rem;
}

.titulo-docact {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    font-family: var(--fuentePrincipal);
    font-weight: 900;
    font-size: 2.25rem;
}

.contenedor-botonesdocact {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
}

.grid-actualizaciones {
    margin-top: 2rem;
}

.pdfdocact {
    width: 40%;
}

.imgdocact {
    width: 150%;
}


/*Login*/
.titulosistema {
    font-family: Arial !important;
    font-weight: bold !important;
    font-size: 2.5rem !important;
    color: #fff !important;
    margin-left: 1.5rem !important;
    width: 75%;
}

.encabezadofecha {
    background-color: #315AD8 !important;
    width: 10% !important;
    height: 31px !important;
    font-family: Arial !important;
    font-size: 9pt !important;
    color: #fff !important;
    vertical-align: middle !important;
    text-align: center !important;
}

.imgLogin {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.botones {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}

.boton {
    background-color: var(--primario);
    color: #fff;
    padding: 1rem 3rem;
    margin-top: 3rem;
    font-size: 1.5rem;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: .5rem;
    width: 100%;
    height:3rem;
    text-align: center;
    border: none;
}

.boton:hover {
   cursor: pointer;
}

.boton-docact {
    width: 25%;
}

.botones_banners {
    display: grid;
    grid-template-columns: 30% 35% 30%;
    justify-items: center;
    gap: 2rem;
}

.boton_banner {
    background-color: var(--primario);
    color: #fff;
    padding: 1rem 3rem;
    margin-top: 3rem;
    font-size: 1.5rem;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: .5rem;
    width: 15rem;    
    text-align: center;
    border: none;
}

.boton_banner:hover {
   cursor: pointer;
}

.w-100 {
    width:100%;
}

.flex {
    display: flex;
}

.alinear-derecha {
    justify-content: flex-end;
}

.alinear-izquierda {
    justify-content: flex-start;
}

.legend {
    color: var(--gris);
    font-style: italic;
    font-weight: bold;
    text-align: center;
    font-size: 3.5rem;
}

.formulario {
    scroll-snap-align: center;
    scroll-snap-stop: always;
    background-color: #00afab;
    width: min(40rem, 100%);
    margin: 0 auto;
    padding: 2rem;
    border-radius: 1rem;
}

.formulario fieldset {
    border: none;
}

.formulario legend {
    text-align: center;
    font-size: 1.8rem;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 2rem;
    color: var(--primario);
}

.campo {
    margin-bottom: 1rem;
}

.campo label {
    /*color: #fff;*/
    color: var(--negro);
    font-weight: bold;
    margin-bottom: .5rem;
    display: block;
}

.campo textarea {
    height: 20rem;
}

.campo-texto {
    width: 100%;
    border: 0.1rem solid var(--negro);
    padding: 1.5rem;
    border-radius: .5rem;
}

/**ESTADISTICAS**/

.titulo_estadistica {
    display: flex;
    font-family: var(--fuentePrincipal);
    font-size: 1.4rem;
    font-weight: bold;
    color: var(--primario);
    padding-left: 2rem;
    text-transform: uppercase;
    margin-top: 3rem;
    margin-bottom: 2rem;
    text-overflow: ellipsis;
    align-items: center;
    justify-content: center;
}


/*
PÁGINA MAESTRA

Navegacion

*/
.navegacion {
    padding: 1rem 0;
    display: flex;
    justify-content: center;
    gap: 2rem;
}

.navegacion__enlace {
    font-family: var(--fuentePrincipal);
    color: var(--primario);
    font-size: 2rem;
}

.navegacion__enlace:last-of-type {
    margin-right: 0;
}

.navegacion__enlace:hover {
    color: var(--secunario);
}

.btnsalir {
    background-color: var(--verde);
}

.btnbanner {
    background-color: var(--azul);
}

.btnsalir,
.btnbanner {
    width: 85%;
    height: 4.5rem;
    border-radius: 1rem;
    border: none;
    color: var(--blanco);
    font-family: var(--fuentePrincipal);
    font-weight: bold;
    font-size: 1.75rem;
}

.btnsalir:hover,
.btnbanner:hover{
    transform: scale(1.20);
    border: 2px solid var(--gray);
    border-radius: 2rem;
    box-shadow: 2px 1px 1px var(--oscuro);
}

/*ADMINISTRACIÓN DE PROGRAMAS*/

/*Lista de programas*/

.combo{
    Width: 100% !important;
    height: 5rem;
    background: var(--blanco);
    border-radius: .7rem;
}

.labelprg {
    color: var(--negro);
    font-weight: bold;
    margin-bottom: .5rem;
    display: block;
    font-family: var(--fuentePrincipal);
}

.adjuntardocact {
    margin-bottom: 2rem;
}

.ambitoprg {
    color: var(--gris);
    font-style: italic;
    font-weight: bold;
    text-align: center;
    font-size: 2rem;
}

.white {
    background-color: var(--blanco);
}

.gray {
    background-color: var(--gris);
}

.encabezadogrid{
    background: var(--primario);
    color: var(--blanco);
}

/*edición de programas*/
.formularioprg {
    scroll-snap-align: center;
    scroll-snap-stop: always;
    /*background-color: #00afab;*/
    background-color: var(--ligthgray);
    width: min(75rem, 100%);
    margin: 0 auto;
    padding: 2rem;
    border-radius: 1rem;
}

.formularioprg fieldset {
    border: none;
}

.formularioprg legend {
    text-align: center;
    font-size: 1.8rem;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 2rem;
    color: var(--primario);
}
.titulo {
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 2rem;
    color: var(--negro);
}

.adjuntar {
    scroll-snap-align: center;
    scroll-snap-stop: always;
    display: grid;
    grid-template-columns: 1fr;
    row-gap: .5rem;
    align-items: center;
    margin: -1rem 0 0;
}

.otros {
    margin-bottom: 2rem;
}

.boton-upload {
    font-size: 1.25rem;
}

.pdf {
    height: 5rem;
    width: 5rem;
}

.zip {
    height: 5rem;
    width: 5rem;
}

.imgzip {
    height: 3rem;
    width: 3rem;
}

.jpg {
    height: 3.5rem;
    width: 3.5rem;
}

.iconos {
    height: 4rem;
    width: 4rem;
    border-radius: 50%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.iconpdfvisible{
    display: normal;
}

.iconpdfoculto {
    display: none;
}


/**MEDIA QUERIES**/
@media (min-width: 340px) {
    .grid, 
    .grid-tres {
        grid-template-columns: repeat(2, 1fr);
    }

    .btn-flotante_progs {
        top: 47%;
    }
}

@media (min-width: 480px) {
    .header {
        height: 5.3rem;
    }

    .ventana {
        height: 15%;
        top: 7%;
        left: 0;
    }

    .cerrar {
        top: 10%;
        left: 3%;
    }

    .img__intr {
        max-width: 35%;
    }

    .vigente {
        max-width: 37%;
    }

    .opciones {
        padding: 0;
    }

    .titulo_mod,
    .wrapper_otros,
    .wrapper_mod {
        margin-left: 2rem;
    }

    .desc_otros,
    .desc_mod {
        font-size: 1.25rem;
    }

    .encabezado_progs {
        grid-template-columns: 28% 12% 20% 12% 10% 10% 8%;
    }

    .centrar_item_prog {
        font-size: 1.1rem;
    }

    .wrapper_progs {
        grid-template-columns: 28% 12% 12% 12% 12% 12% 12%;
    }

    .logos img {
        width: 100%;
        height: 100%;
    }

    .nota {
        font-size: 1.2rem;
    }

    .contenedor_otros,
    .contenedor_ant {
        margin-top: 10rem;
    }

    .encabezado_otros {
        grid-template-columns: 45% 21% 9% 12% 12%;
    }

    .centrar_item {
        font-size: 1rem;
    }

    .wrapper_otros {
        grid-template-columns: 44% 10% 10% 8% 8%;
        column-gap: 1.5rem;
    }

    .wrapper_mod {
        grid-template-columns: 85% 10%;
        grid-gap: 1rem;
    }

    .titulo_doc_ant {
        font-size: 1.1rem;
    }

    .wrapper_ant {
        grid-template-columns: 80% 10%;
        grid-gap: 1rem;
    }

    .titulo_doc {
        font-size: 1rem;
    }

    .titulo_prog,
    .titulo_ant,
    .titulo_mod {
        font-size: 1.5rem;
    }

    .titulo_progs {
        font-size: 2rem;
        margin-top: 10rem;
        margin-bottom: 3rem;
    }

    .titulo_prog {
        margin-top: 2rem;
        margin-bottom: -1rem;
    }

    .titulo_estadistica {
        font-size: 1.5rem;
    }

    .boton-upload {
        font-size: 1.5rem;
    }
}

@media (min-width: 760px) {
    .header {
        height: 8.5rem;
    }

    .ventana {
        height: 35%;
        top: 12.5%;
    }

    .cerrar {
        top: 4%;
        left: 88%;
    }

    .img__intr {
        max-width: 75%;
    }

    .vigente {
        max-width: 77%;
    }

    .titulo_ant,    
    .wrapper_ant,
    .wrapper_otros,
    .wrapper_mod {
        margin-left: 2rem;
    }

    .logos {
        justify-items: center;
        padding-right: 0;
    }

    .titulo_ant {
        font-size: 1.75rem;
        margin-top: 5rem;
    }

    .titulo_mod,
    .titulo_otros {
        margin-left: 1rem;
        height: 2.5rem;
        font-size: 1.75rem;
    }

    .titulo_otros{
        margin-top: 3rem;
    }

    .encabezado_progs {
        grid-template-columns: 39% 11% 13% 8% 10% 10% 9%;
    }

    .titulo_prog {
        font-size: 2rem;
        width: 68rem;
    }

    .titulo_progs {
        font-size: 2.5rem;
        margin: 4rem 0;
    }
    .centrar_item_prog {
        font-size: 1.25rem;
    }

    .wrapper_progs {
        grid-template-columns: 36% 10% 10% 10% 10% 9% 10%;        
    }

    .nota {
        font-size: 1.35rem;
    }

    .desc_progs,
    .desc_ant,
    .desc_otros,
    .desc_mod {
        font-size: 1.75rem;
    }

    .subtit-prog {
        font-size: 1.75rem;
        font-weight: bold;
    }

    .desc_prog {
        font-size: 1.25rem;
    }

    .boton_regresar{
        width: 12.5%;
    }

    .contenedor_otros,
    .contenedor_ant {
        margin-top: 13rem;
    }

    .encabezado_otros {
        grid-template-columns: 57% 13% 8% 8% 8%;
        padding: 0;
        margin-bottom: -2.75rem;
    }

    .centrar_item {
        font-size: 1.25rem;
    }

    .wrapper_otros {
        grid-template-columns: 59% 8% 8% 6% 6%;
        column-gap: 1.5rem;
    }

    .titulo_doc{
        font-size: 1.25rem;
    }

    .wrapper_mod {
        grid-template-columns: 88% 8%;
    }

    .titulo_doc_ant {
        font-size: 1.25rem;
        padding-right: 12%;
    }

    .wrapper_ant {
        grid-template-columns: 78% 7%;
        grid-gap: 1rem;
    }

    .titulo_proc {
        font-size: 2rem;
        margin-bottom: 0rem;
    }

    .titulo_proc_min {
        font-size: 2rem;
        margin-bottom: 0rem;
    }
    
    .boton_reotpu {
        font-size: 1.5rem;
        max-width: 40%;
    }

    .opciones {
        grid-template-columns: repeat(3, 1fr);
    } 
    
    .grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .grid-tres {
        grid-template-columns: repeat(3, 1fr);
        width:80%;
        height: 80%;
        margin-left: 10%;
        margin-right: 5%;
    }

    .grid_opc {
        grid-template-columns: repeat(4, 25%);
        padding: 0 5%;
    }

    .grid_opc_banner {
        grid-template-columns: repeat(5, 20%);
        padding: 0 5%;
    }

    .registro img {
        width: 30%;
        height: 30%;
    }

    .titulo_estadistica {
        font-size: 1.75rem;
    }

    .adjuntar {
        grid-template-columns: 50% 20%;
        column-gap: 3rem;
    }
}

@media (min-width: 960px) {
    .header {
        height: 10rem;
    }

    .ventana{
        background-size: contain;
    }

    .cerrar {
        top: 3%;
        left: 90%;
        width: 2.5rem;
        height: 2.5rem;
    }

    .grid_opc {
        margin-bottom: 4rem;        
    }

    .img__intr {
        max-width: 85%;
    }

    .vigente {
        max-width: 87%;
    }

    .encabezado_progs {
        grid-template-columns: 48% 9% 9% 9% 9% 9% 9%;
    }

    .titulo_prog{
        width: 88rem;
        font-size: 2rem;
    }

    .wrapper_progs {
        grid-template-columns: 44% 8% 8% 8% 8% 7% 8%;
        grid-column-gap: 2rem;
    }

    .boton_reotpu {
        font-size: 1.65rem;
        max-width: 45%;
        padding: 1rem 2rem;
    }

    .boton_regresar {
        max-width: 50%;
    }

    .btn-flotante {
        top: 35%;
        right: 6%;
    }

    .logos img {
        width: 85%;
        height: 85%;
    }

    .contenedor_otros{
        margin-top: 11rem;
    }

    .encabezado_otros{
        grid-template-columns: 50% 11% 9% 9% 9%;
    }

    .titulo_mod,
    .titulo_otros {
        height: 2.75rem;
        font-size: 2rem;
        width: 91%;
    }

    .wrapper_otros {
        grid-template-columns: 50% 10% 10% 8% 8%;
        grid-column-gap: 1rem;
    }

    .titulo_doc{
        margin-right: 7.5rem;
    }

    .contenedor_ant {
        margin-top: 10rem;
    }

    .titulo_doc_ant {
        padding-right: 12%;
    }

    .titulo_ant {
        margin-top: 4rem;
    }

    .logo_ant img {
        width: 85%;
        height: 85%;
    }

    .wrapper_mod {
        grid-template-columns: 81% 7%;
        grid-column-gap: 1rem;
    }

    .wrapper_ant {
        grid-template-columns: 80% 7%;
        grid-column-gap: 1rem;
    }

    .titulo_estadistica {
        font-size: 2.25rem;
    }

    .adjuntar {
        grid-template-columns: 40% 10%;
        column-gap: 3rem;
    }
}

@media (min-width: 1024px) {
    .header {
        height: 15rem;
        background-size: contain;
    }

    .contenedor_mod {
        margin-top: 5rem;
    }

    .ventana {
        width: 86%;
        height: 29%;
        top: 14%;
        left: 5%;
    }

    .cerrar {
        top: 3%;
        left: 93%;
    }

    .boton_reotpu {
        padding: 1rem 3rem;
        margin-top: 3rem;
        font-size: 2rem;
        max-width: 80%;
    }

    .boton_reotpu {
        max-width: 80%;
    }

    .btn-flotante {
        top: 38%;
        right: 5%;
    }

    .desc_ant,
    .desc_mod {
        font-size: 2rem;
    }

    .encabezado_progs {
        grid-template-columns: 57.5% 9.5% 11% 7% 9% 6.5% 8%;
    }

    .titulo_prog {
        width: 120rem;
    }

    .wrapper_progs {
        grid-template-columns: 55% 7.5% 8% 8% 6% 6% 7%;
    }

    .subtit-prog {
        font-size: 2.25rem;
        color: #000;
    }

    .desc_prog {
        font-size: 1.75rem;
    }

    .contenedor_otros{
        margin-top: 14rem;
    }

    .encabezado_otros {
        grid-template-columns: 52% 14% 4% 14% 1%;
    }

    .wrapper_otros {
        grid-template-columns: 54% 9% 9% 7% 7%;
    }

    .titulo_otros{
        margin-top: 5rem;
    }

    .titulo_otros,
    .titulo_mod {
        font-size: 2.1rem;
        height: 3rem;
    }
    
    .wrapper_mod {
        grid-template-columns: 82% 6%;
    }

    .contenedor_ant{
        margin-top: 13rem;
    }

    .titulo_ant {
        font-size: 2rem !important;
        margin-bottom: 3rem;
    }

    .titulo_doc_ant {
        font-size: 1.5rem;
        padding-right: 10%;
        margin-bottom: -2rem;
    }

    .wrapper_ant {
        grid-template-columns: 80% 8%;
        grid-gap: 1rem;
    }

    .titulo_estadistica {
        font-size: 2.5rem;
    }
}

@media (min-width: 1300px) {
    .ventana {
        background-size: contain;
        width: 90%;
        top: 13%;
        left: 7.5%;
    }

    .cerrar {        
        left: 82%;
        top: 5%;
        width: 3rem;
        height: 3rem;
    }

    .centrar_item_prog {
        font-size: 1.5rem;
    }

    .encabezado_otros {
        grid-template-columns: 60% 12% 9% 11% 5%;
        font-size: 1.75rem;
        margin-bottom: -4.75rem;
    }

    .wrapper_otros {
        grid-template-columns: 60% 10% 10% 8% 8%;
    }

    .desc_otros{
        font-size: 2rem;
    }

    .titulo_otros,
    .titulo_mod {
        width: 95%;
    }

    .titulo_doc{
        margin-right: 5%; 
    }

    .wrapper_mod {
        grid-template-columns: 87% 7.5%;
        grid-gap: 1rem;
    }

    .logos_mod img{
        width: 90%;
        height: 90%;
    }

    .titulo_doc_ant {
        padding-right: 6%;
    }

    .wrapper_ant {
        grid-template-columns: 85% 8%;
        grid-gap: 1rem;
    }

    .registro img {
        width: 25%;
        height: 25%;
    }

    .btn-flotante {
        top: 43%;
        right: 5%;
        margin-top: 0;
    }

    .boton_regresar{
        width: 10%;
    }

    .btn-flotante_progs{
        top: 47%;
    }

    .titulo_estadistica {
        font-size: 2.75rem;
    }
}

@media (min-width: 1600px) {
    .ventana {
        width: 68%;
        height: 35%;
        top: 13%;
        left: 15%;
    }

    .cerrar {
        left: 89%;
        top: 3%;
        width: 3rem;
        height: 3rem;
    }    
    
    .contenedor_ant 
    .contenedor_mod{
        margin: 0 auto;
    }

    .titulo_otros,
    .titulo_mod {
        width: 103%;
    }

    .encabezado_otros {
        grid-template-columns: 65% 12% 9% 11% 5%;
        font-size: 1.75rem;
        margin-bottom: -4.75rem;
    }

    .wrapper_otros {
        grid-template-columns: 65% 10% 10% 8% 8%;
    }

    .titulo_doc {
        margin-right: -3rem;
    }

    .wrapper_mod {
        grid-template-columns: 95% 6%;
        grid-gap: 1rem;
    }

    .logos_mod img {
        width: 100%;
        height: 100%;
    }

    .btn-flotante {
        top: 43%;
        right: 10%;
        margin-top: 0;
    }

    .boton_regresar {
        width: 7.5%;
    }

    .titulo_estadistica {
        font-size: 3rem;
    }
}