/* Slider no fundo com tamanho fixo */#slider-background { position: absolute; /* Posiciona o slider no fundo */ top: 0; left: 0; width: 100%; height: 400px; /* Tamanho fixo do slider */ overflow: hidden; z-index: -1; /* Envia o slider para trás do conteúdo principal */}
/* Degradê inferior no slider */#slider-background:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100px; /* Altura do degradê */ background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent); z-index: 1; /* Certifica-se de que o degradê está acima da imagem */ pointer-events: none; /* Permite interação com o conteúdo acima */}
/* Conteúdo principal sobre o slider */#dt_contenedor { position: relative; /* Garante que o conteúdo fique sobre o slider */ z-index: 1; /* Certifica-se de que o conteúdo principal está acima do slider */ background: #fff; /* Fundo branco para o conteúdo principal */ padding: 20px; margin-top: 400px; /* Cria espaço para compensar a altura do slider */}
/* Ajusta o conteúdo do slide */.slide-content { position: absolute; bottom: 20px; /* Alinha o conteúdo na parte inferior */ left: 20px; /* Alinha na lateral esquerda */ z-index: 2; /* Mantém o conteúdo visível sobre a imagem */ background: rgba(0, 0, 0, 0.6); /* Fundo semi-transparente */ color: #fff; padding: 15px 20px; border-radius: 8px; max-width: 50%;
}
.slide-content h2 { font-size: 24px; margin: 0 0 10px; font-weight: bold;
}
.slide-content p { font-size: 16px; margin: 0 0 15px; line-height: 1.4;
}
.slide-content .btn-slide { display: inline-block; background-color: #e50914; /* Cor do botão */ color: #fff; padding: 10px 20px; text-decoration: none; border-radius: 5px; font-weight: bold; transition: background-color 0.3s ease;
}
.slide-content .btn-slide:hover { background-color: #b20710; /* Cor no hover */}