*{ /*Estilos gerais!*/
    text-align: justify;
    color: rgb(50, 50, 50);
}

html{
    min-width: 800px; /* valor mínimo que você deseja */
    overflow-x: auto; /* permite rolagem horizontal se necessário */
}

body{

    min-width: 800px; /* valor mínimo que você deseja */
    overflow-x: auto; /* permite rolagem horizontal se necessário */
    height: 100%-50px;
    padding-top: 50px;
    background-color: white; /* Cor de fundo padrão */
    transition: background-color 1s; /* Define a transição para a cor de fundo */
}

main{
    min-height: 100vh; /* Defina a altura mínima, para ocupar toda a tela, menos o menu*/
    max-width: 1200px; /* Defina a largura máxima desejada*/
    width: 100%;       /* Permite que a largura diminua para se ajustar ao contêiner pai */
    margin-left: auto;  /* Centraliza o main horizontalmente (opcional) */
    margin-right: auto; /* Centraliza o main horizontalmente (opcional) */
}


h2{ /*Stilos dos Títulos N2*/
    text-align: center; 
}

table { /* Estido da tabela para que fique centralizada na página*/
    margin-left: auto;
    margin-right: auto;
}

td, th { /* Ajuste da tabela*/
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    width:fit-content;
    max-width: 400px;
}

li a { /* Ajuste dos links do menu*/
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

ul a{ /* Ajuste inicial do link do menu, lista nao ordenada */
    align-self: center;
}

li a:hover { /* Ajuste do efeito ao passar o mouse no link do menu*/
    background-color: #555;
    color: white;
}

ul { /* menu principal, lista não ordenada */
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(50, 50, 50, 0.9);
    display: flex;
    justify-content: center;
}

ul li { /* items do menu principal */
    position: relative;
    padding: 15px 20px;
}

ul li a { /* configuração dos links do menu principal */
    color: white;
    text-decoration: none;
    padding: 10px;
    display: block;
}

ul li ul {  /* Menu secundário, inicia apagado para aparecer ao passar o mouse no ul li */
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #444;
    min-width: 260px;
    z-index: 1000;
}

ul li:hover ul {  /* Menu secundário, mostrar */
    display: block;
}

ul li ul li {  /* Items do Menu secundário */
    display: block;
}

ul li ul li a {  /* Links dos Items do Menu secundário */
    padding: 10px;
    color: white;
    text-decoration: none;
    display: block;
}

ul li ul li a:hover { /* Ação a ser realizada pelos links dos Items do Menu secundário */
    background-color: #666;
}

html{ /* altura do html deve ser a altura toral da tela */
    height: 100vh;
}



.logo { /* Ajuste inicial do logo */
    transform: scale(1); /* Escala padrão da imagem */
    transition: transform 1s; /* Define a transição para a transformação */
    height: 50px;
    justify-content: center;
    align-self: center;
    padding-left: 50px;
}


/* Transição para quando a pagina for redimensionada ou a tela for pequena, menos que 800px. Só adicionado dois ajustes */
@media only screen and (max-width: 800px){
    body{
        background: rgb(190,190,190);
        transition: background-color 1s;
    }

    .logo{
        transform: scale(0.5);
        transition: transform 1s;
    }
}