@media(max-width: 576px) {

    .cuadro-contenedor-academico{
        padding-left: 1.5rem;
    }
    .cuadro-texto-academico {
        background-color: var(--azulicpna);
        padding-left: 2rem !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-met {
        background-color: var(--gray5);
        padding-left: 2rem !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-ninios {
        background-color: var(--green1);
        padding-left: 2rem !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto {
        padding-right: 1rem !important;
        background-color: var(--azulicpna);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-ninios {
        padding-left: 1rem !important;
        background-color: var(--green1);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-met {
        padding-left: 1rem !important;
        background-color: var(--gray5);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    h2.titulo-seccion{
        font-size: 1.3rem !important
    }
    p.contenido-programas{
        font-size: 0.8rem !important 
    }
    .close-button{
        color:var(--gray5) !important;
        opacity:1 !important;
    }
    button.close-button{
        background-color: transparent;
        border: 0;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        font-size: 1.5rem;
    }
    h5.modal-title{
        padding: 0.5rem;
        padding-left: 0.8rem;
        margin: 0 !important;
        color: var(--rojo) !important;
    }

    .title-cabecera-academico{
        font-size:2rem;
        padding-top: 2rem;
    }
    .mas-informacion {
        text-align: right;
        padding-right: 0.5rem;
        padding-left: 0.5rem;
        font-size: 1rem;
    }


}

@media(min-width: 577px) {

    .cuadro-contenedor-academico{
        padding-left: 2rem;
    }
    .cuadro-texto-academico {
        background-color: var(--azulicpna);
        padding-left: 0rem !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-met {
        background-color: var(--gray5);
        padding-left: 2rem !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-ninios {
        background-color: var(--green1);
        padding-left: 2rem !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto {
        padding-right: 2rem !important;
        background-color: var(--azulicpna);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-ninios {
        padding-left: 2rem !important;
        background-color: var(--green1);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-met {
        padding-left: 2rem !important;
        background-color: var(--gray5);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .logo-icpna {
        max-width: 80% !important;
    }
    h2.titulo-seccion{
        font-size: 1.3rem !important
    }
    p.contenido-programas{
        font-size: 0.85rem !important 
    }
    .close-button{
        color:var(--gray5) !important;
        opacity:1 !important;
    }
    button.close-button{
        background-color: transparent;
        border: 0;
        padding-left: 0.8rem;
        padding-right: 0.8rem;
        font-size: 1.8rem;
        
    }
    h5.modal-title{
        padding: 0.7rem;
        margin: 0 !important;
        color: var(--rojo) !important;
    }
    .title-cabecera-academico{
        font-size:2.5rem;
        padding-top: 1rem;
    }
    .mas-informacion {
        text-align: right;
        padding-right: 1rem;
        padding-top: 0.5rem;
        font-size: 1.2rem;
    }


}

@media(min-width: 768px) {
    .cuadro-contenedor-academico{
        padding-left: 3rem;
    }
    .cuadro-texto-academico {
        background-color: var(--azulicpna);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-met {
        background-color: var(--gray5);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-ninios {
        background-color: var(--green1);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto {
        padding-right: 0px !important;
        background-color: var(--azulicpna);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-ninios {
        padding-left: 0px !important;
        background-color: var(--green1);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-met {
        padding-left: 0px !important;
        background-color: var(--gray5);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .logo-icpna {
        max-width: 60% !important;
    }
    
    .title-cabecera-academico{
        font-size:3rem;
    }

}

@media(min-width: 992px) {
    .cuadro-texto-academico {
        background-color: var(--azulicpna);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-met {
        background-color: var(--gray5);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-ninios {
        background-color: var(--green1);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto {
        padding-right: 0px !important;
        background-color: var(--azulicpna);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-ninios {
        padding-left: 0px !important;
        background-color: var(--green1);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-met {
        padding-left: 0px !important;
        background-color: var(--gray5);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .logo-icpna {
        max-width: 40% !important;
    }

    h2.titulo-seccion{
        font-size: 1.8rem !important
    }
    p.contenido-programas{
        font-size: 1.1rem !important 
    }

}

@media(min-width: 1200px) {
    .cuadro-texto-academico {
        background-color: var(--azulicpna);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-met {
        background-color: var(--gray5);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-academico-ninios {
        background-color: var(--green1);
        padding-left: 0px !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }


    .cuadro-texto {
        padding-right: 0px !important;
        background-color: var(--azulicpna);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-ninios {
        padding-left: 0px !important;
        background-color: var(--green1);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .cuadro-texto-met {
        padding-left: 0px !important;
        background-color: var(--gray5);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }


    .logo-icpna {
        max-width:20% !important;
       
    }


}



.resposta {
    margin: 0 1rem;
    
    padding-bottom: 0.4rem;
    overflow: hidden;
    margin-bottom:0.4rem;
}

.cabecera-navbar-responsive {
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
    text-align:left;
}


details summary {
    list-style-type: none;
}

    details summary::-webkit-details-marker {
        display: none;
    }

summary::-webkit-details-marker /*oculta a setinha que vem por padrão*/ {
    display: none;
}

summary:focus /*tira o foco do accordeon*/ {
    outline: none;
}

details[open] .plataformasTitle:after /*troca o + por - ao abrir o accordeon*/ {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='21' height='21' viewBox='0 0 21 21'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Icon_plus-circle' data-name='Icon/plus-circle' clip-path='url(%23clip-path)'%3E%3Cg id='plus-circle' transform='translate(0.5 0.5)'%3E%3Ccircle id='Oval' cx='10' cy='10' r='10' fill='none' stroke='%233c3d42' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='1'/%3E%3Cpath id='Shape' d='M0,0H8' transform='translate(6 10)' fill='none' stroke='%233c3d42' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
    width: 21px;
    height: 21px;
    content: "";
    display: block;
    right: 1rem;
    position: absolute;
}

details[open] .footerTitle:after /*troca o + por - ao abrir o accordeon*/ {
    width: 21px;
    height: 21px;
    content: "";
    display: block;
    right: 1rem;
    position: absolute;
}



.plataformasTitle {
    font-size: 1rem;
    font-weight: 300;
    display: flex;
    align-items: center;
 
}

.plataformasTitle:after /* estilo para o botão de +*/ {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='21' height='21' viewBox='0 0 21 21'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Icon_plus-circle' data-name='Icon/plus-circle' clip-path='url(%23clip-path)'%3E%3Cg id='plus-circle' transform='translate(0.5 0.5)'%3E%3Ccircle id='Oval' cx='10' cy='10' r='10' fill='none' stroke='%233c3d42' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='1'/%3E%3Cpath id='Shape' d='M0,0V8' transform='translate(10 6)' fill='none' stroke='%233c3d42' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='1'/%3E%3Cpath id='Shape-2' data-name='Shape' d='M0,0H8' transform='translate(6 10)' fill='none' stroke='%233c3d42' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
    width: 21px;
    height: 21px;
    content: "";
    display: block;
    right: 1rem;
    position: absolute;
}
.footerTitle {
    font-size: 1.1rem;
    font-weight: 300;
    display: flex;
    align-items: center;
    color: white;
    fill: white;
    padding-left:1rem;
}
.footerTitle:after /* estilo para o botão de +*/ {
    width: 21px;
    height: 21px;
    content: "";
    display: block;
    right: 1rem;
    position: absolute;
    fill:white;
}