/* ***************************************************************************************************************
	Global style for the entire article (fonts etc)
*/
div.article {
	font-family:		sans-serif;
	font-size:			1em;
}

/* ***************************************************************************************************************
	Define how the headings should look like
*/
#titleheading {
	margin-top: 		1.0em;
	margin-bottom: 		1.1em;
}

div.article h1 {
	font-size:			200%;
}

div.article h2 {
	font-size:			150%;
}

div.article h3 {
	font-size:			150%;
}

div.article h4 {
	font-size:			130%;
}

div.article h1, h2 {
	padding-top:		0.5em;
	padding-bottom:		0.2em;
}

div.article h1, h2, h3, h4, h5, h6 {
	border-bottom:		1px solid #AAA;
	display: 			block;
	font-weight:		normal;
	clear:				both;
}


/*
div.article P:first-letter {
	padding-left:	2.0em;
}
*/

/* ***************************************************************************************************************
	Define how the top quote looks like
*/
div.titlequote {
	margin-top:			1em;
	margin-bottom:		1em;
	margin-left:		2em;
	margin-right:		0em;
	width:				40em;
}

div.titlequote blockquote {
	font-style:			italic;
	font-size:			1.4em;
}
#titlequoteauthor {
	text-align:			right;
}

div.quote {
	margin:				2em;
	margin-left:		auto;
	margin-right:		auto;
	padding:			1em;
	width:				60%;
	background-color:	#F7F7F7;
}
div.quotetext {
	margin-left:		4em;
	margin-right:		2em;
	font-size:			1.1em;
	font-style:			italic;
}
div.quoteauthor {
	margin-top:			2em;
	padding:			1em;
	text-align:			right;
}

img.quote {
	width:				4.0em;
	float: 				left; 
	position: 			relative; 
	left: 				-1.5em; 
	top: 				-2em; 
}

/* ***************************************************************************************************************
	Define how various code segments should look like
*/
div.code pre {
	padding:			1em;
	font-family: 		Lucida Console, Courier New, Courier, monospace;
	font-size: 			80%;
	line-height:		100%;
	background-color: 	#f3f1f4;
	margin-bottom: 		0.5em;
	margin-top: 		0.5em;
	margin-left: 		2.0em;
	margin-right: 		2.0em;
	padding-top: 		0.5em;
	padding-bottom: 	0.5em;

	-moz-box-shadow: 	3px 3px 4px #777;
	-webkit-box-shadow: 3px 3px 4px #777;
	box-shadow: 		3px 3px 4px #777;
}

div.clisting {
	margin-top:			2em;
	margin-bottom:		2em;
	margin-left:		auto;
	margin-right:		auto;
	width:				90%;
}
div.listing {
	margin-bottom: 		0.5em;
	margin-top: 		0.5em;
	margin-left: 		2.0em;
	margin-right: 		2.0em;
	padding-top:		0.1em;
	padding-bottom:		0.1em;
	padding-left:		0.1em;
	padding-right:		0.1em;
}



/* ***************************************************************************************************************
	Images
*/
div.cimage {
	margin-top:			2em;
	margin-bottom:		2em;
	margin-left:		auto;
	margin-right:		auto;
	width:				70%;
	text-align:			center;
}

div.caption {
	margin-top:			1em;
	margin-bottom:		2em;
	margin-left:		auto;
	margin-right:		auto;
	width:				70%;
	text-align:			center;
	font-size:			0.9em;
	font-style:			italic;
}

/* ***************************************************************************************************************
	Drop Shadows
*/


.shadow {
	-moz-box-shadow: 	3px 3px 4px #777;
	-webkit-box-shadow: 3px 3px 4px #777;
	box-shadow: 		3px 3px 4px #777;
}

.dropshadow {
	-moz-box-shadow: 	3px 3px 4px #777;
	-webkit-box-shadow: 3px 3px 4px #777;
	box-shadow: 		3px 3px 4px #777;
}


/* ***************************************************************************************************************
	Wizard stuff
*/

div.wizard {
	/*background-image:		url(images/quote-close2.png);
	background-position: 	-5em -6em;
	background-repeat: 		none;*/
	width:					30%;
	float:					right;
	margin-top:				1em;
	margin-bottom:			1em;
	margin-left:			2em;
	margin-right:			1em;
	padding:				1em;
	background-color:		#D8F0FF;
}

div.wizard_inner {
	margin-left:			2em;
}

div.note {
	background-color:		#FFF76D;
	width:					30%;
	float:					right;
	margin-top:				1em;
	margin-bottom:			1em;
	margin-left:			2em;
	margin-right:			1em;
	padding:				1em;
}

div.note_inner {
	margin-left:			2em;
}

img.pin {
	width:					1.1em;
	float: 					left; 
	position: 				relative; 
	left: 					-0.5em; 
	top: 					-2em; 
}

img.paperclip {
	width:					1.5em;
	float: 					left; 
	position: 				relative; 
	left: 					-1.4em; 
	top: 					-1.5em; 
}



a.footnote {
	font-size:				0.8em;
}