.parent {
  display: inline-flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  margin: 1rem;
}

.parent > a {
  margin: 0 !important;
  border-bottom: 1px #F7F7F7 solid;
}

/* Disable box-shadow on link-hover for drop-down parents */
.parent > a:hover {
  text-shadow: none;
}

.parent:hover {
  cursor: default;
}

.parent:hover .content {
  display: block;
}

.content {
  display: none;
  position: absolute;
  padding: 110px 0 0 0;
  margin: 0;
}

.child {
  display: block;
}

.child > a {
  text-align: center;
}

.opaque {
  background-color: rgb(117,129,143);
}

.parent {
  display: inline-flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  margin: 1rem;
}

.parent > a {
  margin: 0 !important;
  border-bottom: 1px #F7F7F7 solid;
}

/* Disable box-shadow on link-hover for drop-down parents */
.parent > a:hover {
  text-shadow: none;
}

.parent:hover {
  cursor: default;
}

.parent:hover .content {
  display: block;
}

.content {
  display: none;
  position: absolute;
  padding: 110px 0 0 0;
  margin: 0;
}

.child {
  display: block;
}

.child > a {
  text-align: center;
}

/* TODO: Make sure that navDropdown looks good on pages with smaller height headers (like /about) */

@media screen and (max-width: 1000px) and (min-width: 780px) {
  .content {
    padding: 85px 0 0 0;
  }
}

@media screen and (max-width: 779px) {
  .parent {
    display: none;
  }

  .content {
    position: relative;
  }
}

Remove opaque and add TODO
Remove opaque and add TODO
