.v-filter {
	background-color: var(--second-color);
	// margin-bottom: 5rem;
	position: relative;
	&__img {
		width: 100%;
		height: 60vh;
		object-fit: cover;
		display: block;
		filter: blur(4px);
	}
	&__overlay {
		position: absolute;
		top: 0;
		left: 0;
		// bottom: 3px;
		bottom: 0;
		right: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		background-color: rgba(black, 0.5);
		// backdrop-filter: blur(6px);
	}
	&__content {
		display: flex;
		justify-content: center;
		align-items: flex-end;
		background-color: white;
		// @include gradient-gen($primary);
		// @include boxshadow-md(black);
		background-color: rgba(black, 0.4);
		backdrop-filter: blur(5px);
		// box-shadow: 0 5px 35px 5px rgba(0, 0, 0, 0.12);
		padding: 3rem;
		// transform: translateY(3rem);
		border-radius: 8px;
	}
	&__title {
		color: var(--primary-text);
		padding: 2rem;
		text-align: center;
		font-size: 3rem;
		// text-shadow: 0 0 10px rgba($primary, 0.5);
	}
	&__input {
		display: flex;
		flex-direction: column;
		margin-left: 10px;
		flex-grow: 1;
		&:last-child {
			flex-grow: 1;
		}
		label {
			margin-bottom: 1rem;
			font-size: 14px;
			text-transform: uppercase;
			color: $primary-text;
		}
		select,
		button {
			min-height: 48px;
		}
		select {
			padding: 15px 70px 15px 20px;
			background-color: #f2f6f7;
			transition: all 0.35s ease;
			border: 0;
			border-radius: 4px;
			color: #666;
			font-size: 13px;
			cursor: pointer;
			border: thin solid #eee;
			&:hover {
				background-color: white;
				box-shadow: 0 8px 22px 0 rgba(0, 0, 0, 0.1);
			}
		}
		button {
			border-radius: 4px;
			border: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 1.8rem;
			background-color: #e2b71c;
			color: var(--primary-text);
			// border-radius: 4px;
			cursor: pointer;
			position: relative;
			overflow: hidden;
			span {
				z-index: 2;
			}
			&::before {
				position: absolute;
				content: '';
				transition: all 0.35s ease;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				background-color: rgba(white, 0.2);
				transform: translateX(-120%);
				z-index: 1;
			}
			&:hover {
				&::before {
					transform: translateX(0%) skew(25deg);
				}
			}
		}
	}
}