-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
390 lines (316 loc) · 15.1 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
<!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>Code Karo Yaaro</title>
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="basic-coding-for-kids.png" type="image/x-icon" />
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- AOS animation -->
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
</head>
<body>
<!-- pre loader animation -->
<!-- <div class="preloader">
</div> -->
<!-- Navbar -->
<nav>
<div class="container flex align-item-center">
<img src="basic-coding-for-kids.png" alt="Coding shuttle logo">
<!--<h3><b>Code Karo Yaaro</b></h3>-->
<div class="menu-icon">
<i class="fa-solid fa-bars"></i>
</div>
<div class="navbar-collapse">
<ul class="flex menu">
<li><a href="#" class="store">Home</a></li>
<li><a href="#" class="store2">Courses</a></li>
<li><a href="#" class="stor3">About us</a></li>
<li><a href="#" class="store4">Blogs</a></li>
<!-- <li><a href="#" class="btn btn-primary" id="rn">Log in <span class="pl-2"><i class="fa-sharp fa-solid fa-arrow-right-to-bracket"></i></span></a></li> -->
<!--<button type="button" class="btn-login">Book free Trial</button>-->
<!-- <button type="button" class="btn-trial">Join now</button> -->
</ul>
</div>
</div>
</nav>
<!-- Hero section -->
<section>
<div class="hero">
<div class="blurred-gradient">
<!-- <img src="./images/blurred-gradient.png" alt="" > -->
</div>
<div class="container">
<div class="hero-row grid">
<div class="col-left">
<h1 data-aos="fade-right" data-aos-duration="1500">
<span class="color-p"></span><span class="auto-typing">Learn With</span><span class="color-p"><br> Code Karo Yaaro</span>
</h1>
<div class="right3" <h2 data-aos="fade-right " data-aos-duration="1700"><b><b>Leading the life of your children towards a better future.</b></b><br>Make a great career path for your beloved by enrolling them in India’s First Online School of Computer Science.</h2>
</div>
<div class="buttons flex" data-aos="fade-right" data-aos-duration="2000">
<a href="#" class="btn btn-primary">View Course</a>
<a href="https://www.youtube.com/embed/QdD3NrYO2Y8" class="btn btn-secondary" target="_blank">Watch Video</a>
</div>
</div>
<div class="col-right">
<img src="edited.png" alt="Hero image">
</div>
</div>
</div>
</div>
</section>
<!-- Achievements section -->
<section class="achievements">
<div class="container">
<div class="grid achievements-row">
<div class="flex">
<h1>10000+</h1>
<h2>Students</h2>
</div>
<div class="flex">
<h1>480000+</h1>
<h2>Classes Conducted</h2>
</div>
<div class="flex">
<h1>3.0k+</h1>
<h2>Subsribers</h2>
<a href="https://www.youtube.com/@codekaroyaaro8089" target="_blank">on YouTube </a>
</div>
<div class="flex">
<h1>3.3K</h1>
<h2>Follow us on </h2>
<a href="https://www.instagram.com/codekaroyaaro/?igshid=1nb6afsffwzd" target="_blank">on Instagram </a>
</div>
</div>
</div>
</section>
<!-- Benefits -->
<section class="benefits">
<div class="container">
<div class="text-area">
<p>Our Advance Learning System</p>
<h1>We Make learning Easy and convinent</h1>
</div>
<div class="benefits-row grid">
<div class="card flex card1" data-aos="fade-right" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-pen-to-square"></i></div>
<h2>Learn Anywhere</h2>
<p>Join Classes From Anywhere i.e From mobile or desktop
</p>
</div>
<div class="card flex card2" data-aos="fade-left" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-gauge"></i></div>
<h2>Quick Resolution
</h2>
<p>We are available 24/7 to resolve your Doubts
</p>
</div>
<div class="card flex card3" data-aos="fade-up-right" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-network-wired"></i></div>
<h2>Instant Doubt Solving
</h2>
<p>Our experts provide In-class resolutions to cater students doubts
</p>
</div>
<div class="card flex card4" data-aos="fade-up-left" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-comments"></i></div>
<h2>Mentor Support
</h2>
<p>Our experts help students
</p>
</div>
<div class="card flex card5" data-aos="fade-up-rightt" data-aos-duration="2006">
<div class="icon"><i class="fa-sharp fa-solid fa-brain"></i></div>
<h2>Brainstroming
</h2>
<p>We help to improve student's problem-solving techniques
</p>
</div>
<div class="card flex card6" data-aos="fade-up-left" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-university"></i></div>
<h2>Skill Based Education
</h2>
<p>We provide skill based education
</p>
</div>
<div class="card flex card7" data-aos="fade-up-right" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-suitcase"></i></div>
<h2>Entrepreneurship
</h2>
<p>We develop winning strategies and critical thinking skills in students
</p>
</div>
<div class="card flex card8" data-aos="fade-up-left" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-mobile"></i></div>
<h2>Learn on Mobile
</h2>
<p>Learn to code on mobile
</p>
</div>
<div class="card flex card9" data-aos="fade-up-right" data-aos-duration="2000">
<div class="icon"><i class="fa-sharp fa-solid fa-graduation-cap"></i></div>
<h2>Quality Education
</h2>
<p>We Ensure Quality Education for every student
</p>
</div>
</div>
</div>
</section>
<!-- Meet your instructor -->
<section class="meet">
<img src="waves.svg" alt="" class="waves">
<div class="blurred-gradient"></div>
<div class="container">
<div class="text-area">
<h1>We are <span class="color-p">Featured In</span></h1>
</div>
<div class="grid instructor-img" data-aos="fade-up" data-aos-duration="2000">
<div><img src="air.jpeg" alt="New"></div>
<hr>
<hr>
<h2><br>Here's Why</h2>
<p>Coding is Important!</p>
</div>
<div class="worked-companies grid" data-aos="fade-up" data-aos-duration="2000">
<div class="grid">
<div><img src="trophy.jpeg" alt="Better Butter" class="bb-img"></div>
<p>Gives your child a competitive edge </p>
</div>
<div class="grid">
<div><img src="pss.jpeg" alt="Urban Clap">
</div>
<p>improves problem-solving skills</p>
</div>
<div class="grid">
<div> <img src="teaching.jpeg" alt="Amazon">
</div>
<p>Teaches Persistency</p>
</div>
</div>
</div>
</section>
<!-- Placements -->
<section class="placement">
<div class="container">
<div class="placement-row grid">
<div class="col-left flex" data-aos="fade-right" data-aos-duration="2000">
<b class="color-p">Courses Designed</b>
<h1>Specially for Kids
</h1>
<p>We have designed some awesome courses for your children
</p>
</div>
<div class="col-right grid">
<div class="outer-circle">
<!-- <div class="oc1 planet"><img src="#" alt=""></div>-->
<div class="oc2 planet"><img src="py.png" alt=""></div>
<!--<div class="oc3 planet"><img src="" alt=""></div>-->
<div class="oc4 planet"><img src="888859.png" alt=""></div>
<div class="oc5 planet"><img src="logo-2582747_1280.webp" alt=""></div>
<div class="oc6 planet"><img src="cpp.png" alt=""></div>
<div class="box">
<div class="inner-circle">
<div class="planet1 planet"><img src="anime.png" alt=""></div>
<!-- <div class="planet2 planet"><img src="2.webp" alt=""></div>-->
<div class="planet3 planet"><img src="puzzle.png" alt=""></div>
<!--<div class="planet4 planet"><img src="4.webp" alt=""></div>-->
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Course Price -->
<!-- coding Family -->
<section class="coding-family">
<img src="dots.svg" alt="dots" class="dots">
<div class="container">
<div class="text-area" data-aos="fade-up" data-aos-duration="2000">
<h1><br>Join our Coding family</h1>
<p>If you would like to keep up on the latest posts and courses,<br> come by and connect with us on the following links.</p>
</div>
<div class="coding-row grid">
<div><img src="youtube-icon.webp" alt="linkedin-icon">
<p style="color: #F80205;"><i class="fa-sharp fa-solid fa-arrow-up-right-from-square"></i> YouTube</p>
</div>
<div><img src="linkedin-icon.webp" alt="linkedin-icon">
<p style="color: #0168AC; "><i class="fa-sharp fa-solid fa-arrow-up-right-from-square "></i> LinkedIn</p>
</a>
</div>
<div><img src="insta.png" alt="discord-icon ">
<p style="color: #ff0066; "><i class="fa-sharp fa-solid fa-arrow-up-right-from-square "></i>
<a href="https://instagram.com/codekaroyaaro?igshid=1nb6afsffwzd"></a> Instagram</p>
</div>
<div><img src="whatsapp.png" alt="telegram-icon ">
<p style="color: #09d43f; "><i class="fa-sharp fa-solid fa-arrow-up-right-from-square "></i>whatsapp</p>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer>
<div class="container ">
<div class="footer-row grid ">
<div class="col-1 ">
<img div class="image1" src="black.jpeg" alt="">
<h3>Code Karo Yaaro</h3>
<p>We At CodeKaroYaaro , we empower future generations to become a crucial part in this Digital century. We guide students to learn new technologies like App Development, Web Development, Artificial Intelligence, Python Programming and
Mobile App Development. We are just a call away to Make Learning A Fun Game For Your Kid!
</p>
</div>
<div class="col-2 grid ">
<div>
<ul class="flex ">
<li>
<b>MENU</b>
</li>
<li><a href="# ">About us</a></li>
<li><a href="# ">Courses</a></li>
<li><a href="# ">Contact</a></li>
</ul>
</div>
<div>
<ul class="flex ">
<li>
<b>SERVICES
</b>
</li>
<li><a href="# ">Privacy Policy</a></li>
<li><a href="# ">Terms of use</a></li>
<li><a href="# ">Refund policy</a></li>
</ul>
</div>
</div>
<div class="col-3 grid ">
<b>GET IN TOUCH</<b>
<ul>
<p><br>[email protected]</p>
<p><br>For Parents: [email protected]</p>
<p><br>Address : H NO. 1951, Near Water Tank Annamod, Khaparkheda, Nagpur, Maharashtra, 441102</p>
</ul>
</div>
</div>
<div class="copyright ">
<p>Copyright © 2022 CodeKaroYaaro. All Rights Reserved.
</p>
</div>
</div>
</footer>
<!-- Font Awesome -->
<link rel="stylesheet " href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css " integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin=" anonymous
" referrerpolicy="no-referrer " />
<!-- Script file -->
<script src="./script.js "></script>
<!-- AOS animation -->
<script src="https://unpkg.com/[email protected]/dist/aos.js "></script>
<script>
AOS.init();
</script>
</body>
</html>