-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
146 lines (146 loc) · 5.91 KB
/
index.html
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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html lang="pt-br">
<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" />
<link rel="stylesheet" href="./style/global.css" />
<link rel="stylesheet" href="./style/colors.css" />
<link rel="stylesheet" href="./style/flex.css" />
<link rel="stylesheet" href="./style/fonts.css" />
<link rel="stylesheet" href="./style/card.css" />
<link rel="stylesheet" href="./style/button.css" />
<link rel="stylesheet" href="./style/footer.css" />
<link rel="stylesheet" href="index.css" />
<link rel="shortcut icon" href="./img/favicon.png" type="image/x-icon" />
<title>SurfEnergy</title>
</head>
<body>
<main>
<header class="home-header bg-config-default-fixed">
<div class="container">
<div class="home-header-content flex flex-column gap-3">
<h1 class="title-1 color-grey-4">
Energia ○ Evolução ○ Criatividade nas águas
<span class="color-primary">SurfEnergy</span>
</h1>
<p class="text-1 color-grey-3">
Uma experiência única em um evento insano com os melhores
profissionais do Surf Mundial
</p>
<a class="bt outline-light" href="#participantes"
>Ver participantes</a
>
</div>
</div>
<img class="wave bottom" src="./img/wave.svg" alt="" />
</header>
<section class="participants" id="participantes">
<div class="container">
<h3 class="title-2 color-grey-1">Participantes</h3>
<div class="participants-content flex flex-wrap">
<div class="card">
<div class="card-header">
<img src="./img/people1.jpg" alt="" />
</div>
<div class="card-body">
<h4 class="title-3 color-grey-1">Flávio Santos</h4>
<p class="text-2 color-grey-2">
Ganhador do mundial de 2008, eleito o melhor surfista do
Estado de Minas por dois anos seguidos, Flávio está vindo com
tudo nessa aventura e promete levar o prêmio
</p>
</div>
<div class="card-footer">
<a class="bt">Instagram</a>
<a class="bt">Twitter</a>
</div>
</div>
<div class="card">
<div class="card-header">
<img src="./img/people2.jpg" alt="" />
</div>
<div class="card-body">
<h4 class="title-3 color-grey-1">Carlos Vianna</h4>
<p class="text-2 color-grey-2">
Iniciou no surf a apenas 5 anos, mais já se destacou em várias
modalidades e ganhou por 3 anos seguidos o título de melhor
surfista da modalidade Young e está com vontade de vencer
</p>
</div>
<div class="card-footer">
<a class="bt">Instagram</a>
<a class="bt">Twitter</a>
</div>
</div>
<div class="card">
<div class="card-header">
<img src="./img/people3.jpg" alt="" />
</div>
<div class="card-body">
<h4 class="title-3 color-grey-1">Samuel Leão</h4>
<p class="text-2 color-grey-2">
Surfista profissional a mais de 10 anos, Samuel vem do estado
do Rio Grande do Norte, vem ganhando notoriedade nas águas por
meio de suas manobras insanas
</p>
</div>
<div class="card-footer">
<a class="bt">Instagram</a>
<a class="bt">Twitter</a>
</div>
</div>
<div class="card">
<div class="card-header">
<img src="./img/people4.jpg" alt="" />
</div>
<div class="card-body">
<h4 class="title-3 color-grey-1">Patrícia Oliveira</h4>
<p class="text-2 color-grey-2">
Patricia vem sendo campeã em todos os 5 últimos campeonatos de
surf nacionais, sua capacidade criativa nas àguas é incrivel,
está vindo com tudo nessa temporada
</p>
</div>
<div class="card-footer">
<a class="bt">Instagram</a>
<a class="bt">Twitter</a>
</div>
</div>
<div class="card">
<div class="card-header">
<img src="./img/people5.jpg" alt="" />
</div>
<div class="card-body">
<h4 class="title-3 color-grey-1">Camila Souza</h4>
<p class="text-2 color-grey-2">
Saiu das quadras de vôlei de areia e hoje vem dominando os
mares. Está em 3º lugar no mundial de surf e ganhou o prêmio
de surfista revelação no último ano.
</p>
</div>
<div class="card-footer">
<a class="bt">Instagram</a>
<a class="bt">Twitter</a>
</div>
</div>
</div>
</div>
</section>
<footer class="footer bg-config-default-fixed">
<div class="container">
<div class="flex flex-column gap-3 text-center flex-align-center">
<div class="title-2 color-grey-4">
Quer mergulhar nessa experiência?
</div>
<p class="text-1 color-grey-3">
Estaremos ao vivo nos dias 14 e 18 de Novembro
</p>
<a class="bt outline-light">Marcar na agenda</a>
</div>
</div>
<img class="wave top" src="./img/wave-2.svg" alt="" />
</footer>
</main>
</body>
</html>