/* ----------------------------------------------------------------------------
TITLE: Core Stylesheet
AUTHOR: Paulo Elias
URL: http://wearequickpixel.com/css/
	
	DESCRIPTION: Core stylesheet that contaings base reset, structure, 
	and typography styles.
	
	TABLE OF CONTENTS
		Base Reset
		HTML & Typography CSS
		Grid/Page Structure

CREATED: 2007.04.18
MODIFIED: 2011.01.21
-------------------------------------------------------------------------------
TITLE: Base Reset v2.0b2 | 201101
AUTHOR: Eric Meyer
URL: http://meyerweb.com/
	
	DESCRIPTION: Reset styles on elements. Inspired by YUI Library, 
	Eric Meyer's "Reset Reloaded"
	http://meyerweb.com/eric/tools/css/reset/
	http://html5doctor.com/html-5-reset-stylesheet/
---------------------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.0;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

hr {
	clear: both;
	float: none;
	margin: 0 0 17px;
	border: none;
	width: 100%;
	height: 1px;
	color: #ccc;
	background: #ccc;
}

input, select {
	vertical-align: middle;
}

form fieldset{
	width:65%;
	position:relative;
	display:block;
	
}


/* ----------------------------------------------------------------------------
TITLE: HTML & Typography CSS
	
	DESCRIPTION: Controls base HTML styling and typography. Our goal is to keep a 
	consistent vertical rhythm and baseline grid.
	
	More about these techniques can be found at:
	* < http://www.alistapart.com/articles/settingtypeontheweb >
	* < http://24ways.org/2006/compose-to-a-vertical-rhythm >
	* < http://www.markboulton.co.uk/journal/comments/incremental_leading/ >
---------------------------------------------------------------------------- */
/*	=SECTIONS
---------------------------------------------------------------------------- */
html								{ font-size: 100.01%; }

/* Default 13/px fonts with 18/px line-height */
body								{ color: #000; font: normal normal normal 13px/18px 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; background-color: #fff; }

h1									{ margin-bottom: 18px; font-size: 36px; line-height: 36px; }
h2									{ margin-bottom: 0; font-size: 25px; line-height: 36px; }
h3									{ margin-bottom: 0; font-size: 20px; line-height: 36px; }
h4									{ margin-bottom: 18px; font-size: 15px; line-height: 18px; }
h5									{ margin-bottom: 0; font-size: 15px; font-weight: normal; }
h6									{ margin-bottom: 0; font-size: 13px; font-style: italic; }

/* Remove margins on images inside headings */
h1 img,
h2 img,
h3 img,
h4 img,
h5 img,
h6 img								{ margin: 0; }

address								{ font-style: italic; }


/*	=GROUPING CONTENT
---------------------------------------------------------------------------- */
p									{ margin-bottom: 18px; }
	p img,
	p img.left							{ float: left; margin: 0 10px 18px 0; }
	p img.right							{ float: right; margin: 0 0 18px 10px; }
	/* Reduced type size with incremental leading
	(http://www.markboulton.co.uk/journal/comments/incremental_leading/)

	This could be used for side notes. For smaller type, you don't necessarily want to
	follow the 1.5x vertical rhythm -- the line-height is too much.

	Using this class, it reduces your font size and line-height so that for
	every four lines of normal sized type, there is five lines of the sidenote. eg:

	New type size in em's:
	11px (wanted side note size) / 13px (existing base size) = 0.8461 (new type size in ems)

	New line-height value:
		13px x 1.3846 = 18px (old line-height)
		18px x 4 = 72px
		72px / 5 = 14.4px (new line height)
		14.4px / 11px = 1.27 (new line height in em's) */
	p.incr,
	.incr p								{ font-size: 11px; line-height: 14px; }

pre									{ margin: 18px 0 0; font: 11px 'andale mono', 'lucida console', monospace; line-height: 18px; white-space: pre; }

ol									{ list-style: decimal; }

ul									{ list-style: square; }

li									{ margin-left: 40px; line-height: 18px; }
	li ol,
	li ul								{ margin: 9px 0; }

dl									{ }
	dt									{ font-weight: bold; }
	dd									{ margin-left: 40px; }


/*	=TEXT-LEVEL SEMANTICS
---------------------------------------------------------------------------- */
em,
cite								{ font-style: italic; }

strong								{ font-weight: bold; }

small								{ font-size: 10px; }

code,
var,
samp,
kbd									{ font: 11px 'andale mono', 'lucida console', monospace; line-height: 18px; }

sup,
sub									{ font-size: 10px; line-height: 0; }
sup									{ vertical-align: text-top; }
sub									{ vertical-align: text-bottom; }

i									{ font-style: italic; }
b									{ font-weight: bold; }


/*	=EMBEDDED CONTENT
---------------------------------------------------------------------------- */
/* Remove that pesky whitespace below images, remember to float or provide width */
img									{ display: block; }


/*	=SPACING >> Adjust to match line-height
---------------------------------------------------------------------------- */
address,
p,
pre,
blockquote,
ol,
ul,
dl,
table,
form,
fieldset,
.box,
.module								{ margin-bottom: 18px; }


/*	=LINE-HEIGHTS >> Reset line-heights on inline elements to combatinheritance
---------------------------------------------------------------------------- */
a,em,strong,small,cite,dfn,abbr,
time,code,var,samp,kbd,i,b,mark,
ruby,rt,rp,bdo,span,ins,del			{ line-height: 1.0; }



/* ----------------------------------------------------------------------------
TITLE: Structure (grid)
	
	DESCRIPTION: Structure adopted from the 960 Grid System.
	
	960 Grid System ~ Core CSS.
	Learn more ~ http://960.gs/
	
	Licensed under GPL and MIT.
---------------------------------------------------------------------------- */
/* `Container >> 24 Columns
----------------------------------------------------------------------------------------------------*/
.container-24 {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}

/* `Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid-1,
.grid-2,
.grid-3,
.grid-4,
.grid-5,
.grid-6,
.grid-7,
.grid-8,
.grid-9,
.grid-10,
.grid-11,
.grid-12,
.grid-13,
.grid-14,
.grid-15,
.grid-16,
.grid-17,
.grid-18,
.grid-19,
.grid-20,
.grid-21,
.grid-22,
.grid-23,
.grid-24 {
	display: inline;
	float: left;
	margin-left: 5px;
	margin-right: 5px;
}

.push-1, .pull-1,
.push-2, .pull-2,
.push-3, .pull-3,
.push-4, .pull-4,
.push-5, .pull-5,
.push-6, .pull-6,
.push-7, .pull-7,
.push-8, .pull-8,
.push-9, .pull-9,
.push-10, .pull-10,
.push-11, .pull-11,
.push-12, .pull-12,
.push-13, .pull-13,
.push-14, .pull-14,
.push-15, .pull-15,
.push-16, .pull-16,
.push-17, .pull-17,
.push-18, .pull-18,
.push-19, .pull-19,
.push-20, .pull-20,
.push-21, .pull-21,
.push-22, .pull-22,
.push-23, .pull-23 {
	position: relative;
}

/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* `Grid >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.container-24 .grid-1 {
	width: 30px;
}

.container-24 .grid-2 {
	width: 70px;
}

.container-24 .grid-3 {
	width: 110px;
}

.container-24 .grid-4 {
	width: 150px;
}

.container-24 .grid-5 {
	width: 190px;
}

.container-24 .grid-6 {
	width: 230px;
}

.container-24 .grid-7 {
	width: 270px;
}

.container-24 .grid-8 {
	width: 310px;
}

.container-24 .grid-9 {
	width: 350px;
}

.container-24 .grid-10 {
	width: 390px;
}

.container-24 .grid-11 {
	width: 430px;
}

.container-24 .grid-12 {
	width: 470px;
}

.container-24 .grid-13 {
	width: 510px;
}

.container-24 .grid-14 {
	width: 550px;
}

.container-24 .grid-15 {
	width: 590px;
}

.container-24 .grid-16 {
	width: 630px;
}

.container-24 .grid-17 {
	width: 670px;
}

.container-24 .grid-18 {
	width: 710px;
}

.container-24 .grid-19 {
	width: 750px;
}

.container-24 .grid-20 {
	width: 790px;
}

.container-24 .grid-21 {
	width: 830px;
}

.container-24 .grid-22 {
	width: 870px;
}

.container-24 .grid-23 {
	width: 910px;
}

.container-24 .grid-24 {
	width: 950px;
}

/* `Prefix Extra Space >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.container-24 .prefix-1 {
	padding-left: 40px;
}

.container-24 .prefix-2 {
	padding-left: 80px;
}

.container-24 .prefix-3 {
	padding-left: 120px;
}

.container-24 .prefix-4 {
	padding-left: 160px;
}

.container-24 .prefix-5 {
	padding-left: 200px;
}

.container-24 .prefix-6 {
	padding-left: 240px;
}

.container-24 .prefix-7 {
	padding-left: 280px;
}

.container-24 .prefix-8 {
	padding-left: 320px;
}

.container-24 .prefix-9 {
	padding-left: 360px;
}

.container-24 .prefix-10 {
	padding-left: 400px;
}

.container-24 .prefix-11 {
	padding-left: 440px;
}

.container-24 .prefix-12 {
	padding-left: 480px;
}

.container-24 .prefix-13 {
	padding-left: 520px;
}

.container-24 .prefix-14 {
	padding-left: 560px;
}

.container-24 .prefix-15 {
	padding-left: 600px;
}

.container-24 .prefix-16 {
	padding-left: 640px;
}

.container-24 .prefix-17 {
	padding-left: 680px;
}

.container-24 .prefix-18 {
	padding-left: 720px;
}

.container-24 .prefix-19 {
	padding-left: 760px;
}

.container-24 .prefix-20 {
	padding-left: 800px;
}

.container-24 .prefix-21 {
	padding-left: 840px;
}

.container-24 .prefix-22 {
	padding-left: 880px;
}

.container-24 .prefix-23 {
	padding-left: 920px;
}

/* `Suffix Extra Space >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.container-24 .suffix-1 {
	padding-right: 40px;
}

.container-24 .suffix-2 {
	padding-right: 80px;
}

.container-24 .suffix-3 {
	padding-right: 120px;
}

.container-24 .suffix-4 {
	padding-right: 160px;
}

.container-24 .suffix-5 {
	padding-right: 200px;
}

.container-24 .suffix-6 {
	padding-right: 240px;
}

.container-24 .suffix-7 {
	padding-right: 280px;
}

.container-24 .suffix-8 {
	padding-right: 320px;
}

.container-24 .suffix-9 {
	padding-right: 360px;
}

.container-24 .suffix-10 {
	padding-right: 400px;
}

.container-24 .suffix-11 {
	padding-right: 440px;
}

.container-24 .suffix-12 {
	padding-right: 480px;
}

.container-24 .suffix-13 {
	padding-right: 520px;
}

.container-24 .suffix-14 {
	padding-right: 560px;
}

.container-24 .suffix-15 {
	padding-right: 600px;
}

.container-24 .suffix-16 {
	padding-right: 640px;
}

.container-24 .suffix-17 {
	padding-right: 680px;
}

.container-24 .suffix-18 {
	padding-right: 720px;
}

.container-24 .suffix-19 {
	padding-right: 760px;
}

.container-24 .suffix-20 {
	padding-right: 800px;
}

.container-24 .suffix-21 {
	padding-right: 840px;
}

.container-24 .suffix-22 {
	padding-right: 880px;
}

.container-24 .suffix-23 {
	padding-right: 920px;
}

/* `Push Space >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.container-24 .push-1 {
	left: 40px;
}

.container-24 .push-2 {
	left: 80px;
}

.container-24 .push-3 {
	left: 120px;
}

.container-24 .push-4 {
	left: 160px;
}

.container-24 .push-5 {
	left: 200px;
}

.container-24 .push-6 {
	left: 240px;
}

.container-24 .push-7 {
	left: 280px;
}

.container-24 .push-8 {
	left: 320px;
}

.container-24 .push-9 {
	left: 360px;
}

.container-24 .push-10 {
	left: 400px;
}

.container-24 .push-11 {
	left: 440px;
}

.container-24 .push-12 {
	left: 480px;
}

.container-24 .push-13 {
	left: 520px;
}

.container-24 .push-14 {
	left: 560px;
}

.container-24 .push-15 {
	left: 600px;
}

.container-24 .push-16 {
	left: 640px;
}

.container-24 .push-17 {
	left: 680px;
}

.container-24 .push-18 {
	left: 720px;
}

.container-24 .push-19 {
	left: 760px;
}

.container-24 .push-20 {
	left: 800px;
}

.container-24 .push-21 {
	left: 840px;
}

.container-24 .push-22 {
	left: 880px;
}

.container-24 .push-23 {
	left: 920px;
}

/* `Pull Space >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.container-24 .pull-1 {
	left: -40px;
}

.container-24 .pull-2 {
	left: -80px;
}

.container-24 .pull-3 {
	left: -120px;
}

.container-24 .pull-4 {
	left: -160px;
}

.container-24 .pull-5 {
	left: -200px;
}

.container-24 .pull-6 {
	left: -240px;
}

.container-24 .pull-7 {
	left: -280px;
}

.container-24 .pull-8 {
	left: -320px;
}

.container-24 .pull-9 {
	left: -360px;
}

.container-24 .pull-10 {
	left: -400px;
}

.container-24 .pull-11 {
	left: -440px;
}

.container-24 .pull-12 {
	left: -480px;
}

.container-24 .pull-13 {
	left: -520px;
}

.container-24 .pull-14 {
	left: -560px;
}

.container-24 .pull-15 {
	left: -600px;
}

.container-24 .pull-16 {
	left: -640px;
}

.container-24 .pull-17 {
	left: -680px;
}

.container-24 .pull-18 {
	left: -720px;
}

.container-24 .pull-19 {
	left: -760px;
}

.container-24 .pull-20 {
	left: -800px;
}

.container-24 .pull-21 {
	left: -840px;
}

.container-24 .pull-22 {
	left: -880px;
}

.container-24 .pull-23 {
	left: -920px;
}


/*	=CLEARING
---------------------------------------------------------------------------- */
/* http://sonspring.com/journal/clearing-floats */
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */
.clearfix:before,
.clearfix:after {
	content: '\0020';
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix:after {
	clear: both;
}