Turma-L/index.html at main · profalexandrepr/Turma-L · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Bluecommunity</title>
    <link rel="stylesheet" href="style.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100&display=swap" rel="stylesheet">
</head>
<body>
    <header class="cabecalho">
        <span></span>
        <span></span>
        <h1 class="titulo-cabecalho">bluecommunity</h1>
        <span></span>
        <ul class="cabecalho-lista">
            <li class="cabecalho-lista-item">comunidade</li>
            <li class="cabecalho-lista-item">atividades</li>
        </ul>
    </header>
    <section class="secao">
        <div class="secao-parte-1">
            <h2 class="secao-titulo-1">_comunidade</h2>
            <img class="secao-imagem-1" src="amigos-tirando-uma-selfie-em-uma-festa-ao-ar-livre (1).jpg" alt="pessoas tirando uma selfie com camisetas azuis">
            <h3 class="secao-texto-1" >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vestibulum diam vel risus fringilla varius. Suspendisse at congue mauris, in volutpat elit. Morbi consequat nibh nec nulla gravida molestie. Donec ac egestas lacus. Sed rutrum risus eu erat volutpat lacinia. Pellentesque quis orci sem. Aenean quis tellus ac ligula varius iaculis ac sit amet metus. Ut metus dui, consequat nec scelerisque vitae, condimentum sed risus. Nunc vestibulum condimentum consectetur. Curabitur sodales ut nibh eu efficitur. Suspendisse eget tortor turpis. Duis ac lacus commodo, feugiat eros quis, finibus odio.</h3>
        </div>
        <div class="secao-parte-2">
            <h2 class="secao-titulo-2">_atividades</h2>
            <h3 class="secao-texto-2" >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vestibulum diam vel risus fringilla varius. Suspendisse at congue mauris, in volutpat elit. Morbi consequat nibh nec nulla gravida molestie. </h3>
            <ul class="secao-lista">
                <li class="secao-lista-item">Donec ac egestas lacus. </li>
                <li class="secao-lista-item">Sed rutrum risus eu erat volutpat lacinia.  </li>
                <li class="secao-lista-item">Pellentesque quis orci sem. Aenean quis tellus ac ligula varius iaculis ac sit amet metus. </li>
                <li class="secao-lista-item">Ut metus dui, consequat nec scelerisque vitae, condimentum sed risus.  </li>
                <li class="secao-lista-item">Nunc vestibulum condimentum consectetur. Curabitur sodales ut nibh eu efficitur.  </li>
            </ul>
            <h5 class="secao-texto-3">Suspendisse eget tortor turpis. Duis ac lacus commodo, feugiat eros quis, finibus odio.</h5>
            <img class="secao-imagem-2" src="Next steps-bro.png" alt="Executivo subindo degraus de conquista">
        </div>
    </section>
    <footer class="rodape">
        <h2 class="rodape-titulo">bluecommunity</h2>
    </footer>
</body>
</html>