/*
Theme Name:   Blank Slate Child
Description:  Ballmer Peak Distillery blog
Author:       Eric Strom
Author URI:   https://ballmerpeakdistillery.com.com
Template:     blankslate
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  blankslatechild
*/

.home article {
	margin: 65px auto;
	overflow: hidden;
	padding-top: 65px;
	position: relative;
	width: 60%;
}

.home article:nth-child(n+4) .image {
	height: 250px;
	overflow: hidden;
}

.home article .image img {
	filter: brightness(80%);
	width: 100%;
}
.home article:hover .image img {
	filter: brightness(100%);
}

@media all and (min-width: 741px) {
	.home article:first-child {
		float: left;
		height: 40vw;
		margin: 0;
		padding-top: 0;
		width: 60%;
	}
	.home article:nth-child(2),
	.home article:nth-child(3) {
		float: left;
		height: 20vw;
		margin: 0;
		padding-top: 0;
		width: 40%;
	}
	.home article:first-child .content,
	.home article:nth-child(2) .content,
	.home article:nth-child(3) .content {
		background: #e8e8e8;
		bottom: 35px;
		left: 35px;
		padding: 15px;
		position: absolute;
	}
	.home article:first-child .content p,
	.home article:nth-child(2) .content p,
	.home article:nth-child(3) .content p {
		display: none;
	}
	.home article:first-child .content .tags,
	.home article:nth-child(2) .content .tags,
	.home article:nth-child(3) .content .tags {
		position: absolute;
		top: -12px;
	}

	.home article:first-child .content .tags span,
	.home article:nth-child(2) .content .tags span,
	.home article:nth-child(3) .content .tags span {
		background: #82A6B1;
		color: #fff;
		padding: 5px 12px;
	}
}

@media all and (max-width: 720px) {
	.home article {
		align-items: center;
		display: flex;
		flex-direction: column;
		max-width:  520px;
		width: 80%;
	}
	.home article .image,
	.home .article .content {
		width: 100%;
	}
	.home article .content {
		background: #cfcfcf;
		margin-top: -30px;
		padding: 25px !important;
		position: relative;
		width:  80%;
		z-index: 10;
	}
	.home article .content .tags {
		position: absolute;
		top: -12px;
	}
	.home article .content .tags span {
		background: #82A6B1;
		color: #fff;
		padding: 5px 12px;
		z-index: 11;
	}
}



.home article:nth-child(n+4) {
	display: flex;
}
.home article:nth-child(n+4) > div {
	flex: 1;
}
.home article:nth-child(n+4) .content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 50px;
}

.navigation {
	display: flex;
}
.navigation ul {
	display: flex;
	margin: 0 auto 50px auto;
}
.navigation ul li {
	margin: 0 10px;
}

.single article header {
	position: relative;
}
.single article header::before {
	background-image: url('/img/topos/aussie.svg');
	background-size: cover;
	border-bottom:  10px solid #82A6B1;
	content:  '';
	display: block;
	left:  0;
	position: absolute;
	top: 0;
	height:  200px;
	width:  100%;
}
.single article header > div {
	align-items: flex-end;
	display: flex;
	margin: 0 auto;
	padding-top:  25px;
	position:  relative;
	width: 70%;
}
.single article header .post-header-image {
	border-bottom: 10px solid #82A6B1;
	border-left: 10px solid #82A6B1;
	width:  40%;
}
.single article header .post-header-content {
	padding: 25px 25px 0 25px;
	width:  70%;
}


.single article .entry-content {
	margin: 75px auto;
	width: 40vw;
}

@media all and (max-width:  640px) {
	.single article header::before {
		position: relative;
		height:  75px;
	}
	.single article header > div {
		align-items: flex-start;
		justify-content: center;
		flex-direction: column;
		width:  80vw;
	}
	.single article header .post-header-content,
	.single article header .post-header-image {
		width: 100%;
	}
	.single article header .post-header-content {
		padding:  25px 0;
	}
	.single article .entry-content {
		margin-top: 25px;
		width:  80vw;
	}
}


footer {
	clear: both;
}