-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathEnglish.html
More file actions
206 lines (195 loc) · 12.9 KB
/
English.html
File metadata and controls
206 lines (195 loc) · 12.9 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="author" content="IzaacCoding36">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="This site presents debates about social actions that have a great impact on our lives">
<meta name="keywords" content="HTML, CSS, JavaScript, Project, Actions, Sustainability, Education, Collectivity, Technology">
<link rel="stylesheet" href="style-modern.css">
<link rel="shortcut icon" type="image/ico" href="Imagens/favicon.ico"/>
<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=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<script>
window.va = window.va || function () { (window.vaq = window.vaq || []).push(arguments); };
</script>
<script defer src="/_vercel/insights/script.js"></script>
<title>Transformative Actions</title>
</head>
<body>
<header class="site-header">
<nav class="site-nav">
<button class="mobile-menu-toggle" aria-label="Toggle mobile menu">
☰
</button>
<div class="nav-menu">
<div class="dropdown">
<button class="dropbtn" aria-haspopup="true" aria-expanded="false">
<span>Languages</span>
<span class="dropdown-arrow">▼</span>
</button>
<div class="dropdown-content" role="menu">
<a href="index.html" role="menuitem">Brazilian Portuguese</a>
<button class="eng" role="menuitem">English</button>
<button class="morelang" role="menuitem">More languages</button>
</div>
</div>
<div class="dropdown">
<button class="dropbtn" aria-haspopup="true" aria-expanded="false">
<span>Filters</span>
<span class="dropdown-arrow">▼</span>
</button>
<div class="dropdown-content" role="menu">
<button class="filter" role="menuitem">Normal</button>
<button class="filter2" role="menuitem">Sepia</button>
<button class="filter3" role="menuitem">Grey</button>
</div>
</div>
<div class="dropdown">
<button class="dropbtn" aria-haspopup="true" aria-expanded="false">
<span>Themes</span>
<span class="dropdown-arrow">▼</span>
</button>
<div class="dropdown-content" role="menu">
<button class="theme" role="menuitem">Light</button>
<a href="Dark_Theme.html" role="menuitem">Dark</a>
</div>
</div>
</div>
</nav>
</header>
<main class="main-content">
<section class="hero-section">
<div class="hero-background"></div>
<div class="hero-content">
<h1 class="main-title">Actions that Change the World</h1>
<div class="intro-text">
<p>Hello, Welcome to this page! Here you will see some subjects that actually impact our daily lives and that will transform the future we live in. For that, I have separated each part of this subject into topics that are very important.</p>
<p>As you can see, there is a circle at the top of this page that represents the 4 topics that will be discussed here, each of these topics represent specific themes such as:</p>
</div>
<div class="topic-badges">
<span class="topic-badge sustainability">Sustainability</span>
<span class="topic-badge education">Education</span>
<span class="topic-badge collectivity">Collectivity</span>
<span class="topic-badge technology">Technology</span>
</div>
<p class="navigation-info">In the upper right corner you can change the language or theme for greater reading accessibility.</p>
<p class="cta-text">Anyway, check out the content below.</p>
</div>
</section>
<section class="content-section sustainability">
<div class="section-container">
<div class="section-header">
<hr class="section-line">
<h2 class="section-title">Sustainability</h2>
<hr class="section-line">
</div>
<div class="section-content">
<div class="image-container">
<img class="section-image" alt="Sustainability" src="Imagens/Sustentabilidade2.png" loading="lazy">
</div>
<div class="text-content">
<p>What we can clearly mention here are sustainable actions that, in fact, transform not only the world, but who we are.</p>
<p>Throwing garbage in the right place, taking care of trees and plants, and even planting them, reflects in a much better environment for human beings to live together.</p>
<p>It's clear that actions that transform the world can be sustainable, this is what we mostly need at the moment, in many places in the world we see pollution, environmental destruction, fires and devastation, and sustainability is the key to having a potentially better future. You are also part of this, in fact, we all are, nature benefits us with its natural resources, why can't we contribute to it too? Right?</p>
</div>
</div>
</div>
</section>
<section class="content-section education">
<div class="section-container">
<div class="section-header">
<hr class="section-line">
<h2 class="section-title">Education</h2>
<hr class="section-line">
</div>
<div class="section-content">
<div class="image-container">
<img class="section-image" alt="Education" src="Imagens/Educação2.png" loading="lazy">
</div>
<div class="text-content">
<p>One more of the actions that are very important for our future is education, because it's education that models what we plan to be in the future, and obviously, boost our productivity to enter the world of work.</p>
<p>But it's not just to work that we go to school or any other educational institution, we also learn to live with the world, with its history, with its mechanisms, which is why teaching someone something can often be something transformative, because you are transmitting information to someone who will probably use it at some point in their lives.</p>
<p>Education also covers very important topics to encourage the practice of innovative activities, which cover topics also mentioned here, like technology and sustainability.</p>
</div>
</div>
</div>
</section>
<section class="content-section collectivity">
<div class="section-container">
<div class="section-header">
<hr class="section-line">
<h2 class="section-title">Collectivity</h2>
<hr class="section-line">
</div>
<div class="section-content">
<div class="image-container">
<img class="section-image" alt="Collectivity" src="Imagens/Coletividade2.png" loading="lazy">
</div>
<div class="text-content">
<p>The world wouldn't be what it is today without us acting together, yes, another topic that deals with the relevance of transforming our world is the community, because several people investing in a project or a good action is essential to generate changes on a large scale.</p>
<p>This is a very important subject to deal with, because nowadays the world is becoming more and more individualistic, where people seek less and less to act or participate in groups and communities, this brings some harm to society in general, such as inequalities, lack of acceptance, low self-esteem, among other psychological and social problems.</p>
<p>Since the primordial times of the human being, we have only evolved collectively, and the collective offers us a wide variety of things that we cannot do alone. And that's why we can apply this to our daily lives, we can't transform the world just by ourselves, but we need the cooperation and help of everyone as one, helping nature, preserving raw materials and looking for new solutions to problems that we face every day.</p>
</div>
</div>
</div>
<div class="recommendations-section">
<p class="recommendations-intro">Wow, all these texts get you tired of reading, don't they? Well, I will recommend some movies and documentaries below if you are really interested in these subjects:</p>
<div class="movie-grid">
<a href="https://g.co/kgs/9op2HnN" class="movie-card" target="_blank" rel="noopener">
<img class="movie-image" alt="Brave Blue World" src="Imagens/Filme1.png" loading="lazy">
<p class="movie-title">Brave Blue World (2020)</p>
</a>
<a href="https://g.co/kgs/qcpCqB8" class="movie-card" target="_blank" rel="noopener">
<img class="movie-image" alt="Before the Flood" src="Imagens/Filme2a.png" loading="lazy">
<p class="movie-title">Before the Flood (2016)</p>
</a>
<a href="https://g.co/kgs/acX9yWC" class="movie-card" target="_blank" rel="noopener">
<img class="movie-image" alt="Minimalism: A Documentary About the Important Things" src="Imagens/Filme3.png" loading="lazy">
<p class="movie-title">Minimalism: A Documentary About the Important Things (2015)</p>
</a>
</div>
<p class="transition-text">Okay, these are the recommendations, they may be few but it's a start, you can find many more movies, series, documentaries and books that talk about the topics on this page on the internet. Let's move on to the next topic:</p>
</div>
</section>
<section class="content-section technology">
<div class="section-container">
<div class="section-header">
<hr class="section-line">
<h2 class="section-title">Technology</h2>
<hr class="section-line">
</div>
<div class="section-content">
<div class="image-container">
<img class="section-image" alt="Technology" src="Imagens/Tecnologia2.png" loading="lazy">
</div>
<div class="text-content">
<p>Technology is our tool to make changes happen. The development and evolution of our knowledge provides a greater opportunity for us to change the world and our future.</p>
<p>That's why technology is what will transform our world, because with technology we can develop new ways to preserve natural resources and our personal lives, all in a time as necessary as now.</p>
<p>It is noteworthy that all subjects here are extremely important, the current generation is and will undergo severe changes in the future, and especially in the environment. Like the glaciers in the Arctic regions that melt day after day, the extreme heat that occurs in the European region, deforestation, fires, and other discoveries such as the advancement of artificial intelligence, the metaverse, virtual reality, quantum processors, cars and smart electronics, and much more to come, so technology is what will continue to innovate our lives.</p>
<p class="highlight-text">And these are the real actions that will transform the world.</p>
<p>But none of this would be important without you, workers who spend day after day striving for a better world, professors who invest in the future and in the lives of students, students who dedicate themselves to being future entrepreneurs or professionals, and many other people, who make up a society in a world that is constantly changing.</p>
</div>
</div>
</div>
</section>
</main>
<footer class="site-footer">
<div class="footer-content">
<p class="acknowledgments">Thank you for viewing this project that I spent days dedicating myself to, it is a pleasure to be part of a project that deals with such an incredible topic for our lives. Thanks.</p>
<div class="license-info">
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/" target="_blank" rel="noopener">
<img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/88x31.png" />
</a>
<br>
This work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by/4.0/" target="_blank" rel="noopener">Creative Commons Attribution 4.0 International License</a>.
<p>This site was developed by @IzaacCoding36. All rights reserved.</p>
<p>Curitiba, Paraná, Brazil. 2026.</p>
</div>
</div>
</footer>
<script src="./JavaScript/buttons.js"></script>
</body>
</html>