-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
417 lines (325 loc) · 13.7 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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
<!DOCTYPE html>
<html>
<head>
<title>Ações para Melhorar o Planeta</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>Ações para Melhorar o Planeta</h1>
<nav>
<div class="container">
<button onclick="toggleOptions('button1')"> <img src="img\Menu.svg" alt=""></button>
<div id="button1-options" class="options">
<p class="lista-menu"> <li class=”lista-menu__titulo”>menu</li>
<li><a href="#sobre">Sobre</a></li>
<li><a href="#acoes">Ações</a></li>
<li><a href="#contato">Contato</a></li>
</div>
</div>
</li>
</div>
<script>
function toggleOptions(buttonId) {
var options = document.getElementById(buttonId + '-options');
if (options.style.display === "none") {
options.style.display = "block";
} else {
options.style.display = "none";
}
}
</script>
<ul>
<img class="imgplaneta" src="img\img ex.webp" alt="">
</ul>
</nav>
</header>
<main>
<section id="sobre">
<h2>Sobre</h2>
<p>Nosso site tem como objetivo promover a conscientização e incentivar ações que ajudam a melhorar o planeta. Acreditamos que cada pequena ação pode fazer a diferença e queremos inspirar mais pessoas a fazerem a sua parte.</p>
</section>
<section id="acoes">
<h2>Ações</h2>
<header>
<nav>
<ul>
<li><a href="#Praticar a empatia com todas as pessoas e seres vivos ao nosso redor.">Praticar a empatia com todas as pessoas e seres vivos ao nosso redor.</a></li>
<li><a href="#Reduzir o consumo de recursos naturais, como água e energia.">Reduzir o consumo de recursos naturais, como água e energia.</a></li>
<li><a href="#Apoiar iniciativas de justiça social e combater a discriminação.">Apoiar iniciativas de justiça social e combater a discriminação.</a></li>
<li><a href="#Promover a igualdade de gênero e a inclusão de todas as pessoas.">Promover a igualdade de gênero e a inclusão de todas as pessoas.</a></li>
<li><a href="#Investir na educação e no desenvolvimento humano.">Investir na educação e no desenvolvimento humano.</a></li>
<li><a href="#Promover a conscientização sobre as questões ambientais.">Promover a conscientização sobre as questões ambientais.</a></li>
</nav>
</header>
</section>
<!DOCTYPE html>
<html>
<head>
<section id="Praticar a empatia com todas as pessoas e seres vivos ao nosso redor.">
<h2>Praticar a empatia com todas as pessoas e seres vivos ao nosso redor.</h2>
</head>
<body>
<header>
<h1> Praticar a empatia com todas as pessoas e seres vivos ao nosso redor.</h1>
</header>
<img class="cabecalhosimmg" src="img\download (2).jpg" alt="">
<main>
<section>
<h3>Seja Empático</h3>
<p>Praticar a empatia significa entender e compartilhar os sentimentos dos outros. Quando somos empáticos, somos capazes de criar conexões mais significativas com as pessoas ao nosso redor.</p>
</section>
<section>
<h3>Cuide dos Seres Vivos</h3>
<p>A empatia não se limita apenas aos seres humanos. Devemos ser empáticos com todas as formas de vida ao nosso redor, desde animais de estimação até os animais selvagens que habitam o nosso planeta.</p>
</section>
<section>
<h3>Pratique a Bondade</h3>
<p>Ao praticar a empatia, também estamos praticando a bondade. Pequenos atos de bondade podem fazer uma grande diferença na vida das pessoas e dos animais. Seja gentil e faça a diferença no mundo.</p>
<li>Este tópico foi criado para promover a empatia e a bondade no mundo. Seja a mudança que você quer ver no mundo.</li>
</section>
</main>
<footer>
</footer>
</body>
</html>
</section>
<!DOCTYPE html>
<section id="Reduzir o consumo de recursos naturais, como água e energia.">
<html>
<head>
<h2>Reduzir o consumo de recursos naturais, como água e energia.</h2>
</head>
<img class="cabecalhosimmg" src="img\download.jpg" alt="">
<body>
<section>
<ul>Por que é importante reduzir o consumo de recursos naturais?</ul>
<p>Os recursos naturais são limitados e estão se esgotando cada vez mais rápido. Se continuarmos a consumir recursos naturais como água e energia de forma desenfreada, isso terá um impacto negativo em nosso meio ambiente e em nosso futuro.</p>
<p>Além disso, ao reduzir o consumo de recursos naturais, você também pode economizar dinheiro em suas contas de água e luz.</p>
</section>
<section>
<h3>O que posso fazer para reduzir meu consumo de recursos naturais?</h3>
<p>Há muitas coisas que você pode fazer para reduzir seu consumo de recursos naturais. Aqui estão algumas ideias:</p>
<ul>
<li>Tomar banhos mais curtos;</li>
<li>Desligar as luzes e aparelhos eletrônicos quando não estiver usando;</li>
<li>Reutilizar e reciclar materiais sempre que possível;</li>
<li>Instalar dispositivos de economia de água e energia em sua casa;</li>
<li>Comprar produtos de empresas que se preocupam com o meio ambiente e que usam práticas sustentáveis.</li>
</ul>
</section>
<section>
<h3>Seja a mudança que você quer ver no mundo</h3>
<p>Pequenas mudanças em nossos hábitos diários podem ter um grande impacto em nosso meio ambiente e em nosso futuro. Então, comece agora mesmo a reduzir seu consumo de recursos naturais. Seja a mudança que você quer ver no mundo!</p>
</section>
<footer>
</footer>
</body>
</html>
</section>
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Apoie a Justiça Social</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<main>
<section id="Apoiar iniciativas de justiça social e combater a discriminação.">
<h2>Apoiar iniciativas de justiça social e combater a discriminação.</h2>
<img class="cabecalhosimmg" src="img\download (1).jpg" alt="">
<p>Nosso objetivo é promover a igualdade e combater a discriminação de todas as formas.</p>
<p>Trabalhamos para criar um mundo mais justo e inclusivo para todos.</p>
</section>
<h2>Ações</h2>
<ul>
<li>
<h3>Eduque-se</h3>
<p>Leia, assista e ouça informações sobre justiça social e discriminação. Conheça a história e a luta das minorias. Eduque-se para poder ajudar.</p>
</li>
<li>
<h3>Converse</h3>
<p>Converse com amigos, familiares e colegas sobre justiça social e discriminação. Discuta formas de acabar com preconceitos e promover a igualdade.</p>
</li>
<li>
<h3>Participe</h3>
<p>Participe de manifestações e eventos que promovam a justiça social e a igualdade. Dê a sua voz e ajude a mudar o mundo.</p>
</li>
</ul>
</section>
</footer>
</body>
</html>
<section id="Promover a igualdade de gênero e a inclusão de todas as pessoas.">
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<header>
<h1>Promovendo a Igualdade de Gênero e Inclusão</h1>
</header>
<img class="cabecalhosimmg" src="img\download.png" alt="">
<nav>
<a href="#definicao">Definição</a>
<a href="#acoes">Ações</a>
<a href="#como-ajudar">Como Ajudar</a>
</nav>
<div class="container">
<section id="definicao">
<h2>O que é Igualdade de Gênero e Inclusão?</h2>
<p>A Igualdade de Gênero é a ideia de que homens e mulheres devem ter os mesmos direitos, oportunidades e responsabilidades em todas as áreas da vida. Já a Inclusão se refere à aceitação e valorização das diferenças entre as pessoas, incluindo raça, etnia, orientação sexual, idade, religião, deficiência e outros aspectos.</p>
</section>
<section id="acoes">
<h2>Ações para Promover a Igualdade de Gênero e Inclusão</h2>
<ul>
<li>Criar campanhas de conscientização sobre a importância da igualdade de gênero e inclusão;</li>
<li>Desenvolver projetos educacionais e culturais que promovam a diversidade e a inclusão;</li>
<li>Estabelecer políticas públicas que combatam a discriminação e o preconceito;</li>
<li>Contratar e promover pessoas de diferentes origens e identidades para cargos de liderança;</li>
<li>Oferecer suporte e recursos para pessoas que enfrentam discriminação;</li>
<li>Criar espaços seguros e inclusivos para todas as pessoas.</li>
</ul>
</section>
<section id="como-ajudar">
<h2>Como Você Pode Ajudar</h2>
<p>Você pode se tornar um agente de mudança para a igualdade de gênero e inclusão. Eis algumas formas:</p>
<ul>
<li>Participar de campanhas e projetos que promovem a igualdade de gênero e inclusão;</li>
<li>Conhecer e respeitar as diferenças entre as pessoas;</li>
<li>Denunciar casos de discriminação e preconceito;</li>
<li>Oferecer suporte e solidariedade para pessoas que enfrentam discriminação;</li>
<li>Refletir sobre seus próprios preconceitos e trabalhar para superá-los;</li>
<li>Criar espaços seguros e inclusivos para todas as pessoas em sua comunidade.</li>
</ul>
</section>
</div>
<footer>
</footer>
</body>
</html>
</section>
<!DOCTYPE html>
<html>
<head>
<section id="Investir na educação e no desenvolvimento humano.">
</head>
<img class="cabecalhosimmg" src="img\download (3).jpg" alt="">
<body>
<header>
<h1>Investindo na Educação e Desenvolvimento Humano</h1>
<nav>
<ul>
<li><a href="#Educação">Educação</a></li>
<li><a href="#projetos">Projetos</a></li>
<li><a href="#noticias">Notícias</a></li>
</ul>
</nav>
</header>
<main>
<section id="Educação">
<h2>Educação</h2>
<p> Acreditamos que todos têm o direito de acesso a uma educação de qualidade e que o desenvolvimento humano é fundamental para o crescimento e progresso de uma sociedade.</p>
</section>
<section id="projetos">
<h2>Projetos</h2>
<ul>
<li>Campanha de Doação de Livros para Escolas Públicas</li>
<li>Programa de Mentoria para Jovens de Baixa Renda</li>
<li>Bolsas de Estudo para Estudantes Universitários</li>
</ul>
</section>
<section id="noticias">
<h2>Notícias</h2>
<ul>
<li><a href="#">Projeto de Doação de Livros é um Sucesso</a></li>
<li><a href="#">Mentoria Ajuda Jovens a Alcançar seus Sonhos</a></li>
<li><a href="#">Bolsas de Estudo Disponíveis para o Próximo Ano Letivo</a></li>
</ul>
</main>
</body>
</html>
</section>
<!DOCTYPE html>
<html>
<head>
<section id="Promover a conscientização sobre as questões ambientais."></section>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="estilo.css">
</head>
<body>
<header>
<h1>Cuidando do Planeta</h1>
</header>
<img class="cabecalhosimmg" src="img\download (4).jpg" alt="">
<nav>
<ul>
<li><a href="#sobre">Sobre</a></li>
<li><a href="#problemas">Problemas Ambientais</a></li>
<li><a href="#solucoes">Soluções</a></li>
</ul>
</nav>
<main>
<section id="sobre">
<h2>Sobre Nós</h2>
<p>Nesta sessão nosso objetivo é conscientizar a população sobre a importância de cuidar do planeta e combater as mudanças climáticas.</p>
</section>
<section id="problemas">
<h2>Problemas Ambientais</h2>
<ul>
<li>Aquecimento Global</li>
<li>Poluição do Ar</li>
<li>Desmatamento</li>
<li>Poluição da Água</li>
<li>Extinção de Espécies</li>
</ul>
</section>
<section id="solucoes">
<h2>Soluções</h2>
<ul>
<li>Reduzir o uso de plásticos descartáveis</li>
<li>Economizar água e energia</li>
<li>Utilizar transporte público ou bicicleta</li>
<li>Reciclar o lixo</li>
<li>Plantar árvores e preservar áreas verdes</li>
</ul>
</section>
</main>
<footer>
<p>© 2023 Ações para Melhorar o Planeta</p>
</footer>
</body>
</html>
<section id="contato">
<h2>Contato</h2>
<form action="#" method="post">
<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" required>
<label for="email">E-mail:</label>
<input type="email" id="email" name="email" required>
<label for="mensagem">Mensagem:</label>
<textarea id="mensagem" name="mensagem" rows="5" required></textarea>
<button type="submit">Enviar</button>
</form>
<h2>Entre em contato conosco</h2>
<p>Aluno: Pedro Augusto</p>
<li>Wattsap: <a href="">45998070414</a> </li>
<p>Professor Orientador: Edivaldo Ramos Batista</p>
<li>E-mail: <a href="">batista.edivaldo@escola.pr.gov.br</a> </li>
<li>Facebook: <a href="">https://m.facebook.com/edivaldo.ramosbatista</a> </li>
<li>Watsapp: <a href="">45991167419</a> </li>
<li>Instagram: <a href="">https://instagram.com/edivaldoramosbatista?igshid=ZDdkNTZiNTM=</a> </li>
</section>
</main>
<footer>
<H1>REFERÊNCIAS</H1>
<p>© 2023 Ações para Melhorar o Planeta</p>
</footer>
</body>
</html>