/*--------------------------------------------------------------------------------------------
	@GarySwanepoel
	http://www.itbusiness.com.au
	
	v1.0 Updated: 20130420
	
	Resources
	* http://lamb.cc/typograph/
	* https://medium.com/p/8f433689736f
--------------------------------------------------------------------------------------------*/

/* nomalizes
 */
	
    a {text-decoration: none}
    /*a, object, embed, li { outline: 0 !important;}
	input::-moz-focus-inner { border: 0; }*/

/* TYPOGRAPHY
 *	Traditional Scale:						
 *	64/72		.title
 *	48/72		.subtitle
 *	
 *	32/48		h1,.xxlarge
 *	28/48		h2,.xlarge
 *	24/48		h3,.large
 *	
 *	21.3(21)/24		h4,.medium 	//Make whole?
 *	18.7(18)/24		h5,		//Make whole?
 *	16/24		h6,p,.normal
 *	14.7/24		small,.small
 *	13.3/24		xsmall
 *	12/24		xxsmall
 *
 *	TODO:
 *	* Investigate em on body, compared with no unit. It impacts inline(?) elements smaller than base font for line height 
 *	
 */
	
	
	
	
	body {font-size: 100%; line-height: 1.5em;  font-family: 'Helvetica Neue', sans-serif; -webkit-font-smoothing: antialiased; } /* 16px/24px;*/
	.ontablet body { font-size: 87.5%; line-height: 1.5em; } /* 14px/21px;*/
	
	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {font-weight: 700;}

	.title { font-size: 4em; line-height: 1.125}
	.subtitle { font-size: 3em; line-height: 1.5}
	h1,
	.xxlarge { font-size: 2em; line-height: 1.5}
	h2,
	.xlarge { font-size: 1.75em; line-height: 1.714285714285714}
	h3,
	.large {font-size: 1.5em; line-height: 2}
	h4,
	.medium {font-size: 1.33125em; line-height: 1.126760563380282}
	h5 {font-size: 1.16875em; line-height: 1.283422459893048}
	h6,
	.normal,
	p { font-size: 1em;}
	small {font-size: .8em; line-height: 0} /*TODO: Check line height- it pushes out grid*/
	.normal { font-size: 1em; }
	.small {font-size: .91875em;}
	.xsmall {font-size: .83125em; }
	.xxsmall {font-size: .75em; }
	
	.copy .title { margin-top: .375em;}
	.copy .subtitle { margin-top: .5em;}
	.copy h1,
	.copy .xxlarge { margin-top: .75em;}
	.copy h2,
	.copy .xlarge { margin-top:0.857142857142857em; }
	.copy h3,
	.copy .large { margin-top: 1em; }
	.copy h4,
	.copy .medium { margin-top: 1.126760563380282em;}
	.copy h5 { margin-top: 1.283422459893048em}
	.copy h6,
	.copy .normal,
	.copy p { margin-top:1.5em; }
	.copy .small { margin-top:1.63265306122449em; }
	.copy .xsmall { margin-top:1.804511278195489em; }
	.copy .xxsmall { margin-top:2em; }
	
	.-copy .title,
	.-copy .subtitle,
	.-copy h1,
	.-copy .xxlarge,
	.-copy h2,
	.-copy .xlarge,
	.-copy h3,
	.-copy .large,
	.-copy h4,
	.-copy .medium,
	.-copy h5,
	.-copy h6,
	.-copy .normal,
	.-copy p,
	.-copy .small,
	.-copy .xsmall,
	.-copy .xxsmall { margin-top:0; }
	
	.title small,
	.subtitle small,
	h1 small,
	h2 small,
	h3 small,
	h4 small,
	h5 small,
	h6 small{
	/*p small {*/
	    font-size: .8em; opacity: .6; /*TODO:CB*/ line-height: 0;}