-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
102 lines (101 loc) · 4.56 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/vidbg.css">
<link rel="stylesheet" href="css/aos.css">
<title>Space X</title>
</head>
<body>
<header class="header">
<img src="img/logo.svg" alt="logo" class="logo" data-aos="fade-down">
<nav class="main-nav" data-aos="fade-down">
<ul class="list">
<li class="item">
<a href="#" class="item-link">Falcon 9</a>
</li>
<li class="item">
<a href="#" class="item-link">Falcon Heavy</a>
</li>
<li class="item">
<a href="#" class="item-link">Dragon</a>
</li>
<li class="item">
<a href="#" class="item-link">Updates</a>
</li>
</ul>
</nav>
<nav class="secondary-nav" data-aos="fade-down">
<ul class="list">
<li class="item"><a href="#" class="item-link">About</a></li>
<li class="item"><a href="#" class="item-link">Gallery</a></li>
<li class="item"><a href="#" class="item-link">Shop</a></li>
</ul>
</nav>
</header>
<section class="main">
<h1 class="title" data-aos="fade-up" data-aos-delay="300">Falcon Heavy</h1>
<p class="discription" data-aos="fade-up" data-aos-delay="600">The most powerful operational rocket in the world by a factor of two</p>
</section>
<div class="video" data-aos-delay="900" data-aos="fade-up"></div>
<section class="feature">
<div class="overwiev">
<h2 class="feature-title" data-aos="fade-right">Falcon Heavy <br/>Overview</h2>
<table data-aos="fade-right" data-aos-delay="300">
<tr>
<td>HEIGHT</td>
<td>70 m / 229.6 ft</td>
</tr>
<tr>
<td>DIAMETER</td>
<td>12.2 m / 39.9 ft</td>
</tr>
<tr>
<td>MASS</td>
<td>1,420,788 kg / 3,125,735 lb</td>
</tr>
<tr>
<td>PAYLOAD TO LEO</td>
<td>63,800 kg / 140,660 lb</td>
</tr>
<tr>
<td>PAYLOAD TO GTO</td>
<td>26,700 kg / 58,860 lb</td>
</tr>
<tr>
<td>PAYLOAD TO MARS</td>
<td>16,800 kg / 37,040 lb</td>
</tr>
</table>
<img src="img/rocket.png" class="rocket" data-rellax-speed="10" alt="">
<h2 class="feature-title" data-aos="fade-right">UNMATCHED <br/>PERFORMANCE</h2>
<p class="feature-text" data-aos="fade-right" data-aos-delay="300">With more than 5 million pounds of thrust at liftoff, Falcon Heavy is the most capable rocket flying. By comparison, the
liftoff thrust of the Falcon Heavy equals approximately eighteen 747 aircraft at full power. Falcon Heavy can lift the
equivalent of a fully loaded 737 jetliner—complete with passengers, luggage and fuel—to orbit.</p>
</div>
</section>
<footer class="footer" data-aos="fade-up">
<img src="img/logo.svg" class="logo" alt="space">
<nav class="footer-nav">
<ul class="list">
<li class="item"><a href="#" class="item-link">Twitter</a></li>
<li class="item"><a href="#" class="item-link">Youtube</a></li>
<li class="item"><a href="#" class="item-link">Instagram</a></li>
<li class="item"><a href="#" class="item-link">Flickr</a></li>
<li class="item"><a href="#" class="item-link">LinkedIn</a></li>
<li class="item"><a href="#" class="item-link">Privacy</a></li>
<li class="item"><a href="#" class="item-link">Policy</a></li>
</ul>
</nav>
<p class="footer-text">For additional questions, contact <a class="footer-link" href="mailto:[email protected]">[email protected]</a></p>
<a href="#" class="button">Contact us</a>
</footer>
<script src="js/rellax.min.js"></script>
<script src="js/vidbg.js"></script>
<script src="js/aos.js"></script>
<script src="js/main.js"></script>
</body>
</html>