  



/* the great Z-index index

	2	#header		the header should be on top of the .fimage

*/

/* 0. stuff outside of @media screen */

@media screen {

/* 1. initialisation */
* {
	border: 0;
	padding: 0;
	margin: 0;	
	background-color: none;
	text-decoration: none;
		-moz-font-smoothing: antialiased;
	box-sizing: border-box;
		-moz-box-sizing: border-box;
	transition: all .4s ease;
/*border: 1px solid red;*/
}

html {
	height: 100%;
	width: 100%;
	overflow-x: hidden; /**/ /* we don't want a scrollbar when the menu is visible */
}

/* 1.1. ensure default styling is inherted in <input> elements */
input,
textarea,
select {
	font: inherit;
	color: inherit;
}

/* 1.2. remove default styling from forms in webkit browsers and on iOS */
input:focus, textarea:focus, select:focus {  
	outline: none;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
	display: none;
}

/* 2. typography */
html {
	font-family: "Montserrat";
	color: #6d5532;
	line-height: 1.625em;
}

p {
	font-size: .85em;
	line-height: 1.9117647058824; /* keep constant line-height */
	margin-bottom: 13px;
}

/* 2.1. tables */
table {
	border-collapse: collapse;
}

th {
}

tr {
}

td {
}

/* 2.2. headings */
h1, h2, h3, h4, h5, h6 {
	font-family: "Montserrat", Verdana, sans-serif;
	color: #efb21b;
}

	#respond h1, #respond h2, #respond h3, #respond h4, #respond h5, #respond h6 {
		color: #6d5532;
	}

h1 {
	font-size: 1.5em;
	line-height: 1.0833333333333em;
	padding-top: 10px;
	margin-bottom: 4px;
}

	h1.title {
		font-size: 1em;
		font-weight: 400;
		padding: 0;
		margin: 0;
	}

h2 {
	font-size: 1.25em;
	line-height: 1.3em;
	padding-top: 11px;
	margin-bottom: 2px;
}

	h2.posttitle,
	h2.pagetitle {
		background-color: #efb21b;
		color: #ffffff;
		width: 104.1666666667%;
		margin-left: -2.08%;
		margin-right: -2.08%;
		padding: 0 2.08%;
		margin-top: 19px;
		font-size: 2em;
		padding-top: .625em; /* 20px; */
		padding-bottom: .5em;  /* 16px; */
		margin-bottom: 0em;
	}
	
	h2.pagetitle {
		background-color: #6d5532;
		margin-left: 0;
		margin-top: 0;
	}
	
		.archive .pagetitle {
			text-transform: capitalize;
		}

	.widget h2:nth-of-type(1) {
		color: #ffffff;
		width: 102.04081632653061224489795918367%;
		margin-left: -1.02%;
		margin-right: -1.02%;
		padding-top: 6px;
		padding-bottom: 5px;
		padding-left: 1%;
		margin-bottom: 15px;
	}
	
h3 {
	font-size: 1.15em;
	padding-top: 11px;
	margin-bottom: 2px;
}

h4 {
	font-size: 1em;
	padding-top: 12px;
	margin-bottom: 1px;
}

h5 {
	font-size: .9em;
}

h6 {
	font-size: .75em;
}

/* 2.3. anchors & links */
a {
	color: #efb21b;
	transition: none;
}

	.nav a {
		transition: all .4s ease;
	}

a:link {
	color: #efb21b;
}

	.posttitle a:link {
		color: #ffffff;
	}

	.commentslink a:link {
		color: #ffffff;
	}
	
	a[rel="tag"]:link {
		color: #ffffff; /* doesn't work? */
		background-color: #6d5532;
		margin-right: 1em;
		line-height: 1.625em;
		padding: 3px .375em;
		line-height: 3.25em;
		text-transform: uppercase;
	}
		
	a[rel="tag"]:after {
		content: ' ';
		display: inline-block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0.859375em 0 0.859375em 0.30769230769230769230769230769231em; /* 13.75 0 13.75 8*/
		border-color: transparent transparent transparent #6d5532;
		margin-left: .375em;
		margin-top: .8125em;
		position: absolute;
	}
	
	.excerptlink:link {
		color: #6d5532;
	}
	
	#respond a:link {
		color: #ffffff;
	}
	
a:visited {
	color: #efb21b;
}

	.posttitle a:visited {
		color: #ffffff;
	}
	
	p a:visited {
		color: #94712b;
	}
	
	a[rel="tag"]:visited {
		color: #ffffff;
	}
	
	a.post-edit-link:visited {
		color: #efb21b;
	}
	
	a.read-more:visited {
		color: #efb21b;
	}
	
	a.excerptlink:visited {
		color: #6d5532;
	}
	
a:hover, a:focus {
	color: #6d5532;
}

	.commentslink a:hover,
	.commentslink a:focus {
		color: #efb21b;
	}

	.title a:hover,
	.title a:focus {
		text-decoration: none;
		color: #ffffff;
		transition: all .4s ease;
	}
	
	a.excerptlink:hover,
	a.excerptlink:focus {
		color: #efb21b;
	}
	
	a[rel="tag"]:hover {
		background-color: #efb21b;
	}
	
	a[rel="tag"]:hover:after {
		border-color: transparent transparent transparent #efb21b;
	}
	
a:active {
	color: #ffffff;
	background-color: #efb21b;
	text-decoration: none;
}

	.commentslink a:active {
		color: #6d5532;
	}

	.title a:active {
		background-color: #efb21b;
		color: #6d5532;
	}
	
	a.social:active {
		background-color: transparent; /* to prevent orange blocks appearing when an .svg is a link */
	}
	
	a.excerptlink:active {
		color: #ffffff;
		background-color: #efb21b;
	}
	
/* 2.4. lists */
ul {
	font-size: .85em;
	/*line-height: 0.11948529411765em;*/
	margin-left: 1.25em;
	list-style: none;
	margin-bottom: 13px;
}

	.post-categories {
		margin-left: 0;
		color: #ffffff;
		background-color: #6d5532;
		width: 104.1666666667%;
		margin-left: -2.08%;
		margin-right: -2.08%;
		padding: 0 2.08%;
		height: 26px;
		font-size: .75em;
		text-transform: uppercase;
	}


	ul li {
	}
	
		.post-categories li {
			float: left;
		}
		
		.post-categories li ~ li {
			margin-left: 2em;
		}
	
	#pagewrap ul li:before {
		content: " ";
		display: block;
		position: absolute;
		background-color: #efb21b;
		margin-left: -1em;
		margin-top: .75em;
		width: .5em;
		height: .5em;
		display: inline-block;
		border-radius: .25em;
	}
		
	#pagewrap .post-categories li:before {
		display: none;
	}
	  
ol {
	font-size: .85em;
	/*line-height: 0.11948529411765em;*/
	list-style: none;
	*list-style: decimal; /* backup for IE<8 */
	counter-reset: li; /* sets up the counter for lis */
	margin-left: 1.25em;
	margin-bottom: 13px;
}

	ol li {
	}

	ol li:before {
		content: counter(li); /* outputs the content of the counter */
		counter-increment: li; /* increases the counter by 1 */
		position: relative;
		color: #efb21b;
		display: inline-block;
		width: 1em;
		font-weight: 700;
		margin-left: -1.5em;
		margin-right: .5em;
		text-align: right;
	}

/* 2.5. captions */
.wp-caption-text {
}

/* 2.6. forms */
#pagewrap form {
	color: #6d5532;
	width: 104.1666666667%;
	margin-left: -2.08%;
	margin-right: -2.08%;
	padding: 51px 2.08%;
	margin-top: 2.725em; /* 1.125em;*/
	margin-bottom: 2.725em;
}

.post form {
	background-color: rgba(239,178,27, .6);
}

.post form h1,
.post form h2,
.post form h3,
.post form h4,
.post form h5 {
	color: #6d5532;
}

#respond form {
	margin-top: 0em;
}

#pagewrap input[type=text],
#pagewrap input[type=email],
#pagewrap input[type=tel],
#pagewrap input[type=date],
#pagewrap input[type=file],
#pagewrap input[type=password],
#pagewrap textarea,
#pagewrap select {
	background-color: rgba(255,255,255, .6);
	margin-bottom: 13px; /* on top of the 13px for the p */
	padding: 13px;
	width: 70%;
	color: #6d5532;
}

#pagewrap textarea {
	min-height: 8.125em;
}

#pagewrap input[type=text]:focus,
#pagewrap input[type=text]:hover,
#pagewrap input[type=email]:focus,
#pagewrap input[type=email]:hover,
#pagewrap input[type=tel]:focus,
#pagewrap input[type=tel]:hover,
#pagewrap input[type=date]:focus,
#pagewrap input[type=date]:hover,
#pagewrap input[type=password]:focus,
#pagewrap input[type=password]:hover,
#pagewrap textarea:focus,
#pagewrap textarea:hover,
#pagewrap select:focus,
#pagewrap select:hover {
	background-color: #ffffff;
}

#pagewrap button,
#pagewrap input[type=submit] {
	color: #ffffff;
	background-color: #6d5532;
	min-width: 30%;
	display: inline-block;
	text-transform: uppercase;
	padding: 13px;
	text-align: left;
	cursor: pointer;
}

	#pagewrap .mejs-button button {
		min-width: 0;
		background-color: transparent;
		padding: 0;
	}

.entry button {
	float: none;
	font: inherit;
}

#pagewrap form button {
	float: left;
}

#pagewrap label {
	color: #ffffff;
	background-color: #6d5532;
	min-width: 30%;
	display: inline-block;
	text-transform: uppercase;
	padding: 13px;
	float: left;
}

#pagewrap .wpcf7-radio label {
}
	
#pagewrap .wpcf7-radio label:hover {
}
	
#pagewrap button:hover,
#pagewrap button:focus,
#pagewrap input[type=submit]:hover,
#pagewrap input[type=submit]:focus {
	background-color: #94712b;
	color: #efb21b;
}

#pagewrap button:active,
#pagewrap input[type=submit]:active {
	background-color: #efb21b;
	color: #6d5532;
}

/* 2.7. specific page templates (body class) */
/* 2.7.1. .search */

/* 2.8. blockquotes */
blockquote {
	background-color: #efb21b;
	color: #ffffff;
	width: 104.1666666667%;
	margin-left: -2.08%;
	margin-right: -2.08%;
	padding: 0 4.08%;
	margin-top: 19px;
	font-size: 1.15em;
	padding-top: 8px;
	padding-bottom: 10px;
	margin-bottom: 17px;
}

blockquote a:link {
	color: #ffffff;
}

/* 2.9. aside */
aside {
	color: #ffffff;
}

/* 3. layout */

/* 3.1. pagewrap */
#pagewrap {
	float: right;
	width: 99%;
	background-color: #ffffff;
	margin-left: 1%;
}

/* 3.2. header */
#header {
	width: 100%;
	height: 3em;
	margin-left: 0%;
	padding-right: 2%;
	position: relative;
	z-index: 2; /* above the fimage */
}

.title a {
	padding: 0.9375em 0 0.9375em 0;
	position: absolute;
	right: 2%;
}

.description {
	display: none;
}

/* 3.4. content */

/* 3.4.1. featured images */
.fimage {
	width: 100%;
	overflow: hidden;
	max-height: 30%;
	max-height: 40vh;
	line-height: 0;
}

.fimage img {
	width: 100%;
	height: auto;
}

/* 3.4.2. post */
.post,
.search .page {
	padding: 0 2%;
	margin-top: -1.1875em;
	margin-bottom: 3.25em;
}

.entry {
	margin-top: 43px;
}

/* 3.4.3. images */
.post img {
}

.post img.alignnone,
.post img.alignleft,
.post img.alignright,
.post img.aligncenter {
	/*width: 104.166666666667%;*/
	height: auto;
	/*margin-left: -2.08%;
	margin-right: -2.08%;*/
	/*background-color: #efb21b;*/
}

.post .wp-caption.alignnone,
.post .wp-caption.alignleft,
.post .wp-caption.alignright,
.post .wp-caption.aligncenter {
	/*width: 104.166666666667% !important;*/
	/*margin-left: -2.08%;
	margin-right: -2.08%;*/
	/*background-color: #efb21b;*/
	margin-bottom: 10px;
}

.post .wp-caption.alignnone:after,
.post .wp-caption.alignleft:after,
.post .wp-caption.alignright:after,
.post .wp-caption.aligncenter:after { /* add clearfix to contain the caption text in its div */
	content: "";
	clear: both;
	display: table;
} 

.post .wp-caption.alignnone img,
.post .wp-caption.alignleft img,
.post .wp-caption.alignright img,
.post .wp-caption.aligncenter img {
	/*width: 102.04081632653061224489795918367% !important;*/
	/*width: 100% !important;*/
	height: auto;
	border-top: 1vw solid #efb21b;
}

/* 3.4.4. captions */
.wp-caption-text {
	float: left;
	padding-left: .25em;
	padding-top: 4px;
	color: #6d5532;
}

/* 3.4.5. galleries */

/* Unfortunately, WordPress injects lots of inline styling into the standard galleries. Since I don't know well how to change this, we'll be seeing a lot of !important to override the inlines. */

.gallery {
	background-color: rgba(239,178,27,.2);
	padding: .25em .25em .25em .25em;
	margin-bottom: 1em !important;
	line-height: 0;
}

.post-template-default .gallery {
	display: flex;
	flex-wrap: wrap;
}

.gallery-caption {
	line-height: 1.5em;
}

.gallery dl {
}

.gallery dt {
	padding: .25em .25em .25em .25em;
}

.gallery-columns-3 .gallery-item {
	width: 33.333333% !important;
}

.gallery-columns-2 .gallery-item {
	width: 50% !important;
}

.post-template-default .gallery {
	display: flex;
	align-items: center;
}

.gallery-item img {
	border: 0 !important;
}

.gallery img {
	width: 100%;
	height: auto;
}

.gallery-item {
	margin-top: 0 !important;
}

/*
.gallery {
	width: 104.16666666667%;
	background-color: #efb21b;
	padding: 4px 0 0 0;
	padding: 1vw 0 0 0;
	line-height: 0;
	margin: 1.625em -2.08% !important;
}

.gallery-item {
	margin: 0 !important;
	width: 33.33333% !important;
	height: 33vw !important;
	overflow: hidden;
	padding-right: 0;
	border-right: 4px solid #efb21b;
	border-right: 1vw solid #efb21b;
	padding-bottom: 1vw;
	border-bottom: 4px solid #efb21b;
	border-bottom: 1vw solid #efb21b;
}


.gallery .landscape img {
	height: 33.333333%;
	height: 33.333333vw;
	width: auto;
	margin-left: -20%;
}

.gallery .portrait img {
	width: 33.333333%;
	width: 33.333333vw;
	height: auto;
	margin-top: -20%;
}

.gallery-item img {
	border: 0 !important;
}

.gallery img:hover {
	opacity: .6;
}

.gallery-caption {
	display: none;
}*/

/* 3.4.6. respond */
#respond {
	padding: 0 2%;
	padding-top: 26px;
	background-color: rgba(239,178,27, .6);
	margin-bottom: -44px;
}

#comments,
.commentlist {
	display: none;
}

/* 3.4.7. meta */
body.page .time,
.page .commentslink {
	display: none;
}

.time,
.commentslink {
		padding: 0 2%;
		position: absolute;
		right: 0;
		font-size: .75em;
		height: 2.16666666667em; /* 1.625em */
		line-height: 2.16666666667em; /* 1.625em */
		width: auto;
}

	.time {
		background-color: #ffffff;
		color: #6d5532;
		margin-top: -2.16666666667em; /* 1.625em */
	}
	
	.search .time {
		background-color: transparent;
		color: #ffffff;
	}
	
	.commentslink {
		background-color: #6d5532;
	}
	
	.commentslink img {
		width: 1.625em;
		height: auto;
		margin-right: .5em;	
		padding-top: .5em;
		float: left;
	}

.search .time,
.blog .time {
	margin-top: -3.25em; /* -39px;*/
}

.search .page .time {
	margin-top: 0;
	width: 99%;
	background-color: #6d5532;
	text-align: right;
	margin-left: 2%;
}

.search .commentslink,
.blog .commentslink {
	margin-top: -1.25em;
}

/* 3.5. aside */
aside {
	padding: 1.625em 2%;
	/*margin-top: 27px;*/
	display: block;
}

.widget {
	margin-bottom: 1.625em;
}

.socialicon {
	width: 2em;
	/*float: left;*/
	margin-right: 1em;
	display: inline-block;
}

aside svg path {
	fill: #ffffff !important;
}

aside svg:hover path {
	fill: #efb21b !important;
}

/* 3.5a. nav */
.navigation {
	display: flex;
	justify-content: space-between;
	margin-bottom: 3.25em;
}

.navigation button {
	font-family: "Montserrat";
	font-size: 1em;
}

#pagewrap .navigation button:empty {
	display: none;
}

/* 3.6. footer */
#footer {
	background-color: #efb21b;
	color: #6d5532;
	padding: 12px 1% 0 1%;
}

.copyright {
	font-size: .75em;
}

/* 3.7. specific pages */
/* 3.7.1. .search */
.search .entry .thumb {
}

/* 3.7.2. .archive */
.archive .entry .fimage {
	width: 104%;
	margin-left: -2%;
	margin-right: -2%;
	margin-top: -43.5px;
	margin-bottom: 1.625em;
}

.archive .pagetitle {
	color: #6d5532;
	background-color: #ffffff;
}

/* 3.7.2. .catergory-portfolio */
body.category-portfolio .commentslink {
	display: none;
}

body.category-portfolio .time {
	margin-top: -.0625em;
}

/* 4. navigation */
.nav {
	width: 61%;
	height: 100%;
	background-color: #efb21b;
	margin-left: -69%;
	position: fixed;
	z-index: 10;
	display: inline-block;
	float: left;
	padding-top: 6px;
	overflow-x: hidden;
}

/* 4.1. search */
#search {
	background-color: #ffffff;
	border-radius: 5px;
	min-height: 26px;
	margin: 5px .5em 8px .5em;
}

#search .screen-reader-text {
	display: none;
}

#s {
	width: 80%;
	margin: 0 0 0 .5em;
	background-color: transparent;
}

#searchsubmit {
	float: right;
	margin-right: .5em;
	min-width: 1em;
	z-index: 100;
	background-color: transparent;
	color: #6d5532;
	font-family: "Montserrat", Verdana, sans-serif;
}

#searchsubmit:hover {
	cursor: pointer;
	color: #efb21b;
}

/* 4.2. actual menu */
.nav ul {
	font-size: 1em;
	margin-left: 0;
}

.nav ul li {
}

.nav a,
.nav a:link,
.nav a:visited {
	color: #6d5532;
	display: block;
	padding: .375em 0 .4375em 1em;
}

.nav a:hover,
.nav a:focus {
	background-color: #6d5532;
	text-decoration: none;
	color: #ffffff;
}

.nav a:active {
	background-color: #ffffff;
	text-decoration: none;
	color: #6d5532;
}

/* 4.3 visibility toggle */
input.menu-toggle {
	display: none;
}

label.menu-toggle {
	z-index: 10; /* above ebburythink! */
	position: fixed;
	left: 1%;
	border-left: .5em solid transparent;
	padding: 0.6875em 1em 0.6875em 1.5em;
	background-image: url(images/hamburger.svg);
	background-size: 1.25em;
	background-repeat: no-repeat;
	background-position: 0 50%;
	color: #efb21b;
	background-color: rgba(109,85,50,.6);
}

label.menu-toggle:after {
	content: "menu";
	position: relative;
	overflow: hidden;
}

label.menu-toggle:hover {
	cursor: pointer;
}

label.menu-toggle:active {
	background-color: #efb21b;
	color: #6d5532;
}

.menu-toggle:checked ~ label { /* change and move the toggled label */
	margin-left: 60%;
	background-image: url(images/cross.svg);
	width: 0;
	padding-right: .5em;
}

	.menu-toggle:checked ~ label:after {
		content: " ";
		width: 0;
		height: 0;
	}

.menu-toggle:checked ~ .nav { /* move the toggled menu to the right */
	margin-left: 0%;
}

.menu-toggle:checked ~ #pagewrap {
	margin-right: -60%;
}

/* 4.4. link behaviour */

/* --== TO DO ==--

   There is a kind of buggy behaviour here: because the links are 100% width of the navigation (as they should be when the menu is open), they still react to being hovered over when the menu is closed.
   Although the chance of this popping up is very, very low (at the screen sizes using the collapsing menu, the device is rather certainly a touch-based one), it might be a good idea to give the .nav a padding-right when the menu is collapsed. */

/* 5. background */

/* 5.1. regular backgrounds */
html {
	background-color: #efb21b;
}

#header {
	background-color: #6d5532;
}

aside {
	background-color: #6d5532;
}

/* 5.2. testing backgrounds */
html {
	/*background-color: transparent;/**/
}

body {
	/*background-image: url(images/grid.gif);
	background-position: 0 0px;/**/
}

#pagewrap {
	/*background-color: transparent;/**/
}

/* 6. fixes and hacks */

/* 6.1. clearfix */
.clearfix:before,
.clearfix:after,
.pagewrap .wpcf7:before,
.pagewrap .wpcf7:after {
	content: "";
	display: table;
}

.clearfix:after,
.pagewrap .wpcf7:after {
	clear: both;
}

.clearfix
.pagewrap .wpcf7 {
	zoom: 1;
}

/* 6.2. Android fix for checkbox hack */
body { 
  -webkit-animation: bugfix infinite 1s; 
}
} /* END screen media */

@-webkit-keyframes bugfix { 
  from {padding:0;} 
  to {padding:0;} 
}

/* 6.3. Android */

/* 7. size queries */

/* ancient-mobile-ish       320-639px
   modern-mobile-ish		640-1023px
   laptop-ish				1024-px
   desktop-ish				px

/* == 7.1 modern mobile-ish == */
@media only all and (min-width: 640px) {
#header {
/*background-color: rgba(255,0,0,.7); /* let's be clear about where we are. */
}

/* 2. typography */
p {
	font-size: 1em;
	line-height: 1.625em;
}

/* 2.2. headings */
h1 {
	font-size: 2em;
	line-height: 0.8125em;
	margin-bottom: 5px;
}

	h1.title {
		font-size: 1.5em;
		font-weight: 400;
		margin-top: -.375em; /*-9px;*/
	}

h2 {
	font-size: 1.5em;
	line-height: 1.0833333333333em;
	padding-top: 10px;
	margin-bottom: 4px;	
}

	h2.posttitle {
		width: 112%;
		margin-left: -5.7%;
		margin-right: -5.7%;
		padding: .625em 5.7% .5em 5.7%;
	}
	
	h2.pagetitle {
		padding-left: 5%;
		padding-right: 5%;
	}

	.widget h2:nth-of-type(1) {
		width: 222.52222222%;
		margin-left: -11.4%;
		margin-right: -11.4%;
		padding-left: 11.4%;
	}

h3 {
	font-size: 1.25em;
	line-height: 1.3em;
	padding-top: 11px;
	margin-bottom: 2px;
}

h4 {
	font-size: 1.15em;
	padding-top: 11px;
	margin-bottom: 2px;
}

h5 {
	font-size: 1em;
	padding-top: 12px;
	margin-bottom: 1px;
}

h6 {
	font-size: .9em;
}

/* 2.4. lists */
ul {
	font-size: 1em;
}

	#pagewrap ul li:before {
		margin-top: .575em;
	}
	
	.post-categories {
		width: 112%;
		margin-left: -5.7%;
		margin-right: -5.7%;
		padding-left: 5.7%;
		padding-right: 5.7%;
	}
	
ol {
	font-size: 1em;
}

/* 2.6. forms */
#pagewrap form {
	width: 111.11111111%;
	margin-left: -5.7%;
	margin-right: -5.7%;
	padding-left: 5.7%;
	padding-right: 5.7%;
}

/* 2.9. blockquotes */
blockquote {
	font-size: 1.5em;
	line-height: 1.0833333333333em;
	background-color: #efb21b;
	padding: 0.41666666666666666666666666666667em 5.7% .25em 5.7%; /* 10px 5.7% 6px 5.7%; */
	width: 112%;
	margin-left: -5.7%;
	margin-right: -5.7%;
	margin-top: 1.875em; /* 45px; */
	margin-bottom: 1.7916666666666666666666666666667em; /* 43px; */
}

/* 3. layout */

/* 3.1. pagewrap */
#pagewrap {
	width: 99.5%;
	margin-left: .5%;
}

/* 3.4.1. featured images */
.fimage {
	margin-top: -10%;
}

/* 3.4.2. post */
.post,
.search .page {
	padding: 0% 5%;
}

/* 3.4.3. images */
.post img.alignnone,
.post img.alignleft,
.post img.alignright,
.post img.aligncenter {
	/*width: 111.11111111111111%;*/
	/*margin-left: -5.7%;
	margin-right: -5.7%;*/
	margin-top: 1.125em; /* 18px; */
	margin-bottom: .875em; /* 14px; */
	/*padding-left: 5.7%;
	padding-right: 5.7%;*/
	background-color: #efb21b;
}

.post .wp-caption.alignnone,
.post .wp-caption.alignleft,
.post .wp-caption.alignright,
.post .wp-caption.aligncenter {
	/*width: 111.111111111111% !important;*/
	/*margin-left: -5.7%;
	margin-right: -5.7%;*/
	background-color: #efb21b;
	margin-top: 1.875em; /* 30px;*/
	margin-bottom: 1.3125em; /* 21px; */
}

.post .wp-caption.alignnone img,
.post .wp-caption.alignleft img,
.post .wp-caption.alignright img,
.post .wp-caption.aligncenter img {
	/*width: 90% !important;*/
	margin-left: 5%;
	height: auto;
	border-top: .5vw solid #efb21b;
}

.post img.alignleft {
	float: left;
	margin-right: 2em;
}

.post img.alignright {
	float: right;
	margin-left: 2em;
}

/* 3.4.4. captions */
.wp-caption-text {
	padding-right: 5%;
}

/* 3.4.5. galleries */
.gallery-columns-2 {
	width: 100%;
}

/* 3.4.6. respond */
#respond {
	width: 111.1111111111%;
	margin-left: -5.7%;
	margin-right: -5.7%;
	padding-left: 10.7%;
	padding-right: 10.7%;
}

/* 3.5. aside */
aside {
	padding: 1.625em 5%;
}

.widget {
	width: 50%;
	float: left;
}

.widget:nth-of-type(2n+1) {
	clear: both;
}

/* 3.7. specific pages */
/* 3.7.1. .search */
.search .entry .thumb {
	float: left;
	display: inline-block;
	margin-right: 3%;
		margin-right: calc(1em);
		margin-right: -webkit-calc(1em);
	height: auto;
		height: calc(9.75em);
		height: -webkit-calc(9.75em);
	width: 20%;
		width: calc(9.75em);
		width: -webkit-calc(9.75em);
}

.search .thumb img {
	width: 100%;
	height: auto;
}

.search .excerpt,
.search .tags {
	float: right;
	width: 77%;
		width: calc(100% - 10.75em);
		width: -webkit-calc(100% - 10.75em);
}

.search .page .time {
	width: 100%;
	border-left: .25em solid #efb21b;
}

/* 4. navigation */
.nav {
	width: 60.5%;
}

/* 4.3 visibility toggle */
label.menu-toggle {
	left: 0.5%;
}

} /* END modern mobile-ish */

/* == 7.2 modern laptop-ish == */
@media only all and (min-width: 1024px) {
#pagewrap {
	width: 100%;
	border-left: .25em solid #efb21b;
}
	
#header {
/*background-color: rgba(255,0,0,.7); /* let's be clear about where we are. */
	height: 3.25em;
	width: 100%;
	position: fixed;
}

.title a {
	position: relative;
	float: left;
	right: auto;
	margin-left: 2%;
}

.fimage {
	min-height: 39vh;
	text-align: center;
	margin-top: 1.625em;
}

.fimage img {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.time {
	/*background-color: rgba(239,178,27, .6);*/
}

.entry p, 
.entry h1,
.entry h2,
.entry h3,
.entry h4,
.entry h5 {
	padding-right: 20%;
}

.entry .wp-caption-text {
	padding-right: 0;
}

h2.posttitle,
.post-categories,
blockquote,
#pagewrap form {
	width: 142.85714285714285714285714285714%;
	margin-left: -21.43%;
	padding-left: 21.43%;
	padding-right: 21.43%;
}

.post .wp-caption.alignnone,
.post .wp-caption.aligncenter {
	width: 142.85714285714285714285714285714% !important;
	margin-left: -21.43% !important;
	padding-left: 21.43%;
	padding-right: 21.43%;
}

.entry p img.alignnone,
.entry p img.aligncenter {
	/*width: 178.5%;*/
	padding: 0;
	padding-left: 26.78%;
	/*margin-left: -26.78%;*/
	padding-right: 26.78%;
	margin-right: -26.78%;
	padding: 0;
	/*margin-right: -140%;*/
}

.post .wp-caption.aligncenter img {
	margin-left: 0;
	width: 100% !important;
}

#respond {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	padding-left: 15%;
	padding-right: 15%;
}

.gallery-columns-2 {
	width: 66.666666666%;
	margin-left: 0 !important;	
}

h2.pagetitle {
	padding-left: 15%;
	padding-right: 15%;
}

.search .page  {
	width: 100%;
	padding: 0;
	padding-left: 15%;
	padding-right: 15%;
}

.post {
	padding: 0 15%;
}

.navigation {
	padding: 0 15%;
}

/* 3.5. aside */
aside {
	padding: 1.625em 15%;
}

.widget {
	width: 33.3333333333%;
	padding-left: 4%;
}

.widget:nth-of-type(2n+1) {
	clear: none;
}

.widget:nth-of-type(3n+1) {
	clear: both;
	padding-left: 0%;
}

/* 3.7.1. search */


/* 3.7.something .category */
.category .pagetitle {
	margin-top: 1.625em;
}

/* 4. nav */
.nav {
	margin: 0;
	width: 75%;
	right: 0;
	height: 52px;
	display: inline-block;
	overflow: visible;
	padding-right: 2%;
	background-color: #6d5532;
}

/* 4.1. search */
#search {
	/*width: 150px;*/
	right: 2em;
	top: 52px;
	position: absolute;
	right: 0;
	margin: 0;
	padding: 0 2% 0 .5em;
	background-color: #ffffff;
	border-radius: 0;
	height: 1.625em;
}

#search input {
	width: 1em;
	padding-left: 1.5em;
	background-image: url(images/magnifier.svg);
	background-position: .25em center;
	background-size: 1em;
	background-repeat: no-repeat;
}

#search:hover input,
#search:focus input,
#search input:hover,
#search input:focus {
	width: 10em;
	background-color: white;
}

#searchsubmit {
	margin: 0;
	padding: 0;
	display: none;
}

/* 4.2. actual menu */
.nav ul {
	float: right;
	margin-right: -.5em; /*offset for last li's padding */
}

.nav li {
	float: left;
}

/* 4.3 visibility toggle */
label.menu-toggle {
	display: none;
}

/* 4.4. link behaviour */
.nav a,
.nav a:link,
.nav a:visited {
	color: #ffffff;
	padding: .375em .5em .4375em .5em;
}

.nav li a:hover,
.nav li a:focus {
	color: #efb21b;
}

.nav li a:active {
	background-color: #efb21b;
	color: #6d5532;
}
	

} /* END laptop-ish */

/* == 7.3 desktop == */
@media only all and (min-width: 1440px) {
#header {
/*background-color: blue;*/
}

p,
ul,
ol {
	font-size: 1.25em;
	line-height: 1.625em;
	margin-bottom: 20px;
}

h1 {
	font-size: 3em;
	line-height: 0.8125em;
	margin-bottom: 14px;
}

	h1.title {
		font-size: 1.6em;
		font-weight: 400;
		margin-top: -.375em; /*-9px;*/
	}

h2 {
	font-size: 2em;
	line-height: 1.0833333333333em;
	padding-top: 10px;
	margin-bottom: 4px;	
}

	h2.posttitle {
		font-size: 3em;
	}
	
	h2.pagetitle {
		font-size: 3em;
		padding-left: 15%;
		padding-right: 15%;
	}

	.widget h2:nth-of-type(1) {
		width: 222.52222222%;
		margin-left: -11.4%;
		margin-right: -11.4%;
		padding-left: 11.4%;
	}

h3 {
	font-size: 1.25em;
	line-height: 1.3em;
	padding-top: 11px;
	margin-bottom: 2px;
}

h4 {
	font-size: 1.15em;
	padding-top: 11px;
	margin-bottom: 2px;
}

h5 {
	font-size: 1em;
	padding-top: 12px;
	margin-bottom: 1px;
}

h6 {
	font-size: .9em;
}

.post-categories,
.time,
.commentslink {
	font-size: 1em;
}

.nav li a,
#search,
#footer {
	font-size: 1.25em;
}

#search {
	padding-top: .125em;
}

.category .pagetitle {
	margin-top: 1em;
}
} /* END desktop */

/* 8. browser-specific hacks */

@media print {

.do-not-print { display: none; }
#comments { page-break-before: always; }

body { width: 100% !important; margin: 0 !important; padding: 0 !important; line-height: 1.4; word-spacing: 1.1pt; letter-spacing: 0.2pt; font-family: Garamond,"Times New Roman", serif; color: #000; background: none; font-size: 12pt; }
h1,h2,h3,h4,h5,h6 { font-family: Helvetica, Arial, sans-serif; }
h1 { font-size: 19pt; }
h2 { font-size:17pt; }
h3 { font-size:15pt; }
h4,h5,h6 { font-size:12pt; }
code { font: 10pt Courier, monospace; } 
blockquote { margin: 1.3em; padding: 1em; }
img { display: block; margin: 1em 0; }
a img { border: none; }
table { margin: 1px; text-align:left; }
th { border-bottom: 1px solid #333;  font-weight: bold; }
td { border-bottom: 1px solid #333; }
th, td { padding: 4px 10px 4px 0; }
caption { background: #fff; margin-bottom: 2em; text-align: left; }
thead { display: table-header-group; }
tr { page-break-inside: avoid; } 
a { text-decoration: none; color: black; }
	
} /* END print media */

