@extends('frontend/layouts/Pagelayout')
{{-- Page content --}}
@section('content')
<!-- ******************************** Banner Part ******************************** -->
<section class="banner-part">
  <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> 
    <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
      <li data-target="#carousel-example-generic" data-slide-to="1"></li>
      <li data-target="#carousel-example-generic" data-slide-to="2"></li>
    </ol>
    
    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
      <div class="item active"> <img src="{{Config::get('app.base_path').'/frontend/img/banner/slider1.png'}}" alt="" class="img-responsive">
        <div class="carousel-caption">
          <div class="container">
            <h2 data-animation="animated slideInLeft"><span>Striving to Excellence</span></h2>
            <h3 data-animation="animated lightSpeedIn"><span>in Service we Provide</span></h3>
            <p data-animation="animated fadeIn">This text is for sample purposes only, it will<br>
              be replaced with the actual text later. This <br>
              text is for sample purposes only.<br>
            </p>
          </div>
        </div>
      </div>
      <div class="item"> <img src="{{Config::get('app.base_path').'/frontend/img/banner/slider2.png'}}" alt="" class="img-responsive">
        <div class="carousel-caption">
          <div class="container">
            <h2 data-animation="animated slideInLeft"><span>Striving to Excellence</span></h2>
            <h3 data-animation="animated lightSpeedIn"><span>in Service we Provide</span></h3>
            <p data-animation="animated fadeIn">This text is for sample purposes only, it will<br>
              be replaced with the actual text later. This <br>
              text is for sample purposes only.<br>
            </p>
          </div>
        </div>
      </div>
      <div class="item"> <img src="{{Config::get('app.base_path').'/frontend/img/banner/slider1.png'}}" alt="" class="img-responsive">
        <div class="carousel-caption">
          <h2 data-animation="animated slideInLeft"><span>Striving to Excellence</span></h2>
          <h3 data-animation="animated lightSpeedIn"><span>in Service we Provide</span></h3>
          <p data-animation="animated fadeIn">This text is for sample purposes only, it will<br>
            be replaced with the actual text later. This <br>
            text is for sample purposes only.<br>
          </p>
        </div>
      </div>
    </div>
  </div>
  </div>
</section>
<!-- ******************************** Banner End ******************************** --> 
<!-- Welcome Start Here -->
<div class="welcome-area">
  <div class="container">
    <div class="row">
      <div>
        <h5>Welcome</h5>
        <p><strong>ABBA Construction, Inc.,</strong> a small business headquartered in Jacksonville, FL, began operations in 1985. <br class="hidden-xs">
          Today, the company is uniquely qualified to design, plan, schedule and complete multi-discipline / <br class="hidden-xs">
          multi-task general construction and management activities.</p>
        <a href="#" class="readmore">Read More</a> </div>
    </div>
  </div>
</div>
<div class="brdr-line text-center"><img src="{{Config::get('app.base_path').'/frontend/img/brdr-line.png'}}" class="img-responsive img-auto" alt=""></div>
<!-- Welcome End Here --> 

<!-- Whatdo Start Here -->
<div class="whatdo-area">
  <div class="container">
    <div class="row">
      <h2>What we do</h2>
      <div class="col-md-3 col-sm-6">
        <div id="effect-1" class="effects clearfix">
          <div class="img">
            <div class="img-cap"> <img src="{{Config::get('app.base_path').'/frontend/img/img2.png'}}" class="img-responsive"> <span> New Construction </span> </div>
            <div class="overlay">
              <h3> New Construction</h3>
              <p>This is for sample purposes only, it will be replaced with the actual text later. This text is for sample purposes only, it will be replaced with the actual text later. This is a dummy text.</p>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-3 col-sm-6">
        <div id="effect-1" class="effects clearfix">
          <div class="img">
            <div class="img-cap"> <img src="{{Config::get('app.base_path').'/frontend/img/img4.png'}}" class="img-responsive"> <span> Underground Utilities </span> </div>
            <div class="overlay">
              <h3>Underground Utilities</h3>
              <p>This is for sample purposes only, it will be replaced with the actual text later. This text is for sample purposes only, it will be replaced with the actual text later. This is a dummy text.</p>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-3 col-sm-6">
        <div id="effect-1" class="effects clearfix">
          <div class="img">
            <div class="img-cap"> <img src="{{Config::get('app.base_path').'/frontend/img/img3.png'}}" class="img-responsive"> <span> Roofing</span> </div>
            <div class="overlay">
              <h3>Roofing</h3>
              <p>This is for sample purposes only, it will be replaced with the actual text later. This text is for sample purposes only, it will be replaced with the actual text later. This is a dummy text.</p>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-3 col-sm-6">
        <div id="effect-1" class="effects clearfix">
          <div class="img">
            <div class="img-cap"> <img src="{{Config::get('app.base_path').'/frontend/img/img4.png'}}" class="img-responsive"><span> Inspection & Testing </span> </div>
            <div class="overlay">
              <h3>Inspection & Testing</h3>
              <p>This is for sample purposes only, it will be replaced with the actual text later. This text is for sample purposes only, it will be replaced with the actual text later. This is a dummy text.</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- Whatdo End Here --> 

<!-- Whatdiff Start Here -->
<div class="whatdiff-area">
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h2>What makes us different</h2>
        <center>
          <!--<img src="{{Config::get('app.base_path').'/frontend/img/video.png'}}" class="img-responsive videoimg" />-->
			<video controls class="video">
			<source src="{{Config::get('app.base_path').'/movie.mp4'}}" type="video/mp4">
			Your browser does not support the video tag.
			</video>
          <p>This text is for sample purposes only, it will be replaced with the actual text later. This text is for<br class="hidden-xs">
            sample purposes only, it will be replaced with the actual text later. This text is for sample <br class="hidden-xs">
            purposes only, it will be replaced with the actual text later. This is a dummy text.</p>
        </center>
        <div class="logo-area hidden-xs">
          <div class="slider1">
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider1.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider2.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider3.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider4.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider5.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider6.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider7.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider8.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider9.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider10.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider11.png'}}" class="mrglftimg"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider12.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider13.png'}}" class="mrgtopimg"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider14.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider15.png'}}"></div>
          </div>
        </div>
        <div class="logo-area visible-xs">
          <div class="slider2">
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider1.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider2.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider3.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider4.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider5.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider6.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider7.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider8.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider9.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider10.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider11.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider12.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider13.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider14.png'}}"></div>
            <div class="slide"><img src="{{Config::get('app.base_path').'/frontend/img/logo-img/slider15.png'}}"></div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Whatdiff End Here --> 
<!-- Start Reset Password Modal--> 
<div class="modal fade modal-login" tabindex="-1" role="dialog" id="resetpasswordModal" aria-labelledby="resetpasswordModal">
  <div class="modal-dialog">
    <div class="modal-content" id="reset-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><img  src="{{Config::get('app.base_path').'/frontend/img/grey-close.png'}}"></span></button>
        <h4 class="modal-title"><i class="login login-login-lock"></i>Reset Password</h4>
      </div>
      <div class="modal-body login-modal">
	 <form method="post" id="vendor-reset-form">
	 <input type="hidden"  id="token" name="token" class="form-control"  value="{{$token}}">
          <p id="resetpass-msg" style="display:none;"></p>
          <!--<div class="form-group">
          <label for="email">Email address</label>
            <div class="input-group">
              <div class="input-group-addon"><i class="login login-login-msg"></i></div>
              <input type="email" class="form-control" placeholder="Email address or username" id="email" name="email">
            </div>
          </div>-->
          <div class="form-group">
          <label for="pass">New Password</label>
            <div class="input-group">
              <div class="input-group-addon pwd"><i class="login login-login-pass"></i></div>
              <input type="password" class="form-control" placeholder="********" id="password" name="password">
            </div>
          </div>
		  <div class="form-group">
          <label for="pass">Confirm Password</label>
            <div class="input-group">
              <div class="input-group-addon pwd"><i class="login login-login-pass"></i></div>
              <input type="password" class="form-control" placeholder="********" id="password_confirmation" name="password_confirmation">
            </div>
          </div>
          <div class="form-group">
            <div class="col-sm-8">
              <button type="submit" class="btn btn-login" id="reset-btn"><img src="{{Config::get('app.base_path').'/frontend/img/login-regi.png'}}" data-pin-nopin="true">&ensp;Submit</button>
            </div>
          </div>
          <i class="clearfix"></i>
     </form>
     </div>
      <div class="modal-footer text-center">
      </div>
    </div>
	<!--End of Login Content-->
	
    <!-- /.modal-content --> 
  </div>
  <!-- /.modal-dialog --> 
</div>
<!--End Reset Password Modal-->
<!-- Whatdiff End Here --> 
@endsection
@section('javascript')
 
<script>
    $(document).ready(function(){
	$("#resetpasswordModal").modal('show');
		var validator2=$("#vendor-reset-form").validate({
			highlight: function(element, errorClass, validClass) {
				$(element).parent().parent().addClass('has-error');
			},

			 unhighlight: function( element, errorClass, validClass ) {
				$(element).parent().parent().removeClass('has-error');
			},
			onfocusout: false,
	        onkeyup: false,
		    onclick: false,
		    onblur : false,
			ignore: [],
			rules:{
		    	"email":{required:true,email:true},
				"password":{required:true,minlength:6},
				"password_confirmation":{required:true,minlength:6,equalTo:$("#password")},
			},
			messages:{
			},
			errorPlacement: function(error, element) {
			},
			submitHandler:function(form){
				$(":submit").attr("disabled", "disabled");
			      form.submit();
			}
			
			
			
		});
	//$('.video').click(function(){this.paused?this.play():this.pause();});
        if (Modernizr.touch) {
            // show the close overlay button
            $(".close-overlay").removeClass("hidden");
            // handle the adding of hover class when clicked
            $(".img").click(function(e){
                if (!$(this).hasClass("hover")) {
                    $(this).addClass("hover");
                }
            });
            // handle the closing of the overlay
            $(".close-overlay").click(function(e){
                e.preventDefault();
                e.stopPropagation();
                if ($(this).closest(".img").hasClass("hover")) {
                    $(this).closest(".img").removeClass("hover");
                }
            });
        } else {
            // handle the mouseenter functionality
            $(".img").mouseenter(function(){
                $(this).addClass("hover");
            })
            // handle the mouseleave functionality
            .mouseleave(function(){
                $(this).removeClass("hover");
            });
        }
    });
	

	
</script>
<script type="text/javascript">
$('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) {
    // Avoid following the href location when clicking
    event.preventDefault(); 
    // Avoid having the menu to close when clicking
    event.stopPropagation(); 
    // If a menu is already open we close it
    //$('ul.dropdown-menu [data-toggle=dropdown]').parent().removeClass('open');
    // opening the one you clicked on
    $(this).parent().addClass('open');

    var menu = $(this).parent().find("ul");
    var menupos = menu.offset();
  
    if ((menupos.left + menu.width()) + 30 > $(window).width()) {
        var newpos = - menu.width();      
    } else {
        var newpos = $(this).parent().width();
    }
    menu.css({ left:newpos });

});

</script>
@endsection