header {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  background-size: auto;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
  /*padding-top: 20px;*/
  padding-bottom: 20px;
}

header .header-content .header-content-inner a:hover,
a:focus {
    color: #1081f1;
    background-color: white;
}

#logo {
  max-width: 100%;
  max-height: 100%;
}

#navbar {
  margin: auto;
  text-align: center;
  display: grid;
  font-size: 20px;
}

.navbutton {
  background: #1081f1;
  padding: 15px;
  color: white;
  text-decoration: none;
}

#home {
  grid-column: 1;
  grid-row: 1;
}

#asgn {
  grid-column: 2;
  grid-row: 1;
}

#staff {
  grid-column: 3;
  grid-row: 1;
}

#software {
  grid-column: 4;
  grid-row: 1;
}

#notes {
  grid-column: 5;
  grid-row: 1;
}

#policies {
  grid-column: 6;
  grid-row: 1;
}

#labs {
  grid-column: 7;
  grid-row: 1;
}

#piazza {
  grid-column: 8;
  grid-row: 1;
}

@media (max-width: 950px) {
  #navbar {
    font-size: 18px;
    margin: auto;
  }

  .navbutton {
    padding: 7px;
    height: 42px;
    line-height: 42px;
  }

  #home {
    grid-row: 1;
    grid-column: 1;
  }

  #asgn {
    grid-row: 1;
    grid-column: 2;
  }

  #staff {
    grid-row: 1;
    grid-column: 3;
  }

  #software {
    grid-row: 1;
    grid-column: 4;
  }

  #notes {
    grid-row: 2;
    grid-column: 1;
  }

  #policies {
    grid-row: 2;
    grid-column: 2;
  }

  #labs {
    grid-row: 2;
    grid-column: 3;
  }

  #piazza {
    grid-row: 2;
    grid-column: 4;
  }

}
