Paragraphs

To ensure some styling you must use "article-body"

Paragraphs default to the p3 sizing however you can easily achieve alternative styling using the p1, p2, p3 & p4 Classes
Note: all fonts are responsive, the numbers next to them are the "base" pixel styling for Designers working in mocks (min-width: 576px) (max-width: 1200px)

Code Example
                           <p class="p1">paragraph 21</p>
                        
p1. paragraph 21
                           <p class="p2">paragraph 18</p>
                        
p2. paragraph 18 (default p)
                           <p class="p3">paragraph 16</p>
                        
p3. paragraph 16
                           <p class="p4">paragraph 14</p>
                        
p4. paragraph 14

This line of text is meant to be treated as deleted text.

               <del>This line of text is meant to be treated as deleted text.</del>
            

You can use the mark tag to highlight text.

               <p>You can use the mark tag to <mark>highlight</mark> text.</p>
            

This line of text is meant to be treated as no longer accurate.

               <p><s>This line of text is meant to be treated as no longer accurate.</s></p>
            

This line of text will render as underlined

               <p><u>This line of text will render as underlined</u></p>
            

This line of text is meant to be small.

               <p><small>This line of text is meant to be small.</small></p>
            

This line rendered as bold text.

               <p><strong>This line rendered as bold text.</strong></p>
            

This line rendered as italicized text.

               <p><em>This line rendered as italicized text.</em></p>
            

Fineprint: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Egestas erat imperdiet sed euismod nisi porta lorem. Tellus in hac habitasse platea dictumst.

               <p class="fineprint"> Fineprint: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Egestas erat imperdiet sed euismod nisi porta lorem. Tellus in hac habitasse platea dictumst.</p>
            

Lists

  1. First list item
  2. Second item in a list of ordered items
  3. Third item in the list
  • A list item
  • Another item in a list
  • Yet another item in this list of items