-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·218 lines (210 loc) · 8.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
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
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="style.css">
<title>Document</title>
</head>
<body>
<div class="container">
<div class="intro">
<div class="content">
<h1>Site header</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas quisquam illo quas voluptate ab maxime nostrum ipsum nulla omnis voluptatem numquam, labore nam dolorum debitis impedit obcaecati iusto sint! Quasi.</p>
</div>
</div>
<div class="portfolio">
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic01.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 1 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magnam sapiente doloremque repellat voluptate ex. Iure officia necessitatibus tenetur, quidem excepturi voluptatibus praesentium laboriosam perspiciatis suscipit eveniet odit distinctio incidunt culpa.</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic01.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 1 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magnam sapiente doloremque repellat voluptate ex. Iure officia necessitatibus tenetur, quidem excepturi voluptatibus praesentium laboriosam perspiciatis suscipit eveniet odit distinctio incidunt culpa.</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic02.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 2 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci ipsum facere labore blanditiis doloremque hic ut, nulla incidunt, nemo veritatis esse. Maxime quidem voluptate sunt hic, obcaecati nisi porro vitae?</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic03.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 3 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi odit, blanditiis a animi ad dolorem porro possimus vero ipsum dicta! Fugiat adipisci repudiandae animi quae, necessitatibus harum itaque, repellat sapiente.</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic04.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 4 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis temporibus perferendis laudantium explicabo repudiandae neque voluptatem nemo dignissimos eaque error animi accusamus cupiditate, sunt debitis. Laborum quibusdam debitis molestiae nobis!</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic05.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 5 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit itaque harum quo! Quaerat, dignissimos provident amet. Totam fugit atque eveniet accusantium corrupti cupiditate quae ipsum aliquam impedit, id dicta non.</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
<div class="element">
<a href="#"
target="_blank"
class="image"
style="background-image: url('img/pic06.png'); background-position: center center">
</a>
<div class="content">
<h2>Site 6 name</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In, id asperiores quaerat quisquam expedita non. Repellat accusantium est, culpa perspiciatis, voluptate consequatur aperiam aliquid magni corrupti! Repellendus alias, voluptatibus numquam.</p>
<ul>
<li>
<a class="button" href="#" target="_blank">Open site</a>
</li>
</ul>
</div>
</div>
</div>
<div class="services">
<div class="content">
<h2>Services</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Unde, eveniet.</p>
<div class="features">
<section>
<span class="icon fa-code fa"></span>
<h3>Feature header</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus veritatis commodi, dolorem pariatur accusamus, omnis minus libero beatae sit dolorum quaerat non repellendus optio excepturi, eum rerum quas. Quisquam, mollitia!
</p>
</section>
<section>
<span class="icon fa-lock fa"></span>
<h3>Feature header</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque nam recusandae, illo ipsam, pariatur eius, cupiditate voluptas voluptatem alias molestiae aut enim. Pariatur dolore dolores debitis reprehenderit veritatis laborum minima!
</p>
</section>
<section>
<span class="icon fa-cog fa"></span>
<h3>Feature header</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate suscipit, recusandae odit quidem aut ipsa saepe ea dignissimos, quia reprehenderit, error fuga aliquam illo aspernatur minima molestiae quam, facere repellat.
</p>
</section>
<section>
<span class="icon fa-desktop fa"></span>
<h3>Feature header</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quae iure, veritatis atque quaerat temporibus voluptatem sed repellat nisi sequi, magni assumenda ex cum deserunt fuga nostrum fugiat optio facilis impedit.
</p>
</section>
<section>
<span class="icon fa-chain fa"></span>
<h3>Feature header</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem doloribus dignissimos molestias praesentium impedit explicabo quos adipisci ab, saepe, repellendus consequuntur repudiandae! Omnis modi neque in. Natus provident esse optio?
</p>
</section>
<section>
<span class="icon fa-diamond fa"></span>
<h3>Feature header</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit dolorum qui rem sed, numquam id doloremque facere suscipit ipsam harum! Sint dolor repellendus consequuntur rem nisi, ratione voluptatum, corporis cumque!
</p>
</section>
</div>
</div>
</div>
<div class="contact">
<div class="content">
<h2>Contact</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
<div>
<section>
<form>
<div class="field">
<label>Name</label>
<input type="text" class="form-control">
</div>
<div class="field">
<label>Email</label>
<input type="text" class="form-control">
</div>
<div class="field">
<label>Message</label>
<textarea rows="5" class="form-control"></textarea>
</div>
<input type="submit" value="Send message" class="button">
</form>
</section>
<section></section>
</div>
</div>
</div>
</div>
</body>
</html>