<!DOCTYPE html>
<html="en">
<head>
<meta charset="UTF-8">
<title>Accordion Assignment 4</title>
<!--Link external CSS file -->
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<!--Add container to accordion's code, wrap the code -->
<div class="semester-container">
<!--Semester 1 panel -->
<button class="semester">
Semester 1
</button>
<!--End semester 1 panel -->
<!--Courses hidden panel -->
<div class="courses">
<!--Create an order list of courses -->
<ol>
<li>Typography 1</li>
<li>Design 1</li>
<li>Digital Technology 1</li>
<li>Motion Design 1</li>
<li>Creative Thinking</li>
<li>Web Technology 1</li>
<li>College Reading and Writing Skills</li>
</ol>
</div>
<!--End courses hidden panel -->
<!--Semester 2 panel -->
<button class="semester">
Semester 2
</button>
<!--End semester 2 panel -->
<!--Courses hidden panel -->
<div class="courses">
<!--Create an order list of courses -->
<ol>
<li>Design 2</li>
<li>Digital Technology 2</li>
<li>An Intro to Arts and Sciences (HESL)</li>
<li>Video Production 1</li>
<li>Creative Coding</li>
<li>Web Technology 2</li>
<li>Workplace Writing Skills: ESOL </li>
</ol>
</div>
<!--End courses hidden panel -->
<!--Semester 3 panel -->
<button class="semester">
Semester 3
</button>
<!--End Semester 3 panel -->
<!--Courses hidden panel -->
<div class="courses">
<!--Create an order list of courses -->
<ol>
<li>Emerging Design Trends</li>
<li>Intro to Data Technologies</li>
<li>Web Technology 3</li>
<li>Web Programming 1</li>
<li>Experience Design 1</li>
<li>Philosophy of Love and Sex (GNED)</li>
</ol>
</div>
<!--End courses hidden panel -->
<!--Semester 4 panel -->
<button class="semester">
Semester 4
</button>
<!--End Semester 4 panel -->
<!--Courses hidden panel -->
<div class="courses">
<!--Create an order list of courses -->
<div>
<ol>
<li>Emerging Tech Design and Development </li>
<li>Native Mobile OS Design and Development</li>
<li>Web Programming 2</li>
<li>Experience Design 2</li>
<li>Understanding Movies</li>
</ol>
</div>
</div>
<!--End courses hidden panel -->
<!--Semester 5 panel -->
<button class="semester">
Semester 5
</button>
<!--End Semester 5 panel -->
<!--Courses hidden panel -->
<div class="courses">
<!--Create an order list of courses -->
<ol>
<li>Emerging Tech Design and Development 2</li>
<li>Native Mobile OS Design and Development 2</li>
<li>Progressive Programming Techniques</li>
<li>Content Management Systems</li>
<li>Business of Interactive Media</li>
</ol>
</div>
<!--End courses hidden panel -->
<!--Semester 6 panel -->
<button class="semester">
Semester 6
</button>
<!--End Semester 6 panel -->
<!--Courses hidden panel -->
<div class="courses">
<!--Create an order list of courses -->
<ol>
<li>Portfolio</li>
<li>Capstone</li>
<li>Industry Project</li>
</ol>
</div>
<!--End courses hidden panel -->
</div>
<!--Link to external JavaScript file -->
<script src="scripts.js"></script>
</body>
</html>