details.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Details</title>
<link rel="stylesheet" type="text/css" href="http://dnnsoftware.com/Portals/_default/default.css">

<link rel="stylesheet" type="text/css" href="innojobboard.css">
<link rel="stylesheet" type="text/css" href="innojobboard-theme.css">
<link rel="stylesheet" type="text/css" href="innojobboard-application.css">
</head>

<body>
<div class="container">
  <div class="row">
    <div class="col-sm-12">
      <p><small><a href="listing.html">&lsaquo; View all job postings</a></small></p>
      <h1>Licensed Practical Nurse
        <button class="btn btn-info">&#9998; Edit</button>
        <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#myModal">&times; Delete</button>
      </h1>
      <h5 class="text-uppercase">Posted Sep 18, 2015</h5>
    </div>
  </div>
  <div class="row">
    <div class="col-sm-7 inno-jb-detail-main">
      <div class="job-summary">
        <p class="lead">Promotes health and healing by functioning as a member of the care team to provide optimum care for convalescent, acutely/chronically ill, home care and long-term care clients/patients/residents.</p>
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
        <ul>
          <li>Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</li>
          <li>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.</li>
          <li>Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.</li>
          <li>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</li>
        </ul>
      </div>
      <div class="inno-careers-experience">
        <h4>Experience:</h4>
        <p>Previous: No previous experience.</p>
      </div>
      <div class="inno-careers-qualifications">
        <h4>Qualifications:</h4>
        <p>Required Qualifications<br />
          Practical Nursing Diploma<br />
        </p>
      </div>
    </div>
    <div class="col-sm-4 col-sm-offset-1 inno-jb-detail-sidebar">
      <div class="job-details panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Job Details</h3>
        </div>
        <div class="panel-body">
          <fieldset>
            <div class="fieldset-row">
              <label>Job Type:</label>
              <span>Permanent Full Time</span> </div>
            <div class="fieldset-row">
              <label>Posting ID:</label>
              <span>GO-00253411</span> </div>
            <div class="fieldset-row">
              <label>Closing Date:</label>
              <span>Sep 21, 2015</span> </div>
            <div class="fieldset-row">
              <label>Location:</label>
              <span>Prince Albert</span> </div>
            <div class="fieldset-row">
              <label>Compensation:</label>
              <span>$36,000/year</span> </div>
            <div class="fieldset-row">
              <label>Benefits:</label>
              <span>Dental, Vision</span> </div>
          </fieldset>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="container">
  <div class="row">
    <div class="col-sm-12">
      <div class="job-application-form">
        <div class="row">
          <div class="col-sm-12 text-center">
            <h3>Apply For This Job</h3>
          </div>
        </div>
        <div class="row">
          <div class="form">
            <div class="row">
              <div class="form-group col-sm-3">
                <label for="exampleInputEmail1">Your name</label>
                <input type="text" class="form-control" id="exampleInputName1" placeholder="First and Last">
              </div>
              <div class="form-group col-sm-3">
                <label for="exampleInputEmail1">Email address</label>
                <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
              </div>
              <div class="form-group col-sm-4">
                <label for="exampleInputFile">Upload your Resume</label>
                <div class="input-group"> <span class="input-group-btn"> <span class="btn btn-info btn-file"> Browse&hellip;
                  <input type="file" multiple>
                  </span> </span>
                  <input type="text" class="form-control" readonly>
                </div>
              </div>
              <div class="form-group col-sm-2 text-right">
                <label for="submitapplication" class="invisible">Send button</label>
                <button class="btn btn-primary btn-block" id="submitapplication">Submit Application</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Are you sure that you want to delete this job posting?</h4>
      </div>
      <div class="modal-body">You can always <a href="#go-to-edit">change the status</a> of the posting instead.</div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default btn-link" data-dismiss="modal">Nevermind, I'll keep it.</button>
        <button type="button" class="btn btn-danger">I'm sure - delete it!</button>
      </div>
    </div>
  </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script src="js/modal.js"></script> 
<script src="js/innojobboard.js"></script>
</body>
</html>