muadzmi02
/
sipadu_mbip
sklonowany z SwissLink/sipadu_mbip
Obserwuj 1
Gwiazdka 0
Forkuj 0
Kod Problemy 0 Pull Requests 0 Wydania 0 Wiki Aktywność
Dashboard sipadu mbip
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
151 Commity
1 Gałąź
Drzewo: d34a883f41
Gałęzie Tagi
${ item.name }
Utwórz gałąź ${ searchTerm }
z 'd34a883f41'
${ noResults }
sipadu_mbip/public/pages/jquery.filer/fonts/jquery.filer-icons/jquery-filer-preview.html

jquery-filer-preview.html 106KB
Czysty Blame Historia

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924 
  1. <!DOCTYPE html>

  2. <html>

  3.   <head>

  4.     <title>jquery-filer glyphs preview</title>

  5. 

  6.     <style>

  7.       /* Page Styles */

  8. 

  9.       * {

  10.         -moz-box-sizing: border-box;

  11.         -webkit-box-sizing: border-box;

  12.         box-sizing: border-box;

  13.         margin: 0;

  14.         padding: 0;

  15.       }

  16. 

  17.       body {

  18.         background: #fff;

  19.         color: #444;

  20.         font: 16px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;

  21.       }

  22. 

  23.       a,

  24.       a:visited {

  25.         color: #888;

  26.         text-decoration: underline;

  27.       }

  28.       a:hover,

  29.       a:focus { color: #000; }

  30. 

  31.       header {

  32.         border-bottom: 2px solid #ddd;

  33.         margin-bottom: 20px;

  34.         overflow: hidden;

  35.         padding: 20px 0;

  36.       }

  37. 

  38.       header h1 {

  39.         color: #888;

  40.         float: left;

  41.         font-size: 36px;

  42.         font-weight: 300;

  43.       }

  44. 

  45.       header a {

  46.         float: right;

  47.         font-size: 14px;

  48.       }

  49. 

  50.       .container {

  51.         margin: 0 auto;

  52.         max-width: 1200px;

  53.         min-width: 960px;

  54.         padding: 0 40px;

  55.         width: 90%;

  56.       }

  57. 

  58.       .glyph {

  59.         border-bottom: 1px dotted #ccc;

  60.         padding: 10px 0 20px;

  61.         margin-bottom: 20px;

  62.       }

  63. 

  64.       .preview-glyphs { vertical-align: bottom; }

  65. 

  66.       .preview-scale {

  67.         color: #888;

  68.         font-size: 12px;

  69.         margin-top: 5px;

  70.       }

  71. 

  72.       .step {

  73.         display: inline-block;

  74.         line-height: 1;

  75.         position: relative;

  76.         width: 10%;

  77.       }

  78. 

  79.       .step .letters,

  80.       .step i {

  81.         -webkit-transition: opacity .3s;

  82.         -moz-transition: opacity .3s;

  83.         -ms-transition: opacity .3s;

  84.         -o-transition: opacity .3s;

  85.         transition: opacity .3s;

  86.       }

  87. 

  88.       .step:hover .letters { opacity: 1; }

  89.       .step:hover i { opacity: .3; }

  90. 

  91.       .letters {

  92.         opacity: .3;

  93.         position: absolute;

  94.       }

  95. 

  96.       .characters-off .letters { display: none; }

  97.       .characters-off .step:hover i { opacity: 1; }

  98. 

  99.       

  100.       .size-12 { font-size: 12px; }

  101.       

  102.       .size-14 { font-size: 14px; }

  103.       

  104.       .size-16 { font-size: 16px; }

  105.       

  106.       .size-18 { font-size: 18px; }

  107.       

  108.       .size-21 { font-size: 21px; }

  109.       

  110.       .size-24 { font-size: 24px; }

  111.       

  112.       .size-36 { font-size: 36px; }

  113.       

  114.       .size-48 { font-size: 48px; }

  115.       

  116.       .size-60 { font-size: 60px; }

  117.       

  118.       .size-72 { font-size: 72px; }

  119.       

  120. 

  121.       .usage { margin-top: 10px; }

  122. 

  123.       .usage input {

  124.         font-family: monospace;

  125.         margin-right: 3px;

  126.         padding: 2px 5px;

  127.         text-align: center;

  128.       }

  129. 

  130.       .usage .point { width: 150px; }

  131. 

  132.       .usage .class { width: 250px; }

  133. 

  134.       footer {

  135.         color: #888;

  136.         font-size: 12px;

  137.         padding: 20px 0;

  138.       }

  139. 

  140.       /* Icon Font: jquery-filer */

  141. 

  142.       @font-face {

  143.   font-family: "jquery-filer";

  144.   src: url("./jquery-filer.eot");

  145.   src: url("./jquery-filer.eot?#iefix") format("embedded-opentype"),

  146.        url(data:application/x-font-woff;charset=utf-8;base64,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),

  147.        url("./jquery-filer.woff") format("woff"),

  148.        url("./jquery-filer.ttf") format("truetype"),

  149.        url("./jquery-filer.svg#jquery-filer") format("svg");

  150.   font-weight: normal;

  151.   font-style: normal;

  152. }

  153. 

  154. @media screen and (-webkit-min-device-pixel-ratio:0) {

  155.   @font-face {

  156.     font-family: "jquery-filer";

  157.     src: url("./jquery-filer.svg#jquery-filer") format("svg");

  158.   }

  159. }

  160. 

  161.       [data-icon]:before { content: attr(data-icon); }

  162. 

  163.       [data-icon]:before,

  164.       .icon-jfi-ban:before,

  165. .icon-jfi-calendar:before,

  166. .icon-jfi-check:before,

  167. .icon-jfi-check-circle:before,

  168. .icon-jfi-cloud-o:before,

  169. .icon-jfi-cloud-up-o:before,

  170. .icon-jfi-comment:before,

  171. .icon-jfi-comment-o:before,

  172. .icon-jfi-download-o:before,

  173. .icon-jfi-exclamation:before,

  174. .icon-jfi-exclamation-circle:before,

  175. .icon-jfi-exclamation-triangle:before,

  176. .icon-jfi-external-link:before,

  177. .icon-jfi-eye:before,

  178. .icon-jfi-file:before,

  179. .icon-jfi-file-audio:before,

  180. .icon-jfi-file-image:before,

  181. .icon-jfi-file-o:before,

  182. .icon-jfi-file-text:before,

  183. .icon-jfi-file-video:before,

  184. .icon-jfi-files-o:before,

  185. .icon-jfi-folder:before,

  186. .icon-jfi-heart:before,

  187. .icon-jfi-heart-o:before,

  188. .icon-jfi-history:before,

  189. .icon-jfi-infinite:before,

  190. .icon-jfi-info:before,

  191. .icon-jfi-info-circle:before,

  192. .icon-jfi-minus:before,

  193. .icon-jfi-minus-circle:before,

  194. .icon-jfi-paperclip:before,

  195. .icon-jfi-pencil:before,

  196. .icon-jfi-plus:before,

  197. .icon-jfi-plus-circle:before,

  198. .icon-jfi-power-off:before,

  199. .icon-jfi-question:before,

  200. .icon-jfi-question-circle:before,

  201. .icon-jfi-reload:before,

  202. .icon-jfi-settings:before,

  203. .icon-jfi-sort:before,

  204. .icon-jfi-times:before,

  205. .icon-jfi-times-circle:before,

  206. .icon-jfi-trash:before,

  207. .icon-jfi-upload-o:before,

  208. .icon-jfi-user:before,

  209. .icon-jfi-view-grid:before,

  210. .icon-jfi-view-list:before,

  211. .icon-jfi-zip:before {

  212.         display: inline-block;

  213.   font-family: "jquery-filer";

  214.   font-style: normal;

  215.   font-weight: normal;

  216.   font-variant: normal;

  217.   line-height: 1;

  218.   text-decoration: inherit;

  219.   text-rendering: optimizeLegibility;

  220.   text-transform: none;

  221.   -moz-osx-font-smoothing: grayscale;

  222.   -webkit-font-smoothing: antialiased;

  223.   font-smoothing: antialiased;

  224.       }

  225. 

  226.       .icon-jfi-ban:before { content: "\f328"; }

  227. .icon-jfi-calendar:before { content: "\f30b"; }

  228. .icon-jfi-check:before { content: "\f2f6"; }

  229. .icon-jfi-check-circle:before { content: "\f30c"; }

  230. .icon-jfi-cloud-o:before { content: "\f329"; }

  231. .icon-jfi-cloud-up-o:before { content: "\f32a"; }

  232. .icon-jfi-comment:before { content: "\f32b"; }

  233. .icon-jfi-comment-o:before { content: "\f30d"; }

  234. .icon-jfi-download-o:before { content: "\f32c"; }

  235. .icon-jfi-exclamation:before { content: "\f32d"; }

  236. .icon-jfi-exclamation-circle:before { content: "\f32e"; }

  237. .icon-jfi-exclamation-triangle:before { content: "\f32f"; }

  238. .icon-jfi-external-link:before { content: "\f330"; }

  239. .icon-jfi-eye:before { content: "\f2f7"; }

  240. .icon-jfi-file:before { content: "\f31f"; }

  241. .icon-jfi-file-audio:before { content: "\f331"; }

  242. .icon-jfi-file-image:before { content: "\f332"; }

  243. .icon-jfi-file-o:before { content: "\f31d"; }

  244. .icon-jfi-file-text:before { content: "\f333"; }

  245. .icon-jfi-file-video:before { content: "\f334"; }

  246. .icon-jfi-files-o:before { content: "\f335"; }

  247. .icon-jfi-folder:before { content: "\f31e"; }

  248. .icon-jfi-heart:before { content: "\f2f8"; }

  249. .icon-jfi-heart-o:before { content: "\f336"; }

  250. .icon-jfi-history:before { content: "\f337"; }

  251. .icon-jfi-infinite:before { content: "\f2fb"; }

  252. .icon-jfi-info:before { content: "\f338"; }

  253. .icon-jfi-info-circle:before { content: "\f339"; }

  254. .icon-jfi-minus:before { content: "\f33a"; }

  255. .icon-jfi-minus-circle:before { content: "\f33b"; }

  256. .icon-jfi-paperclip:before { content: "\f33c"; }

  257. .icon-jfi-pencil:before { content: "\f2ff"; }

  258. .icon-jfi-plus:before { content: "\f311"; }

  259. .icon-jfi-plus-circle:before { content: "\f312"; }

  260. .icon-jfi-power-off:before { content: "\f33d"; }

  261. .icon-jfi-question:before { content: "\f33e"; }

  262. .icon-jfi-question-circle:before { content: "\f33f"; }

  263. .icon-jfi-reload:before { content: "\f300"; }

  264. .icon-jfi-settings:before { content: "\f340"; }

  265. .icon-jfi-sort:before { content: "\f303"; }

  266. .icon-jfi-times:before { content: "\f316"; }

  267. .icon-jfi-times-circle:before { content: "\f317"; }

  268. .icon-jfi-trash:before { content: "\f318"; }

  269. .icon-jfi-upload-o:before { content: "\f341"; }

  270. .icon-jfi-user:before { content: "\f307"; }

  271. .icon-jfi-view-grid:before { content: "\f342"; }

  272. .icon-jfi-view-list:before { content: "\f343"; }

  273. .icon-jfi-zip:before { content: "\f344"; }

  274.     </style>

  275. 

  276.     <!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

  277. 

  278.     <script>

  279.       function toggleCharacters() {

  280.         var body = document.getElementsByTagName('body')[0];

  281.         body.className = body.className === 'characters-off' ? '' : 'characters-off';

  282.       }

  283.     </script>

  284.   </head>

  285. 

  286.   <body class="characters-off">

  287.     <div id="page" class="container">

  288.       <header>

  289.         <h1>jquery-filer contains 48 glyphs:</h1>

  290.         <a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a>

  291.       </header>

  292. 

  293.       

  294.       <div class="glyph">

  295.         <div class="preview-glyphs">

  296.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-ban" class="icon-jfi-ban"></i></span>

  297.         </div>

  298.         <div class="preview-scale">

  299.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  300.         </div>

  301.         <div class="usage">

  302.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-ban" />

  303.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf328;" />

  304.         </div>

  305.       </div>

  306.       

  307.       <div class="glyph">

  308.         <div class="preview-glyphs">

  309.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-calendar" class="icon-jfi-calendar"></i></span>

  310.         </div>

  311.         <div class="preview-scale">

  312.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  313.         </div>

  314.         <div class="usage">

  315.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-calendar" />

  316.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf30b;" />

  317.         </div>

  318.       </div>

  319.       

  320.       <div class="glyph">

  321.         <div class="preview-glyphs">

  322.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-check" class="icon-jfi-check"></i></span>

  323.         </div>

  324.         <div class="preview-scale">

  325.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  326.         </div>

  327.         <div class="usage">

  328.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-check" />

  329.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf2f6;" />

  330.         </div>

  331.       </div>

  332.       

  333.       <div class="glyph">

  334.         <div class="preview-glyphs">

  335.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-check-circle" class="icon-jfi-check-circle"></i></span>

  336.         </div>

  337.         <div class="preview-scale">

  338.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  339.         </div>

  340.         <div class="usage">

  341.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-check-circle" />

  342.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf30c;" />

  343.         </div>

  344.       </div>

  345.       

  346.       <div class="glyph">

  347.         <div class="preview-glyphs">

  348.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-cloud-o" class="icon-jfi-cloud-o"></i></span>

  349.         </div>

  350.         <div class="preview-scale">

  351.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  352.         </div>

  353.         <div class="usage">

  354.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-cloud-o" />

  355.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf329;" />

  356.         </div>

  357.       </div>

  358.       

  359.       <div class="glyph">

  360.         <div class="preview-glyphs">

  361.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-cloud-up-o" class="icon-jfi-cloud-up-o"></i></span>

  362.         </div>

  363.         <div class="preview-scale">

  364.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  365.         </div>

  366.         <div class="usage">

  367.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-cloud-up-o" />

  368.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf32a;" />

  369.         </div>

  370.       </div>

  371.       

  372.       <div class="glyph">

  373.         <div class="preview-glyphs">

  374.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-comment" class="icon-jfi-comment"></i></span>

  375.         </div>

  376.         <div class="preview-scale">

  377.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  378.         </div>

  379.         <div class="usage">

  380.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-comment" />

  381.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf32b;" />

  382.         </div>

  383.       </div>

  384.       

  385.       <div class="glyph">

  386.         <div class="preview-glyphs">

  387.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-comment-o" class="icon-jfi-comment-o"></i></span>

  388.         </div>

  389.         <div class="preview-scale">

  390.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  391.         </div>

  392.         <div class="usage">

  393.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-comment-o" />

  394.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf30d;" />

  395.         </div>

  396.       </div>

  397.       

  398.       <div class="glyph">

  399.         <div class="preview-glyphs">

  400.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-download-o" class="icon-jfi-download-o"></i></span>

  401.         </div>

  402.         <div class="preview-scale">

  403.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  404.         </div>

  405.         <div class="usage">

  406.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-download-o" />

  407.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf32c;" />

  408.         </div>

  409.       </div>

  410.       

  411.       <div class="glyph">

  412.         <div class="preview-glyphs">

  413.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-exclamation" class="icon-jfi-exclamation"></i></span>

  414.         </div>

  415.         <div class="preview-scale">

  416.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  417.         </div>

  418.         <div class="usage">

  419.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-exclamation" />

  420.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf32d;" />

  421.         </div>

  422.       </div>

  423.       

  424.       <div class="glyph">

  425.         <div class="preview-glyphs">

  426.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-exclamation-circle" class="icon-jfi-exclamation-circle"></i></span>

  427.         </div>

  428.         <div class="preview-scale">

  429.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  430.         </div>

  431.         <div class="usage">

  432.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-exclamation-circle" />

  433.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf32e;" />

  434.         </div>

  435.       </div>

  436.       

  437.       <div class="glyph">

  438.         <div class="preview-glyphs">

  439.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-exclamation-triangle" class="icon-jfi-exclamation-triangle"></i></span>

  440.         </div>

  441.         <div class="preview-scale">

  442.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  443.         </div>

  444.         <div class="usage">

  445.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-exclamation-triangle" />

  446.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf32f;" />

  447.         </div>

  448.       </div>

  449.       

  450.       <div class="glyph">

  451.         <div class="preview-glyphs">

  452.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-external-link" class="icon-jfi-external-link"></i></span>

  453.         </div>

  454.         <div class="preview-scale">

  455.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  456.         </div>

  457.         <div class="usage">

  458.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-external-link" />

  459.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf330;" />

  460.         </div>

  461.       </div>

  462.       

  463.       <div class="glyph">

  464.         <div class="preview-glyphs">

  465.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-eye" class="icon-jfi-eye"></i></span>

  466.         </div>

  467.         <div class="preview-scale">

  468.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  469.         </div>

  470.         <div class="usage">

  471.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-eye" />

  472.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf2f7;" />

  473.         </div>

  474.       </div>

  475.       

  476.       <div class="glyph">

  477.         <div class="preview-glyphs">

  478.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-file" class="icon-jfi-file"></i></span>

  479.         </div>

  480.         <div class="preview-scale">

  481.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  482.         </div>

  483.         <div class="usage">

  484.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-file" />

  485.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf31f;" />

  486.         </div>

  487.       </div>

  488.       

  489.       <div class="glyph">

  490.         <div class="preview-glyphs">

  491.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-file-audio" class="icon-jfi-file-audio"></i></span>

  492.         </div>

  493.         <div class="preview-scale">

  494.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  495.         </div>

  496.         <div class="usage">

  497.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-file-audio" />

  498.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf331;" />

  499.         </div>

  500.       </div>

  501.       

  502.       <div class="glyph">

  503.         <div class="preview-glyphs">

  504.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-file-image" class="icon-jfi-file-image"></i></span>

  505.         </div>

  506.         <div class="preview-scale">

  507.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  508.         </div>

  509.         <div class="usage">

  510.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-file-image" />

  511.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf332;" />

  512.         </div>

  513.       </div>

  514.       

  515.       <div class="glyph">

  516.         <div class="preview-glyphs">

  517.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-file-o" class="icon-jfi-file-o"></i></span>

  518.         </div>

  519.         <div class="preview-scale">

  520.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  521.         </div>

  522.         <div class="usage">

  523.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-file-o" />

  524.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf31d;" />

  525.         </div>

  526.       </div>

  527.       

  528.       <div class="glyph">

  529.         <div class="preview-glyphs">

  530.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-file-text" class="icon-jfi-file-text"></i></span>

  531.         </div>

  532.         <div class="preview-scale">

  533.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  534.         </div>

  535.         <div class="usage">

  536.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-file-text" />

  537.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf333;" />

  538.         </div>

  539.       </div>

  540.       

  541.       <div class="glyph">

  542.         <div class="preview-glyphs">

  543.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-file-video" class="icon-jfi-file-video"></i></span>

  544.         </div>

  545.         <div class="preview-scale">

  546.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  547.         </div>

  548.         <div class="usage">

  549.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-file-video" />

  550.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf334;" />

  551.         </div>

  552.       </div>

  553.       

  554.       <div class="glyph">

  555.         <div class="preview-glyphs">

  556.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-files-o" class="icon-jfi-files-o"></i></span>

  557.         </div>

  558.         <div class="preview-scale">

  559.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  560.         </div>

  561.         <div class="usage">

  562.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-files-o" />

  563.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf335;" />

  564.         </div>

  565.       </div>

  566.       

  567.       <div class="glyph">

  568.         <div class="preview-glyphs">

  569.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-folder" class="icon-jfi-folder"></i></span>

  570.         </div>

  571.         <div class="preview-scale">

  572.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  573.         </div>

  574.         <div class="usage">

  575.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-folder" />

  576.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf31e;" />

  577.         </div>

  578.       </div>

  579.       

  580.       <div class="glyph">

  581.         <div class="preview-glyphs">

  582.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-heart" class="icon-jfi-heart"></i></span>

  583.         </div>

  584.         <div class="preview-scale">

  585.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  586.         </div>

  587.         <div class="usage">

  588.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-heart" />

  589.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf2f8;" />

  590.         </div>

  591.       </div>

  592.       

  593.       <div class="glyph">

  594.         <div class="preview-glyphs">

  595.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-heart-o" class="icon-jfi-heart-o"></i></span>

  596.         </div>

  597.         <div class="preview-scale">

  598.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  599.         </div>

  600.         <div class="usage">

  601.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-heart-o" />

  602.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf336;" />

  603.         </div>

  604.       </div>

  605.       

  606.       <div class="glyph">

  607.         <div class="preview-glyphs">

  608.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-history" class="icon-jfi-history"></i></span>

  609.         </div>

  610.         <div class="preview-scale">

  611.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  612.         </div>

  613.         <div class="usage">

  614.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-history" />

  615.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf337;" />

  616.         </div>

  617.       </div>

  618.       

  619.       <div class="glyph">

  620.         <div class="preview-glyphs">

  621.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-infinite" class="icon-jfi-infinite"></i></span>

  622.         </div>

  623.         <div class="preview-scale">

  624.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  625.         </div>

  626.         <div class="usage">

  627.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-infinite" />

  628.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf2fb;" />

  629.         </div>

  630.       </div>

  631.       

  632.       <div class="glyph">

  633.         <div class="preview-glyphs">

  634.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-info" class="icon-jfi-info"></i></span>

  635.         </div>

  636.         <div class="preview-scale">

  637.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  638.         </div>

  639.         <div class="usage">

  640.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-info" />

  641.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf338;" />

  642.         </div>

  643.       </div>

  644.       

  645.       <div class="glyph">

  646.         <div class="preview-glyphs">

  647.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-info-circle" class="icon-jfi-info-circle"></i></span>

  648.         </div>

  649.         <div class="preview-scale">

  650.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  651.         </div>

  652.         <div class="usage">

  653.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-info-circle" />

  654.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf339;" />

  655.         </div>

  656.       </div>

  657.       

  658.       <div class="glyph">

  659.         <div class="preview-glyphs">

  660.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-minus" class="icon-jfi-minus"></i></span>

  661.         </div>

  662.         <div class="preview-scale">

  663.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  664.         </div>

  665.         <div class="usage">

  666.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-minus" />

  667.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf33a;" />

  668.         </div>

  669.       </div>

  670.       

  671.       <div class="glyph">

  672.         <div class="preview-glyphs">

  673.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-minus-circle" class="icon-jfi-minus-circle"></i></span>

  674.         </div>

  675.         <div class="preview-scale">

  676.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  677.         </div>

  678.         <div class="usage">

  679.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-minus-circle" />

  680.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf33b;" />

  681.         </div>

  682.       </div>

  683.       

  684.       <div class="glyph">

  685.         <div class="preview-glyphs">

  686.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-paperclip" class="icon-jfi-paperclip"></i></span>

  687.         </div>

  688.         <div class="preview-scale">

  689.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  690.         </div>

  691.         <div class="usage">

  692.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-paperclip" />

  693.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf33c;" />

  694.         </div>

  695.       </div>

  696.       

  697.       <div class="glyph">

  698.         <div class="preview-glyphs">

  699.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-pencil" class="icon-jfi-pencil"></i></span>

  700.         </div>

  701.         <div class="preview-scale">

  702.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  703.         </div>

  704.         <div class="usage">

  705.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-pencil" />

  706.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf2ff;" />

  707.         </div>

  708.       </div>

  709.       

  710.       <div class="glyph">

  711.         <div class="preview-glyphs">

  712.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-plus" class="icon-jfi-plus"></i></span>

  713.         </div>

  714.         <div class="preview-scale">

  715.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  716.         </div>

  717.         <div class="usage">

  718.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-plus" />

  719.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf311;" />

  720.         </div>

  721.       </div>

  722.       

  723.       <div class="glyph">

  724.         <div class="preview-glyphs">

  725.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-plus-circle" class="icon-jfi-plus-circle"></i></span>

  726.         </div>

  727.         <div class="preview-scale">

  728.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  729.         </div>

  730.         <div class="usage">

  731.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-plus-circle" />

  732.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf312;" />

  733.         </div>

  734.       </div>

  735.       

  736.       <div class="glyph">

  737.         <div class="preview-glyphs">

  738.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-power-off" class="icon-jfi-power-off"></i></span>

  739.         </div>

  740.         <div class="preview-scale">

  741.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  742.         </div>

  743.         <div class="usage">

  744.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-power-off" />

  745.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf33d;" />

  746.         </div>

  747.       </div>

  748.       

  749.       <div class="glyph">

  750.         <div class="preview-glyphs">

  751.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-question" class="icon-jfi-question"></i></span>

  752.         </div>

  753.         <div class="preview-scale">

  754.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  755.         </div>

  756.         <div class="usage">

  757.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-question" />

  758.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf33e;" />

  759.         </div>

  760.       </div>

  761.       

  762.       <div class="glyph">

  763.         <div class="preview-glyphs">

  764.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-question-circle" class="icon-jfi-question-circle"></i></span>

  765.         </div>

  766.         <div class="preview-scale">

  767.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  768.         </div>

  769.         <div class="usage">

  770.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-question-circle" />

  771.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf33f;" />

  772.         </div>

  773.       </div>

  774.       

  775.       <div class="glyph">

  776.         <div class="preview-glyphs">

  777.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-reload" class="icon-jfi-reload"></i></span>

  778.         </div>

  779.         <div class="preview-scale">

  780.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  781.         </div>

  782.         <div class="usage">

  783.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-reload" />

  784.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf300;" />

  785.         </div>

  786.       </div>

  787.       

  788.       <div class="glyph">

  789.         <div class="preview-glyphs">

  790.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-settings" class="icon-jfi-settings"></i></span>

  791.         </div>

  792.         <div class="preview-scale">

  793.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  794.         </div>

  795.         <div class="usage">

  796.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-settings" />

  797.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf340;" />

  798.         </div>

  799.       </div>

  800.       

  801.       <div class="glyph">

  802.         <div class="preview-glyphs">

  803.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-sort" class="icon-jfi-sort"></i></span>

  804.         </div>

  805.         <div class="preview-scale">

  806.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  807.         </div>

  808.         <div class="usage">

  809.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-sort" />

  810.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf303;" />

  811.         </div>

  812.       </div>

  813.       

  814.       <div class="glyph">

  815.         <div class="preview-glyphs">

  816.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-times" class="icon-jfi-times"></i></span>

  817.         </div>

  818.         <div class="preview-scale">

  819.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  820.         </div>

  821.         <div class="usage">

  822.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-times" />

  823.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf316;" />

  824.         </div>

  825.       </div>

  826.       

  827.       <div class="glyph">

  828.         <div class="preview-glyphs">

  829.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-times-circle" class="icon-jfi-times-circle"></i></span>

  830.         </div>

  831.         <div class="preview-scale">

  832.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  833.         </div>

  834.         <div class="usage">

  835.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-times-circle" />

  836.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf317;" />

  837.         </div>

  838.       </div>

  839.       

  840.       <div class="glyph">

  841.         <div class="preview-glyphs">

  842.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-trash" class="icon-jfi-trash"></i></span>

  843.         </div>

  844.         <div class="preview-scale">

  845.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  846.         </div>

  847.         <div class="usage">

  848.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-trash" />

  849.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf318;" />

  850.         </div>

  851.       </div>

  852.       

  853.       <div class="glyph">

  854.         <div class="preview-glyphs">

  855.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-upload-o" class="icon-jfi-upload-o"></i></span>

  856.         </div>

  857.         <div class="preview-scale">

  858.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  859.         </div>

  860.         <div class="usage">

  861.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-upload-o" />

  862.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf341;" />

  863.         </div>

  864.       </div>

  865.       

  866.       <div class="glyph">

  867.         <div class="preview-glyphs">

  868.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-user" class="icon-jfi-user"></i></span>

  869.         </div>

  870.         <div class="preview-scale">

  871.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  872.         </div>

  873.         <div class="usage">

  874.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-user" />

  875.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf307;" />

  876.         </div>

  877.       </div>

  878.       

  879.       <div class="glyph">

  880.         <div class="preview-glyphs">

  881.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-view-grid" class="icon-jfi-view-grid"></i></span>

  882.         </div>

  883.         <div class="preview-scale">

  884.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  885.         </div>

  886.         <div class="usage">

  887.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-view-grid" />

  888.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf342;" />

  889.         </div>

  890.       </div>

  891.       

  892.       <div class="glyph">

  893.         <div class="preview-glyphs">

  894.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-view-list" class="icon-jfi-view-list"></i></span>

  895.         </div>

  896.         <div class="preview-scale">

  897.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  898.         </div>

  899.         <div class="usage">

  900.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-view-list" />

  901.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf343;" />

  902.         </div>

  903.       </div>

  904.       

  905.       <div class="glyph">

  906.         <div class="preview-glyphs">

  907.           <span class="step size-12"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="icon-jfi-zip" class="icon-jfi-zip"></i></span>

  908.         </div>

  909.         <div class="preview-scale">

  910.           <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>

  911.         </div>

  912.         <div class="usage">

  913.           <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".icon-jfi-zip" />

  914.           <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf344;" />

  915.         </div>

  916.       </div>

  917.       

  918. 

  919.       <footer>

  920.         Made with love using <a href="http://fontcustom.com">Font Custom</a>.

  921.       </footer>

  922.     </div>

  923.   </body>

  924. </html>