html {
    background-image: url(dawn-bkg.jpg);
    background-color: #334477;
    background-size: cover;
    background-position: center 80%;
    background-attachment: fixed;
    color: white;
    padding-bottom: 200px;
    margin: 0px;
}

body {
    width: 45em;
    max-width: 90%;
    margin: 0 auto;
    padding: 0.001em 1em 10em;
}

h1 {
    text-align: center;
    color: yellow;
    font-size: 40pt;
    text-shadow: 0 5px 20px rgba(255,255,0,0.6),
                 0 -5px 20px rgba(255,255,0,0.6);
    margin-bottom: 30px;
    margin-top: 0px;
}

h2 {
    text-align:center;
    text-shadow: 0 0 0.5em black, 0 0 2em #003;
    font-size: 20pt;
}

ul,p.lyrics {
    margin: auto ;
    padding: 0.5em;
    padding-right: 5%;
    background: linear-gradient(to right, 
                               rgba(0,0,0,0.6),
                               rgba(0,0,0,0.4) 60%,
                               rgba(0,0,0,0.01));
}

ul {
    padding-left: 1.5em;
}

li {
    margin-bottom: 0.2em;
}

div.notes {
    box-shadow: 0px 2px rgba(210, 173, 249, 0.2),
                0px 1px rgba(210, 173, 249, 0.2);
}
div.notes p{
    box-shadow: 2px 0px rgba(210, 173, 249, 0.2),
                1px 0px rgba(210, 173, 249, 0.2);
}

a {
    color: #ccf;
}

p,table,pre {
    margin: auto ;
    background: rgba(0,0,0,0.6);
}

p {
    padding: 0.5em;
}

blockquote {
    margin: 0px;
}
blockquote p {
    padding-left: 4em;
    padding-right: 4em;
    background: linear-gradient(to right,
                                rgba(0,0,0,0.6) 0%,
                                rgba(0,0,0,0.6) 2%,
                                rgba(0,0,255,0.6) 3.5%,
                                rgba(0,0,0,0.6) 5%,
                                rgba(0,0,0,0.6) 100%);
}

table {
    border-collapse: collapse;
}

td {
    border: 1px solid #ddd;
    white-space: nowrap;
    padding: 1px 4px;
}

.small {
    font-size: smaller;
}

.header {
    margin-bottom: 3em;
    text-align: center;
}
.header a {
    min-width: 16%;
    background: #313;
    padding-top: 0.5em;
    padding-bottom: 1em;
    margin-right: 5.5%;
    border-bottom-left-radius: 1em;
    border-bottom-right-radius: 1em;
    text-decoration: none;
    text-align:center;
    display: inline-block;
    color: #aee;
    font-weight: bold;
}
.header a:last-child { margin-right: 0; }

a.rawgit {
    text-align: center;
    display: block;
    font-size: 1.25em;
    margin: 1em 0;
    font-family: monospace;
    text-shadow: 0 0 2px black;
}

a.editbutton {
    font-size: smaller;
    background: #314;
    padding: 3px;
    text-decoration: none;
    font-family: monospace;
    margin: 2px;
    border: 1px solid #60a;
    border-radius: 3px;
}

a.editbutton::before {
    content: "\270D";
    font-family: serif;
    font-size: larger;
}

@media (max-width: 600px) {
    body {
        max-width: 95%;
        padding: 0.001em 0.2em 10em;
    }
}
