@media screen and (max-width: 767px) {
    .branding .branding__image-title {
        display: none;
    }

    .branding .branding__title--custom-image > b {
        display: block;
    }
}

@media screen and (min-width: 768px) {
    .story-layout .branding .branding__image-title,
    .program .branding .branding__image-title {
        height: 120px;
        margin-bottom: 5px;
    }

    /*
       highly specific selector in order to overcome an issue
       when pjaxing between a story layout (e.g. "about invisibilia")
       and program layout (e.g. most others)
    */
    .news .contentheader .branding.branding--custom .branding__mini-teaser {
        color: #636363;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        line-height: 1.3;
        align-self: center;
        width: auto;
    }

    .story-layout .branding .branding__title,
    .program .branding .branding__title {
        margin-right: 10px;
    }
}