@extends('layouts.frontend')
@section('content')
	<div class="banner_header">
		<div class="slider slider-for">
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
			<div class="slide_banner">
				<div class="banner_image">
					<img src="{{ asset('images/banner.png') }}">
				</div>
				<div class="banner_details">
					<h3>THE HOME OF RACING SIMULATION</h3>
					<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum.</p>
					<a href="#" class="btn">Book Now</a>
				</div>
			</div>
		</div>
		<div class="slide_thumbnails">
			<div class="heading_nav">
				<h3>SESSIONS</h3>
			</div>
			<div class="slider slider-nav">
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
				<div class="slide_thumbnail">
					<img src="{{ asset('images/placeholder.png') }}">
				</div>
			</div>
		</div>
	</div>
	<div class="welcome_section hide_tab">
		<div class="container">
			<div class="welcome_details">
				<h3>Our Experience.</h3>
				<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum urna faucibus vel. Curabitur dictum sapien ut urna pharetra, a interdum eros aliquam. </p>
			</div>
		</div>
	</div>
	<div class="section_products">
		<div class="row hide_tab">
			<div class="product_image">
				<img src="{{ asset('images/product.png') }}">
			</div>
			<div class="product_detail">
				<h3>V2 Motion</h3>
				<div class="line_bar"></div>
				<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum urna faucibus vel. Curabitur dictum sapien ut urna pharetra, a interdum eros aliquam. Vivamus maximus vel ante nec dictum. Sed diam quam, blandit a porttitor non, porta eget magna. </p>
				<a href="#" class="btn">Book Now</a>
			</div>
		</div>
		<div class="row right_image">
			<div class="product_detail">
				<h3>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h3>
				<div class="line_bar"></div>
				<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna, eget fermentum urna faucibus vel. Curabitur dictum sapien ut urna pharetra, a interdum eros aliquam. Vivamus maximus vel ante nec dictum. Sed diam quam, blandit a porttitor non, porta eget magna. </p>
				<a href="#" class="btn">Book Now</a>
			</div>
			<div class="product_image">
				<img src="{{ asset('images/product.png') }}">
			</div>
		</div>
	</div>
	<div class="section_testimonial">
		<div class="icon_testimonial">
			<p>“</p>
		</div>
		<div class="dot_testimonial">
			<div class="dot_slides">
				<div class="dot"></div>
				<div class="dot"></div>
				<div class="dot"></div>
				<div class="dot"></div>
				<div class="dot"></div>
			</div>
		</div>
		<div class="testimonial_details">
			<h3>Don’t take our word for it!</h3>
			<p>Donec at interdum massa, in ultrices nulla. Vestibulum faucibus sapien urna</p>
		</div>
		<div class="testimonial_slide">
			<div class="testimonial_item">
				<div class="stars_feedback">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
				</div>
				<div class="details_feedback">
					<p>NEXT LEVEL racing simulation machines and environment! State of the art machines with the best racing coaches ive had!</p>
				</div>
				<div class="author_feedback">
					<p>Sam Brown -  Berwick Mercedes Benz</p>
				</div>
			</div>
			<div class="testimonial_item">
				<div class="stars_feedback">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
				</div>
				<div class="details_feedback">
					<p>NEXT LEVEL racing simulation machines and environment! State of the art machines with the best racing coaches ive had!</p>
				</div>
				<div class="author_feedback">
					<p>Sam Brown -  Berwick Mercedes Benz</p>
				</div>
			</div>
			<div class="testimonial_item">
				<div class="stars_feedback">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
				</div>
				<div class="details_feedback">
					<p>NEXT LEVEL racing simulation machines and environment! State of the art machines with the best racing coaches ive had!</p>
				</div>
				<div class="author_feedback">
					<p>Sam Brown -  Berwick Mercedes Benz</p>
				</div>
			</div>
			<div class="testimonial_item">
				<div class="stars_feedback">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
				</div>
				<div class="details_feedback">
					<p>NEXT LEVEL racing simulation machines and environment! State of the art machines with the best racing coaches ive had!</p>
				</div>
				<div class="author_feedback">
					<p>Sam Brown -  Berwick Mercedes Benz</p>
				</div>
			</div>
			<div class="testimonial_item">
				<div class="stars_feedback">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
					<img src="{{ asset('images/star.png') }}">
				</div>
				<div class="details_feedback">
					<p>NEXT LEVEL racing simulation machines and environment! State of the art machines with the best racing coaches ive had!</p>
				</div>
				<div class="author_feedback">
					<p>Sam Brown -  Berwick Mercedes Benz</p>
				</div>
			</div>
		</div>
	</div>
@endsection
@section('scripts')
	<script>
		$('.slider-for').slick({
			slidesToShow: 1,
			slidesToScroll: 1,
			arrows: false,
			fade: true,
			asNavFor: '.slider-nav'
		});
		$('.slider-nav').slick({
			slidesToShow: 5,
			slidesToScroll: 1,
			asNavFor: '.slider-for',
			dots: false,
			centerMode: false,
			focusOnSelect: true,
			responsive: [
				{
					breakpoint: 1080,
					settings: {
						slidesToShow: 3,
						slidesToScroll: 3,
						infinite: true,
						dots: true
					}
				},
				{
					breakpoint: 767,
					settings: {
						slidesToShow: 2,
						slidesToScroll: 2
					}
				}
			]
		});
		$('.testimonial_slide').slick({
			slidesToShow: 1,
			slidesToScroll: 1,
			arrows: false,
			fade: true,
			asNavFor: '.dot_slides'
		});
		$('.dot_slides').slick({
			slidesToShow: 5,
			slidesToScroll: 1,
			asNavFor: '.testimonial_slide',
			dots: false,
			centerMode: false,
			focusOnSelect: true
		});
	</script>
@parent
@endsection