.p-view {
	display:flex;
	justify-content:space-between;	
	margin:0 auto 0 -6vw;
}
.p-view-left {	
	height:auto;	
	width:100%;
	padding:0 0 0 0;
	border-top:1px solid #aaa;
}

.p-view-right {		
	background: linear-gradient(0deg, #dfebd1 0%, rgba(34, 193, 195, 0.23));
	height:auto;
	vertical-align:top;
	padding:10px;
	margin-left:30px;
}

.posts-table {
	display: grid;
	grid-template-columns: 280px 280px 280px 280px;		/* Total width of left column = sum of = 1000px  */
	padding:0;
	
}
.posts-table > div {
	background:transparent;
	height:280px;
	border-right:1px solid #aaa;
	border-bottom:1px solid #aaa;
	margin:8px 0 0 10px;	
	text-align: left;	
}

.post-info-bar div {
	padding:0 0 10px 0;
	font-size:16px;
	color:#3B5E69;
	margin-left:-6vw;
}

.cpt-img {
	background: rgba(211, 227, 189, 0.75);
	backdrop-filter: blur(4.5px);
	-webkit-backdrop-filter: blur(4.5px);
	height:90px;
	width:95%;
	overflow-y:hidden;
	text-align:center;
}
.cpt-img img {	
	width:20%;
	transition:1.2s;
}
.cpt-img img:hover {	
	transition:.5s;
	scale: .96;
}

.post-title {	
	margin-top:8px;
	height:22px;
	padding-bottom:10px;
}
.post-title a {
	font-size:17px !important;
	color:green !important;
	font-weight:bold;
}
.post-title a:hover {
	color:#2499B2 !important;
	font-size:18px !important;
	transition:1.5s;
}

.post-content-excerpt {		/*Content shortened to */
	display:block;
	font-size:12px;
	height:52px;
	color:#3B5E69;	
}

.post-date {
	height:24px;	
}
.post-date div {
	display:inline-block;
	height:5px;
	font-size:12px;	
	cursor:pointer;
	color:#2499B2;
}
.post-date div:hover { color:#ccc; }

.post-cat-block {
	height:20px;
	line-height:.8em;
	padding:0 5px 10px 0;
}
.post-cat-block span {
	font-size:12px;
	color:#2499B2;
	cursor:pointer;	
}
.post-cat-block span:hover { color:#ccc; }

.post-audio {
	margin-top:19px;
	width:95%;
	background:transparent;
	overflow: hidden;
}
.post-audio audio {
	width:300px;
	height:12px;
	margin-left:-20px;
	background:#ffe;	
}
audio::-webkit-media-controls-play-button,
     audio::-webkit-media-controls-panel {
     background-color:#eeeedd;    
}

/*pagination*/
.fa-caret-left, .fa-caret-right {
	font-size:30px;
	cursor:pointer;
}

.post-pagination {
	display: flex;
	align-items: center;
	position:sticky;
	bottom:0;
	width:98.5%;
	margin:10px 0px 0px 0px;
	padding:5px;
	overflow-x:auto;
	background: radial-gradient(#ffffe5 50%, transparent 90%);
}

.post-pagination button {
	cursor:pointer;
	border:none;
	width:30px;
	padding:5px;
	border-radius:10px;
	color:white;
	background:#cee7d0;
}
.post-pagination button:hover { background:#eee; color:#444;}


@media screen and (max-width: 680px) {
	.p-view {
		display:block;
		width:100%;
	}
	.p-view-left {	
		height:auto;	
		width:100%;
		margin:0 0 0 20px;
	}

	.p-view-right {		
		height:auto;
		width:100% !impotant;
		margin:20px 0 0 20px;
	}

	.posts-table {
		display:block;
		height:auto;
	}	

	.post-info-bar div {		
		font-size:12px;
		color:#3B5E69 !important;
		margin-left:20px;
	}
	
	.posts-table > div {
		height:280px;
	}

	.cpt-img {
		height:180px;
		width:95%;
		overflow-y:hidden;
		text-align:center;
	}	
	
	.post-title a {
		font-size:22px !important;
		color:green !important;
		font-weight:bold;
	}	

	.post-content-excerpt {		/*Content shortened to */
		font-size:12px;
		height:52px;
	}
	.post-date div {
		display:inline-block;
		height:5px;
		font-size:12px;	
		cursor:pointer;
		color:#2499B2 !important;
	}	

	.post-cat-block {
		height:30px;
		margin-bottom:10px !important;
		line-height:1em;
		
	}
	.post-cat-block span {
		font-size:12px;
		color:#2499B2;
		cursor:pointer;	
	}		

	/*pagination*/
	.fa-caret-left, .fa-caret-right {
		font-size:30px;
		cursor:pointer;
	}

	.post-pagination {
		background: radial-gradient(#ffffe5 70%, transparent 100%);
		width:100%;
		margin-left:-6px;
	}

	.post-pagination button {
		cursor:pointer;
		border:none;
		width:30px;
		padding:5px;
		border-radius:10px;
		color:white;
		background:#cee7d0;
	}
	
	
}