.post-type-icon(){
	display: block;
	content: "";
	width: 20px;
	height: auto;
	position: absolute;
	left: 35px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	//background-color: #f03;
	font-size: 0;
	line-height: 1;
	z-index: 2;
	path{
		fill: black;
		fill: var(--global-brand-color);
		fill: var(--header-background-color);
	}
}
.content-card{
	position: relative;
	width: 100%;
    max-width: 700px;
    margin: 0 auto;
	background-color: white;
	background-color: var(--card-background-color);
	//box-shadow: 0px 0px 0px 10px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.1);
	&:not(.type-article){
		z-index: 5;
	}
	&.content-card-row{
		.single-pins &{
			&.type-pin{
				max-width: 1280px;
				.flex-display();
				.flex-direction(column);
				.m1-md({
					.flex-direction(row);
					//margin: 100px 0;
				});
				.content-card-col{
					.flex(1);
				}
				.content-card-col:first-child{
					//background-color: #f03;
					background-color: lightgrey;
					background-color: var(--article-section-color);
					.m1-md({
						.flex(2);
					});
				}
			}
		}
	}
	&:not(.type-article){
		overflow: hidden;
	}
	&.empty-card{
		padding-top: 2em;
		padding-bottom: 2em;
	}
	&.content-card-transparent{
		background-color: transparent;
		box-shadow: none;
		.avatar{
			display: none;
		}
		.entry-content{
			padding-left: 20px;
			padding-top: 20px;
		}
	}
	&.card-hidden{
		background-color: transparent;
		box-shadow: none;
		.entry-content{
			padding: 30px 20px;
			padding-top: 30px;
			padding-left: 20px;
			margin-top: 0px;
		}
	}
	.response{
		position: relative;
		--global-text-alt: var(--article-text-alt);
		--global-headline-color: var(--article-headline-color);
		background-color: lightgrey;
		background-color: var(--article-section-color);
		.kind-display-text{
			display: none;
		}
		.response-title{
			margin-bottom: 0;
			& + p{
				margin-top: 0;
			}
		}
	}
	&.type-like,
	&.type-bookmark,
	&.type-favorite,
	&.type-repost{
		.entry-response .response-icon{
			top: 0;
			.translateY(-50%);
		}
	}
	&.type-bookmark{
		.entry-response .response-icon{
			width: 14px;
			left: 38px;
		}
	}
	&.type-repost{
		.entry-response .response-icon{
			width: 30px;
			left: 30px;
		}
	}
	&.type-reply{
		.entry-response .response-icon{
			bottom: 0;
			.translateY(50%);
		}
		.entry-header{
			&::after{
				display: block;
				content: "";
				position: absolute;
				top: 0;
				left: 42px;
				width: 5px;
				height: 50px;
				background-color: black;
				background-color: var(--global-brand-color);
				z-index: 1;
				opacity: 0.5;
			}
			.avatar{
				box-shadow: 0 0 0 4px white;
				//box-shadow: 0 0 0 4px var(--global-brand-color);
				box-shadow: 0 0 0 4px var(--global-background-color);
			}
		}
		.response-content{
			&::after{
				display: block;
				content: "";
				position: absolute;
				top: 0;
				left: 42px;
				width: 5px;
				height: 100%;
				background-color: black;
				background-color: var(--global-brand-color);
				z-index: 1;
				opacity: 0.5;
			}
		}
		.response{
			.avatar{
				box-shadow: 0 0 0 4px lightgrey;
				box-shadow: 0 0 0 4px var(--article-section-color);
			}
		}
	}
	&.type-article{
		box-shadow: none;
		max-width: 980px;
		& + .comments-area{
			max-width: 980px;
			.comment-meta,
			.comment-footer{
				padding-right: 1em;
				padding-left: 1em;
				.m1-sm({
					padding-right: 50px;
					padding-left: 50px;
				});
				.m1-md({
					padding-right: 85px;
					padding-left: 85px;
				});
			}
			.comment-content{
				padding-left: 1em;
				.m1-sm({
					padding-left: 115px;
				});
				.m1-md({
					padding-left: 150px;
				});
			}
		}
		.entry-header{
			padding-right: 1em;
			padding-left: 1em;
			.m1-sm({
				padding-right: 50px;
				padding-left: 50px;
			});
			.m1-md({
				padding-right: 85px;
				padding-left: 85px;
			});
		}
		.entry-content{
			padding-right: 1em;
			padding-left: 1em;
			.m1-sm({
				padding-right: 50px;
				padding-left: 50px;
			});
			.m1-md({
				padding-right: 85px;
				padding-left: 85px;
			});
			padding-bottom: 100px;
			padding-top: 50px;
			margin-top: 0;
		}
		.entry-footer{
			--global-text-alt: var(--article-text-alt);
			--global-headline-color: var(--article-headline-color);
			padding-right: 1em;
			padding-left: 1em;
			.m1-sm({
				padding-right: 50px;
				padding-left: 50px;
			});
			.m1-md({
				padding-right: 85px;
				padding-left: 85px;
			});
			background-color: lightgrey;
			background-color: var(--article-section-color);
			&:first-of-type{
				padding-top: 30px;
				//border-top: grey 1px dotted;
				//border-top: var(--global-border-color) 1px dotted;
			}/*
			& + &{
				border-top: 0;
				padding-top: 0;
			}*/
		}
	}
	p:first-child{
		margin-top: 0;
	}
	p:last-child,
	p:last-of-type{
		margin-bottom: 0;
	}
	.entry-title{
		padding-left: 65px;
		margin-top: -22px;
		margin-bottom: 1em;
		font-size: 50px;
		//font-weight: normal;
		//line-height: 60px;
		font-size: 40px;
		font-weight: bold;
		color: black;
		color: var(--global-headline-color);
		a{
			color: inherit;
			text-decoration: none;
		}
	}
	.entry-video{
		position: relative;
		height: auto;
		z-index: 10;
		&:before {
			display: block;
			content: "";
			width: 100%;
			padding-top: 56.25%;
		}
		& > iframe {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			width: 100%;
			height: 100%;
		}
	}
	.entry-gallery{
		z-index: 10;
		position: relative;
		font-size: 0;
		.blocks-gallery-item{
			margin: 0 !important;
		}
	}
	.entry-image{
		font-size: 0;
		position: relative;
		z-index: 10;
		.post-template-default.has-featured-image &,
		.page-template-default.has-featured-image &{
			margin-top: -200px;
			.m1-md({
				margin-top: -250px;
			});
		}

		img{
			width: 100%;
		}
	}
	.entry-quote{
		background-color: #f4f5f6;
		position: relative;
		z-index: 10;
		blockquote{
			position: relative;
			margin: 0;
			&::before,
			&::after{
				font-size: 10em;
				position: absolute;
				display: block;
				color: rgba(0,0,0,0.1);
				font-family: serif;
				font-weight: bold;
			}
			&::before {
				content: "“";
				top: -67px;
				left: 20px;
			}
			&::after {
				content: "”";
				bottom: -97px;
				right: 20px;
			}
		}
		p{
			margin-bottom: 0;
			padding: 30px;
			font-size: 2.5em;
			font-weight: bold;
		}
		footer{
			padding: 20px 30px;
			padding-top: 0;
			margin-top: -30px;
			text-align: right;
		}
		cite{
			color: grey;
			color: var(--global-headline-color);
			&::before{
				content: "— ";
			}
		}
	}
	.entry-header-hidden{
		display: none;
	}
	.entry-header,
	.response-meta{
		position: relative;
		padding: 30px 20px;
		background-color: inherit;
		*{
			position: relative;
			z-index: 5;
		}
	}
	.entry-content,
	.response-content{
		position: relative;
		padding: 30px 20px;
		padding-top: 0;
		padding-left: 85px;
		margin-top: -50px;
		background-color: inherit;
		*{
			position: relative;
			z-index: 5;
		}
	}
	.entry-response{
		position: relative;
		.response-icon{
			.post-type-icon();
		}
	}
	.entry-response + .entry-footer{
		padding-top: 30px;
	}
	.entry-footer{
		position: relative;
		padding: 30px 20px;
		padding-top: 0;
		padding-left: 85px;
		margin-top: -35px;
		font-size: 0.8em;
		color: grey;
		color: var(--global-text-alt);
		z-index: 10;
		//text-transform: uppercase;
		& > *{
			position: relative;
			z-index: 5;
		}
		.single &{
			margin-top: -1px;
		}
		p{
			margin: 0;
		}
		a{
			color: inherit;
			text-decoration: none;
			&:hover,
			&:focus,
			&:active{
				color: blue;
				color: var(--global-link-color);
			}
		}
		.meta-title{
			color: var(--global-headline-color);
		}
	}
	&.type-article + .comments-area{
		.background-block{
			display: block;
		}
		.comments-list{
			box-shadow: none;
		}
	}
	& + .comments-area{
		width: 100%;
		max-width: 700px;
		margin: 0 auto;
		//border-top: grey 1px dotted;
		//border-top: var(--global-border-color) 1px dotted;
		.likes,
		.bookmarks,
		.reposts,
		.mentions,
		.favorites{
			padding: 10px 20px 10px 85px;
			h3{
				margin-bottom: 0;
			}
		}
		.comment-list{
			list-style: none;
			padding-left: 0;
			margin: 0;
			li{
				padding-top: 0 !important;
				padding-bottom: 0 !important;
				//overflow: hidden;
				img{
					width: 50px;
					height: 50px;
					margin-right: 12px;
					vertical-align: top;
					/**/
					-webkit-mask-image: url(../images/avatar.svg);
					mask-image: url(../images/avatar.svg);
					-webkit-mask-mode: alpha;
					mask-mode: alpha;
					-webkit-mask-repeat: no-repeat;
					mask-repeat: no-repeat;
					-webkit-mask-size: 100%;
					mask-size: 100%;
					-webkit-mask-position: center;
					mask-position: center;
					&.themeberger-comment-avatar{
						margin-right: 14px;
					}
				}
			}
			.comment-content{
				margin-top: 0;
				padding-bottom: 30px;
				&.themeberger-comment-content{
					margin-top: -30px;
				}
			}
			.comment-metadata{
				padding-left: 65px;
				margin-top: -25px;
				font-size: 0.85em;
			}
			.comment-meta{
				padding-bottom: 10px;
			}
		}
		.mention-list{
			list-style: none;
			padding-left: 0;
			margin: 0;
			li{
				padding-top: 0 !important;
				padding-bottom: 0 !important;
				border-radius: 50%;
				overflow: hidden;
				width: 50px;
				height: 50px;
				img{
					max-width: 100%;
					max-height: 100%;
				}
			}
		}
		.background-block{
			display: none;
		}
		.comments-title{
			display: none;
		}
		.comment-respond{
			position: relative;
			padding: 10px 20px;
			//padding-left: 85px;
		}
		.comments-list{
			list-style: none;
			margin: 0;
			padding: 0;
			box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.1);
		}
		.child-comments{
			margin-left: 50px;
		}
		.comment,
		.webmention{
			position: relative;
			background-color: lightgrey;
			background-color: var(--card-comments-background-color);
			*{
				position: relative;
				z-index: 5;
			}
			&.depth-1:first-child{
				padding-top: 10px;
			}
			&.depth-1:last-child{
				padding-bottom: 40px;
			}
			p:first-child{
				margin-top: 0;
			}
			p:last-child{
				margin-bottom: 0;
			}
		}
		.comment-meta{
			padding: 30px 20px;
		}
		.comment-content{
			padding: 30px 20px;
			padding-top: 0;
			padding-left: 85px;
			margin-top: -50px;
			padding-bottom: 0;
		}
		.comment-footer{
			padding: 30px 20px;
			padding-top: 0;
			padding-left: 85px;
			p{
				margin: 0;
			}
		}
	}
}

.tag-rip-en .content-card,
.tag-rip-de .content-card,
.tag-rip .content-card{
	&::before{
		content: "";
		display: block;
		position: absolute;
		top: -60px;
		right: 0;
		width: 40px;
		height: 200px;
		.rotate(-45deg);
		.drop-shadow();
		background-color: #000;
		z-index: 15;
	}
}

.tag-sot-en .content-card,
.tag-sot-de .content-card,
.tag-sot .content-card{
	&::after{
		content: "";
		display: block;
		position: absolute;
		top: -70px;
		right: 0;
		width: 40px;
		height: 200px;
		.rotate(-45deg);
		.drop-shadow();
		background-color: #ffd400;
		z-index: 13;
	}
}
