/**
 * All of this page is generated in JSON Components so we need some extra hacks until we can change the component
 */
div.pageContent > div.wrapper > div.search h1 {
    margin: 0;
    margin-bottom: 1em;
}

.searchWrapper form.searchStrip {
	height: 3em;
	border: none;
	box-shadow: var(--box-shadow);
	border-radius: 30px;
	padding: .3rem;
	display: flex;
	align-items: center;
	background-color: var(--top-search-bar-background-color);
	color: var(--top-search-bar-text-color);
}

.searchWrapper input {
	margin-left: 20px;
	width: 87%;
	background-color: transparent;
	border: none;
	color: var(--menu-entered-color);
}

.searchWrapper button {
	width: 2rem;
	height: 2rem;
}

.searchWrapper button>svg {
	width: 1.5rem;
	height: 1.5rem;
}

@media screen and (max-width: 768px) {
	.headerGroup .pageHeader {
		position: relative;
	}
	.headerGroup .pageHeader .searchWrapper form.searchStrip {
		border-radius: 0;
	}
	.headerGroup .pageHeader .searchWrapper {
		position: absolute;
		top: 3.7rem;
		left: 0;
		display: flex;
		z-index: 100;
		padding:0;
	}
	.searchWrapper form.searchStrip {
		display: none;
	}
	.searchWrapper input {
		width: 84%;
	}
	
}