Template:Lyrics/styles.css

.lyricscontainer { margin-right: 30%; padding: 5px 0 5px 10px; } /* For first set of lyrics */ .lyrics1 .mw-collapsible-toggle { /* Toggle button */ margin-top: 9px; margin-right: 15px; font-weight: bold; } .lyrics1 .mw-customtoggle-header { /* Header */ height: 22px; background: none; padding: 5px 7px; margin: 2px 10px 4px; } .lyrics1 .mw-collapsible-content { /* Content */ width: 93%; margin: 10px auto 0; padding: 0 20px 15px; font-size: larger; font-family: 'STIX Two Math', serif; } .lyrics1 .mw-collapsible-content p { font-family: 'STIX Two Math', serif; } /* For second version of lyrics */ .lyrics2 .mw-collapsible-toggle { /* Toggle button */ margin-top:24px; margin-right:15px; font-weight:bold; } .lyrics2 .mw-customtoggle-header { /* Header */ height:22px; background:none; padding:5px 7px; margin:2px 10px 4px; } .lyrics2 .mw-collapsible-content { /* Content */ width:93%; margin:10px auto 0; padding:0 20px 15px; font-size: larger; font-family: 'STIX Two Math', serif; } .lyrics2 .mw-collapsible-content p { font-family: 'STIX Two Math', serif; }

/** Changes for mobile screens **/ @media only screen and (max-width: 500px) { .lyricscontainer { padding: 0; margin: 0; } .lyrics1 .mw-collapsible-content { width:95%; margin:0 15px 10px; padding: 0; font-size: inherit; font-family: inherit; } .lyrics1 .mw-collapsible-content p { font-family: inherit; } .lyrics2 .mw-collapsible-content { width:95%; margin:0 15px 10px; padding: 0; font-size: inherit; font-family: inherit; } .lyrics2 .mw-collapsible-content p { font-family: inherit; } .lyrics2 .mw-collapsible-toggle { margin-top: 9px; } }