html {
  position: relative;
  height: 100%;
  min-width: 840px;
}

/* BODY */

body {
  height: 100%;
  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
  /*margin-bottom: 75px; /* Margin bottom by footer height */
  background-color: white;
  background-image: url("../img/bg/background.png");
}

/* HEADER */

header {
  display: block;
  background-color: dodgerblue;
  color: white;
}

/* FOOTER */

footer {
  display: block;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px;
  /* Set the fixed height of the footer here */
  line-height: 60px;
  /* Vertically center the text there */
  background-color: dodgerblue;
}

.footer-text {
  color: white;
}

.center {
  margin: auto;
}

.puppy {
    display: none;
    width: 75px;
    height: 75px;
    background-image: url("../img/sprite/puppy.png");
    position: fixed;
}

.kitty {
    display: none;
    width: 75px;
    height: 75px;
    background-image: url("../img/sprite/kitty.png");
    position: fixed;
}

#game {
    display: none;
    height: calc(100% - 227px);
}

.board {
    height: 60%;
    width: 85%;
    margin: auto;
    display: block;
}

.spacer {
    height: 100%;
    display: block;
}

#name {
    display: block;
    padding: 50px;
    background-color: dodgerblue;
    color: white;
}

.name-input {
    width: 40%;
    min-width: 250px;
    margin: auto;
}

#level-stats {
    display: none;
    padding: 50px;
    background-color: dodgerblue;
    color: white;
}

#victory {
    display: none;
    padding: 50px;
    background-color: dodgerblue;
    color: white;
}