body {
    background-color: #f8f9fa;
}

.card {
    margin-bottom: 20px;
}
/* styles.css */
.navbar {
    height: 70px; /* Defina a altura desejada */
}

.navbar-brand {
    height: 100%;
    display: flex;
    align-items: center; /* Centraliza verticalmente o logo */
}

.navbar-nav {
    flex-grow: 1;
    justify-content: center; /* Centraliza os itens do menu */
}
    .carousel img {
        max-width: 100%; /* Para garantir que a largura se ajuste */
        height: 600px;   /* Ajuste para a altura desejada */
        object-fit: cover; /* Mantém a proporção e cobre a área */
    }
	.carousel-caption {
  /*   background: rgba(0, 0, 0, 0.5); Fundo semi-transparente */
    padding: 20px;
    border-radius: 10px;
}

.carousel-caption h5 {
    font-size: 24px; /* Tamanho da fonte do título */
    color: white; /* Cor do texto */
}

.carousel-caption p {
    font-size: 16px; /* Tamanho da fonte da descrição */
    color: white; /* Cor do texto */
}
.carousel-caption .btn {
    margin-top: 15px; /* Margem superior para espaçamento */
    padding: 10px 20px; /* Tamanho do botão */
    font-size: 16px; /* Tamanho da fonte */
}
  .equal-card {
    height: 300px; /* Defina a altura desejada */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Alinha conteúdo dentro do card */
    border: 1px solid #ccc; /* Adiciona uma borda ao card */
    padding: 15px; /* Adiciona espaçamento interno */
    margin-bottom: 20px; /* Espaçamento entre as linhas de cards */
  }
footer {
    border-top: 2px solid #0056b3; /* Adiciona uma borda superior para destaque */
}

footer a:hover {
    color: #ffcc00; /* Muda a cor dos links ao passar o mouse */
}
.bg-light {
    background-color: #f8f9fa; /* Cor de fundo clara */
}

h2 {
    color: #002147; /* Cor do título */
}

.btn-primary {
    background-color: #0056b3; /* Cor do botão */
    border-color: #0056b3; /* Cor da borda do botão */
}

.btn-primary:hover {
    background-color: #004494; /* Cor do botão ao passar o mouse */
}
@media (max-width: 768px) {
    .navbar-collapse {
        position: absolute;
        top: 60px; /* ajuste conforme necessário para o seu layout */
        left: 0;
        right: 0;
        background-color: #f8f9fa; /* ou a cor de fundo que você preferir */
        z-index: 1000;
    }

    .navbar-collapse.show {
        display: block; /* garantir que o menu seja exibido quando ativado */
        height: auto; /* ajuste automático da altura */
    }

    .navbar-toggler {
        z-index: 1001; /* manter o botão acima do menu */
    }
}
.card {
    border: none; /* Remove as bordas do card */
    background: transparent; /* Remove o fundo do card */
    text-align: center; /* Centraliza o texto no card */
}

.card-img-container {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100px; /* Tamanho desejado */
    height: 100px; /* Altura igual à largura para um círculo perfeito */
    border-radius: 50%; /* Bordas circulares */
    margin: 0 auto; /* Centraliza o card-img-container */
}

.card-img-container img {
    width: 100%; /* A imagem preenche o container */
    height: auto; /* Mantém a proporção */
    border-radius: 50%; /* Garante que a imagem seja circular */
    object-fit: cover; /* Corta a imagem se necessário para preencher o container */
}

/* Media queries para responsividade */
@media (max-width: 576px) {
    .card-img-container {
        width: 80px; /* Ajuste para telas pequenas */
        height: 80px;
    }
}

@media (min-width: 577px) and (max-width: 768px) {
    .card-img-container {
        width: 90px; /* Ajuste para telas médias */
        height: 90px;
    }
}

@media (min-width: 769px) {
    .card-img-container {
        width: 100px; /* Tamanho padrão para telas grandes */
        height: 100px;
    }
}
