<html>
<head><link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
<link rel="stylesheet" href="index.css">
</head>
<body>
<h1>Christmas Dinner Picker</h1>
<p class="result" id="result">Your ideal Christmas dinner is <span id="food">...</span></p>
<form>
<label for="name">How many guests are coming?</label>
<input id="num-input" type="number" id="guests" name="guests" min="0" max="12">
<div class="veggie">
<input type="checkbox" id="vegetarian-input" name="vegetarian" checked>
<label for="name">Vegetarian?</label>
</div>
<button id="btn" type="button">Calculate</button>
</form>
<script src="index.pack.js"></script>
</body>
</html>