/*---------------------------------------------------------------------------------

	Palmemordet.se
	v3.0

----------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------- */
/*	0. CSS Reset
/* -------------------------------------------------------------------------------- */

html, body { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6, p, blockquote, address, big, cite, code, em, font, img, small, strike, sub, sup, li, ol, ul, fieldset, form, label, legend, button, table, caption, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	font-weight:normal;
	font-style:normal;
	font-size:100%;
	line-height:1;
	font-family:inherit;
	text-align:left;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

ol, ul { list-style:none; }

input { -webkit-appearance: none; }

input[type=search] {
   -moz-appearance:none;
   -webkit-appearance:none;
}

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;
}


/* -------------------------------------------------------------------------------- */
/*	1. Document setup
/* -------------------------------------------------------------------------------- */


body {
	margin: 0;
	padding: 0;
	border: none;
	color: #222;
	background: #FFF;
	font-family: 'ff-meta-serif-web-pro', Georgia, serif;
	font-size: 20px;
}

body a {
	color: #CA2017;
	text-decoration: none;
}

body a:hover {
	color: #CA2017;
	text-decoration: none;
}

* {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
}

img {
	max-width: 100%;
	height: auto;
}

.hidden { display: none; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }

::-webkit-input-placeholder { color: #A9A9A9; }
:-ms-input-placeholder { color: #A9A9A9; }

/* Transitions --------------------------------------- */

body a {
	transition: all 0.1s ease-in-out;
}

.books a img,
.to-the-content {
	transition: all 0.2s ease-in-out;
}


/* -------------------------------------------------------------------------------- */
/*	2.	Structure
/* -------------------------------------------------------------------------------- */


.section {
	padding: 100px 0;
	position: relative;
	display: block;
}

.section.medium-padding { padding: 100px 0; }
.section.light-padding { padding: 75px 0; }
.section.no-padding { padding: 0; }

.section.screen-height { height: 100vh; }

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) { body > .screen-height:first-child { height: 672px; }}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) { body > .screen-height:first-child { height: 928px; }}
@media all and (device-width: 320px) and (device-height: 568px) and (orientation:portrait) { body > .screen-height:first-child { height: 460px; }}
@media all and (device-width: 375px) and (device-height: 667px) and (orientation:portrait) { body > .screen-height:first-child { height: 559px; }}

.section.bg-light { background-color: #f1f1f1; }
.section.bg-dark { background-color: #000; }
.section.bg-red { background-color: #CA2017; }

.section-inner {
	width: 1240px;
	max-width: 92%;
	margin: 0 auto;
}

.section-inner.light { width: 1040px; }
.section-inner.thin { width: 650px; }

.section-inner + .section-inner { margin-top: 80px; }

.section-inner > .post-content { width: 50%; }

.section-inner > .post-content.center {
	margin-left: auto;
	margin-right: auto;
}

.section-inner > .post-aside { width: 44.5%; }


/* -------------------------------------------------------------------------------- */
/*	3. Cover section
/* -------------------------------------------------------------------------------- */


.cover-content {
	width: 50%;
	color: #fff;
}

.cover-content-inner {
	width: 520px;
	margin: 0 auto;
	max-width: 80%;
}

.cover-year {
	margin-bottom: 26px;
	font-size: 2em;
	font-weight: 600;
	font-variant-numeric: lining-nums;
	color: #ca2017;
}

.cover-title {
	font-size: 3.9em;
	line-height: 1;
	font-weight: 600;
	letter-spacing: -0.005em;
	position: relative;
}

.cover-title span {
	color: #ca2017;
	background: -webkit-linear-gradient(#ca2017, #981a13);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.cover-description {
	margin-top: 32px;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 1.2em;
	line-height: 133%;
}

.cover-byline {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	margin-top: 32px;
}

.cover-byline { color: #767676; }
.cover-byline a { color: inherit; }


/* To The Content */


.to-the-content-outer-container {
	width: 50%;
	position: absolute;
	bottom: 50px;
	left: 0;
}

.to-the-content-inner-container {
	width: 520px;
	max-width: 80%;
	margin: 0 auto;
}

.to-the-content {
	display: block;
	width: 60px;
	height: 60px;
	background: #ca2017;
	border-radius: 99px;
	position: relative;
}

.to-the-content img {
	display: block;
	height: 30px;
	width: 28px;
	position: absolute;
	top: 50%;
	margin-top: -15px;
	left: 50%;
	margin-left: -15px;
}

.to-the-content:hover {
	transform: translateY( 4px );
}


/* Share */


.share {
	float: right;
	margin-top: 10px;
}

.share li { float: left; }
.share li + li { margin-left: 8px; }

.share a {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 99px;
	background: #222;
	text-align: center;
}

.share img {
	margin-top: 12px;
	display: inline-block;
	height: 16px;
}

.share a:hover { background: #ca2017; }

.share .facebook img { height: 17px; margin: 12px 1px 0 0; }
.share .twitter img { height: 15px; margin: 13px 0 0 0; }


/* Cover Image */


.cover-image {
	background-size: cover;
	background-position: center;
	position: absolute;
	top: 0;
	right: 0;
	left: 50%;
	bottom: 0;
}

.cover-image.align-top { 
	background-position: top center;
}


/* -------------------------------------------------------------------------------- */
/*	3. Post content
/* -------------------------------------------------------------------------------- */


.post-content a,
.post-content a:hover { 
	text-decoration: underline; 
}

.post-content p,
.post-content blockquote,
.post-content ul,
.post-content ol,
.post-content address,
.post-content dl,
.post-content .wp-caption,
.post-content pre {
	line-height: 150%;
	margin-top: 1.25em;
}

.post-content *:first-child { margin-top: 0; }
.post-content *:last-child { margin-bottom: 0; }

.post-content p span {
	color: #ca2017;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: 700;
	text-transform: uppercase;
}

.post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	margin: 60px 0 30px;
	color: #222;
	font-weight: 700;
}

.post-content h1 { font-size: 2em; }
.post-content h2 { font-size: 1.75em; }
.post-content h3 { font-size: 1.5em; }
.post-content h4 { font-size: 1.25em; }
.post-content h5 { font-size: 1.1em; }
.post-content h6 {
	font-size: 0.925em;
	font-weight: bold;
	text-transform: uppercase;
}

.post-content h1+h1, .post-content h1+h2, .post-content h1+h3, .post-content h1+h4, .post-content h1+h5, .post-content h1+h6,
.post-content h2+h1, .post-content h2+h2, .post-content h2+h3, .post-content h2+h4, .post-content h2+h5, .post-content h2+h6,
.post-content h3+h1, .post-content h3+h2, .post-content h3+h3, .post-content h3+h4, .post-content h3+h5, .post-content h3+h6,
.post-content h4+h1, .post-content h4+h2, .post-content h4+h3, .post-content h4+h4, .post-content h4+h5, .post-content h4+h6,
.post-content h5+h1, .post-content h5+h2, .post-content h5+h3, .post-content h5+h4, .post-content h5+h5, .post-content h5+h6,
.post-content h6+h1, .post-content h6+h2, .post-content h6+h3, .post-content h6+h4, .post-content h6+h5, .post-content h6+h6 {
	margin-top: 30px;
}

em, q {  font-style: italic;  }

.post-content strong em,
.post-content em strong {
	font-weight: bold;
	font-style: italic;
}

.post-content hr {
	width: 128px;
	max-width: 60%;
	height: 2px;
	background: #DDD;
	margin: 2em auto;
	border: 0;
}

.post-content ul {
	list-style: disc;
	margin-left: 1.5em;
}

.post-content ul ul { list-style: circle; }
.post-content ul ul ul { list-style: square; }

.post-content ol {
	list-style: decimal;
	margin-left: 1.5em;
}

.post-content ol ol { list-style: lower-alpha; }
.post-content ol ol ol {
	list-style: lower-roman;
}

.post-content ul ul,
.post-content ul ol,
.post-content ol ul,
.post-content ol ol {
	margin-bottom: 0;
}

.post-content li {
	margin-bottom: 0.5em;
	line-height: 170%;
}

.post-content blockquote {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 1.3em;
	line-height: 132%;
	font-weight: 700;
	hanging-punctuation: first;
	color: #ca2017;
	position: relative;
}


/* -------------------------------------------------------------------------------- */
/*	X. Post aside
/* -------------------------------------------------------------------------------- */


.post-aside .image,
.post-aside blockquote { margin-top: 60px; }

.post-aside .image:first-child,
.post-aside blockquote:first-child { margin-top: 0; }

.post-aside .image img {
	display: block;
}

.post-aside .image img:not([width]) {
	width: 100%;
}

.post-aside .image .caption {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	margin-top: 12px;
}

.post-aside .image .caption a {
	text-decoration: underline;
}

.post-aside blockquote {
	font-size: 1.6em;
	line-height: 140%;
	font-weight: 300;
	color: #CA2017;
}

.post-aside.left blockquote { text-align: right; }


/* -------------------------------------------------------------------------------- */
/*	3. Quote section
/* -------------------------------------------------------------------------------- */


.quotemark {
	display: block;
	width: 62px;
	height: 62px;
	margin: 0 auto;
	border-radius: 99px;
	background: #ca2017;
	font-family: Georgia;
	font-size: 64px;
	line-height: 88%;
	font-weight: 700;
	text-align: center;
	color: #fff;
	position: relative;
}

.quotemark.top { 
	padding: 17px 0 0;
}
.quotemark.bottom {
	padding: 18px 0 0;
}

.quotemark:before,
.quotemark:after {
	content: "";
	height: 4px;
	width: 180px;
	background: #ca2017;
	position: absolute;
	top: 50%;
	margin-top: -2px;
}

.quotemark:before { left: -200px; }
.quotemark:after { right: -200px; }

.section-quote blockquote {
	margin: 50px 0;
	font-size: 2.5em;
	line-height: 128%;
	font-weight: 400;
	text-align: center;
	color: #fff;
	letter-spacing: -0.01em;
}


/* -------------------------------------------------------------------------------- */
/*	X. Böcker
/* -------------------------------------------------------------------------------- */


.books-grid {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 -25px -25px;
}

.books-grid > * {
	margin: 0 0 25px 25px;
}

.books-header {
	background-color: #ca2017;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 40px;
	width: calc( 33.33% - 25px );
}

.books-header h4 {
	font-size: 1.6em;
	line-height: 106%;
	font-weight: 700;
	text-align: right;
	color: #fff;
}

.books-header p {
	margin-top: 20px;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: .9em;
	line-height: 130%;
	margin-left: auto;
	max-width: 270px;
	color: #fff;
	text-align: right;
}

.books-header h4 span { color: #000; }

.book {
	position: relative;
	width: calc( 16.66% - 25px );
}

.book img { 
	display: block; 
	width: 100%;
}

.book .arrow {
	align-items: center;
	background-color: #ca2017;;
	display: flex;
	height: 32px;
	justify-content: center;
	position: absolute;
		bottom: 0;
		right: 0;
	width: 32px;
}

.book .arrow img {
	height: 40%;
	transform: rotate(-90deg);
	width: auto;
}

.book:hover > img { 
	opacity: 0.8; 
}


/* -------------------------------------------------------------------------------- */
/*	X. Footer
/* -------------------------------------------------------------------------------- */


.footer.section { padding-bottom: 60px; }

.footer .cover-title {
	font-size: 3em;
	color: #ca2017;
}

.footer .cover-description {
	width: 830px;
	max-width: 100%;
	margin-top: 20px;
	font-size: 1.4em;
	line-height: 140%;
	color: #fff;
}

.footer .section-inner + .section-inner {
	padding-top: 60px;
	border-top: 2px solid #222;
	margin-top: 60px;
}

/* Columns */

.column {
	width: 30%;
	float: left;
}

.column + .column { margin-left: 5%; }

.column .title {
	color: #ca2017;
	font-weight: 700;
	margin-bottom: 30px;
}

.column p {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 19px;
	line-height: 1.5;
	color: #fff;
}

.column p a {
	color: #fff;
	text-decoration: underline;
}

.column p a:hover {
	color: #ca2017;
}


/* Credits */

.credits {
	color: #fff;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif;
}

.credits a { 
	color: inherit; 
}

.credits p { 
	font-variant-numeric: lining-nums;
	font-size: 19px;
}

.credits p + p { position: relative; }

.credits p + p a {
	display: block;
	padding-right: 44px;
}

.credits .arrow {
	display: block;
	width: 32px;
	height: 32px;
	padding-top: 8px;
	margin-left: 5px;
	background: #ca2017;
	border-radius: 99px;
	text-align: center;
	position: absolute;
	top: calc( 50% - 16px );
	right: 0;
}

.credits .arrow img {
	display: inline-block;
	transform: rotate( 180deg );
	width: 14px;
}


/* -------------------------------------------------------------------------------- */
/*	X. Responsive
/* -------------------------------------------------------------------------------- */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

	/* 2X images */

	.social-icon { background-size: 20px auto; }

	.social-icon.twitter { background-image: url(assets/icons/2x/twitter.png); }
	.social-icon.facebook { background-image: url(assets/icons/2x/facebook.png); background-size: auto 20px; }
	.social-icon.email { background-image: url(assets/icons/2x/email.png); }

}

@media ( max-width: 1160px ) {

	/* BÖCKER */

	.book { width: calc( 25% - 25px ); }
	.books-header { width: calc( 50% - 25px ); }

}

@media (max-width: 1100px) {

	/* Cover section */

	.cover-section.section { padding: 0; }

	.cover-image {
		width: 100%;
		left: 0;
		opacity: 0.25;
	}

	.cover-byline {
		color: #999;
	}

	.cover-content,
	.to-the-content-outer-container,
	.to-the-content-inner-container {
		width: 100%;
	}
	
	.to-the-content-outer-container { bottom: 30px; }

	.cover-content-inner { margin-left: 10%; }

	/* Share */

	.share li + li { margin-left: 6px; }
	.share a { background: #333; }

}

@media (max-width: 900px) {

	/* Structure */

	.section-inner,
	.to-the-content-inner-container { max-width: 85%; }
	
	.cover-content-inner {
		margin-left: 7.5%;
		max-width: 85%;
	}
	
	.section-inner > .post-aside,
	.section-inner > .post-content {
		float: none;
		width: 100%;
	}

	.post-aside + .post-content,
	.post-content + .post-aside,
	.section-inner + .section-inner { margin-top: 1.25em; }

	/* post header */

	.featured-image-section .section-inner { max-width: 80%; }

	.section-title { bottom: 7.5%; left: 7.5%; }

	.meta-section { padding: 30px 0; }

	/* post content */

	.section-quote blockquote {
		font-size: 1.55em;
	}
	.post-aside blockquote { font-weight: 400; }

	.post-aside.left blockquote,
	.post-aside.right blockquote { text-align: center; }

	.post-aside blockquote:before,
	.post-aside blockquote:after {
		content: "";
		display: block;
		width: 64px;
		height: 2px;
		background: #DDD;
		margin: 50px auto;
	}

	/* post aside */

	.post-aside .image { max-width: 75%; margin-left: auto; margin-right: auto; }

	.post-aside .image { text-align: center; }
	/* footer */

	.footer .cover-title { font-size: 2.5em; }

	.footer .cover-description { 
		font-size: 1.1em; 
		width: 620px;
	}

	.footer .column {
		width: 100%;
		float: none;;
	}

	.footer .column + .column { margin: 40px 0 0 0; }

}


@media (max-width: 800px) {
	
	/* BÖCKER */

	.books-grid { margin: 0 0 -20px -20px; }
	.books-grid > * { margin: 0 0 20px 20px; }
	.book { width: calc( 33.33% - 20px ); }
	.books-header { width: calc( 66.66% - 20px ); }
	
}


@media (max-width: 700px) {
	
	/* structure */
	
	.section { padding: 50px 0; }
	
}


@media (max-width: 600px) {


	body { font-size: 18px; }

	/* structure */

	.section { padding: 40px 0; }

	.post-aside + .post-content,
	.post-content + .post-aside,
	.section-inner + .section-inner { margin-top: 40px; }

	/* cover section */

	.cover-year {
		margin-bottom: 17px;
		font-size: 1.75em;
	}

	.cover-title { font-size: 3em; }

	.cover-description {
		margin-top: 20px;
		font-size: 1.1em;
	}

	.cover-byline { margin-top: 20px; }

	.to-the-content-outer-container { bottom: 25px; }

	.to-the-content {
		width: 40px;
		height: 40px;
	}

	.to-the-content img {
		width: 20px;
		margin-left: -10px;
	}

	/* share */

	.share { margin-top: 0; }

	/* post content */

	.post-content blockquote {
		padding: 0;
		font-size: 1.2em;
	}

	.post-content blockquote:before { content: none; }

	.section-quote blockquote { margin: 30px 0; }

	.quotemark {
		padding-top: 0;
		width: 50px;
		height: 50px;
		font-size: 48px;
	}

	.quotemark.top { padding-top: 15px; }
	.quotemark.bottom { padding-top: 16px; }

	.quotemark:before,
	.quotemark:after {
		width: 80px;
		height: 2px;
		margin-top: -1px;
	}

	.quotemark:before { left: -100px; }
	.quotemark:after { right: -100px; }

	/* post aside */

	.post-aside .image { max-width: 100%; }

	/* BÖCKER */

	.books-grid { margin: 0 0 -15px -15px; }
	.books-grid > * { margin: 0 0 15px 15px; }
	.book { width: calc( 50% - 15px ); }

	.books-header { 
		padding: 29px;
		width: calc( 100% - 15px ); 
	}

	.books-header p {
		max-width: 240px;
	}

	/* footer */

	.footer.section { padding-bottom: 40px; }

	.footer .section-inner + .section-inner {
		padding-top: 40px;
		margin-top: 40px;
	}

	.footer .cover-title { font-size: 1.8em; }
	.footer .cover-description {
		font-size: 1em;
		line-height: 140%;
	}

	.column .title { margin-bottom: 20px; }

	.column p,
	.credits p { font-size: 0.9em;}

}


@media ( max-width: 450px ) { 

	.cover-title { 
		font-size: 3em; 
	} 

}


@media ( max-width: 400px ) {


	body { font-size: 17px; }

	/* Structure */

	.post-aside + .post-content, .post-content + .post-aside, .section-inner + .section-inner {
		margin-top: 30px;
	}

	/* Cover section */

	.cover-title { font-size: 3em; }
	
	.share a { background: #666; }

	/* Post Content */

	.post-aside .image .caption { margin-top: 12px; }

	/* Footer */

	.footer.section { padding-bottom: 30px; }
	.footer .cover-title { font-size: 1.5em; }
	.footer .section-inner + .section-inner { padding-top: 30px; margin-top: 30px; }
	.footer .column + .column { margin-top: 30px; }
	.column .title { margin-bottom: 15px; }

	/* Credits */

	.credits {
		align-items: center;
		display: flex;
		justify-content: space-between;
	}

	.credits p + p a { 
		display: block;
		padding-right: 0; 
	}

	.credits .text { display: none; }
	.credits span.arrow {
		display: block;
		position: static;
	}

	.credits .clear {
		display: none;
	}

}


@media ( max-width: 350px ) {


	.cover-title { 
		font-size: 2.6em; 
	}
	
	.cover-description,
	.cover-byline {
		font-size: .9em;
	}


}