.discover-view {
	
	.intro {
		position: relative;
		padding: 90px 40px 70px;
		z-index: 1;

		.parallax {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 1;
		}

		.liner {
			z-index: 2;
			position: relative;
			color: $white;

			h2 {
				padding-bottom: 8px;
			}

			h3 {
				padding-bottom: 40px;
				opacity: 0.5;
			}
		}
	}

	section.grid-wrapper {
		padding-bottom: 10px;
		
		&:not(:first-child){
			padding-top: 0;
		}
	}

	.seeds {
		padding-top: 40px;

		.seed {
			display: inline-block;
			background: $blue;
			color: $white;
			padding: 8px 26px 8px 14px;
			font-size: 16px;
			position: relative;
			vertical-align: top;
			margin: 0 10px 10px 0;
			border-radius: 3px;

			.type {
				display: inline-block;
				font-size: 12px;
				opacity: 0.5;
				padding: 0 10px 0 5px;
			}

			.remove {
				font-size: 10px;
				padding: 12px;
				position: absolute;
				top: 0;
				right: 0;
				cursor: pointer;
			}
		}
	}

	.autocomplete-field {
		width: 250px;
		display: inline-block;
		vertical-align: top;
		padding: 0;

		.input {
			float: none;
			margin: 0 10px 10px 0;

			input {
				background: rgba(100,100,100,0.5);
				color: $white;
				padding: 7px 13px;
				font-size: 16px;
				border: 1px solid transparent;

				&:focus,
				&:active {
					border-color: $blue;
				}
			}

			&:after {
				background: $blue;
			}
		}
	}

	@include responsive( $bp_medium ){
		section {
			padding: 20px;
		}
	}
}

.discover-featured-view,
.discover-new-releases-view {
	.intro {
		position: relative;
		padding-top: 80px;

		header {
			margin-bottom: 0;
		}

		.parallax {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 1;
		}

		.content {
			padding: 40px;
			color: $white;
			position: relative;
			z-index: 2;

			.thumbnail {
				float: left;
				max-width: 200px;
			}

			h1,
			h2,
			h3,
			.actions {
				padding-left: 240px;
			}

			h2 {
				padding-top: 20px;
			}

			h3 {
				opacity: 0.5;
			}

			.actions {
				padding-top: 40px;
			}
		}
	}

	@include responsive( $bp_medium ){
		.intro {
			.content {
				padding: 20px;

				h1 {
					padding-top: 0;
				}

				h2,
				h3,
				.actions {
					padding-left: 120px;
				}

				.actions {
					padding-top: 15px;
				}

				.thumbnail {
					max-width: 100px;
				}
			}
		}
	}
}