﻿/*RESET*/
html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: transparent;
}
h1,h2,h3,h4,h5,p,ul,ol,blockquote,body,figure,figcaption,button {margin: 0;	padding: 0;}
h1,h2,h3,h4,h5,p {font-size: inherit;}
li {display: block;}
textarea {font-family: inherit;font-size: inherit;}
a,button {color: inherit;}
a {text-decoration: none;}
button {
	overflow: visible;
	border: 0;
	font: inherit;
	letter-spacing: inherit;
	background: none;
	cursor: pointer;
	-webkit-font-smoothing: inherit;
}
::-moz-focus-inner {padding: 0; border: 0;}
img {max-width: 100%; height: auto; border: 0;}
/*RESET*/





/*ADS*/
.ad_bottom {margin: 1em auto 2em auto;}
.ad_right {display: none;}


@media screen and (min-width: 320px){
	.ad_bottom {	
		width: 320px;
		display: block;
	}
}

@media screen and (min-width: 468px){
	.ad_bottom {
		width: 468px;
	}
}


@media screen and (min-width: 728px){
	.ad_bottom {
		width: 728px;
	}
}
/*ADS*/






/*MAIN*/
html {box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}
		
body {
	font-size: 93.8%;
	font-family: Verdana, sans-serif;
	line-height: 1.65em;
	color: #333;
	background-color: #fff;
}

.wrapper_mob {margin: 0 1em;}

.inner {color: #fff; background-color: #488C03;background-image: url("images/noise.png");}

.menu {float: right; margin: 0.7em 0 0 0.5em;}

.hamburger {
	display: inline-block;
	background-color: #FCE9D4;
	padding:0.5em 0.75em;
	border-radius: 0.3125em;
}

.line {
	display: block;
	width:1.5em;
	height:0.22em;
	margin-top: 0.22em;
	background-color: #666;
	border-radius: 1px;
}
.line:last-of-type {margin-bottom: 0.22em;}

.books {display: none;}

header.top h1 {
	font-weight: normal;
	font-size: 1.45em;
	padding: 0.8em 0;
}

h1 span {font-weight: normal; color: #FFDCB2;}

h2 {font-size: 1.25em; margin: 0.5em 0;}

.share {display: none;}

article {
	padding-top: 0.5em;
	padding-bottom: 1.5em;
	}

article h1{
	font-size: 1.45em;
	line-height: 1.3em;
	color: #333;
	margin: 0.5em 0 0.1em 0;
}

article header p {padding-left: 0.2em;}

.text {min-height: 43em; margin-top: 1.25em;}
.text p {margin-bottom: 1.25em;}
.text a {color: #D12E51; text-decoration: underline;}
.res_img {max-width:35%;}

/*Pagination*/
.pagination  {
	background-color: #fff;
	text-align: center;
	margin-top: 0.5em;
}

.btn_big {font-size: 3.6em;}
.btn_small {font-size: 2.85em;}

.first_page,
.previous_page,
.next_page,
.last_page {
	display: inline-block;
	width: 1em;
	height: 1em;
	background-color: #666;
	line-height: 100%;
	position: relative;
	border-radius: 0.0625em;
	margin-right: 0.18em;
	color: #fff;
}

.disabled {background-color: #eee; border: 1px solid #ccc;}

.first_page span {
	width: 0;
	height: 0;
	position: absolute;
	top:0;
	left:0;
	border-width: .25em;
	border-style: solid;
	border-color: transparent #fff transparent transparent;
	top:25%;
	left:12.5%;
}

.first_page span:after {
	width: 0.04em;
	height: 0.5em;
	position: absolute;
	top:-.25em;
	left:0;
	background-color: #fff;
	content: "";
}

.last_page span {
	width: 0;
	height: 0;
	position: absolute;
	top:0;
	left:0;
	border-width: .25em;
	border-style: solid;
	border-color: transparent transparent transparent #fff;
	top:25%;
	left:37.5%;
}

.last_page span:after {
	width: 0.04em;
	height: 0.5em;
	position: absolute;
	top:-.25em;
	right:0;
	background-color: #fff;
	content: "";
}

.previous_page span {
	width: 0;
	height: 0;
	position: absolute;
	top:0;
	left:0;
	border-width: .25em;
	border-style: solid;
	border-color: transparent #fff transparent transparent;
	top:25%;
	left:10%;
}

.next_page span {
	width: 0;
	height: 0;
	position: absolute;
	top:0;
	left:0;
	border-width: .25em;
	border-style: solid;
	border-color: transparent transparent transparent #fff;
	top:25%;
	left:40%;
}


/*menu*/
#nav {
	background-color: #F9F4ED;
	margin-bottom: 2em;
	padding-top:0.3em;
}
#nav ul li {margin-bottom: 0.3125em;}

#nav ul li a {
	display: block;
	padding: 0.625em;
	color: #333;
	font-weight: bold;
}

#nav ul li ul {margin-top: 0.3125em;}
#nav ul li ul li a {
	padding-left: 1em;
	border-bottom: 1px solid #999;
}
#nav ul li ul li:last-of-type a  {
	border-bottom: 0;
}

#nav ul li ul li span {
	font-weight: normal;
	font-style: italic;
	font-size: 0.875em;
}

#nav ul li a.sections {
		background-color: #D12E51;
		color: #fff;
}




footer {
	background-color: #488C03;
	color: #fff;
	padding: 1em 0 0 0;
	background-image: url("images/noise.png");
}

.footer_links {display: table; margin: 0 auto;}

.footer_links a {
	display: inline-block;
	padding: 0.6em 1em;
	margin-left:1em;
}

.f3 {
	padding:2em 0;
	font-size: 0.875em;
	text-align: center;
}
.f3 a {padding:0.5em 0.2em;}


footer a {color: #fff;}



/*COMMON*/
.relative {position: relative;}
.center {text-align: center;}
.font_smaller {font-size: 0.938em;}

.quote {
background-color:#f5f5f5;
border-bottom: 0.25em double #cccccc;
border-top: 0.25em double #cccccc;
padding:0.5em;
margin-bottom:1em;
}

.works li {display: list-item;}
.works {
	margin-left:2em;
	padding:1em;
	margin-bottom:0.6em;
}
.bio li {margin-bottom: 1em;}
h2.bio a {
	text-decoration: none;
	color: #333;
}
h2.bio {margin-bottom:1em;}


/*News*/
.news {
	clear: left;
	padding: 1em 1em 2em 1em;
	background-color: #f5f5f5;
	border-top: 1px solid #666;
	
}

.news h3 {margin-bottom: 0.25em;}

.news img {
	float: left;
	padding: 0.5em 0.8em 0.3em 0;
}


/*Share Buttons*/
.share a:first-of-type {
	margin-right: 0.2em;
}

.s_link {
	display: inline-block;
	 text-decoration: none;
	 height: 1.8em;
	 position: relative;
}

.s_btn {
  display: inline-block;
  position: relative;
  margin:0;
  padding: 0;
  color: #fff;
  height: 100%;
  float: left;
 } 
  

.s_icon, .s_text, .s_count {
  float: left;
  height: 100%;
}

.s_icon {
  margin:0;
  padding: 0;
  border-right: rgba(255, 255, 255, 0.1) 1px solid;
  box-shadow: inset rgba(0, 0, 0, 0.1) -1px 0px 0px; 
  width: 1.8em;
}

.facebook svg {
	margin: 0.4em 0 0 0.3em;
	width: 1.5em;
	height: 1.5em;
}


.twitter svg {
	margin: 0.44em 0 0 0.375em;
	width: 1.1em;
	height: 1.1em;
}
 
  
 
.s_text {
  padding: 0.125em 0.7em 0 0.5em;
  font-size: 0.938em;
  display: none;
}

svg {fill: #fff;}


.facebook {
  background-color: #3B5998;
 }
  .facebook:hover {
	background-color: #345087;
}
	
	
.twitter {
  background-color: #21aded;
}
.twitter:hover {
	background-color: #1EA2DB;
}

.links li {margin-bottom:1.4em;}




/*MAIN*/






/*MediaQueries*/


@media screen and (min-width: 31em) {

	body {font-size: 100%;}
	.wrapper_mob {margin: 0 1.5em;}
	header.top h1 {font-size: 1.55em;}
	
	article  h1{font-size: 1.55em;}
	
	#nav ul li a {padding-left: 1.5em;}
	#nav ul li ul li a {padding-left: 2.5em;}

	
	.text p {text-indent: 2.5em;}
	
	.story {margin-left: 100px;}
	
	.footer_links a {padding: 0.2em 1em;}
	
	.share {
		float: right;
		display: block;
		margin-top: 0.2em;
	}
	
	
	
}




@media screen and (min-width: 46em) {

	.wrapper_mob {margin: 0 3em;}
	#nav ul li a {padding-left: 3em;}
	#nav ul li ul li a {padding-left: 4em;}
	
	.s_text {display: inline-block;}
	.share a:first-of-type {margin-right: 0.2em;}
	
}



@media screen and (min-width: 53em) {

	.wrapper_mob {margin: 0 2em;}
	#nav {border: 1px solid #E8E5D7;}
	#nav ul li a {padding-left: 2em;}
	#nav ul li ul li a {padding-left: 3em;}
	
	
	.outer {
		padding: 1em 0;
		background-color: #FCE9D4;
		margin: 0.9em 0 2em 0;
		background-image: url("images/noise.png");
	}
	

	.wilde_photo {
		width: 9em;
		height: 11.5em;
		position: absolute;
		top: -4.2em;
		left: -0.5em;
		background-image: url("images/wilde_photo7.jpg");
		background-size: 100%;
		background-position: left bottom;
		background-repeat: no-repeat;
		border: 0.5em solid #488C03;
		border-radius:50%;
		background-color: #f5f5f5;
		background-clip: padding-box;
	}
	
	
	
	header.top h1 {
		font-size: 1.8em;
		margin-left: 6em;
		
	}
	
	.menu  {margin: 1em 0 0 0;}
	
	
	article h1 {
		border-bottom: 1px dotted #333;
		font-size: 1.8em;
	}
	
	.share {margin-top: 0.3em;}

	
	.text, .pages, .page_controls {
		padding-right: 2.5em;
	}
	.pages {margin-top: 2em}

	.text_margin {
		margin-right: 120px;
	}
	
	.ad_bottom {
		margin-left: 1em;
	}
	
	.ad_right {
		float: right;
		display: block;
		margin-top: 1.25em;
		width: 120px;
		height: 600px;
		clear: right;
	}
	
	.bio li {margin-bottom: 0.5em;}
	
}




@media screen and (min-width: 56em) {

	.wrapper {
		max-width: 60em;
		margin: 0 auto;
	}
	
	.text_margin {
		margin-right: 160px;
	}
	
	.ad_right {
		width: 160px;
	}
}





@media screen and (min-width: 78em) {
	
	.wrapper {
		max-width: 74em;
	}
	
	.share {margin-top: 0.5em;}
	
	
	header.top h1 {
		font-size: 2em;
		margin-left: 5em;
	}
	
	.outer {
		margin: 0.9em 0 3.5em 0;
	}
	
	.wilde_photo {
		width: 10em;
		height: 12.5em;
		top: -4em;
		left: -2em;
	}
	
	.menu {display: none;}
	
	.books {
		display: inline-block;
		float: right;
		margin-top: 1.4em;
		border-radius: 1em;
		background-color: #F9F4ED;
		padding: 0.3em 1em;
		color: #666;
	}
	.books:hover {
		background-color: #FCFBF9;
	}

	
	#nav {
		position: absolute;
		top:0.5em;
		left:0;
		width: 17.9em;
		padding: 0;
		border: 0;
	}
	
	
	
	#nav ul li {
		margin: 0;
		position: relative;
		margin-top: 0.2em;
	}
	#nav ul li:first-of-type {margin-top: 0;}

	#nav ul li a {
		display: block;
		padding: 0;
		height: 2.2em;
		line-height: 2.2em;
	}
	
	#nav ul li a:hover {
		background-color: #E2DED7;
		color: #333;
	}
	#nav ul li ul li a.selected {
		background-color: #E2DED7;
	}
	

	#nav ul li ul, #nav ul li ul li {
		margin: 0;
		padding: 0;
	}

	#nav ul li ul li a {
		padding: 0;
		padding-left: 0.7em;
		font-weight: normal;
		border-bottom: 1px solid #999;
		margin: 0;
		text-overflow: ellipsis;
		white-space:nowrap;
		overflow: hidden;
	}
	
	#nav ul li ul li a:hover {
		margin: 0;
	}

	#nav ul li ul li span {
		display: none;
	}
	
	#nav ul li a.sections {
		color: #fff;
		padding-left: 0.5em;
		font-size: 0.938em;
		margin-right: 0em;
		margin-bottom:1px;
	}
	
	
	#nav ul li a.sections:hover {
		background-color: #B5364F;
	}
	


	.nav_margin {
		margin-left: 18.3em;
	}
	
	article {padding-top: 0;}
	article h1 {
		font-size: 2em;
	}
	
	
}






@media screen and (min-width: 88em) {

	.wrapper {
		max-width: 83em;
	}
	
	.text_margin {
		margin-right: 300px;
	}
	
	.ad_right {
		width: 300px;
	}

}	
	


@media print {
	header.top, nav, footer, .ad_bottom, .ad_right {display: none;}
}


