.stat-block {
    text-align: left;
    font-size: .78125rem;
    line-height: 1.2rem;
    display: inline-block;
    vertical-align: top;
    width: 25rem;
    color: var(--stat-null);
    background-size: cover;
    background-position: center;
    background-color: var(--stat-bg);
    background-image: url('../dndimages/statblockparch.jpg');
    background-blend-mode: luminosity;
    padding: .625rem .625rem 1.25rem;
    box-sizing: border-box;
    font-family: 'Noto Sans', 'Myriad Pro', Calibri, Helvetica, Arial, sans-serif;
}

.enctr-block {
    text-align: left;
    font-size: .78125rem;
    line-height: 1.2rem;
    display: inline-block;
    vertical-align: top;
    width: 31.25rem;
    background-color: var(--stat-bg);
    color: var(--stat-null);
    background-size: cover;
    background-position: center;
    background-image: url('../dndimages/statblockparch.jpg');
    background-blend-mode: luminosity;
    padding: .625rem .625rem 1.25rem;
    box-sizing: border-box;
    font-family: 'Noto Sans', 'Myriad Pro', Calibri, Helvetica, Arial, sans-serif;
}

.stat-block.wide {
    width: 50rem;
}

.enctr-block.wide {
    width: 50rem;
}

.enctr-block .section-right {
  display: none;
}

.encblock-list ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  color: var(--stat-main);
}

.encblock-list h3 {
  display: inline;
  margin: 0;
  color: var(--stat-acc);
  font-size: .875rem;
  line-height: 1.2rem;
  font-weight: bold;
  text-decoration: underline;
}

.stat-block.wide .section-left,
.stat-block.wide .section-right {
    display: inline-block;
    vertical-align: top;
    width: 48%;
    text-align: left;
}

.stat-block.wide .section-left {
    margin-right: 1.5%;
}

.stat-block.wide .section-right {
    margin-left: 1.5%;
}

.enctr-block.wide .section-left {
    display: inline-block;
    vertical-align: top;
    width: 60%;
    text-align: left;
}

.enctr-block.wide .section-right {
    display: inline-block;
    vertical-align: top;
    width: 37%;
    text-align: left;
}

.enctr-block.wide .section-left {
    margin-right: .5%;
}

.enctr-block.wide .section-right {
    margin-left: .5%;
}

.orange-border {
    display: block;
    background-color: var(--stat-bord);
    background-image: url('../dndimages/statblockbar.jpg');
    background-blend-mode: luminosity;
    background-size: cover;
    background-position: center;
    border: .0625rem solid var(--stat-null);
    height: .3125rem;
    padding: 0 .625rem 0;
    margin: -.625rem -.625rem 0;
    box-sizing: initial;
}

.orange-border.bottom {
    margin: .9375rem -.625rem -1.25rem;
}

.tapered-rule {
    display: block;
    width: 100%;
    height: .3125rem;
    border: none;
    color: var(--stat-main);
    fill: var(--stat-main);
}

.creature-heading {
    margin: 0 0 .625rem;
}

.creature-heading h1 {
    font-family: 'Libre Baskerville', 'Lora', 'Calisto MT', 'Bookman Old Style', Bookman, 'Goudy Old Style', Garamond, 'Hoefler Text', 'Bitstream Charter', Georgia, serif;
    color: var(--stat-main);
    font-size: 1.3125rem;
    line-height: 1.2rem;
    margin: .625rem 0 0;
    letter-spacing: .0625rem;
    font-variant: small-caps;
    font-weight: bold;
}

.creature-heading h2 {
    font-family: 'Noto Sans', 'Myriad Pro', Calibri, Helvetica, Arial, sans-serif;
    font-weight: normal;
    font-style: italic;
    font-size: .75rem;
    line-height: 1.2rem;
    margin: 0;
}

.creature-heading h3 {
  display: inline;
  margin: 0;
  color: var(--stat-main);
  font-size: .875rem;
  line-height: 1.2rem;
  font-weight: normal;
  font-style: italic;
}

.property-line h4,
.property-line p {
    display: inline;
    margin: 0;
    color: var(--stat-main);
    font-size: .78125rem;
    line-height: 1.2rem;
}

.property-line h4 {
    color: var(--stat-acc);
}

.property-line {
    text-indent: -1rem;
    padding-left: 1.1rem;
    line-height: 1.4rem;
}

.property-line.first {
    margin: .5rem 0 0;
}

.property-line.last {
    margin: 0 0 .625rem;
}

.scores {
    text-align: center;
    color: var(--stat-main);
}

.scores>div {
    display: inline-block;
    vertical-align: middle;
    width: 15.5%;
    min-width: 2.5rem;
    font-size: .75rem;
    line-height: 1rem;
}

.scores h4 {
    margin: .625rem 0 .125rem;
    font-size: .875rem;
    line-height: 1.2rem;
    text-transform: uppercase;
    color: var(--stat-acc);
}

.scores p {
    margin: 0 0 .625rem;
    line-height: 1.2rem;
}

.property-block h4,
.property-block p {
    font-size: .78125rem;
    line-height: 1.2rem;
    display: inline;
    margin: 0;
}

.property-block h4 {
    font-style: italic;
}

.property-block {
    padding: .625rem .125rem 0;
}

.legendary {
    padding-top: 0;
}

.legendary h4 {
    padding-left: .125rem;
    font-style: normal;
}

.legendary p {
    font-style: normal;
}

#traits-list-right> :first-child.property-block.legendary {
    /* for a rare edge case where a legendary action is the first item in the second column */
    padding-top: .625rem;
}

.actions h3 {
    border-bottom: .125rem solid var(--stat-acc);
    color: var(--stat-acc);
    font-size: 1.3125rem;
    font-variant: small-caps;
    font-weight: normal;
    letter-spacing: .0625rem;
    margin: 1.25rem 0 0;
    padding: 0 0 .625rem;
    text-indent: .3125rem;
}

.actions {
    margin: 0 0 1.25rem;
}

.actions:last-child {
    margin: 0;
}

.indent {
    text-indent: 1rem;
}

.reverse-indent {
    text-indent: -1rem;
    padding-left: 1rem;
}

.top-stats {
    /* Fix for a weird bug that I can't figure out the cause of */
    margin: 0 0 .625rem;
}

.printableDiv {
  display: grid;
  grid-template-columns: minmax(450px, 1fr) repeat(auto-fit, minmax(450px, 1fr));
  justify-items: center;
  grid-auto-flow: dense;
  row-gap: 50px;
  padding: 50px 0;
}

@media print {
  .printableDiv {
    grid-template-rows: 11in;
    grid-auto-rows: 11in;
    grid-template-columns: repeat(2, 105mm);
    row-gap: 0;
    padding: 0;
  }

  [id^="print-block"] {
      padding-top: 45px;
      break-inside: avoid;
  }

  html {
    font-size: 14px;
  }

  body {
    width: 210mm;
  }
}

[id^="print-block"] h1,
[id^="print-block"] h3,
[id^="print-block"] h4,
[id^="print-block"] ul,
[id^="print-block"] strong,
[id^="print-block"] em,
[id^="print-block"] strong em,
[id^="print-block"] p {
    color: var(--stat-null);
}

[id^="print-block"] h3 {
    border-bottom-color: var(--stat-null);
}

[id^="print-block"] .tapered-rule {
    color: var(--stat-null);
    fill: var(--stat-null);
}

[id^="print-block"] .stat-block,
[id^="print-block"] .enctr-block,
[id^="print-block"] .c-block {
    background: none;
    outline: 0.2rem solid var(--stat-null);
}

[id^="print-block"] .orange-border,
[id^="print-block"] .blue-border {
    display: none;
}
