<div class="position-relative">
<div class="pt-2 page-title bg-overlay"
     style="background-image: url('../../../images/bg-title-3.jpg');background-size: cover;background-position: center">
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb text-light mb-0 p-0">
                <li class="breadcrumb-item"><a href="#">Home</a></li>
                <li class="breadcrumb-item active" aria-current="page">Agents</li>
            </ol>

        </nav>
        <h1 class="fs-32 mb-0 text-white font-weight-500 text-center pt-10 pb-9 lh-17 mxw-478">Meet The Agents
            Transforming Real Estate </h1>
    </div>
</div>
<div class="bg-secondary">
    <div class="container">
        <div class="py-2">
            <form class="d-none d-md-flex row no-gutters px-n1 flex-wrap align-items-end">
                <div class="form-group py-1 col-md-2 px-1 mb-0">
                    <label for="language03" class="sr-only">Language</label>
                    <select class="form-control selectpicker" name="language"
                            id="language03" title="Language" data-style="bg-white btn-lg rounded-lg">
                        <option>English</option>
                        <option>France</option>
                    </select>
                </div>
                <div class="form-group py-1 col-md-2 px-1 mb-0">
                    <label for="company2" class="sr-only">Company</label>
                    <select class="form-control selectpicker" name="company"
                            id="company2" title="Company" data-style="bg-white btn-lg rounded-lg">
                        <option>Google</option>
                        <option>Facebook</option>
                        <option>Apple</option>
                    </select>
                </div>
                <div class="form-group py-1 col-md-2 px-1 mb-0">
                    <label for="region02" class="sr-only">Region</label>
                    <select class="form-control selectpicker" name="region"
                            id="region02" title="Region" data-style="bg-white btn-lg rounded-lg">
                        <option>Austin</option>
                        <option>Boston</option>
                        <option>Chicago</option>
                        <option>Denver</option>
                        <option>Los Angeles</option>
                        <option>New York</option>
                        <option>San Francisco</option>
                    </select>
                </div>

                <div class="form-group py-1 col-md-4 px-1 mb-0">
                    <label for="search02" class="sr-only">Search</label>
                    <div class="input-group input-group-lg">
                        <div class="input-group-prepend mr-n1">
                    <span class="fs-18 input-group-text bg-white border-0"><i
                            class="fal fa-search"></i></span>
                        </div>
                        <input type="text" id="search02"
                               class="form-control border-0 bg-white shadow-none"
                               placeholder="Search by agent’s name…" name="search">

                    </div>
                </div>
                <div class="col-md-2 py-1 px-1">
                    <button type="submit" class="btn btn-primary btn-lg btn-block">
                        Search
                    </button>
                </div>
            </form>
            <form class="d-block d-md-none">
                <div class="d-flex align-items-center">
                    <a class="text-white hover-primary d-inline-block fs-24 lh-1 mr-5" data-toggle="collapse"
                       href="#collapseMobileSearch-02"
                       role="button" aria-expanded="false">
                        <i class="fal fa-cog"></i>
                    </a>
                    <div class="form-group mb-0 w-100">
                        <label for="search04" class="sr-only">Search</label>
                        <div class="input-group input-group-lg">
                            <input type="text" id="search04"
                                   class="form-control border-0 bg-white shadow-none"
                                   placeholder="Search by agent’s name…" name="search">
                            <div class="input-group-append ml-n1">
                    <span class="fs-18 input-group-text bg-white border-0"><i
                            class="fal fa-search"></i></span>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="collapse" id="collapseMobileSearch-02">
                    <div class="card card-body border-0 pr-0 pl-8 bg-transparent">
                        <div class="form-group">
                            <label for="language04" class="sr-only">Language</label>
                            <select class="form-control selectpicker" name="language"
                                    id="language04" title="Language" data-style="bg-white btn-lg rounded-lg">
                                <option>English</option>
                                <option>France</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="company03" class="sr-only">Company</label>
                            <select class="form-control selectpicker" name="company"
                                    id="company03" title="Company" data-style="bg-white btn-lg rounded-lg">
                                <option>Google</option>
                                <option>Facebook</option>
                                <option>Apple</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="region04" class="sr-only">Region</label>
                            <select class="form-control selectpicker" name="region"
                                    id="region04" title="Region" data-style="bg-white btn-lg rounded-lg">
                                <option>Austin</option>
                                <option>Boston</option>
                                <option>Chicago</option>
                                <option>Denver</option>
                                <option>Los Angeles</option>
                                <option>New York</option>
                                <option>San Francisco</option>
                            </select>
                        </div>
                        <button type="submit" class="btn btn-primary btn-lg btn-block">
                            Search
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</div>