/*
THEME NAME: Night Sky
THEME URI: http://www.plaintxt.org/themes/sandbox/
DESCRIPTION: My unique theme with water colour night sky and autumn leaves. Code originally based off Sandbox Theme. Rich with powerful and dynamic semantic class selectors, Sandbox is a canvas for CSS artists
TAGS: widgets, sandbox, microformats, hcard, hatom, xoxo
VERSION: 1.5.2
AUTHOR: <a href="http://www.maemay.co.nz/">Rachel Radford</a> &amp; <a href="http://andy.wordpress.com/">Andy Skelton</a> &amp; <a href="http://www.plaintxt.org/">Scott Allan Wallick</a>
AUTHOR URI:
*/

/*
Styles for the Portfolio section of my website, an HTML5 document.
*/
/*plain HTML tags*/
header, footer, article, section{
	display: block;/*need this because no browser defaults for HTML5 yet */
}
body, html{
	padding: 0;
	margin: 0;
}
html{
	background:#c7e1e5 url(/wp-content/themes/night-sky/theme-images/bg_wash.jpg) repeat-x 0 -120px fixed;
}
body{
	font-family: Helvetica, Arial, sans-serif;
	text-align:center;
}
h1, h2, h3{
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-size:1.8em;
	color:#0b2f66;
	padding:0.1em 0 0.4em 0;
	clear: both;
}
h1 a:link, h1 a:visited{
	color:#0b2f66;
	text-decoration:none;
}
h1 a:hover, h1 a:active, .jdGallery h1 a{
	text-decoration:underline;
}
h1 span{
	font-size:0.4em;
}
h2 span{
	font-size:0.8em;
}
p, li, label{
	color:#333;
	line-height:1.5;
	font-size:0.8em;
	padding:0.3em 0;
}
.form-label{
	font-weight:bold;
	padding:0.4em 0 0 0;
}
li p, li li{
	font-size:1em;
}
blockquote{
	margin: 0;
	padding: 0 0 0 12px;
}
cite{
	display: block;
	text-align: right;
}
a:link, h1 span a:link{
	color:#19a4f3;
	text-decoration:underline;
}
a:hover, a:active, h1 span a:hover, h1 span a:active{
	text-decoration:none;
}
.skip-link, .skip-link a{
	position:absolute;
	left:-999em;
}
#container{
	position: relative;
	width: 960px;
	margin: 0 auto;
}
header, section, footer{
	text-align:left;
	position:relative;
}
header h1{
	clear: none;
	padding:65px 0 0 312px;
	margin: 0;
}
header #logo+p{
	text-align: right;
	color: #fff;
}
header a{
	color: #fff;
	text-decoration: none;
}
header a:hover{
	text-decoration: underline;
}
#logo{
	margin: 0;
	padding: 0;
}
#logo a{
	background:transparent url(/wp-content/themes/night-sky/theme-images/logo.png) no-repeat top left;
	width:298px;
	height:247px;
	text-decoration:none;
	text-indent:-999em;
	display:block;
	float: left;
}
nav{
	position:absolute;
	top:0;
	right:0;
}
nav li{
	list-style:none;
	float:left;
	height:169px;
	padding-left: 18px;
}
nav a{
	color: #fff;
}
section{ /*section is the 'page' or content area*/
	clear: both;
	background: no-repeat top left;
}
article{
	/*width: 216px;
	float: right;
	height: 1450px;*/
}
article h1, article header{
	float: right;
	width: 216px;
	clear: right;
}
article img{
	float: left;
	margin-right: -216px;
	margin-top: -90px;
}
article header{
	font-size: 11px;
	color: #333;
	margin-bottom: 12px;
}
article h1{
	margin-bottom: 0;
	padding-bottom: 0;
}
.pageid-191 article{/*pageid-191 is the portfolio home page*/
	width: 290px;	
	float: left;
	margin: 14px;
	padding: 12px 0;
	height: auto;
}
.pageid-191 article img{
	-moz-box-shadow: 1px 2px 6px #666;
	-webkit-box-shadow: 1px 2px 6px #666;
	box-shadow:  1px 2px 6px #6666;
	border: none;
	margin: 0;
}
.pageid-191 article a{
	display: block;
	padding: 5px;
	text-decoration: none!important;
	text-align: center;
}
article h2{
	font-size: 1.4em;
	margin: 0;
	padding: 12px 0 0 0;
}

article p{
	margin: 0;
	clear: right;
}
article a:hover h2{
	color: #c72f5d;
}
article a:hover img{
	-moz-box-shadow: 3px 3px 9px #666;
	-webkit-box-shadow: 3px 3px 9px #666;
	box-shadow: 3px 3px 9px #666;
}
section footer{ /*about me box*/
	background: rgba(255,250,240, 0.5) url(/img/rachelmaeradford.png) no-repeat top right;
	padding: 24px 318px 24px 24px;
	clear: both;
	margin: 20px;
	-moz-box-shadow: 3px 3px 9px #666;
	-webkit-box-shadow: 3px 3px 9px #666;
	box-shadow: 3px 3px 9px #666;
	min-height: 13em;
}
section footer img{
	float: right;
	margin: 0 0 0 24px;
}
section h3{
	clear: none;
	font-size: 1.2em;
	margin: 6px 0 0 0;
}
.nav-previous{
	float:left;
	font-weight: bold;
}
.nav-next{
	font-weight: bold;
	float:right;
}
.on a{
	font-weight: bold;
	cursor: default;
	text-decoration: none;
}
#girl{
	background:transparent url(/wp-content/themes/night-sky/theme-images/green-eyed-girl.png) no-repeat top left;
	width:192px;
	height:254px;
	padding:0;
	position:absolute;
	z-index:-1;
	bottom:0;
	left:53px;
}
#oldie{/*Alert message to all IE6 and below users*/
	background-color:#fef6c1;
	font-size:1.5em;
	border-bottom:2px solid #f9d76e;
}
#container>footer{
	text-align: center;
	padding: 12px 0;
	clear: both;
}
#container>footer small{/*The symantics of this tag have changed for HTML5 to accomodate legal information, disclaimers, etc.*/
	font-size: 11px;
	color: #666;
}
#container>footer a{
	color: #666;
}
#subnav{
	clear: both;
	text-align: center;
	margin-bottom: 0;
}
#subnav a{
	color: #0a4b83;
}
.previous{
	float: left;
}
.next{
	float: right;
}
/*different headings for different sections*/
.page #blog-heading, .single #portfolio-heading, .archive #portfolio-heading, .four04 #portfolio-heading{
	display: none;
}

/*blog layout*/
.post{
	text-align: left;
	background: rgba(255, 250, 240, 0.5);
	padding: 12px 24px;
	margin-top: 36px;
}
.post img{
	float: right;
	-moz-box-shadow: 1px 2px 6px #666;
	-webkit-box-shadow: 1px 2px 6px #666;
	box-shadow:  1px 2px 6px #6666;
	border: none;
	margin: 0 0 12px 12px;
}
.post .avatar, .post .wp-smiley{
	float: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow:  none;
	margin: 0;
}
.page-title{
	text-align: left;
	margin-bottom: 0;
	padding-bottom: 0;
}
.page-title span{
	font-size: 1em;
}
.archive-meta{
	position: absolute;
	left: -999em;
}
/* Main design and layout of maemay site */
/*Resetting margins and paddings - Eric Meyer

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, cite, code, ins, del, dfn, em, img, strike, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
/* remember to define focus styles! 
:focus {
	outline: 0;
}
/* remember to highlight inserts somehow! 
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup 
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*end reset*/
/*plain HTML tags
body{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	background:#c7e1e5 url(theme-images/bg_page.png) repeat-x top;
	text-align:center;
}
h1 a{
	background:transparent url(theme-images/logo.png) no-repeat top left;
	width:298px;
	height:247px;
	text-decoration:none;
	text-indent:-999em;
	display:block;
}
h2, h3{
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-size:1.8em;
	color:#0b2f66;
	padding:0.1em 0 0.4em 0;
}
h2 a:link, h2 a:visited{
	color:#0b2f66;
	text-decoration:none;
}
h2 a:hover, h2 a:active, .jdGallery h2 a{
	text-decoration:underline;
}
h2 span{
	font-size:0.4em;
}
#content h3, .jdGallery h2{
	clear:both;
	font-size:1em;
	padding-top:0.5em;
	font-size:1em;
}
h3 span{
	font-size:0.8em;
}
p, li, label{
	color:#333;
	line-height:1.5;
	font-size:0.8em;
	padding:0.3em 0;
}
.form-label{
	font-weight:bold;
	padding:0.4em 0 0 0;
}
li p, li li{
	font-size:1em;
}
a:link, h2 span a:link{
	color:#19a4f3;
	text-decoration:underline;
}
a:hover, a:active, h2 span a:hover, h2 span a:active{
	text-decoration:none;
}
.skip-link, .skip-link a{
	position:absolute;
	left:-999em;
}
#container{
	background:transparent url(theme-images/bg_wash.jpg) no-repeat top center;
}
#masthead{
	background:transparent url(theme-images/clouds.png) center top repeat-x;
	height:175px;
}
#header, #content, #footer{
	width:850px;
	margin:0 auto;
	text-align:left;
	position:relative;
	right:60px;
	z-index:5;
}
#header{
	margin-top:-35px;
	z-index:10;
	background:transparent url(theme-images/bg_header.png) no-repeat right bottom;
}
#header p{
	display:none;
}
#nav{
	position:absolute;
	bottom:85px;
	left:285px;
	height:169px;
}
#nav li{
	list-style:none;
	float:left;
	height:169px;
}
#nav li a{
	display:block;
	height:169px;
	text-decoration:none;
	text-indent:-999em;
	background:transparent no-repeat top;
}
#nav #home a{
	width:134px;
	background-image:url(theme-images/nav_home.png);
}
#nav #blog a{
	width:105px;
	background-image:url(theme-images/nav_blog.png);
}
#nav #portfolio a{
	width:100px;
	background-image:url(theme-images/nav_portfolio.png);
}
#nav #about a{
	width:145px;
	background-image:url(theme-images/nav_about.png);
}
#nav li a:hover{
	background-position:center;
}
/*Definitely not the best approach, but this allows for the "on" state in the nav using the dynamic classes in the Body 
.home #home a, .pageid-187 #blog a, .single #blog a, .archive #blog a, .pageid-186 #about a, .home #home a:hover, .pageid-187 #blog a:hover, .single #blog a:hover, .archive #blog a:hover, .pageid-186 #about a:hover, .home h1 a:hover, .pageid-191 #portfolio a, .pageid-191 #portfolio a:hover, .pageid-188 #portfolio a, .pageid-188 #portfolio a:hover, .pageid-193 #portfolio a, .pageid-193 #portfolio a:hover, .pageid-190 #portfolio a, .pageid-190 #portfolio a:hover{
	background-position:bottom;
	cursor:default;
}

#content, #footer{
	padding:0 100px 0 250px;
	width:500px;
	background:transparent url(theme-images/page.png) repeat-y right;
}
#content{
	min-height:380px;
}
#content img{
	float:right;
	margin:0.5em 0 0.5em 1em;
	border:2px solid #0b2f66;
}
#content .wp-smiley{
	border:none;
	float:none;
	margin:0;
}
img.avatar{
	display:none;
}
#content ul{
	margin-left:2em;
}
.hentry{/*Div wrapping around post entries on Home page
	padding-bottom:2em;
}
#extra{
	position:absolute;
	top:-70px;
	right:-90px;
	z-index:20;
	text-align:center;
	width:137px; /* IE7 needs the width set.  Other browsers set the width to the content when absolutely positioned.
	margin:0; /*Required for IE7 - was inheriting the margin set to auto horizontally.
}
#extra h2{
	width:137px;
	height:71px;
	text-indent:-999em;
	background:transparent url(theme-images/heading_photos.png) no-repeat top right;
	padding:0 0 0 1px;
}
.flickr_badge_image{
	background:url(theme-images/bg_photo.png);
	width:75px;
	height:75px;
	padding:5px 5px 5px 6px;
	margin:0 auto;
}
#content .flickr_badge_image img{
	border:none;
	float:none;
	margin:0;
}
#extra p{
	padding:0;
}
#extra p a{
	display:block;
	background:transparent url(theme-images/flickr.gif) no-repeat top right;
	text-indent:-999em;
	width:33px;
	height:21px;
	margin:0 auto;
	padding-left:45px;
}
.nav-previous{
	float:left;
}
.nav-next{
	float:right;
}
#category{
	float:left;
	width:45%;
}
#month{
	width:45%;
	float:right;
}
#divider{
	display:block;
	background:transparent url(theme-images/bg_footer.gif) no-repeat center;
	height:58px;
}
#footer div{
	width:30%;
	margin:0 0.8em 0 0;
	height:15em;
	float:left;
	padding-top:10px;
}
#footer h3{
	text-indent:-999em;
	background:transparent no-repeat top left;
	height:35px;
}
#more h3{
	background-image:url(theme-images/heading_moreposts.gif);
}
#cats h3{
	background-image:url(theme-images/heading_blogcategories.gif);
}
#mainnav h3{
	background-image:url(theme-images/heading_more.gif);
}
#mainnav{
	background:transparent url(theme-images/bg_hearts.gif) no-repeat top right;
}
#footer li, .archivelist li, #recipieslist li{
	list-style:none;
	padding:0.2em 20px;
	background:transparent url(theme-images/bullet_star.gif) no-repeat left top;
}
#rss{
	background:url(theme-images/rss_icon.gif) no-repeat left;
	padding-left:20px;
}
#copyright{
	clear:both;
	text-align:center;
	font-style:italic;
	padding:0.3em 0;
}
#footer #girl{
	background:transparent url(theme-images/girl.gif) no-repeat top left;
	width:177px;
	height:189px;
	padding:0;
	position:absolute;
	z-index:-1;
	bottom:0;
	left:50px;
}
#oldie{/*Alert message to all IE6 and below users
	background-color:#fef6c1;
	font-size:1.5em;
	border-bottom:2px solid #f9d76e;
}*/
