-
Notifications
You must be signed in to change notification settings - Fork 14
/
index.html
254 lines (241 loc) · 14.6 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@400;700;800&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<link rel="stylesheet" href="main.css">
<title>TATHASTU WEB</title>
</head>
<body>
<header class="container-fluid">
<p style="text-align: center">30% + 10% additional off site-wide till Oct 15th <a class="btn btn--white" href="#">Enroll now</a></p>
</header>
<nav>
<div class="col-12 col-md-6">
<a href="#">
<img class="brand ml-5" src="./images/tathastu_logo.png" />
</a>
</div>
<div class="nav-container col-12 col-md-6">
<span class="nav-element">
<a href="#" class="nav-link">Courses</a>
</span>
<span class="nav-element">
<a href="#" class="nav-link">Upcoming Events</a>
</span>
<span class="nav-element">
<a href="#" class="nav-link">Blogs</a>
</span>
<span class="nav-element">
<a href="#" class="nav-link">#</a> |
<a href="#" class="nav-link">#</a>
</span>
</div>
</nav>
<div class="container">
<div class="row mt-5">
<div class="col-8 font-weight-bold">
<h2>The best courses at your fingertips</h2>
<p class="text-muted">You can always complement what you learn in college.</p>
<p class="text-muted">Pick up skills that help you land jobs.</p>
<br>
<h2>Choose a course tailored for you.</h2>
<div class="row">
<div class="col-4">
<button class="btn btn--outline btn-l btn--padding-l">Contact Us</button>
</div>
<div class="col-1"></div>
<div class="col-4 pt-1">
<button class="btn btn--main btn-l btn--padding-l">Browse Courses</button>
</div>
</div>
</div>
<div class="col-4">
<img class="mt-5 ml-5" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/illustrations/new_illustration_mobile.gif" alt="Banner Image" height="250">
</div>
</div>
</div>
<div class="bg-white">
<div class="container">
<h2 class="text-dark text-center font-weight-bold">Upcoming Events</h2>
<br>
<div class="row">
<div class="col-4 card card--outline mr-4">
<h6 class="font-italic">Hackathon</h6>
<h6 class="text-right">24 Oct</h6>
<h3 class="font-weight-bold">CipherThone</h3>
<img src="https://storage.googleapis.com/cipherschools-storage.appspot.com/events/hack.png" alt="cipherthone image" height="200">
<div class="row">
<div class="col-3"></div>
<div class="col-6 mt-1">
<button class="btn btn--outline btn-l">Register</button>
</div>
</div>
</div>
<div class="col-3.5 card card--outline mr-4">
<h6 class="font-italic">New batch</h6>
<h6 class="text-right">15th Oct Onwards</h6>
<h3 class="font-weight-bold pb-2">Machine Learning</h3>
<h3 class="text-orange font-weight-bold">Rs 6999/-</h3>
<li class="text-muted font-weight-bold" style="list-style-image: url(https://cipherschools.com/static/media/small_star.9d7b6bbc.svg);">Live classroom training</li>
<li class="text-muted font-weight-bold" style="list-style-image: url(https://cipherschools.com/static/media/small_star.9d7b6bbc.svg);">Build live capstone project</li>
<li class="text-muted font-weight-bold" style="list-style-image: url(https://cipherschools.com/static/media/small_star.9d7b6bbc.svg);">24*7 doubt resolution</li>
<div class="row">
<div class="col-5 m-2 p-1">
<button class="btn btn--outline btn-l">Learn More</button>
</div>
<div class="col-5 m-2 p-2">
<button class="btn btn--main btn-l">Enroll Now</button>
</div>
</div>
</div>
<div class="col-3.5 card card--outline">
<h6 class="font-italic">New batch</h6>
<h6 class="text-right">15th Oct Onwards</h6>
<h3 class="font-weight-bold pb-2">MERN Stack Development</h3>
<h3 class="text-orange font-weight-bold">Rs 6999/-</h3>
<li class="text-muted font-weight-bold" style="list-style-image: url(https://cipherschools.com/static/media/small_star.9d7b6bbc.svg);">Live classroom training</li>
<li class="text-muted font-weight-bold" style="list-style-image: url(https://cipherschools.com/static/media/small_star.9d7b6bbc.svg);">Build live capstone project</li>
<li class="text-muted font-weight-bold" style="list-style-image: url(https://cipherschools.com/static/media/small_star.9d7b6bbc.svg);">24*7 doubt resolution</li>
<div class="row">
<div class="col-5 m-2 p-1">
<button class="btn btn--outline btn-l">Learn More</button>
</div>
<div class="col-5 m-2 p-2">
<button class="btn btn--main btn-l">Enroll Now</button>
</div>
</div>
</div>
</div>
<br><br>
<div class="row text-center">
<div class="col-4">
<h2 class="font-weight-bold text-dark">5000+</h2>
<h6 class="text-dark">Students Empowered</h6>
</div>
<div class="col-4">
<h2 class="font-weight-bold text-dark">1500+</h2>
<h6 class="text-dark">Personalised Live Coaching</h6>
</div>
<div class="col-4">
<h2 class="font-weight-bold text-dark">500+</h2>
<h6 class="text-dark">Jobs and Internships</h6>
</div>
</div>
<br>
<h2 class="text-dark text-center font-weight-bold">Why Students Choose Us</h2>
<br>
<div id="carouselExampleSlidesOnly" class="carousel slide text-center" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100 mb-4" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/icons/whyChoose/piggy-bank.svg" alt="First slide" height="100">
<h3 class="text-dark font-weight-bold">Affordable #</h3>
<p class="text-dark">Learn LIVE about in-demand technologies at a very affordable price</p>
</div>
<div class="carousel-item">
<img class="d-block w-100 mb-4" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/icons/whyChoose/chat.svg" alt="Second slide" height="100">
<h3 class="text-dark font-weight-bold">Instant Support</h3>
<p class="text-dark">Get your doubts resolved in no time through our Teaching Assistants</p>
</div>
<div class="carousel-item">
<img class="d-block w-100 mb-4" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/icons/whyChoose/online.svg" alt="Third slide" height="100">
<h3 class="text-dark font-weight-bold">100% Online</h3>
<p class="text-dark">Join from anywhere with an internet connection. Stay connected with your mentor and classmates</p>
</div>
<div class="carousel-item">
<img class="d-block w-100 mb-4" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/icons/whyChoose/coding.svg" alt="Fourth slide" height="100">
<h3 class="text-dark font-weight-bold">Relevant Curriculum</h3>
<p class="text-dark">Get trained in the most in-demand tech stacks in the industry. Learn through guided practical projects</p>
</div>
<div class="carousel-item">
<img class="d-block w-100 mb-4" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/icons/whyChoose/employee.svg" alt="Fifth slide" height="100">
<h3 class="text-dark font-weight-bold">Get Job Ready</h3>
<p class="text-dark">We train you on technologies that help you in your job as a fresher. Our educators are experienced industry experts</p>
</div>
</div>
</div>
<br>
<h2 class="text-dark text-center font-weight-bold mt-4">Leading Industry Mentors</h2>
<br>
<div class="row">
<div class="col-3 mr-5 ml-5">
<div class="card card--outline card--mentor">
<div class="overflow--pic">
<div class="profile-pic">
<img class="img-cover" src="./images/profileHover.svg" />
<div class="pic-frame">
<img class="pic" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/images/coach/pankaj.png" />
</div>
</div>
</div>
<h3 class="font-weight-bold pt-3">Pankaj Lohani</h3>
<img src="https://storage.googleapis.com/cipherschools-storage.appspot.com/images/coach/linkedin.png" width="100%" height="auto"/>
<p style="font-size: 0.8rem; color: #cfd2d7">Always eager to learn new things even if it goes beyond profile and domain.</p>
</div>
</div>
<div class="col-3 mr-5 ml-5">
<div class="card card--outline card--mentor">
<div class="overflow--pic">
<div class="profile-pic">
<img class="img-cover" src="./images/profileHover.svg" />
<div class="pic-frame">
<img class="pic" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/images/coach/mohit.png" />
</div>
</div>
</div>
<h3 class="font-weight-bold pt-2">Mohit Sharma</h3>
<img src="https://storage.googleapis.com/cipherschools-storage.appspot.com/images/coach/microsoft.png" width="100%" height="auto"/>
<p style="font-size: 0.8rem; color: #cfd2d7">I love writing code and ever since I've written my first program it has been my dream to reach people through my code. I am technology enthusiastic and always on a lookout for awesome problems.</p>
</div>
</div>
<div class="col-3 ml-5">
<div class="card card--outline card--mentor">
<div class="overflow--pic">
<div class="profile-pic">
<img class="img-cover" src="./images/profileHover.svg" />
<div class="pic-frame">
<img class="pic" src="https://storage.googleapis.com/cipherschools-storage.appspot.com/images/coach/fateh.png" />
</div>
</div>
</div>
<h3 class="font-weight-bold pt-2">Fateh Singh Aurora</h3>
<img src="https://storage.googleapis.com/cipherschools-storage.appspot.com/images/coach/amazon.png" width="100%" height="auto"/>
<p style="font-size: 0.8rem; color: #cfd2d7">I am software developer currently working at Amazon. I have deep interest in Data Structures and Algorithms. I enjoy developing the scalable systems from the scratch.</p>
</div>
</div>
</div>
</div>
</div>
<footer class="content-section row mt-5 mb-5">
<div class="col-12 mb-3" style="text-align: center">
<h2>About Us</h2>
</div>
<div class="col-12 col-md-4 mt-4" style="text-align: center">
<h3>Work With Us</h3>
<a href="#" class="white-link">Become an Instructor</a>
<a href="#" class="white-link">Become a Solution Expert</a>
<a href="#" class="white-link">Hire from Twowaits</a>
<a href="#" class="white-link">Refer & Earn</a>
</div>
<div class="col-12 col-md-4 mt-4" style="text-align: center">
<h3>Email Us</h3>
<a href="#" class="white-link">support@something.com</a>
<h3 class="mg-top">Contact Us</h3>
<a href="#" class="white-link">98765 43210</a>
</div>
<div class="col-12 col-md-4 mt-4" style="text-align: center">
<h3>Connect With Us</h3>
<img class="brand" src="./images/tathastu_logo.png" />
<div class="text-muted" style="font-size: 0.8rem">
© Copyright Something 2020<br />
<a href="#">Privacy Policy</a> | <a href="#">Terms & Conditions</a>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
</body>
</html>