Fix some formatting and organization

- Group the concepts into "concepts" section
- Add 'example' to the note at the top because the colors are so similar

Author: aphillips

index.html

@@ -124,6 +124,7 @@ <h2 id="introduction">Introduction</h2>
 
 <aside class="note">
    <p>In this document [[RFC2119]] keywords have their usual meaning. Best practices and definitions are set off from the remainder of the text with special formatting.</p>
+   <p class="example">Examples appear with a different background color and decoration like this.</p>
    <p class="advisement">Best practices appear with a different background color and decoration like this.</p>
    <p class="definition">Definitions appear with a different background color and decoration like this.</p>
    <p class="issue-example">Gaps or recommendations for future work appear with a different background color and decoration like this.</p>
@@ -212,8 +213,6 @@ <h3 id="definitions">Definitions</h3>
  <p class="definition"><dfn class="link-ignore" data-lt="summer time|daylight savings time|DST|daylight time">Daylight Savings Time</dfn> Also called <em>summer time</em> or <em>daylight time</em> and abbreviated <em>DST</em>. The practice of advancing clocks to make better use of longer periods of daylight during the summer, so that darkness falls at a later [=wall time=]. Rules around observation (or non-observation) of DST is one feature of a time zone.</p>
 </section>
 
-</section>
-
 <section>
 <h2 id="history">A Brief History of Timekeeping</h2>
 
@@ -642,6 +641,8 @@ <h3>Serializations</h3>
 </section>
 </section>
 
+</section><!-- /concepts -->
+
 <section id="use-cases">
 	<h2>Use Cases</h2>