-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
424 lines (387 loc) · 19.2 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
418
419
420
421
422
423
424
<!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>Document</title>
<link rel="stylesheet" href="styles.css">
<!-- iconscout -->
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.8/css/line.css">
<!-- GOOGLE 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=Mochiy+Pop+One&family=Montserrat:wght@300;400;500;600;700;900&display=swap"
rel="stylesheet">
<!-- SWIPERJS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.css" />
</head>
<body>
<!-- /* ==================NAVBAR=================== */ -->
<nav>
<div class="container nav__container">
<a href="index.html">
<h4>SkillSpectrum</h4>
</a>
<ul class="nav_menu">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="courses.html">Programs</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
<button id="open-menu-btn"><i class="uil uil-bars"></i></button>
<button id="close-menu-btn"><i class="uil uil-multiply"></i></i></button>
</div>
</nav>
<!-- /* ==================HEADER=================== */ -->
<header>
<div class="container header__container">
<div class="header__left">
<h1>Ignite your child's potential with SkillSpectrum's extraordinary care
</h1>
<p>
Unlock your child's potential in our nurturing daycare at SkillSpectrum. Join our remarkable journey
where milestones become stepping stones and every child's success is celebrated. Experience the
possibilities and give your child the best start in life at our trusted and caring daycare.
</p>
<a href="courses.html" class="btn btn-primary">Start Now</a>
</div>
<div class="header__right">
<div class="header__right-image">
<img src="images/girl-coloring.jpg">
</div>
</div>
</div>
</header>
<!-- /* ==================CATEGORY=================== */ -->
<section class="categories">
<div class="container categories__container">
<div class="categories__left">
<h1>Categories</h1>
<p>
SkillSpectrum: Where young minds thrive, guided by nurturing care.
Our devoted team fosters social, emotional, cognitive, and physical growth through meticulously
crafted programs and activities. In a secure environment with a child-centered approach,
SkillSpectrum is the catalyst for your child's blossoming.
</p>
<a href="#" class="btn">Learn More</a>
</div>
<div class="categories__right">
<article class="category">
<span class="category__icon"><i class="uil uil-lightbulb"></i></span>
<h5>Unleash Creativity</h5>
<p>Inspire imagination through painting, crafts, and performing arts, fostering creativity, fine
motor skills, and self-expression</p>
</article>
<article class="category">
<span class="category__icon"><i class="uil uil-english-to-chinese"></i></span>
<h5>Language Enrichment</h5>
<p> Enhance communication skills with storytelling, language games, and vocabulary building, laying
a strong language foundation.</p>
</article>
<article class="category">
<span class="category__icon"><i class="uil uil-dumbbell"></i></span>
<h5>Active Lifestyle</h5>
<p>Promote fitness and coordination through outdoor games, sports, yoga, and dance, encouraging an
active lifestyle.</p>
</article>
<article class="category">
<span class="category__icon"><i class="uil uil-users-alt"></i></span>
<h5>Build Social Stars</h5>
<p>Build cooperation, empathy, and problem-solving through group activities, role-playing, and
interactive lessons.</p>
</article>
<article class="category">
<span class="category__icon"><i class="uil uil-cog"></i></span>
<h5>Cognitive Marvels</h5>
<p>Stimulate critical thinking with puzzles, problem-solving, and logical reasoning exercises,
fostering intellectual growth.</p>
</article>
<article class="category">
<span class="category__icon"><i class="uil uil-trees"></i></i></span>
<h5>Nature Connection</h5>
<p>Connect children with nature through outdoor exploration, gardening, and environmental projects,
nurturing environmental awareness.</p>
</article>
</div>
</div>
</section>
<!-- /* ==================COURSES=================== */ -->
<section class="courses">
<h2>Our Popular Programs</h2>
<div class="container courses__container">
<article class="course">
<div class="course__image">
<img src="images/storytelling.jpg">
</div>
<div class="course__info">
<h4>Storytelling Adventures</h4>
<p> Immerse children in captivating tales, fostering language skills, imagination, and a love for
literature.</p>
<a href="courses.html" class="btn btn-primary">Learn More</a>
</div>
</article>
<article class="course">
<div class="course__image">
<img src="images/littlescientist.jpg">
</div>
<div class="course__info">
<h4>Little Scientists</h4>
<p>Ignite curiosity with hands-on experiments, promoting critical thinking and a passion for
scientific discovery.</p>
<a href="courses.html" class="btn btn-primary">Learn More</a>
</div>
</article>
<article class="course">
<div class="course__image">
<img src="images/littlesportsman.jpg">
</div>
<div class="course__info">
<h4>Sports Stars</h4>
<p> Foster physical development and teamwork through various sports and activities, encouraging an
active and healthy lifestyle.</p>
<a href="courses.html" class="btn btn-primary">Learn More</a>
</div>
</article>
</div>
</section>
<!-- /* ==================FAQ=================== */ -->
<section class="faqs">
<h2>Frequently Asked Questions</h2>
<div class="container faqs__container">
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>What is the age range of children accepted at the daycare?</h4>
<p>We accept children between the ages of 6 weeks to 5 years old.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>What are the operating hours of the daycare?</h4>
<p>Our daycare operates from Monday to Friday, from 7:00 AM to 6:00 PM.</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>What is the staff-to-child ratio in the daycare?</h4>
<p>We maintain a low staff-to-child ratio to ensure individual attention and quality care for each
child.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>Is the daycare licensed and regulated by the appropriate authorities?
</h4>
<p>Yes, our daycare is fully licensed and regulated by the local authorities, complying with all
necessary regulations and standards for child care facilities.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>What is the daily routine like for children at the daycare?</h4>
<p>Our daily routine includes a balance of structured activities, playtime, meals, rest periods, and
age-appropriate learning experiences.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>Is there a structured curriculum or learning program in place?</h4>
<p>Yes, we have a well-designed curriculum that focuses on early childhood development,
incorporating age-appropriate activities and learning experiences.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>What types of meals and snacks are provided for children?</h4>
<p>We provide nutritious meals and snacks that are carefully planned to meet the dietary needs of
children, taking into account any allergies or special dietary requirements.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>How are parents informed about their child's daily activities and progress?
</h4>
<p>We maintain open communication with parents through daily reports, parent-teacher meetings, and
regular updates via a dedicated WhatsApp group and email.</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>What safety measures are in place to ensure the well-being of the children?
</h4>
<p>We have strict safety protocols, including secured premises, trained staff in first aid and
emergency procedures, and regular safety inspections to ensure the well-being of all children.
</p>
</div>
</article>
<article class="faq">
<div class="faq__icon"><i class="uil uil-plus"></i></div>
<div class="question__answer">
<h4>Are the caregivers at the daycare qualified and trained in early childhood education? </h4>
<p>Yes, our caregivers are highly qualified and trained in early childhood education and have
extensive experience working with young children.
</p>
</div>
</article>
</div>
</section>
<!-- /* ==================TESTIMONIALS=================== */ -->
<section class="container testimonials__container mySwiper">
<h2>Parents Testimonials</h2>
<div class="swiper-wrapper">
<article class="testimonial swiper-slide">
<div class="avatar">
<img
src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OXx8YXZhdGFyfGVufDB8fDB8fHww&auto=format&fit=crop&w=500&q=60">
</div>
<div class="testimonial__info">
<h5>Esther Wanjiru</h5>
<small>Proud Parent</small>
</div>
<div class="testimonial__body">"Our child loves this daycare! They can't wait to go and are always
excited to share their experiences."</div>
</article>
<article class="testimonial swiper-slide">
<div class="avatar">
<img src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-">
</div>
<div class="testimonial__info">
<h5>Samuel Mwangi</h5>
<small>Thrilled Parent</small>
</div>
<div class="testimonial__body">"We couldn't be happier with this daycare. The staff is caring,
attentive, and truly dedicated to our child's development."</div>
</article>
<article class="testimonial swiper-slide">
<div class="avatar">
<img
src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OXx8YXZhdGFyfGVufDB8fDB8fHww&auto=format&fit=crop&w=500&q=60">
</div>
<div class="testimonial__info">
<h5>Mariam Akinyi</h5>
<small>Delighted Parent</small>
</div>
<div class="testimonial__body">"Choosing this daycare was the best decision we made. Our child has
thrived in their nurturing and stimulating environment."</div>
</article>
<article class="testimonial swiper-slide">
<div class="avatar">
<img
src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OXx8YXZhdGFyfGVufDB8fDB8fHww&auto=format&fit=crop&w=500&q=60">
</div>
<div class="testimonial__info">
<h5>Mariam Jane</h5>
<small>Confident Parent</small>
</div>
<div class="testimonial__body">"We have complete peace of mind knowing our child is in safe hands. The
daycare staff is professional and vigilant."</div>
</article>
<article class="testimonial swiper-slide">
<div class="avatar">
<img
src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OXx8YXZhdGFyfGVufDB8fDB8fHww&auto=format&fit=crop&w=500&q=60">
</div>
<div class="testimonial__info">
<h5>Jane Kariuki</h5>
<small>Appreciative Parent</small>
</div>
<div class="testimonial__body">"The level of communication and involvement from the daycare is
outstanding. They truly understand and cater to each child's needs."</div>
</article>
<article class="testimonial swiper-slide">
<div class="avatar">
<img
src="https://images.unsplash.com/photo-1607746882042-944635dfe10e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8OXx8YXZhdGFyfGVufDB8fDB8fHww&auto=format&fit=crop&w=500&q=60">
</div>
<div class="testimonial__info">
<h5>Mama Halima</h5>
<small>Grateful Parent</small>
</div>
<div class="testimonial__body">"We are grateful for the love and support our child receives at this
daycare. They have created a warm and welcoming environment."</div>
</article>
</div>
<div class="swiper-pagination"></div>
</section>
<!-- /* ==================FOOTER=================== */ -->
<footer>
<div class="container footer__container">
<div class="footer__1">
<a href="">
<h4>SkillSpectrum</h4>
</a>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Repellat aspernatur, quibusdam alias cumque
natus excepturi quam!</p>
</div>
<div class="footer__2">
<h4>Permalinks</h4>
<ul class="permalinks">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="courses.html">Courses</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
<div class="footer__3">
<h4>Privacy</h4>
<ul class="privacy">
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Terms and conditions</a></li>
<li><a href="#">Refund Policy</a></li>
</ul>
</div>
<div class="footer__4">
<h4>Contact Us</h4>
<div>
<p>+254 879 500 342</p>
<p>[email protected]</p>
</div>
<div class="footer__socials">
<li><a href=""><i class="uil uil-instagram-alt"></i></a></li>
<li><a href=""><i class="uil uil-twitter"></i></a></li>
<li><a href=""></a><i class="uil uil-facebook"></i></li>
<li><a href=""><i class="uil uil-linkedin"></i></a></li>
</div>
</div>
</div>
<div class="footer__copyright">
<small>Copyright © SkillSpectrum</small>
</div>
</footer>
<script src="index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.js"></script>
<!-- SLIDERJS -->
<script>
var swiper = new Swiper(".mySwiper", {
slidesPerView: 1,
spaceBetween: 30,
pagination: {
el: ".swiper-pagination",
clickable: true,
},
// when window width is 15 >= 600px;
breakpoints: {
600: {
slidesPerView: 2,
}
}
});
</script>
</body>
</html>