body {
    background-color: #fff;
    color: #333;
}

main {
    background-color: #004987; /* Nova cor azul */
    color: #fff;
    padding: 40px;
}

.container {
    border: none; /* Remover a borda */
    border-radius: 10px;
    background-color: transparent; /* Fundo transparente */
    padding: 20px;
    margin-bottom: 20px;
}

footer {
    background-color: #004987; /* Nova cor azul */
}

.btn-orange {
    background-color: #004987; /* Cor azul igual ao frame */
    color: #fb8b23; /* Nova cor laranja para o texto */
    font-weight: bold;
    border: none; /* Remover a borda laranja dos botões */
}

.btn-orange i {
    margin-right: 5px; /* Espaço à direita do ícone */
}

.btn-orange:hover {
    background-color: #f37015; /* Cor laranja no hover */
}
/* Adicione esta classe para os ícones brilharem apenas no hover */
.icon-shine:hover {
    filter: brightness(1.3); /* Aumenta o brilho dos ícones em 30% no hover */
    transition: filter 0.3s; /* Efeito de transição suave */
}

/* Estilização do botão "Ver no Mapa" */
.btn-map {
    background-color: #fff; /* Cor branca para o fundo do botão */
    color: #fb8b23 !important; /* Cor laranja para o texto (usando !important para garantir a prioridade) */
    font-weight: bold;
    border: none; /* Remover a borda laranja dos botões */
    text-transform: uppercase; /* Texto em maiúsculas */
    margin: 0; /* Remover margens para alinhar com os outros botões */
    transition: color 0.3s; /* Efeito de transição suave para a cor do texto */
}

.btn-map:hover {
    color: #ff9c4f !important; /* Cor laranja brilhante no hover para o texto (usando !important para garantir a prioridade) */
    text-decoration: none; /* Remover sublinhado no hover */
}