/*** RESET *******************************************************************/

body { margin: 0; border: none; padding: 0; font-size: 100%; }
main, header, article, aside, section, nav, footer, figure, figcaption { display: block; width: auto; }
main, header, article, aside, section, nav, footer, figure, figcaption,
div, h1, h2, p, img, ul, ol, li, dl, dt, dd,
table, thead, tbody, tfoot, tr, th, td,
form, fieldset, legend, input, label, select, option,
span, em, strong, i, b, address, cite, abbr, kbd, a, a:link, a:active, a:visited,
br { margin: 0; border: none; padding: 0; font: inherit; line-height: 1em; vertical-align: baseline; color: inherit; text-decoration: inherit; }
table { table-layout: auto; border-spacing: 0; border-collapse: collapse; empty-cells: show; }

/*** GENERIC TEXT ************************************************************/

body { font-family: sans-serif; font-weight: 400; }

h1 { font-size: 1.5em; line-height: 1em; margin-bottom: 1em; }
h2 { font-size: 1.25em; line-height: 1.2em; margin-bottom: 1.2em; }
h2 { font-size: 1em; line-height: 1.5em; margin-bottom: 1.5em; }
section > h1 { font-size: 1.25em; line-height: 1.2em; margin-bottom: 1.2em; }
section > section > h1 { font-size: 1em; line-height: 1.5em; margin-bottom: 1.5em; }
p, li, dt, dd { font-size: 1em; line-height: 1.5em; }

p, ul, ol, dl { margin-bottom: 1.5em; }
dd + dt { margin-top: 1.5em; }

ul p, ul ul, ul ol, ul dl,
ol p, ol ul, ol ol, ol dl { margin-bottom: 0em; }

h1, h2 { font-weight: 600; }

ul, ol, dd { padding-left: 1.5em; }
ul, ol { list-style-position: outside; }
ul { list-style-type: disc; }
ul ul { list-style-type: circle; }
ul ul ul { list-style-type: square; }
ol { list-style-type: decimal; }
ol ol { list-style-type: lower-latin; }
ol ol ol { list-style-type: lower-greek; }

a:hover { text-decoration: underline; }
cite, abbr, i { font-style: italic; }
strong, em, b, kbd { font-weight: 600; }

body { color: #444; background-color: #fff; }
a, a:link, a:active, a:visited { color: #26b; }

body { padding: 1em; }

article > img, section > img { display: block; margin: 0 auto 1.5em auto; }

/*** TABLE *******************************************************************/

table { margin: 0 auto 1.5em auto; min-width: 100%; }
th, td { border-width: 1px; border-style: solid; line-height: 1.5em; padding: 0.75em 0.75em 0.75em 0.75em; }
th, td { vertical-align: middle; } /* without vertical-align Firefox computes empty cell height wrong */
th { text-align: center; }
td { text-align: left; }
table { margin-top: -1px; } /* border compensation */
th, td { padding-top: calc(0.75em - 1px); } /* border compensation */

/*** HEADER & FOOTER *********************************************************/

body > header {	font-variant: small-caps; text-transform: lowercase; letter-spacing: 2px; }
body > header > nav > ul { padding-left: 0; }
body > header > nav > ul > li { list-style-type: none; }
body > header > nav.portal-menu { font-size: 0.9em; font-style: italic; }
body > header > nav.portal-menu > ul > li + li { display: none; }
body > header > nav.portal-menu a { color: #9bd; }
body > header > h1 > a, body > header > h1 > a:link, body > header > h1 > a:active, body > header > h1 > a:visited { text-decoration: none; color: inherit; }
body > header > nav.portal-menu ul { margin-bottom: 0em; }
body > header > h1 { margin-bottom: 0.125em; margin-top: 0.125em; }

body > footer { font-size: 0.75em; text-align: center; margin-top: 5em; color: #888; font-variant: small-caps; }
body > footer img.si-logo { padding-bottom: 0.5em; border-bottom: 1px solid #ddd; }
body > footer a, body > footer a:link, body > footer a:active, body > footer a:visited { color: inherit; }

nav.language-menu { position: absolute; right: 20px; top: 20px; font-variant: small-caps; letter-spacing: 2px; font-size: 0.75em; color: #9BD; }
nav.language-menu li { list-style-type: none; text-align: right; margin-bottom: 5px; }

@media all and (min-width: 820px) {
    
    body { padding: 0; margin-top: 50px; margin-bottom: 50px; text-align: center; }
    body > header { margin: 0 auto; }
    body > header > nav.portal-menu { font-size: 1em; }
    body > header > nav.portal-menu > ul > li { display: inline; }
    body > header > nav.portal-menu > ul > li + li { display: inline; margin-left: 1em; }
    body > header > h1 { font-size: 2.5em; font-weight: normal; }
    body > header > nav.application-menu { font-size: 1.25em; }
    body > header > nav.application-menu > ul > li { display: inline; }
    body > header > nav.application-menu > ul > li + li { display: inline; margin-left: 1em; }
    body > main { max-width: 800px; margin: 0 auto; padding: 0; text-align: justify; }

    ul.keyword-index, ul.title-index { column-count: 3; column-gap: 2em; text-align: left; }
    section#abkuerzungsverzeichnis ul { column-count: 3; text-align: left; }
    article.snl p.source-description + p.source-description { padding-left: 6em; padding-right: 6em; }
	
}

/*** FORM ********************************************************************/

form { border: 1px solid #EEE; padding: 1em; text-align: center; margin-bottom: 1.5em; }
form fieldset { display: block; }
form fieldset + fieldset { margin-top: 1em; }
form fieldset > * { display: inline; vertical-align: middle; }
form input.text-field { max-width: 240px; height: 32px; margin: 0px; border: 1px solid #BBB; padding: 2px; /* Opera8 ignores it anyway */ font-size: 20px; line-height: 26px; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
form input.submit-button, form input.options-button, form input.keyboard-button { width: 32px; height: 32px; margin: 2px; border: none; padding: 0; padding-left: 32px; /* works for IE6, but Opera 8 & 9 does it its own way */ font-size: 0px; /* works for FF */ }
form input.key-button { width: 24px; height: 24px; margin: 1px; border: none; padding: 0; color: #FFF; font-size: 16px; vertical-align: bottom; /* for IE 8 and Safari */ }
form input.submit-button { background: url('/snl/search-button.png'); /* IE 7 */ background-image: url('/snl/search-button.png'); }
form select { border: 1px solid #BBB; }
form select + label, form input[type="radio"] + label  { margin-left: .5em; }
form label { margin-right: 0.5em; }
form fieldset#expression-fieldset label { display: none; }
form fieldset#options-fieldset { font-size: 0.75em; }
form.without-options input.options-button { background: url('/snl/options-on-button.png'); /* IE 7 */ background-image: url('/snl/options-on-button.png'); }
form.without-options fieldset#options-fieldset { display: none; }
form.with-options input.options-button { background: url('/snl/options-off-button.png'); /* IE 7 */ background-image: url('/snl/options-off-button.png'); }
form.with-options fieldset#options-fieldset { display: block; }
form.without-keyboard input.keyboard-button { background: url('/snl/keyboard-on-button.png'); /* IE 7 */ background-image: url('/snl/keyboard-on-button.png'); }
form.without-keyboard fieldset#keyboard-fieldset { display: none; }
form.with-keyboard input.keyboard-button { background: url('/snl/keyboard-off-button.png'); /* IE 7 */ background-image: url('/snl/keyboard-off-button.png'); }
form.with-keyboard fieldset#keyboard-fieldset { display: block; }
form input.key-button { background: url('/snl/key-button.png'); /* IE 7 */ background-image: url('/snl/key-button.png'); }

/*** ARTICLE:QUERY-RESULTS ***************************************************/

article.query-results p.message { padding: 0.5em; background-color: #cde; text-align: center; }
article.query-results li { list-style-type: none; }
article.query-results .previous, article.query-results .next { font-variant: small-caps; }
article.query-results .previous { margin-bottom: 0.5em; }
article.query-results .next { margin-top: 0.5em; }
article.query-results .previous::before { content: '« '; }
article.query-results .next::after { content: ' »'; }
article.query-results span.description { font-size: 0.75em;  font-style: italic; }

/*** ARTICLE:SNL ************************************************************/

article.snl p { text-align: left; }
article.snl p.lemma { }
article.snl span.lemmaform { font-weight: bold; font-size: 1.5em; color: #03c; }
article.snl span.formpräzisierung { font-weight: bold; color: #03c; }
article.snl span.angabe { font-style: italic; }
article.snl span.semantik { font-style: italic; }
article.snl span.verweis { color: #26b; }
article.snl dl.beispiele dt { color: #03c; }
article.snl dl.beispiele dd { color: #833; }
article.snl dd + dt { margin-top: 0.5em; }

article.snl dl, article.snl dt, article.snl dd, article.snl section.bedeutung p { margin-bottom: 0.5em; }
article.snl section.bedeutung { margin-bottom: 1.5em; }
article.snl dt + dd, article.snl dt + dt, article.snl dd + dd { margin-top: -0.5em; }
article.snl p.äquivalenz span.wort, article.snl p.äquivalenz span.interpunktion {color: #833; font-weight: bold; }

article.snl footer { margin-top: 3em; padding: 0.5em; background-color: #cde; text-align: center; font-size: 0.75em; }
article.snl footer p { margin-bottom: 0em; text-align: center; }

article.snl a.soblex { font-size: 0; }
article.snl a.soblex::after { content: url('/snl/inflection-link.png'); margin-left: 2px; margin-right: 2px; white-space: nowrap; }
article.snl a.soblex.unavailable::after { content: url('/snl/inflection-link-disabled.png'); margin-left: 2px; margin-right: 2px; white-space: nowrap; }

article.snl section.bedeutung { padding-left: 1.5em; }
article.snl p.bedeutungskopf { background-color: #eee; padding: 0 0.5em; margin-left: -1.5em; }

#expression-text-input-dynamic-list { display: none; }

/*** FLEXTABS WINDOW *********************************************************/

a[data-slkey] { cursor: pointer; }

div#flextabs-window { display: block; position: fixed; top: 0; bottom: 0; left: 0; right: 0; text-align: center; padding: 3em; color: #111; background-color: rgba(255,255,255,0.9); overflow: auto; }
div#flextabs-window section { margin-top: 3em; }
div#flextabs-window section#footnotes p { margin-bottom: .75em; }
div#flextabs-window > header { font-size: 2em; margin-bottom: 1.5em; }
div#flextabs-window > footer { font-size: .75em; margin-top: 4em; margin-bottom: 2em; }
div#flextabs-window a.external-link::before { content: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE2IDE2IiBmaWxsPSIjODA4MDgwIj48cGF0aCBkPSJNIDAgMCBMIDAgMTYgTCAxNiAxNiBMIDE2IDEwIEwgMTUgOSBMIDE1IDE1IEwgMSAxNSBMIDEgMSBMIDcgMSBMIDYgMCBMIDAgMCBaIE0gNyAwIEwgMTAuNSAzLjUgTCA1IDkgTCA3IDExIEwgMTIuNSA1LjUgTCAxNiA5IEwgMTYgMCBMIDcgMCBaIi8+PC9zdmc+Cg=='); display: inline-block; width: 0.75em; margin-right: 0.25em; white-space: nowrap; }
div#flextabs-window dl#properties { display: none; }
div#flextabs-window table { min-width: auto; }
div#flextabs-window th, div#flextabs-window td { border: 1px solid #887; padding: 0.5em; text-align: left; font-weight: normal; overflow: hidden; text-align: left; vertical-align: middle; }
div#flextabs-window th { background-color: #eed; color: #665; }
div#flextabs-window td { background-color: #ffe; }
div#flextabs-window th[colspan], div#flextabs-window td[colspan] { text-align: center; }

#close-flextabs-window { cursor: pointer; font-size: 2em; font-weight: bold; position: absolute; top: 0; right: 0.25em; }

/*** OTHER *******************************************************************/

p#status-message { color: #faa; position: fixed; top: 0; right: 0; margin: 0.25em; background-color: rgba(255, 255, 255, 0.75); padding: 0.1em 0.25em; }
img.book-page { border: 1px solid #666; } 

li.search-example { font-style: italic; }
li.search-example em { font-weight: inherit; background-color: #FF8; }

p.quoted-dictionary-entry { margin-left: 2em; }

@media all and (min-width: 820px) {
	dl.abbreviations { display: grid; grid-template-columns: 3em auto; column-gap: 1em; justify-items: stretch; align-items: start; }
	dl.abbreviations dt { grid-column: 1 / 1; }
	dl.abbreviations dd { grid-column: 2 / 2; }
	dl.abbreviations dt, dl.abbreviations dd { margin: 0; padding: 0; }
}

/*****************************************************************************/