body {
    padding-top: 70px; /* Ajuste para evitar que o conteúdo fique atrás do menu fixo */
    margin: 0;
    overflow-x: hidden;
}

.navbar {
    background-color: rgba(0, 0, 0, 0.7) /* Menu transparente */
}

.navbar-dark .navbar-nav .nav-link {
    color: white; /* Texto do menu branco */
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: #808080; /* Cor do texto ao passar o mouse */
    text-decoration: underline;
}

#background-carousel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* Coloca o slide atrás do conteúdo */
}

#background-carousel img {
    object-fit: cover; /* Preenche todo o espaço, mantendo a proporção */
    height: 70vh;
}

.bloco-nav {
    min-height: 70vh;
}

.container {
    position: relative; /* Permite que o conteúdo fique sobre o slide */
    z-index: 2; /* Coloca o conteúdo na frente do slide */
}

#titulo-orquestra {
    color: white; /* Substitua #seu-codigo-de-cor pela cor desejada */
}

/* Adicionando o filtro de sobreposição escura */
#background-carousel .carousel-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Cor e opacidade do filtro */
    z-index: 1; /* Coloca o filtro sobre a imagem */
}

#sobre-nos {
    padding-top: 20px;
    max-width: 800px;
    margin: 0 auto;
}

.bloco-about img {
    object-fit: cover;
    height: 100%;
}

.bloco-about .row .col {
    display: flex; /* Adiciona flexbox para igualar a altura */
}

.bloco-about .col {
    flex-direction: column; /* Organiza os itens em coluna */
    justify-content: center; /* Centraliza verticalmente */
}

.bloco-about .card-body {
    flex: 1; /* Permite que o conteúdo cresça para ocupar todo o espaço disponível */
}

.bloco-about .col p {
    text-align: left; /* Justifica o texto */
    padding: 1rem; /* Adiciona padding ao texto */
}

.bloco-about .card {
    margin-bottom: 1rem; /* Adiciona margem inferior aos cards */
    display: flex; /* Adiciona flexbox ao card */
    flex-direction: column; /* Organiza o conteúdo em coluna */
    height: 100%; /* Garante que o card ocupe toda a altura disponível */
}

#eventos {
    padding-top: 20px;
    max-width: 800px;
    margin: 0 auto;
}

#transparencia {
    padding-top: 20px;
    max-width: 800px;
    margin: 0 auto;
}

.bloco-transparencia .card {
    padding-top: 20px;
    padding: 1rem;
    margin-bottom: 1rem; /* Adiciona margem inferior aos cards */
    display: flex; /* Adiciona flexbox ao card */
    height: 100%; /* Garante que o card ocupe toda a altura disponível */
}

/* Estilos para o formulário de contato */
.bloco-contato {
    padding-top: 20px;
    max-width: 1200px;
    margin: 0 auto; /* Centraliza o bloco na página */
    padding-bottom: 50px;
}

.bloco-contato .form-label {
    font-weight: bold; /* Deixa os rótulos em negrito */
}

footer a {
    text-decoration: none;
    color: #fff; /* Cor dos links no rodapé */
}

footer a:hover {
    text-decoration: underline; /* Sublinha os links ao passar o mouse */
}

footer .col-md-4 {
    margin: 0 auto; /* Centraliza as colunas horizontalmente */
}

footer .mt-2 a:hover {;
    color: #808080;
    text-decoration: none;
}

.bloco-animado {
    opacity: 0;
    transform: translateY(50px); /* Move os blocos para baixo */
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.bloco-animado.animado {
    opacity: 1;
    transform: translateY(0); /* Move os blocos para a posição original */
}

/* Media query para telas pequenas (largura máxima de 768px) */
@media (max-width: 768px) {
    .bloco-about .row {
        flex-direction: column; /* Alinha os itens em coluna */
    }

    .bloco-about .col {
        width: 100%; /* Ocupa toda a largura disponível */
    }
}