/* style-faithful.css */
body {
  margin: 0;
  background: #efefef;
  color: #1f2937;
  font-family: Arial, Helvetica, sans-serif;
}
.hero-banner{
  background-image:url("images/cover.jpg");
  background-size:cover;
  background-position:center top;
  height:100vh;
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
  color:white;
  text-align:center;
  padding-bottom:6rem;
}
.hero-banner::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,.1));
}
.hero-banner h1,.hero-banner p{position:relative; z-index:1;}
.page {
  max-width: 900px;
  margin: 2rem auto;
  background: white;
  min-height: 100vh;
  padding: 2rem 3rem 5rem;
}
.heading-rule{
  border:none; border-top:2px solid #d58f79;
  width: 60%;
  margin:0 0 .5rem;
}
.sidebar-box{
  background:#dff4fb;
  border:1px solid #a5c9d3;
  width:220px;
  padding:.6rem;
  font-size:.85rem;
}
.narrator-tag{
  display:inline-block;
  background:#e9ddbb;
  border:1px solid #c6b182;
  border-radius:4px;
  padding:.3rem .8rem;
}
footer{
  text-align:center;
  padding:2rem;
}