html {
  scroll-padding-top: 163px;
  scroll-behavior: smooth;
}

body {
  font-size: 100%;
  color:#000;
  background-color:#000000 !important;
}

.bg-opacity-darker {
  background: rgba(0, 0, 0, 0.8);
}

/* Removes space between double row nav links for MEDIUM menu */
@media screen and (min-width:600px) {
  .w3-bar-medium1 {margin-bottom: 0px;padding-bottom: 0px;line-height: 1em;}
  .w3-bar-medium2 {margin-top: 0px;padding-top: 0px;line-height:1em;}
}

/* Pushes Kodi Wolf down from the top edge of nav bar */
.KW-title-cellP {
  padding: 26px 0 0 0;
}

/* Makes Kodi Wolf red, etc. */
.KW-title-red {
  font-family: "Libre Baskerville";
  color: #A40606;
  font-size: 2.1em;
  font-weight: bold;
}

/* Reduces Kodi Wolf font size for smaller screens */
@media screen and (max-width: 992px) {.KW-title-red {font-size: 1.5em;}}

/* Sets style for Lesbian Romance & Erotica subtitle in nav bar */
.erotica-title {
  font-family: "Libre Baskerville";
  color: #ffffff;
  font-size: 1em;
  font-style: italic;
  font-weight: bold;
}

/* Causes erotica subtitle to break to a new line on really small screens */
@media screen and (max-width:300px) {.smbr {display:none!important}}

.story-title-cell {
  padding: 30px 0 0 22px;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.story-title {
  font-family: "EB Garamond";
  color: #ffffff;
  font-size: 1.9em;
  letter-spacing: 1px;
  line-height: 1;
}

@media screen and (max-width: 630px) {.story-title {font-size: 1.6em;}}
@media screen and (max-width: 600px) {.story-title {font-size: 1.4em;}}

p a {
  color: #0094c9;
  font-weight: bold;
  text-decoration: none;
}

p a:hover {
  color: #44cdff;
  font-weight: bold;
  text-decoration: none;
  transition: .3s, opacity .5s, visibility .5s;
}

a.link-bottom {
  font-family: "Lucida Sans Unicode";
  color: #ffffff;
  font-size: 1em;
  font-weight: bold;
  text-decoration: none;
  line-height: 4em;
}

a:hover.link-bottom {
  color: #A40606;
  font-weight: bold;
  text-decoration: none;
  transition: .3s, opacity .5s, visibility .5s;
}

a {
  text-decoration: none
}

a:hover {
  text-decoration: none
}

.copyright {
  font-family: Arial;
  color: #ffffff;
  font-size: .9em;
}

.social {
  font-family: Arial;
  color: #ffffff;
  font-size: .9em;
  font-weight: bold;
}

p {
  font-family: Arial;
  font-size: 1.5em;
  padding: 0 0 0 0;
  margin: 0 0 1em 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "EB Garamond";
  font-variant: small-caps;
  line-height: 1;
  padding-bottom: 30px;
}

h1 {
  font-size: 4em;
}

h2 {
  font-size: 3em;
}

h3 {
  font-size: 2em;
}

h4 {
  font-size: 1.6em;
}

h5 {
  font-size: 1.3em;
}

h6 {
  font-size: 1.1em;
}

.login {
  font-weight: bold;
  transition: .3s, opacity .5s, visibility .5s;
  color:#fff!important;
}

.text-red, .w3-hover-text-red:hover, .main-button:hover {
  color: #A40606 !important;
}

.sexy_line {
  margin: 0.1em auto .5em auto;
  height: 1px;
  width: 80%;
  background: black;
  background: -webkit-gradient(linear, 0 0, 100% 0, from(black), to(black), color-stop(50%, white));
}

/* Used on story title to keep it from wrapping at full size */
.h1sm {
  font-size: 3.5em;
}

/* Used on chapter title to make it smaller */
.h1xsm {
  font-size: 2.7em;
}

/* Used on Story Membership page title to make it smaller */
.h2 {
  font-size: 3em;
}

/* Used on Free Sample title to make it smaller */
.h2sm {
  font-size: 2.5em;
}

/* Used on Chapter subtitles to make them smaller */
.h2xsm {
  font-size: 1.7em;
}

/* Used on h2 to make the font smaller */
.h4 {
  font-size: 1.6em;
  font-family: "Times New Roman";
  font-weight: bold;
}

/* Used on h4 to make the font smaller */
.h5 {
  font-size: 1.3em;
}

/* Scene breaks for each story */
.scenebreak_Assassin, .scenebreak_ABondagePrimer, .scenebreak_LightsOfLife, .scenebreak_NewGaia, .scenebreak_PrisonerOfWar, .scenebreak_TheVampireHunter {
  margin: 3em 0 3em 0;
  padding: 0;
  text-align: center;
}

.scenebreak_TheVampireHunter {
  font: bold 2em "Times New Roman", serif;
  color: #A40606;
  background-color: transparent;
}

/* Adds slow fade in transition for hover color on nav and page buttons */
.w3-button {
  transition: .3s, opacity .5s, visibility .5s;
  font-family: "Lucida Sans Unicode";
  font-size: 1.1em;
}

/* Creates main button - black bg, rounded white border, dark red text hover, slow fade in */
.main-button {
  transition: .3s, opacity .5s, visibility .5s;
  font-family: "Lucida Sans Unicode";
  font-size: 1.2em;
  border:1px solid #fff!important;
  display:inline-block;
  padding:8px 16px;
  vertical-align:middle;
  overflow:hidden;
  text-decoration:none;
  text-align:center;
  cursor:pointer;
  white-space:nowrap;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
  border-radius:4px;
  color:#fff!important;
  background-color:#000!important;
  margin:15px 0 15px 0;
}

/* Adds red hover color to sidebar close Xs and Book headers */
.hover-dark-red:hover {
  color: #A40606 !important;
  background-color: #000000 !important;
}

/* Adds dark gray background color to sidebar FREE and MEMBER headers */
.dark-gray {
  color: #ffffff !important;
  background-color: #222222 !important;
}

/* sets space around Login link */
.loginM {
  margin: 0;
  padding: 2px 5px 0px 0px;
}

.noTopM {
  margin-top: 0px;
}

.noBottomM {
  margin-bottom: 0px;
}

.noTopBottomM {
  margin-top: 0px;
  margin-bottom: 0px;
}

.bottomM16 {
  margin-bottom: 16px;
}

.bottomM30 {
  margin-bottom: 30px;
}

.bottomM32 {
  margin-bottom: 32px;
}

.bottomM48 {
  margin-bottom: 48px;
}

.leftM20 {
  margin-left: 20px;
}

.topM30 {
  margin-top: 30px;
}

.topM48 {
  margin-top: 48px;
}

/* makes quotes in the top of reviews section invisible */
.colortrans {
  color: transparent;
}

/* sets cell padding for Praise and More Praise titles */
.cellpadPraise {
  padding: 30px 0 0 16px;
}

/* sets cell padding for text of review */
.cellpadReview {
  padding: 0 0 30px 16px;
}

.noTopP {
  padding-top: 0px;
}

.noBottomP {
  padding-bottom: 0;
}

.bottomP30 {
  padding-bottom: 30px;
}

.topP10 {
  padding-top: 10px;
}

.topP30 {
  padding-top: 30px;
}

.topP48 {
  padding-top: 48px;
}

/* used on headshot cell */
.leftP60 {
  padding-left: 60px;
}

.simple_version {
  margin: .5em 1em 2em 1em;
  padding: 0 1em .5em 1em;
  border: solid 1px #ffffff;
}

ul {
  margin: 1em 4em 1em 4em;
  padding: 0;
  list-style: outside disc;
}

ol {
  margin: 1em 4em 1em 4em;
  padding: 0;
  list-style: decimal outside none;
}

ol.decimal {
  margin: 1em 4em 1em 4em;
  padding: 0;
  list-style: decimal outside none;
}

ol.loweralpha {
  margin: 1em 4em 1em 4em;
  padding: 0;
  list-style: lower-alpha outside none;
}

ol.lowerroman {
  margin: 1em 4em 1em 4em;
  padding: 0;
  list-style: lower-roman outside none;
}

li {
  margin: 0;

}

li p {
  margin: 0;
  padding: .3em .5em .3em .5em;
}

ul.no_bullet, ol.no_bullet, li.no_bullet {
  list-style: none;
}

/* sets background color to light gray to avoid CSS validation error with text color being the same as a background color */
/* used on Terms of Service and Claim Copyright Infringement */
hr {
  background-color: #eeeeee;
  margin: 30px auto 30px auto;
  width: 70%;
  height: 1px;
}

/* Sets the interior content width on info and chapter pages */
.maxwidthInfo {
  max-width: 770px;
}

/* Sets the interior content width on More Books section */
.maxwidthMoreBooks {
  max-width: 870px;
}

/* puts space between covers in More Books section */
.w3-image-padding {
  padding: 0 15px 15px 0;
}

.w3-qtr {
  width:25%;
}

.w3-hlf {
  width:50%;
}

/* removes space between lines on Stats section of index story pages */
.statsNoBottomM p {
  margin-bottom: 0;
}

/* the space between opaque boxes */
.spacer {
  height: 30px;
}

/* pushes the content down past the top nav bar */
.pushdown {
  height: 163px;
}

/* pushes the content down past the top nav bar */
.contentpushdown {
  margin-top: 163px;
  height: calc(100% - 163px);
}

/* sets the height of the top nav bar for LARGE and MEDIUM */
.LgMdtopbarH {
  height: 142px;
}

/* sets the font for chapter titles */
.fontArial {
  font-family: Arial;
}

/* used in TVH Ch 2 */
.fontCourier {
  font-family: Courier;
}

.allcaps {
  text-transform: uppercase;
}

/* for the About Me author pic and main book cover image */
@media screen and (max-width: 600px) {.mobileimage {padding-left: 0px;padding-bottom:16px;}}
@media screen and (min-width: 601px) {.mobileimage {padding-left: 50px;}}

/* for the red quotes on reviews */
@media screen and (min-width:993px) {
  .faquote {font-size:4em;line-height:1;margin-left:50px;}
  .faquoter {font-size:4em;line-height:1;margin-right:50px;}}
@media screen and (max-width:992px) and (min-width:601px) {
  .faquote {font-size:3em;line-height:1;margin-left:30px;}
  .faquoter {font-size:3em;line-height:1;margin-right:30px;}}
@media screen and (max-width:600px) {
  .faquote {font-size:2em;line-height:1;margin-left:16px;}
  .faquoter {font-size:2em;line-height:1;margin-right:16px;}}

.cellWidth3per {
  width: 3%;
}

/* Sets the width on the email modal popup */
.maxwidthEmail {
  max-width: 520px;
}

/* Makes the text in the email box gray */
input::placeholder {
  opacity: 1;
}

/* for the Email input box width */
@media screen and (max-width: 600px) {.EmailInput {width:70%;margin:30px 30px;}}
@media screen and (min-width: 601px) {.EmailInput {width:30%;margin:0 30px;}}

/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block. We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
#mc_embed_signup {
  background: #000000;
  clear: left;
  font: 14px Helvetica, Arial, sans-serif;
}

#mc_embed_signup .button {
  background-color: #333333;
  border: 1px #ffffff solid;
  height: 34px;
}

#mc_embed_signup .button:hover {
  background-color: #000000;
}
/* END Mailchimp style */

/* for the bottom nav links, above 980px, sets 3 columns */
@media screen and (min-width: 980px) {
  .bottom-links {padding-left:30px;width:33%;}
  .social-links {padding-top:17px;}
  .copyright-cell {padding-right:60px;padding-top:17px;text-align:right;}}
/* below 979px, bottom links stack */
@media screen and (max-width: 979px) {
  .bottom-links, .social-links, .copyright-cell {display:block;width:100%!important;}
  .bottom-links, .copyright-cell {text-align:center;}
  .copyright-cell {padding:20px 0;}}

/* BEGIN style for scroll to top button */
#button {
  display: inline-block;
  background-color: #000000;
  width: 30px;
  height: 30px;
  text-align: center;
  border-radius: 4px;
  position: fixed;
  bottom: 0px;
  right: 0px;
  transition: background-color .3s, opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
}

#button::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 1.2em;
  line-height: 30px;
  color: #fff;
}

#button:hover {
  cursor: pointer;
  background-color: #333333;
  text-decoration: none;
}

#button:active {
  background-color: #000000;
}

#button.show {
  opacity: 1;
  visibility: visible;
}
/* Forces button into corner at 499 and below */
@media screen and (min-width: 500px) {#button {margin: 0 5px 15px 0;}}
/* END style for scroll to top button */

/* style for writing stats table on blog posts */
table.writing_stats, table.writing_totals {
  width: 100%;
  font-size: 1.1em;
  color: #ffffff;
  margin: 1em 0 0 0;
  text-align: right;
  white-space: nowrap;
  border-collapse: collapse;
}

table.writing_totals {
  width: 50%;
  margin: 2em 0 0 0;
}

table.writing_stats th, table.writing_totals th {
  text-align: center;
}

table.writing_stats tr:nth-child(2) {
  text-align: center;
}

table.writing_stats tr td:nth-child(1), table.writing_stats tr:nth-child(2), table.writing_totals tr td:nth-child(1) {
  font-weight: bold;
}

table.writing_stats td, table.writing_totals td {
  border-right: dotted 1px #ffffff;
  border-bottom: dotted 1px #ffffff;
  padding: .25em;
}

/* sets the centered and italicized text under each image in the post */
.image_caption {
  font-style: italic;
  text-align: center;
  padding-top: 10px;
}

/* used on blog post 2010_03_13 */
.emailquote	{
  font-style: italic;
  margin: 2em 5%;
  padding: 2em 2em .5em 2em;
  border: dotted 1px #ffffff;
}

/* sets the red borders above and below the inserted poem on blog post comment 2010_03_13 */
.poem_insert	{
  display: block;
  margin: 3em auto;
  width: 50%;
  border-bottom: 1px dashed #ffffff;
}

.padding4px {
  padding: 4px;
}