body {
    background-color: white; 
    color: black;
    text-align: justify;
}

ul {list-style: none}
dt {font-weight: bold}

div.Gedicht {background-color: #D0FFC0}

div.Gedicht p,
div.Gedicht h2 {
    font-style: italic, oblique;
    font-family: cursive, fantasy, serif; 
    margin-left: 3em; 
    text-indent: -3em;
    margin-top: 0.2em;
    margin-bottom: 0.2em;
}

table.image {
    display: table; /* change to inline-table to allow several pictures in a row */
    width: auto;
    text-align: center;
    padding: 5px;
    border: 1px solid black;
}

table.image td {
    text-align: center;
}

/* the following does not work */

/*
body:lang(de) q:lang(de) { quotes: "\201c" "\201d" "\2018" "\2019" } 
body,q {quotes: "\201e" "\201f" "\201a" "\201b" }

q:before { content: open-quote } 
q:after  { content: close-quote } 
*/


/* we use the following simple approach instead */

lang(en) q:before { content: "\201c" } 
lang(en) q:after  { content: "\201d" } 
lang(en) q q:before { content: "\2018" } 
lang(en) q q:after  { content: "\2019" } 

q:before { content: "\201e" } 
q:after  { content: "\201f" } 

q q:before { content: "\201a" } 
q q:after  { content: "\201b" }