1 Introduction

HTML (HyperText Markup Language) and CSS (Cascading Style Sheets) are fundamental technologies for building web pages. HTML structures the content, while CSS controls the design and layout. Together with JavaScript, they enable the creation of dynamic and visually appealing websites.

2 HTML Basics

HTML is the standard markup language for creating web pages. It structures content using elements such as headings, paragraphs, lists, links, and images. These elements serve as the building blocks of web pages, enabling developers to embed multimedia, create forms, and define the overall layout.

2.1 HTML Building Blocks

HTML (HyperText Markup Language) is built using elements enclosed within tags, which define the structure and content of a webpage. These elements can be broadly categorized into:

  • Structural Elements help organize content. Here are commonly used one
    • <head> - a container for introductory content or a set of navigational links
    • <section>- a section in a documen
    • <article>- contain the main content of a page
    • <footer>- defines a footer for a document or section
  • Text Content Elements define and format text.
    • <p> - paragraph
    • <h1> to <h6>- heading levels
    • <span> - mark up a part of a text or a part of a document
    • <strong>- define text with strong importance
    • <em> - emphasizes text
  • Multimedia Elements embed media.
    • <img> - a self-closing tag for inserting an image
    • <audio> - inserts an audio
    • <video>- inserts a video
  • Interactive Elements enhance user engagement.
    • <a> - creates a hyperlink
    • <button> - creates a web button
    • <form> - creates a web form
    • <input>- specifies an input field where the user can enter data
  • List and Table Elements organize content into lists and tables.
    • <ul> - unordered list
    • <ol> - ordered list
    • <table><tr><td> ... </td></tr></table> - defines HTML table
    • <tr> - defines table row
    • <td> - defines table column

Note taht properly closing HTML tags ensures well-structured and valid code. While some tags (like <img> and <br>) are self-closing, most require an explicit closing tag (e.g., <div>…</div>). Using proper indentation and validation tools can help catch missing tags.

2.2 HTML Structure

HTML (HyperText Markup Language) structure consists of a well-defined hierarchy of elements that organize and display content on a webpage. Below is the basic structure of an HTML document:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">      <!-- the page is encoded in UTF-8 -->
    <title>My Web Page</title>
    <link rel="stylesheet" href="styles.css">   <!-- External CSS file -->
</head>
<body>
    <header>
        <h1>Welcome to My Website</h1>
        <nav>
            <ul>
                <li><a href="#about">About</a></li>
                <li><a href="#services">Services</a></li>
                <li><a href="#contact">Contact</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <section id="about">
            <h2>About Me</h2>
            <p>This is some information about me.</p>
        </section>

        <section id="services">
            <h2>Services</h2>
            <p>Details about the services offered.</p>
        </section>

        <section id="contact">
            <h2>Contact</h2>
            <form>
                <label for="name">Name:</label>
                <input type="text" id="name" name="name" required>

                <label for="email">Email:</label>
                <input type="email" id="email" name="email" required>

                <button type="submit">Submit</button>
            </form>
        </section>
    </main>

    <footer>
        <p>&copy; 2025 My Website. All rights reserved.</p>
    </footer>
</body>
</html>

The above HTML produces the following web page

2.3 More on Table Structure

The following code produces an illustrative example of HTML table.

<table border = "2" bordercolor="green"  bgcolor="gray"  width="90%">
  <tr bordercolor="red">
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
</table>
Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico

3 Basics of CSS

CSS (Cascading Style Sheets) is a stylesheet language used to control the presentation and layout of HTML documents. It allows developers to apply styles, such as colors, fonts, spacing, and positioning, to web pages.

3.1 CSS Syntax

A CSS rule consists of a selector and a declaration block:

selector {
  property: value;
}

Example The following example css styles all <p> elements to have blue text and a font size of 16 pixels. The following

<style>
p0 {
     background-color: purple;
     color: gold;
     text-align: center;
     font-size: 16px;
     font-weight:bold
     text-shadow: 2px 2px red;
}
</style>

Add the above selector to the <style> ... </style> at the beginning of this document to make the source clean. The elements (text) of css selector <p0> in the following will produce the text that have the above properties.

<center>
<p0>
The font color of this paragraph is blue and font size is 16px.
</p0>
</center>
The font color of this paragraph is blue and font size is 16px.


Remark: Some of the properties in a selector in css style file may not be rendered in some browsers. In this case, we can use HTML tag to style the text. In the above example, we use HTML tag <center> ... </center> to align the text in the css selector <p0> ...</p0>.

3.2 Commonly Used Selectors

In this subsection, we list some commonly used css selectors without providing illustrative examples to demonstrate the effect.

  • Universal Selector (*): * { margin: 0; padding: 0; }

  • Type Selector (element): p { font-size: 16px; }

  • Class Selector (.class-name): .container { width: 80%; margin: auto; }

  • ID Selector (#id-name): #header { background-color: blue; }

  • Group Selector (selector1, selector2): h1, h2, h3 { color: darkblue; }

  • Descendant Selector (parent child): div p { color: gray; }

  • Child Selector (parent > child): div > p { font-weight: bold; }

  • Adjacent Sibling Selector (element1 + element2): h1 + p { font-style: italic; }

  • General Sibling Selector (element1 ~ element2): h1 ~ p { color: red; }

  • Attribute Selector ([attribute]): input[type="text"] { border: 1px solid black; }

3.3 Commonly Used Properties

  • Text & Font Properties
    • color: Sets the text color: p { color: blue; }
    • font-size: Defines text size: h1 { font-size: 24px; }
    • font-family: Specifies font: body { font-family: Arial, sans-serif; }
    • font-weight: Controls boldness: p { font-weight: bold; }
    • text-align: Aligns text: h2 { text-align: center; }
    • text-decoration: Modifies text style: a { text-decoration: none; }
  • Box Model Properties
    • width & height: Define element size: div { width: 100px; height: 50px; }
    • padding: Space inside the border: div { padding: 10px; }
    • margin: Space outside the border: div { margin: 20px; }
    • border: Defines element border: div { border: 2px solid black; }
  • Layout & Positioning
    • display: Specifies layout behavior: div { display: flex; }
    • position: Controls element positioning: div { position: absolute; top: 50px; left: 20px; }
    • z-index: Stacks elements: div { z-index: 10; }
    • overflow: Manages content overflow: div { overflow: hidden; }
  • Flexbox Properties
    • justify-content: Aligns items horizontally: .container { display: flex; justify-content: center; }
    • align-items: Aligns items vertically: .container { align-items: center; }
    • flex-direction: Defines main axis direction: .container { flex-direction: column; }

4 Methods of Including CSS

There are three ways of inserting a style sheet in the RMarkdown document: inline CSS, internal CSS, and external CSS. We have used all three different formats of CSS in this RMD to format the text or decorate the layout on different occasions. To summarize,

4.1 Inline CSS

inline CSS is a method of applying styles directly to an HTML element using the style attribute. This approach allows you to define CSS rules on a per-element basis without needing an external stylesheet or internal <style> ... </style> block. For example, <font style = "font-size: 10px; color: darkred; font-weight:bold; font-family:verdana;"> font size, face, color, etc.</font> produces the properties in the text with the specified properties: font size, face, color, etc.

  • Advantages of Inline CSS
    • Quick and Easy: No need for an external stylesheet.
    • Overrides Other Styles: Inline styles have higher specificity than internal and external styles.
    • Useful for Testing & Email Templates: Handy for rapid prototyping and in HTML emails where external styles may not work.
  • Disadvantages of Inline CSS
    • Not Reusable: You must repeat styles for each element, leading to redundancy.
    • Hard to Maintain: Changes require updating multiple elements.
    • Poor Readability: Mixing HTML and CSS can make the code messy and harder to manage.

4.2 Internal CSS

Internal CSS is a method of applying CSS styles directly within an HTML document by embedding the styles inside a <style> tag within the <head> section. This method is useful for styling a single web page without affecting other pages. The following is an simple example HTML file.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Internal CSS Example</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 20px;
        }
        h1 {
            color: blue;
            text-align: center;
        }
        p {
            color: darkslategray;
            font-size: 18px;
        }
    </style>
</head>
<body>

    <h1>Welcome to Internal CSS</h1>
    <p>This is an example of how to use internal CSS in an HTML document.</p>

</body>
</html>
  • Advantages of Internal CSS:
    • Allows styling a single document without needing an external stylesheet.
    • Reduces HTTP requests since styles are included in the same HTML file.
    • Enables quick styling changes for a single page.
  • Disadvantages of Internal CSS:
    • Increases page load time if styles are large.
    • Makes code less maintainable compared to external CSS.
    • Cannot be reused across multiple pages.

4.3 External CSS

External CSS is a method of applying styles to a webpage using a separate .css file. This approach allows for better organization, easier maintenance, and reusability of styles across multiple HTML pages.

How It Works

  • Create a separate CSS file (e.g., styles.css).
  • Link the CSS file to an HTML document using the <link> tag inside the <head> section.

Example

Save the following CSS as an external file with name style.css

The above external file will be used in the following HTML file.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>External CSS Example</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <h1>Welcome to External CSS</h1>
    <p>This is an example of using an external stylesheet.</p>
</body>
</html>
LS0tDQp0aXRsZTogJzxmb250IGNvbG9yID0gInB1cnBsZSI+PEI+QmFzaWNzIG9mIEhUTUwgYW5kIENTUzwvYj48L2ZvbnQ+Jw0KYXV0aG9yOiAiQ2hlbmcgUGVuZyINCmRhdGU6ICJXZXN0IENoZXN0ZXIgVW5pdmVyc2l0eSINCm91dHB1dDoNCiAgaHRtbF9kb2N1bWVudDoNCiAgICB0b2M6IHllcw0KICAgIHRvY19mbG9hdDogeWVzDQogICAgdG9jX2NvbGxhcHNlZDogeWVzDQogICAgdG9jX2RlcHRoOiA0DQogICAgY3NzOiBjcFJNRHN0eWxlLmNzcw0KICAgIG51bWJlcl9zZWN0aW9uczogeWVzDQogICAgY29kZV9mb2xkaW5nOiBoaWRlDQogICAgY29kZV9kb3dubG9hZDogeWVzDQogICAgdGhlbWU6IGx1bWVuDQotLS0NCmBgYHs9aHRtbH0NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoNCmNvZGUsIHByZSB7DQogIGZvbnQtZmFtaWx5OiAiRmlyYSBDb2RlIiwgIkNvbnNvbGFzIiwgIkNvdXJpZXIgTmV3IiwgbW9ub3NwYWNlOw0KICBmb250LXNpemU6IDE0cHg7DQogIGJhY2tncm91bmQtY29sb3I6ICNmNWY1ZjU7DQogIHBhZGRpbmc6IDVweDsNCiAgYm9yZGVyLXJhZGl1czogNXB4Ow0KfQ0KDQogIHAwIHsNCiAgICAgYmFja2dyb3VuZC1jb2xvcjogcHVycGxlOw0KICAgICBjb2xvcjogZ29sZDsNCiAgICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgICBmb250LXNpemU6IDE2cHg7DQogICAgIGZvbnQtd2VpZ2h0OmJvbGQNCiAgICAgdGV4dC1zaGFkb3c6IDJweCAycHggcmVkOw0KICAgfSANCg0KPC9zdHlsZT4NCmBgYA0KDQpgYGB7ciBzZXR1cCwgaW5jbHVkZT1GQUxTRX0NCmlmICghcmVxdWlyZSgidGlkeXZlcnNlIikpIHsNCiAgIGluc3RhbGwucGFja2FnZXMoInRpZHl2ZXJzZSIpDQogICBsaWJyYXJ5KHRpZHl2ZXJzZSkNCn0NCmlmICghcmVxdWlyZSgia25pdHIiKSkgew0KICAgaW5zdGFsbC5wYWNrYWdlcygia25pdHIiKQ0KICAgbGlicmFyeShrbml0cikNCn0NCmlmICghcmVxdWlyZSgiZ2lmc2tpIikpIHsNCiAgIGluc3RhbGwucGFja2FnZXMoImdpZnNraSIpDQogICBsaWJyYXJ5KGdpZnNraSkNCn0NCmlmICghcmVxdWlyZSgicGxvdGx5IikpIHsNCiAgIGluc3RhbGwucGFja2FnZXMoInBsb3RseSIpDQogICBsaWJyYXJ5KHBsb3RseSkNCn0NCiMga25pdHI6Om9wdHNfa25pdCRzZXQocm9vdC5kaXIgPSAiQzpcXFNUQTQ5MFxcdzA1IikNCmtuaXRyOjpvcHRzX2NodW5rJHNldChlY2hvID0gVFJVRSwgICAgICAgDQogICAgICAgICAgICAgICAgICAgICAgd2FybmluZyA9IEZBTFNFLCAgIA0KICAgICAgICAgICAgICAgICAgICAgIHJlc3VsdCA9IFRSVUUsICAgDQogICAgICAgICAgICAgICAgICAgICAgbWVzc2FnZSA9IEZBTFNFLA0KICAgICAgICAgICAgICAgICAgICAgIGNvbW1lbnQgPSBOQSkNCmBgYA0KDQpcDQoNCiMgSW50cm9kdWN0aW9uDQoNCkhUTUwgKEh5cGVyVGV4dCBNYXJrdXAgTGFuZ3VhZ2UpIGFuZCBDU1MgKENhc2NhZGluZyBTdHlsZSBTaGVldHMpIGFyZSBmdW5kYW1lbnRhbCB0ZWNobm9sb2dpZXMgZm9yIGJ1aWxkaW5nIHdlYiBwYWdlcy4gSFRNTCBzdHJ1Y3R1cmVzIHRoZSBjb250ZW50LCB3aGlsZSBDU1MgY29udHJvbHMgdGhlIGRlc2lnbiBhbmQgbGF5b3V0LiBUb2dldGhlciB3aXRoIEphdmFTY3JpcHQsIHRoZXkgZW5hYmxlIHRoZSBjcmVhdGlvbiBvZiBkeW5hbWljIGFuZCB2aXN1YWxseSBhcHBlYWxpbmcgd2Vic2l0ZXMuDQoNCg0KIyBIVE1MIEJhc2ljcw0KDQpIVE1MIGlzIHRoZSBzdGFuZGFyZCBtYXJrdXAgbGFuZ3VhZ2UgZm9yIGNyZWF0aW5nIHdlYiBwYWdlcy4gSXQgc3RydWN0dXJlcyBjb250ZW50IHVzaW5nIGVsZW1lbnRzIHN1Y2ggYXMgaGVhZGluZ3MsIHBhcmFncmFwaHMsIGxpc3RzLCBsaW5rcywgYW5kIGltYWdlcy4gVGhlc2UgZWxlbWVudHMgc2VydmUgYXMgdGhlIGJ1aWxkaW5nIGJsb2NrcyBvZiB3ZWIgcGFnZXMsIGVuYWJsaW5nIGRldmVsb3BlcnMgdG8gZW1iZWQgbXVsdGltZWRpYSwgY3JlYXRlIGZvcm1zLCBhbmQgZGVmaW5lIHRoZSBvdmVyYWxsIGxheW91dC4NCg0KIyMgSFRNTCBCdWlsZGluZyBCbG9ja3MNCg0KSFRNTCAoSHlwZXJUZXh0IE1hcmt1cCBMYW5ndWFnZSkgaXMgYnVpbHQgdXNpbmcgZWxlbWVudHMgZW5jbG9zZWQgd2l0aGluIHRhZ3MsIHdoaWNoIGRlZmluZSB0aGUgc3RydWN0dXJlIGFuZCBjb250ZW50IG9mIGEgd2VicGFnZS4gVGhlc2UgZWxlbWVudHMgY2FuIGJlIGJyb2FkbHkgY2F0ZWdvcml6ZWQgaW50bzoNCg0KKiAqKlN0cnVjdHVyYWwgRWxlbWVudHMqKiBoZWxwIG9yZ2FuaXplIGNvbnRlbnQuIEhlcmUgYXJlIGNvbW1vbmx5IHVzZWQgb25lDQogICsgYDxoZWFkPmAgLSBhIGNvbnRhaW5lciBmb3IgaW50cm9kdWN0b3J5IGNvbnRlbnQgb3IgYSBzZXQgb2YgbmF2aWdhdGlvbmFsIGxpbmtzICANCiAgKyBgPHNlY3Rpb24+YC0gYSBzZWN0aW9uIGluIGEgZG9jdW1lbiANCiAgKyBgPGFydGljbGU+YC0gY29udGFpbiB0aGUgbWFpbiBjb250ZW50IG9mIGEgcGFnZSANCiAgKyBgPGZvb3Rlcj5gLSBkZWZpbmVzIGEgZm9vdGVyIGZvciBhIGRvY3VtZW50IG9yIHNlY3Rpb24NCiAgDQoqICoqVGV4dCBDb250ZW50IEVsZW1lbnRzKiogZGVmaW5lIGFuZCBmb3JtYXQgdGV4dC4gDQogICsgYDxwPmAgLSBwYXJhZ3JhcGggDQogICsgYDxoMT4gdG8gPGg2PmAtIGhlYWRpbmcgbGV2ZWxzIA0KICArIGA8c3Bhbj5gIC0gbWFyayB1cCBhIHBhcnQgb2YgYSB0ZXh0IG9yIGEgcGFydCBvZiBhIGRvY3VtZW50IA0KICArIGA8c3Ryb25nPmAtIGRlZmluZSB0ZXh0IHdpdGggc3Ryb25nIGltcG9ydGFuY2UgDQogICsgYDxlbT5gIC0gZW1waGFzaXplcyB0ZXh0DQogIA0KKiAqKk11bHRpbWVkaWEgRWxlbWVudHMqKiBlbWJlZCBtZWRpYS4NCiAgKyBgPGltZz5gIC0gYSBzZWxmLWNsb3NpbmcgdGFnIGZvciBpbnNlcnRpbmcgYW4gaW1hZ2UNCiAgKyBgPGF1ZGlvPmAgLSBpbnNlcnRzIGFuIGF1ZGlvIA0KICArIGA8dmlkZW8+YC0gaW5zZXJ0cyBhIHZpZGVvIA0KICANCiogKipJbnRlcmFjdGl2ZSBFbGVtZW50cyoqIGVuaGFuY2UgdXNlciBlbmdhZ2VtZW50LiANCiAgKyBgPGE+YCAtIGNyZWF0ZXMgYSBoeXBlcmxpbmsgDQogICsgYDxidXR0b24+YCAtIGNyZWF0ZXMgYSB3ZWIgYnV0dG9uIA0KICArIGA8Zm9ybT5gIC0gY3JlYXRlcyBhIHdlYiBmb3JtDQogICsgYDxpbnB1dD5gLSBzcGVjaWZpZXMgYW4gaW5wdXQgZmllbGQgd2hlcmUgdGhlIHVzZXIgY2FuIGVudGVyIGRhdGEgDQogIA0KKiAqKkxpc3QgYW5kIFRhYmxlIEVsZW1lbnRzKiogb3JnYW5pemUgY29udGVudCBpbnRvIGxpc3RzIGFuZCB0YWJsZXMuDQogICsgYDx1bD5gIC0gdW5vcmRlcmVkIGxpc3QgDQogICsgYDxvbD5gIC0gb3JkZXJlZCBsaXN0DQogICsgYDx0YWJsZT48dHI+PHRkPiAuLi4gPC90ZD48L3RyPjwvdGFibGU+YCAtIGRlZmluZXMgSFRNTCB0YWJsZSANCiAgKyBgPHRyPmAgLSBkZWZpbmVzIHRhYmxlIHJvdw0KICArIGA8dGQ+YCAtIGRlZmluZXMgdGFibGUgY29sdW1uDQoNCk5vdGUgdGFodCBwcm9wZXJseSBjbG9zaW5nIEhUTUwgdGFncyBlbnN1cmVzIHdlbGwtc3RydWN0dXJlZCBhbmQgdmFsaWQgY29kZS4gV2hpbGUgc29tZSB0YWdzIChsaWtlIGA8aW1nPmAgYW5kIGA8YnI+YCkgYXJlIHNlbGYtY2xvc2luZywgbW9zdCByZXF1aXJlIGFuIGV4cGxpY2l0IGNsb3NpbmcgdGFnIChlLmcuLCBgPGRpdj5gLi4uYDwvZGl2PmApLiBVc2luZyBwcm9wZXIgaW5kZW50YXRpb24gYW5kIHZhbGlkYXRpb24gdG9vbHMgY2FuIGhlbHAgY2F0Y2ggbWlzc2luZyB0YWdzLg0KDQoNCg0KIyMgSFRNTCBTdHJ1Y3R1cmUgDQoNCkhUTUwgKEh5cGVyVGV4dCBNYXJrdXAgTGFuZ3VhZ2UpIHN0cnVjdHVyZSBjb25zaXN0cyBvZiBhIHdlbGwtZGVmaW5lZCBoaWVyYXJjaHkgb2YgZWxlbWVudHMgdGhhdCBvcmdhbml6ZSBhbmQgZGlzcGxheSBjb250ZW50IG9uIGEgd2VicGFnZS4gQmVsb3cgaXMgdGhlIGJhc2ljIHN0cnVjdHVyZSBvZiBhbiBIVE1MIGRvY3VtZW50Og0KDQpgYGANCjwhRE9DVFlQRSBodG1sPg0KPGh0bWwgbGFuZz0iZW4iPg0KPGhlYWQ+DQogICAgPG1ldGEgY2hhcnNldD0iVVRGLTgiPiAgICAgIDwhLS0gdGhlIHBhZ2UgaXMgZW5jb2RlZCBpbiBVVEYtOCAtLT4NCiAgICA8dGl0bGU+TXkgV2ViIFBhZ2U8L3RpdGxlPg0KICAgIDxsaW5rIHJlbD0ic3R5bGVzaGVldCIgaHJlZj0ic3R5bGVzLmNzcyI+ICAgPCEtLSBFeHRlcm5hbCBDU1MgZmlsZSAtLT4NCjwvaGVhZD4NCjxib2R5Pg0KICAgIDxoZWFkZXI+DQogICAgICAgIDxoMT5XZWxjb21lIHRvIE15IFdlYnNpdGU8L2gxPg0KICAgICAgICA8bmF2Pg0KICAgICAgICAgICAgPHVsPg0KICAgICAgICAgICAgICAgIDxsaT48YSBocmVmPSIjYWJvdXQiPkFib3V0PC9hPjwvbGk+DQogICAgICAgICAgICAgICAgPGxpPjxhIGhyZWY9IiNzZXJ2aWNlcyI+U2VydmljZXM8L2E+PC9saT4NCiAgICAgICAgICAgICAgICA8bGk+PGEgaHJlZj0iI2NvbnRhY3QiPkNvbnRhY3Q8L2E+PC9saT4NCiAgICAgICAgICAgIDwvdWw+DQogICAgICAgIDwvbmF2Pg0KICAgIDwvaGVhZGVyPg0KDQogICAgPG1haW4+DQogICAgICAgIDxzZWN0aW9uIGlkPSJhYm91dCI+DQogICAgICAgICAgICA8aDI+QWJvdXQgTWU8L2gyPg0KICAgICAgICAgICAgPHA+VGhpcyBpcyBzb21lIGluZm9ybWF0aW9uIGFib3V0IG1lLjwvcD4NCiAgICAgICAgPC9zZWN0aW9uPg0KDQogICAgICAgIDxzZWN0aW9uIGlkPSJzZXJ2aWNlcyI+DQogICAgICAgICAgICA8aDI+U2VydmljZXM8L2gyPg0KICAgICAgICAgICAgPHA+RGV0YWlscyBhYm91dCB0aGUgc2VydmljZXMgb2ZmZXJlZC48L3A+DQogICAgICAgIDwvc2VjdGlvbj4NCg0KICAgICAgICA8c2VjdGlvbiBpZD0iY29udGFjdCI+DQogICAgICAgICAgICA8aDI+Q29udGFjdDwvaDI+DQogICAgICAgICAgICA8Zm9ybT4NCiAgICAgICAgICAgICAgICA8bGFiZWwgZm9yPSJuYW1lIj5OYW1lOjwvbGFiZWw+DQogICAgICAgICAgICAgICAgPGlucHV0IHR5cGU9InRleHQiIGlkPSJuYW1lIiBuYW1lPSJuYW1lIiByZXF1aXJlZD4NCg0KICAgICAgICAgICAgICAgIDxsYWJlbCBmb3I9ImVtYWlsIj5FbWFpbDo8L2xhYmVsPg0KICAgICAgICAgICAgICAgIDxpbnB1dCB0eXBlPSJlbWFpbCIgaWQ9ImVtYWlsIiBuYW1lPSJlbWFpbCIgcmVxdWlyZWQ+DQoNCiAgICAgICAgICAgICAgICA8YnV0dG9uIHR5cGU9InN1Ym1pdCI+U3VibWl0PC9idXR0b24+DQogICAgICAgICAgICA8L2Zvcm0+DQogICAgICAgIDwvc2VjdGlvbj4NCiAgICA8L21haW4+DQoNCiAgICA8Zm9vdGVyPg0KICAgICAgICA8cD4mY29weTsgMjAyNSBNeSBXZWJzaXRlLiBBbGwgcmlnaHRzIHJlc2VydmVkLjwvcD4NCiAgICA8L2Zvb3Rlcj4NCjwvYm9keT4NCjwvaHRtbD4NCmBgYA0KVGhlIGFib3ZlIEhUTUwgcHJvZHVjZXMgdGhlIGZvbGxvd2luZyB3ZWIgcGFnZQ0KDQpgYGB7ciBlY2hvID0gRkFMU0UsIGZpZy5hbGlnbj0nY2VudGVyJywgb3V0LndpZHRoPSI2MCUifQ0KaW5jbHVkZV9ncmFwaGljcygic2FtcGxlV2VicGFnZS5wbmciKQ0KYGBgDQoNCg0KDQoNCiMjIE1vcmUgb24gVGFibGUgU3RydWN0dXJlDQoNClRoZSBmb2xsb3dpbmcgY29kZSBwcm9kdWNlcyBhbiBpbGx1c3RyYXRpdmUgZXhhbXBsZSBvZiBIVE1MIHRhYmxlLg0KDQoNCmBgYA0KPHRhYmxlIGJvcmRlciA9ICIyIiBib3JkZXJjb2xvcj0iZ3JlZW4iICBiZ2NvbG9yPSJncmF5IiAgd2lkdGg9IjkwJSI+DQogIDx0ciBib3JkZXJjb2xvcj0icmVkIj4NCiAgICA8dGg+Q29tcGFueTwvdGg+DQogICAgPHRoPkNvbnRhY3Q8L3RoPg0KICAgIDx0aD5Db3VudHJ5PC90aD4NCiAgPC90cj4NCiAgPHRyPg0KICAgIDx0ZD5BbGZyZWRzIEZ1dHRlcmtpc3RlPC90ZD4NCiAgICA8dGQ+TWFyaWEgQW5kZXJzPC90ZD4NCiAgICA8dGQ+R2VybWFueTwvdGQ+DQogIDwvdHI+DQogIDx0cj4NCiAgICA8dGQ+Q2VudHJvIGNvbWVyY2lhbCBNb2N0ZXp1bWE8L3RkPg0KICAgIDx0ZD5GcmFuY2lzY28gQ2hhbmc8L3RkPg0KICAgIDx0ZD5NZXhpY288L3RkPg0KICA8L3RyPg0KPC90YWJsZT4NCmBgYA0KDQo8dGFibGUgYm9yZGVyID0gIjIiIGJvcmRlcmNvbG9yPSJncmVlbiIgIGJnY29sb3I9InNreWJsdWUiICB3aWR0aD0iODAlIj4NCiAgPHRyPg0KICAgIDx0aD5Db21wYW55PC90aD4NCiAgICA8dGg+Q29udGFjdDwvdGg+DQogICAgPHRoPkNvdW50cnk8L3RoPg0KICA8L3RyPg0KICA8dHI+DQogICAgPHRkPkFsZnJlZHMgRnV0dGVya2lzdGU8L3RkPg0KICAgIDx0ZD5NYXJpYSBBbmRlcnM8L3RkPg0KICAgIDx0ZD5HZXJtYW55PC90ZD4NCiAgPC90cj4NCiAgPHRyPg0KICAgIDx0ZD5DZW50cm8gY29tZXJjaWFsIE1vY3RlenVtYTwvdGQ+DQogICAgPHRkPkZyYW5jaXNjbyBDaGFuZzwvdGQ+DQogICAgPHRkPk1leGljbzwvdGQ+DQogIDwvdHI+DQo8L3RhYmxlPg0KDQoNCiMgQmFzaWNzIG9mIENTUw0KDQpDU1MgKENhc2NhZGluZyBTdHlsZSBTaGVldHMpIGlzIGEgc3R5bGVzaGVldCBsYW5ndWFnZSB1c2VkIHRvIGNvbnRyb2wgdGhlIHByZXNlbnRhdGlvbiBhbmQgbGF5b3V0IG9mIEhUTUwgZG9jdW1lbnRzLiBJdCBhbGxvd3MgZGV2ZWxvcGVycyB0byBhcHBseSBzdHlsZXMsIHN1Y2ggYXMgY29sb3JzLCBmb250cywgc3BhY2luZywgYW5kIHBvc2l0aW9uaW5nLCB0byB3ZWIgcGFnZXMuDQoNCiMjIENTUyBTeW50YXgNCg0KQSBDU1MgcnVsZSBjb25zaXN0cyBvZiBhIHNlbGVjdG9yIGFuZCBhIGRlY2xhcmF0aW9uIGJsb2NrOg0KDQpgYGANCnNlbGVjdG9yIHsNCiAgcHJvcGVydHk6IHZhbHVlOw0KfQ0KYGBgDQoNCioqRXhhbXBsZSoqIFRoZSBmb2xsb3dpbmcgZXhhbXBsZSBjc3Mgc3R5bGVzIGFsbCBgPHA+YCBlbGVtZW50cyB0byBoYXZlICpibHVlIHRleHQqIGFuZCBhICpmb250IHNpemUqIG9mIDE2IHBpeGVscy4gVGhlIGZvbGxvd2luZyANCg0KYGBgDQo8c3R5bGU+DQpwMCB7DQogICAgIGJhY2tncm91bmQtY29sb3I6IHB1cnBsZTsNCiAgICAgY29sb3I6IGdvbGQ7DQogICAgIHRleHQtYWxpZ246IGNlbnRlcjsNCiAgICAgZm9udC1zaXplOiAxNnB4Ow0KICAgICBmb250LXdlaWdodDpib2xkDQogICAgIHRleHQtc2hhZG93OiAycHggMnB4IHJlZDsNCn0NCjwvc3R5bGU+DQpgYGANCg0KQWRkIHRoZSBhYm92ZSBzZWxlY3RvciB0byB0aGUgYDxzdHlsZT4gLi4uIDwvc3R5bGU+YCBhdCB0aGUgYmVnaW5uaW5nIG9mIHRoaXMgZG9jdW1lbnQgdG8gbWFrZSB0aGUgc291cmNlIGNsZWFuLiBUaGUgZWxlbWVudHMgKHRleHQpIG9mIGNzcyBzZWxlY3RvciBgPHAwPmAgaW4gdGhlIGZvbGxvd2luZyB3aWxsIHByb2R1Y2UgdGhlIHRleHQgdGhhdCBoYXZlIHRoZSBhYm92ZSBwcm9wZXJ0aWVzLg0KDQpgYGANCjxjZW50ZXI+DQo8cDA+DQpUaGUgZm9udCBjb2xvciBvZiB0aGlzIHBhcmFncmFwaCBpcyBibHVlIGFuZCBmb250IHNpemUgaXMgMTZweC4NCjwvcDA+DQo8L2NlbnRlcj4NCmBgYA0KDQo8Y2VudGVyPg0KPHAwPg0KVGhlIGZvbnQgY29sb3Igb2YgdGhpcyBwYXJhZ3JhcGggaXMgYmx1ZSBhbmQgZm9udCBzaXplIGlzIDE2cHguDQo8L3AwPg0KPC9jZW50ZXI+DQoNCg0KXA0KDQoqKlJlbWFyayoqOiBTb21lIG9mIHRoZSBwcm9wZXJ0aWVzIGluIGEgc2VsZWN0b3IgaW4gY3NzIHN0eWxlIGZpbGUgbWF5IG5vdCBiZSByZW5kZXJlZCBpbiBzb21lIGJyb3dzZXJzLiBJbiB0aGlzIGNhc2UsIHdlIGNhbiB1c2UgSFRNTCB0YWcgdG8gc3R5bGUgdGhlIHRleHQuIEluIHRoZSBhYm92ZSBleGFtcGxlLCB3ZSB1c2UgSFRNTCB0YWcgYDxjZW50ZXI+IC4uLiA8L2NlbnRlcj5gIHRvIGFsaWduIHRoZSB0ZXh0IGluIHRoZSBjc3Mgc2VsZWN0b3IgYDxwMD4gLi4uPC9wMD5gLg0KDQoNCg0KDQojIyBDb21tb25seSBVc2VkIFNlbGVjdG9ycw0KDQpJbiB0aGlzIHN1YnNlY3Rpb24sIHdlIGxpc3Qgc29tZSBjb21tb25seSB1c2VkIGNzcyBzZWxlY3RvcnMgd2l0aG91dCBwcm92aWRpbmcgaWxsdXN0cmF0aXZlIGV4YW1wbGVzIHRvIGRlbW9uc3RyYXRlIHRoZSBlZmZlY3QuDQoNCiogVW5pdmVyc2FsIFNlbGVjdG9yIChgKmApOiBgKiB7IG1hcmdpbjogMDsgcGFkZGluZzogMDsgfWANCg0KKiBUeXBlIFNlbGVjdG9yIChlbGVtZW50KTogYHAgeyBmb250LXNpemU6IDE2cHg7IH1gDQoNCiogQ2xhc3MgU2VsZWN0b3IgKC5jbGFzcy1uYW1lKTogYC5jb250YWluZXIgeyB3aWR0aDogODAlOyBtYXJnaW46IGF1dG87IH1gDQoNCiogSUQgU2VsZWN0b3IgKCNpZC1uYW1lKTogYCNoZWFkZXIgeyBiYWNrZ3JvdW5kLWNvbG9yOiBibHVlOyB9YA0KDQoqIEdyb3VwIFNlbGVjdG9yIChzZWxlY3RvcjEsIHNlbGVjdG9yMik6IGBoMSwgaDIsIGgzIHsgY29sb3I6IGRhcmtibHVlOyB9YA0KDQoqIERlc2NlbmRhbnQgU2VsZWN0b3IgKHBhcmVudCBjaGlsZCk6IGBkaXYgcCB7IGNvbG9yOiBncmF5OyB9YA0KDQoqIENoaWxkIFNlbGVjdG9yIChwYXJlbnQgPiBjaGlsZCk6IGBkaXYgPiBwIHsgZm9udC13ZWlnaHQ6IGJvbGQ7IH1gDQoNCiogQWRqYWNlbnQgU2libGluZyBTZWxlY3RvciAoZWxlbWVudDEgKyBlbGVtZW50Mik6IGBoMSArIHAgeyBmb250LXN0eWxlOiBpdGFsaWM7IH1gDQoNCiogR2VuZXJhbCBTaWJsaW5nIFNlbGVjdG9yIChlbGVtZW50MSB+IGVsZW1lbnQyKTogYGgxIH4gcCB7IGNvbG9yOiByZWQ7IH1gDQoNCiogQXR0cmlidXRlIFNlbGVjdG9yIChbYXR0cmlidXRlXSk6IGBpbnB1dFt0eXBlPSJ0ZXh0Il0geyBib3JkZXI6IDFweCBzb2xpZCBibGFjazsgfWANCg0KDQojIyBDb21tb25seSBVc2VkIFByb3BlcnRpZXMNCg0KKiBUZXh0ICYgRm9udCBQcm9wZXJ0aWVzDQogICsgY29sb3I6IFNldHMgdGhlIHRleHQgY29sb3I6IGBwIHsgY29sb3I6IGJsdWU7IH1gDQogICsgZm9udC1zaXplOiBEZWZpbmVzIHRleHQgc2l6ZTogYGgxIHsgZm9udC1zaXplOiAyNHB4OyB9YA0KICArIGZvbnQtZmFtaWx5OiBTcGVjaWZpZXMgZm9udDogYGJvZHkgeyBmb250LWZhbWlseTogQXJpYWwsIHNhbnMtc2VyaWY7IH1gDQogICsgZm9udC13ZWlnaHQ6IENvbnRyb2xzIGJvbGRuZXNzOiBgcCB7IGZvbnQtd2VpZ2h0OiBib2xkOyB9YA0KICArIHRleHQtYWxpZ246IEFsaWducyB0ZXh0OiBgaDIgeyB0ZXh0LWFsaWduOiBjZW50ZXI7IH1gDQogICsgdGV4dC1kZWNvcmF0aW9uOiBNb2RpZmllcyB0ZXh0IHN0eWxlOiBgYSB7IHRleHQtZGVjb3JhdGlvbjogbm9uZTsgfWANCg0KKiBCb3ggTW9kZWwgUHJvcGVydGllcw0KICArIHdpZHRoICYgaGVpZ2h0OiBEZWZpbmUgZWxlbWVudCBzaXplOiBgZGl2IHsgd2lkdGg6IDEwMHB4OyBoZWlnaHQ6IDUwcHg7IH1gDQogICsgcGFkZGluZzogU3BhY2UgaW5zaWRlIHRoZSBib3JkZXI6IGBkaXYgeyBwYWRkaW5nOiAxMHB4OyB9YA0KICArIG1hcmdpbjogU3BhY2Ugb3V0c2lkZSB0aGUgYm9yZGVyOiBgZGl2IHsgbWFyZ2luOiAyMHB4OyB9YA0KICArIGJvcmRlcjogRGVmaW5lcyBlbGVtZW50IGJvcmRlcjogYGRpdiB7IGJvcmRlcjogMnB4IHNvbGlkIGJsYWNrOyB9YA0KICANCiogTGF5b3V0ICYgUG9zaXRpb25pbmcNCiAgKyBkaXNwbGF5OiBTcGVjaWZpZXMgbGF5b3V0IGJlaGF2aW9yOiBgZGl2IHsgZGlzcGxheTogZmxleDsgfWANCiAgKyBwb3NpdGlvbjogQ29udHJvbHMgZWxlbWVudCBwb3NpdGlvbmluZzogYGRpdiB7IHBvc2l0aW9uOiBhYnNvbHV0ZTsgdG9wOiA1MHB4OyBsZWZ0OiAyMHB4OyB9YA0KICArIHotaW5kZXg6IFN0YWNrcyBlbGVtZW50czogYGRpdiB7IHotaW5kZXg6IDEwOyB9YA0KICArIG92ZXJmbG93OiBNYW5hZ2VzIGNvbnRlbnQgb3ZlcmZsb3c6IGBkaXYgeyBvdmVyZmxvdzogaGlkZGVuOyB9YA0KDQoqIEZsZXhib3ggUHJvcGVydGllcw0KICArIGp1c3RpZnktY29udGVudDogQWxpZ25zIGl0ZW1zIGhvcml6b250YWxseTogYC5jb250YWluZXIgeyBkaXNwbGF5OiBmbGV4OyBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsgfWANCiAgKyBhbGlnbi1pdGVtczogQWxpZ25zIGl0ZW1zIHZlcnRpY2FsbHk6IGAuY29udGFpbmVyIHsgYWxpZ24taXRlbXM6IGNlbnRlcjsgfWANCiAgKyBmbGV4LWRpcmVjdGlvbjogRGVmaW5lcyBtYWluIGF4aXMgZGlyZWN0aW9uOiBgLmNvbnRhaW5lciB7IGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47IH1gDQoNCg0KIyBNZXRob2RzIG9mIEluY2x1ZGluZyBDU1MNCg0KVGhlcmUgYXJlIHRocmVlIHdheXMgb2YgaW5zZXJ0aW5nIGEgc3R5bGUgc2hlZXQgaW4gdGhlIFJNYXJrZG93biBkb2N1bWVudDogaW5saW5lIENTUywgaW50ZXJuYWwgQ1NTLCBhbmQgZXh0ZXJuYWwgQ1NTLiBXZSBoYXZlIHVzZWQgYWxsIHRocmVlIGRpZmZlcmVudCBmb3JtYXRzIG9mIENTUyBpbiB0aGlzIFJNRCB0byBmb3JtYXQgdGhlIHRleHQgb3IgZGVjb3JhdGUgdGhlIGxheW91dCBvbiBkaWZmZXJlbnQgb2NjYXNpb25zLiBUbyBzdW1tYXJpemUsDQoNCg0KIyMgSW5saW5lIENTUw0KDQoqKmlubGluZSBDU1MqKiBpcyBhIG1ldGhvZCBvZiBhcHBseWluZyBzdHlsZXMgZGlyZWN0bHkgdG8gYW4gSFRNTCBlbGVtZW50IHVzaW5nIHRoZSBzdHlsZSBhdHRyaWJ1dGUuIFRoaXMgYXBwcm9hY2ggYWxsb3dzIHlvdSB0byBkZWZpbmUgQ1NTIHJ1bGVzIG9uIGEgcGVyLWVsZW1lbnQgYmFzaXMgd2l0aG91dCBuZWVkaW5nIGFuIGV4dGVybmFsIHN0eWxlc2hlZXQgb3IgaW50ZXJuYWwgYDxzdHlsZT4gLi4uIDwvc3R5bGU+YCBibG9jay4gRm9yIGV4YW1wbGUsIGA8Zm9udCBzdHlsZSA9ICJmb250LXNpemU6IDEwcHg7IGNvbG9yOiBkYXJrcmVkOyBmb250LXdlaWdodDpib2xkOyBmb250LWZhbWlseTp2ZXJkYW5hOyI+YA0KYGZvbnQgc2l6ZSwgZmFjZSwgY29sb3IsIGV0Yy48L2ZvbnQ+YCBwcm9kdWNlcyB0aGUgcHJvcGVydGllcyBpbiB0aGUgdGV4dCB3aXRoIHRoZSBzcGVjaWZpZWQgcHJvcGVydGllczogPGZvbnQgc3R5bGUgPSAiZm9udC1zaXplOiAxMHB4OyBjb2xvcjogZGFya3JlZDsgZm9udC13ZWlnaHQ6Ym9sZDsgZm9udC1mYW1pbHk6dmVyZGFuYTsiPiBmb250IHNpemUsIGZhY2UsIGNvbG9yLCBldGMuPC9mb250Pg0KDQoqIEFkdmFudGFnZXMgb2YgSW5saW5lIENTUw0KICArICpRdWljayBhbmQgRWFzeSo6IE5vIG5lZWQgZm9yIGFuIGV4dGVybmFsIHN0eWxlc2hlZXQuDQogICsgKk92ZXJyaWRlcyBPdGhlciBTdHlsZXMqOiBJbmxpbmUgc3R5bGVzIGhhdmUgaGlnaGVyIHNwZWNpZmljaXR5IHRoYW4gaW50ZXJuYWwgYW5kIGV4dGVybmFsIHN0eWxlcy4NCiAgKyAqVXNlZnVsIGZvciBUZXN0aW5nICYgRW1haWwgVGVtcGxhdGVzKjogSGFuZHkgZm9yIHJhcGlkIHByb3RvdHlwaW5nIGFuZCBpbiBIVE1MIGVtYWlscyB3aGVyZSBleHRlcm5hbCBzdHlsZXMgbWF5IG5vdCB3b3JrLg0KDQoqIERpc2FkdmFudGFnZXMgb2YgSW5saW5lIENTUw0KICArICpOb3QgUmV1c2FibGUqOiBZb3UgbXVzdCByZXBlYXQgc3R5bGVzIGZvciBlYWNoIGVsZW1lbnQsIGxlYWRpbmcgdG8gcmVkdW5kYW5jeS4NCiAgKyAqSGFyZCB0byBNYWludGFpbio6IENoYW5nZXMgcmVxdWlyZSB1cGRhdGluZyBtdWx0aXBsZSBlbGVtZW50cy4NCiAgKyAqUG9vciBSZWFkYWJpbGl0eSo6IE1peGluZyBIVE1MIGFuZCBDU1MgY2FuIG1ha2UgdGhlIGNvZGUgbWVzc3kgYW5kIGhhcmRlciB0byBtYW5hZ2UuDQoNCg0KDQojIyBJbnRlcm5hbCBDU1MNCg0KSW50ZXJuYWwgQ1NTIGlzIGEgbWV0aG9kIG9mIGFwcGx5aW5nIENTUyBzdHlsZXMgZGlyZWN0bHkgd2l0aGluIGFuIEhUTUwgZG9jdW1lbnQgYnkgZW1iZWRkaW5nIHRoZSBzdHlsZXMgaW5zaWRlIGEgYDxzdHlsZT5gIHRhZyB3aXRoaW4gdGhlIGA8aGVhZD5gIHNlY3Rpb24uIFRoaXMgbWV0aG9kIGlzIHVzZWZ1bCBmb3Igc3R5bGluZyBhIHNpbmdsZSB3ZWIgcGFnZSB3aXRob3V0IGFmZmVjdGluZyBvdGhlciBwYWdlcy4gVGhlIGZvbGxvd2luZyBpcyBhbiBzaW1wbGUgZXhhbXBsZSBIVE1MIGZpbGUuDQoNCg0KYGBgDQo8IURPQ1RZUEUgaHRtbD4NCjxodG1sIGxhbmc9ImVuIj4NCjxoZWFkPg0KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04Ij4NCiAgICA8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRoLCBpbml0aWFsLXNjYWxlPTEuMCI+DQogICAgPHRpdGxlPkludGVybmFsIENTUyBFeGFtcGxlPC90aXRsZT4NCiAgICA8c3R5bGU+DQogICAgICAgIGJvZHkgew0KICAgICAgICAgICAgZm9udC1mYW1pbHk6IEFyaWFsLCBzYW5zLXNlcmlmOw0KICAgICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogI2Y0ZjRmNDsNCiAgICAgICAgICAgIG1hcmdpbjogMjBweDsNCiAgICAgICAgfQ0KICAgICAgICBoMSB7DQogICAgICAgICAgICBjb2xvcjogYmx1ZTsNCiAgICAgICAgICAgIHRleHQtYWxpZ246IGNlbnRlcjsNCiAgICAgICAgfQ0KICAgICAgICBwIHsNCiAgICAgICAgICAgIGNvbG9yOiBkYXJrc2xhdGVncmF5Ow0KICAgICAgICAgICAgZm9udC1zaXplOiAxOHB4Ow0KICAgICAgICB9DQogICAgPC9zdHlsZT4NCjwvaGVhZD4NCjxib2R5Pg0KDQogICAgPGgxPldlbGNvbWUgdG8gSW50ZXJuYWwgQ1NTPC9oMT4NCiAgICA8cD5UaGlzIGlzIGFuIGV4YW1wbGUgb2YgaG93IHRvIHVzZSBpbnRlcm5hbCBDU1MgaW4gYW4gSFRNTCBkb2N1bWVudC48L3A+DQoNCjwvYm9keT4NCjwvaHRtbD4NCmBgYA0KDQoqIEFkdmFudGFnZXMgb2YgSW50ZXJuYWwgQ1NTOg0KICArIEFsbG93cyBzdHlsaW5nIGEgc2luZ2xlIGRvY3VtZW50IHdpdGhvdXQgbmVlZGluZyBhbiBleHRlcm5hbCBzdHlsZXNoZWV0Lg0KICArIFJlZHVjZXMgSFRUUCByZXF1ZXN0cyBzaW5jZSBzdHlsZXMgYXJlIGluY2x1ZGVkIGluIHRoZSBzYW1lIEhUTUwgZmlsZS4NCiAgKyBFbmFibGVzIHF1aWNrIHN0eWxpbmcgY2hhbmdlcyBmb3IgYSBzaW5nbGUgcGFnZS4NCg0KKiBEaXNhZHZhbnRhZ2VzIG9mIEludGVybmFsIENTUzoNCiAgKyBJbmNyZWFzZXMgcGFnZSBsb2FkIHRpbWUgaWYgc3R5bGVzIGFyZSBsYXJnZS4NCiAgKyBNYWtlcyBjb2RlIGxlc3MgbWFpbnRhaW5hYmxlIGNvbXBhcmVkIHRvIGV4dGVybmFsIENTUy4NCiAgKyBDYW5ub3QgYmUgcmV1c2VkIGFjcm9zcyBtdWx0aXBsZSBwYWdlcy4NCg0KDQoNCg0KIyMgRXh0ZXJuYWwgQ1NTDQoNCkV4dGVybmFsIENTUyBpcyBhIG1ldGhvZCBvZiBhcHBseWluZyBzdHlsZXMgdG8gYSB3ZWJwYWdlIHVzaW5nIGEgc2VwYXJhdGUgLmNzcyBmaWxlLiBUaGlzIGFwcHJvYWNoIGFsbG93cyBmb3IgYmV0dGVyIG9yZ2FuaXphdGlvbiwgZWFzaWVyIG1haW50ZW5hbmNlLCBhbmQgcmV1c2FiaWxpdHkgb2Ygc3R5bGVzIGFjcm9zcyBtdWx0aXBsZSBIVE1MIHBhZ2VzLg0KDQoqKkhvdyBJdCBXb3JrcyoqDQoNCiogQ3JlYXRlIGEgc2VwYXJhdGUgQ1NTIGZpbGUgKGUuZy4sIHN0eWxlcy5jc3MpLg0KKiBMaW5rIHRoZSBDU1MgZmlsZSB0byBhbiBIVE1MIGRvY3VtZW50IHVzaW5nIHRoZSBgPGxpbms+YCB0YWcgaW5zaWRlIHRoZSBgPGhlYWQ+YCBzZWN0aW9uLg0KDQoqKkV4YW1wbGUqKiANCg0KU2F2ZSB0aGUgZm9sbG93aW5nIENTUyBhcyBhbiBleHRlcm5hbCBmaWxlIHdpdGggbmFtZSBgc3R5bGUuY3NzYA0KDQoNClxiZWdpbnt2ZXJiYXRpbX0NCmJvZHkgew0KICAgIGJhY2tncm91bmQtY29sb3I6IGxpZ2h0Z3JheTsNCiAgICBmb250LWZhbWlseTogQXJpYWwsIHNhbnMtc2VyaWY7DQp9DQoNCmgxIHsNCiAgICBjb2xvcjogYmx1ZTsNCiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7DQp9DQoNCnAgew0KICAgIGZvbnQtc2l6ZTogMThweDsNCiAgICBjb2xvcjogZGFya2dyYXk7DQp9DQpcZW5ke3ZlcmJhdGltfQ0KDQpUaGUgYWJvdmUgZXh0ZXJuYWwgZmlsZSB3aWxsIGJlIHVzZWQgaW4gdGhlIGZvbGxvd2luZyBIVE1MIGZpbGUuDQoNCg0KYGBgDQo8IURPQ1RZUEUgaHRtbD4NCjxodG1sIGxhbmc9ImVuIj4NCjxoZWFkPg0KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04Ij4NCiAgICA8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRoLCBpbml0aWFsLXNjYWxlPTEuMCI+DQogICAgPHRpdGxlPkV4dGVybmFsIENTUyBFeGFtcGxlPC90aXRsZT4NCiAgICA8bGluayByZWw9InN0eWxlc2hlZXQiIGhyZWY9InN0eWxlcy5jc3MiPg0KPC9oZWFkPg0KPGJvZHk+DQogICAgPGgxPldlbGNvbWUgdG8gRXh0ZXJuYWwgQ1NTPC9oMT4NCiAgICA8cD5UaGlzIGlzIGFuIGV4YW1wbGUgb2YgdXNpbmcgYW4gZXh0ZXJuYWwgc3R5bGVzaGVldC48L3A+DQo8L2JvZHk+DQo8L2h0bWw+DQpgYGANCg0KDQoNCg==