-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
253 lines (237 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
<!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>Future Tech</title>
<link href="./css/style.css" rel="stylesheet"/>
</head>
<body>
<nav class="navbar background h-nav-resp">
<ul class="nav-list v-class-resp">
<div class="logo">
<img src="./img/laptop.jpg" alt="logo"/>
</div>
<li><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#servies">Servies</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<div class="rightnav v-class-resp">
<form action="" method="">
<input type="text" name="search" id="search"/>
<button class="btn btn-sm">Search</button>
</form>
</div>
<div class="smart-nav">
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</div>
</nav>
<section class="background first-section">
<div class="box-main">
<div class="first-half">
<p class="text-big">The Future of Tech is here</p>
<p class="text-small">In this world of 7 Billion People we need to educate all of them. This is the future of an educated world and we are proud to say that the Future of Education is Here</p>
<div class="button">
<button class="btn" href="#">Subscribe</button>
<button class="btn" href="#">Watch Video</button>
</div>
</div>
<div class="second-half">
<img src="./img/laptop.jpg" alt="future Image">
</div>
</div>
</section>
<section id="servies" class="section sec-right">
<div class="para">
<p class="text-big">
The end of your Search is Here
</p>
<p class="sec-subtag">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magni, itaque nemo laboriosam commodi modi autem fugit enim dolorum consectetur sed neque quidem qui ex eaque id soluta iste facere. Asperiores, blanditiis quisquam! Iusto excepturi hic dolore sapiente tempore omnis dicta a, eaque facere ea cumque, sit eligendi aliquid, quidem numquam! Soluta et harum alias odio nulla, impedit, hic maxime accusamus neque quis est doloremque molestiae inventore adipisci aliquam voluptates illo! Vero aliquam accusantium ex deleniti impedit ipsam, delectus, doloremque ad quo rerum debitis eligendi at reprehenderit optio magni numquam? Doloribus voluptatum veniam ratione, aut doloremque ullam ad provident voluptatibus voluptas quaerat iusto aspernatur esse modi, labore sed mollitia! Ad, eaque optio. Reprehenderit odio praesentium sint labore repellat sit, quod atque. Expedita, facere eum, labore culpa, suscipit ducimus atque nulla explicabo dolorum nisi aperiam ut! Aut, nihil. Soluta a iure eveniet molestiae amet dolorem. Quam minima ipsa deserunt tenetur voluptatum temporibus.
</p>
</div>
<div class="thumbnail">
<div class="inner-img">
<img src="./img/laptop.jpeg" alt="laptop" style=" height: 160px;
border-radius: 85px;
width: 160px;"/>
</div>
</div>
</section>
<section class="section left">
<div class="para">
<p class="text-big">
Big Data Analytics
</p>
<p class="sec-subtag">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magni, itaque nemo laboriosam commodi modi autem fugit enim dolorum consectetur sed neque quidem qui ex eaque id soluta iste facere. Asperiores, blanditiis quisquam! Iusto excepturi hic dolore sapiente tempore omnis dicta a, eaque facere ea cumque, sit eligendi aliquid, quidem numquam! Soluta et harum alias odio nulla, impedit, hic maxime accusamus neque quis est doloremque molestiae inventore adipisci aliquam voluptates illo! Vero aliquam accusantium ex deleniti impedit ipsam, delectus, doloremque ad quo rerum debitis eligendi at reprehenderit optio magni numquam? Doloribus voluptatum veniam ratione, aut doloremque ullam ad provident voluptatibus voluptas quaerat iusto aspernatur esse modi, labore sed mollitia! Ad, eaque optio. Reprehenderit odio praesentium sint labore repellat sit, quod atque. Expedita, facere eum, labore culpa, suscipit ducimus atque nulla explicabo dolorum nisi aperiam ut! Aut, nihil. Soluta a iure eveniet molestiae amet dolorem. Quam minima ipsa deserunt tenetur voluptatum temporibus.
</p>
</div>
<div class="thumbnail">
<div class="inner-img">
<img src="./img/bigdata.jpg" alt="bigdata"/>
</div>
</div>
</section>
<section class="section sec-right">
<div class="para">
<p class="text-big">
Artificial Intelligence
</p>
<p class="sec-subtag">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magni, itaque nemo laboriosam commodi modi autem fugit enim dolorum consectetur sed neque quidem qui ex eaque id soluta iste facere. Asperiores, blanditiis quisquam! Iusto excepturi hic dolore sapiente tempore omnis dicta a, eaque facere ea cumque, sit eligendi aliquid, quidem numquam! Soluta et harum alias odio nulla, impedit, hic maxime accusamus neque quis est doloremque molestiae inventore adipisci aliquam voluptates illo! Vero aliquam accusantium ex deleniti impedit ipsam, delectus, doloremque ad quo rerum debitis eligendi at reprehenderit optio magni numquam? Doloribus voluptatum veniam ratione, aut doloremque ullam ad provident voluptatibus voluptas quaerat iusto aspernatur esse modi, labore sed mollitia! Ad, eaque optio. Reprehenderit odio praesentium sint labore repellat sit, quod atque. Expedita, facere eum, labore culpa, suscipit ducimus atque nulla explicabo dolorum nisi aperiam ut! Aut, nihil. Soluta a iure eveniet molestiae amet dolorem. Quam minima ipsa deserunt tenetur voluptatum temporibus.
</p>
</div>
<div class="thumbnail">
<div class="inner-img">
<img src="./img/robot1.jpeg" alt="robot" style=" height: 160px;
border-radius: 85px;
width: 160px;"/>
</div>
</div>
</section>
<section class="section left">
<div class="para">
<p class="text-big">
Genomics
</p>
<p class="sec-subtag">
Imagine a technology that can study your DNA and use it to improve your health, helping you fight diseases and whatnot! Genomics is precisely that technology that peruses upon the make-up of genes, DNAs, their mapping, structure, etc. Further, this can help quantify your genes and result in finding diseases or any possible problems that can later be a health issue. When it comes to a specialization like Genomics, one can find a variety of technical as well as non-technical roles. Technical jobs in this area are all about designing, analyzing, and diagnostics, while non-technical jobs are concerned with higher levels of research and theoretical analysis. Here are the top jobs in Genomics:
</p>
<ul>
<li>Bioinformatics Analyst</li>
<li>Genome Research Analyst</li>
<li>Full Stack Developer</li>
<li>Software Engineer</li>
<li>Bioinformatician</li>
<li>Genetics Engineer</li>
</ul>
</div>
<div class="thumbnail">
<div class="inner-img">
<img src="./img/genomics.jpg" alt="genomics" style=" height: 160px;
border-radius: 85px;
width: 160px;"/>
</div>
</div>
</section>
<section class="section sec-right">
<div class="para">
<p class="text-big">
Quantum Computing
</p>
<p class="sec-subtag">
Next remarkable technology trend is quantum computing, which is a form of computing that takes advantage of quantum phenomena like superposition and quantum entanglement. This amazing technology trend is also involved in preventing the spread of the coronavirus, and to develop potential vaccines, thanks to its ability to easily query, monitor, analyze and act on data, regardless of the source. Another field where quantum computing is finding applications is banking and finance, to manage credit risk, for high-frequency trading and fraud detection.
</p>
<p>
Quantum computers are now a multitude times faster than regular computers and huge brands like Splunk, Honeywell, Microsoft, AWS, Google and many others are now involved in making innovations in the field of Quantum Computing. The revenues for the global quantum computing market are projected to surpass $2.5 billion by 2029. And to make a mark in this new trending technology, you need to have experience with quantum mechanics, linear algebra, probability, information theory, and machine learning.
</p>
</div>
<div class="thumbnail">
<div class="inner-img">
<img src="./img/Quantum-computer.jpg" alt="Quantum-computer" style=" height: 160px;
border-radius: 85px;
width: 160px;"/>
</div>
</div>
</section>
<section id= "about" class="contact-detail">
<div class="container">
<table width="80%">
<tr>
<td></td>
<td>
<h3>
Email:
</h3>
<a href="mailto:hello@example.com">Rayoptics@example.com</a></td>
<td><h3>
Phone:
</h3><a href="tel:+7-800-999-800">+7-800-999-800</a></td>
<td>
<h3>
Address:
</h3><address>76 West Rock, Maple Building,
London
</address></td>
</tr>
</table>
</div>
</section>
<section id="contact" class="contact">
<h1 class="text-center">Contact Us</h1>
<div class="map overlay">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2877.6564157301127!2d-79.02381538462697!3d43.842221579115225!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89d4dfd9ff9e7839%3A0x220dfa311cd630eb!2sFuture-Tech%20Canada!5e0!3m2!1sen!2s!4v1674323490599!5m2!1sen!2s" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
<div class="form">
<form>
<input type="text" name="name" id="name" placeholder="Enter Your Name"/>
<input type="email" name="email" id="email" placeholder="Enter Your Email"/>
<textarea id="msg" name="msg" cols="20" roews="10" placeholder="Enter Your Query Here"></textarea>
<button type="submit" name="submit" id="submit" class="btn">Submit</button>
</form>
</div>
</section>
<footer>
<div class="foot-div">
<div class="foot-logo">
<span style="display: inline-block; width: 0px;
margin-top: 12px;">
<img src="./img/laptop1.jpg" width="50" height="50" align="left" style="border-radius: 40px;" alt="logo" title="logo">
<p align="right" style="padding-top: 15px; color: white;"><b>Future Tech</b></p>
</span>
</div>
<div class="foot-list">
<h3>Projects</h3>
<ul>
<li><a href="#">Graphics Designer</a></li>
<li><a href="#">Digital Marketing</a></li>
<li><a href="#">Graphics Designer</a></li>
<li><a href="#">Video Editing</a></li>
<li><a href="#">Music</a></li>
<li><a href="#">Programming</a></li>
<li><a href="#">Consultant</a></li>
<li><a href="#">Travel Agent</a></li>
<li><a href="#">Photography</a></li>
</ul>
</div>
<div class="foot-list">
<h3>About</h3>
<ul>
<li><a href="#">Career</a></li>
<li><a href="#">Partnership</a></li>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Terms of Service</a></li>
<li><a href="#">Investor Relation</a></li>
</ul>
</div>
<div class="foot-list">
<h3>Support</h3>
<ul>
<li><a href="#">Help & Support</a></li>
<li><a href="#">Trust & Safety</a></li>
<li><a href="#">Community</a></li>
<li><a href="#">Affiliates</a></li>
</ul>
</div>
<div class="foot-list">
<h3>Stay Connected</h3>
<p>Join us with <b>+50,000</b> People and Enjoy your community</p>
<form action="" method="">
<input type="email" name="email" id="email" placeholder=" email"required/>
<input type="date" name="date" id="date" hidden/>
<input type="time" name="time" id="time" hidden/>
<button type="submit" name="submit" id="submit" class="btn btn-light">Subscribe</button>
</form>
</div>
<p class="" style="text-align: center;"> Copyright © 2023 - Future Tech All Rights Reserved</p>
</div>
</div>
</footer>
<script src="./js/script.js"></script>
</body>
</html>