{embed="embeds/header"}

	<div class="container">
		<section id="maincontent" class="twelve columns">
	
			{!-- TITLE & INTRO --}
			{exp:channel:entries channel="pages" limit="1" disable="categories|member_data|pagination|category_fields" require_entry="yes"}
				<h1>Photos</h1>
				{page-copy}
			{/exp:channel:entries}
	
			<hr>
			
			{!-- CATEGORY LIST --}
			<ul id="filter">
				<li class="current">
					<a href="#" data-filter="*">All Photos</a>
				</li>
				{exp:channel:categories channel="photos" style="linear" show_empty="no"}
					<li>
						<a href="#" data-filter=".{category_url_title}">{category_name}</a>
					</li>
				{/exp:channel:categories}
			</ul>
			<div class="clear"></div>
			
			{!-- PHOTOS --}
			<ul id="ts-display-pf-filterable">
				{exp:channel:entries channel="photos" dynamic="no" disable="member_data|pagination|category_fields" limit="500"}
					{!--NO EDIT BUTTON--}
					<li class="item {categories}{category_url_title} {/categories}">
						<div class="ts-display-pf-img">
							<a class="image" href="{exp:ce_img:single src="{image}" url_only="yes"}" data-rel="prettyPhoto" title="{photo_caption}"> <span class="rollover">{photo_caption}</span> <img src='{exp:ce_img:single src="{image}" height="420" width="420" crop="yes" url_only="yes" allow_scale_larger="yes"}' alt=""></a>
						</div>
						<div class="ts-display-pf-text">
							<h2>{title}</h2>
						</div>
						<div class="ts-display-clear"></div>
					</li>
				{/exp:channel:entries}
			</ul>
			<!-- End Portfolio Items -->
	
			<div class="clear"></div><!-- clear float -->
	
		</section>
	</div>
	<div class="clear"></div>

{embed="embeds/footer"}