index.html

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Hangman Stars</title>

		<link rel="stylesheet" type="text/css" href="./assets/css/reset.css">
		<link rel="stylesheet" type="text/css" href="./assets/css/style.css">
	</head>
	<body>
		<div class="main-container">
			<div class="img-logo">
				<img  src="assets/images/hangman.png"  >
			</div>
			<div class="game-container">
					<img id="img-stars" >
				<div class="main-content" >
					<div id="instruction">
						<pre><p> <span class="animation"> ___                                       _                _              _               _   </span> </p></pre>
						<pre><p> <span class="animation">| _ \ _ _  ___  ___ ___  __ _  _ _  _  _  | |__ ___  _  _  | |_  ___   ___| |_  __ _  _ _ | |_ </span> </p></pre>
						<pre><p> <span class="animation">|  _/| '_|/ -_)(_-<(_-< / _` || ' \| || | | / // -_)| || | |  _|/ _ \ (_-<|  _|/ _` || '_||  _|</span> </p></pre>
						<pre><p> <span class="animation">|_|  |_|  \___|/__//__/ \__,_||_||_|\_, | |_\_\\___| \_, |  \__|\___/ /__/ \__|\__,_||_|   \__|</span> </p></pre>
						<pre><p> <span class="animation">                                    |__/             |__/                                      </span> </p></pre>
					</div>

					<div id=alerts>
						<pre><p> <span class="show-alert"></span> </p></pre>
						<pre><p> <span class="show-alert"></span> </p></pre>
						<pre><p> <span class="show-alert"></span> </p></pre>
						<pre><p> <span class="show-alert"></span> </p></pre>
						<pre><p> <span class="show-alert"></span> </p></pre>
					</div>

					<div id="game-div" class="panel">
						<div id="word-display">
							<p id="display-letters"></p>
						</div>
						<br><br>
						<div id="general-display">
							<h3>Your Guesses</h3>
							<hr><br><br>
							<pre><p>  <span class="guessed-letters" id="guessed-letters">                                  </span> </p></pre>
							<h3>Your stats</h3>
							<hr>
							<pre><p> Incorrect Letters: <span id="errors"></span></p></pre>
							<pre><p>  Wins: <span id="win-count"></span> </p></pre>
							<pre><p> Losses: <span id="loss-count"></span></p></pre>


						</div>
					</div>
				</div>
			</div>

	    </div>

		<script type="text/javascript" src="./assets/javascript/game.js"></script>
	</body>
</html>