.frame-type-plugin-news_pi1 {
    overflow: hidden;
}

.news-slider-featured {
    .article {
        position: relative;

        &::after {
            content: "";
            pointer-events: none;
            background: linear-gradient(0deg, rgba($black, .7), transparent);
            @include position(absolute, 30% 0 0);
        }

        a {
            color: $white;
        }

        img {
            height: auto;
            max-width: 100%;
            filter: grayscale(100%);
            transition: $transition-base;
        }

        .news-list-date {
            @include Rift-Regular;
        }

        .news-headline {
            @include Rift-Bold;
            font-size: $h4-font-size;
            display: block;
            color: $white;
            margin-bottom: 0;
        }

        .content {
            @include position(absolute, null 0 0 0);
            opacity: 0;
            z-index: 1;
            padding: $grid-gutter-width;
            transition: $transition-fade;
        }
            
        // Desktop
        @include media-breakpoint-up(md) {
            .news-headline {
                font-size: $h2-font-size;
            }

            .content {
                @include position(absolute, null 40% 0 0);
                padding: $grid-gutter-width*2;
            }
        }
    }

    .swiper-slide {
        &::before {
            content: "";
            background: rgba($white, .5);
            @include position(absolute, 0);
            pointer-events: none;
            transition: $transition-fade;
            z-index: 2;
        }

        &-active {
            &::before {
                opacity: 0;
            }

            img {
                filter: grayscale(0%);
            }

            .content {
                opacity: 1;
            }
        }
    }
}