html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  font: 18px Helvetica;
}

#fullDiv {
  position: absolute;
  margin: 10px;
  padding: 10px;
  left: 0;
  top: 30px;
  bottom: 0;
  right: 0;
  overflow: hidden; 
}

ul {
  margin: 0;
  padding: 0;
}

li {
  float: left;
  display: block;
  width: 14.2857%;
  text-align: center;
  list-style-type: none;
}

li:nth-child(n+1):nth-child(-n+7) {
  font-weight: 900;
  color: #e67e22;/*orange */
}

li:nth-child(n+39), li:nth-child(n+8):nth-child(-n+16) {
  font-weight: 900;
  color: rgba(0,0,0,.3); /*black*/
}

li:hover:nth-child(n+8):nth-child(-n+38), li:nth-child(17){
  border-radius: 5px;
  background-color: #1abc9c; /*greenish*/
  background-color: #000;
  color: #ecf0f1; /*gray*/
}