/*****************
	Reset
*****************/
html,body,div,span,applet,object,iframe,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,label,legend,p,blockquote,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}body{line-height:1;color:black;background:white;}:focus{outline:0;}table{border-collapse:collapse;border-spacing:0;}caption,th,td{text-align:left;font-weight:normal;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul{list-style:none;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}blockquote:before,blockquote:after,q:before,q:after{content:"";}blockquote,q{quotes:"" "";}abbr,acronym{border:0;}

/*****************
	Fonts
*****************/
@font-face {
  font-family: 'League Gothic';
  src: url('../fonts/League_Gothic-webfont.eot?') format('eot'), url('../fonts/League_Gothic-webfont.woff') format('woff'), url('../fonts/League_Gothic-webfont.ttf') format('truetype');
}

/*****************
	Main Styling
*****************/
body {
	background: #F8F8F8;
	font-family: Helvetica Neue, Helvetica, Arial, Sans-serif;
	color: #595959;
}

#container {
	position: absolute;
	width: 100%;
	height: 100%;
}

a,
a:visited {
	color: #08C;
	text-decoration: none;
}

a:hover,
a:focus {
	text-decoration: underline;
}

img {
	max-width: 100%;
}

strong {
	font-weight: bold;
}

/*****************
	Left Panel
*****************/

section#left {
	position: fixed;
	width: 25%;
	height: 100%;
}

section#left header {
	padding: 1em;
}

section#left header h1 {
	font-weight: normal;
	font-size: 3em;
	font-family: 'League Gothic';
	/*text-transform: uppercase;*/
}

section#left header h1 a,
section#left header h1 a:visited {
	color: #000;
}

section#left header h1 a:hover,
section#left header h1 a:focus {
	text-decoration: none;
	color: #595959;
}

section#left header h2 {

}

section#left header nav {
	margin-top: 3em;
	font-size: 0.9em;
}

section#left header nav h3 {
	font-weight: bold;
	margin-bottom: 0.5em;
}

section#left header nav ul {
	margin-bottom: 1em;
}

section#left header nav ul li {
	padding-bottom: 0.4em;
	padding-left: 0.8em;
}

section#left header nav ul li a {
	color: #636363;
}

section#left footer {
	padding: 1em;
	color: #999;
	position: absolute;
	bottom: 0;
}

section#left footer span {
	font-size: 0.7em;
}

/*****************
	Center Panel
*****************/

section#center {
	float: left;
	width: 55%;
	margin-left: 25%;
	min-height: 100%;
}

article,
div#comments {
	padding: 3.5em;
	color: #595959;
	background: white;
	box-shadow: 0 0 15px rgba(0,0,0,0.2);
	margin: 1.5em 0;
	font-size: 0.9em;
	line-height: 1.5em;
}

article header a,
article header a:visited {
	color: #000;
}

article header a:hover,
article header a:focus {
	text-decoration: none;
	border-bottom: dotted 1px #000;
}

article header h1 {
	/*font-weight: bold;*/
	font-family: 'League Gothic';
	font-size: 2.4em;
	line-height: 1.2em;
	margin-bottom: 0.5em;
	color: #000;
}

article p {
	margin: 1em 0;
	text-align: justify;
}

article footer {
	font-size: 0.8em;
	color: #636363;
}

article footer a {
	color: #636363;
	border-bottom: dotted 1px #636363;
}

article footer a:hover,
article footer a:focus {
	text-decoration: none;
	color: #000;
	border-bottom: dotted 1px #000;
}

article figure {
	font-size: 0.7em;
	padding: 0;
	margin: 0;
}

article figure figcaption {
	padding-top: 1em;
}

article blockquote {
	margin-left: 30px;
	padding-left: 10px;
	border-left: 4px solid #CCC;
	line-height: 1.6em;
	font-size: 1.1em;
}

/*****************
	Right Panel
*****************/

section#right {
	float: left;
	width: 20%;
	height: 100%;
	text-align: center;
}

section#right aside {
	padding: 1em;
}

section#right h4 {
	font-weight: bold;
	font-size: 0.9em;
	color: #999;
	line-height: 1.3em;
}

section#right h4 a {
	color: #636363;
}

/**************************
	Media Queries
**************************/
@media only screen and (max-width: 890px), only screen and (max-device-width: 890px) {
	section#left {
		width: 200px;
	}

	section#left header h1 {
		font-size: 2em;
	}

	section#center {
		position: absolute;
		left: 200px;
		top: 0;
		width: auto;
		float: none;
		margin: 0;
	}

	section#right {
		display: none;
	}
}


@media only screen and (max-width: 600px), only screen and (max-device-width: 600px) {
	section#left {
		float: none;
		width: 100%;
		height: auto;
		position: relative;
		text-align: center;
	}

	section#left .recent {
		/* New for RWD...*/
		/* display: none; */
		text-align: left;
	}

	section#left header nav {
		/* New for RWD...*/
		/* display: none; */
		text-align: left;
	}

	section#left footer {
		display: none;
	}

	section#center {
		float: none;
		position: relative;
		left: 0;
	}

	section#center article {
		padding: 1.5em;
	}
}

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* NEW STUFF FOR RWD...*/
 
/* Debugging for RWD */  
/* @media screen and (min-width: 600px) {
	body {
	  background-color: lightblue;
	}
}
@media screen and (min-width: 800px) {
	body {
	  background-color: lightgreen;
	}
} */