@extends('layouts.site_layout')

@section('content')

<section class="container-fluid p-0" id="topBanners" style="position:relative;">
</section>
<!-- <section class="career-bg py-5">
    <div class="container mt-lg-5 mb-lg-5 mt-0 mb-0">
        <div class="breadcrumbs">
            <span>
                <a href="#" class="fs-24 text-decoration-none text-white opacity-5">Home <span class="px-lg-4 px-0">></span> </a>
                <a href="#" class="fs-24 text-decoration-none text-white opacity-5">Contact <span class="px-lg-4 px-0">></span> </a>
                <a href="#" class="fs-24 text-decoration-none text-white">Careers</a>
            </span>
        </div>
        <h1 class="fs-42 my-4 text-white">Careers</h1>
    </div>
</section> -->
<section>
    <div class="container">
        <div class="card search-openings border-0 br-22 shadow">
            <div class="card-body py-4 px-5 d-lg-flex d-md-flex d-block">
                <form action="#" class="w-100 me-2 mb-lg-0 mb-md-0 mb-3">
                    <div class="input-group filters search-input">
                        <input type="search" class="form-control search_inp" placeholder="Search openings">
                        <!-- <span class="input-group-text bg-transparent pointer" id="filter">
                                <i class="fa fa-search text-maroon fs-12"></i>
                            </span> -->
                    </div>
                </form>
                <select class="form-select w-100 me-2 mb-lg-0 mb-md-0 mb-3" aria-label="Default select example">
                    <option selected>All departments</option>
                    <option value="1">One</option>
                    <option value="2">Two</option>
                    <option value="3">Three</option>
                </select>
                <button class="btn bg-orange w-100 text-white">Search</button>
            </div>
        </div>
        <h2 class="fs-24 text-center mt-3 mb-5">3 openings across all departments</h2>
        <div class="overflow-auto">
            <table class="table table-borderless text-nowrap department-openings table-striped">
                <thead>
                    <tr class="fs-20">
                        <th scope="col" class="px-4">Role</th>
                        <th scope="col">Location</th>
                        <th scope="col">Department</th>
                        <th scope="col"></th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td scope="row" class="fs-20 px-4">Chief operating Officer (CEO)</td>
                        <td class="fs-20">Bangalore, India</td>
                        <td class="fs-20">Management</td>
                        <td class="fs-16 align-middle px-4 text-end"><a href="#" class="text-orange text-decoration-none">Learn More and Apply ></a></td>
                    </tr>
                    <tr>
                        <td scope="row" class="fs-20 px-4">Chief operating Officer (CEO)</td>
                        <td class="fs-20">Bangalore, India</td>
                        <td class="fs-20">Management</td>
                        <td class="fs-16 align-middle px-4 text-end"><a href="#" class="text-orange text-decoration-none">Learn More and Apply ></a></td>
                    </tr>
                    <tr>
                        <td scope="row" class="fs-20 px-4">Chief operating Officer (CEO)</td>
                        <td class="fs-20">Bangalore, India</td>
                        <td class="fs-20">Management</td>
                        <td class="fs-16 align-middle px-4 text-end"><a href="#" class="text-orange text-decoration-none">Learn More and Apply ></a></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</section>
<section class="py-5 my-lg-5 my-0">
    <div class="container join-iesa-bg text-center py-lg-5 py-md-0 py-5">
        <h2 class="fs-40 fw-500 text-white mb-5 mt-lg-5 mt-md-0 mt-5 pt-lg-0 pt-5">Join the Vibrant IESA Community</h2>
        <div class="pb-lg-0 pb-5 mb-lg-5 mb-md-0 mb-5">
            <a href="{{url('become-a-member')}}" class="btn bg-white btn-padding">Register Now</a>
        </div>
    </div>
</section>

@endsection