/* 	Berty Reads 
	Version 4
	Created 11-12-12
*/
/* ------ colors ------ */
/* 	Header h1 - #666
	Nav active - #900
	Year - #900
	Book title, #900
	Book author #999
*/

/* ------ Some of the Eric Meyer Global Reset ------ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 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-weight: inherit; font-style: inherit; font-family: inherit; vertical-align: baseline;}
:focus {outline: 0;}
body {line-height: 1; color:  black; background: white;}
ol, ul {list-style: none;}

/* ----- layout ----- */
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	background-color: #fff;
	text-align: center;
	background: url(/images/pageTop.jpg) repeat-x;
	}
#container {
	position: relative;
	width: 80%; /*  app 860 px */
	margin: 0 auto;
	text-align: left;
	}
#padding {
	padding: 0 1.1627906976744186046511627906977%; /* 10px / 860px */
	}
#content {
	width: 95%; /* 860px / 860px */
	margin: 0 auto;
	}
#content {
	clear: both;
	}
hr {
	clear: both;
	}
/* ----- general tags and classes ----- */
h1 {
	float:left;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	font-size: 3.5em;
	color: #666;
	margin-top: 0.48571em;
	margin-bottom: 0.6em;
	/* to maintain the spacing - baseline em (1.7), divided by font for margin and height*/
	}
h2 {
	color: #666;
	font-size: 2.3em;
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 1.8em;
	padding-top: 0.5em;
	}
h3 {
	background: url(/images/yearTriangle.jpg) no-repeat left 55%;
	font-size: 2.1em;
	padding-left: 0.4em;
	font-weight: normal;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #900;
	line-height: 1.5em;
	}
#content li {
	line-height: 1.5em;
	font-size: 1.3em;
	}
#content li:nth-child(even) { 
	color: #999;
	margin-left: 1.5em;
	font-style: italic;
	}
#content ul {
	margin-left: 2.0em;
	}
hr {
	border: none;
	background-color: #fff;
	color: #fff;
	margin: 1.5em 15.0em 1.5em 15.0em;
	height: 1px;
	}
a:link {
	color: #069;
	background-color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	}
a:visited {
	color: #906;
	background-color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	}
a:hover, a:focus, a:active {
	color: #fff;
	background-color: #069;
	text-decoration: none;
	border-bottom: none;
	}

/* ------------ Global Nav ------------------- */
#gnav { 
	float: left;
	width: 100%;
	font-size: 1.5em;
	line-height: 1.0em;
	list-style: none;
	}
/* ------------ global nav styling ------------------*/
#gnav li {
	float: left;
	margin: 0;
	padding: 0;
	}
#gnav a {
	display: block;
	float: left;
	font-variant: small-caps;
	padding: 4px 10px; 
	border-bottom: none;
	border-radius: 3px;
	transition: all 0.2s ease-in-out;
	}
#gnav a:link, #gnav a:visited {
	color: #ccc;
	}
#gnav a:hover, #gnav a:focus, #gnav a:active {
    color: #fff;
	background-color: #900;
    }
/* ----------- "you are here" style for global nav ----------- */
body#loved #n-love a, body#liked #n-like a, body#okay #n-okay a, body#not #n-not a {
	color: #900;
	background-color: #fff;
	font-weight: bold;
	padding: 2px 10px;
	border-top: 2px solid #900;
	border-bottom: 2px solid #900;
	}
/* ---------- Media Queries Changes ----------- */

@media screen and (max-width: 768px) {
	body {
	background: url(/images/pagetop.png) repeat-x;
	}
	html {
	-webkit-text-size-adjust: none;
	} 
	#container {
	width: 99%;
	}
	#gnav a {
	padding: 4px 8px; 
	}
	#content li {
	line-height: 1.4em;
	font-size: 1.4em;
	}
	body#loved #n-love a, body#liked #n-like a, body#okay #n-okay a, body#not #n-not a {
	padding: 2px 8px;
	border-top: 2px solid #900;
	border-bottom: 2px solid #900;
	}


} /* -- end @media screen and (max-width: 768px) */

@media screen and (max-width: 520px) {
 	h2 span, li span {
	display: none;
	}
	h3 {
	font-size: 2.4em;
	}
	#gnav {
	font-size: 2.3em;
	}
	#content li:nth-child(even) { 
	color: #999;
	margin-left: 1.5em;
	font-size: 1.3em;
	font-style: italic;
	}

} /* -- end @media screen and (max-width: 520px) */


/* Check it, bleed. Bro... was ON! Didn't trip. But the folks was freakin', Man. Hey, and the pilots were laid to the bone, Homes. So Blood hammered out and jammed jet ship. Tightened that bad sucker inside the runway like a mother. Shit.
 */