-
Notifications
You must be signed in to change notification settings - Fork 24
/
Copy pathindex.html
102 lines (94 loc) · 4 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">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="assets/css/main.css" />
<title>My site</title>
</head>
<body>
<header id="header" class="alt">
<div class="inner">
<h1>Hello World</h1>
<p>There's nothing here yet...</p>
</div>
</header>
<div id="wrapper">
<!-- Banner -->
<section id="intro" class="main">
<span class="icon fa-diamond major"></span>
<h2>Magna porta maximus</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae<br />
malesuada turpis. Nam pellentesque in ac aliquam. Aliquam tempor<br />
mi porta egestas maximus lorem ipsum dolor.</p>
<ul class="actions">
<li><a href="#" class="button big">Learn More</a></li>
</ul>
</section>
<!-- Items -->
<section class="main items">
<article class="item">
<header>
<a href="#"><img src="images/pic01.jpg" alt="" /></a>
<h3>Feugiat et faucibus</h3>
</header>
<p>Fusce malesuada efficitur venenatis. Pellentesque tempor leo sed massa hendrerit hendrerit. In sed feugiat est, eu congue elit. Ut porta magna vel felis sodales vulputate. Donec faucibus dapibus lacus non ornare.</p>
<ul class="actions">
<li><a href="#" class="button">More</a></li>
</ul>
</article>
<article class="item">
<header>
<a href="#"><img src="images/pic02.jpg" alt="" /></a>
<h3>Blandit adipiscing</h3>
</header>
<p>Fusce malesuada efficitur venenatis. Pellentesque tempor leo sed massa hendrerit hendrerit. In sed feugiat est, eu congue elit. Ut porta magna vel felis sodales vulputate. Donec faucibus dapibus lacus non ornare.</p>
<ul class="actions">
<li><a href="#" class="button">More</a></li>
</ul>
</article>
<article class="item">
<header>
<a href="#"><img src="images/pic03.jpg" alt="" /></a>
<h3>Lorem massa nulla</h3>
</header>
<p>Fusce malesuada efficitur venenatis. Pellentesque tempor leo sed massa hendrerit hendrerit. In sed feugiat est, eu congue elit. Ut porta magna vel felis sodales vulputate. Donec faucibus dapibus lacus non ornare.</p>
<ul class="actions">
<li><a href="#" class="button">More</a></li>
</ul>
</article>
<article class="item">
<header>
<a href="#"><img src="images/pic04.jpg" alt="" /></a>
<h3>Ipsum sed tempus</h3>
</header>
<p>Fusce malesuada efficitur venenatis. Pellentesque tempor leo sed massa hendrerit hendrerit. In sed feugiat est, eu congue elit. Ut porta magna vel felis sodales vulputate. Donec faucibus dapibus lacus non ornare.</p>
<ul class="actions">
<li><a href="#" class="button">More</a></li>
</ul>
</article>
</section>
<!-- CTA -->
<section id="cta" class="main special">
<h2>Etiam veroeros lorem</h2>
<p>Phasellus ac augue ac magna auctor tempus proin<br />
accumsan lacus a nibh commodo in pellentesque dui<br />
in hac habitasse platea dictumst.</p>
<ul class="actions">
<li><a href="#" class="button big">Get Started</a></li>
</ul>
</section>
<footer id="footer">
<ul class="icons">
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
<li><a href="#" class="icon fa-linkedin"><span class="label">LinkedIn</span></a></li>
<li><a href="#" class="icon fa-envelope"><span class="label">Email</span></a></li>
</ul>
<p class="copyright">© Nobody</p>
</footer>
</div>
</body>
</html>