@extends('layouts.app')
@section('title') {{'Home'}} @endsection



@section('content')

<main id="mainWrap" class="homeSection">
<div class="infoLinkWorap">
<button class="infoLink" href="#" onclick="show('infoPopup')"><img src="{{asset('img/info-Button.png')}}" class="img-flud" alt=""></button>
</div>
<div class="infoPopup" id="infoPopup">
    <div class="infoPopupHed"> <button class="closeLink" href="#" onclick="hide('infoPopup')"><img src="{{asset('img/closeButton.png')}}" class="img-flud" alt=""></button> </div>
  <a href="https://www.clksupplies.com/pages/how-to-use-idenikey" class="btn btn-primary">How To Use</a> 
</div>
<!--  -->

<script>
    $ = function(id) {
  return document.getElementById(id);
}

var show = function(id) {
	$(id).style.display ='block';
}
var hide = function(id) {
	$(id).style.display ='none';
}
    </script>


    <div class="mainWrapIntro">
        <a href="{{ env('APP_URL')}}" class="logoBrind"><img src="{{asset('img/idenikeyLogo.png')}}" class="img-flud" alt=""></a>
        <div class="takePicturehome">
        <img src="img/deni-Intro-Animation.gif" class="img-flud" alt="">
</div>
        <div class="findkeyBtn"> <a href="{{route('frontKey')}}" class="btn-lg btn-primary">FIND A KEY</a></div>


    </div>
    <div class="patentPendingText">Patent Pending</div>
</main>


@endsection