// -------------------------------------------------------------------
// :: search
// -------------------------------------------------------------------
.o-search {

	width: 100%;

	&__content {
		width: 85%;

		@include FLOW-at($mobile) {
			width: 75%;
		}

		&__wrapper {
			align-items: center;
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
			width: 100%;
			min-height: 250px;
			transition: 0.5s background ease-in-out;

			@include FLOW-at($mobile) {
				min-height: 400px;
			}

			&.is-focused {
				background-color: rgba($dark-extra, 0.5);

				@include FLOW-to($mobile) {
					span.icon-search {
						display: none;
					}

					.m-search__field-holder {
						input {
							padding: rem(20px) rem(25px);
							padding-left: rem(25px);
						}
					}
				}

			}
		}

		&__link {
			color: $white;
			display: block;
			margin-top: 0.75em;
		}
	}
}