/*********************************************
 * Page Blog Detail
**********************************************/
body.post-detail .site-content__main {--vii-spacing-default:45px;}
body.post-detail .vii-blog-element {margin-bottom:var(--vii-spacing-100);}

/* columns */
.blog-detail-col.left {width:25%; padding-right:20px;}
.blog-detail-col.right {width:75%;}
.blog-detail-col-inner {max-width:780px;}

/* image */
.site-content__header__image-bg {padding-top:43%;}

/* Left column */
.blog-detail-col__inner {
    width:100%; max-width:200px;
    position:sticky; top:20px; transition:var(--vii-transition-slow);
}
@media only screen and (min-width:1181px) {
    html.menu-open .blog-detail-col__inner {top:calc(var(--vii-header-height) + 20px);}
}

/*********************************************
 * Page Blog Detail Responsive
**********************************************/
@media only screen and (max-width:768px) {
    .site-content__date.blog-detail-col {width:100%;}
    .blog-detail-col.right {width:100%;}
    body.post-detail .site-content__main {padding-bottom:calc(var(--vii-spacing-default) + 40px); position:relative;}
    .blog-detail-col__inner {position:static;}
    .blog-detail-col.left .vii-share-block {display:none;}
    .blog-detail-col.left .vii-popup-form {position:absolute; left:0; bottom:0;}

    /* image */
    .site-content__header__image-bg {padding-top:50%;}
}

@media only screen and (max-width:480px) {
    body.post-detail .site-content__main {--vii-spacing-default:40px;}
    .blog-detail-col.right {width:100%;}

    /* image */
    .site-content__header__image-bg {padding-top:70%;}
}