-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsingle2.html
430 lines (398 loc) · 30.8 KB
/
single2.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
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
<html class="wp">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="assets/css/wp-block.css" />
<link rel="stylesheet" type="text/css" href="assets/css/style.css" />
<link rel='stylesheet' id='tavern-font-css' href='https://fonts.googleapis.com/css?family=Frank+Ruhl+Libre:400,400i,700|Lora:400,400i,700,700i|Lato:400,400i,700,700i&subset=latin,latin-ext' type='text/css' media='all' />
<link rel='stylesheet' id='theme-icons-css' href='https://use.fontawesome.com/releases/v5.8.2/css/all.css?ver=5.3.2' type='text/css' media='all' />
<style>
html{
/* --layout-content:[sidebar] 300px [content] 1fr; */
}
</style>
</head>
<body class="bodyclass singular single">
<div class="theme-layout">
<section class="theme-header container">
<header class="header-wrap">
<section class="header-wrap__logo">
<h2>
<a href="#" class="header-wrap__logo--text">Love of writing</a>
<span class="header-wrap__logo--separate"></span>
<span class="header-wrap__logo--description">Description website</span>
</h2>
</section>
<section class="header-wrap__menu">
<input type="checkbox" id="toggle" class="nav-bar__toggle">
<label for="toggle" class="theme-menu__togger">
<span></span>
<span></span>
<span></span>
</label>
<ul class="theme-menu">
<li class="menu-item"><a href="#">About</a></li>
<li class="menu-item"><a href="#">Archives</a></li>
<li class="menu-item"><a href="#">Comment<span class="menu-item__icon"></span></a></li>
<li class="menu-item menu-item-has-children">
<input type="checkbox" id="toggle-sub-1" class="nav-bar__toggle">
<label for="toggle-sub-1" class="theme-menu__togger--subitem"></label>
<a class="" href="#">Contact<span class="menu-item__icon"></span></a>
<ul class="sub-menu">
<li class="menu-item"><a href="#">Menu #6</a></li>
<li class="menu-item"><a href="#">Menu #7</a></li>
<li class="menu-item menu-item-has-children">
<input type="checkbox" id="toggle-sub-2" class="nav-bar__toggle">
<label for="toggle-sub-2" class="theme-menu__togger--subitem"></label>
<a class="" href="#">Menu # 8<span class="menu-item__icon"></span></a>
<ul class="sub-menu">
<li class="menu-item"><a href="#">Menu #9</a></li>
<li class="menu-item"><a href="#">Menu #10</a></li>
<li class="menu-item"><a href="#">Menu #11</a></li>
<li class="menu-item"><a href="#">Menu #12</a></li>
<li class="menu-item"><a href="#">Menu #13</a></li>
</ul>
</li>
</ul>
</li>
<li class="menu-item menu-item-has-children menu-item-mega">
<input type="checkbox" id="toggle-sub-3" class="nav-bar__toggle">
<label for="toggle-sub-3" class="theme-menu__togger--subitem"></label>
<a href="#">Policy<span class="menu-item__icon"></span></a>
<div class="sub-menu container-mega"></div>
</li>
</ul>
</section>
</header>
<section class="breadcrumbs-wrap">
<ol id="breadcrumbs" class="breadcrumbs">
<li class="item-home item-breadcrumbs">
<a class="bread-link bread-home" href="#" title="Homepage"> <i class="fas fa-home"></i> </a>
</li>
<li class="item-cat item-breadcrumbs"><a href="#">Bush</a></li>
<li class="item-current item-breadcrumbs item-678"><span class="bread-current bread-678" title="CNE dice que tiene listo el dinero para las campañas presidenciales Febrero 2021…">CNE dice que tiene listo el dinero para las campañas presidenciales Febrero 2021…</span></li>
</ol>
</section>
</section>
<section class="theme-content container">
<div class="content">
<header class="entry-header">
<h1><a href="#">Image Alignment</a></h1>
</header>
<section class="entry-meta">
<span class="entry-meta__autor">
<a href="#">Lenin Zapata</a>
</span>
<span class="entry-meta__separate"></span>
<time class="entry-meta__date">February 11, 2020</time>
<span class="entry-meta__separate"></span>
<span class="entry-meta__comment">
<a href="#">3 Comments</a>
</span>
</section>
<figure class="entry-featured-image">
<img src="assets/images/1.jpg" />
<figcaption class="wp-caption-text">Image Credit: liushuquan - Pixabay.com / CC0 Public Domain
</figcaption>
</figure>
<div class="entry-content">
<p>Welcome to image alignment! The best way to demonstrate the ebb and flow of the various image positioning options is to nestle them snuggly among an ocean of words. Grab a paddle and let’s get started.</p>
<p>On the topic of alignment, it should be noted that users can choose from the options of <em>None</em>, <em>Left</em>, <em>Right, </em>and <em>Center</em>. In addition, they also get the options of <em>Thumbnail</em>, <em>Medium</em>, <em>Large</em> & <em>Fullsize</em>.</p>
<p style="text-align: center;"><img class="size-full wp-image-906 aligncenter" title="Image Alignment 580x300" alt="Image Alignment 580x300" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-580x300-1.jpg" width="580" height="300" srcset="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-580x300-1.jpg 580w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-580x300-1-300x155.jpg 300w" sizes="(max-width: 580px) 100vw, 580px"></p>
<p>The image above happens to be <em><strong>centered</strong></em>.</p>
<p><strong><img class="size-full wp-image-904 alignleft" title="Image Alignment 150x150" alt="Image Alignment 150x150" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-150x150-1.jpg" width="150" height="150"></strong>The rest of this paragraph is filler for the sake of seeing the text wrap around the 150×150 image, which is <em><strong>left aligned</strong></em>. <strong></strong></p>
<p>As you can see the should be some space above, below, and to the right of the image. The text should not be creeping on the image. Creeping is just not right. Images need breathing room too. Let them speak like you words. Let them do their jobs without any hassle from the text. In about one more sentence here, we’ll see that the text moves from the right of the image down below the image in seamless transition. Again, letting the do it’s thang. Mission accomplished!</p>
<p>And now for a <em><strong>massively large image</strong></em>. It also has <em><strong>no alignment</strong></em>.</p>
<p><img class="alignnone wp-image-907" title="Image Alignment 1200x400" alt="Image Alignment 1200x400" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1.jpg" width="1200" height="400" srcset="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1.jpg 1200w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1-300x100.jpg 300w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1-1024x341.jpg 1024w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1-768x256.jpg 768w" sizes="(max-width: 1200px) 100vw, 1200px"></p>
<p>The image above, though 1200px wide, should not overflow the content area. It should remain contained with no visible disruption to the flow of content.</p>
<p><img class="size-full wp-image-905 alignright" title="Image Alignment 300x200" alt="Image Alignment 300x200" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-300x200-1.jpg" width="300" height="200"></p>
<p>And now we’re going to shift things to the <em><strong>right align</strong></em>. Again, there should be plenty of room above, below, and to the left of the image. Just look at him there… Hey guy! Way to rock that right side. I don’t care what the left aligned image says, you look great. Don’t let anyone else tell you differently.</p>
<p>In just a bit here, you should see the text start to wrap below the right aligned image and settle in nicely. There should still be plenty of room and everything should be sitting pretty. Yeah… Just like that. It never felt so good to be right.</p>
<p>And just when you thought we were done, we’re going to do them all over again with captions!</p>
<div id="attachment_906" style="width: 590px" class="wp-caption aligncenter"><img aria-describedby="caption-attachment-906" class="size-full wp-image-906 " title="Image Alignment 580x300" alt="Image Alignment 580x300" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-580x300-1.jpg" width="580" height="300" srcset="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-580x300-1.jpg 580w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-580x300-1-300x155.jpg 300w" sizes="(max-width: 580px) 100vw, 580px"><p></p>
<p id="caption-attachment-906" class="wp-caption-text">Look at 580×300 getting some <a title="Image Settings" href="http://en.support.wordpress.com/images/image-settings/">caption</a> love.</p>
</div>
<p>The image above happens to be <em><strong>centered</strong></em>. The caption also has a link in it, just to see if it does anything funky.</p>
<div id="attachment_904" style="width: 160px" class="wp-caption alignleft"><img aria-describedby="caption-attachment-904" class="size-full wp-image-904 " title="Image Alignment 150x150" alt="Image Alignment 150x150" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-150x150-1.jpg" width="150" height="150"><p></p>
<p id="caption-attachment-904" class="wp-caption-text">Itty-bitty caption.</p>
</div>
<p><strong></strong>The rest of this paragraph is filler for the sake of seeing the text wrap around the 150×150 image, which is <em><strong>left aligned</strong></em>. <strong></strong></p>
<p>As you can see the should be some space above, below, and to the right of the image. The text should not be creeping on the image. Creeping is just not right. Images need breathing room too. Let them speak like you words. Let them do their jobs without any hassle from the text. In about one more sentence here, we’ll see that the text moves from the right of the image down below the image in seamless transition. Again, letting the do it’s thang. Mission accomplished!</p>
<p>And now for a <em><strong>massively large image</strong></em>. It also has <em><strong>no alignment</strong></em>.</p>
<div id="attachment_907" style="width: 1210px" class="wp-caption alignnone"><img aria-describedby="caption-attachment-907" class=" wp-image-907" title="Image Alignment 1200x400" alt="Image Alignment 1200x400" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1.jpg" width="1200" height="400" srcset="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1.jpg 1200w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1-300x100.jpg 300w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1-1024x341.jpg 1024w, http://localhost/theme/wp-content/uploads/2013/03/image-alignment-1200x4002-1-768x256.jpg 768w" sizes="(max-width: 1200px) 100vw, 1200px"><p></p>
<p id="caption-attachment-907" class="wp-caption-text">Massive image comment for your eyeballs.</p>
</div>
<p>The image above, though 1200px wide, should not overflow the content area. It should remain contained with no visible disruption to the flow of content.</p>
<div id="attachment_905" style="width: 310px" class="wp-caption alignright"><img aria-describedby="caption-attachment-905" class="size-full wp-image-905 " title="Image Alignment 300x200" alt="Image Alignment 300x200" src="http://localhost/theme/wp-content/uploads/2013/03/image-alignment-300x200-1.jpg" width="300" height="200"><p></p>
<p id="caption-attachment-905" class="wp-caption-text">Feels good to be right all the time.</p>
</div>
<p>And now we’re going to shift things to the <em><strong>right align</strong></em>. Again, there should be plenty of room above, below, and to the left of the image. Just look at him there… Hey guy! Way to rock that right side. I don’t care what the left aligned image says, you look great. Don’t let anyone else tell you differently.</p>
<p>In just a bit here, you should see the text start to wrap below the right aligned image and settle in nicely. There should still be plenty of room and everything should be sitting pretty. Yeah… Just like that. It never felt so good to be right.</p>
<p>And that’s a wrap, yo! You survived the tumultuous waters of alignment. Image alignment achievement unlocked!</p>
</div>
<p class="post-nav-links">Pages:
<span class="post-page-numbers current" aria-current="page">1</span>
<a href="#" class="post-page-numbers">2</a>
<a href="#" class="post-page-numbers">3</a>
<a href="#" class="post-page-numbers">4</a>
</p>
<div class="author-box">
<figure class="author-box__avatar"><img src="assets/images/3.jpg" /></figure>
<section class="author-box__meta">
<div class="author-box__meta--header"><a href="#">Lenin Zapata</a></div>
<div class="author-box__meta--bio">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Minus placeat voluptate quam veniam fuga temporibus hic tempore. Dolorum earum animi, nulla, dignis.</a></div>
<div class="author-box__meta--contact"><a href="#">Facebook</a> | <a href="#">Twitter</a> | <a href="#">Leking</a></div>
</section>
</div>
<nav class="posts-nav">
<div class="post-nav post-nav__prev">
<a href="#">
<img width="80" height="60" src="assets/images/1.jpg" />
<span class="post-nav__prev--header">Previous</span>
<p class="post-nav__prev--title">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Labore deserunt, voluptatibus sed aperiam velit reprehenderit ad, consequatur quod vero quaerat explicabo ullam? Vel atque sit culpa consequuntur eveniet sequi quisquam!</p>
</a>
</div>
<div class="post-nav post-nav__next">
<a href="#">
<img width="80" height="60" src="assets/images/2.jpg" />
<span class="post-nav__prev--header">Next</span>
<p class="post-nav__prev--title">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Labore deserunt, voluptatibus sed aperiam velit reprehenderit ad, consequatur quod vero quaerat explicabo ullam? Vel atque sit culpa consequuntur eveniet sequi quisquam!</p>
</a>
</div>
</nav>
<div id="comments" class="theme-comments">
<h2 class="comment-title">BE THE FIRST TO COMMENT</h2>
<ol class="commentlist theme-comment-list theme-comment-with-paginate">
<li id="comment-1" class="comment even thread-even depth-1 theme-comment-item">
<article id="div-comment-1" class="theme-comment-body">
<section class="theme-comment-data theme-clearfix">
<figure class="theme-comment-gravatar">
<img alt="" src="assets/images/3.jpg" srcset="" class="avatar avatar-80 photo" height="80" width="80">
</figure>
<div class="theme-metas theme-comment-metas">
<div class="vcard author theme-comment-meta-author">
<span class="fn"><a href="http://sontopia.it" rel="external nofollow ugc" class="url">Tracey Beard</a></span>
</div>
<div class="theme-comment-meta-date">
<a class="" href="http://localhost/np/2019/12/10/hola-como-estas/#comment-2">December 11, 2019 at 9:18 am</a>
</div>
<div class="theme-comment-meta-links">
<a rel="nofollow" class="comment-reply-link" href="http://localhost/np/2019/12/10/hola-como-estas/?replytocom=2#respond" data-commentid="2" data-postid="7475" data-belowelement="comment-2" data-respondelement="respond" aria-label="Reply to Tracey Beard">Reply</a>
<span class="theme-comment-meta-links--separate"></span>
<a class="comment-edit-link" href="http://localhost/np/wp-admin/comment.php?action=editcomment&c=2">Edit</a>
</div>
</div>
</section>
<div class="theme-comment-content">
<p>Der quorum Repentina Quod de Day Facilisisat! Lacus minulla et, saltu get accusatoris ra.<br>Germanitate, eminuit infudere divites, aliquip, Nunccurabitur potius aptent: Vesperi scrutanda stirpis extorres mis porta de nisi Odio; Modum pellentesque Ti querelas stationes perpetratum ing. Tin aetatis platea Regina lobortisetiam sed similia ber.</p><p>Telluspraesent temporis, maritus adultae committerentur fusce ning contactus? Necati nostrud scrutanda Li, tions ac ultimo clam pseudothyrum cuncta: Palatii ac, novo audire placentia extorres phasellus.</p>
</div>
</article>
<ul class="children">
<li id="comment-2" class="comment even thread-even depth-1 theme-comment-item">
<article id="div-comment-1" class="theme-comment-body">
<section class="theme-comment-data theme-clearfix">
<figure class="theme-comment-gravatar">
<img alt="" src="assets/images/3.jpg" srcset="" class="avatar avatar-80 photo" height="80" width="80">
</figure>
<div class="theme-metas theme-comment-metas">
<div class="vcard author theme-comment-meta-author">
<span class="fn"><a href="http://sontopia.it" rel="external nofollow ugc" class="url">Tracey Beard</a></span>
</div>
<div class="theme-comment-meta-date">
<a class="" href="http://localhost/np/2019/12/10/hola-como-estas/#comment-2">December 11, 2019 at 9:18 am</a>
</div>
<div class="theme-comment-meta-links">
<a rel="nofollow" class="comment-reply-link" href="http://localhost/np/2019/12/10/hola-como-estas/?replytocom=2#respond" data-commentid="2" data-postid="7475" data-belowelement="comment-2" data-respondelement="respond" aria-label="Reply to Tracey Beard">Reply</a>
<span class="theme-comment-meta-links--separate"></span>
<a class="comment-edit-link" href="http://localhost/np/wp-admin/comment.php?action=editcomment&c=2">Edit</a>
</div>
</div>
</section>
<div class="theme-comment-content">
<p>Der quorum Repentina Quod de Day Facilisisat! Lacus minulla et, saltu get accusatoris ra.</p><p>Germanitate, eminuit infudere divites, aliquip, Nunccurabitur potius aptent: Vesperi scrutanda stirpis extorres mis porta de nisi Odio; Modum pellentesque Ti querelas stationes perpetratum ing. Tin aetatis platea Regina lobortisetiam sed similia ber.</p><p>Telluspraesent temporis, maritus adultae committerentur fusce ning contactus? Necati nostrud scrutanda Li, tions ac ultimo clam pseudothyrum cuncta: Palatii ac, novo audire placentia extorres phasellus.</p>
</div>
</article>
</li>
</ul>
</li>
<li id="comment-1" class="comment even thread-even depth-1 theme-comment-item">
<article id="div-comment-1" class="theme-comment-body">
<section class="theme-comment-data theme-clearfix">
<figure class="theme-comment-gravatar">
<img alt="" src="assets/images/3.jpg" srcset="" class="avatar avatar-80 photo" height="80" width="80">
</figure>
<div class="theme-metas theme-comment-metas">
<div class="vcard author theme-comment-meta-author">
<span class="fn"><a href="http://sontopia.it" rel="external nofollow ugc" class="url">Tracey Beard</a></span>
</div>
<div class="theme-comment-meta-date">
<a class="" href="http://localhost/np/2019/12/10/hola-como-estas/#comment-2">December 11, 2019 at 9:18 am</a>
</div>
<div class="theme-comment-meta-links">
<a rel="nofollow" class="comment-reply-link" href="http://localhost/np/2019/12/10/hola-como-estas/?replytocom=2#respond" data-commentid="2" data-postid="7475" data-belowelement="comment-2" data-respondelement="respond" aria-label="Reply to Tracey Beard">Reply</a>
<span class="theme-comment-meta-links--separate"></span>
<a class="comment-edit-link" href="http://localhost/np/wp-admin/comment.php?action=editcomment&c=2">Edit</a>
</div>
</div>
</section>
<div class="theme-comment-content">
<p>Der quorum Repentina Quod de Day Facilisisat! Lacus minulla et, saltu get accusatoris ra.<br>Germanitate, eminuit infudere divites, aliquip, Nunccurabitur potius aptent: Vesperi scrutanda stirpis extorres mis porta de nisi Odio; Modum pellentesque Ti querelas stationes perpetratum ing. Tin aetatis platea Regina lobortisetiam sed similia ber.</p><p>Telluspraesent temporis, maritus adultae committerentur fusce ning contactus? Necati nostrud scrutanda Li, tions ac ultimo clam pseudothyrum cuncta: Palatii ac, novo audire placentia extorres phasellus.</p>
</div>
</article>
<ul class="children">
<li id="comment-2" class="comment even thread-even depth-1 theme-comment-item">
<article id="div-comment-1" class="theme-comment-body">
<section class="theme-comment-data theme-clearfix">
<figure class="theme-comment-gravatar">
<img alt="" src="assets/images/3.jpg" srcset="" class="avatar avatar-80 photo" height="80" width="80">
</figure>
<div class="theme-metas theme-comment-metas">
<div class="vcard author theme-comment-meta-author">
<span class="fn"><a href="http://sontopia.it" rel="external nofollow ugc" class="url">Tracey Beard</a></span>
</div>
<div class="theme-comment-meta-date">
<a class="" href="http://localhost/np/2019/12/10/hola-como-estas/#comment-2">December 11, 2019 at 9:18 am</a>
</div>
<div class="theme-comment-meta-links">
<a rel="nofollow" class="comment-reply-link" href="http://localhost/np/2019/12/10/hola-como-estas/?replytocom=2#respond" data-commentid="2" data-postid="7475" data-belowelement="comment-2" data-respondelement="respond" aria-label="Reply to Tracey Beard">Reply</a>
<span class="theme-comment-meta-links--separate"></span>
<a class="comment-edit-link" href="http://localhost/np/wp-admin/comment.php?action=editcomment&c=2">Edit</a>
</div>
</div>
</section>
<div class="theme-comment-content">
<p>Der quorum Repentina Quod de Day Facilisisat! Lacus minulla et, saltu get accusatoris ra.</p><p>Germanitate, eminuit infudere divites, aliquip, Nunccurabitur potius aptent: Vesperi scrutanda stirpis extorres mis porta de nisi Odio; Modum pellentesque Ti querelas stationes perpetratum ing. Tin aetatis platea Regina lobortisetiam sed similia ber.</p><p>Telluspraesent temporis, maritus adultae committerentur fusce ning contactus? Necati nostrud scrutanda Li, tions ac ultimo clam pseudothyrum cuncta: Palatii ac, novo audire placentia extorres phasellus.</p>
</div>
</article>
</li>
</ul>
</li>
</ol>
<div class="comments-paginate">
<a class="prev page-numbers" href="#">« Previous</a>
<a class="page-numbers" href="#">1</a>
<a class="page-numbers" href="#">2</a>
<a class="page-numbers" href="#">3</a>
<span aria-current="page" class="page-numbers current">4</span>
</div>
<div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">Leave a Reply</h3>
<form class="comment-respond__form" id="commentform" method="post">
<p class="comment-notes">Your email address will not be published.</p>
<p class="comment-form-comment">
<label for="comment">Comment</label><br />
<textarea id="comment" name="comment" cols="45" rows="5" aria-required="true"></textarea>
</p>
<p class="comment-form-author">
<label for="author">Name </label>
<span class="required">*</span><br>
<input id="author" name="author" type="text" value="" size="30" aria-required="true" style="">
</p>
<p class="comment-form-email">
<label for="email">Email </label>
<span class="required">*</span><br>
<input id="email" name="email" type="text" value="" size="30" aria-required="true">
</p>
<p class="comment-form-url">
<label for="url">Website</label><br>
<input id="url" name="url" type="text" value="" size="30">
</p>
<p class="form-submit">
<input name="submit" type="submit" id="submit" class="submit" value="Post Comment">
</p>
</form>
</div>
</div>
</div>
<aside class="sidebar">
<div class="widget">
<h3 class="widget-title">Title Widget</h3>
<div class="widget-content">
content widget
</div>
</div>
<div class="widget">
<h3 class="widget-title">Title Widget</h3>
<div class="widget-content">
content widget
</div>
</div>
</aside>
</section>
<footer class="theme-footer container">
<div class="footer__sidebar footer-3">
<div class="widget">
<h3 class="widget__title">Title Widget</h3>
<div class="widget-content">
<ul>
<li>
<a href="#">Automatic Theme</a>
</li>
<li>
<a href="#">Gutenberg 7.6 Includes</a>
</li>
<li>
<a href="#" aria-current="page">Elementor ty</a>
</li>
<li>
<a href="#">On MAGA Cas</a>
</li>
<li>
<a href="#">After the Ac Year</a>
</li>
<li>
<a href="#">Goodbyer Now</a>
</li>
<li>
<a href="#">Editorsdd-On</a>
</li>
</ul>
</div>
</div>
<div class="widget">
<h3 class="widget-title">Title Widget</h3>
<div class="widget-content">
content widget
</div>
</div>
<div class="widget">
<h3 class="widget-title">Title Widget</h3>
<div class="widget-content">
content widget
</div>
</div>
</div>
<div class="footer__sidebar footer-1">
<div>
Copyright
</div>
</div>
</footer>
<footer class="theme-footer-bar container">
<ul class="menu__items list-none m-0 p-0">
<li class="menu__item"><a href="https://wptavern.com/" class="">Home</a></li>
<li class="menu__item"><a href="https://wptavern.com/archives" class="">Archives</a></li>
<li class="menu__item"><a href="https://wptavern.com/contact-me" class="">Write For Us</a></li>
<li class="menu__item"><a href="https://wptavern.com/contact-me/ask-the-bartender" class="">Ask the Bartender</a></li>
</ul>
<p class="app-footer__credit my-4 text-center">Proudly powered by WordPress.</p>
<ul class="menu__items list-none m-0 p-0">
<li id="menu-item-13447" class="menu__item inline mx-2">
<a href="http://twitter.com/wptavern" class="menu__link inline-flex">
<span class="">Twitter</span></a>
</li>
<li id="menu-item-13448" class="menu__item inline mx-2">
<a href="http://facebook.com/wptavern" class="menu__link inline-flex">
<span class="">Facebook</span></a>
</li>
<li id="menu-item-13449" class="menu__item inline mx-2">
<a href="https://www.instagram.com/wptav/" class="menu__link inline-flex">
<span class="">Instagram</span></a>
</li>
</ul>
</footer>
</div>
<div class="theme-button-back-to-top"></div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script type='text/javascript' src='/assets/js/js.min.js'></script>
</body>
</html>