@import "fonts/fonts.css";

/* global */

html {
	background-color: rgb(97%, 97%, 97%);
	background-image: url(images/texture.gif);
}

i, cite, em, var, address {
	font-style: italic;
}

ol {
	list-style-type: decimal;
}

ul {
	list-style-type: disc;
}

body {
	padding: 1px 12% 3em;

	color: rgba(0, 0, 0, 0.8);
	text-shadow: 0 -1px 0 rgb(255, 255, 255);
		
	font-family: Libertine, Georgia, "New Century Schoolbook", "Nimbus Roman No9 L", serif;
	text-rendering: optimizeLegibility;
	font-size: 13pt;

	text-align: justify;
	line-height: 1.4;
}

html.ie6 body,
html.ie6 body,
html.ie7 body,
html.ie8 body {
	font-family: Georgia, "New Century Schoolbook", "Nimbus Roman No9 L", serif;
}

a {
	color: rgba(0, 0, 0, 0.95);
	text-decoration: none;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.33);
}

/*
html a,
*/
html.ie6 a,
html.ie7 a,
html.ie8 a,
html.ie9 a {
	text-decoration: underline;
}

a:hover {
	color: black;
	text-decoration: underline;

	position: relative;
	top: -1px;

	text-shadow: 0 2px 2px rgba(0, 0, 0, 0.33);
}

a:active {
	color: black;
	text-decoration: none;
	
	position: relative;
	top: 1px;
	
	text-shadow: 0 0 2px rgb(255, 255, 255);
}

h1, h2, h3, h4 {
	text-align: center;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

p {
	margin: 0.75em auto;
	text-indent: 0;
}

article p+p {
	text-indent: 4%;
}

article p.tagline {
	margin-left: 6%;
	margin-right: 6%;
	font-style: italic;
}

article p.tagline+p {
	text-indent: 0;
}

article img {
	display: block;
	max-width: 100%;
	height: auto;
	
	margin: 0 auto;
	
	-ms-interpolation-mode: bicubic;
}

hr {
	height: 3px;
	border: none;
	border-top-style: solid;
	border-bottom-style: solid;
	border-width: 1px;
	border-color: rgba(0, 0, 0, 0.1);
	width: 90%;
	
	background-color: rgb(97.5%,97.5%,97.5%);
	
	background-image: -webkit-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:    -moz-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:     -ms-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:      -o-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:         linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	
	margin: 0.5em auto;
}

div#posts > hr {
	margin: 2.5em auto;
}

article > time[pubdate] {
	display: block;
	text-align: center;
	margin: 0.5em auto 1em auto;
}

article blockquote {
	margin: 1em auto;
	margin-left: 4%;
	margin-right: 4%;
	padding: 0.75em 0.75em;

	border: solid 3px rgba(0,0,0,0.2);
	border-bottom-height: 5px;

	border-top-style: none;
	border-bottom-style: none;

	-webkit-border-image: url(images/paperframe.png) 3 3 5 3 stretch stretch;
	-moz-border-image: url(images/paperframe.png) 3 3 5 3 stretch stretch;
		-ms-border-image: url(images/paperframe.png) 3 3 5 3 stretch stretch;
		-o-border-image: url(images/paperframe.png) 3 3 5 3 stretch stretch;
			border-image: url(images/paperframe.png) 3 3 5 3 fill stretch;

	font-style: italic;
}

article blockquote p {
	text-indent: 0;
}

article aside.pullquote {
	margin: 1em auto;
	margin-left: 4%;
	margin-right: 4%;
	padding: 0.25em 0.75em;
	
	border-left: 3px solid rgba(0,0,0,0.2);
	border-right: 3px solid rgba(0,0,0,0.2);
	
	font-style: italic;
}

article figure {
	margin: 0;
}

article figure figcaption {
	margin-left: 4%;
	margin-right: 4%;
	text-align: right;
}

code, samp {
	font-family: Menlo, Monaco, Consolas, monospace;
	font-size: 75%;
}

code {
	display: block;

	margin: 1em auto;
	margin-left: 4%;
	margin-right: 4%;
	padding: 0.75em 0.75em;
	
	text-indent: 0;
	
	background: rgba(0,0,0,0.025);

	border: 3px solid rgba(0,0,0,0.2);
	border-radius: 7px;
	
	white-space: pre;
	white-space: pre-wrap;
}

article .framed-image,
article .framedImage {
	display: block;
	margin: 1em auto;
	
	background: rgb(50%, 50%, 50%);
	padding: 1px;
	border: 7px solid rgb(98%, 98%, 98%);
	border-radius: 7px;
	
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.53);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.53);
		-ms-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.53);
		-o-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.53);
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.53);
			
	max-width: 92%;
}

article .framed-image[align],
article .framedImage[align] {
	margin: 1em 1em;
}

div.entry-meta {
	margin: 1.0em auto;
	text-align: right;
}

div.entry-meta > div {
	margin: 0.25em auto;
}

div.entry-meta > div.tags {
	font-size: smaller;
}

footer {
	margin: 4em auto 1em;
	text-align: center;
	font-size: small;
}

footer #habari-colophon {
	margin: 1em auto;
	font-size: smaller;
}

article h1 {
	font-size: 133%;
	font-weight: bolder;
	margin-top: 2.5em;
}

article h2 {
	font-size: 120%;
	font-weight: bolder;
	margin-top: 2.2em;
}

article h3 {
	font-size: 110%;
	font-weight: bold;
	margin-top: 2.2em;
}

article h4 {
	font-weight: bold;
	margin-top: 1.5em;
}

sup {
	font-size: 70%;
}

a.footnoteBackLink {
	vertical-align: middle;
}

ol, ul {
	margin-left: 10%;
	margin-right: 10%;
}

/* home */

body#home header {
	text-align: center;
	margin: 0 auto;
	max-width:  30em;
}

body#home header a:active {
	color: inherit;
}

body#home header h1 {
	font-size: 3em;
	line-height: 0.9;
	margin-top: 1.5em;
}

body#home nav {
	width: 75%;

	padding: 0.5em;
	margin: 2em auto 3em;
	
	border-top-style: solid;
	border-bottom-style: solid;
	border-width: 1px;
	border-color: rgba(0, 0, 0, 0.1);

	background-image: -webkit-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:    -moz-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:     -ms-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:      -o-linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	background-image:         linear-gradient(right , rgba(0,0,0,0) 0%, rgba(0,0,0,0.025) 10%, rgba(0,0,0,0.025) 90%, rgba(0,0,0,0) 100%);
	
	text-align: center;
}
	
body#home nav > div {
	font-size: larger;
	text-align: center;
	display: inline-block;
	margin: 0 2.5em;
}

body#home article h1 {
	font-size: 1.2em;
}

body#home nav#pages .current-page {
	position: relative;
	font-weight: bold;
	font-size: 120%;
	top: 0.1em;
}

/* post */

body#post header {
	display: block;
	width: 100%;
	margin: 1.33333em 0;
	float: left;
}

body#post header nav h4 {
	margin: 0;
	display: block;
	float: left;
}

body#post header nav h4.notime {
	width: 100%;
}


body#post header nav time {
	margin: 0;
	display: block;
	text-align: right;
	font-style: italic;
}

body#post article h1 {
	font-size: 3em;
	line-height: 0.9;
	margin-top: 1.75em;
	margin-bottom: 1em;
	font-weight: normal;
}

body#post article {
	margin-bottom: 3em;
}

body#post #session-messages {
	text-align: center;
}

div#comments {
	margin-top: 3em;
	margin-bottom: 3em;
}

div#comments h1  {
	font-size: 120%;
	font-weight: bolder;
}

div#comments h2 {
	font-size: 110%;
	font-weight: bolder;
}

div#comments h3  {
	font-weight: bolder;
}

div#comments > h1  {
	margin-bottom: 1.5em;
}

div#comments .comment {
	margin: 1.5em;
}

div#comments hr {
	width: 75%;
}

div#comments .comment-meta  {
	text-align: center;
}

div#comments .comment-author,
div#comments .commentauthor {
	font-weight: bold;
}

div#comments .comment-title {
	font-style: italic;
}

div#comments .comment-title {
	font-style: italic;
}

div#comments form#comment-public {
	margin: 1.5em;
	text-align: left;
}

div#comments form#comment-public input,
div#comments form#comment-public textarea
{
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	
	width: 100%;
}

/* small screen (iPhone) */
@media only screen and (max-width: 690px) {
	body {
		padding-left: 5%;
		padding-right: 5%;
	}
	body#home header {
		margin: 0;
	}
	body#home header h1 {
		margin-top: 5%;
		font-size: 2em;
	}
	body#home nav {
		width: 100%;
		margin-top: 1em;
		margin-bottom: 1em;
		padding-left: 0;
		padding-right: 0;
	}
	body#home nav > div {
		margin: 0 1em;
	}
	body#post article h1 {
		font-size: 2em;
		line-height: 0.9;
		margin-top: 1.75em;
		margin-bottom: 1em;
	}
	body#post header nav {
		text-align: center;
	}
	body#post header nav h4 {
		margin: 0 auto;
		width: 210px;
		float: none;
		font-weight: bold;
		text-align: inherit;
	}
	body#post header nav time {
		margin: 0 auto;
		width: 230px;
		text-align: inherit;
	}
	div#comments .comment {
		margin-left: 0.5em;
		margin-right: 0.5em;
	}
	div#comments #comments-form {
		margin: 0;
	}
}