Typography Examples

This shows the div class of fRight and the div class of caption

This is the H1 Header Element

This is the H2 Header Element

This is the H3 Header Element

This is the H4 Header Element

This is the H5 Header Element

This is the H6 Header Element

Above is the HR tag. This is standard paragraph text

All classes can be adjusted and modified using the margins classes available in grid.css

Top and Bottom margin classes [This is class subhead]

class name -> top20 = margin-top 20px
class name -> top12 = margin-top 12px
class name -> top10 = margin-top 10px
class name -> bot20 = margin-bottom 20px
class name -> bot12 = margin-bottom 12px
class name -> bot10 = margin-bottom 10px
class name -> lt30 = margin-left 30px
class name -> lt24 = margin-left 24px
class name -> lt20 = margin-left 20px
class name -> lt12 = margin-left 12px
class name -> lt10 = margin-left 10px
class name -> lt6 = margin-left 6px

Columnar Width classes
These classes can be assigned to columns that have float/inline in them... including the Grid tags explained below

Width Classes are set in increments:
w10, w20, w30, w40, w50, w60, w70, w80, w90, w100
w100,w120,w140,w160,w180,w200,w220, w240, w260, w280, w300, w320, w340, w360, w380, w400, w420, w440, w460, w480, w500,
w520, w540, w560, w580, w600, w620, w640, w660, w684, w720,w740

This class can be used as a block, or floating div. You can assign a float class to this div and inherit the standard floating pattern of the template. class="floatLT" is set as floating left, and a rightmargin of 6px. You may also use the class "floatRT" to get a right floating div with a leftmargin of 6px.

Floating inline column classes
These classes can be assigned to columns and include floating inline css markup

.g161{width:141px;}
.g161B{width:154px;}
.g163{width:157px;}
.g326{width:320px;}
.g326B{width:316px;}
.g400{width:400px;}
.g489{width:483px;}
.g652{width:646px;}
.g754{width:767px;}
.g815{width:809px;}
.g978{width:972px;}
.g984{width:978px;}

This is the regDiv class that can be assigned to a div tag

Register December 1, 2011

This is the registerBtn class that can be assigned to a link tag
Register Now

This is an unnumbered list within the main content area ul class is called "copy" ul class="copy"

Program Highlights
Schedule
Registration & Venue
Sponsorship Opportunities
Exhibitor Opportunities

This is an h1 tag within the div class "item"

This is an h2 tag within the div class "item"

This is an h3 tag within the div class "item"

This is the italic class. Any element can have .italic assigned to inherit only the italic css

This is the div.headerTop class

This is the div.newsTitle class

This is the div.pressTitle class

Below is the moduleMenu class used in the right columns:

This is the span.arrowImg class

This is the p.location class

This is the quarterly Column grid below

Coffee Trax 4th Quarter 2009

Coffee Trax 4th Quarter 2008

Coffee Trax 1st Quarter 2007

This is the Archive Column grid below. Column widths can be assigned with additional width classes listed above. All Grids should be ended with a div.clear tag

Item1

Item 2

Item 3

This is a link to a pdf file
This is a link to a pdf file
This is a link with the redBx class attached »

This is a link with the redBxLg class attached »

Here are Section Rulers Below:

This is class sectionRuler

This is class sectionDivider

This is class sectionDividerB

Here is an image with class "imgLeft" floating left image.
Padding is set to 5px. For more padding- use class "imgLeft12"

"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

Here is an image with class "imgRight" floating left image.
Padding is set to 5px. For more padding- use class "imgRight12"

"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

Click here to subscribe for one year at $65