-
Notifications
You must be signed in to change notification settings - Fork 2
/
element.html
251 lines (242 loc) · 13 KB
/
element.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
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="assets/font-awesome/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css?family=Lora:400i" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Poppins:400,600" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Crimson+Text" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
<script type="text/javascript" src="assets/js/script.js" ></script>
<title>WOW - Element</title>
</head>
<body>
<!-- div used to make the body blur -->
<div class="overlay" id="overlay" onclick="closeNav()"></div>
<section class="element-full">
<section class="head-bar">
<div class="container">
<div class="row">
<div class="col-lg-6 col-xs-6 col-sm-6 col-md-6">
<a href="index.html"><img class="img-responsive" src="assets/img/logo.png"></a>
</div>
<div class="col-lg-6 col-xs-6 col-sm-6 col-md-6 text-right">
<div id="mySidenav" class="sidenav text-center">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a><br>
<a href="index.html">Home</a><hr>
<a href="generic.html">Generic</a><hr>
<a href="element.html">Element</a>
</div>
<div class="main" id="main">
<a href="#" onclick="openNav()">MENU ☰</a>
</div>
</div>
</div>
<hr>
</div>
</section>
<section class="element-page">
<div class="container">
<h2 class="text-center">Element</h2>
<hr class="hr-mid">
<section class="Element-heading">
<h1>Heading 1 With Paragraph</h1>
<p class="Element-heading-para font-2">
Lorem Ipsum available, but the majority have suffered This alteration in some form, by injected is a humour, or randomised words which don`t look even sligh is made believable. If to use and yammi passage of Lorem Ipsum, you need to be sure there isn`t by pioneer designer anything embarrassing hidden in the middle of text.
</p>
</section>
<section class="Element-heading">
<h2>Heading 2 With Paragraph</h2>
<p class="Element-heading-para font-2">
Lorem Ipsum available, but the majority have suffered This alteration in some form, by injected is a humour, or randomised words which don`t look even sligh is made believable. If to use and yammi passage of Lorem Ipsum, you need to be sure there isn`t by pioneer designer anything embarrassing hidden in the middle of text.
</p>
</section>
<section class="Element-heading">
<h3>Heading 3 With Paragraph</h3>
<p class="Element-heading-para font-2">
Lorem Ipsum available, but the majority have suffered This alteration in some form, by injected is a humour, or randomised words which don`t look even sligh is made believable. If to use and yammi passage of Lorem Ipsum, you need to be sure there isn`t by pioneer designer anything embarrassing hidden in the middle of text.
</p>
</section>
<section class="Element-heading">
<h3>Blockquote</h3>
<div class="row">
<div class="col-xs-12 col-lg-12 col-sm-12 col-md-12 blockquote-row">
<div class="col-xs-12 col-lg-12 col-sm-12 col-md-12 blockquote-side">
<p class="font-1">
Injected humour, or randomised words which don`t look even sligh is made
believable If to use and passage of Lorem Ipsum.
</p>
</div>
</div>
</section>
<section class="Element-heading">
<h3>Social icon</h3>
<section class="social E-social">
<ul>
<li><a href="#" class="fa fa-pinterest fa-2x" aria-hidden="true"></a></li>
<li><a href="#" class="fa fa-twitter fa-2x" aria-hidden="true"></a></li>
<li><a href="#" class="fa fa-linkedin fa-2x" aria-hidden="true"></a></li>
<li><a href="#" class="fa fa-stumbleupon fa-2x" aria-hidden="true"></a></li>
</ul>
</section>
</section>
<section class="Element-heading">
<h3>Call for action</h3>
<div class="row btn-line">
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-11">
<a class="btn btn-default call-btn-1" href="#">SPECIAL</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
<a class="btn btn-default call-btn-2" href="#">FIT</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
<a class="btn btn-default call-btn-2" href="#">FIT</a>
</div>
</div>
<div class="row btn-line">
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-11">
<a class="btn btn-default call-btn-1" href="#">DEFAULT</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
<a class="btn btn-default call-btn-3" href="#">FIT+SMALL</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
<a class="btn btn-default call-btn-3" href="#">FIT+SMALL</a>
</div>
</div>
</section>
<section class="form-section">
<h3>Form</h3>
<form>
<fieldset>
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<input type="text" name="name" placeholder="Name">
</div>
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<input type="text" name="email" placeholder="Email">
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<select id="select">
<option>-Select a catagory</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<textarea rows="14" id="comment" placeholder="Message" ></textarea>
</div>
</div>
<button type="submit" class="btn btn-default">Send massage</button>
<button type="submit" class="btn btn-default">Cancel</button>
</fieldset>
</form>
</section>
<section class="E-image">
<h3>Image</h3>
<img class="img-generic img-responsive" src="assets/img/5.jpg">
</section>
<div class="row why-div">
<div class="text-center why-pad">
<h2>Why wow</h2>
</div>
<hr class="hr-mid">
<div class="sub-text text-center">
<p class="font-1">
Sed varius suspendisse dictum leo ipsum amet pellentesque
fusce ac hendrerit consectetur tempor lorem ipsum
</p>
</div>
</div>
<div class="row">
<div class="col-lg-9 col-sm-12 col-md-9 col-xs-12">
<div class="holder-para">
<h3>Comfortable stap holder</h3>
<hr class="hr-short">
<p class="font-2">
The path of the righteous man is beset on all sides by the iniquities of the selfish and the tyranny of evil men. Blessed
is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother’s keeper and the finder of lost children. And I will strike down upon thee with great vengeance and furious anger those who would attempt to poison and destroy My brothers. And you will know My name is the Lord when I
</p>
</div>
</div>
<div class="col-lg-3 col-xs-12 col-sm-12 col-md-3">
<div class="holder-img">
<img class="round-img img-responsive center-block" src="assets/img/2.jpg">
</div>
</div>
</div>
<hr class="line-full">
<div class="row">
<div class="col-lg-9 col-xs-12 col-sm-12 col-md-9 col-md-push-3">
<div class="holder-para">
<h3>Tracking with controler</h3>
<hr class="hr-short">
<p class="font-2">
The path of the righteous man is beset on all sides by the iniquities of the selfish and the tyranny of evil men. Blessed
is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother’s keeper and the finder of lost children. And I will strike down upon thee with great vengeance and furious anger those who would attempt to poison and destroy My brothers. And you will know My name is the Lord when I
</p>
</div>
</div>
<div class="col-lg-3 col-xs-12 col-sm-12 col-md-3 col-md-pull-9">
<div class="holder-img">
<img class="round-img img-responsive center-block" src="assets/img/3.jpg">
</div>
</div>
</div>
<hr class="line-full">
<div class="row">
<div class="col-lg-9 col-xs-12 col-sm-12 col-md-9">
<div class="holder-para">
<h3>Foam cushing</h3>
<hr class="hr-short">
<p class="font-2">
The path of the righteous man is beset on all sides by the iniquities of the selfish and the tyranny of evil men. Blessed
is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother’s keeper and the finder of lost children. And I will strike down upon thee with great vengeance and furious anger those who would attempt to poison and destroy My brothers. And you will know My name is the Lord when I
</p>
</div>
</div>
<div class="col-lg-3 col-xs-12 col-sm-12 col-md-3">
<div class="holder-img">
<img class="round-img img-responsive center-block" src="assets/img/2.jpg">
</div>
</div>
</div>
<hr class="line-full">
</section>
<section class="social">
<ul>
<li><a href="#" class="fa fa-pinterest fa-2x" aria-hidden="true"></a></li>
<li><a href="#" class="fa fa-twitter fa-2x" aria-hidden="true"></a></li>
<li><a href="#" class="fa fa-linkedin fa-2x" aria-hidden="true"></a></li>
<li><a href="#" class="fa fa-stumbleupon fa-2x" aria-hidden="true"></a></li>
</ul>
</section>
<section class="footer">
<div class="container">
<div class="row">
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
<div class="footer-p1">
<p class="font-2">Copy right 2016 by wow technology</p>
</div>
</div>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
<img class="img-responsive foot-img" src="assets/img/footer-logo.png">
</div>
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
<div class="footer-p2" >
<p class="font-2">Made with <i class="fa fa-heart" aria-hidden="true" ></i> by <a href="https://themewagon.com/themes/" target="_blank">themewagon</a></p>
</div>
</div>
</div>
</div>
</section>
</section>
</body>
</html>