/* stylesheet */
*{
  margin:0;
  padding:0;
  box-sizing: border-box;
}
h1 {
  font-family: jost;
  font-size: 1.17rem;
}
h2 {
  margin-top: 2rem;
  font-family: jost;
  font-size:1.25rem;
  font-weight: 600;
}
h3 {
  margin-top: 2rem;
  font-family: jost;
  line-height:1.5rem;
  font-size:1rem;
}
.legend * {
  font-family: jost;
  font-size:1rem;
}
.legend {
  font-family: jost;
  margin-bottom: 1rem;
}

#content{
  padding: 1rem;
}

p {
  font-family: jost;
  max-width: 40rem;
}
.place_histo .bar:hover,
.character_histo .bar:hover {
  background-color:bisque;
  cursor: help;
}
.bar * {
  line-height:1rem;
  font-size:1rem;
  font-family:"IBMPlexMono";
  margin-top: -2px;
  padding: 2px;
}

a.bar {
  /*display: block !important;*/
}

.place_names {
  text-overflow: ellipsis;
  overflow-x: hidden;
  overflow-wrap: break-word;
  white-space: nowrap;
  height: 20px;
  padding-left:8px;
  padding-right:8px;
}

section {
  vertical-align: top;
  display: inline-block;
  margin-right: 1rem;
  margin-bottom: 1rem;
}
a + p, div + p{
  margin-top: 1rem;
}

.place_histo {
  display: inline-block;
  margin-right: 1rem;
}

a:not(h1 a):not(a.bar) {
  font-family: jost;
  display: block;
  text-decoration: none;
}
a:not(h1 a):not(a.bar):before {
  content:'— '
}

header {
  position: sticky;
  top: 0px;
  z-index: 2;
  padding: .5rem 1rem .5rem 1rem;
  background-color: white;
  display: flex;
}

header a {
  color: inherit;
  text-decoration: none !important;
}

header h1, header h2 {
  font-size: 1.17rem;
  margin-top: 0;
  font-weight: 400;
}

header h2 {
  margin-left: 0.6rem;
}