/* WIDGET: SHOWCASE 1
-------------------------------------------- */

.vlt-showcase--style-1 {
	position: relative;
	background-color: var(--vlt-color-dark);

	.vlt-showcase-item {
		position: relative;
		height: 100%;
		overflow: hidden;

		&__background {
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			z-index: -1;

			img {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				/* support for plugin https://github.com/bfred-it/object-fit-images */
				font-family: "object-fit: cover;";
				z-index: -1;
				object-fit: cover;
			}

			&::before,
			&::after {
				content: '';
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				display: block;
			}

			&::before {
				background-color: rgba(0, 0, 0, .25);
			}

			&::after {
				background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 150px);
			}

		}

		&__content {
			padding: px2rem(200px) 0;
		}

	}

	.vlt-swiper-pagination {
		position: absolute;
		left: 0;
		width: 100%;
		margin-bottom: px2rem(30px);
		color: var(--vlt-color-white);
		z-index: 2;
	}

}