@media (max-width:830px) {
    .bannerPrincipal img {
        height: 138px;
    }

    .filesContainer {
        grid-template-columns: 1fr;
    }

    .cards>div {
        max-width: 95%;
    }

    #img2 h4 {
        position: inherit ;
    }

    .contato p {
        text-align: center;
        font-size: 16px;
    }

    .footer-bg {
        width: 100%;
        margin-top: 264px;
    }

    .titleMaster {
        color: #fff;
        position: absolute;
        top: 57px;
        font-size: 2rem;
    }

    .logoTitleCanal img {
        width: 180px;
    }

    .textAndVideo video {
        width: 100%;
    }

    .buttonsAssuntos {
        flex-direction: column;
    }

    h1 {
        font-size: 3em;
        font-weight: 300;
    }

    h2 {
        font-size: 2.441em;
        font-weight: 300;
    }

    h3 {
        font-size: 1.953em;
        font-weight: 400;
    }

    h4 {
        font-size: 1.563em;
        font-weight: 400;
    }

    h5 {
        font-size: 1.25em;
        font-weight: 400;
    }


    p {
        text-align: justify;
    }

    nav.navbar {
        width: 100%;
        /* position: fixed; */
        top: 0;
        padding: 1rem .5rem;
    }

}

@media (max-width:1084px) {
    .about-div-page {
        padding: 39px 38px;
    }

    #btSearch .fa-magnifying-glass {
        font-size: 30px;
    }

    .textAndVideo {
        padding: 39px 38px;
    }

    .textAndImage {
        padding: 39px 38px;
    }

    .title-file {
        font-size: 22px;
    }
}

@media (max-width:1000px) {
    .buttonsSection {
        flex-direction: column;
    }

    .buttonsAssuntos {
        flex-direction: row;
        gap: 2rem;
    }

    .textAndVideo {
        flex-direction: column;
    }

    .textAndImage {
        flex-direction: column;
    }
}

@media screen and (max-width: 768px) {
    .cards {
        flex-direction: column;
        align-items: center;
    }
    .cards>div {
        max-width: 95%;
    }
    
    #img2 h4 {
        position: inherit ;
    }

    .imgPagInicial img {
        width: 200px;
    }

    .contato p {
        text-align: center;
        font-size: 16px;
    }

    .titulo-secao {
        text-align: left;
        font-size: 20px;
    }

    .card1 {
        width: 100%;
    }

    .logos img {
        width: 80px;
    }

    .footer-bg {
        width: 100%;
        margin-top: 264px;
    }
}

@media screen and (max-width: 480px) {

    .titulo-secao {
        font-size: 16px;
        text-align: initial;
    }

    .contato p {
        font-size: 14px;
    }

    #img2 h4 {
        position: inherit ;
    }

    .logos img {
        width: 60px;
    }

    .banner-content h1 {
        font-size: 22px;
    }

    .banner-content p {
        font-size: 14px;
        line-height: 1.5;
    }
}