-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
107 lines (104 loc) · 5.55 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
<!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" />
<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=Josefin+Sans:wght@300;400;500&family=Oswald:wght@600;700&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="styles.css" />
<title>Arnold Tribute</title>
</head>
<body>
<div id="container">
<header id="hero-section">
<div class="title">
<h1 id="title">Arnold Schwarzenegger</h1>
<span class="subtitle">--The Mith, The Legend--</span>
</div>
</header>
<section id="about">
<div class="introduction">
<h2>About</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis
odio impedit repudiandae ea laborum, architecto fugiat provident
voluptate nam adipisci temporibus. Dignissimos pariatur excepturi
unde quisquam reprehenderit blanditiis vel earum. Quisquam
repellendus laborum consequuntur, natus accusamus est perspiciatis
fugit voluptates earum necessitatibus molestias officiis ex neque
soluta rerum, ullam unde quae reprehenderit, expedita harum? Tenetur
ut possimus perferendis ipsam voluptates. Possimus saepe excepturi,
amet quod nesciunt laboriosam? Tenetur doloribus asperiores ducimus
quas vel velit cum porro doloremque mollitia. Quod minima
perspiciatis sequi! Voluptatem, cupiditate! Et doloribus ipsum ut
sunt inventore? Dolorem quae quisquam est nulla perferendis id unde,
explicabo nam possimus vitae ullam non quasi voluptatem eius earum
fuga quidem, quo aperiam sint placeat sapiente molestias. Culpa iure
perferendis sed?
</p>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis
odio impedit repudiandae ea laborum, architecto fugiat provident
voluptate nam adipisci temporibus. Dignissimos pariatur excepturi
unde quisquam reprehenderit blanditiis vel earum. Quisquam
repellendus laborum consequuntur, natus accusamus est perspiciatis
fugit voluptates earum necessitatibus molestias officiis ex neque
soluta rerum, ullam unde quae reprehenderit, expedita harum? Tenetur
ut possimus perferendis ipsam voluptates. Possimus saepe excepturi,
amet quod nesciunt laboriosam? Tenetur doloribus asperiores ducimus
quas vel velit cum porro doloremque mollitia. Quod minima
perspiciatis sequi! Voluptatem, cupiditate! Et doloribus ipsum ut
sunt inventore? Dolorem quae quisquam est nulla perferendis id unde,
explicabo nam possimus vitae ullam non quasi voluptatem eius earum
fuga quidem, quo aperiam sint placeat sapiente molestias. Culpa iure
perferendis sed?
</p>
</div>
<section id="gallery">
<div class="cards">
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-1.jpg" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-2.webp" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-3.jpg" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-4.jpg" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-1.jpg" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-2.webp" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-3.jpg" alt="Sample photo" />
<img src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/image-4.jpg" alt="Sample photo" />
</div>
</section>
<section id="quote"></section>
</section>
<main id="main">
<div id="card">
<figure id="img-div">
<img
src="https://raw.githubusercontent.com/CallensJ/Arnold-Tribute/main/images/arnold-schwarzenegger_a986.webp"
alt="Trulli"
id="image"
/>
<figcaption id="img-caption">
<h2 class="img-title">Fig 1: Arnold 2016.</h2>
<p id="tribute-info">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis
odio impedit repudiandae ea laborum, architecto fugiat provident
voluptate nam adipisci temporibus. Dignissimos pariatur
excepturi unde quisquam reprehenderit blanditiis vel earum.
Quisquam repellendus laborum consequuntur, natus accusamus est
perspiciatis fugit voluptates earum necessitatibus molestias
officiis ex neque soluta rerum, ullam unde quae reprehenderit,
expedita harum? Tenetur ut possimus perferendis ipsam
voluptates.
</p>
<a href="#" id="tribute-link" target="_blank">READ MORE</a>
</figcaption>
</figure>
</div>
</main>
</div>
</body>
</html>