Mercurial > libervia-media

comparison fonts/fontello/demo.html @ 90:aedac563c3f0 default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
fonts: remove fontello: fontello is not maintained anymore (last commit 2 years ago) and has licensing issues (some icons are advertised as free when they are not). fontawesome has been integrated to replace it.
author Goffi <goffi@goffi.org>
date Sat, 26 Oct 2024 21:45:19 +0200
parents 92b844829ae2
children
comparison
equal deleted inserted replaced
89:92b844829ae2 90:aedac563c3f0
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
5 <meta charset="UTF-8">
6 <style>
7 html {
8 font-size: 100%;
9 -webkit-text-size-adjust: 100%;
10 -ms-text-size-adjust: 100%;
11 }
12 a:focus {
13 outline: thin dotted #333;
14 outline: 5px auto -webkit-focus-ring-color;
15 outline-offset: -2px;
16 }
17 a:hover,
18 a:active {
19 outline: 0;
20 }
21 input {
22 margin: 0;
23 font-size: 100%;
24 vertical-align: middle;
25 *overflow: visible;
26 line-height: normal;
27 }
28 input::-moz-focus-inner {
29 padding: 0;
30 border: 0;
31 }
32 body {
33 margin: 0;
34 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
35 font-size: 14px;
36 line-height: 20px;
37 color: #333;
38 background-color: #fff;
39 }
40 a {
41 color: #08c;
42 text-decoration: none;
43 }
44 a:hover {
45 color: #005580;
46 text-decoration: underline;
47 }
48 .row {
49 margin-left: -20px;
50 *zoom: 1;
51 }
52 .row:before,
53 .row:after {
54 display: table;
55 content: "";
56 line-height: 0;
57 }
58 .row:after {
59 clear: both;
60 }
61 .span3 {
62 float: left;
63 min-height: 1px;
64 margin-left: 20px;
65 width: 220px;
66 }
67 .container {
68 width: 940px;
69 margin-right: auto;
70 margin-left: auto;
71 *zoom: 1;
72 }
73 .container:before,
74 .container:after {
75 display: table;
76 content: "";
77 line-height: 0;
78 }
79 .container:after {
80 clear: both;
81 }
82 small {
83 font-size: 85%;
84 }
85 h1 {
86 margin: 10px 0;
87 font-family: inherit;
88 font-weight: bold;
89 line-height: 20px;
90 color: inherit;
91 text-rendering: optimizelegibility;
92 line-height: 40px;
93 font-size: 38.5px;
94 }
95 h1 small {
96 font-weight: normal;
97 line-height: 1;
98 color: #999;
99 font-size: 24.5px;
100 }
101
102 body {
103 margin-top: 90px;
104 }
105 .header {
106 position: fixed;
107 top: 0;
108 left: 50%;
109 margin-left: -480px;
110 background-color: #fff;
111 border-bottom: 1px solid #ddd;
112 padding-top: 10px;
113 z-index: 10;
114 }
115 .footer {
116 color: #ddd;
117 font-size: 12px;
118 text-align: center;
119 margin-top: 20px;
120 }
121 .footer a {
122 color: #ccc;
123 text-decoration: underline;
124 }
125 .the-icons {
126 font-size: 14px;
127 line-height: 24px;
128 }
129 .switch {
130 position: absolute;
131 right: 0;
132 bottom: 10px;
133 color: #666;
134 }
135 .switch input {
136 margin-right: 0.3em;
137 }
138 .codesOn .i-name {
139 display: none;
140 }
141 .codesOn .i-code {
142 display: inline;
143 }
144 .i-code {
145 display: none;
146 }
147 @font-face {
148 font-family: 'fontello';
149 src: url('./font/fontello.eot?46224623');
150 src: url('./font/fontello.eot?46224623#iefix') format('embedded-opentype'),
151 url('./font/fontello.woff?46224623') format('woff'),
152 url('./font/fontello.ttf?46224623') format('truetype'),
153 url('./font/fontello.svg?46224623#fontello') format('svg');
154 font-weight: normal;
155 font-style: normal;
156 }
157 .demo-icon {
158 font-family: "fontello";
159 font-style: normal;
160 font-weight: normal;
161 speak: never;
162
163 display: inline-block;
164 text-decoration: inherit;
165 width: 1em;
166 margin-right: .2em;
167 text-align: center;
168 /* opacity: .8; */
169
170 /* For safety - reset parent styles, that can break glyph codes*/
171 font-variant: normal;
172 text-transform: none;
173
174 /* fix buttons height, for twitter bootstrap */
175 line-height: 1em;
176
177 /* Animation center compensation - margins should be symmetric */
178 /* remove if not needed */
179 margin-left: .2em;
180
181 /* You can be more comfortable with increased icons size */
182 /* font-size: 120%; */
183
184 /* Font smoothing. That was taken from TWBS */
185 -webkit-font-smoothing: antialiased;
186 -moz-osx-font-smoothing: grayscale;
187
188 /* Uncomment for 3D effect */
189 /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
190 }
191 </style>
192 <link rel="stylesheet" href="css/animation.css"><!--[if IE 7]><link rel="stylesheet" href="css/" + font.fontname + "-ie7.css"><![endif]-->
193 <script>
194 function toggleCodes(on) {
195 var obj = document.getElementById('icons');
196
197 if (on) {
198 obj.className += ' codesOn';
199 } else {
200 obj.className = obj.className.replace(' codesOn', '');
201 }
202 }
203 </script>
204 </head>
205 <body>
206 <div class="container header">
207 <h1>fontello <small>font demo</small></h1>
208 <label class="switch">
209 <input type="checkbox" onclick="toggleCodes(this.checked)">show codes
210 </label>
211 </div>
212 <div class="container" id="icons">
213 <div class="row">
214 <div class="span3" title="Code: 0xe744">
215 <i class="demo-icon icon-loading animate-spin">&#xe744;</i> <span class="i-name">icon-loading</span><span class="i-code">0xe744</span>
216 </div>
217 <div class="span3" title="Code: 0xe800">
218 <i class="demo-icon icon-doc">&#xe800;</i> <span class="i-name">icon-doc</span><span class="i-code">0xe800</span>
219 </div>
220 <div class="span3" title="Code: 0xe801">
221 <i class="demo-icon icon-desktop">&#xe801;</i> <span class="i-name">icon-desktop</span><span class="i-code">0xe801</span>
222 </div>
223 <div class="span3" title="Code: 0xe802">
224 <i class="demo-icon icon-mobile">&#xe802;</i> <span class="i-name">icon-mobile</span><span class="i-code">0xe802</span>
225 </div>
226 </div>
227 <div class="row">
228 <div class="span3" title="Code: 0xe803">
229 <i class="demo-icon icon-globe">&#xe803;</i> <span class="i-name">icon-globe</span><span class="i-code">0xe803</span>
230 </div>
231 <div class="span3" title="Code: 0xe804">
232 <i class="demo-icon icon-terminal">&#xe804;</i> <span class="i-name">icon-terminal</span><span class="i-code">0xe804</span>
233 </div>
234 <div class="span3" title="Code: 0xe805">
235 <i class="demo-icon icon-blog">&#xe805;</i> <span class="i-name">icon-blog</span><span class="i-code">0xe805</span>
236 </div>
237 <div class="span3" title="Code: 0xe806">
238 <i class="demo-icon icon-clipboard">&#xe806;</i> <span class="i-name">icon-clipboard</span><span class="i-code">0xe806</span>
239 </div>
240 </div>
241 <div class="row">
242 <div class="span3" title="Code: 0xe807">
243 <i class="demo-icon icon-merge">&#xe807;</i> <span class="i-name">icon-merge</span><span class="i-code">0xe807</span>
244 </div>
245 <div class="span3" title="Code: 0xe808">
246 <i class="demo-icon icon-lock">&#xe808;</i> <span class="i-name">icon-lock</span><span class="i-code">0xe808</span>
247 </div>
248 <div class="span3" title="Code: 0xe809">
249 <i class="demo-icon icon-lock-filled">&#xe809;</i> <span class="i-name">icon-lock-filled</span><span class="i-code">0xe809</span>
250 </div>
251 <div class="span3" title="Code: 0xe80a">
252 <i class="demo-icon icon-lock-open">&#xe80a;</i> <span class="i-name">icon-lock-open</span><span class="i-code">0xe80a</span>
253 </div>
254 </div>
255 <div class="row">
256 <div class="span3" title="Code: 0xe80b">
257 <i class="demo-icon icon-lock-open-filled">&#xe80b;</i> <span class="i-name">icon-lock-open-filled</span><span class="i-code">0xe80b</span>
258 </div>
259 <div class="span3" title="Code: 0xe80c">
260 <i class="demo-icon icon-plus-circled">&#xe80c;</i> <span class="i-name">icon-plus-circled</span><span class="i-code">0xe80c</span>
261 </div>
262 <div class="span3" title="Code: 0xe80d">
263 <i class="demo-icon icon-resize-vertical">&#xe80d;</i> <span class="i-name">icon-resize-vertical</span><span class="i-code">0xe80d</span>
264 </div>
265 <div class="span3" title="Code: 0xe80e">
266 <i class="demo-icon icon-dot-3">&#xe80e;</i> <span class="i-name">icon-dot-3</span><span class="i-code">0xe80e</span>
267 </div>
268 </div>
269 <div class="row">
270 <div class="span3" title="Code: 0xe80f">
271 <i class="demo-icon icon-chat">&#xe80f;</i> <span class="i-name">icon-chat</span><span class="i-code">0xe80f</span>
272 </div>
273 <div class="span3" title="Code: 0xe810">
274 <i class="demo-icon icon-exchange">&#xe810;</i> <span class="i-name">icon-exchange</span><span class="i-code">0xe810</span>
275 </div>
276 <div class="span3" title="Code: 0xe811">
277 <i class="demo-icon icon-wrench">&#xe811;</i> <span class="i-name">icon-wrench</span><span class="i-code">0xe811</span>
278 </div>
279 <div class="span3" title="Code: 0xe812">
280 <i class="demo-icon icon-pencil">&#xe812;</i> <span class="i-name">icon-pencil</span><span class="i-code">0xe812</span>
281 </div>
282 </div>
283 <div class="row">
284 <div class="span3" title="Code: 0xe813">
285 <i class="demo-icon icon-signal">&#xe813;</i> <span class="i-name">icon-signal</span><span class="i-code">0xe813</span>
286 </div>
287 <div class="span3" title="Code: 0xe814">
288 <i class="demo-icon icon-play">&#xe814;</i> <span class="i-name">icon-play</span><span class="i-code">0xe814</span>
289 </div>
290 <div class="span3" title="Code: 0xe815">
291 <i class="demo-icon icon-video">&#xe815;</i> <span class="i-name">icon-video</span><span class="i-code">0xe815</span>
292 </div>
293 <div class="span3" title="Code: 0xe816">
294 <i class="demo-icon icon-stop">&#xe816;</i> <span class="i-name">icon-stop</span><span class="i-code">0xe816</span>
295 </div>
296 </div>
297 <div class="row">
298 <div class="span3" title="Code: 0xe817">
299 <i class="demo-icon icon-pause">&#xe817;</i> <span class="i-name">icon-pause</span><span class="i-code">0xe817</span>
300 </div>
301 <div class="span3" title="Code: 0xe818">
302 <i class="demo-icon icon-fast-fw">&#xe818;</i> <span class="i-name">icon-fast-fw</span><span class="i-code">0xe818</span>
303 </div>
304 <div class="span3" title="Code: 0xe819">
305 <i class="demo-icon icon-fast-bw">&#xe819;</i> <span class="i-name">icon-fast-bw</span><span class="i-code">0xe819</span>
306 </div>
307 <div class="span3" title="Code: 0xe81a">
308 <i class="demo-icon icon-previous">&#xe81a;</i> <span class="i-name">icon-previous</span><span class="i-code">0xe81a</span>
309 </div>
310 </div>
311 <div class="row">
312 <div class="span3" title="Code: 0xe81b">
313 <i class="demo-icon icon-next">&#xe81b;</i> <span class="i-name">icon-next</span><span class="i-code">0xe81b</span>
314 </div>
315 <div class="span3" title="Code: 0xe81c">
316 <i class="demo-icon icon-warning">&#xe81c;</i> <span class="i-name">icon-warning</span><span class="i-code">0xe81c</span>
317 </div>
318 <div class="span3" title="Code: 0xe81d">
319 <i class="demo-icon icon-info">&#xe81d;</i> <span class="i-name">icon-info</span><span class="i-code">0xe81d</span>
320 </div>
321 <div class="span3" title="Code: 0xe81e">
322 <i class="demo-icon icon-error">&#xe81e;</i> <span class="i-name">icon-error</span><span class="i-code">0xe81e</span>
323 </div>
324 </div>
325 <div class="row">
326 <div class="span3" title="Code: 0xe81f">
327 <i class="demo-icon icon-picture">&#xe81f;</i> <span class="i-name">icon-picture</span><span class="i-code">0xe81f</span>
328 </div>
329 <div class="span3" title="Code: 0xe820">
330 <i class="demo-icon icon-calendar">&#xe820;</i> <span class="i-name">icon-calendar</span><span class="i-code">0xe820</span>
331 </div>
332 <div class="span3" title="Code: 0xe821">
333 <i class="demo-icon icon-heart-filled">&#xe821;</i> <span class="i-name">icon-heart-filled</span><span class="i-code">0xe821</span>
334 </div>
335 <div class="span3" title="Code: 0xe822">
336 <i class="demo-icon icon-group">&#xe822;</i> <span class="i-name">icon-group</span><span class="i-code">0xe822</span>
337 </div>
338 </div>
339 <div class="row">
340 <div class="span3" title="Code: 0xe823">
341 <i class="demo-icon icon-ok">&#xe823;</i> <span class="i-name">icon-ok</span><span class="i-code">0xe823</span>
342 </div>
343 <div class="span3" title="Code: 0xe824">
344 <i class="demo-icon icon-forward">&#xe824;</i> <span class="i-name">icon-forward</span><span class="i-code">0xe824</span>
345 </div>
346 <div class="span3" title="Code: 0xe825">
347 <i class="demo-icon icon-box">&#xe825;</i> <span class="i-name">icon-box</span><span class="i-code">0xe825</span>
348 </div>
349 <div class="span3" title="Code: 0xe826">
350 <i class="demo-icon icon-feed">&#xe826;</i> <span class="i-name">icon-feed</span><span class="i-code">0xe826</span>
351 </div>
352 </div>
353 <div class="row">
354 <div class="span3" title="Code: 0xe827">
355 <i class="demo-icon icon-upload">&#xe827;</i> <span class="i-name">icon-upload</span><span class="i-code">0xe827</span>
356 </div>
357 <div class="span3" title="Code: 0xe828">
358 <i class="demo-icon icon-cancel-circled">&#xe828;</i> <span class="i-name">icon-cancel-circled</span><span class="i-code">0xe828</span>
359 </div>
360 <div class="span3" title="Code: 0xe829">
361 <i class="demo-icon icon-loop-alt">&#xe829;</i> <span class="i-name">icon-loop-alt</span><span class="i-code">0xe829</span>
362 </div>
363 <div class="span3" title="Code: 0xe82a">
364 <i class="demo-icon icon-person">&#xe82a;</i> <span class="i-name">icon-person</span><span class="i-code">0xe82a</span>
365 </div>
366 </div>
367 <div class="row">
368 <div class="span3" title="Code: 0xe82b">
369 <i class="demo-icon icon-key">&#xe82b;</i> <span class="i-name">icon-key</span><span class="i-code">0xe82b</span>
370 </div>
371 <div class="span3" title="Code: 0xe82c">
372 <i class="demo-icon icon-mail">&#xe82c;</i> <span class="i-name">icon-mail</span><span class="i-code">0xe82c</span>
373 </div>
374 <div class="span3" title="Code: 0xe82d">
375 <i class="demo-icon icon-download">&#xe82d;</i> <span class="i-name">icon-download</span><span class="i-code">0xe82d</span>
376 </div>
377 <div class="span3" title="Code: 0xe82e">
378 <i class="demo-icon icon-trash-empty">&#xe82e;</i> <span class="i-name">icon-trash-empty</span><span class="i-code">0xe82e</span>
379 </div>
380 </div>
381 <div class="row">
382 <div class="span3" title="Code: 0xe82f">
383 <i class="demo-icon icon-volume-off">&#xe82f;</i> <span class="i-name">icon-volume-off</span><span class="i-code">0xe82f</span>
384 </div>
385 <div class="span3" title="Code: 0xe830">
386 <i class="demo-icon icon-volume-up">&#xe830;</i> <span class="i-name">icon-volume-up</span><span class="i-code">0xe830</span>
387 </div>
388 <div class="span3" title="Code: 0xe831">
389 <i class="demo-icon icon-resize-full">&#xe831;</i> <span class="i-name">icon-resize-full</span><span class="i-code">0xe831</span>
390 </div>
391 <div class="span3" title="Code: 0xe832">
392 <i class="demo-icon icon-resize-small">&#xe832;</i> <span class="i-name">icon-resize-small</span><span class="i-code">0xe832</span>
393 </div>
394 </div>
395 <div class="row">
396 <div class="span3" title="Code: 0xe833">
397 <i class="demo-icon icon-check">&#xe833;</i> <span class="i-name">icon-check</span><span class="i-code">0xe833</span>
398 </div>
399 <div class="span3" title="Code: 0xe834">
400 <i class="demo-icon icon-publish">&#xe834;</i> <span class="i-name">icon-publish</span><span class="i-code">0xe834</span>
401 </div>
402 <div class="span3" title="Code: 0xe835">
403 <i class="demo-icon icon-attach">&#xe835;</i> <span class="i-name">icon-attach</span><span class="i-code">0xe835</span>
404 </div>
405 <div class="span3" title="Code: 0xe836">
406 <i class="demo-icon icon-plus">&#xe836;</i> <span class="i-name">icon-plus</span><span class="i-code">0xe836</span>
407 </div>
408 </div>
409 <div class="row">
410 <div class="span3" title="Code: 0xe837">
411 <i class="demo-icon icon-eye">&#xe837;</i> <span class="i-name">icon-eye</span><span class="i-code">0xe837</span>
412 </div>
413 <div class="span3" title="Code: 0xe838">
414 <i class="demo-icon icon-videocam">&#xe838;</i> <span class="i-name">icon-videocam</span><span class="i-code">0xe838</span>
415 </div>
416 <div class="span3" title="Code: 0xe839">
417 <i class="demo-icon icon-phone">&#xe839;</i> <span class="i-name">icon-phone</span><span class="i-code">0xe839</span>
418 </div>
419 <div class="span3" title="Code: 0xf0e0">
420 <i class="demo-icon icon-mail-filled">&#xf0e0;</i> <span class="i-name">icon-mail-filled</span><span class="i-code">0xf0e0</span>
421 </div>
422 </div>
423 <div class="row">
424 <div class="span3" title="Code: 0xf0e5">
425 <i class="demo-icon icon-comment-empty">&#xf0e5;</i> <span class="i-name">icon-comment-empty</span><span class="i-code">0xf0e5</span>
426 </div>
427 <div class="span3" title="Code: 0xf100">
428 <i class="demo-icon icon-angle-double-left">&#xf100;</i> <span class="i-name">icon-angle-double-left</span><span class="i-code">0xf100</span>
429 </div>
430 <div class="span3" title="Code: 0xf101">
431 <i class="demo-icon icon-angle-double-right">&#xf101;</i> <span class="i-name">icon-angle-double-right</span><span class="i-code">0xf101</span>
432 </div>
433 <div class="span3" title="Code: 0xf107">
434 <i class="demo-icon icon-angle-down">&#xf107;</i> <span class="i-name">icon-angle-down</span><span class="i-code">0xf107</span>
435 </div>
436 </div>
437 <div class="row">
438 <div class="span3" title="Code: 0xf10d">
439 <i class="demo-icon icon-quote-left">&#xf10d;</i> <span class="i-name">icon-quote-left</span><span class="i-code">0xf10d</span>
440 </div>
441 <div class="span3" title="Code: 0xf115">
442 <i class="demo-icon icon-folder-open-empty">&#xf115;</i> <span class="i-name">icon-folder-open-empty</span><span class="i-code">0xf115</span>
443 </div>
444 <div class="span3" title="Code: 0xf118">
445 <i class="demo-icon icon-smile">&#xf118;</i> <span class="i-name">icon-smile</span><span class="i-code">0xf118</span>
446 </div>
447 <div class="span3" title="Code: 0xf11c">
448 <i class="demo-icon icon-keyboard">&#xf11c;</i> <span class="i-name">icon-keyboard</span><span class="i-code">0xf11c</span>
449 </div>
450 </div>
451 <div class="row">
452 <div class="span3" title="Code: 0xf127">
453 <i class="demo-icon icon-unlink">&#xf127;</i> <span class="i-name">icon-unlink</span><span class="i-code">0xf127</span>
454 </div>
455 <div class="span3" title="Code: 0xf130">
456 <i class="demo-icon icon-mic">&#xf130;</i> <span class="i-name">icon-mic</span><span class="i-code">0xf130</span>
457 </div>
458 <div class="span3" title="Code: 0xf132">
459 <i class="demo-icon icon-shield">&#xf132;</i> <span class="i-name">icon-shield</span><span class="i-code">0xf132</span>
460 </div>
461 <div class="span3" title="Code: 0xf142">
462 <i class="demo-icon icon-dot-3-vert">&#xf142;</i> <span class="i-name">icon-dot-3-vert</span><span class="i-code">0xf142</span>
463 </div>
464 </div>
465 <div class="row">
466 <div class="span3" title="Code: 0xf144">
467 <i class="demo-icon icon-play-circled">&#xf144;</i> <span class="i-name">icon-play-circled</span><span class="i-code">0xf144</span>
468 </div>
469 <div class="span3" title="Code: 0xf148">
470 <i class="demo-icon icon-level-up">&#xf148;</i> <span class="i-name">icon-level-up</span><span class="i-code">0xf148</span>
471 </div>
472 <div class="span3" title="Code: 0xf1c5">
473 <i class="demo-icon icon-file-image">&#xf1c5;</i> <span class="i-name">icon-file-image</span><span class="i-code">0xf1c5</span>
474 </div>
475 <div class="span3" title="Code: 0xf1c7">
476 <i class="demo-icon icon-file-audio">&#xf1c7;</i> <span class="i-name">icon-file-audio</span><span class="i-code">0xf1c7</span>
477 </div>
478 </div>
479 <div class="row">
480 <div class="span3" title="Code: 0xf1c8">
481 <i class="demo-icon icon-file-video">&#xf1c8;</i> <span class="i-name">icon-file-video</span><span class="i-code">0xf1c8</span>
482 </div>
483 <div class="span3" title="Code: 0xf1d9">
484 <i class="demo-icon icon-paper-plane-empty">&#xf1d9;</i> <span class="i-name">icon-paper-plane-empty</span><span class="i-code">0xf1d9</span>
485 </div>
486 <div class="span3" title="Code: 0xf1e0">
487 <i class="demo-icon icon-share">&#xf1e0;</i> <span class="i-name">icon-share</span><span class="i-code">0xf1e0</span>
488 </div>
489 <div class="span3" title="Code: 0xf1e6">
490 <i class="demo-icon icon-plug">&#xf1e6;</i> <span class="i-name">icon-plug</span><span class="i-code">0xf1e6</span>
491 </div>
492 </div>
493 <div class="row">
494 <div class="span3" title="Code: 0xf1fc">
495 <i class="demo-icon icon-brush">&#xf1fc;</i> <span class="i-name">icon-brush</span><span class="i-code">0xf1fc</span>
496 </div>
497 <div class="span3" title="Code: 0xf233">
498 <i class="demo-icon icon-server">&#xf233;</i> <span class="i-name">icon-server</span><span class="i-code">0xf233</span>
499 </div>
500 <div class="span3" title="Code: 0xf291">
501 <i class="demo-icon icon-basket">&#xf291;</i> <span class="i-name">icon-basket</span><span class="i-code">0xf291</span>
502 </div>
503 <div class="span3" title="Code: 0xf2bd">
504 <i class="demo-icon icon-user-circle">&#xf2bd;</i> <span class="i-name">icon-user-circle</span><span class="i-code">0xf2bd</span>
505 </div>
506 </div>
507 <div class="row">
508 <div class="span3" title="Code: 0xf50d">
509 <i class="demo-icon icon-search">&#xf50d;</i> <span class="i-name">icon-search</span><span class="i-code">0xf50d</span>
510 </div>
511 </div>
512 </div>
513 <div class="container footer">Generated by <a href="https://fontello.com">fontello.com</a></div>
514 </body>
515 </html>