/**
 * Base styles for all media types
 * Resets various global properties, then applies a sane set of base styles.
 * Note that all sizing uses proportionate em units, rather than absolute pixels. These values inherit up from
 * the body, which is initialized at 10 pixels for convenience in working with the ems.
 */

/* Reset */


* {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	text-decoration: none;
	vertical-align: baseline;
	white-space: inherit;
}

/* Foundation */

html {
	/* CSS3 rule to make Firefox (and possibly others) always display the scroll bar, like Internet Explorer */
	overflow-y: scroll;
	white-space: normal;
}

body {
	/* Equivalent to 10px based off of browser default medium value of 16px - used to tame em values */
	font-size: 62.5%;
	/* Sizes are calculated along a maintained baseline grid where each line is 18 pixels high */
	line-height: 1.8em;
}

/**
 * Spacing and sizing
 * This section is concerned, primarily, with handling all sizes and line-related positioning as requisite for
 * maintaining the established baseline grid, while also applying a basic series of styles.
 * Hints:
 * Font size in pixels = font size in ems * 10 (the base font size inherited from body)
 * Line height in ems = base line height in pixels (18) / font size in pixels for the given element
 */

h1 {
	margin-bottom: 1em;									/* 18px */
	font-size: 1.8em;										/* 18px */
	line-height: 1em;										/* 18px */
}

h2 {
	margin-bottom: 1.125em;								/* 18px */
	font-size: 1.6em;										/* 16px */
	line-height: 1.125em;								/* 18px */
}

h3 {
	margin-bottom: 1.28em;								/* 18px */
	font-size: 1.4em;										/* 14px */
	line-height: 1.28em;									/* 18px */
}

h4 {
	font-size: 1.2em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

h5 {
	font-size: 1.4em;										/* 10px */
	line-height: 1.8em;									/* 18px */
}

h6 {
	font-size: 1.2em;										/* 8px */
	line-height: 2.25em;									/* 18px */
}

/* Note that only block level elements - other than divs - receive default font and line sizing. This is because,
	semantically, these elements (and their children) are the elements that, without design-specific styling,
	should be holding all text (divs, being for structure, should be responsible for holding other block-level
	elements, and should be style-free). Of course, the application of design-specific semantic id and class values
	can, and is expected to, create elements which will go unstyled. In these cases, the ids or classes should
	have their own	styling applied anyway, and so this limitation serves as a reminder during development. */

p,
address,
pre,
dl,
ol,
ul {
	margin-bottom: 1.5em;								/* 18px */
	font-size: 1.2em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

/* Forms are given font-related styling for the purpose of propogating it to children, but are otherwise
	treated as unstyled elements. Margin, padding, and others should be applied using fieldsets. */
form {
	font-size: 1.2em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

fieldset {													/* Assuming 12px parent... */
	margin: 1.5em 0;										/* 18px */
	/* Subtract the equivalent of 1 pixel from the bottom padding to make up for the border width */
	padding: 1.5em 0.75em 1.42em 0.75em;			/* 18px 9px 17px 18px */
	border: 1px solid #CCC;
}

legend {														/* Assuming 12px parent... */
	/* Left-side indent distance */
	margin-left: 0.75em;									/* 9px */
	/* Distance between contained text and surrounding fieldset borders */
	padding: 0 0.5em;										/* 6px */
}

label {
	/* The only value browsers seem to agree upon */
	vertical-align: bottom;
}

table {
	empty-cells: show;
	/* Reduced margin to accomodate borders */
	margin-bottom: 1.4em;								/* 16.8px */
	border-width: 1px 0 0 1px;
	border-style: solid;
	border-color: #CCC;
	/* Note: Still need cellspacing="0" in markup, which IS valid XHTML 1.1 */
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 1.2em;										/* 12px */
	line-height: 1.5em;									/* 18px */
}

th,
td {															/* Assuming 12px parent... */
	padding: 0 0.25em;									/* 3px */
	border-width: 0 1px 1px 0;
	border-style: solid;
	border-color: #CCC;
}

dl.answersList dd.correct {
	font-weight: bold;
	font-size: 1em;										/* 12px */
}

th,
thead td {
	text-align: center;
}

/* Fix XHTML 1.1-legal nesting cases */
dd ol,
dd ul,
dd form,
dd table,
li ol,
li ul,
li form,
li table,
th ol,
th ul,
th table,
th form,
td ol,
td ul,
td table,
td form,
form table {												/* Assuming 12px parent... */
	margin-bottom: 0;
	font-size: 1em;										/* 12px */
}

blockquote blockquote {
	font-size: 1em;
}

/**
 * Restored element-specific attributes
 */

h1,
h2,
h3,
h4,
h5,
h6,
strong,
th {
	font-weight: 700;
}

ul {															/* Assuming 12px parent... */
	margin-left: 2em;										/* 24px */
	list-style: disc outside;
}

ol{															/* Assuming 12px parent... */
	margin-left: 2em;										/* 24px */
	list-style: decimal outside;
}

dd {															/* Assuming 12px parent... */
	margin-left: 2em;										/* 24px */
}

cite,
dfn,
em {
	font-style: italic;
}

pre,
code,
kbd,
var,
samp {
	font-family: Monaco, 'Lucida Console', Courier, FreeMono, monospace;
}

pre {
	white-space: pre;
}

del {
	color: #666;
	text-decoration: line-through;
}

ins,
dfn {
	border-bottom: 1px solid #CCC;
}

dfn[title] {
	border-bottom: 1px dotted #CCC;
	cursor: help;
}

sup {															/* Assuming 12px parent... */
	font-size: 0.75em;									/* 9px */
	/* Stop Firefox and possibly others from adjusting surrounding line heights */
	line-height: 0;
	vertical-align: super;
}

sub {															/* Assuming 12px parent... */
	font-size: 0.75em;									/* 9px */
	/* Stop Firefox and possibly others from adjusting line heights to accomodate */
	line-height: 0;
	vertical-align: sub;
}

a:link {
	color: #36C;
	text-decoration: underline;
}

a:visited {
	color: #99C;
	text-decoration: underline;
}

a:hover {
	color: #C33;
	text-decoration: underline;
}

a:focus {
	outline: 1px dotted #666;
	color: #C33;
	text-decoration: underline;
}

a:active {
	color: #F00;
	text-decoration: underline;
}

acronym {													/* Assuming 12px parent... */
	text-transform: uppercase;
	letter-spacing: 0.1em;								/* 1.2px */
}

acronym[title] {
	border-bottom: 1px dotted #CCC;
	cursor: help;
}

a acronym {
	text-decoration: underline;
}

/* Don't let the information cursor override links, and remove redundant bottom border */
a acronym[title] {
	border: 0;
	cursor: pointer;
}

blockquote {												/* Assuming 12px parent... */
	padding-left: 2em;									/* 24px */
}

blockquote blockquote {									/* Assuming 16px parent... */
	padding-right: 2em;									/* 24px */
}
