/**
* Typography; defining fonts, sizes colours and spacing.
*
*
* CONTENTS
* -------------------------
* =b basics
* =h headings
* =p paragraphs/copy/body-text/blockquotes
* =l lists
* =i inline elements
* =a anchors/links
* =t tables
* =f forms
* 
*/

/* =b basics
--------------------------------------------------------------------------------------------------*/
body {
	position: relative;
	font: normal normal 62.5%/1.5 Helvetica, "Helvetica Neue", Arial, sans-serif; /* 62.5% means a default font-size of 10px based upon 16px base-font */
	/* 
	Setting line-height, not using the font shorthand
	http://www.quirksmode.org/bugreports/archives/2006/09/Line_height_declaration_in_short_hand_form.html */
	line-height: 1.5;
	color: #000;
}
#container, #footer, #copyright {
	/*
	base font-size rendering on 12px
	Use http://riddle.pl/emcalc/ to calculate onwards */
	font-size: 1.2em;
}




/* =h headings
--------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6,
table caption, blockquote p,
.introduction {position: relative; zoom: 1;}

h3, h4, .product_item p.price,
blockquote, table caption, form legend,
form input.submit {
	margin: 0 0 0.8571em; /* 12px */
	font-size: 1.1667em; /* 14px */ line-height: 1.1429; /* 16px */ font-weight: normal;
}
h1, h2, h3, h4,
table caption, form legend,
#content h3 {
	color: #e51680;
}
h1, h2, form legend,
#product-builder .price,
body.blog h3#comments, body.blog h3#respond {
	margin: 0 0 0.6667em; /* 12px */
	font-size: 1.25em; line-height: 0.8889em; /* 16px */ font-weight: bold; text-transform: uppercase; letter-spacing: -1px;
}
h5, h6 {
	font-size: 1em;
}
h5 {
	font-weight: bold;
	margin-bottom: 1em;
}
h6 {
	margin-bottom: 0.333em;
}
#footer h3 {
	color: #fff; font-weight: bold;
}



/* =p paragraphs/copy/body-text/blockquotes
--------------------------------------------------------------------------------------------------*/
p, ul, ol, dl, pre, address, table {
	position: relative; zoom: 1;
	margin: 0 0 1.5em;
}
	.lede {
		margin-bottom: 0.25em;
	}
	p.caption,
	p.note, .note p,
	form p.hint,
	p.wp-caption-text {
		color: #777;
		font-size: 0.9167em; /* 11px */
	}
	p.entry-date, span.entry-date, span.note {
		margin: 0.6667em 0 0; /* 8px */
		color: #777;
	}
	p.sub-heading {
		margin-top: -0.5em;
	}

pre {
	padding: 4px 12px 5px;
	background: #cbcbcb;
	white-space: pre-wrap;
}
blockquote {}
	blockquote p {
		font-style: italic;
		margin-bottom: 0.5em;
	}
	
	/* these don't work, but it'd be nice to dream */
	blockquote p:nth-last-child(n-1)::before {
		content: "\201c"; /*open-quote*/
	}
	blockquote p:nth-last-child(n-1)::after {
		content:"\201d"; /*close-quote*/
	}
	
	blockquote p:first-child {
		text-indent: -0.5em;
	}
	blockquote p:first-child::before {
		content: "\201c"; /*open-quote*/
	}
	blockquote p:last-child::after,
	blockquote p.last::after,
	body.js blockquote p.last::after {
		content:"\201d"; /*close-quote*/
	}
	body.js blockquote p::after {
		content: ""; /*no-close-quote*/
	}
	blockquote p.citation {
		font: 0.75em/1.5 "Helvetica Neue", Helvetica, Arial, san-serif; text-align: right; color: #555; font-style: normal;
		margin: -0.5em 0 3em;
	}
	blockquote p.citation::before {
		content: "— ";
	}
	blockquote p.citation::after {
		content: "";
	}



/* =l lists
--------------------------------------------------------------------------------------------------*/
ul, ol {
	padding-left: 24px; margin-left: 0;
}
ul li {}
ol {
	margin-left: 0; padding-left: 24px;
	list-style-type: decimal;
	color: #E51680;
}
ol li * {
	color: #6E6D6E;
}
ul {
	list-style-type: square;
}
#content ul {
	padding-left: 5px;
}
#content ul li {
	padding-left: 10px;
	list-style: none;
	background: url(img/bullet.gif) no-repeat 0 7px;
}
#content #page-messages ul li,
#content ul.columns li,
#content ul li.product_item,
#content ul li.product_item li,
#content #product-builder ul li,
#account-navigation ul li,
#content .pages ul li,
#account-register-address-form ul li {
	list-style: none; padding-left: 0; background-image: none;
}
ol.footnotes {
	border-top: 1px dotted #ccc;
}
li h3 {
	margin-bottom: 0;
}

dl dt {
	font-weight: bold;
}
dl dd {
	margin-left: 1em;
}
dl dd p:first-child {
	margin-top: 0;
}
dl dd,
dl dd + dd,
dl dd + dd + dd,
dl dd + dd + dd + dd,
dl dd + dd + dd + dd + dd {
	margin-bottom: 1em;
}
dl dd + dd,
dl dd + dd + dd,
dl dd + dd + dd + dd,
dl dd + dd + dd + dd + dd {
	margin-top: -1em;
}





/* =i inline elements
--------------------------------------------------------------------------------------------------*/
abbr, acronym {}
strong {
	font-weight: bold;
}
em {
	font-style: italic;
}
img, a img, a:link img, a:visited img {
	display: block;
	border: 0;
}
img {
	margin-bottom: 1.5em;
}
code, kbd, var {
	font-family: Consolas, Lucida Console, Monaco, "Courier New", Courier, monospace;
}
sup {
	position: relative; top: 2px; left: 1px;
	font-size: 0.75em; /* 9px */
}
q {
	quotes:"\201C" "\201D" "\2018" "\2019";
}
	q:before {content:open-quote;}
	q:after {content:close-quote;}




/* =a anchors/links
--------------------------------------------------------------------------------------------------*/
a:link, a:visited, a:focus, a:hover, a:active {
	text-decoration: none; color: #e51680; font-weight: bold;
}
a:hover, a:focus,
.hovered a {
	text-decoration: underline;
}
.fitt {
	cursor: pointer;
}
.active a, .active a:focus, .active a:hover, .active a:active {
	color: #000; text-decoration: none;
}
#footer a:link, #footer a:visited, #footer a:focus, #footer a:hover, #footer a:active {
	color: #b3b3b3; font-weight: normal;
}
#copyright a:link, #copyright a:visited, #copyright a:focus, #copyright a:hover, #copyright a:active {
	color: #808080;
}