-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
149 lines (146 loc) · 9.37 KB
/
about.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<title>Jetro / About</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
</head>
<body>
<div class="wrapper">
<header>
<div class="container row">
<div class="logo left">
jet<span>ro</span>
<span class="fa fa-bars"></span>
</div>
<nav class="top-menu right">
<ul class="list-menu">
<li class="item-menu"><a href="index.html" class="link-menu">home</a></li>
<li class="item-menu active"><a href="about.html" class="link-menu">about us</a></li>
<li class="item-menu"><a href="blog.html" class="link-menu">blog</a></li>
<li class="item-menu"><a href="portfolio.html" class="link-menu">portfolio</a></li>
<li class="item-menu"><a href="contact.html" class="link-menu">contact us</a></li>
</ul>
</nav>
</div>
</header>
<!-- End header -->
<main class="content" role="main">
<div class="container">
<div class="page-title">about us</div>
<!-- End.page-title -->
<!-- Start .row -->
<div class="row">
<!-- Start .about -->
<article class="about page-content">
<h1>about us</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus, illum, consequatur! Voluptatum tempore hic nisi, culpa, quisquam distinctio numquam consectetur animi iste odit repudiandae enim? Voluptatem optio, ut dolorem sapiente beatae sunt ipsa mollitia error repudiandae. Porro quis accusamus, tempora asperiores assumenda consequuntur numquam, blanditiis adipisci laborum minima a placeat!</p>
<img class="left" src="files/thumbnails/69e23cc100.jpg" alt="some alter text">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis rem minima animi nobis nesciunt totam non vitae neque, dolor eveniet, incidunt velit voluptates sint voluptas qui! Alias error natus, nulla a quisquam tempore atque sed. Rerum, sequi in, illo et ad natus nesciunt cumque nihil laborum odio corporis numquam fugit.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae numquam beatae praesentium nostrum. Rerum inventore veniam, ex commodi quo at explicabo necessitatibus repellat in ea quae obcaecati beatae blanditiis, odio ad magnam. Ratione reprehenderit cum ex distinctio possimus, porro incidunt fugiat voluptates quasi! Nam consequatur architecto nemo necessitatibus harum quo!</p>
<p>Molestias, facere placeat voluptate vel eos porro, expedita vitae, maiores voluptatem, aspernatur harum iure necessitatibus ex laborum aut similique laudantium. Itaque totam tempore quae dignissimos, dolores dolore! In voluptatem nobis delectus eos reprehenderit, ipsa fuga ut quaerat tempore quidem vero illum quam temporibus ipsum totam error itaque excepturi, soluta amet!</p>
<p class="first-letter">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima quis non tempore excepturi minus commodi, quidem asperiores officiis, ratione saepe. Impedit explicabo beatae quis recusandae doloremque. Esse dignissimos ipsa ex tempora quasi modi magnam aperiam labore amet impedit. Natus magnam dicta nesciunt perferendis sint voluptates qui quos quisquam eius, nostrum minus incidunt eos aspernatur, voluptate odio omnis ducimus distinctio nisi error, ut repellendus laudantium itaque eaque. Exercitationem porro quis vitae!</p>
<blockquote>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa ad velit labore consequatur adipisci libero expedita cum voluptatem veniam nulla ex quod minima recusandae nesciunt quaerat nam, ipsam possimus pariatur magni nemo aliquid tempore, tenetur neque reprehenderit harum. Eaque possimus inventore totam, placeat, quidem, dolorem officia nulla assumenda sit et neque in! Itaque corporis omnis eos nesciunt, voluptate quo ut harum hic! Ipsa tempore consequatur, ipsam vitae hic consectetur! Qui, excepturi ad sint alias quo. Laborum, dolor? Rerum, corporis, consectetur.</blockquote>
<p class="col2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia cumque nulla quas, quasi, quod enim eaque reiciendis amet doloribus fugiat eos eligendi expedita voluptatibus inventore eum ad. Similique totam, voluptatibus. A temporibus ullam corporis nulla dolorem quaerat veniam voluptatum animi, quas ipsa iure nostrum voluptate veritatis, repellendus natus fuga molestiae.</p>
<p class="col2">Hic alias neque saepe magni repudiandae aliquid porro. Tempore molestias dicta nesciunt, quae nostrum fugit excepturi! Doloribus earum praesentium soluta a adipisci totam nihil dicta architecto ex non quas eius, quasi nobis commodi vero fugit ullam. Quidem harum totam quis veritatis earum assumenda, laudantium! Tempora hic, magni saepe magnam incidunt?</p>
<p class="col3">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis mollitia aliquam ullam officia placeat beatae, unde. Autem excepturi impedit odit est, consectetur, reiciendis illum quo eveniet animi pariatur error nemo temporibus id molestiae obcaecati veniam ad, quisquam. In, odit. Voluptatum ratione, error repudiandae iusto fugit assumenda corrupti eligendi eaque hic?
</p>
<p class="col3">
Dicta non aperiam id ullam doloribus, veniam mollitia culpa vitae nobis deserunt possimus sequi tempore facilis reiciendis amet accusamus molestiae quo blanditiis omnis, suscipit illo autem facere. Id, dolore? Inventore, labore. Alias culpa reiciendis eaque doloribus. Eum voluptatibus eligendi, nemo incidunt, quia natus consequatur architecto dignissimos perferendis fuga, impedit quas.
</p>
<p class="col3">
Iure voluptas odio voluptatum, repellat esse rerum tempore nostrum. At adipisci qui itaque totam ex iure, sequi dicta omnis. Esse autem dolorem iste aliquam sequi illo, nihil ratione laudantium ut provident vitae delectus quaerat numquam vero. Aperiam ducimus cupiditate voluptatum consequatur perferendis harum officia quam placeat modi nam eaque, explicabo.
</p>
</article>
<!-- End .about -->
<!-- Start .side-bar -->
<div class="side-bar">
<section id="about">
<h4 class="side-title"><strong>about</strong></h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praese nt libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elemen tum imperdiet. Duis sagittis ipsum. </p>
</section>
<section id="category">
<h4 class="side-title"><strong>categories</strong></h4>
<ul class="category-list">
<li class="category-item"><a href="#" class="category-link">item 1</a><span> (1)</span></li>
<li class="category-item"><a href="#" class="category-link">item 2</a><span> (2)</span></li>
<li class="category-item"><a href="#" class="category-link">item 3</a><span> (3)</span></li>
<li class="category-item"><a href="#" class="category-link">item 4</a><span> (4)</span></li>
<li class="category-item"><a href="#" class="category-link">item 5</a><span> (5)</span></li>
<li class="category-item"><a href="#" class="category-link">item 6</a><span> (6)</span></li>
</ul>
</section>
<section id="gallary">
<h4 class="side-title"><strong>photo gallery</strong></h4>
<ul class="gallary-list row">
<li class="gallary-item"></li>
<li class="gallary-item"></li>
<li class="gallary-item"></li>
<li class="gallary-item"></li>
<li class="gallary-item"></li>
<li class="gallary-item"></li>
<li class="gallary-item"></li>
<li class="gallary-item"></li>
</ul>
</section>
</div>
<!-- End .side-bar -->
</div>
</div>
<!-- End .container -->
</main>
<!-- End .content -->
</div>
<!-- End .wrapper -->
<footer>
<div class="container">
<div class="row">
<section class="f-about">
<h4>About Jetro</h4>
<p class="text-f-about">
Lorem ipsum dolor sit amet, malorum recteque reprehendunt ea vel. Urbanitas adolescens vim te, per at tritani aperiri. Adhuc invenire convenire his ea. Id mei vitae denique, in eam commodo veritus disputando.
</p>
<p class="text-f-about">Pro et erant delicata, eu vim essent imperdiet accommodare, dictas deseruisse ius an. Solet everti definitionem id ius, sonet oporteat cu vim.</p>
</section>
<section class="f-twitter">
<h4>Twitter Widget</h4>
<ul id="widget-twitter">
<li class="widget-item">
<p>
<a href="#">@pixelmater </a>
What an awesome design with great functionality :)
</p>
<span class="dt">about 1 hour ago</span>
</li>
<li class="widget-item">
<p>
<a href="#">@designdude</a>
What an awesome design with great functionality :)
</p>
<span class="dt">about 2 hour ago</span>
</li>
<li class="widget-item">
Follow <a href="mailto:[email protected]">@bestpsdfreebies</a>
</li>
</ul>
</section>
<section class="f-contact">
<h4>Contact Us</h4>
<address class="contact-text">
Lorem ipsum dolor sit amet, malorum recteque reprehendunt ea vel. Urbanitas adolescens vim te, per at tritani aperiri.
<ul class="link-addr">
<li class="addr-item"><a href="mailto:[email protected]">[email protected]</a></li>
<li class="addr-item"><a href="tel:222-222-222">1.222.333.4444</a></li>
</ul>
</address>
</section>
</div>
</div>
</footer>
<script src="js/jquery.2.2.4.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>