/* 
	RESET 
	http://perfectionorvanity.com/reset.html
*/

abbr, address, article, aside, audio, b, blockquote, body, canvas, 
caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset,
figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup,
html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, 
object, ol, p, pre, q, samp, section, small, span, strong, sub, summary, 
sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video, hr {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	background-color: transparent;
}

article, aside, canvas, details, 
figcaption, figure, footer, header, 
hgroup, menu, nav, section, summary {
	display: block;
}

address, cite, q, dfn {
	font-style: normal;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: inherit;
}

a, ins, del {
	text-decoration: none
}

q {
	quotes: none;
}

q:after, q:before {
	content: "";
	content: none;
}

pre, code, var, samp, kbd {
	font-family: monospace, sans-serif;
}

/* fonts */
@font-face {
    font-family: 'PalatinoLinotypeRegular';
    src: url('fonts/pala.eot');
    src: url('fonts/pala.eot?#iefix') format('embedded-opentype'),
         url('fonts/pala.woff') format('woff'),
         url('fonts/pala.ttf') format('truetype'),
         url('fonts/pala.svg#PalatinoLinotypeRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'RalewayThin';
    src: url('fonts/raleway.eot');
    src: url('fonts/raleway.eot?#iefix') format('embedded-opentype'),
         url('fonts/raleway.woff') format('woff'),
         url('fonts/raleway.ttf') format('truetype'),
         url('fonts/raleway.svg#RalewayThin') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* basics */
body {
	background: #000 url(wallpaper.jpg) no-repeat center fixed;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-rendering: optimizeLegibility;
}

/* facebook */
div#facebook {
	background: url('facebook-hover.png') no-repeat transparent;
	opacity: 0.7;
	height: 444px;
	padding-left: 40px;
	padding-top: 10px;
	position: fixed;
	right: -265px;
	top: 150px;
	width: 252px;
	z-index: 100;
}

div#facebook:hover {
	opacity: 1;
}

/* header */
body > header {
	max-width: 46.875em;
	padding: 2.5em;
	margin: auto;
	overflow: hidden;
	padding-top: 3.75em;
	
}

body > header h1 {
	float: left;
	width: 37.33%;
	margin-left: 5.33%;
	display: block;
	background: transparent url(logo.png) no-repeat scroll 0%;
}

body > header h1 a {
	display: block;
	text-indent: -999em;
	width: 100%;
	height: 3.125em;
}

body > header h1 a:focus, div#content article.post header a:focus {
	outline: 0;
}

body > header nav {
	float: right;
	margin-right: 5.33%;
	width: 48%;
}

body > header nav ul li {
	float: left;
	width: 33.33%;
	margin-right: 0px;
	list-style: none outside none;
}


body > header nav ul li a {
	display: block;
	font: normal 1.625em/35px "RalewayThin", "Helvetica Neue", "Arial", sans-serif;
	color: #ccc;
}

body > header nav ul li span {
	font: italic 0.54em Georgia;
	text-transform: lowercase;
	display: block;
	color: #71788C;
}

body > header nav ul li a:hover {
	color: #fff;
}

#a11y {
	display: none;
	speak: normal;
}

/* content */
div#content {
	padding-top: 0;
	overflow: hidden;
	max-width: 46.875em;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 20px;
	border-top: 2px solid #A21E06;
	background: transparent url(bottom.png) no-repeat bottom;
	padding-bottom: 95px;
}

div#content > div {
	background: transparent url(post.png) repeat-y;
	padding-top: 20px;
}

div#content hr {
	height: 1px;
	width: 89.33%;
	margin: auto;
	color: #999;
	border-bottom: 5px solid #949494;
	opacity: 0.3;
}

div#content article {
	text-align: justify;	
	padding: 2.857em;;
	font-size: 0.875em;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	color: #aaa;
	
}

div#content article header h1 {
	color: #fff;
	font-size: 1.86em;
	line-height: 1.5em;
	font-weight: bold;
	color: #71788C;
	display: block;
	color: #fff;
	font-family: Arial, sans-serif;
	letter-spacing: -0.05em;	
}

div#content article header time {
	color: #999;
	display: block;
	font-family: "Century Schoolbook", Georgia, "Times New Roman", Times, serif;
	letter-spacing: 3px;
	margin-bottom: 2.67%;
	margin-top: 0;
	text-transform: uppercase;
}

div#content article p {
	margin-bottom: 2.67%;
	line-height: 1.5em;
	font-size: 1.2em;
	margin-right: 5px;
}

div#content article small {
    font-size: 0.8em;
    line-height: 1.5em;
	font-style: italic;
}

div#content article a {
	color: #E0E1E2;
}

div#content article a:hover {
	color: #EFEFEF;
}

div#content article.link p {
	padding: 2.857em;
	padding-top: 0;
	padding-bottom: 0px;
	padding-right: 0;
	color: #999;
	font: 0.875em/22px "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
}

div#content article p.permalink, div#content article p.permalink a { 
	display: inline;
	font-size: 1.2em;
	margin-left: 1.06%;
	color: #878787;
	padding: 0;
}

 div#content article.link header {
	margin-bottom: 2.67%;
}

div#content article.link h1 {
	display: inline;
	font-size: 1.2em;
	color: #999;
}

div#content article.link header h1:hover {
	color: #fff;
}

div#content article blockquote p {
	font-style: italic;
	margin-left: 5.33%;
}

div#content article ol {
	color: #999;
	font-style: italic;
	padding-left: 8%;
	margin-top: 20px;
	margin-bottom: 20px;
}

div#content article ol li p {
	padding: 0;
	margin: 0;
	font-style: normal;
	color: #aaa;
}

div#content article ol li {
	margin-bottom: 20px;
}

div#content ul.pagination {
	padding: 2.5em;
	padding-top: 20px;
}

div#content ul.pagination li {
	font-size: 1.86em;
	line-height: 1.5em;
	font-weight: bold;
	color: #71788C;
	display: block;
	color: #999;
	letter-spacing: -0.05em;	
}

div#content ul.pagination li.prev {
	width: 50%;
	float: left;
}

div#content ul.pagination li.next {
	float: right;
}

div#content ul.pagination li a { color: #999; opacity: 0.6; }

/* footer */
body > aside {
	border-top: 2px solid #A21E06;
	background: transparent url(bg.png) repeat-x;
	overflow: hidden;
	padding-bottom: 40px;
	padding-left: 100px;
}

body > aside div {
	max-width: 46.875em;
	padding: 2.5em;
	margin: 0px auto 20px;
}

body > aside section {
	float: left;
	width: 50%;
	font: 0.875em 'PalatinoLinotypeRegular', Georgia, "Times New Roman", serif;
	line-height: 1.6;
}

body > aside section a {
	color: #C7C7C7;
}

body > aside section p h1 { 
	color: #d7d7d7;
	font-size: 1em;
	font-weight: bold;
}

body > aside section p span {
	color: #fff;
}

body > aside section img {
	border: 3px solid #584F43;
	border-top: 4px solid #584F43;
	margin-top: 10px;
	opacity: 0.9;
	float: left;
	margin-right: 10px;
}

body > aside nav {
	float: left;
	margin-left: 26.67%;
	font: 0.875em "Trebuchet MS", Arial, Helvetica, sans-serif;
	width: 20%;
}

body > aside nav h1 { display: none; }
body > aside nav a { color: #71788c; }
body > aside nav li { margin-bottom: 5px; }
body > aside nav a:hover:before { content: '→ ';}
body > aside nav a:hover { color: #647698;  }

body > footer {
	clear: both;
	background: transparent url(bg.png) repeat-x;
	font: 0.875em "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding-bottom: 50px;
	text-align: center;
	color: #71788C;
}

body > footer p a {
	font-size: 13px;
	color: #555A6A;
}

/* responsiveness */
	/* wallpaper customization */
	@media screen and (max-width: 1280px) {
		body {
			background: #000 url(wallpaper-big.jpg) no-repeat center fixed;
		}
	}
	
@media screen and (max-width: 800px) {
	body > header nav, body > header h1 {
		clear: both;
    	width: auto;
    	float: none;
	}
  
	body > header h1 {
  		width: 280px;
  		margin: auto;
  		margin-bottom: 40px;
	}
	
	#facebook { display: none; }
}

@media screen and (max-width: 580px) {
	body > header nav {
		display: none;
	}
 
	body > aside section, body > aside nav {
 		clear: both;
    	width: auto;
    	float: none;
	}
 
	body > aside section {
 		display: none;
	}
 
	body > aside nav {
 		max-width: 46.875em;
 		margin: auto;
 		overflow: hidden;
	}
	
	body > aside nav ul li {
		float: left;
		width:50%;
	}
 
	body > header h1 {
		margin-bottom: 0px;
	}
	
	div#content article p {
		font-size: 0.875em;
	}
  
	body > aside {
 		padding-bottom: 0px;
	}
}