body {
    font-family: Verdana, sans-serif;
    color: #fff0ef;
    text-align: left;
    background-color: #550007;
    background-image: url("/images/vines.png");
    margin: 0;
}
p {
  font-family: Verdana, sans-serif;
  color: #fff0ef;
  line-height:1.5em;
}
h1 {
    margin: auto;
    color: #c0353c;
    text-align: left;
    font-family: "PT Serif", serif;
    font-size: 2.5rem;
    font-weight: 700;
    line-height:1em;
    text-shadow: 1px 2px 8px #350307;
}
h2 {
    color: #c0353c;
    font-family: "PT Serif", serif;
    text-align: left;
}
h3 {
    margin: auto;
    color: #fff0ef;
    font-size: 1.5rem;
    font-weight: 200;
    font-family: "Cinzel", "Times New Roman", serif;

}
h4,h6 {
    font-family: "PT Serif", serif;
    color: #fff0ef;
}
h5 {
    font-family: "Cinzel", "Times New Roman", serif;
    color: #fff0ef;
}
a {
  color: #c0353c;
}
a:visited {
  color: #e99296;
  text-decoration: none;
}
ul li a:visited {
    color: #c0353c;
}
ul li a:hover {
  color: #fff0ef;
}
a:hover {
  color: #fff0ef;
}
a:active {
  color: #fff0ef;
}
button {
    padding: 10px 16px;
    color: #fff0ef;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 4px 2px;
    cursor: pointer;
}
#btn1:hover, #btn2:hover, #btn1:active, #btn2:active {
    border: 2px solid #410105;
    background-color: #c0353c;
}
#btn3:hover, #btn3:active {
    box-shadow: 2px 2px 2px 2px rgba(100, 94, 94, 0.2), 0 6px 20px 0 rgba(100, 94, 94, 0.19);
}
#btn1 {
    border: 2px solid #1f0d0b;
    border-radius: 15px;
    color: #fff0ef;
    font-family: "PT Serif";
    background-color: #320a0a;
    font-size: 1.5rem;
}
#btn2 {
    border: 2px solid #1f0d0b;
    border-radius: 15px;
    font-family: "PT Serif";
    background-color: #320a0a;
    font-size: 1.25rem;
}
#btn3 {
    margin-top: 2em;
    border: none;
    padding: 2px 8px;
    background-color: darkred;
    font-family: "Cinzel";
    font-size: 1rem;
    
}
#btn4 {
    margin: 0;
    border: 1px solid black;
    border-radius: 5px;
    padding: 2px 8px;
    background-color: #550007;
    font-family: "Cinzel";
    font-size: 1rem;
}
#btn4:hover, #btn4:active {
    border: 1px solid white;
}
.header {
  overflow: hidden;
  padding: 20px 10px;
}
.logo-smol {
    display: none;
}
.logo-large {
    display: inline-block;
}
.sidebutton {
  width: calc(90% - 32px);
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid black;
  border-top: none;
  }
ul li {
  float: left;
  border-right: 1px solid #000000;
  padding: 5px 10px;
  background-color: #550007;
}
ul li:last-child {
  border-right: none;
}
li a, .dropbtn {
  display: inline-block;
  text-decoration: none;
  color: #c0353c;
  text-align: center;
  padding: 0;
}
li a:hover, .dropdown:hover .dropbtn {
    background-color:inherit;
}
#active {
    color: white;
    background-color: #320a0a;
}
li .dropdown {
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: inherit;
    color: #c0353c;
    box-shadow: 2px 2px 5px 0 #000000;
    z-index: 1;
}
.dropdown-content a {
    color: #c0353c;
    padding: 10px;
    text-decoration: none;
    display: block;
    text-align: left;
}
.dropdown-content a:hover {
    background-color: #1f0d0b;
    color: #fff0ef;
}
.dropdown:hover .dropdown-content{
    display: block;
}
.welcome-container {
  margin: 0;
  padding: 0;
  background-color: #1f0d0b;
  background-image: url("/images/darkvines.png");
}
#welcome-gradient {
    padding: 0;
    height: 175px;
    background-image: linear-gradient(to right, rgba(12,5,4,1) 5%, rgba(12,5,4,0) 75%, rgba(12,5,4,1));
       border-bottom: 1px solid #000000;
}
.welcome {
   float: left;
   padding: 15px;
   background: transparent;
   width: 50%;
}
.right {
   text-align: right;
}
.book {
   float: left;
   display: flex;
   margin: auto;
   padding: 15;
   background: transparent;
   width: 15%;
   justify-content: center;
   align-items: center;
   height: inherit;
   text-align: center;
   overflow: visible;
}
#book-smol {
    display: inherit;
}
.book-container {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 15px 15px 0 15px;
    overflow: hidden;
}
.book-container div {
    padding: 0 5%;
}
.book-container img {
    padding: 0 0 5px 0;
}
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.all-quarters {
  display: inline-block;
  width: 100%;
}
.four-quarters {
    background-color: rgba(85,0,7,0.75);
    display: block;
    float: left;
    width:calc(100% - 61px);
    padding: 10px 30px;
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px;
}
#socials {
    background-color: rgba(50,10,10,0.5);  
}
.three-quarters {
    background-color: rgba(85,0,7,0.75);
    display: block;
    float: left;
    width:calc(75% - 61px);
    padding: 10px 30px;
}
.one-quarter {
  display: block;
  float: left;
  width:calc(25% - 41px);
  padding: 20px 20px;
}
.blog-post {
    border: 1px solid black;
    background-color: rgba(85,0,7,0.9);
    box-shadow: 0 4px 8px 0 rgba(30, 0, 2, 0.5), 0 6px 20px 0 rgba(30, 0, 2, 0.49);
    display: block;
    float: left;
    width:calc(70% - 81px);
    padding: 10px 30px;
    margin: 10px;
}
#blog-exclusive {
    border: 1px solid #7d4f08;
}
.blog-side {
    background-color: rgba(85,0,7,0.4);
    display: block;
    float: right;
    width:calc(25% - 41px);
    padding: 20px 20px;
}
#blog-smol {
    height: 175;
}
.one-quarter-footer {
  display: block;
  float: left;
  width:calc(25% - 41px);
  padding: 20px 20px;
}
.bluesky {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: 0 0;
}
.bluesky:hover {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: -50px 0;
}
.bookbub {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: 0 -50px;
}
.bookbub:hover {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: -50px -50px;
}
.youtube {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: 0 -100px;
}
.youtube:hover {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: -50px -100px;
}
.goodreads {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: 0 -150px;
}
.goodreads:hover {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: -50px -150px;
}
.instagram {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: 0 -200px;
}
.instagram:hover {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: -50px -200px;
}
.pinterest {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: 0 -250px;
}
.pinterest:hover {
  margin: 0;
  padding: 0px;
  width: 50px;
  height: 50px;
  display: inline-block;
  background-image: url("/images/sprites.png");
  background-position: -50px -250px;
}
footer {
    color: #fff0ef;
    background-color: #1f0d0b;
    text-align: left;
    font-size: 0.75rem;
    font-family: "Cinzel", "Times New Roman", serif;
    padding: 8px;
    border-top: 1px solid #000000;
}