body {
  padding: 0;
  margin: 0;
  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}

a {
  color: #00B7FF;
}

#warning-container {

}

nav.menubar {
  display: flex;
  padding: .7em 15px;
  background-color: #707070;
  font-size: 1.5em;
}

.menubar ul {
  padding: 0;
  margin: 0;
  display: inline-block;
}

.menubar .left {
  flex: 1;
}
.menubar .right {
  flex: 0;
}

.menubar li {
  display: inline;
  list-style-type: none;
}

.menubar input {
  display: inline;
}

.menubar img {
  height: 1em;
  vertical-align: middle;
}

.page {
  margin: 0 20px;
}

.booklist.horizontal {
    display: flex;
    padding: 0 40px;
    overflow: auto;
}

.booklist li {
    list-style-type: none;
}

.booklist.horizontal li {
    margin: 0 20px;
    display: inline-block;
}

.popin-overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 100;
}

.popin-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 101;
    user-select: none;
}

.popin-container > div {
    display: inline-block;
    background: white;
    border: 1em solid rgba(0, 0, 0, 0.25);
}

.popin-dom {
    padding: 1em;
    width: 800px;
    height: 600px;
    overflow: auto;
}

.book .dl-links {
    text-align: right;
}

h7 {
    font-size: 1.25em;
    display: block;
    margin-top: 0.75em;
}

h7 img {
    height: 1.25em;
}

a.btn {
    display: inline-block;
    padding: 5px;
    margin: 0 0 0 5px;
    text-decoration: none;
    background-color: aliceblue;
    border: 1px solid #d1e2ef;
}

a.btn img {
    max-height: 1em;
    max-width: 1em;
}