/*   
Theme Name: Christopher Miles, Version 6
*/




/* RESETS */


	html, body, p, div, ul, ol, li, img, h1, h2, h3, h4, h5, h6, blockquote, table, form
		{ margin: 0; padding: 0; }
	
	p, div, ul, ol, li, img, h1, h2, h3, h4, h5, h6, blockquote, table, a, span
		{ background-repeat: no-repeat; }
	
	hr { display: none; }
	
	body { -webkit-text-size-adjust: none; }
	



/* REUSABLES */


	.nav, .nav ul { list-style-type: none; list-style-position: outside; margin-left: 0; padding-left: 0; text-indent: 0; }
  
	.clear, .separator { clear: both; }
	
	.pad { margin-top: 20px; padding-top: 20px; }
  
	.sectionbreak { margin-top: 25px; border-top: 1px dotted #DDD; padding-top: 25px; }
  
	.notice { color: red; }
	



/* GENERAL TYPOGRAPHY */


	body { font-family: "Lucida Grande", sans-serif; line-height: 1.5; }

	p, ul, ol, blockquote { font-size: 13px; padding-bottom: 6px; margin-bottom: 6px; }
		
	ul { list-style-position: inside; text-indent: -20px; padding-left: 20px; }
		li { padding-bottom: 3px; margin-bottom: 3px; line-height: 1.4; }
			li ul { padding-bottom: 0; margin-bottom: 0; }
	
	blockquote { padding-bottom: 5px; margin-bottom: 15px; padding-left: 1em; padding-right: 1em; color: #555; border-left: 4px solid #CCC; }
		blockquote p:last-child { padding-bottom: 0; margin-bottom: 0; }
	

	/* Anchors */	
	
	a:link, a:visited { color: #743; text-decoration: none; }
	a:hover, a:active { text-decoration: underline; }

		a:link img, a:visited img { border: none; }
		img a:hover, img a:active { background-color: #EEE; border-bottom: none; }



	
	/* Other typography */

	code { font-size: 90%; }
	
	del a:hover, del a:active { cursor: default; text-decoration: none; }
		



/* GENERAL STRUCTURE AND PRESENTATION */


html {
	height: 100%;
	background-color: lemonchiffon;
	}

body {
	height: 100%;
	position: relative;
	}

.container { width: 960px; margin: 0 auto; position: relative; }




/* HEADER */


#header h1, #skiptocontent { position: absolute; left: -9999px; }




/* NAVIGATION */


#controls {
	width: 360px;
	position: absolute; top: 0px; right: 0;
	padding-bottom: 0;
	text-align: right;
	}

	#controls li { display: inline; font-size: 12px; font-family: Georgia, serif; text-transform: uppercase; letter-spacing: 2px; }
		
		#controls li a {
			padding: 15px 10px 5px 10px;
			color: #987;
			-webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px;
			-moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px;
			}

		#controls li a.selected {
			background-color: #987;
			color: white;
			}

		#controls small { font-size: 10px; }




/* MASTHEAD STYLES */


#masthead {
	width: 360px; 
	position: absolute; left: 590px; top: 60px;
	text-align: center;
	}

	#masthead a {
		display: block; width: 360px; height: 120px; margin-top: 25px; 
		background-image: url(masthead-paper.png);
		background-position: center center;
		}
		
	#masthead #versiondetails {
		width: 100px; height: 20px; margin: 0 auto; margin-top: 25px;
		background-image: url(masthead-versiondetails-paper.png);
		background-position: center center;
		}
	#masthead #device {
		width: 120px; height: 310px; margin: 0 auto; margin-top: 50px;
		background-image: url(masthead-device-paper.png);
		background-position: center center;
		}


	


/* SIDEBAR */


#sidebar {
	background-color: #987;
	text-align: center;
	color: white;
	background-image: url(sidebar-background-quatrofoil.jpg);
	background-position: top left;
	background-repeat: repeat;
	border-bottom: 1px solid #666;
	}

	#sidebar .primary,
	#sidebar .secondary { display: table; }

	#contents, #subscribe, #about {
		display: none;
		padding: 20px 0;
		}
		
		#sidebar .primary > div,
		#sidebar .secondary > div {
			display: table-cell;
			padding: 20px;
			border-right: 1px solid white;
			}
			
		#sidebar .primary > div:first-child,
		#sidebar .secondary > div:first-child { padding-left: 0; }
	
			#sidebar h2 { position: absolute; left: -9999px; }
			
			#sidebar .hidecontrols { position: absolute; top: -20px; right: 5px; }
				
			#sidebar h3 {
				font-family: Georgia, serif;
				font-size: 12px;
				text-transform: uppercase;
				letter-spacing: 2px;
				font-weight: normal; 
				padding-bottom: 10px; 
				}
				
			#sidebar p, #sidebar ul { font-size: 11px; }
			
			#sidebar a { color: white; } 
	
	
	/* Contents */
	
		/* Categories */

		#contents div.nav#categories { width: 460px; }
			#contents div.nav#categories h3 { position: absolute; left: -9999px; }
			#contents div.nav#categories p { font-size: 12px; font-family: Georgia, serif; text-transform: uppercase; font-weight: normal; letter-spacing: 2px; }
	
	#contents div.nav#months,
	#contents div.nav#search { width: 200px; }

		#contents div.nav#months h3,
		#contents div.nav#search h3 { padding-bottom: 5px; }
	

	#contents div.nav#search { border-right: none; padding-right: 0; }
		#contents div.nav#search #searchsubmit { display: none; }

	#contents div.nav#subscribe { width: 215px; border-top: 1px solid white; text-align: left; }
		#contents div.nav#subscribe h3 { background-image: url(feed-icon.png); padding-left: 20px; background-position: 0 0; }

		/* Index */

		#contents div.nav#index { width: 785px; border-top: 1px solid white; border-right: none; text-align: left; padding-right: 0; }
			#contents div.nav#index h3 a.selected { font-weight: bold; font-size: 11px; }
			#contents #index .subsection { width: 126px; float: left; padding-right: 8px; margin-right: 8px; }
				#contents #index .subsectionhead { font-weight: bold; font-size: 11px; text-transform: uppercase; }
				#contents #index .subsection.noentries .subsectionhead { position: absolute; left: -9999px; }
				#contents #index .subsectioncontents { margin-top: 2px; padding-top: 2px; }
					#contents #index li.indexitem { font-size: 10px; padding-bottom: 2px; margin-bottom: 2px; line-height: 1.4; text-indent: -5px; padding-left: 5px; }
	

	/* About */
	
	#about { text-align: left; }
	
	#about .primary #blurb { width: 75%; }
		#about #blurb big { font-size: 16px; }
		#about #blurb strong { font-family: Georgia, serif; text-transform: uppercase; font-weight: normal; letter-spacing: 2px; }

	#about .secondary div {
		border-top: 1px solid white;
		}

	#about #writingandediting,
	#about #websitedevelopment { width: 33%; }
	
		#about #writingandediting a,
		#about #websitedevelopment a { font-weight: bold; }
		

	#about div.vcard,
	#about #personal { border-right: none; }
	
	#about div.vcard { vertical-align: middle; }
	
	#about div.vcard .email {
		padding: 3px 5px;
		position: relative; left: -3px;
		background-color: white;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		color: #642;
		}

	#about #colophon { width: 100%; padding: 20px 0 0 0; border: none; color: #FAFAFA; }
		#colophon small { font-size: 10px; } 
		#colophon a { font-weight: bold; color: #FAFAFA; } 
		
	
	/* iPhone notice */
	
	div#iphonenotice { padding: 20px 0; }
	
		div#iphonenotice a {
		display: table-cell; width: 670px; margin: 0 auto;
		padding-left: 290px;
		background-image: url(iphonenotice-icon-250px.png);
		background-position: 20px center;
		text-align: left; vertical-align: middle;
		height: 270px;
		color: lemonchiffon;
		}
		
		div#iphonenotice a:hover, div#iphonenotice a:active { text-decoration: none; color: #FFF; }
		
		div#iphonenotice p {
			font-family: Helvetica, sans-serif; font-size: 96px; line-height: 72px;
			}

			div#iphonenotice p small { font-size: 36px; }

/* CONTENT */
	
#content {
	min-height: 99.8%;
	background-image: url(background-paper.png);
	background-position: top center;
	background-repeat: repeat-y;
	}

	#content h2.pagetitle { position: absolute; left: -9999px; padding-left: 80px; margin-top: 30px; padding-bottom: 50px; font-family: Georgia, serif; font-size: 24px; color: #CCC; letter-spacing: 1px; font-weight: normal; font-style: italic; }
		#content h2.pagetitle span { font-style: normal; text-transform: uppercase; font-size: 80%; letter-spacing: 3px; }
		#content h2.pagetitle tt { font: inherit; font-size: 90%; text-transform: capitalize; }
		/*#content h2.pagetitle:before { content: "{ "; } #content h2.pagetitle:after { content: " }"; }*/

	#blogtypething {
		min-height: 100%;
		width: 500px;
		padding-top: 80px; margin-right: 60px;
		background-color: #FFF;
		}


	/* Date headings */
	
	#content h3 {
		font-family: Georgia, serif; font-size: 12px; text-transform: uppercase; font-weight: normal; letter-spacing: 2px;
		text-align: right; color: #666; padding-bottom: 10px; margin-bottom: 20px; 
		margin-left: 80px; margin-top: 100px;
		border-bottom: 1px solid #BBB;
		}
		
		#content h2 + hr + h3 { margin-top: 50px; }

	
	/* Item box styles */
	
	#content .item { padding-left: 80px; padding-top: 10px; margin-bottom: 10px; background-position: 0 13px; position: relative; }
	
	#content .item + .item { margin-top: 20px; }
	
	#content .item.reading,
	#content .item.listening,
	#content .item.film,
	#content .item.tv { padding-top: 5px; margin-bottom: 5px; }
	
		body.single #content .item .post { margin-bottom: 30px; }
	
		


	/* Category icon styles */
	
	#content .item.blog { background-image: url(item-blog.png); } 
	#content .item.foundobject { background-image: url(item-link.png); }
	#content .item.link { background-image: url(item-link.png); }
	#content .item.micropost { background-image: url(item-tweet.png); } 

	#content .item.listening { background-image: url(item-listening.png); }
		body.single #content .item.listening { background-position: 0 10px; } 
		body.list #content .item.listening { background-position: 0 8px; } 

	#content .item.reading-roundup,
	#content .item.reading-review { background-image: url(item-reading.png); }
		body.list #content .item.reading-roundup,
		body.list #content .item.reading-review { background-position: 0 12px; }  
		body.single #content .item.reading-roundup,
		body.single #content .item.reading-review { background-position: 0 14px; }  

	#content .item.film { background-image: url(item-film.png); }
		body.list #content .item.film { background-position: 0 5px; } 
		body.single #content .item.film { background-position: 0 7px; } 

	#content .item.tv { background-image: url(item-tv.png); }
		body.list #content .item.tv { background-position: 0 7px; } 
		body.single #content .item.tv { background-position: 0 9px; } 

	#content .item.sitemaintenance { background-image: url(item-sitemaintenance.png); } 
	


	/* Item headings */
	
	#content .item h4 { font-size: 13px; padding-bottom: 6px; margin-bottom: 6px; }
	body.single #content .item.blog h4,
	body.single #content .item.link h4 { padding-bottom: 12px; margin-bottom: 12px; }

	#content .item.link h4 a[href^="http:"] { background: url(a-external.png) right center no-repeat; padding-right: 16px; }
	#content .item.link h4 a[href^="http://christophermiles.com.au"] { background: transparent; padding-right: 0px; }

		
	body.list #content .item.reading-review h4,
	body.list #content .item.reading-roundup h4,
	body.list #content .item.listening h4,
	body.list #content .item.tv h4,
	body.list #content .item.film h4 { font-size: 11px; color: #333; padding-bottom: 2px; margin-bottom: 2px; }
		

	/* Item date styles */
	
	#content p.itemdate { width: 50px; float: left; margin-right: -50px; padding-bottom: 0; margin-bottom: 0; color: #666; }

	body.list #content p.itemdate { position: absolute; left: -9999px; }

	body.single #content p.itemdate,
	body.list #content .item:hover p.itemdate { position: relative; left: -62px; }

		#content p.itemdate small { font-size: 9px; font-weight: normal; }
		#content p.itemdate a { color: #666; }


	/* Subheading styles */

	#content .item.blog h5 { font-size: 12px; color: #555; padding-bottom: 6px; margin-bottom: 6px; }
	#content .item.blog h5:first-child
	#content .item.blog p + h5 { margin-top: 9px; padding-top: 9px; }


	/* Item paragraph styles */

	#content .item p:last-child { padding-bottom: 0; margin-bottom: 0; }

	#content .item.blog .post img + p { margin-top: 10px; padding-top: 10px; }
	
		#content .item.blog .post .ranking { list-style-type: none; margin-top: 10px; padding-top: 10px; }
			
			#content .item.blog .post .ranking li { clear: both; padding-bottom: 10px; margin-bottom: 10px; }
				#content .item.blog .post .ranking.music li img { width: 60%; float: left; margin-right: 10px; }
				#content .item.blog .post .ranking.music li p { font-size: 11px; color: #555; }
					#content .item.blog .post .ranking li p span { display: block; font-weight: bold; }
					#content .item.blog .post .ranking.music li p.item { padding: 0; }
					#content .item.blog .post .ranking.music li p.item:before { content: "Song"; }
					#content .item.blog .post .ranking.music li p.creator:before { content: "Artist"; }
					#content .item.blog .post .ranking.music li p.work:before { content: "Album"; }

			
	body.list #content .item.foundobject .post p { font-size: 12px; }
	body.list #content .item.foundobject .post p { padding-left: 215px; }
	body.list #content .item.foundobject p.itemdate { padding-left: 0; }


	#content .item.micropost p { font-size: 12px; font-weight: bold; color: #444; }
		#content .item.micropost p strong { color: #222; border-bottom: 1px solid #222; }

	body.list #content .item.reading-roundup p,
	body.list #content .item.reading-review p,
	body.list #content .item.listening p,
	body.list #content .item.tv p,
	body.list #content .item.film p,
	body.list #content .item.sitemaintenance p
	 { font-size: 11px; padding-bottom: 2px; margin-bottom: 2px; line-height: 17px; }

	body.list #content .item.sitemaintenance p { color: #333; }


	#content .item.listening .post a + p { padding-right: 150px; }
	body.list #content .item.listening .post p strong { font-weight: normal; }

	body.single #content .item.listening p.itemdate { padding-right: 0; }


	/* Image and embedded media object styles */
	
	/*#content .item .post img { border: 1px solid #EEE; }*/
	
	#content .item.blog .post img { max-width: 420px; } 
		#content .item.blog .post img + small { color: #666; } 
			#content .item.blog .post img + small a { color: #754; }

	#content .item.blog .post object { width: 420px; } 

	#content .item.blog p.image { padding-bottom: 12px; margin-bottom: 12px; }
		#content .item.blog p.image small { color: #666; }

	body.list #content .item.foundobject .post img,
	body.list #content .item.foundobject .post object { width: 200px; float: left; height: auto; }

	body.single #content .item.foundobject .post img,
	body.single #content .item.foundobject .post object { width: 420px; margin-bottom: 6px; }

	.item.listening img { width: 140px; float: right; margin-top: 4px; }
	.item.reading-review img { width: 140px; float: right; margin-left: 15px; margin-bottom: 5px; -webkit-box-shadow: #DDD -2px 2px 5px; }
	body.list .item.reading-review .post img { margin-top: 5px; }


	/* Post footer / option styles */
	
	#content .morecontent {
		margin-top: 100px;
		padding-left: 80px;
		color: #666;
		}

		#content .morecontent p, #content .morecontent ul { font-size: 10px; margin-bottom: 25px; }
			#content .morecontent ul li { width: 33%; float: left; }
			#content .morecontent ul li:nth-child(2), #content .morecontent ul li.second { text-align: center; }
			#content .morecontent ul li:nth-child(3), #content .morecontent ul li.last { text-align: right; float: right; }
				#content .morecontent a { color: #666; }
				#content .morecontent a:hover { color: #333; }
				#content .morecontent a[href$="contents"],
				#content .morecontent .currentedition { font-weight: bold; }
				#content .morecontent ul li.tagfeed span { text-transform: uppercase; font-size: 90%; }

		.morecontent p { text-align: center; }

	
			


	/* Comments */

	#content .item div#comments { 
		margin-top: 30px; padding: 30px 20px 20px 20px; width: 400px;
		position: relative; left: -20px;
		background-color: #FFF; 
		color: #333;
		border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -khtml-border-radius: 20px;
		} 
	
		body.single .item.blog #comments ol { list-style-type: none; }
		
			body.single .item.blog #comments .comment { clear: both; margin-top: 20px; padding-top: 20px; padding-bottom: 20px; margin-bottom: 20px; }
			
			body.single .item.blog #comments .comment-body p { font-size: 13px; }
		
			body.single .item.blog #comments .comment-author.vcard { }
			
			body.single .item.blog #comments .comment-author { display: inline; padding-bottom: 6px; margin-bottom: 6px; }
			body.single .item.blog #comments .comment-meta { display: inline; float: right; font-size: 9px; line-height: 18px; }
			
			body.single .item.blog #comments .comment .avatar,
			body.single .item.blog #comments .comment .reply { display: none; }
		
			body.single .item.blog #comments cite { font-style: normal; font-size: 12px; font-weight: bold; color: #555; }
			body.single .item.blog #comments .says { display: none; }
		
			body.single .item.blog #comments .comment-meta + p { margin-top: 10px; border-top: 1px dotted #999; padding-top: 10px; }			
			

	/* Separators */
	
	#content hr + .separator { margin-left: 80px; border-top: 1px dotted #DADADA; margin-top: 25px; padding-top: 25px; }
	#content h3.date + hr + .separator { display: none; }

			

			
/* FOOTER */

	#footer { clear: both; margin: 120px 0 0 80px; padding-top: 120px; padding-bottom: 40px; width: 420px; text-align: center; }

		#footer img { margin-bottom: 40px; }
		
		#footer p { font-family: Georgia, serif; color: #666; font-size: 10px; text-align: center; }
			#footer p small { font-size: 100%; }
				#footer p a:link, #footer p a:visited { color: #666; border-bottom: 1px dotted #999; }
				#footer p a:hover, #footer p a:active { color: #000; border-bottom: 1px solid #666; text-decoration: none; }