@extends('layouts.auth')

@section('title')
Halaman Awal - Aplikasi AFRIKOT
@endsection


<style>
       
       img {
         width: auto;
         height: 50%;
         position: absolute;
         bottom: 0;
         left: 0;
         
         margin: auto;
         
       }

       @media only screen and (max-width: 600px) {
        img {
          width: auto;
         height: 40%;
         position: absolute;
         bottom: 0;
         left: 0;
         
         margin: auto;
  }
}

@media only screen and (min-device-width : 600px) and (max-width: 992px) {
  /* For tablet: */
  img {
         width: auto;
         height: 60%;
         position: absolute;
         bottom: 0;
         left:0;        
         
         margin: auto;
         
       }

}
       </style>


@section('main-content')
<div class="container pb-4">
<div class="row">
  <div class="col-md-12">
  <h1 class="h5 mt-3  text-gray-100 font-weight-bold"><span id="blink"><i class="fa fa-circle text-success"></i></span>   AFRIKOT APP</h1>
</div>
</div>
</div>

<div class="container-fluid bg-info">

    <!-- Outer Row -->
    
          <div class="row">
          <div class="col-md-8 offset-md-2">
          <div class="card  mt-3 mb-3 bg-transparent shadow">
                <div class="card-body" style="padding-bottom:0px !important">
              <div class="align-items-center justify-content-between text-center">
            <h1 class="h5 mb-0 text-gray-100">SELAMAT DATANG DI APLIKASI </h1>
            <p><h1 class="display-4 mb-0  text-gray-100 font-weight-bold">AFRIKOT</h1></p>
            <p><h1 class="h6 text-gray-100 font-weight-bold">ANALISIS FAKTOR RESIKO  IBU  REKOMENDASI  TERPADU</h1></p>
          </div>
          <div class="align-items-center justify-content-between text-right">
          <small class=" text-gray-200"><em>&copy; Milkhatun - Zulmah A - Triwahyuni - Alfi Ari FR</em></small>
          </div>
</div>
</div>
</div>
</div>



</div>
<div class="container-fluid align-items-center">
          <!-- Content Row -->
          <div class="row mt-2">

          <div class="col-md-8 offset-md-2 text-right">
            <a href="{{ route('preApps') }}" style="text-decoration:none">
              <div class="bg-transparent h-100">
                
                  <div class="row">
                    <div class="col md-6">
                      	<div class="display-4 font-weight-bold" ><span class="badge badge-pill badge-danger">Next <i class="fa fa-arrow-circle-right"></i></span>
                    </div>                  	
                    	
                    </div>                                    
                  </div>
                
             
               
            </div></a>
            </div>
          
  
          <!-- File 
          @guest
            <div class="col-md-8 offset-md-2 text-right">
            <a href="{{ url('auth/google') }}" style="text-decoration:none">
              <div class="bg-transparent h-100">
                
                  <div class="row">
                    <div class="col md-6">
                      	<div class="mb-2 display-4 font-weight-bold" ><span class="badge badge-pill badge-warning" id="blink">Go .. <i class="fa fa-arrow-circle-right"></i></span>
                    </div>                  	
                    	
                    </div>                                    
                  </div>
                
             
               
            </div></a>
            </div>

            @else

            <div class="col-md-8 offset-md-2 text-right">
            <a href="{{ url('home') }}" style="text-decoration:none">
              <div class="bg-transparent h-100">
                
                  <div class="row">
                    <div class="col md-6">
                      	<div class="mb-2 display-4 font-weight-bold" ><span class="badge badge-pill badge-info" id="blink">Go .. <i class="fa fa-arrow-circle-right"></i></span>
                    </div>                  	
                    	
                    </div>                                    
                  </div>
                
             
               
            </div></a>
            </div>

            @endguest-->

</div>
</div>
<img src="{{ asset('img/risal.png') }}" alt="description of myimage">

          
  <style>
        #blink {
            transition: 0.5s;
        }
    </style>

<script type="text/javascript">
        var blink = document.getElementById('blink');
        setInterval(function() {
            blink.style.opacity = (blink.style.opacity == 0 ? 1 : 0);
        }, 1000);
    </script>
@endsection