article{
	border: solid;
}

#main {
	margin: 0 auto;
	margin-top: 15vh;
	width: 95%;
}

.mask {
	width: 100%;
	height: 15vh;
	float: left;
}

.mask_background {
	width: 100%;
	height: 200%;
	background-position: center;
	background-size: 100%;
}

.post{
	width: calc(100%);
	left: 0;
}

.post_content {
	overflow-wrap: break-word;
}

.post_content .note {
	text-align: right;
	font-family: "Courier New";
	font-size: 0.9em;
	font-weight: bold;
}

.post_content a {
	color: #0089e0;
}

/* Banner waiting overrides */

.lds-ellipsis.wait_post {
	float: right;
	width: 100%;
	height: auto;
}

.comment_reply_container {
	position: relative;
	display: flex;
	padding: 1em;
}

.lds-ellipsis div {
	width: 10px;
	height: 10px;
}

ul {
	list-style-type: none;
}

.reply {
	margin-left: 1em;
}

.post_comment {
	margin: 1em;
	padding: 1em;
	border: 1px solid #eeeeee;
	-webkit-box-shadow: 10px 10px 17px -10px rgba(0, 0, 0, 0.63);
	-moz-box-shadow: 10px 10px 17px -10px rgba(0, 0, 0, 0.63);
	box-shadow: 10px 10px 17px -10px rgba(0, 0, 0, 0.63);
}

.post_series {
	color: #0089e0;
	font-size: 0.8em;
}

.reply_content {
	margin: 0.5em;
	text-align: justify;
	font-weight: normal;
	padding-left: 1em;
}

.comment_usr, .reply_usr {
	text-align: right;
	font-size: 0.8em;
	font-weight: bolder;
	margin: 0.1em;
}

.comment_timestamp, .reply_timestamp {
	text-align: right;
	font-size: 0.7em;
	font-weight: bolder;
	margin: 0;
}

.comment_sep {
	border-bottom: solid 1px rgba(160, 160, 160, 0.9);
	margin: 0;
}

.info {
	font-size: 0.8em;
	font-weight: bolder;
	margin: 0.2 !important;
}

/* Image  */

.post_content img {
	margin: 0 auto;
	display: block;
	width: 60% !important;
	height: auto !important;
}

.quote {
	font-size: 0.9em;
	font-weight: bold;
	font-family: 'Courier New';
	border-bottom: solid 2px rgba(160, 160, 160, 0.3);
	border-top: solid 2px rgba(160, 160, 160, 0.3);
	padding: 1em 0 1em 0;
}

.post_header{
	position:relative;
	
}
.post_header:before{
  position:absolute;
  z-index:-1;
  top:0;
  left:0;
  bottom:0;
  right:0;
  
  filter:blur(4px);
  
  /* makup ? */
  box-shadow:inset 0 0 0 50vw rgba(255,255,255,0.2)
}

.title, .meta{
	/* backdrop-filter: blur(6px); */
	font-weight: bold;
	padding: 4em !important;	
}

.title>p, .meta>p{
	font-weight: bold;
}

.post_title{
	font-size: 5vh !important;
}

@media screen and (max-width: 1366px) {
	.post_title{
		font-size: 3vh !important;
	}

}

@media screen and (max-width: 980px) {
	.post {
		border-left: 0;
		border-right: 0;

	}

	.post>header{
		padding: 0 !important;
	}

	.post_title{
		font-size: 4vh !important;
	}

	.post_content img {
		width: 90% !important;
	}
	.title, .meta{
		padding: 2em !important;	
	}
}

@media screen and (max-width: 480px) {
	.post {
		padding: 1.5em 1.5em 0.1em 1.5em;
		margin: 0 0 2em 0;
	}

	.post_title{
		font-size: 3vh !important;
	}

	.post>header{
		padding: 0 !important;
	}
	.post_content img {
		width: 100% !important;
	}

	.title, .meta{
		padding: 1em !important;
		
	}
}