Body Text

font: 'Avenir LT W01 35 Light', 'Trebuchet MS', Arial, Helvetica, sans-serif  (Free Alternative Barlow Condensed or Century Gothic)
font-size: 15px
color:#6D6E71;
line-height: 150%

Emphasized Body Text

You can use a class called "intro" that can be used to introduce content. It is font-size 18px and centered with a max-width of 600px.

This is an introduction to this content, it makes for a great subtitle or emphasized piece of text.

Headers

Example Header h1 (font: 'Avenir LT W01 35 Light', 'Trebuchet MS', Arial, Helvetica, sans-serif size: 40px weight: 400 color: #E76127;)

Example Header h2 (font: 'Avenir LT W01 35 Light', Arial, Helvetica, sans-serif size: 28px weight: 400 color: #006880;)

This headline type is used to separate content. It must be encased in a div with class rtecenter to center the text within the lines

Example Header h3 (font: 'Avenir LT W01 65 Medium', Arial, Helvetica, sans-serif size: 22px weight: 400 color: #006880;)

Example Header h4 (font: 'Avenir LT W01 65 Medium', Arial, Helvetica, sans-serif size: 18px weight: 400 color: #006880;)

EXAMPLE HEADER H5 (FONT: 'AVENIR LT W01 65 MEDIUM', ARIAL, HELVETICA, SANS-SERIF SIZE: 15PX WEIGHT: 400 COLOR: #47c0bb;)

EXAMPLE HEADER H6 (FONT: 'AVENIR LT W01 65 MEDIUM', 'TREBUCHET MS', ARIAL, HELVETICA, SANS-SERIF SIZE: 15PX WEIGHT: 400 COLOR:#6D6E71; )

Note: Header 5 color can optionally swap out for each ministry color

You may also add a .light helper class

You may add a class="light" to any of the h1-h6 headers or even in the parent class, for example

Example h3.light

with this code:

<div class="light"><h3>Header</h3></div>
or
<h3 class="light">Header</h3>

Header classes .h1 .h2 .h3 .h4 .h5 .h6

In some situations you may not be able to use h1-h6 tags (such as within a div.faq). In those situations you may use class="h1" such as

<div class="h4">

Which looks like:

 

These classes will transform the div or tag into what an h1-h6 looks like.

 

Blockquote

"Suspendisse id velit vitae ligula volutpat condimentum. Aliquam erat volutpat. Sed quis velit. Nulla facilisi. Nulla libero. Vivamus pharetra posuere sapien."

(font: 'Avenir LT W01 65 Medium', Arial, Helvetica, sans-serif size: 25px weight: 400 color: #006880;)

<blockquote>
   <p>"Suspendisse id velit vitae ligula volutpat condimentum. Aliquam erat volutpat. Sed quis velit. Nulla facilisi. Nulla libero. Vivamus pharetra posuere sapien."</p>
</blockquote>

Blockquotes with Big Quotes Around Text

For God so loved the world that he gave his one and only Son, that whoever believes in him shall not perish but have eternal life. For I know the plans I have for you,” declares the LORD, “plans to prosper you and not to harm you, plans to give you hope and a future. 


<blockquote class="addquotes">
   <p>For God so loved the world that he gave his one and only Son, that whoever believes in him shall not perish but have eternal life. For I know the plans I have for you,” declares the LORD, “plans to prosper you and not to harm you, plans to give you hope and a future.
</p>
</blockquote>

Putting Big Quotes Around Text
And we know that in all things God works for the good of those who love him, who have been called according to his purpose. I can do everything through him who gives me strength. In the beginning God created the heavens and the earth.

<p class="addquotes">
And we know that in all things God works for the good of those who love him, who have been called according to his purpose. I can do everything through him who gives me strength. In the beginning God created the heavens and the earth.
</p>



Links

This is a link (color: #0094c9; text-decoration: none) This is a link that is being hovered over (color: #0B3C61 text-decoration: underline)

Bold

Here are h2 to h6 tags bolded:

h2 with bold
h3 with bold
h3 no bold
h4 with bold
h5 with bold
h5 with  no bold
h6 with bold