.post-nav{
	margin:0 0 4.3em
}
.post-nav .prev,
.post-nav .next{
	width:47%;
	position:relative
}
.post-nav .next{
	float:right;
	text-align:right
}
/* post nav link */
.post-nav a{
	text-decoration:none;
	display:flex;
	align-items:center
}
.post-nav .prev,
.post-nav .prev a{
	float:left
}
.post-nav .next a{
	float:right
}
/* post nav arrow */
.post-nav .arrow{
    display:block;
    float:left;
	color:#fff;
    min-width:56px;
    min-height:56px;
    width:56px;
    height:56px;
    text-align:center;
    text-decoration:none;
    position:relative;
    overflow:hidden;
    border-radius:8px;	
    transition:margin .3s linear
}
.post-nav .prev .arrow{
	margin-right:1em
}
.post-nav .next .arrow{
	float:right;
	margin-left:1em;
	order:2
}
.post-nav .prev a:hover .arrow{
	margin-right:1.5em
}
.post-nav .next a:hover .arrow{
	margin-left:1.5em
}
.post-nav .next a{
	margin-right:auto;
	justify-content:flex-end
}
.post-nav .next .arrow:before,
.post-nav .prev .arrow:before{
	content:"";
	font-size:1.7em;
	text-decoration:none;
	border:2px solid transparent;
	border-top-color:inherit;
	position:absolute;
	top:50%;
	left:50%;
	width:.55em;
	height:.65em;
	margin-left:-15px;
	margin-top:-11px;
	opacity:0;
	z-index:1
}
.post-nav .next .arrow:before{
	border-right-color:inherit;
	transform:rotateZ(45deg)
}
.post-nav .prev .arrow:before{
	border-left-color:inherit;
	transform:rotateZ(-45deg)
}
.post-nav .prev .arrow:after,
.post-nav .next .arrow:after{
    content:'';
    display:block;
    background-color:rgba(0,0,0,.3);
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    opacity:0;
    right:100%;
    transition:.3s linear
}
.post-nav .prev .arrow:after{
	left:100%
}
.post-nav .arrow .featimg{
	display:block;
	width:100%;
	height:100%;
	background-size:cover;
	transition:.3s linear
}
/* hover style */
.post-nav .prev a:hover span:before{
	animation:arrow-prev 1s infinite;
	animation-timing-function:linear
}
.post-nav .next a:hover span:before{
	animation:arrow-next 1s infinite;
	animation-timing-function:linear
}
.post-nav a:hover > .arrow .featimg{
	transform:scale(1.3)
}
.post-nav .next a:hover .arrow:before,
.post-nav .prev a:hover .arrow:before{
	opacity:1
}
.post-nav .prev a:hover .arrow:after{
	left:0;
	opacity:1
}
.post-nav .next a:hover .arrow:after{
	right:0;
	opacity:1
}
/* post nav animation */
@keyframes arrow-prev{
	0%,100%{left:50%}
	50%{left:30%}
}
@keyframes arrow-next{
	0%,100%{left:50%}
	50%{left:70%}
}

@media screen and (max-width:680px){
	.post-nav .prev,
	.post-nav .next{
		display:block;
		width:100%;
		clear:both;
		margin-bottom:10px
	}
}