body {
  background: black;
  color: gray;
  margin: 0;
  padding: 0;
}
#pageFrame {
  margin: 0 32px;
  text-align: center;
}

.links {
  padding-bottom: 20px;
  font-size: 24px;
}
.links > a,
.links > span {
  color: grey;
  padding: 20px;
}
.links > a:hover {
  color: white;
}

#nav-primary {
  position: fixed;
  left: 0;
  top: 0;
  background: black;
  height: 100%;
  text-align: center;
}
#nav-secondary {
  position: fixed;
  right: 0;
  top: 0;
  background: black;
  height: 100%;
  text-align: center;
}
.navflex {
  display: flex;
  justify-content: space-evenly;
  flex-direction: column;
  height: 100%;
}

nav > a,
nav > a:visited {
  font-size: 1.25rem;
  color: grey;
  text-decoration: none;
  display: block;
}
nav > a:hover {
  color: white;
}

#nav-primary a {
  padding: 0 0 0 10px;
}
#nav-secondary a {
  padding: 0 10px 0 0;
}

#letterRows {
  display: inline-block;
}

.rowFrame {
  display: flex;
  flex-wrap: nowrap;
  align-items: end;
  border-top: 1px solid #333;
  padding: 10px 2px;
  min-height: 60px;
}
.title {
  text-transform: uppercase;
  font-size: 72px;
  font-weight: bold;
  min-width: 75px;
  text-align: center;
}
.graph {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  align-self: flex-end;
}
.barColumn {
  min-width: 29px;
  margin: 0 3px;
  text-align: center;
}
.bar {
  background: repeating-linear-gradient(
    360deg,
    #aab2f7,
    #aab2f7 10px,
    #8d94ce 10px,
    #8d94ce 20px
  );
}
.label {
  margin-top: 4px;
  text-transform: uppercase;
  font-size: 25px;
}
.label-bigram {
  margin-top: 4px;
  text-transform: uppercase;
  font-size: 16px;
  max-width: 29px;
}
