<!-- Add course button -->
        <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#add-course-modal">
            Add new course
        </button>

        <!-- Add course modal -->
        <div class="modal fade" id="add-course-modal" 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">Add Course</h4>
                    </div>
                    <div class="modal-body">
                        <form>
                            <!--
                            "_id": "",
                            "bison_code": "L.ACT.20181",
                            "course_name": "Orientation on Study & Profession",
                            "type": "exam",
                            "study_points": 3,
                            "study_workload_hours": 84,
                            "study_contact_hours": 34,
                            "language": "English"
                            -->

                            <div class="form-group">
                                <label for="course-name" class="control-label">Course Name:</label>
                                <input type="text" class="form-control" id="course-name">
                            </div>
                            <div class="form-group">
                                <label for="bison-code" class="control-label">Bison Code:</label>
                                <input type="text" class="form-control" id="bison-code">
                            </div>
                            <!-- Don't know all the options yet -->
                            <div>
                                <label for="course-type">Course Type:</label>
                                <select class="form-control" id="course-type">
                                    <option disabled selected>Select a type:</option>
                                    <option>Exam</option>
                                    <option>Project</option>
                                    <option>Exam & Project</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label for="workload-hours" class="control-label">Workload Hours:</label>
                                <input type="number" min="1" class="form-control" id="workload-hours">
                            </div>
                            <div class="form-group">
                                <label for="contact-hours" class="control-label">Contact Hours:</label>
                                <input type="number" min="1" class="form-control" id="contact-hours">
                            </div>
                            <div class="form-group">
                                <label for="course-language">Course Language:</label>
                                <select class="form-control" id="course-language">
                                    <option disabled selected>Select a language:</option>
                                    <option>Dutch</option>
                                    <option>English</option>
                                    <option>German</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label for="study-points" class="control-label">Study Points (e.c.):</label>
                                <input type="number" min="1" class="form-control" id="study-points">
                            </div>
                            <!-- Placeholder text box, don't know what way it should be done yet -->
                            <div class="form-group">
                                <label for="learning-objectives" class="control-label">Learning Objectives:</label>
                                <input type="text" class="form-control" id="learning-objectives">
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox"> <B>Electional</B>
                                </label>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <button type="button" class="btn btn-success" id="add-course-confirm">Confirm</button>
                    </div>
                </div>
            </div>
        </div>