@extends('home-layout.master')
@section('content')
<div class="Main" style="min-height: 100vh; position: relative;">


  <div class="container-fluid  p-1 p-sm-1">
    <div class="background">




      <div class="container">
        <div class="row pt-3">

          <div class="col-md-12 d-flex justify-content-center justify-content-sm-start">


            <h2> <span class="heading"> New Facilities Here </span></h2>


          </div>



          <div class="col-md-12">

            <div class="row d-flex pt-5 justify-content-center" style="padding-bottom: 50px;">
              <div class="col-md-6 d-flex flex-column justify-content-center align-items-center">
                <h1 style="color: white; text-align: center;" class="pb-3">Welcome to iFlexApps</h1>
                <h3 style="color: white; text-align: center;">Helpful products for everyone.</h3>

               <a class="Main3 CustomButton1 btn-animated mt-5" href="/login">Join Now</a>

              </div>
            </div>

          </div>
        </div>
      </div>


    </div>


    <div class="container pt-5 pb-5">
      <div class="row">
        <div class="col-md-12 d-flex justify-content-center">


          <ul class="nav nav-pills mb-3 w-100  myul" id="pills-tab" role="tablist">
            <li class="nav-item" role="presentation">
              <button class="nav-link tabbtn active" id="pills-home-tab" data-bs-toggle="pill"
                data-bs-target="#pills-home" type="button" role="tab" aria-controls="pills-home"
                aria-selected="true">For Everyone</button>
            </li>
            <li class="nav-item" role="presentation">
              <button class="nav-link tabbtn" id="pills-profile-tab" data-bs-toggle="pill"
                data-bs-target="#pills-profile" type="button" role="tab" aria-controls="pills-profile"
                aria-selected="false">For Business</button>
            </li>
            <li class="nav-item" role="presentation">
              <button class="nav-link tabbtn" id="pills-contact-tab" data-bs-toggle="pill"
                data-bs-target="#pills-contact" type="button" role="tab" aria-controls="pills-contact"
                aria-selected="false">For Developers</button>
            </li>
          </ul>

        </div>









        <div class="col-md-12">

          <div class="tab-content" id="pills-tabContent">


            <div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">


              <div class="row pt-4">
                <div class="col-md-4 cardBackground p-3">


                  <h2 class="text-center white">For Everyone</h2>

                  <div class="p-3 d-flex flex-column align-items-center">

                    <span class="cardHeading white">Individual Plans</span>
                    <span class="linkSpan"><a href="https://www.iflexmoney.com/">iFlex Transfer Money</a></span>
                    <span class="linkSpan"><a href="http://iflexcargo.com/">iFlexCargo Services </a></span>
                    <span class="linkSpan"><a href="https://topup.iflexapps.com/">iFlex Easy Topups</a></span>
                    <span class="linkSpan"><a href="https://www.iflexafrica.com/">iFlexAfrica</a></span>

                    <button class="learnMore" id="everyone">More Apps</button>
                    <span class="linkSpan1 mt-3"><a href="#">Compare Individual Plans </a> &nbsp;<i
                        class="fa fa-chevron-right" aria-hidden="true"></i> </span>

                  </div>


                </div>
                <div class="col-md-8 grey p-3">


                  <div class="table-responsive">


                    <table class="table  table-info text-center" id="myTable">

                      <tbody>
                        <tr>
                          <td><a href="https://www.iflexmoney.com/"><button class="tblButton">iFlexMoney</button></a>
                          </td>
                          <td><a href="https://topup.iflexapps.com/"><button class="tblButton">iFlexTopup</button></a>
                          </td>
                          <td><a href="https://stream.iflextec.com/"><button class="tblButton">iFlexStream</button></a>
                          </td>

                        </tr>


                        <tr>
                          <td><a href="#"><button class="tblButton">iFlexCash</button></a></td>
                          <td><a href="#"> <button class="tblButton">iFlexViva</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexPharma</button></a></td>

                        </tr>

                        <tr>
                          <td><a href="#"><button class="tblButton"> iFlexBusiness</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexAcademy</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexShop</button></a></td>

                        </tr>


                        <tr>
                          <td><a href="#"><button class="tblButton">iFlexRide</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexAfrica</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexDelivery</button></a></td>

                        </tr>



                        <tr>
                          <td><a href="http://iflexcargo.com/"><button class="tblButton">iFlexCargo</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexBooking</button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexCapital</button></a></td>


                        </tr>



                        <tr>
                          <td><a href="#"><button class="tblButton">iFlexServices</button></a></td>


                        </tr>


                      </tbody>
                    </table>

                  </div>

                </div>
              </div>

            </div>




            <div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">




              <div class="row pt-4">

                <div class="col-md-8   grey p-3">
                  <div class="table-responsive">


                    <table class="table  table-info text-center" id="myTable">

                      <tbody>
                        <tr>
                          <td><a href="#"><button class="tblButton">Shipping Services</button></a> </td>
                          <td><a href="#"><button class="tblButton">Sell Bus Ticket</button></a></td>
                          <td><a href="#"><button class="tblButton">Sell Insurance </button></a></td>

                        </tr>


                        <tr>
                          <td><a href="#"><button class="tblButton">Sell Flight Ticket</button></a></td>
                          <td><a href="#"> <button class="tblButton">Sell Hardware</button></a></td>
                          <td><a href="#"><button class="tblButton">Become an Agent </button></a></td>

                        </tr>
                        <tr>
                          <td><a href="#"><button class="tblButton">Sell Train Ticket</button></a></td>
                          <td><a href="#"><button class="tblButton">Sell Services</button></a></td>
                          <td><a href="#"><button class="tblButton">Become a Driver </button></a></td>

                        </tr>

                        <tr>
                          <td><a href="#"><button class="tblButton">Become a Merchant </button></a></td>
                          <td><a href="#"><button class="tblButton">Payment Services</button></a></td>
                          <td><a href="#"><button class="tblButton">Billing Services</button></a></td>

                        </tr>

                      </tbody>
                    </table>

                  </div>

                </div>


                <div class="col-md-4 cardBackground cardBackground1 p-3">


                  <h2 class="text-center white">For Business</h2>

                  <div class="p-3 d-flex flex-column align-items-center">

                    <span class="cardHeading">Business Plans</span>
                    <span class="linkSpan"><a href="#">iFlex Shipping Services</a></span>
                    <span class="linkSpan"><a href="#">Become a Merchant </a></span>
                    <span class="linkSpan"><a href="">Become an Agent </a></span>
                    <span class="linkSpan"><a href="">Become a Driver </a></span>

                    <button class="learnMore" id="business">More Apps</button>

                    <span class="linkSpan1 mt-3"><a href="#">Compare Business Plans </a> &nbsp;<i
                        class="fa fa-chevron-right" aria-hidden="true"></i> </span>

                  </div>


                </div>
              </div>

            </div>



            <div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">




              <div class="row pt-4">
                <div class="col-md-4 cardBackground cardBackground2 p-3">


                  <h2 class="text-center white">For Developrs</h2>

                  <div class="p-3 d-flex flex-column align-items-center">

                    <span class="cardHeading">Developers Plans</span>
                    <span class="linkSpan"><a href="#">iFlexDelivery API</a></span>
                    <span class="linkSpan"><a href="#">iFlexMoney API</a></span>
                    <span class="linkSpan"><a href="#">iFlexCargo API</a></span>

                    <span class="linkSpan"><a href="#">iFlexCash API</a></span>

                    <button class="learnMore" id="developers">More Apps</button>

                    <span class="linkSpan1 mt-3"><a href="#">Compare Developers Plans </a> &nbsp;<i
                        class="fa fa-chevron-right" aria-hidden="true"></i> </span>

                  </div>


                </div>
                <div class="col-md-8 grey p-3">

                  <div class="table-responsive">


                    <table class="table table-info text-center" id="myTable">

                      <tbody>
                        <tr>
                          <td><a href="#"><button class="tblButton">iFlexMoney API</button></a> </td>
                          <td><a href="#"><button class="tblButton">iFlexCargo API</button></a></td>

                        </tr>

                        <tr>
                          <td><a href="#"><button class="tblButton">iFlexCash API </button></a></td>
                          <td><a href="#"><button class="tblButton">iFlexDelivery API </button></a></td>
                        </tr>

                      </tbody>
                    </table>

                  </div>
                </div>
              </div>




            </div>

          </div>

        </div>
      </div>
    </div>






  </div>




</div>




@endsection