/****************************
 * Header
*****************************/
.site-banner {position:relative; z-index:5;}
.site-banner-image {height:400px; position:relative;}
.site-banner-image:before, .site-banner-image:after {
    content:""; position:absolute; top:0; left:0; width:100%; height:100%;
}

/* Breadcrumbs */
.site-breadcrumbs-title {
    --breadcrumbs-height:48px;
}
.site-breadcrumbs-title:before {
    content:""; position:absolute; width:100%; height:var(--breadcrumbs-height); bottom:0; z-index:2;
    background-color:var(--vii-color-blue); mix-blend-mode:multiply;
}

.site-breadcrumbs {width:100%; min-height:48px}
.site-breadcrumbs a {color:var(--vii-color-white); font-weight:400;}

/* hover */
.site-breadcrumbs a:hover,
.site-breadcrumbs a:focus {text-decoration:underline;}

.site-breadcrumbs .container {display:flex;}
.site-breadcrumbs .container > span {
    display:inline-block; white-space:nowrap; max-width:var(--vii-container);
    text-overflow:ellipsis; overflow:hidden;
}
.site-breadcrumbs span.breadcrumb_last {text-transform:uppercase;}

.breadcrumb-sep {font-size:1em; padding:0 1px;}
.breadcrumb-sep ~ .breadcrumb-sep {padding:0 5px;}

/* Header Template 2 */
.site-blog-detail__category:hover,
.site-blog-detail__category:focus {text-decoration:underline; color:var(--vii-color-blue) !important;}

/* Header Template 3 */
.site-banner.-type-3 .page-title {font-size:64px; font-family:var(--vii-font-primary);}

/* Header Compact */
.site-banner.-compact .site-banner-image {height:48px;}


/****************************
 * Header Responsive
*****************************/
@media only screen and (max-width:1024px) {
    /* Header Template 3 */
    .site-banner.-type-3 .page-title {font-size:var(--vii-size-48);}
}
@media only screen and (max-width:768px) {
    /* Banner Image */
    .site-banner-image {height:300px;}
}
@media only screen and (max-width:480px) {
    /* Banner Image */
    .site-banner-image {height:200px;}


    /* Banner 2 */
    .site-banner.-type-2 {padding-top:var(--vii-spacing-24); --vii-spacing-60:var(--vii-spacing-24);}
    .site-button-back {display:none;}
}