@charset "utf-8";
/* CSS Document */
body {
  background-size: cover;
  background-image: url("../images/books-bkg.jpg");
  background-position: top center;
  padding-top: 50px;
}
h3 {
  color: rgba(204, 0, 0, 1);
  font-weight: 300;
}
h6 {
  font-size: .6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
}
p.hi-lo-border {
  font-family: 'Merriweather', serif;
  font-style: italic;
  color: rgba(204, 0, 0, 1);
  border-top: .5px solid rgba(0, 0, 0, .2);
  border-bottom: .5px solid rgba(0, 0, 0, .2);
  padding-top: .5rem;
  padding-bottom: .5rem;
  background-image: linear-gradient(to right, transparent, white, transparent);
}
main section > div {
  background-color: rgba(248, 248, 248, 1);
}
@media (max-width: 767.98px) {
  main section > div {
    border-top: 1px solid rgba(33, 37, 41, .175);
    border-bottom: 1px solid rgba(33, 37, 41, .175);
  }
}
@media (min-width: 768px) {
  main section > div {
    border-radius: .375rem;
    border: 1px solid rgba(33, 37, 41, .175);
  }
}
div.audio {
  border-top: 2px dotted rgba(204, 0, 0, 1);
  border-bottom: 2px dotted rgba(204, 0, 0, 1);
  background-image: linear-gradient(to right, transparent, rgba(228, 228, 228, 1), transparent);
}
div.ratio {
  max-width: 450px !important;
}
p.rule {
  background-image: url("../images/gray-1px.png");
  background-position: center;
  background-repeat: repeat-x;
}
.bkg {
  background-color: rgba(248, 248, 248, 1);
  color: rgba(204, 0, 0, 1);
}
/* Headline book title  -----------*/
main header h6 {
  color: white;
}
@media (max-width: 767.98px) {
  main header h6 {
    background-color: rgba(204, 0, 0, 1);
  }
}
@media (min-width: 768px) {
  main header h6 {
    background-color: rgba(35, 24, 16, .5);
  }
}
@media (max-width: 767.98px) {
  main header {
    background-color: rgba(35, 24, 16, .5);
  }
  main header h1 {
    color: white;
    border-bottom: none;
  }
}
@media (min-width: 768px) {
  main header h1 {
    margin: 0;
    color: rgba(204, 0, 0, 1);
    border-bottom: 1px dotted red;
  }
  main header h5 {
    font-family: 'Merriweather', serif;
  }
}
/* First column -------------------*/
.media .card {
  width: 206px;
  min-width: 206px;
}
.media .card-title {
  font-family: 'Merriweather', serif;
  font-size: .9375rem;
  line-height: 1.33;
  color: #666;
  color: black;
  margin-top: .15rem;
}
.media .card-footer {
  font-size: .65rem;
  color: #666;
}
@media (max-width: 767.98px) {
  .availability {
    width: 156px;
  }
  .availability p {
    color: black;
  }
}
@media (min-width: 768px) {
  .availability {
    width: 168px;
    background-color: rgba(35, 24, 16, .5);
    border: 1px solid rgba(33, 37, 41, .175);
    border-radius: .375rem;
  }
  .availability p {
    color: white;
  }
}
.availability p {
  font-size: .75rem;
}
.availability p a {
  color: white;
}
.availability p a:hover {
  color: yellow;
}
.availability .houses {
  margin-top: .7rem;
}
/* Synopsis & Author's Take --------*/
article a, article a:visited {
  font-weight: 700;
  color: rgba(204, 0, 0, 1);
  text-decoration: none;
}
article a:hover {
  color: rgba(0, 0, 0, 1);
  background-color: rgba(204, 0, 0, .175);
}
article h6 {
  color: rgba(204, 0, 0, 1);
}
/* Reviews ---------*/
aside {
  width: 160px;
  min-width: 160px;
}
aside p {
  font-family: 'Merriweather', serif;
  font-weight: 300;
  font-size: 12px;
  color: rgba(226, 224, 209, 1);
  margin-bottom: 0;
  padding: 10px 10px 7.5px 10px;
  border-top: 2px solid rgba(0, 0, 0, 1);
}
aside p strong {
  font-weight: 700;
}
aside h5, aside p {
  background-color: rgba(35, 24, 16, .7);
}
aside h5 {
  color: white;
  font-size: 10px;
  line-height: 1.42857143;
  margin: 0px 0px 0px 0px;
  padding: 0 10px 10px 10px;
  border-bottom: 5px solid rgba(0, 0, 0, 1);
}
aside h5 strong {
  font-size: 14px;
  font-weight: 700;
}
/* General stuff ------------------*/
@media (min-width: 1200px) {
  main {
    max-width: 1360px !important;
  }
  main.wide {
    max-width: 1560px !important;
  }
  article {
    width: 50%;
  }
}