.optib-page-hero {
position: relative;
width: 100%;
margin: 0;
padding: 24px 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 190px;
background-size: cover;
background-position: center;
color: #fff;
text-align: center;
}
@media (max-width: 767px) {
.optib-page-hero {
min-height: 140px;
padding: 16px 0;
} .optib-page-hero__title {
font-size: 26px;
} body.page .the-content.prose h2 {
font-size: 22px;
}
body.page .the-content.prose h3 {
font-size: 19px;
}
body.page .the-content.prose h4,
body.page .the-content.prose h5,
body.page .the-content.prose h6 {
font-size: 17px;
}
}
.optib-page-hero--image {
background-image:
linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45)),
var(--optib-page-hero-image);
}
.optib-page-hero--plain {
background-color: var(--color-primary, #333);
}
.optib-page-hero__title {
margin: 0;
color: #fff;
overflow-wrap: anywhere;
} .optib-page-hero.optib-page-hero .optib-breadcrumb-bar {
background: transparent;
color: #fff;
}
.optib-page-hero .optib-breadcrumb-bar a,
.optib-page-hero .optib-breadcrumb-bar .optib-crumbs__yoast a {
color: #fff;
}  .optib-page-hero .optib-breadcrumb-bar {
margin-bottom: 0;
} .optib-page-hero .optib-breadcrumb-bar .optib-crumbs__item + .optib-crumbs__item::before,
.optib-page-hero .optib-breadcrumb-bar .optib-crumbs__current,
.optib-page-hero .optib-breadcrumb-bar .optib-crumbs__yoast .breadcrumb_last {
color: #fff;
}
.optib-page-hero .optib-breadcrumb-bar .optib-crumbs__item--home::before {
background-color: #fff;
}