<!-- professional education -->
<section id="sect-professional-education" class="border p-3 <?php echo (!empty($default)&& $default=='open')?'':'d-none'; ?>">
	<div class="row title-row" data-toggle="collapse" href="#collapseProfessionalEducation" role="button" aria-expanded="false">
		<div class="col">
			<h3 id="sect-professional-education-header">Professional Education</h3>
		</div>
	</div>
	<div id="collapseProfessionalEducation">
			<div class="row">
				<div class="col">
					<label><b>Level</b></label>
					<input type="text"class="form-control" name="professional_education_type" id="professional_education_type" value='0' hidden>
					<input type="text"class="form-control" name="professional_education_level" id="professional_education_level" value="Professional" readonly>
				</div>
			</div>

			<div class="row">
				<div class="col">
					<label><b>Name of Professional Association</b></label>
					<input type="text"class="form-control" name="professional_education_associate_name" id="professional_education_associate_name" autocomplete="off">
				</div>
			</div>

			<div class="row">
				<div class="col">
					<label><b>Name of Course Study</b></label>
					<input type="text"class="form-control" name="professional_education_program" id="professional_education_program" autocomplete="off">
				</div>
			</div>

			<div class="row">
				<div class="col-12 col-lg-6">
					<label><b>Date Graduated</b></label>
					<input type="text"class="form-control datepicker" name="professional_education_date_finish" id="professional_education_date_finish" autocomplete="off">
				</div>

				<div class="col-12 col-lg-6">
					<label><b>Final Result</b></label>
					<input type="text"class="form-control" name="professional_education_result" id="professional_education_result" autocomplete="off">
				</div>
			</div>

			<div class="row">
				<div class="col-12">
					<label><b>Attachment</b></label>
					<input type="file" class="form-control" name="professional_education_attachment">
				</div>
			</div>

			<div class="row">
				<div class="col-12 col-lg-2 ml-auto mt-3 mb-3">
					<button type="button" class="btn btn-primary btn-block" onclick="addProfessionalEducation()" data-trigger="hover" data-tooltip="tooltip" title="" data-original-title="Add professional education"><i class="fas fa-plus"></i></button>
				</div>
			</div>

			<div class="row">
				<div class="col-12">
					<div class="table-responsive">
						<table class="table table-bordered" id="tbl-professionalEducation">
							<thead>
								<tr>
									<th>Detail</th>
									<th>Action</th>
								</tr>
							</thead>
							<tbody>
							</tbody>
						</table>
					</div>
				</div>
			</div>
	</div>
</section>
<!-- professional educations -->