
.wp-post-nav {
    position: relative;
    margin:0;  
}

.wp-post-nav #post-nav-previous {
    background: #2d2e2f;
    height: auto;
    width: 45vw;
    line-height: 19px;
    position: fixed;
    bottom: 50%;
    left: -45vw;
    transform: translateY(50%);
    z-index: 100;
    align-items:center;
    -webkit-align-items: center;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    margin:0;
    padding:20px;
    list-style-type:none;
}

.wp-post-nav #post-nav-previous-button {
    background:#2d2e2f;
    padding:10px;
    line-height: 100px;
    text-align: center;
    align-items:center;
    position:absolute;
    width: 70px;
    height: 100px;
    right: -70px;
    bottom: 50%;
    transform: translateY(50%);
}

.wp-post-nav #post-nav-previous-button:before {
    content: url('../images/left-arrow.png');
    bottom: 50%;
    position: fixed;
    transform: translateY(55%);
    right: 20%;
}

.wp-post-nav #post-nav-previous:hover {
    left: 0;
    background:#2d2e2f;
}

.wp-post-nav #post-nav-previous:hover #post-nav-previous-button {
    background:#2d2e2f;
}

.wp-post-nav #post-nav-next {
    background: #2d2e2f;
    height: auto;
    width: 45vw;
    line-height: 19px;
    position: fixed;
    bottom: 50%;
    right: -45vw;
    transform: translateY(50%);
    z-index: 100;
    align-items:center;
    -webkit-align-items: center;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    margin:0;
    padding:20px;
    list-style-type:none;
}

.wp-post-nav #post-nav-next-button {
    background:#2d2e2f;
    padding:10px;
    line-height: 100px;
    text-align: center;
    align-items:center;
    position:absolute;
    width: 70px;
    height: 100px;
    left: -70px;
    bottom: 50%;
    transform: translateY(50%);
}

.wp-post-nav #post-nav-next-button:after {
    content: url('../images/right-arrow.png');
    bottom: 50%;
    position: fixed;
    transform: translateY(55%);
    left: 20%;
}

.wp-post-nav #post-nav-next:hover {
    right: 0;
    background:#2d2e2f;
}

.wp-post-nav #post-nav-next:hover #post-nav-next-button {
    background:#2d2e2f;
}

.wp-post-nav .post-nav-image img,
.wp-post-nav .avatar {
        width:auto;
        height:150px;
        margin-left:auto;
        margin-right:auto;
        text-align:center;
        display:block;
        margin-bottom:10px;
}

.wp-post-nav .post-nav-title {
    text-align:center;
    color:#ededed;
    font-size:15px;
    margin-bottom:20px;
    text-transform:capitalize;
}

.wp-post-nav .post-nav-category {

    color:#ffffff;
    font-size:13px;
    margin-bottom:10px;
}

.wp-post-nav .post-nav-excerpt {

    color:#ffffff;
    font-size:12px;
}

.wp-post-nav #attachment-post-nav-previous {
    background: #2d2e2f;
    height: auto;
    width: 10vw;
    line-height: 19px;
    position: fixed;
    top: 50%;
    left: -10vw;
    transform: translateY(-50%);
    z-index: 100;
    align-items:center;
    -webkit-align-items: center;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    margin:0;
    padding:20px;
    list-style-type:none;
    color:#ededed;
}

.wp-post-nav #attachment-post-nav-previous:after {
    content: url('../images/left-arrow.png');
    background:#2d2e2f;
    padding:10px;
    line-height: 100px;
    text-align: center;
    align-items:center;
    position:absolute;
    width: 70px;
    height: 100px;
    right: -70px;
    top: 50%;
    transform: translateY(-50%);
}

.wp-post-nav #attachment-post-nav-previous:hover {
    left: 0;
}

@media only screen and (max-width: 48em) {
        .wp-post-nav {
            margin:0;
        }

        .wp-post-nav #post-nav-previous {
            height: 10vh;
            width: 45vw;
            line-height: 19px;
            bottom: 5vh;
            left: 0;
            z-index: 100;
            padding:10px;
        }

        .wp-post-nav #post-nav-previous:before {
            content: url('../images/left-arrow.png');
            position:fixed;
            bottom:50%;
            right:0;
            margin-right:10px;
            transform:translateY(70%);
        }

        .wp-post-nav #post-nav-previous-button {
            display:none;     
        }

        .wp-post-nav #post-nav-next {
            height: 10vh;
            width: 45vw;
            line-height: 19px;
            bottom: 5vh;
            right: 0;
            z-index: 100;
            padding:10px;
        }

        .wp-post-nav #post-nav-next:before {
            content: url('../images/right-arrow.png');
            position:fixed;
            bottom:50%;
            transform:translateY(70%);
        }

        .wp-post-nav #post-nav-next-button {
            display:none;   
        }

        .wp-post-nav .post-nav-image,
        .wp-post-nav .post_nav_image .avatar,
        .wp-post-nav .post-nav-category,
        .wp-post-nav .post-nav-excerpt {
                display:none;
        }

        .wp-post-nav #post-nav-next .post-nav-title {
            text-align:center;
            color:#ededed;
            font-size:12px;
            text-transform:capitalize;
            margin-bottom:3%;
            margin-top:8%;
            margin-left:20px;
        }

        .wp-post-nav #post-nav-previous .post-nav-title {
            text-align:center;
            color:#ededed;
            font-size:12px;
            text-transform:capitalize;
            margin-bottom:3%;
            margin-top:8%;
            margin-right:20px;
        }

        .wp-post-nav #attachment-post-nav-previous {
            
        }

        .wp-post-nav #attachment-post-nav-previous:after {
           
        }
}