# Read me Jekyll
. kthxbye
$header : #922610; $h-line : e69a28; $body : #212121; $back : eee5ce; $bar : $h-line;
.stat-block-container {
text-align: center; font-size: 13.5px; line-height: 1.2em; max-width: 100%; * { box-sizing: border-box; max-width: 100%; margin: 0; padding: 0; }
} .stat-block {
text-align: justify; margin: 1.5em 0; display: inline-block; vertical-align: top; min-width: 280px; background: $back; padding: 5px 10px 20px; box-shadow: 0 0 1.5em $body;
} .orange-border {
display: block; background: $bar; border: 1px solid #000; height: 5px; padding: 0 10px 0; margin: -10px -10px 0; box-sizing: initial; &.bottom{ margin: 15px -10px -20px; }
} .tapered-rule {
display: block; width: 100%; height: 5px; border: none; color: $header; fill: $header; stroke: $header;
} .creature-heading {
h1 { font-family: 'Libre Baskerville', serif; color: $header; font-size: 23px; line-height: 1.2em; margin: 10px 0 0; letter-spacing: 1px; font-variant: small-caps; font-weight: bold; } h2 { font-family: 'Noto Sans', sans-serif; font-weight: normal; font-size: 14px; line-height: 1.2em; margin: 0 0 10px; }
}
.property-line {
text-indent: -1em; padding-left: 1.1em; line-height: 1.4em; &.first{ margin: 8px 0 0; } &.last{ margin: 0 0 10px; } h4, p { display: inline; margin: 0; color: $header; font-size: 13.5px; line-height: 1.2em; } h4{ font-family: 'Montserrat', sans-serif; font-variant: normal; color: $header; &:after { content: ':'; } } p { color: black; }
}
.abilities {
text-align: center; color: $header; & > div { display: inline-block; vertical-align: middle; width: 15.5%; min-width: 40px; font-size: 12px; line-height: 1em; } & h4 { font-family: 'Montserrat', sans-serif; margin: 10px 0 2px; font-size: 14px; line-height: 1.2em; text-transform: uppercase; color: $header; } & p { margin: 0 0 10px; line-height: 1.2em; }
}
.property-block {
padding: 10px 2px 0; h4, p{ font-size: 13.5px; line-height: 1.2em; display: inline; margin: 0; } & h4 { font-family: 'Montserrat', sans-serif; font-variant: none; &:after { content: ':'; } }
}
.actions {
margin: 0 0 20px; & h3 { border-bottom: 1px solid $header; color: $header; font-size: 21px; font-variant: small-caps; font-weight: normal; letter-spacing: 1px; margin: 20px 0 0; padding: 0 0 10px; text-indent: 5px; } &:last-child{ margin: 0; }
}
@media screen and (max-width: 575px){
.stat-block { margin: 20px 0; }
}