{% extends "layout.html" %}

{% set title = 'Apply Now' %}

{% block content %}
<section class="help cover join sec-pad" style="background-image: url('_assets/img/join.jpg')">
    <div class="container">
        <div class="row">
            <div class="col-sm-6">
                <div class="help-content">
                    <h2 class="capitalize mbmd afa">Join our team</h2>
                    <img class="mtmd afb" src="_assets/img/palette.png" alt="">
                    <a class="btn btn-arrow mtxxlg mrmd mtxxlg capitalize afc" href="#">
                        Check out our vacancies <br>  {% include 'components/arrow-bottom.html' %}
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="news career sec-pad">
    <div class="container">
        <div class="row">
            <div class="col-sm-4">
                <div class="id_side side-career mob-off">
                    <div class="id_side_item active">
                        <a href="#">
                            <img src="_assets/img/career-icon.png" alt="">
                            <h4>Senior Interior Designer</h4>
                        </a>
                    </div>
                    <div class="id_side_item">
                        <a href="#">
                            <img src="_assets/img/career-icon-black.png" alt="">
                            <h4>
                                Senior Interior Designer
                            </h4>
                        </a>
                    </div>
                    <div class="id_side_item">
                        <a href="#">
                            <img src="_assets/img/career-icon-black.png" alt="">
                            <h4>Senior Interior Designer</h4>
                        </a>
                    </div>
                    <div class="id_side_item">
                        <a href="#">
                            <img src="_assets/img/career-icon-black.png" alt="">
                            <h4>Senior Interior Designer</h4>
                        </a>
                    </div>
                    <div class="id_side_item">
                        <a href="#">
                            <img src="_assets/img/career-icon-black.png" alt="">
                            <h4>Senior Interior Designer</h4>
                        </a>
                    </div>
                </div>
                <div class="panel panel-default mob-on">
                    <div class="panel-heading" role="tab" id="headingOne">
                        <h4 class="panel-title">
                            <a class="button collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#applicant" aria-expanded="false" aria-controls="applicant">
                                All Vacancies <span class="line2"></span>
                            </a>
                        </h4>
                    </div>
                    <div id="applicant" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                        <div class="panel-body">
                            <div class="id_side side-career">
                                <div class="id_side_item active">
                                    <a href="#">
                                        <div class="cover img_side" style="background-image: url('_assets/img/designTalks-1.jpg')"></div>
                                        <h4 class="news-title">
                                            Ihab Mokhtar speaks
                                            at the Creative Summit
                                        </h4>
                                    </a>
                                </div>
                                <div class="id_side_item">
                                    <a href="#">
                                        <div class="cover img_side" style="background-image: url('_assets/img/designTalks-1.jpg')"></div>
                                        <h4>
                                            Ihab Mokhtar speaks
                                            at the Creative Summit
                                        </h4>
                                    </a>
                                </div>
                                <div class="id_side_item">
                                    <a href="#">
                                        <div class="cover img_side" style="background-image: url('_assets/img/designTalks-1.jpg')"></div>
                                        <h4>
                                            Ihab Mokhtar speaks
                                            at the Creative Summit
                                        </h4>
                                    </a>
                                </div>
                                <div class="id_side_item">
                                    <a href="#">
                                        <div class="cover img_side" style="background-image: url('_assets/img/designTalks-1.jpg')"></div>
                                        <h4>
                                            Ihab Mokhtar speaks
                                            at the Creative Summit
                                        </h4>
                                    </a>
                                </div>
                                <div class="id_side_item">
                                    <a href="#">
                                        <div class="cover img_side" style="background-image: url('_assets/img/designTalks-1.jpg')"></div>
                                        <h4>
                                            Ihab Mokhtar speaks
                                            at the Creative Summit
                                        </h4>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-8">
                <div class="job">
                    <h3 class="no-margin mbxxlg">Senior Interior Designer</h3>
                    <div class="job_desc">
                        <p>
                            Fill the below information to submit your CV
                            <span class="mtxlg">
                                <strong>
                                    We are listening
                                </strong>
                            </span>
                        </p>
                        <form action="">
                            <div class="form-group">
                                <input type="text" name="name" placeholder="Name" required>
                            </div>
                            <div class="form-group">
                                <input type="number" min="0" onkeydown="javascript: return event.keyCode == 69 ? false : true" name="mobile" placeholder="Mobile NO." required >
                            </div>
                            <div class="form-group">
                                <input type="email" name="e-mail" placeholder="Email" required >
                            </div>

                            <div class="form-group ">
                                <div class="input-file-container">
                                    <input class="input-file" id="my-file" type="file">
                                    <label tabindex="0" for="my-file" class="input-file-trigger">Attach your CV.</label>
                                </div>
                                <p class="file-return"></p>
                            </div>
                            <div class="row">
                                <div class="col-xs-8 col-xs-offset-4 col-sm-6 col-sm-offset-6">
                                    <button type="submit" class="btn btn-arrow section-btn section-btn-left mtxxlg">
                                        Send {% include 'components/arrow-right-black.html' %}
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="help cover join apply sec-pad" style="background-image: url('_assets/img/career-cover.jpg')">
    <div class="container">
        <div class="row">
            <div class="col-sm-6">
                <div class="help-content">
                    <h2 class="capitalize mbmd afa">The value of human-centric design has
                        increased exponentially in recent years</h2>
                    <a class="btn btn-arrow mtxxlg mrmd mtxxlg capitalize afb" href="#">
                        Check out Our<br>
                        latest projects<br> {% include 'components/arrow-bottom.html' %}
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock content %}