/*

* Verse, poetry, lyrics
*/

.verse {

text-indent: 0;
margin: 1em 0;

} .verse + p {

text-indent: 0; /* Paragraphs after verse should be flush left */

} ul.verse {

list-style-type: none;
padding: 0;
margin: 1em 0;

} ul.verse li {

text-indent: -2em;
margin-left: 2em;

}

/* Indents for lines of verse. In markdown, add {:.indent-x} to the start of the list item text, e.g. - {:.indent-3}My line of poetry indented 3em */ ul.verse li.indent-1 { margin-left: 3em; } ul.verse li.indent-2 { margin-left: 4em; } ul.verse li.indent-3 { margin-left: 5em; } ul.verse li.indent-4 { margin-left: 6em; } ul.verse li.indent-5 { margin-left: 7em; } ul.verse li.indent-6 { margin-left: 8em; } ul.verse li.indent-7 { margin-left: 9em; } ul.verse li.indent-8 { margin-left: 10em; } ul.verse li.indent-9 { margin-left: 11em; } ul.verse li.indent-10 { margin-left: 12em; } ul.verse li.indent-11 { margin-left: 13em; } ul.verse li.indent-12 { margin-left: 14em; } ul.verse li.indent-13 { margin-left: 15em; } ul.verse li.indent-14 { margin-left: 16em; } ul.verse li.indent-15 { margin-left: 17em; } ul.verse li.indent-16 { margin-left: 18em; } ul.verse li.indent-17 { margin-left: 19em; } ul.verse li.indent-18 { margin-left: 20em; } ul.verse li.indent-19 { margin-left: 21em; } ul.verse li.indent-20 { margin-left: 22em; } ul.verse li.indent-21 { margin-left: 23em; } ul.verse li.indent-22 { margin-left: 24em; } ul.verse li.indent-23 { margin-left: 25em; } ul.verse li.indent-24 { margin-left: 26em; } ul.verse li.indent-25 { margin-left: 27em; } ul.verse li.indent-26 { margin-left: 28em; } ul.verse li.indent-27 { margin-left: 29em; } ul.verse li.indent-28 { margin-left: 30em; } ul.verse li.indent-29 { margin-left: 31em; } ul.verse li.indent-30 { margin-left: 32em; } ul.verse li.indent-31 { margin-left: 33em; } ul.verse li.indent-32 { margin-left: 34em; } ul.verse li.indent-33 { margin-left: 35em; } ul.verse li.indent-34 { margin-left: 36em; } ul.verse li.indent-35 { margin-left: 37em; } ul.verse li.indent-36 { margin-left: 38em; } ul.verse li.indent-37 { margin-left: 39em; } ul.verse li.indent-38 { margin-left: 40em; } ul.verse li.indent-39 { margin-left: 41em; } ul.verse li.indent-40 { margin-left: 42em; } ul.verse li.indent-41 { margin-left: 43em; } ul.verse li.indent-42 { margin-left: 44em; } ul.verse li.indent-43 { margin-left: 45em; } ul.verse li.indent-44 { margin-left: 46em; } ul.verse li.indent-45 { margin-left: 47em; } ul.verse li.indent-46 { margin-left: 48em; } ul.verse li.indent-47 { margin-left: 49em; } ul.verse li.indent-48 { margin-left: 50em; } ul.verse li.indent-49 { margin-left: 51em; } ul.verse li.indent-50 { margin-left: 52em; } ul.verse li.indent-51 { margin-left: 53em; } ul.verse li.indent-52 { margin-left: 54em; } ul.verse li.indent-53 { margin-left: 55em; } ul.verse li.indent-54 { margin-left: 56em; } ul.verse li.indent-55 { margin-left: 57em; } ul.verse li.indent-56 { margin-left: 58em; } ul.verse li.indent-57 { margin-left: 59em; } ul.verse li.indent-58 { margin-left: 60em; } ul.verse li.indent-59 { margin-left: 61em; } ul.verse li.indent-60 { margin-left: 62em; }

/* Verse in a blockquote centres on its longest line, which is best-practice poetry layout */ blockquote.verse {

    color: inherit;
    margin-top: 0;
    width: 100%;
padding: 0;

} blockquote.verse h1, blockquote.verse h2, blockquote.verse h3, blockquote.verse h4, blockquote.verse h5, blockquote.verse h6 {

margin-bottom: 1em;

} blockquote.verse ul {

margin-bottom: 0; /* Already gets its space after from ul.verse */

}

// We originally included this to center poems on their longest line. But on small screens it’s unnecessary. // blockquote.verse { // text-align: center; // } // blockquote.verse ul.verse { // text-align: left; // display: inline-block; // min-width: 51%; // Ensures verses with short lines don’t end up floating side by side // }

/* If verse is in a list, we can preserve line breaks and white space */ ul.verse li {

white-space: pre-wrap;

} ul.verse li h1, ul.verse li h2, ul.verse li h3, ul.verse li h4, ul.verse li h5, ul.verse li h6 {

display: inline; /* To avoid pre-wrap line breaks inside the li */

} ul.verse li h1 { margin-left: -1.75em; } /* Overrides indent applies to .verse li */ ul.verse li h2 { margin-left: -2.25em; } /* Overrides indent applies to .verse li */ ul.verse li h3 { margin-left: -3em; } /* Overrides indent applies to .verse li */ ul.verse li h4 { margin-left: -3.5em; } /* Overrides indent applies to .verse li */ ul.verse li h5 { margin-left: -4.25em; } /* Overrides indent applies to .verse li */ ul.verse li h6 { margin-left: -5em; } /* Overrides indent applies to .verse li */

// If a line is blank it’s an empty list item. That will collapse away by default, so we add blank line back in. ul.verse li:empty {

line-height: 100%; // On screens, this keeps line heights consistent. Don't use this in print where baseline grid is important.

} ul.verse li:empty:after {

content: " ";

}