@include('templates.header')

    <section class="project-single">
	    <!-- Intro -->
	    <header class="header-page header-page--half js-opacity"><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		    <div class="container">
			    <!-- Title -->
	            <h6 class="title title--overhead title--tail">Project</h6>
		        <h1 class="title title--display-1 js-lines">Coast2Coast Wheels</h1>
			    <!-- /Title -->
			</div>
		</header>
        <!-- /Intro -->
		
		<!-- Image -->
		<figure class="image-container jarallax reveal">
			<img class="jarallax-img cover lazyload" src="assets/img/c2c-01.jpg" alt="" />
		</figure>
		<!-- /Image -->
        
		<div class="container">
			<!-- Details -->
			<div class="case-details">
                <div class="item-details">
					<span class="item-details__title title--overhead">Client</span>
					<span class="item-details__text"><b>Coast2Coast Wheels</b></span>
				</div>
            <!--    <div class="item-details">
					<span class="item-details__title title--overhead">Year</span>
					<span class="item-details__text"></span>
				</div>-->
			    <div class="item-details">
					<span class="item-details__title title--overhead">Category</span>
					<span class="item-details__text">Web Design/digital marketing/Social media</span>
				</div>
			    <div class="item-details item-details--end">
				    <a class="btn-link" target="_blank" href="https://www.coast2coastwheels.ca/">See Website<i class="circle circle--right icon-right-open"></i></a>
				</div>
			</div>
			<!-- /Details -->		
		</div>
		
		<article class="caption-single container">
            <div class="row">
		        <div class="col-12 col-lg-2"><span class="num-article">01 —</span></div>
			    <div class="col-12 col-lg-9">
			        <h2 class="title title--h4 js-lines">Overview.</h2>
				    <div class="description js-block">
				        <p>Offers the best Custom Wheels and Rims, wrapped in Brand Name Tires. </p>
			        </div>
			    </div>
		    </div>
		</article>
		
		<!-- Image -->
		<figure class="image-container image-container--gutters reveal">
			<img class="cover lazyload" src="assets/img/c2c-02.jpg" alt="" />
		</figure>
		<!-- /Image -->
		
		<article class="caption-single container">
            <div class="row">
		        <div class="col-12 col-lg-2"><span class="num-article">02 —</span></div>
			    <div class="col-12 col-lg-9">
			        <h2 class="title title--h4 js-lines">Challenge.</h2>
				    <div class="description js-block">
				        <p>Coast2coast needed assistance in integrating 43,000 skus on a custom e-commerce site. In addition to this, they needed Brand awareness, business growth and measurable conversions on the digital side.</p>
			        </div>
			    </div>
		    </div>
		</article>
		
		<!-- Slider -->
		<div class="slider slider-simply image-container--half reveal">
		    <div class="slider-article swiper-container">
                <div class="swiper-wrapper">
			        <div class="swiper-slide">
						<div class="cover-slider lazyload" data-bg="assets/img/c2c-03.jpg"></div>
					</div>
			 <!--       <div class="swiper-slide">
						<div class="cover-slider lazyload" data-bg="assets/img/IMAGE 2  Coast2Coast Wheels.png"></div>
					</div>
			        <div class="swiper-slide">
						<div class="cover-slider lazyload" data-bg="assets/img/IMAGE 1 Coast2Coast Wheels.png"></div>
					</div>-->
		        </div>
			</div>

			<div class="control-slider control-slider--bottom swiper-control">
                <div class="swiper-button-next swiper-button-next--square zoom-cursor">
                    <i class="icon-up-open"></i>
				</div>
				<div class="swiper-button-prev swiper-button-prev--square zoom-cursor">
                    <i class="icon-down-open"></i>
				</div>
			</div>
		</div>
		<!-- /Slider -->

		<article class="caption-single container">
            <div class="row">
		        <div class="col-12 col-lg-2"><span class="num-article">03 —</span></div>
			    <div class="col-12 col-lg-9">
			        <h2 class="title title--h4 js-lines">Approach.</h2>
				    <div class="description js-block">
				        <p>We took time out understanding the brand and the objectives. This in turn paved the way of crafting a custom JSP site built around the framework of the Custom Marketing objectives.</p>
			        </div>
			    </div>
		    </div>
		</article>
		
		<!-- Image -->
		<figure class="image-container reveal">
			<img class="cover lazyload" src="assets/img/c2c-04.jpg" alt="" />
		</figure>
		<!-- /Image -->
		
	<!--	<div class="caption-single container">
		    <div class="row">
		        <div class="col-12 col-md-6 award-item">
		            <h4 class="title title--h6 js-lines">AWARDS</h4>
			        <div class="js-lines">Site of the Day — Dec 2017</div>
		        </div>
		        <div class="col-12 col-md-6 award-item">
		            <h4 class="title title--h6 js-lines">CSSDesignAwards</h4>
			        <div class="js-lines">Site of the Day — Dec 2017</div>
		        </div>
			</div>
		</div>-->
		
		<!-- Page nav -->
		    <nav class="page-nav">
			    <a class="btn-link" href="{{route('boss')}}"><i class="circle circle--left icon-left-open"></i><span>Prev project</span></a>
				<a class="btn-link" href="{{route('kombucha')}}"><span>Next project</span><i class="circle circle--right icon-right-open"></i></a>
			</nav>
		<!-- /Page nav -->
	</section>
    <!-- /Intro -->

@include('templates.footer')