h1 {
  display: block;
  text-align: center;
  margin: 0;
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: 40px;
}

h2 {
  text-align: center;
}

body {
  overflow: hidden;
}

canvas {
  background: #fff;
  display: block;
  margin: 0 auto;
  border: 1px solid black
}

.footer-links {
  width: 100%;
  display: block;
  text-align: center;
  margin: 0;
  /* padding-top: 20px; */
  padding-bottom: 20px;
  font-size: 40px;
}

#icon {
  font-size: 50px;
  color: black;
}

#audio{
  display: block;
  margin: 0 auto;
  border: 1px solid black;
  margin-top: 20px;
}

button{
  font-family: 'Raleway', sans-serif;
  font-size: 16px;
  padding: 10px;
  display: flex;
  justify-content: center;
  margin-left: 35%;
}

#button{
  margin-left: 35%;
}

#restart-button{
  margin-left: 20%;
}

#replay-button{
  margin-left: 25%;
}

button:hover {
  cursor: pointer;
}

main {
  background-image: url(http://res.cloudinary.com/dzmnmgun1/image/upload/v1523934989/Screen_Shot_2018-04-16_at_8.16.06_PM.png);
  min-height: 1000px;
  font-family: 'Raleway', sans-serif;
}

.header-nav{
  background-color: blue;
  height: 20px;
  width: 800px;
  display: block;
  text-align: center;
  color: white;
  display: block;
  margin: 0 auto;
  border: 1px solid black
}

#modal {
    position: fixed;
    font-family: 'Raleway', sans-serif;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 99999;
    height: 100%;
    width: 100%;
    /* text-align: center; */
}

#game-over-modal {
  position: fixed;
  font-family: 'Raleway', sans-serif;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 99999;
  height: 100%;
  width: 100%;
  display: none;
}

#game-won-modal{
  position: fixed;
  font-family: 'Raleway', sans-serif;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 99999;
  height: 100%;
  width: 100%;
  display: none;
}

.modal-content {
  position: absolute;
  background-color: white;
  padding: 20px;
  border: 1px solid black;
  display: block;
  float: left;
  left: 50%;
  top: 30%;
  transform: translate(-50%, -50%);
}