/* -------------------------------------------------------------- 
  
   typography.css
   * The default typography of the framework.
   * Source:
   * - Web typography: http://webtypography.net/toc/
   * - 8 ways for improving typography: http://www.smashingmagazine.com/2009/04/03/8-simple-ways-to-improve-typography-in-your-designs/
   * - Font stack: http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/
   * - Blueprint CSS Framework
   * - Smashing Book
   * Note:
   * - font-size: 10px
   * - line-height (leading): 24px
   * - heading's leading: 48px:
   
-------------------------------------------------------------- */

/* Default font-size, font-family
	 (1em = 10px => 10/16 x 100 = 62.5%)
-------------------------------------------------------------- */
body { 
	font-size: 62.5%; 
	font-family: Helvetica, Arial, "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	line-height: 2.4em;
}

input, button, option, textarea { font-family: Helvetica, Arial, "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 1em; }
textarea { line-height: 2.4em; }

/* Heading */
h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; }

h1 { font-size: 3.0em; line-height: 1.6em; } /* 24px ~ 48px */
h2 { font-size: 2.4em; line-height: 2em; } /* 20px ~ 48px */
h3 { font-size: 1.6em; line-height: 1.5em; } /* 16px ~ 24px */
h4 { font-size: 1.6em; height: auto; line-height: 2em; } /* 12px ~ 24px */ 
h5, h6 { font-size: 1em; } /* 10px ~ 24px (It's rarely to use these heading tags.) */

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration: none; }

/* Body text */
/* paragraphy, list, blockquote */
ul, ol, p, blockquote { font-size: 1.6em; line-height: 2em; margin-bottom: 2em; word-spacing:0.05em; }
ul, ol { margin-left: 2em; }
ul { list-style: square; }
ol { list-style: decimal; }

/* Improving blockquote */
blockquote { color: #000; font-style: normal; padding-left: 40px; margin: 2em 40px; }
blockquote p { font-size: 1.5em; line-height: 24px; margin-bottom: 24px; text-align: justify; }
blockquote p.last { margin-bottom: 0; }
blockquote p + p { text-indent: 0; }
blockquote p.author { color: #999; font-size: 1em; font-weight: bold; line-height: 2em; margin-bottom: 0; text-align: right; text-transform: uppercase; }
blockquote p.author a { color: #999; text-decoration: none; }
blockquote p.author a:hover { text-decoration: underline; }
blockquote p span.quote-open { color: #999; font-family: Garamond, "Hoefler Text", Times New Roman, Times, serif; float: left; font-size: 2em; left: -30px; margin-right: -30px; position: relative;  width: 24px; }


ul li p, 
ol li p,
ul li ol, 
ul li ul, 
ol li ol, 
ol li ul,
p blockquote,
pre p, p code,
blockquote pre,
blockquote code,
ol li pre,
ol li code,
ul li pre,
ul li code,
p abbr, p acronym { font-size: 1em; margin-bottom: 0; }

ul li ol, 
ul li ul, 
ol li ol, 
ol li ul { margin: 0 2em; }

ul,ol { text-align: justify; }

p { text-indent: 0; }
p + p { text-indent: 2em; }

strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
sup, sub { line-height: 0; }

abbr, 
acronym { border-bottom: 1px dotted #000; letter-spacing: 0.1em; text-transform: uppercase; }
address { font-style: italic; }
address p {  }
del { color:#777; }

pre, code { background: #eee; margin: 2em 0; white-space: pre; word-wrap: break-word; white-space: pre-wrap; } /* white-space: pre; word-wrap: break-word are for IE hack | white-space: pre-wrap is for Firefox */
pre.normal, code.normal { white-space: normal; }
pre, code, tt { font: 1.6em 'andale mono', 'lucida console', monospace; line-height: 2em; }
blockquote pre { margin-bottom: 0; }

/* Font Stack 
   Default font stack
   Source: http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/
-------------------------------------------------------------- */

.paragraph-1, .title-1 { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }
.paragraph-2 { font-family: Baskerville, "Times New Roman", Times, serif; } .title-2 { font-family: Baskerville, Times, "Times New Roman", serif; }
.paragraph-3, .title-3 { font-family: Cambria, Georgia, Times, "Times New Roman", serif; }
.paragraph-4, .title-4 { font-family: "Century Gothic", "Apple Gothic", sans-serif; }
.paragraph-5, .title-5 { font-family: Consolas, "Lucida Console", Monaco, monospace; } /* Code View */
.paragraph-6, .title-6 { font-family: "Copperplate Light", "Copperplate Gothic Light"; }  
.paragraph-7, .title-7 { font-family: "Franklin Gothic Medium", "Arial Narrow Bold", Arial, sans-serif; }
.paragraph-8, .title-8 { font-family: Futura, "Century Gothic", AppleGothic, sans-serif; }
.paragraph-9 { font-family: Garamond, "Hoefler Text", Times New Roman, Times, serif; } .title-9 { font-family: Garamond, "Hoefler Text", Palatino, "Palatino Linotype", serif; }
.paragraph-10 { font-family: Geneva, "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; } .title-10 { font-family: Geneva, Verdana, "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; }
.paragraph-11 { font-family: Georgia, Palatino," Palatino Linotype", Times, "Times New Roman", serif; } .title-11 { font-family: Georgia, Times, "Times New Roman", serif; }
.paragraph-12 { font-family: "Gill Sans", Calibri, "Trebuchet MS", sans-serif; } .title-12 { font-family: "Gill Sans", "Trebuchet MS", Calibri, sans-serif; }
.paragraph-13 { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; } .title-13 { font-family: Helvetica, "Helvetica Neue", Arial, sans-serif; }
.paragraph-14, .title-14 { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; }
.paragraph-15, .title-15 { font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; }
.paragraph-16 { font-family: Palatino, "Palatino Linotype", Georgia, Times, "Times New Roman", serif; } .title-16 { font-family: Palatino, "Palatino Linotype", "Hoefler Text", Times, "Times New Roman", serif; }
.paragraph-17 { font-family: Tahoma, Geneva, Verdana; } .title-17 { font-family: Tahoma, Verdana, Geneva; }
.paragraph-18, .title-18 { font-family: Times, "Times New Roman", Georgia, serif; }
.paragraph-19 { font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande"," Lucida Sans", Arial, sans-serif; } .title-19 { font-family: "Trebuchet MS", Tahoma, Arial, sans-serif; }
.paragraph-20 { font-family: Verdana, Geneva, Tahoma, sans-serif; } .title-20 { font-family: Verdana, Tahoma, Geneva, sans-serif; }
.paragraph-21, .title-21 { font-family: Palatino, "Palatino Linotype", "URW Palladio L", "Book Antiqua", Georgia, serif; }

.paragraph-novel, .title-novel { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; }
.paragraph-newspaper, .title-newspaper { font-family: "Times New Roman", Times, serif; }

.paragraph-generic, .title-generic { font-family: Helvetica, Arial, sans-serif; } /* Generic font stack 1 */
.paragraph-ebook, .title-ebook { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; } /* Generic font stack 2 */

/* Font-Face Implementation
-------------------------------------------------------------- */

/* Generated by Font Squirrel (using http://www.fontsquirrel.com/fontface/generator) on April 8, 2010 */
@font-face {
	font-family: 'ChelthmRegular';
	src: url('fonts/chelthm/chelthmregular.eot');
	src: local('Chelthm'), local('Chelthm'), 
	url('fonts/chelthm/chelthmregular.woff') format('woff'), 
	url('fonts/chelthm/chelthmregular.ttf') format('truetype'), 
	url('fonts/chelthm/chelthmregular.svg#Chelthm') format('svg');
}

@font-face {
	font-family: 'ChelthmRegular';
	font-style: italic;
	src: url('fonts/chelthm/chelthmitalic.eot');
	src: local('Chelthm'), local('Chelthm-Italic'), 
		url('fonts/chelthm/chelthmitalic.woff') format('woff'), 
		url('fonts/chelthm/chelthmitalic.ttf') format('truetype'), 
		url('fonts/chelthm/chelthmitalic.svg#Chelthm-Italic') format('svg');
}

@font-face {
	font-family: 'ChelthmRegular';
	font-weight: bold;
	src: url('fonts/chelthm/chelthmbold.eot');
	src: local('Chelthm'), local('Chelthm-Bold'), 
		url('fonts/chelthm/chelthmbold.woff') format('woff'), 
		url('fonts/chelthm/chelthmbold.ttf') format('truetype'), 
		url('fonts/chelthm/chelthmbold.svg#Chelthm-Bold') format('svg');
}

/*
 * Note:
 * To use ChelthmRegular as the font-family and ChelthmItalic, ChelthmBold as the font-style and font-weight:
 * - Must also declare:
 *  + em { font-style: italic; }
 *  + strong { font-weight: strong; }
 * - pocss declared these rule already on core/typography.css
 */
.font-face-chelthm { font-family: "ChelthmRegular", "Palatino Linotype", "Book Antiqua", Palatino, serif; }

@font-face {
	font-family: 'LeagueGothicRegular';
	src: url('fonts/leaguegothic/League_Gothic.eot');
	src: local('League Gothic Regular'), 
		url('fonts/leaguegothic/League_Gothic.woff') format('woff'), 
		url('fonts/leaguegothic/League_Gothic.otf') format('opentype'), 
		url('fonts/leaguegothic/League_Gothic.svg#LeagueGothic') format('svg');
}

.font-face-leaguegothic { font-family: "LeagueGothicRegular", "Impact", sans-serif; }

/* Font Size
   Special Font-size 
-------------------------------------------------------------- */

.size-16 { font-size: 16px; line-height: 24px; }
ul.size-16, ol.size-16, p.size-16 { margin-bottom: 24px; }
.size-13 { font-size: 13px; line-height: 24px; }
ul.size-13, ol.size-13, p.size-13 { margin-bottom: 24px; }

ul.size-16 li ul, ul.size-16 li ol, ol.size-16 li ol, ol.size-16 li ul,
ul.size-13 li ul, ul.size-13 li ol, ol.size-13 li ol, ol.size-13 li ul { margin-bottom: 0; }

/* Table
   Special Treatment for Table 
-------------------------------------------------------------- */
table.table { width: 100%; }
table { margin-bottom: 24px; }
table thead tr th { font-size: 16px; font-weight: bold; line-height: 24px; text-align: center; }
table tbody tr td { font-size: 1.6em; line-height: 2em; padding: 5px 5px; }