forked from sean3325/bullfrog_responsive
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
85 lines (77 loc) · 4.93 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Bullfrog</title>
<link rel="stylesheet" href="stylesheets/screen.css">
</head>
<body>
<div id="page">
<div class="above-header">
<!-- Start main navigation -->
<nav class="main-nav" id="main-nav">
<a href="#" class="home"><span>Home</span></a>
<a href="#" class="about"><span>About</span></a>
<a href="#" class="contact"><span>Contact</span></a>
</nav>
</div>
<!-- End main navigation -->
<!-- Start header -->
<header id="top">
<div class="logo">
<a href="/">Bullfrog</a>
</div>
</header>
<!-- End header -->
<!-- Start content wrapper -->
<div id="content-wrap">
<!-- Start main content -->
<main id="content">
<article>
<h1 class="article-title">In blandit nisi eget ante malesuada</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec semper, dui vitae fringilla egestas, tellus est elementum ante, et fringilla quam orci eget metus. Vestibulum tempor leo elit, vel sollicitudin dolor auctor non. Mauris sit amet gravida purus, sit amet pretium velit. Pellentesque euismod pulvinar nisl in rhoncus. Praesent leo diam, sodales ut odio sit amet, interdum pretium quam. Quisque sit amet rutrum est. Curabitur pharetra tellus quis luctus vulputate. Phasellus in congue leo. Vivamus justo elit, iaculis vel consectetur non, commodo at augue. Etiam vitae dolor quis dolor hendrerit fringilla et a magna. Phasellus dictum, mauris sit amet commodo semper, justo velit aliquet risus, nec aliquam neque neque id nisl. Aliquam erat volutpat. Nullam non enim varius, scelerisque lectus id, tincidunt justo. Nullam vulputate auctor dui et varius. Nam a tempor nibh, sed dignissim eros.</p>
<p>Vestibulum tristique tellus fermentum risus dictum imperdiet. Vivamus semper condimentum massa et condimentum. Sed accumsan erat eu dui dictum pretium. Praesent ut venenatis neque. Sed nulla elit, facilisis sit amet lorem ac, dapibus dignissim tellus. Suspendisse vehicula tempor tincidunt. Pellentesque sed pretium eros. Nullam et nibh vel turpis auctor auctor vitae at justo. Morbi fringilla dui et purus dictum, at pretium dolor accumsan. Etiam sem metus, consequat vel turpis tincidunt, tincidunt iaculis mi. Etiam auctor nunc vel augue dignissim, ac vehicula leo ornare.</p>
</article>
</main>
<!-- End main content -->
<!-- Start center content -->
<section class="content-center">
<h2 class="section-title">Related articles</h2>
<ul>
<li><a href="#"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span></a></li>
<li><a href="#"><span>Donec malesuada ipsum nec volutpat scelerisque.</span></a></li>
<li><a href="#"><span>Nullam ut justo vehicula, pretium magna ut, ultricies ligula.</span></a></li>
<li><a href="#"><span>Maecenas ac lectus quis mauris volutpat euismod.</span></a></li>
<li><a href="#"><span>Pellentesque eget turpis nec nunc euismod tempor a vitae lectus.</span></a></li>
<li><a href="#"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span></a></li>
<li><a href="#"><span>Donec malesuada ipsum nec volutpat scelerisque.</span></a></li>
<li><a href="#"><span>Nullam ut justo vehicula, pretium magna ut, ultricies ligula.</span></a></li>
<li><a href="#"><span>Maecenas ac lectus quis mauris volutpat euismod.</span></a></li>
<li><a href="#"><span>Pellentesque eget turpis nec nunc euismod tempor a vitae lectus.</span></a></li>
</ul>
<a href="#" class="read-more">View all</a>
</section>
<!-- End center content -->
<!-- Start right side content -->
<section class="content-right">
<h2 class="section-title">Featured articles</h2>
<article class=teaser-list>
<h3 class="featured-article-title">Lorem ipsum dolor sit amet, consectetur</h3>
<p>Nullam viverra odio quis suscipit suscipit. Fusce faucibus sapien sed tellus sodales, id ultrices augue imperdiet. Proin nibh erat, imperdiet at nunc non, sollicitudin tincidunt nunc. Sed sollicitudin dui a neque lobortis volutpat. Donec interdum molestie…</p>
<a href="#" class="read-more">Read more</a>
</article>
<article class=teaser-list>
<h3 class="featured-article-title">Lorem ipsum dolor sit amet, consectetur</h3>
<p>Nullam viverra odio quis suscipit suscipit. Fusce faucibus sapien sed tellus sodales, id ultrices augue imperdiet. Proin nibh erat, imperdiet at nunc non, sollicitudin tincidunt nunc. Sed sollicitudin dui a neque lobortis volutpat. Donec interdum molestie…</p>
<a href="#" class="read-more">Read more</a>
</article>
</section>
<!-- End right side content -->
</div>
<!-- End content wrapper -->
<footer>
<p>©2014 Zivtech</p>
</footer>
</div>
</body>
</html>