| <?xml version="1.0"?> |
| <!DOCTYPE html |
| PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" |
| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en" xml:lang="en"> |
| <head> |
| |
| <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> |
| <meta http-equiv="content-style-type" content="text/css" /> |
| <meta http-equiv="content-language" content="en" /> |
| <meta name="keywords" content="centos web texts visual style guide" /> |
| <meta name="description" content="CentOS texts visual style guide is a tool to help you customize texts inside CentOS websites." /> |
| <meta name="copyright" content="2009-2010 Alain Reguera Delgado" /> |
| |
| <title>Texts - Home</title> |
| |
| <link href="/home/centos/artwork/trunk/Identity/Webenv/Css/App/default.css" rel="stylesheet" type="text/css" media="screen projection"/> |
| |
| </head> |
| |
| <body> |
| |
| <a name="top" /> |
| |
| <div id="wrap"> |
| |
| <div id="page-header"> |
| |
| |
| |
| |
| |
| |
| <div id="logo"> |
| <a title="Community Enterprise Operating System" |
| href="http://www.centos.org/"><img |
| src="/home/centos/artwork/trunk/Identity/Images/Brands/Logos/White/78/centos.png" alt="CentOS"/></a> |
| </div> |
| |
| |
| |
| |
| <div class="ads-google"> |
| <a title="Google Advertisement" href=""><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/ads-sample-468x60.png" alt="Google Advertisement" /></a> |
| <script type="text/javascript"><!-- |
| google_ad_client = "pub-6973128787810819"; |
| google_ad_width = 468; |
| google_ad_height = 60; |
| google_ad_format = "468x60_as"; |
| google_ad_type = "text_image"; |
| google_ad_channel = ""; |
| google_color_border = "204c8d"; |
| google_color_bg = "345c97"; |
| google_color_link = "0000FF"; |
| google_color_text = "FFFFFF"; |
| google_color_url = "008000"; |
| |
| </script> |
| |
| <script type="text/javascript" |
| src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> |
| </script> |
| </div> |
| |
| |
| |
| |
| |
| |
| |
| <div class="page-line"><hr style="display:none;" /></div> |
| <div class="tabs"> |
| |
| <span class="current"> |
| <a accesskey="1" title="CentOS Home Page (Alt+Shift+1)" href="http://www.centos.org/"> |
| <span>Home</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="2" title="CentOS Wiki (Alt+Shift+2)" |
| href="http://wiki.centos.org/"> |
| <span>Wiki</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="3" title="CentOS Mailing Lists (Alt+Shift+3)" href="http://lists.centos.org/"> |
| <span>Lists</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="4" title="CentOS Forums (Alt+Shift+4)" href="http://forums.centos.org"> |
| <span>Forums</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="5" title="CentOS Planet (Alt+Shift+5)" href="http://planet.centos.org"> |
| <span>Planet</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="6" title="CentOS Bugs (Alt+Shift+6)" href="http://bugs.centos.org"> |
| <span>Bugs</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="7" title="CentOS SIGs (Alt+Shift+7)" href="http://sigs.centos.org/"> |
| <span>SIGs</span></a> |
| </span> |
| |
| <span> |
| <a accesskey="8" title="CentOS Downloads (Alt+Shift+8)" href="http://mirrors.centos.org"> |
| <span>Downloads</span></a> |
| </span> |
| |
| </div> |
| |
| |
| |
| |
| <div class="last-releases"> |
| <div class="left"> |
| <span class="title"><a href="">Last Releases</a>:</span> |
| <span class="release"><a href="">6.0</a></span> |
| <span class="release"><a href="">5.8</a></span> |
| <span class="release"><a href="">4.12</a></span> |
| <span class="release last"><a href="">3.18</a></span> |
| </div> |
| <div class="right"> |
| <a href="" title="RSS"> |
| <span class="rss">RSS</span> |
| </a> |
| </div> |
| </div> |
| |
| |
| |
| |
| |
| |
| <div id="appslinks"> |
| |
| |
| |
| |
| |
| <div class="userlinks"> |
| <div class="left"> |
| <span class="title"><a href="">Your last visit was at</a></span> |
| <span class="datetime">Thu Aug 25 14:13:05 CDT 2011</span> |
| </div> |
| <div class="right"> |
| <span><a href="">Lost your password?</a></span> |
| <span><a href="">Register</a></span> |
| <span class="last"><a href="">Login</a></span> |
| </div> |
| </div> |
| |
| |
| |
| |
| |
| <div class="usertrail"> |
| <span><a href="">Pagination</a></span> |
| <span><a href="">Lists</a></span> |
| <span><a href="">Headings</a></span> |
| <span><a href="">Links</a></span> |
| <span><a href="">Texts</a></span> |
| <span class="last"><a href="">Home</a></span> |
| </div> |
| |
| |
| |
| |
| |
| |
| |
| <div class="tabs"> |
| |
| <span><a title="Welcome to the web special interest group" |
| href="index.xhtml"><span>Welcome</span></a></span> |
| |
| <span><a title="CentOS headings visual style guide." |
| href="headings.xhtml"><span>Headings</span></a></span> |
| |
| <span class="current"><a title="CentOS texts visual style guide." |
| href="texts.xhtml"><span>Texts</span></a></span> |
| |
| <span><a title="CentOS lists visual style guide." |
| href="lists.xhtml"><span>Lists</span></a></span> |
| |
| <span><a title="CentOS links visual style guide." |
| href="links.xhtml"><span>Links</span></a></span> |
| |
| <span><a title="CentOS tables visual style guide." |
| href="tables.xhtml"><span>Tables</span></a></span> |
| |
| <span><a title="CentOS forms visual style guide." |
| href="forms.xhtml"><span>Forms</span></a></span> |
| |
| <span><a title="CentOS pagination visual style guide." |
| href="pagination.xhtml"><span>Pagination</span></a></span> |
| |
| </div> |
| |
| </div> |
| |
| <div class="page-line white"><hr style="display:none;" /></div> |
| |
| </div> |
| |
| |
| |
| |
| |
| <div id="page-body"> |
| |
| <div id="rightbar"> |
| |
| |
| |
| |
| |
| <ul class="first"> |
| <li><a href="">Release Notes</a></li> |
| <li><a href="">Lifetime</a></li> |
| <li><a href="">Downloads</a></li> |
| <li><a href="">Documentation</a></li> |
| <li class="current"><a href="">Security Advisories</a></li> |
| <li><a href="">Bugs</a></li> |
| <li><a href="">Tips and tricks</a></li> |
| <li><a href="">HowTos</a></li> |
| </ul> |
| |
| <ul> |
| <li>In this bar, it is possible to separate links by |
| blocks.</li> |
| </ul> |
| |
| </div> |
| |
| <div id="content"> |
| |
| |
| |
| |
| |
| <div class="usertrail"> |
| <span><a href="">Pagination</a></span> |
| <span><a href="">Lists</a></span> |
| <span><a href="">Headings</a></span> |
| <span><a href="">Links</a></span> |
| <span><a href="">Texts</a></span> |
| <span class="last"><a href="">Home</a></span> |
| </div> |
| |
| |
| |
| |
| |
| <h1 class="title"><a name="head-7b6528e7cdb839aa8061f57452123230">Texts</a></h1> |
| |
| <p>CentOS Texts Visual Style Guide.</p> |
| |
| <div class="toc"> <p>Table of contents</p> <dl><dt><a href="#head-7b6528e7cdb839aa8061f57452123230">Texts</a> <dl><dt><a href="#head-5c80f77e92c9f419199251abbd35af97">Phrase elements</a> </dt><dt><a href="#head-507ed9caa81d70f2e714f6ee674392ab">Subscripts and superscripts</a> </dt><dt><a href="#head-db4fcd670319168d39fd8e7ba952e536">Paragraphs</a> <dl><dt><a href="#head-2605435b7a4df57b65b719975d9dcaba">Preformatted texts</a> </dt><dt><a href="#head-115bb040e2e000205cf011d32e54480c">Quotations</a> </dt></dl></dt><dt><a href="#head-c9a5a1c9aa35c7dd07ac092c205d9f64">Recommendations</a> </dt></dl> </dt></dl> </div> |
| |
| <h2 class="title"><a name="head-5c80f77e92c9f419199251abbd35af97">Phrase elements</a></h2> |
| |
| <div class="glosslist"> |
| <dl> |
| <dt><p>EM</p></dt> |
| <dd><p><em>Indicates emphasis.</em></p></dd> |
| |
| <dt><p>STRONG</p></dt> |
| <dd><p><strong>Indicates stronger emphasis.</strong></p></dd> |
| |
| <dt><p>CITE</p></dt> |
| <dd><p><cite>Contains a citation or a reference to other |
| sources.</cite></p></dd> |
| |
| <dt><p>DFN</p></dt> |
| <dd><p><dfn>Indicates that this is the defining instance |
| of the enclosed term.</dfn></p></dd> |
| |
| <dt><p>CODE</p></dt> |
| <dd><p><code>Designates a fragment of computer code.</code></p></dd> |
| |
| <dt><p>SAMP</p></dt> |
| <dd><p><samp>Designates sample output from programs, |
| scripts, etc.</samp></p></dd> |
| |
| <dt><p>KBD</p></dt> |
| <dd><p><kbd>Indicates text to be entered by the user.</kbd></p></dd> |
| |
| <dt><p>VAR</p></dt> |
| <dd><p><var>Indicates an instance of a variable or |
| program argument.</var></p></dd> |
| |
| <dt><p>ABBR</p></dt> |
| <dd><p><abbr title="Abbrebiation">Indicates an |
| abbreviated form (e.g., WWW, HTTP, URI, Mass., |
| etc.).</abbr></p></dd> |
| |
| <dt><p>ACRONYM</p></dt> |
| <dd><p><acronym title="Acronym">Indicates an acronym |
| (e.g., WAC, radar, etc.).</acronym></p></dd> |
| |
| </dl> |
| </div> |
| |
| <h2 class="title"><a name="head-507ed9caa81d70f2e714f6ee674392ab">Subscripts and superscripts</a></h2> |
| |
| <div class="glosslist"> |
| <dl> |
| |
| <dt><p>SUB</p></dt> |
| <dd><p>H<sub>2</sub>O</p></dd> |
| |
| <dt><p>SUP</p></dt> |
| <dd><p>E = mc<sup>2</sup></p></dd> |
| <dd><p><span lang="fr">M<sup>lle</sup> Dupont</span></p></dd> |
| </dl> |
| </div> |
| |
| <h2 class="title"><a name="head-db4fcd670319168d39fd8e7ba952e536">Paragraphs</a></h2> |
| |
| <p><a href="http://www.centos.org/">CentOS</a> is an |
| Enterprise-class Linux Distribution derived from sources |
| freely provided to the public by a prominent North |
| American Enterprise Linux vendor. CentOS conforms fully |
| with the upstream vendors redistribution policy and aims |
| to be 100% binary compatible. (CentOS mainly changes |
| packages to remove upstream vendor branding and |
| artwork.)</p> |
| |
| <p>CentOS is developed by a small but growing team of core |
| developers. In turn the core developers are |
| supported by an active user community including system |
| administrators, network administrators, enterprise users, |
| managers, core Linux contributors and Linux enthusiasts |
| from around the world.</p> |
| |
| <p>CentOS has numerous advantages including: an active and |
| growing user community, quickly rebuilt, tested, and QA'ed |
| errata packages, an extensive <a |
| href="http://www.centos.org/modules/tinycontent/index.php?id=15">mirror |
| network</a>, developers who are contactable and responsive |
| reliable Enterprise Linux class distribution, multiple |
| free support avenues including a <a |
| href="http://wiki.centos.org/">wiki</a>, <a |
| href="http://www.centos.org/modules/tinycontent/index.php?id=8">IRC |
| Chat</a>, <a |
| href="http://www.centos.org/modules/tinycontent/index.php?id=16">Email |
| Lists</a>, <a |
| href="http://www.centos.org/modules/newbb/">Forums</a>,and |
| a dynamic <a |
| href="http://www.centos.org/modules/smartfaq/">FAQ</a>. |
| </p> |
| |
| |
| <h2 class="title"><a name="head-2605435b7a4df57b65b719975d9dcaba">Preformatted texts</a></h2> |
| |
| <pre>This is a small one-line pre formatted element.</pre> |
| |
| <pre>This is a long one-line pre formatted element to illustrate how the content is scrollable when it doesn't fit the current screen area.</pre> |
| |
| <h2 class="title"><a name="head-115bb040e2e000205cf011d32e54480c">Quotations</a></h2> |
| |
| <blockquote> |
| <p>The simplest quotation.</p> |
| <pre><blockquote> |
| <p>The simplest quotation.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote> |
| <h3 class="title">Tip</h3> |
| <p>The simplest quotation using heading.</p> |
| <pre><blockquote><h3 class="title">Tip</h3> |
| <p>The simplest quotation using heading.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/tip.png" alt="Tip" /> |
| <h3 class="title">Tip</h3> |
| <p>Simple quotations can be combined with color classes, icons |
| and headings to make your message more attractive. To set |
| quotation with icons, use the <tt>icon</tt> class in the |
| <tt>blockquote</tt> html tag. The heading is set using |
| <tt>h3</tt> heading level.</p> |
| <pre><blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/tip.png" alt="Tip" /> |
| <h3 class="title">Tip</h3> |
| <p>This is a simple quotation with an icon.</p> |
| </blockquote></pre> |
| <p>The following color classes are available:</p> |
| |
| <ul> |
| <li><tt>blue</tt></li> |
| <li><tt>orange</tt></li> |
| <li><tt>green</tt></li> |
| <li><tt>violet</tt></li> |
| <li><tt>red</tt></li> |
| </ul> |
| |
| <p>The following icon paths are available:</p> |
| <table> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/tip.png" alt="Tip" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/tip.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/note.png" alt="Info" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/note.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/caution.png" alt="Attention" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/caution.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/warning.png" alt="Warning" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/warning.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/ruler.png" alt="Convenction" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/ruler.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/important.png" alt="Star" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/important.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/error.png" alt="Error" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/error.png</td> |
| </tr> |
| <tr> |
| <td><img src="/home/centos/artwork/trunk/Identity/Images/Webenv/success.png" alt="Success" /></td> |
| <td>/home/centos/artwork/trunk/Identity/Images/Webenv/success.png</td> |
| </tr> |
| </table> |
| <p>As you probably have noted, it is possible to use pre-formatted |
| texts, lists, tables and several paragraphs inside one admonition. |
| In fact, it is possible to use any html code inside admonitions. |
| Feel yourself free to experiment new combinations.</p> |
| </blockquote> |
| |
| <blockquote class="message"> |
| <p>This admonition style is used to output web application |
| messages like action results. This one is the simplest.</p> |
| <pre><blockquote class="message"> |
| <p>This is the simplest administrative admonition.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon message green"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/success.png" alt="Success" /> |
| <h3 class="title">Success</h3> |
| <p>This admonition style is used to output web application |
| messages like action results. This one combines color classes, |
| heading, and icon.</p> |
| <pre><blockquote class="icon message green"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/success.png" alt="Success" /> |
| <h3 class="title">Success</h3> |
| <p>This admonition style is used to output web application messages like action results. This one combines color classes, heading, and icon.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon message red"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/error.png" alt="Error" /> |
| <h3 class="title">Error</h3> |
| <p>This admonition style is used to output web application |
| messages like action results. This one combines color classes, |
| heading, and icon.</p> |
| <pre><blockquote class="icon message error"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/error.png" alt="Error" /> |
| <h3 class="title">Error</h3> |
| <p>This admonition style is used to output web application messages like action results. This one combines color classes, heading, and icon.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <p>The <q cite="http://www.centos.org/">Community Enterprise |
| Operating System</q> is a GNU/Linux Distribution based on the |
| freely available sources of a prominet Linux vendor.</p> |
| |
| <pre><p>The <q cite="http://www.centos.org/">Community Enterprise |
| Operating System</q> is a GNU/Linux Distribution based on the freely |
| available sources of a prominet Linux vendor.</p></pre> |
| |
| <p>John said, <q lang="en-US">I saw Lucy at lunch, she told me |
| <q lang="en-US">Mary wants you to get some ice cream on your |
| way home.</q> I think I will get some at Ben and Jerry’s, on |
| Gloucester Road.</q></p> |
| |
| <pre><p>John said, <q lang="en-US">I saw Lucy at lunch, |
| she told me <q lang="en-US">Mary wants you to get some ice cream |
| on your way home.</q> I think I will get some at Ben and |
| Jerry’s, on Gloucester Road.</q></p></pre> |
| |
| <h3 class="title"><a name="head-c9a5a1c9aa35c7dd07ac092c205d9f64">Recommendations</a></h3> |
| |
| <p>In order to maintain a consistent quotation style, consider the |
| following standard recomendations:</p> |
| |
| <blockquote class="icon blue"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/note.png" alt="Note" /> |
| <h3 class="title">Note</h3> |
| <p>Use this quotation style to remark notes inside your content.</p> |
| <pre><blockquote class="icon blue"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/note.png" alt="Note" /> |
| <h3 class="title">Note</h3> |
| <p>Use this quotation style to remark notes inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/tip.png" alt="Tip" /> |
| <h3 class="title">Tip</h3> |
| <p>Use this quotation style to remark tips inside your content.</p> |
| <pre><blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/tip.png" alt="Tip" /> |
| <h3 class="title">Tip</h3> |
| <p>Use this quotation style to remark tips inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/important.png" alt="Important" /> |
| <h3 class="title">Important</h3> |
| <p>Use this quotation style to remark important ideas inside your |
| content.</p> |
| <pre><blockquote class="icon orange"> |
| <h3 class="title">Important</h3> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/important.png" alt="Important" /> |
| <p>Use this quotation style to remark important ideas inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/caution.png" alt="Caution" /> |
| <h3 class="title">Caution</h3> |
| <p>Use this quotation style to remark caution ideas inside your |
| content.</p> |
| <pre><blockquote class="icon orange"> |
| <h3 class="title">Caution</h3> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/caution.png" alt="Caution" /> |
| <p>Use this quotation style to remark caution ideas inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/warning.png" alt="Warning" /> |
| <h3 class="title">Warning</h3> |
| <p>Use this quotation style to remark warnings inside your content.</p> |
| <pre><blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/warning.png" alt="Warning" /> |
| <h3 class="title">Warning</h3> |
| <p>Use this quotation style to remark warnings inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <p>as well as the following no-standard ones:</p> |
| |
| <blockquote class="icon orange"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/ruler.png" alt="Convenction" /> |
| <h3 class="title">Convenction</h3> |
| <p>Use this quotation style to remark convenctions inside your |
| content.</p> |
| <pre><blockquote class="icon orange"> |
| <h3 class="title">Convenction</h3> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/ruler.png" alt="Convenction" /> |
| <p>Use this quotation style to remark convenctions inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <blockquote class="icon blue"> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/redirect.png" alt="Redirection" /> |
| <h3 class="title">Redirection</h3> |
| <p>Use this quotation style to remark redirections inside your |
| content.</p> |
| <pre><blockquote class="icon orange"> |
| <h3 class="title">Convenction</h3> |
| <img src="/home/centos/artwork/trunk/Identity/Images/Webenv/redirect.png" alt="Redirection" /> |
| <p>Use this quotation style to remark redirections inside your content.</p> |
| </blockquote></pre> |
| </blockquote> |
| |
| <ul> |
| <li>...</li> |
| </ul> |
| |
| |
| |
| |
| |
| <div class="page-line"><hr style="display:none;" /></div> |
| |
| </div> |
| |
| </div> |
| |
| |
| |
| |
| <div id="page-footer"> |
| |
| <div class="top"> |
| <a title="Top" href="#top"><img |
| src="/home/centos/artwork/trunk/Identity/Images/Webenv/top.png" |
| alt="Top"/></a> |
| </div> |
| |
| <div class="credits"> |
| Copyright © 2009-2011 Alain Reguera Delgado. All rights |
| reserved.<br />This website is licensed under a <a |
| rel="license" |
| href="http://creativecommons.org/licenses/by-sa/3.0/">Creative |
| Commons Attribution-Share Alike 3.0 Unported License</a>. |
| |
| </div> |
| |
| </div> |
| |
| </div> |
| |
| </body> |
| |
| </html> |