*{
    margin: 0;
    padding: 0;
box-sizing: border-box;
}
nav{
    background-color: rgb(0, 0, 0);
    padding: 10px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
nav .Logo a{
    text-decoration: none;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: #fff;
    font-size: 35px;
    font-weight: 600;
}
nav .logo img {

    width: 150px; /* Largura do logotipo */
  
    height: 150px; /* Altura ajustada automaticamente para manter a proporção */
    display: block; /* Remove espaço extra abaixo da imagem (tratamento inline) */
    margin: none; /* Centraliza a imagem horizontalmente (opcional) */
  }
nav ul{
    list-style: none;
    display: flex;
    align-items: center;
   padding: 10px; 
}
nav li{
    margin-left: 7px;
}
nav li a{
    text-decoration: none;
    color: #a38484;
    font-size:18px ;
    font-weight:500;
    padding: 8px 15px;
    border-radius: 5px;
    transition: 0.3s;

}
nav li a:hover{
    background-color: white;
    color:black;
}
.banner{
    
    background: linear-gradient(rgba(0,0,0,0.281), grba(0,0,0,0.308));
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    align-items: end;
    display: end;
    justify-content:flex-end;
    padding: 100px;

}

.video-container {
    width: 600px; /* Largura do vídeo */
    margin: 0 auto; /* Centralizar o vídeo na página */
}

/* Estilo para o próprio vídeo */
video {
    width: 100%;
    height: auto; /* Mantém a proporção original do vídeo */
}

/* Estilo para os controles do vídeo */
video::-webkit-media-controls {
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
}

video::-webkit-media-controls-play-button {
    background-color: transparent;
    border: 2px solid white;
    border-radius: 50%;
    width: 50px;
    height: 50px;
}

/* Adicione outros estilos conforme necessário */

Neste exemplo:

    Colocamos o elemento de vídeo dentro de um contêiner <div> com a classe video-container para estilização.
    Usamos a tag <source> para fornecer diferentes formatos de vídeo (no exemplo, mp4). Certifique-se de fornecer os formatos corretos para uma compatibilidade ampla.
    Usamos a propriedade controls no elemento <video> para exibir os controles padrão do navegador para o vídeo.
    O arquivo CSS personaliza o estilo do contêiner de vídeo, do próprio vídeo e dos controles de mídia (observe que os seletores CSS para controles de vídeo podem variar de acordo com o navegador, o exemplo acima é para navegadores baseados em WebKit, como o Chrome e o Safari).

Lembre-se de substituir "seu_video.mp4" pelo caminho correto para o arquivo de vídeo que você deseja incorporar. Além disso, você pode personalizar ainda mais o estilo com CSS, dependendo das suas necessidades de design.
Free Research Preview. ChatGPT may produce inaccurate information about people, places, or f