@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap'); /* usado para carregar a fonte space grotesk */


.alun { /*usado apenas no nome dos alunos */
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 25px;
    text-align: right;



}

.continue { /*usado no texto link continuar */
    display: block;
    text-align: right;
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 20px;
    text-decoration: none;

}

.pag {
    display: flex;
    justify-content: space-between;
    /* um na esquerda, um na direita */
    margin-top: 0px;
    
}

.prox {
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 20px;
    text-decoration: none;
}

.destaq { /* principalmente para adicionar a cor atras daquele texto, com um pouco mais a direita */
    background-color: #e2e4fc;
    color: #241160;
    padding: 15px 50px 15px 8px;
    /* espaco dentro */
    border-radius: 4px;
    /* arredondado? */
    font-family: 'Cairo', sans-serif;
    font-size: 40px;
    display: inline-block;
    /* faz ter o comprimento do texto */
    position: relative;
    border-radius: 4px;
    margin: 90px 0 0 110px;
    /* topo, direita, baixo, esquerda */
}

.destaq2 { /* variação do outro, usei na introdução com o fundo, pois estava uma pagina meio vazia? */
    background-color: #e2e4fc;
    color: #241160;
    padding: 15px 50px 15px 8px;
    border-radius: 4px;
    font-family: 'Cairo', sans-serif;
    font-size: 30px;
    display: inline-block;
    position: relative;
    border-radius: 4px;
    margin: 90px 0 290px 110px;
    
}


.tituini { /* usado para alguns titulos, como o primeiro */
    text-align: left;
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 99px;
    margin: 60px 0 0 110px;
    /* topo, direita, baixo, esquerda margens para tentar definir a posicao */
}


.titucont { /*criado para o titulo com imagem alinhados esquerda e direita para a infinityfree */
    display: flex;
    justify-content: space-between;
    /* para o titulo na esquerda, imagem direita */
    align-items: center;
    /* alinha na vertical */
    margin: 60px 110px 0 110px;
    /* 0 na margem horizontal*/
}

.tituini1 {
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 99px;
    margin: 0;
    /* reseta margem para evitar problemas */
    text-align: left;
}

.tituimg {
    height: 250px;
    /* ajustar o tamanho da imagem */
}


table { /*d defini cor e largura para tabela */
    margin-left: auto;
    margin-right: auto;
    color: rgb(255, 255, 255);
    width: 75%;
    border-collapse: separate;

}

th {
    border: 2px solid black;
    text-align: right;
    padding: 10px;
    margin: 25px;
    font-size: 25px;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;

}

td {
    border: 2px solid black;
    text-align: right;
    padding: 10px;
    margin: 25px;
    font-size: 20px;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;




}
/* isso define a diferença das linhas par e impar */
tr:nth-child(even) {
    background-color: rgb(175, 174, 174);
}

tr:nth-child(odd) {
    background-color: gray
}

body {



    width: 97%; /* coloquei meio de besteira, o body usa 97% da largura possível */
    margin-left: auto;
    margin-right: auto;


    background-repeat: no-repeat;
    /* nao deixa a imagem se repitir */
    background-size: cover;
    /* faz a imagem cobrir todo o fundo */
    background-attachment: fixed;
    /* mantem a imagem parada quando se faz a rolagem */

}

.texto {
    color: #241160; /* criei para o div do texto da neocities, para controlar melhor a posição do <p> */
    font-family: 'Space Grotesk', sans-serif;
    max-width: 1000px;
    /* largura caixa*/
    margin: 0 auto;
    /* centraliza horizontal */
    text-align: left;


}

.texto h2 {
    font-size: 25px;
    margin-bottom: 10px;
}

.texto p {
    font-size: 21px;
    line-height: 1.6;
    margin-bottom: 20px;
}

.texto li {
    font-size: 21px;
    line-height: 1.6;
    margin-bottom: 20px;


}

.colunas { /* div criado com intuito de ter duas listas lado a lado */
    display: flex;
    /* lado a lado */
    justify-content: space-between;
    /* espaça as colunas*/
    
}

.coluna {
    flex: 1;
    /* faz colunas ter mesma largura */
    margin: 100px;
}

.coluna h2 {
    font-size: 25px;
    margin-bottom: 10px;
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
}

.coluna ul {
    font-size: 21px;
    line-height: 1.6;
    list-style-type: disc;
    padding-left: 20px;
    color: #241160;
    font-family: 'Space Grotesk', sans-serif;
}