sdg4-quality-education/aboutsdg4.html at main · matreis7/sdg4-quality-education · 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
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
<!DOCTYPE html>

<html class="aboutsdg4_html" lang="en">

	<head>

		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- to be compatible with Internet Explorer -->
		<meta name="description" content="My First Web Desing Project">
		<meta name="keywords" content="HTML, CSS, JavaScript">
		<meta name="author" content="Rúbia Lana">

		<title>About SDG 4</title>

		<link rel="icon" type="image/x-icon" href="img/rubia/mainLogo.png">

		<!-- fonts -->
		<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=Anton&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">

		<script src="https://kit.fontawesome.com/19f3cd2e25.js" crossorigin="anonymous"></script>

		<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">

		<link rel="stylesheet" href="css/style.css">


	</head>


	<body class="aboutsdg_r">

		<!-- NAVBAR -->
			<div id="nav-placeholder"></div>

		<div class="container-fluid aboutsdg4_container">

			<div class="row spacer-top">

				<div class="header_sdr_r">

					<div class="img_top_sdg_r">

								<div class="text_top_sdg_r">

									<div class="title_top_sdg_r">
										<h1>About SDG 4</h1>
									</div>

									<br>

									<div class="subtitle_top_sdg_r">
										<h2>Quality Education - Sustainable Development Goals</h2>
									</div>

								</div>

					</div>

				</div>

			</div>

			<!-- For creating the text for the about sdg 4 page I copied the text of the reference page and asked chat gpt to create texts related to the content of the page. But in some parts that mached I just typed the same text that is on the site. -->

			<div class="row">

				<div class="col-md-6">
					<h2>Main Focus</h2>
					<p class="text_to_justify">Sustainable Development Goal 4 (SDG 4) focuses on ensuring inclusive, equitable, and quality education for all, while promoting lifelong learning opportinities. Education is a fundamental human right and a critical driver for sustainable development. By employing individuals with knowledge, skills and critical thinking, SDG 4 aims to reduce inequalities, foster economic growth, and strengthen social cohesion across societies. Achieving quality education is not only about access to scholls but also about creating learning environments that are safe, inclusive, and conducive to the holistic development of every learner. It is fundamental to sustainable development. Education is the one of the most powerful tools by which people can lift themselves out of poverty and fully participate in their communities. SDG 4 sets specific targets to address the challenges of achieving quality education universally and provide a comprehensive framework to reaching inclusive & equitable quality education for all.</p>

				</div>

				<div class="col-md-6">
					<div class="text_right_sdg_r">
						<h2>Keep Active</h2>
						<p class="text_to_justify">To better understand SDG 4 and its global impact, you can explore a wide range of resources that provide guidance, best practices, and research-based insights. These resources cover international reports, policy guidelines, and case studies that highlight successful educational programs for around the world. Weather you are an educator, policymaker, or student, these materials can help you understanding of the challenges and opportunities in achieving quality education for all.</p>
					</div>

					<br>

					<div class="second_row_buttons_sdg_r">


						<div class="btns_to_hover">

								<a class="a_sdg_r btn_hoover_me_sdg_r" href="https://www.right-to-education.org/taxonomy/term/41">Guides & Manuals</a>

								<a class="a_sdg_r btn_hoover_me_sdg_r" href="https://www.right-to-education.org/keywords/sdgs">SDG</a>

								<a class="a_sdg_r btn_hoover_me_sdg_r" href="https://www.right-to-education.org/taxonomy/term/30">Quality Education</a>
						</div>


						<div class="second-line_sdg_r mt-2">
								<a class="a_sdg_r btn4_hoover_me_sdg_r" href="https://www.right-to-education.org/topics/education-2030">Related Resources</a>
						</div>

					</div>

				</div> <!-- end of col -->

			</div> <!-- end of row -->

			<br><br>

			<div class="line_for_division"></div>

			<br><br>

			<div class="row add_margin_sdg_r">
					<div class ="col-md-4 col-12">
						<h3>Inclusive Education</h3>
						<p class="text_to_justify">Education should be accesible to every child, regardless of gender, disability, social-economic background, or location. Inclusive education ensures that msrginalized communities are not left behing and that all learners receive equal opportunities to thrive academically and socially.</p>
					</div>


					<div class="col-md-4 col-12">
						<h3>Equity in Learning</h3>
						<p class="text_to_justify">Equity focuses on removing barriers and providing targeted support to learners who face disavantages. That includes scholarships, mentoring programs, and adaptive teaching methods that address the specific needs of diverse learners. Achieving equity means that every student can achieve their full potential.</p>
					</div>


					<div class="col-md-4 col-12">
						<h3>Lifelong Learning Opportunities</h3>
						<p class="text_to_justify">Learning does not end with childhood or formal schooling. Lifelong learning encourages individuals to continuously develop skills, knowledge, and competencies throughout their lives. This helps people adapt to changing job markets, participate in civic life, and improve in personal well-being.</p>
					</div>

			</div>


			<div class="row add_margin_sdg_r">

				<div class="col-lg-7 col-12 mb-3 mb-lg-0">
					<img id="img_add_border_sdg_r" class="img-fluid w-100 zoom_wrapper_sdg_r" src="img/rubia/unsplash-img4.jpg" alt="University image">
				</div>

				<div class="col-lg-5 col-12">
					<h3>Why Quality Education Matters</h3>
					<p class="text_to_justify">Education is the foundation for sustainable development. It equips individuals with the knowledge and skills necessary to lead productive lives, make informed decisions, and contribute meaningfully to society. Beyound academic skills, education fosters critical thinking, creativity, and social responsability. By achieving quality education for all, societies can break cycles of poverty, reduce inequality, and promote peace and stability. SDG 4 emphasizes that every person, regardless of background, should have the opportunity to learn, grow, and shape a better future.</p>
				</div>

			</div>


			<h2 class="align_center_r">- Things To Do -</h2>

			<br>

			<div class="row">
				<div class="col-md-4 col-12 whatToDo_sdg_r text_to_justify">
					<i class="fa-solid fa-1"></i>
						<span>Find a Goal 4 charity you want to support. Any donation, big or small, can make a difference!</span>

				</div>

				<div class="col-md-4 col-12 whatToDo_sdg_r text_to_justify">
					<i class="fa-solid fa-2"></i>
						<span>Donate your used books. The easiest way to give access to knowledge is to donate your used books to someone.</span>
				</div>

				<div class="col-md-4 col-12 whatToDo_sdg_r text_to_justify">
					 <i class="fa-solid fa-3"></i>
						<span>Promote and take free online courses. In a digital world, there are more opportunities to get access to education than just go to university.</span>
				</div>
			</div>


			<div class="row">
				<div class="col-md-4 col-12 whatToDo_sdg_r text_to_justify">
					<i class="fa-solid fa-4"></i>
						<span>Visit your local school and ask what school supplies they need. Start a school supply drive in your community.</span>

				</div>

				<div class="col-md-4 col-12 whatToDo_sdg_r text_to_justify">
					<i class="fa-solid fa-5"></i>
						<span>Mentor young people. You can provide tutoring and homework assistance, teach a language or deliver a lesson on the Global Goals.</span>
				</div>

				<div class="col-md-4 col-12 whatToDo_sdg_r text_to_justify">
					<i class="fa-solid fa-6"></i>
						<span>Stay informed. Follow your local news and stay in touch with the Global Goals online or on social media at @TheGlobalGoals.</span>
				</div>
			</div>

			<br><br>

		</div> <!-- end of container -->

		<!-- footer placeholder -->
			<div id="footer-placeholder"></div>

		<!-- jQuery -->
			<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

		<!-- external JS -->
			<script src="script/main.js"></script>

		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>

		<script>
			window.addEventListener("scroll", () => {
			const banner = document.querySelector(".img_top_sdg_r");
			if (window.scrollY > 50) {
				banner.classList.add("shrink-banner");
			} else {
				banner.classList.remove("shrink-banner");
			}
			}); //here i made js reduce the image when the screen scrollsY/vertically. and the text also desapears
		</script>

	</body>

</html>