---
title: collection 
body_class: standard
---

<%= partial "views/common/header", :locals => { :css_class => "", :data_attr => ""  } %> 
<%= partial "views/common/navigation" %>

<%= partial "views/common/page-header", :locals => { :title => "Search",  :section_text => "collection", :sub_nav => false, :css_class => "", :style => "" } %>


<form class="search-bar" data-search-bar>

		<div class="top" data-search-bar-top>
			<div class="container">
				<div class="select select--collection select--large" data-select>
					<select>
						<option selected="" value="all">All Archieve Material</option>
						<option value="archieve">Physical Collection</option>
						<option value="opt2">Libary collection</option>
					</select>
				</div>

				<div class="form__field form__field--button form__field--search">
					<input type="text" name="" placeholder="MAKE A SEARCH" />
					<button><i></i></button>
				</div>
			</div>
		</div>

		<div class="bottom">
			<div class="container">
				<div class="select select--large" data-select>
					<select>
						<option selected="" value="all">Content type</option>
						<option value="option">option</option>
						<option value="option">option</option>
						<option value="option">option</option>
						<option value="option">option</option>
						<option value="option">option</option>
						<option value="option">option</option>
						<option value="option">option</option>
					</select>
				</div>
				
				<div class="select select--large">
					<select>
						<option>Media / Format</option>
					</select>
				</div>

				<div class="select select--large">
					<select>
						<option>Access</option>
					</select>
				</div>

				<div class="select select--large">
					<select>
						<option>Language</option>
					</select>
				</div>
			</div>
		</div>
	</div>

	<div class="search-filters">
		<div class="container">
			<ul class="tags">
				<li class="tags__tag--criteria">
					Category: Earrings
					<a href="#/remove">remove</a>
				</li>
				<li class="tags__tag--criteria">
					Category: Earrings
					<a href="#/remove"">remove</a>
				</li>
				<li class="tags__tag--criteria">
					Category: Earrings
					<a href="#/remove">remove</a>
				</li>
				<li class="tags__tag--criteria">
					Category: Earrings
					<a href="#/remove"">remove</a>
				</li>
				<li class="tags__tag--criteria">
					Category: Earrings
					<a href="#/remove">remove</a>
				</li>
				<li class="tags__tag--criteria">
					Category: Earrings
					<a href="#/remove"">remove</a>
				</li>
			</ul>
		</div>
		
	</div>

</form>

<main>
	<section class="container">

		<div class="grid-actions grid-actions--search">
			<div class="container">
				
				<div class="sort">
					<div class="select select--sort" data-select>
						<select>
							<option selected="" value="all">Sort by: Earliest to Latest</option>
							<option value="option">option</option>
							<option value="option">option</option>
							<option value="option">option</option>
							<option value="option">option</option>
							<option value="option">option</option>
							<option value="option">option</option>
							<option value="option">option</option>
						</select>
					</div>
				</div>

				<div class="count">
					9999 Results
				</div>

				<div class="switch">
					<a href="#/grid" class="active grid" data-toggle="tooltip" data-placement="top" data-container="body" title="Switch to grid view">Grid</a>
					<a href="#/grid" class="row" data-toggle="tooltip" data-placement="top" data-container="body" title="Switch to row view">Row</a>
				</div>
			</div>
		</div>
		
		<%= partial "views/style-guide/masonry_results" %>

	</section>
</main>

<%= partial "views/common/footer" %>