:root{
    --theme--blog-padding: 50px;
}

@media screen and (max-width: 767px) {
    :root{
        --theme--blog-padding: 0;
    }
}

.single-post main.site-main {
    position:relative;
}

.single-post #post-wrap {
    position:relative;
    z-index:1;
    margin-top:-30vh;
}

.single-post #post-wrap > .row {
    background:#fff;
    padding-top: var(--theme--blog-padding);
    margin-left: calc(var(--theme--blog-padding) * -1);
    margin-right: calc(var(--theme--blog-padding) * -1);
    border-radius: var(--theme--border-radius);
}

.single-post #post-wrap > .row > * {
    padding-left: var(--theme--blog-padding);
    padding-right: var(--theme--blog-padding);
}

.single-post #hero.blog-hero {
    position:relative;
}

.single-post #hero.blog-hero::after{
    content:'';
    display:block;
    position:absolute;
    bottom:0;
    left:0;
    width:100vw;
    height:20vh;
    background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
}

.single-post #hero.blog-hero > img {
    max-height:100vh;
    max-height:calc(100vh - 150px);
    object-fit:cover;
    width: 100%;
}

.entry-header p#breadcrumbs {
    font-size:0.75em;
}

.entry-header p#breadcrumbs a {
    font-weight:700;
}

.single-post article h1 {
    margin-bottom:30px;
}

.single-post article p > a {
    word-break: break-all;
}

.single-post article .related-posts {
    margin-top:50px;
}

.single-post article .related-posts h2 {
    margin-bottom:15px;
}

.single-post article .related-posts .latestPost.card .card-body h3 {
    font-size:1.25em;
    margin-top: 1rem;
}

@media screen and (max-width: 767px) {
    .single-post #post-wrap {
        margin-top:30px;
    }
    .single-post #hero.blog-hero::after{
        display:none;
    }
}