@extends('layouts.app2')

@section('head-title')
    <title>Brhands Foundation</title>
@endsection

@section('head-style')
    {{-- <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.6/jquery.fullpage.css"> --}}
    {{-- <link rel="stylesheet" type="text/css" href="css/style.css"> --}}
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('css/Fullpage/jquery.fullpage.css')}}">
    <link rel="stylesheet" type="text/css" href="{{ URL::asset('css/style.css')}}">

@endsection

@section('content')
<div id="homepage">
	<div class="row">
		<div class="scroll-inner">
			<div class="menu-lateral">
				<ul id="myMenu">
					<li data-menuanchor="foundation" class="active"><a href="#foundation"><i class="fa fa-circle"></i></a></li>
					<li data-menuanchor="creativeminds"><a href="#creativeminds"><i class="fa fa-circle"></i></a></li>
					<li data-menuanchor="craftsmanship"><a href="#craftsmanship"><i class="fa fa-circle"></i></a></li>
					<li data-menuanchor="masterofcraftsmanship"><a href="#masterofcraftsmanship"><i class="fa fa-circle"></i></a></li>
					<li data-menuanchor="workshopsandjobcareers"><a href="#workshopsandjobcareers"><i class="fa fa-circle"></i></a></li>
				</ul>
			</div>
			<div id="fullpage">
				<div class="section demo" id="section0" data-anchor="foundation">

  					<div class="c-hero-flex">
              <a style="width:100%; height:100%; position:absolute; display:inline-block;" href="https://www.covetfoundation.com/foundation/mission">  </a>
  						<div class="c-hero-flex__item">
  						    <!-- <h2 class="title-foundation">FOUNDATION</h2> -->
                  <h2 style="font-size:20px;" class="title-foundation">WE WANT TO CELEBRATE AND HONOUR THE CRAFTSMANSHIP</h2>
  						    <!-- <div class="excerpt-f">
  						    	<p>WE WANT TO CELEBRATE AND HONOUR THE CRAFTSMANSHIP.</p>
  						    </div> -->
  						    <div class="see-more-btn">
  						    	<a href="https://www.covetfoundation.com/foundation/mission">SEE MORE +</a>
  						    </div>
  						    <a class="arrowdo" href="#creativeminds"><span></span></a>
  						</div>
  					</div>

				</div>
				<div class="section" id="section1" data-anchor="creativeminds">
					<div class="c-hero-flex">
            <a style="width:100%; height:100%; position:absolute; display:inline-block;" href="http://designandcraftsmanship.com/?utm_source=covetfoundation&utm_medium=summit&utm_content=dynamic&utm_campaign=summitevent">  </a>
						  <div class="c-hero-flex__item">
						    {{-- <h2 class="title-foundation">WHERE CREATIVE MINDS<br> AND ARTISANS MEET</h2>
						    <div class="see-more-btn btn-white">
						    	<a href="http://designandcraftsmanship.com/?utm_source=covetfoundation&utm_medium=summit&utm_content=dynamic&utm_campaign=summitevent" target="_blank">GET MORE INFO</a>
						    </div> --}}
						    <div class="see-more-btn">
						    	<a href="http://designandcraftsmanship.com/?utm_source=covetfoundation&utm_medium=summit&utm_content=dynamic&utm_campaign=summitevent">SEE MORE +</a>
						    </div>
						  </div>
					</div>
				</div>
				<div class="section" id="section2" data-anchor="craftsmanship">
					<div class="c-hero-flex">
						  <div class="c-hero-flex__item">
						    <video data-autoplay id="videoplay" width="640" class="videoHt" controls style="display: block;" class="embed-responsive embed-responsive-16by9">
							  	<source class="embed-responsive-item" id="videogo" src="../videos/Brhands-Foundation-A-Tribute-to-Artisans-Craftmanship.mp4" type="video/mp4">
							</video>
						  </div>
					</div>
				</div>
				<div class="section" data-anchor="masterofcraftsmanship">
					<div class="c-hero-flex">
            <a style="width:100%; height:100%; position:absolute; display:inline-block;" href="https://www.covetfoundation.com/masters-craftsmanship/manifest">  </a>
						<div class="c-hero-flex__item">
						    <h2 class="title-foundation">MASTER OF CRAFTSMANSHIP</h2>
						    <div class="excerpt-f">
						    	<p>THE TALENT TO CREATE PIECES WITH THE HANDS IS <br>
						    	A COMMITMENT TO THE BEAUTY IN THE WORLD.</p>
						    </div>
						    <div class="see-more-btn">
						    	<a href="https://www.covetfoundation.com/masters-craftsmanship/manifest">SEE MORE +</a>
						    </div>
						</div>
					</div>
				</div>
				<div class="section" data-anchor="workshopsandjobcareers">
					<div class="c-hero-flex">
            <a style="width:100%; height:100%; position:absolute; display:inline-block;" href="https://www.covetfoundation.com/training-programme/training-and-careers-oportunities">  </a>
						<div class="c-hero-flex__item">
						    <h2 class="title-foundation">WORKSHOPS AND JOB CAREERS</h2>
						    <div class="excerpt-f">
						    	<p>FIND OUT THE OPPORTUNITY TO LEARN IN WORK-BASED METHOD <br>
						    		AND INTERNATIONAL ENVIRONMENT.</p>
						    </div>
						    <div class="see-more-btn">
						    	<a href="https://www.covetfoundation.com/training-programme/training-and-careers-oportunities">SEE MORE +</a>
						    </div>
						</div>
					</div>
				</div>
				@include('includes.footer-black')
			</div>
		</div>
	</div>
</div>
@endsection

@section('foot')

{{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.6/jquery.fullpage.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.6/vendors/jquery.easings.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.6/vendors/scrolloverflow.js"></script> --}}

<script src="{{ URL::asset('js/Fullpage/jquery.fullpage.js')}}"></script>
<script src="{{ URL::asset('js/Fullpage/jquery.easings.min.js')}}"></script>
<script src="{{ URL::asset('js/Fullpage/scrolloverflow.js')}}"></script>


<script type="text/javascript">

$(document).ready(function() {
	$('#fullpage').fullpage({
		anchors: ['foundation', 'creativeminds', 'craftsmanship', 'masterofcraftsmanship', 'workshopsandjobcareers'],
		menu: '#myMenu'
	});
	$('#footer').addClass('fp-auto-height');
});

//adding the action to the button
$(document).on('click', '#moveUp', function(){
		$.fn.fullpage.moveSectionUp();
});

var x = document.getElementById("videoplay");

function playVideo() {
	if(x.paused){
	    x.play();
	    x.style.display = "block";
	}else{
	    x.pause();
	}
}

</script>

@endsection