@extends('layouts.default')

@section('title', 'Gallery V1')

@push('css')
	<link href="/assets/plugins/lightbox2/dist/css/lightbox.css" rel="stylesheet" />
@endpush

@section('content')
	<!-- begin breadcrumb -->
	<ol class="breadcrumb float-xl-right">
		<li class="breadcrumb-item"><a href="javascript:;">Home</a></li>
		<li class="breadcrumb-item"><a href="javascript:;">Gallery</a></li>
		<li class="breadcrumb-item active">Gallery v1</li>
	</ol>
	<!-- end breadcrumb -->
	<!-- begin page-header -->
	<h1 class="page-header">Gallery <small>header small text goes here...</small></h1>
	<!-- end page-header -->
	<!-- begin #options -->
	<div id="options" class="m-b-10">
		<span class="gallery-option-set" id="filter" data-option-key="filter">
		<a href="#show-all" class="btn btn-default btn-xs active" data-option-value="*">Show All</a>
		<a href="#gallery-group-1" class="btn btn-default btn-xs" data-option-value=".gallery-group-1">Gallery Group 1</a>
		<a href="#gallery-group-2" class="btn btn-default btn-xs" data-option-value=".gallery-group-2">Gallery Group 2</a>
		<a href="#gallery-group-3" class="btn btn-default btn-xs" data-option-value=".gallery-group-3">Gallery Group 3</a>
		<a href="#gallery-group-4" class="btn btn-default btn-xs" data-option-value=".gallery-group-4">Gallery Group 4</a>
		</span>
	</div>
	<!-- end #options -->
	<!-- begin #gallery -->
	<div id="gallery" class="gallery">
		<!-- begin image -->
		<div class="image gallery-group-1">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-1.jpg" data-lightbox="gallery-group-1">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-1.jpg)"></div>
				</a>
				<p class="image-caption">
					#1382 - 3D Arch
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Lorem ipsum dolor sit amet</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Sean Ngu</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Nunc velit urna, aliquam at interdum sit amet, lacinia sit amet ligula. Quisque et erat eros. Aenean auctor metus in tortor placerat, non luctus justo blandit.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-1">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-2.jpg" data-lightbox="gallery-group-1">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-2.jpg)"></div>
				</a>
				<p class="image-caption">
					#2343 - Madness Arch
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Fusce aliquet ac quam at tincidunt</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Camryn Wong</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Fusce eu rutrum nisi, ut pretium mi. Sed mollis nisi sed auctor molestie. Vestibulum dictum pharetra leo sed euismod.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-1">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-3.jpg" data-lightbox="gallery-group-1">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-3.jpg)"></div>
				</a>
				<p class="image-caption">
					#3452 - Scottwills Arch
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Etiam lobortis egestas nisl</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Lelouch Wong</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
				</div>
				<div class="desc">
					Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus eget ultricies arcu.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-2">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-4.jpg" data-lightbox="gallery-group-2">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-4.jpg)"></div>
				</a>
				<p class="image-caption">
					#4123 - Scottwills Pinecone
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Donec mi quis volutpat ornare</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Richard Leong</a>
				</div>
				<div class="rating">
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut et augue luctus libero dignissim sodales, sapien consequat lacinia fringilla.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-2">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-5.jpg" data-lightbox="gallery-group-2">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-5.jpg)"></div>
				</a>
				<p class="image-caption">
					#9200 Kariminal Rider
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Donec pretium volutpat ornare</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Derrick Wong</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut et augue luctus libero, feugiat sapien consequat lacinia fringilla.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-3">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-6.jpg" data-lightbox="gallery-group-3">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-6.jpg)"></div>
				</a>
				<p class="image-caption">
					#1832 Scottwills Autumn
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Mi quis volutpat ornare sodales</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Apple Tong</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Ut et augue luctus libero dignissim sodales. Fusce feugiat sapien consequat lacinia fringilla. Vivamus eget ultricies arcu.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-3">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-7.jpg" data-lightbox="gallery-group-3">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-7.jpg)"></div>
				</a>
				<p class="image-caption">
					#0229 Scottwills Autumn 2
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Vestibulum ante ipsum primis</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Thomas Wong</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut et augue luctus libero dignissim sodales, sapien consequat lacinia fringilla.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-4">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-8.jpg" data-lightbox="gallery-group-4">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-8.jpg)"></div>
				</a>
				<p class="image-caption">
					#5721 Scottwills Snow
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Nunc eget hendrerit nisi sodales</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">Andy Wong</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star active"></span>
				</div>
				<div class="desc">
					Ut et augue nisi sodales luctus libero dignissim sodales. Fusce feugiat nisi sodales sapien consequat lacinia fringilla.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-4">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-9.jpg" data-lightbox="gallery-group-4">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-9.jpg)"></div>
				</a>
				<p class="image-caption">
					#9921 Scottwills Riverbank
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Nunc eget hendrerit nisi dignissim</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">William Tan</a>
				</div>
				<div class="rating">
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Ut et augue luctus libero dignissim sodales. Fusce feugiat sapien consequat libero dignissim lacinia fringilla.
				</div>
			</div>
		</div>
		<!-- end image -->
		<!-- begin image -->
		<div class="image gallery-group-4">
			<div class="image-inner">
				<a href="/assets/img/gallery/gallery-10.jpg" data-lightbox="gallery-group-4">
					<div class="img" style="background-image: url(/assets/img/gallery/gallery-10.jpg" alt="" />
				</a>
				<p class="image-caption">
					#6436 Scottwills Buss
				</p>
			</div>
			<div class="image-info">
				<h5 class="title">Sed mollis nisi sed auctor</h5>
				<div class="pull-right">
					<small>by</small> <a href="javascript:;">David King</a>
				</div>
				<div class="rating">
					<span class="star active"></span>
					<span class="star active"></span>
					<span class="star"></span>
					<span class="star"></span>
					<span class="star"></span>
				</div>
				<div class="desc">
					Vestibulum dictum pharetra leo sed euismod. Lorem ipsum dolor sit amet, consectetur adipiscing feugiat sapien elit.
				</div>
			</div>
		</div>
		<!-- end image -->
	</div>
	<!-- end #gallery -->
@endsection

@push('scripts')
	<script src="/assets/plugins/isotope-layout/dist/isotope.pkgd.min.js"></script>
	<script src="/assets/plugins/lightbox2/dist/js/lightbox.min.js"></script>
	<script src="/assets/js/demo/gallery.demo.js"></script>
@endpush