/* Container principal. No seu PHP, a classe dele é `style_lista_arquivo_22082025_1547` */
.style_lista_arquivo_22082025_1547 {
    box-sizing: border-box;
    width: 1200px; /* Ou a largura que desejar */
    margin: 0 auto;
    padding: 60px 0px;
    
    /* Configura o container como flex e habilita a quebra de linha */
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap; 
    gap: 30px;
    
    margin-bottom: 0px;
}

/* O item flexível é o <li>. Ele precisa de uma largura máxima para quebrar a linha. */
.style_lista_arquivo_22082025_1547 li {
    /* AQUI ESTÁ A MÁGICA: Limita a largura do item para que caibam 2 por linha */
	width: 100%;
    max-width: calc(33.333% - 20px); /* 50% - metade do gap */
    
    list-style: none; /* Remove o marcador de lista */

    /* Transforma cada <li> em um novo container flex para controlar o link <a> */
    display: flex;
    
    /* Faz o <li> crescer para ocupar o espaço disponível, tornando a largura uniforme */
    flex-grow: 1;
}

/* O link <a>. Ele deve preencher 100% da largura e altura do <li>. */
.style_lista_arquivo_22082025_1547 li a:link, .style_lista_arquivo_22082025_1547 li a:visited {
    box-sizing: border-box;
    width: 100%;
    
    /* AQUI ESTÁ A CORREÇÃO: Transforma o link em um container flex e empilha os itens */
    display: flex;
    flex-direction: column; /* Empilha o ícone e o texto verticalmente */
    align-items: center; /* Alinha o ícone e o texto horizontalmente */
    justify-content:flex-start; /* Alinha o ícone e o texto verticalmente */
    text-align: center;
    
    padding: 32px 12px;
    background-color: #00a758;
    color: #fff;
    border-radius: 15px;
    text-decoration: none;
    transition: all 0.3s ease-out;
}

/* Efeitos de interação ao passar o mouse */
.style_lista_arquivo_22082025_1547 li a:hover, .style_lista_arquivo_22082025_1547 li a:active {
    background-color: #007045;
    color: #fff;
    text-decoration: none;
    transition: all 0.3s ease-out;
}
	
/* Regra para o ícone */
.style_lista_arquivo_22082025_1547 li a i {
    font-size: 56px;
    margin-bottom: 30px; /* Adiciona espaço abaixo do ícone */
}


.style_lista_arquivo_22082025_1547_p1{
	width: 95%;	
	max-width: 95%;
	position: relative;
  	/*top: 50%;*/
  	left: 50%;
	transform: translate(-50%, 0);
		
	text-align: center;
	color: #91a4ae;
	line-height: 145%;
}
.style_lista_arquivo_22082025_1547_p1 i{
	font-size: 56px;
}
	
	
@media only screen and (max-width: 1201px) {	

/* Container principal. No seu PHP, a classe dele é `style_lista_arquivo_22082025_1547` */
.style_lista_arquivo_22082025_1547 {
    width: 100%; /* Ou a largura que desejar */
	padding: 60px 30px;
}
/* O item flexível é o <li>. Ele precisa de uma largura máxima para quebrar a linha. */
.style_lista_arquivo_22082025_1547 li {
    /* AQUI ESTÁ A MÁGICA: Limita a largura do item para que caibam 2 por linha */
	width: 100%;
    max-width: calc(100% - 0px); /* 50% - metade do gap */
    
    list-style: none; /* Remove o marcador de lista */

    /* Transforma cada <li> em um novo container flex para controlar o link <a> */
    display: flex;
    
    /* Faz o <li> crescer para ocupar o espaço disponível, tornando a largura uniforme */
    flex-grow: 1;
}
	
	
}