@media (max-width: 1024px) {

  /* TOPO */
  .topo {
    width: auto;
    left: 20px;
    right: 20px;
    top: 20px;
  }

  .topo1 {
    left: 20px;
    top: 90px;
  }

  /* MENU LATERAL */
  .menu_lateral {
    width: 320px;
  }

  /* HERO BLOG */
  .bg {
    height: 65vh;
  }

  .conteudo_blog h1 {
    font-size: 3.6rem;
  }

  .conteudo_blog p {
    font-size: 1.4rem;
  }

  /* LAYOUT BLOG */
  .blogs-layout {
    grid-template-columns: 1fr;
    padding: 10px 40px;
  }

  .blogs-vazio {
    display: none;
  }

  /* FILTRO */
  .filtro {
    max-width: 100%;
    margin: 40px auto 0;
  }

  /* POSTS */
  .post h2 {
    font-size: 18pt;
  }

  /* PAGINAÇÃO */
  .btn_paginacao {
    margin: 30px 0;
  }

  .btn_paginacao a {
    width: 60px;
    height: 60px;
  }

  /* SESSÃO 6 */
  .sessao6 {
    padding: 40px;
    height: auto;
  }

  .sessao6-centro h1 {
    font-size: 70px;
  }
}


@media (max-width: 600px) {

  /* TOPO */
  .topo,
  .topo1 {
    width: calc(100% - 20px);
    left: 10px;
    right: 10px;
    top: 10px;
    height: 50px;
  }

  .logo img {
    height: 28px;
  }

  /* MENU LATERAL */
  .menu_lateral {
    width: 100%;
    left: -100%;
    border-radius: 0;
  }

  .menu_links a {
    font-size: 1.6rem;
    padding-left: 25px;
  }

  /* HERO BLOG */
  .bg {
    height: 60vh;
  }

  .bg .img_principal img,
  .img_principal::after {
    height: 100%;
  }

  .conteudo_blog {
    bottom: 60px;
  }

  .conteudo_blog h1 {
    font-size: 2.4rem;
  }

  .conteudo_blog p {
    font-size: 1.05rem;
  }

  /* FUNDO */
  .tela_fundo {
    padding: 20px;
  }

  /* BLOG LAYOUT */
  .blogs-layout {
    padding: 10px 20px;
    top: 0;
  }

  /* PUBLICADOR */
  .publicador {
    flex-direction: column;
    text-align: center;
  }

  .publicador .foto_pub {
    width: 70px;
    height: 70px;
  }

  /* POST */
  .post {
    padding: 18px;
  }

  .post h2 {
    font-size: 16pt;
  }

  .post p {
    font-size: 12pt;
  }

  .post .lermais {
    width: 100%;
  }

  /* PAGINAÇÃO */
  .btn_paginacao {
    gap: 10px;
  }

  .btn_paginacao a {
    width: 48px;
    height: 48px;
    font-size: 16px;
  }

  /* SESSÃO 6 */
  .sessao6-topo p {
    font-size: 14pt;
  }

  .sessao6-centro h1 {
    font-size: 42px;
    text-align: center;
  }

  .sessao6-nav {
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 0;
  }

  /* RODAPÉ */
  .rodape p {
    font-size: 14px;
  }
}