<link href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.10/semantic.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="contact-background-image">
<div class="ui container margin-top-30">
<form class="ui form pad-top-30 pad-bottom-30">
<h3 class="huge header inverted">Contact Us</h3>
<div class="two fields">
<div class="field">
<label>First Name</label>
<input type="text" name="first-name" placeholder="First Name">
</div>
<div class="field">
<label>Last Name</label>
<input type="text" name="last-name" placeholder="Last Name">
</div>
</div>
<div class="field">
<label>Leave your message here:</label>
<textarea></textarea>
</div>
<div class="field">
<label>Message Type:</label>
<div class="ui selection dropdown">
<input type="hidden" name="message-type">
<i class="dropdown icon"></i>
<div class="default text">Message Type</div>
<div class="menu">
<div class="item" data-value="1">Complaint</div>
<div class="item" data-value="0">Query</div>
</div>
</div>
</div>
<div class="field">
<label>Email</label>